
.contenido {
    float:left;
    margin-bottom: 140px;
}

.contenedor-tips {
    width: 80%;
    margin: 0 auto;
}
.contenedor-tips h1.estilo_bc {
    font-size: 24px;
}

.contenedor-tips h1{
    font-size: 24px;
    line-height: 29px;
    color: #164695;
    letter-spacing: 0;
    margin: 10px 0 15px;
}

.col-md-12 {
    width: 100%;
    float: left;
}

.col-md-6 {
    float: left;
}

.tips-items {
    width: 260px;
    height: 156px;
    margin: 7px 50px;
    cursor: pointer;
    transition: all .3s ease-in-out;
    margin: 7px 50px 7px 0px;
}

/* .tips-items:hover {
    transform: scale(1.05);
} */

.tips-vishing {
    background: url("../images/tips/vishing.png");
    -webkit-animation-delay: 200ms;
    animation-delay: 200ms;
}

.tips-spoofing {
    background: url("../images/tips/spoofing.png");
    -webkit-animation-delay: 200ms;
    animation-delay: 200ms;
}

.tips-cajeros {
    background: url("../images/tips/cajeros.jpg");
    -webkit-animation-delay: 200ms;
    animation-delay: 200ms;
}

.tips-seguridad {
    background: url("../images/tips/seguridad.jpg");
    -webkit-animation-delay: 300ms;
    animation-delay: 300ms;
}

.tips-info {
    background: url("../images/tips/info.jpg");
    -webkit-animation-delay: 400ms;
    animation-delay: 400ms;
}

.tips-datos {
    background: url("../images/tips/datos.jpg");
    -webkit-animation-delay: 500ms;
    animation-delay: 500ms;
}

.tips-navegacion {
    background: url("../images/tips/navegacion.jpg");
    -webkit-animation-delay: 600ms;
    animation-delay: 600ms;
}

.tips-conservar {
    background: url("../images/tips/conservar.jpg");
    -webkit-animation-delay: 700ms;
    animation-delay: 700ms;
}

.tips-datos-personales-bancarios {
    background: url("../images/tips/osi_mayo_banner_tips_pddatos.png");
    -webkit-animation-delay: 700ms;
    animation-delay: 700ms;
}

.tips-fraudes {
    background: url("../images/tips/osi_mayo_banner_tips_abril.png");
    -webkit-animation-delay: 700ms;
    animation-delay: 700ms;
}

.tips-tallado-tarjeta {
    background: url("../images/tips/osi_tallado_de_tarjeta_mayo.png");
    -webkit-animation-delay: 700ms;
    animation-delay: 700ms;
}

.tips-shoulder-surfing {
    background: url("../images/tips/osi_mayo_banner_tips_febrero.png");
    -webkit-animation-delay: 700ms;
    animation-delay: 700ms;
}

.tips-ingenieria-social {
    background: url("../images/tips/osi_mayo_banner_tips_enero.png");
    -webkit-animation-delay: 700ms;
    animation-delay: 700ms;
}

.tips-formjacking {
    background: url("../images/tips/osi_mayo_banner_tips_diciembre2021.png");
    -webkit-animation-delay: 700ms;
    animation-delay: 700ms;
}
.tips-diving {
    background: url("../images/tips/OSI_Mayo_Banner_Tips_Mayo.png");
    -webkit-animation-delay: 700ms;
    animation-delay: 700ms;
}
.tips-robo-identidad {
    background: url("../images/tips/robo-identidad.png");
    -webkit-animation-delay: 700ms;
    animation-delay: 700ms;
}
.tips-pishing {
    background: url("../images/tips/pishing.png");
    -webkit-animation-delay: 700ms;
    animation-delay: 700ms;
}
.tips-ciber-ocupacion {
    background: url("../images/tips/ciber_ocupacio.png");
    -webkit-animation-delay: 700ms;
    animation-delay: 700ms;
}
.tips-spyware {
    background: url("../images/tips/bancoppel-spyware.png") 0 0 no-repeat;
    -webkit-animation-delay: 700ms;
    animation-delay: 700ms;
}
.tips-caller-id-spoofing {
    background: url("../images/tips/caller_spoofing.png") 0 0 no-repeat;
    -webkit-animation-delay: 700ms;
    animation-delay: 700ms;
}

.tips-ciberdelincuentes {
    background: url("../images/tips/ciberdelincuentes.png") 0 0 no-repeat;
    -webkit-animation-delay: 700ms;
    animation-delay: 700ms;
}

.tips-datos-financieros {
    background: url("../images/tips/finalosi_mg_enero_banner_tips_abril.png") 0 0 no-repeat;
    -webkit-animation-delay: 700ms;
    animation-delay: 700ms;
}

.tips-smurfing {
    background: url("../images/tips/smurfing-escritorio.png") 0 0 no-repeat;
    -webkit-animation-delay: 700ms;
    animation-delay: 700ms;
}

.tips-clonar-celular {
    background: url("../images/tips/clonar-celular-escritorio.png") 0 0 no-repeat;
    -webkit-animation-delay: 700ms;
    animation-delay: 700ms;
}

.tips-protege-tus-contraseñas {
    background: url("../images/tips/protege-tus-contrasena-escritorio.png") 0 0 no-repeat;
    -webkit-animation-delay: 700ms;
    animation-delay: 700ms;
}

.tips-datos-seguros {
    background: url("../images/tips/manten_datos_seguros_escritorio.png") 0 0 no-repeat;
    -webkit-animation-delay: 700ms;
    animation-delay: 700ms;
}

.tips-llamada-fraudulenta {
    background: url("../images/tips/llamadas_fraudulentas_escritorio.png") 0 0 no-repeat;
    -webkit-animation-delay: 700ms;
    animation-delay: 700ms;
}

.tips-llamada-mensajes-sms-no-deseados {
    background: url("../images/tips/llamadas-correos-sms-no-deseados-escritorio.png") 0 0 no-repeat;
    -webkit-animation-delay: 700ms;
    animation-delay: 700ms;
}
.tips-claves-un-solo-uso {
    background: url("../images/tips/claves_un_solo_uso_escritorio.png") 0 0 no-repeat;
    -webkit-animation-delay: 700ms;
    animation-delay: 700ms;
}
.tips-evita-engaños-por-internet {
    background: url("../images/tips/evita_enganos_por_internet_escritorio.png") 0 0 no-repeat;
    -webkit-animation-delay: 700ms;
    animation-delay: 700ms;
}

.tips-fabricacion-contenido-digital {
    background: url("../images/tips/tips_fabricacion_contenido_digital_escritorio.png") 0 0 no-repeat;
    -webkit-animation-delay: 700ms;
    animation-delay: 700ms;
}

.tips-qr-escritorio {
    background: url("../images/tips/qr_desk.jpg") 0 0 no-repeat;
    -webkit-animation-delay: 700ms;
    animation-delay: 700ms;
}



@media screen and (max-width: 1023px) {
    .contenido {
        width: 100%;
        float: left;
        box-sizing: border-box;
        margin-bottom: 30px;
        padding: 0 !important;
    }
    .contenedor-tips {
        width: 100%;
    }
    .contenedor-tips h1{
        margin: 35px 10px 22px 10px;
    }
    .col-md-12, .col-md-6 {
        float: none;
    }
    .tips-items {
        margin: 10px auto;
    }
}

@media screen and (max-width: 599px) {
    .tips-items {
        width: 320px;
        height: 60px;
        margin: 20px;
    }
    .tips-vishing {
        background: url("../images/tips/movil-vishing.png");
       

    }
    
    .tips-spoofing {
        background: url("../images/tips/movil-spoofing.png");
       
    
    }
    
    .tips-cajeros {
        background: url("../images/tips/cajeros.jpg");
       
 
    }
    
    .tips-seguridad {
        background: url("../images/tips/seguridad.jpg");
     
    
    }
    
    .tips-info {
        background: url("../images/tips/info.jpg");
       
     
    }
    
    .tips-datos {
        background: url("../images/tips/datos.jpg");
        
    
    }
    
    .tips-navegacion {
        background: url("../images/tips/navegacion.jpg");
      
   
    }
    
    .tips-conservar {
        background: url("../images/tips/conservar.jpg");
       
    
    }
    
    .tips-datos-personales-bancarios {
        background: url("../images/tips/1_datos_personales_movil.png");
       
    
    }
    
    .tips-fraudes {
        background: url("../images/tips/2_evitar_fraudes_movil.png");
       
      
    }
    
    .tips-tallado-tarjeta {
        background: url("../images/tips/3_tallado_de_tarjeta_mayo_movil.jpg");
       
     
    }
    
    .tips-shoulder-surfing {
        background: url("../images/tips/4_shoulder_surfing_movil.png");
      
    }
    
    .tips-ingenieria-social {
        background: url("../images/tips/5_ingenieria_social_movil.png");
      
        
    }
    
    .tips-formjacking {
        background: url("../images/tips/6_formjacking_movil.png");
       
     
    }
    
    .tips-diving {
        background: url("../images/tips/OSI_Mayo_B Movil_Tips_Mayo.png");
    }
    .tips-robo-identidad {
        background: url("../images/tips/robo-identidad-movil.png");
    }
    .tips-pishing {
        background: url("../images/tips/pishing-movil.png");
    }
    .tips-ciber-ocupacion {
        background: url("../images/tips/ciber_ocupacion_movil.png");
    }
    .tips-spyware {
        background: url("../images/tips/bancoppel-spyware-movil.png");
    }
    .tips-caller-id-spoofing {
        background: url("../images/tips/caller_spoofing-movil.png");
    }
    .tips-ciberdelincuentes {
        background: url("../images/tips/ciberdelincuentes_movil.png");
    }

    .tips-datos-financieros {
        background: url("../images/tips/finalosi_mg_enero_movil_tips_abril.png");
    }

    .tips-smurfing {
        background: url("../images/tips/smurfing-movil.png");
    }

    .tips-clonar-celular {
        background: url("../images/tips/clonar-celular-movil.png");
    }
    .tips-protege-tus-contraseñas {
        background: url("../images/tips/protege-tus-contrasena-escritorio-movil.png");
    }
    .tips-datos-seguros {
        background: url("../images/tips/manten_datos_seguros_movil.png");
    }
    .tips-llamada-fraudulenta {
        background: url("../images/tips/llamadas_fraudulentas_movil.png");
    }
    .tips-llamada-mensajes-sms-no-deseados {
        background: url("../images/tips/llamadas-correos-sms-no-deseados-movil.png");
    }
    .tips-claves-un-solo-uso {
        background: url("../images/tips/claves_un_solo_uso_movil.png");
    }
    .tips-evita-engaños-por-internet {
        background: url("../images/tips/evita_enganos_por_internet_movil.png");
    }
    .tips-fabricacion-contenido-digital {
        background: url("../images/tips/tips_fabricacion_contenido_digital_movil.png");
    }
    
    .tips-qr-escritorio {
        background: url("../images/tips/qr_movil.jpg");
    }
    

}

@-webkit-keyframes zoomIn {
    from {
        opacity: 0;
        -webkit-transform: scale3d(0.3, 0.3, 0.3);
        transform: scale3d(0.3, 0.3, 0.3);
    }

    50% {
        opacity: 1;
    }
}

@keyframes zoomIn {
    from {
        opacity: 0;
        -webkit-transform: scale3d(0.3, 0.3, 0.3);
        transform: scale3d(0.3, 0.3, 0.3);
    }

    50% {
        opacity: 1;
    }
}

.zoomIn {
    -webkit-animation-name: zoomIn;
    animation-name: zoomIn;
}

.animated {
    -webkit-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
}
