/* escritorio____________________*/

.imagen-principal {
    height: 800px;
    background-image: url(../images/5elementos_clave_00_entrada.gif);
    
}
.carrusel {
    grid-column: 3/11;
    width: 800px;
    height: 600px;
}
.carrusel img {
    margin: auto;
}
.principal {
    margin-top: 100px;
}

.bg-dual1 {
    background: linear-gradient(180deg, #edde3e 0%, #edde3e 50%, #ffffff 50%, #ffffff 100%);
}

.bg-dual2 {
    background: linear-gradient(180deg, #d4d2c8 0%, #d4d2c8 50%, #ffffff 50%, #ffffff 100%);
}

.bg-dual3 {
    background: linear-gradient(180deg, #e3dd3f 0%, #e3dd3f 50%, #ffffff 50%, #ffffff 100%);
}

.bg-dual4 {
    background: linear-gradient(180deg, #a8a3d2 0%, #a8a3d2 50%, #ffffff 50%, #ffffff 100%);
}

.bg-dual5 {
    background: linear-gradient(180deg, #99b3a2 0%, #99b3a2 50%, #ffffff 50%, #ffffff 100%);
}

.titulo {
    grid-column: 2/11;
    margin-top: 12px;
}

.foto {
    grid-column: 2/12;
}

.chip3c {
    grid-column: 3/5;
    margin-top: 12px;
}

.texto {
    grid-column: 6/11;
    margin-top: 12px;
}

.tip {
    grid-column: 3/11;
}

.globo {
    grid-column: 11/13;
    width: 80px;
    margin: auto;
    animation: globo 9s linear infinite alternate-reverse;
}
@keyframes globo {
    0%{
        transform: translateY(0px) translateX(0px) scale(1, 1) rotate(0);
    }
    25% {
        transform: translateY(-50px) translateX(20px) scale(1, 1.05) rotate(5deg);
    }
    50% {
        transform: translateY(-100px) translateX(0px) scale(1, 1.1) rotate(0deg);
    }
    75% {
        transform: translateY(-150px) translateX(-20px) scale(1, 1.15) rotate(-5deg);
    }
    100% {
        transform: translateY(-200px) translateX(0px) scale(1, 1.2) rotate(0deg);
    }    
}







/* responsive _________________ */
@media (max-width:768px){
    .titulo {
        grid-column: 1/-1;
        margin-top: 12px;
    }
    
    .foto {
        grid-column: 1/-1;
    }
    
    .chip3c {
        grid-column: 1/-1;
        margin-top: 12px;
    }
    
    .texto {
        grid-column: 1/-1;
        margin-top: 12px;
    }
    
    .tip {
        grid-column: 1/-1;
        padding: 12px;
    }
  
   
}



/*Resoluciones mayores a 1200 */
@media screen and (min-width: 1200px) {


}