@charset "utf-8";
/* CSS Document */
/*******************************************************************************************************************/
/* Small screens */
@media only screen { } /* Define mobile styles */
@media only screen and (max-width: 768px) {
    .contenedor{
        padding: 0px 20px;
    } 
    .txtfrase{
        text-align: center;
        margin-bottom: 40px;
    }
    .txtfrase h2{
        font-size: 2em;
        color: #fff;
        font-weight: 200;
    }
    
    .txtfrase h3{
        font-size: 1em;
        color: #fff;
        font-weight: 200;
    } 
    .bgvid{
        padding: 50px 0px !important;
    }

    .transforma{
        
    }
    .transforma h1{
        font-size: 1.8em;
    }
    .transforma h1 span{
        background-color: #D5A875;
        padding: 8px;
        color: #fff;
    }
    .transforma h2{
        font-size: 1.8em;
        color: #000;
    }
    .transforma h3{
        font-size: 1.3em;
        color: #000;
        font-weight: 200;
    }
    .transforma h2 span{
        color: #D5A875 !important;
    }    
    .tamaniofototrans{
        width: 100%;
    }

    .infointerior{
        text-align: center !important;
    }

    .beneficios{
        text-align: center;
        margin-bottom: 20px;
    }
    .beneficios img{
        width: 80%;
    }

    .colorblack2{
        text-align: center !important;
    }
/*******************************************************************************************************************/   
} 
/*******************************************************************************************************************/
/* Medium screens */
@media only screen and (min-width: 769px) { }
@media only screen and (min-width: 769px) and (max-width: 992px) {
    .contenedor{
        padding: 0px 20px;
    } 
    .txtfrase{
        position: absolute;
        bottom: 50px;
        left: 30px;
        z-index: 100;
        background-color: #0000006c;
        padding: 20px;
    }
    .align1{
        text-align: right;
    }
    .aligelem{
        text-align: right;
    }

    .aligelem img{
        width: 100%;
    }
    .txtfrase h2{
        font-size: 3em;
        color: #fff;
        font-weight: 200;
    }
    
    .txtfrase h3{
        font-size: 2em;
        color: #fff;
        font-weight: 200;
    } 

    .contenedor2{
        margin: 0px auto;
        background-image:url(../img/cositos@4x.png);
        background-size: 100%;
        background-repeat: no-repeat;
        padding: 30px;
        text-align: center !important;
    }

    .transforma{
        
    }
    .transforma h1{
        font-size: 2em;
    }
    .transforma h1 span{
        background-color: #D5A875;
        padding: 8px;
        color: #fff;
    }
    .transforma h2{
        font-size: 2em;
        color: #000;
        padding: 0px 10px;
    }
    .transforma h3{
        font-size: 1.8em;
        color: #000;
        font-weight: 200;
        padding: 0px 10px;
        line-height: 35px;
    }
    .transforma h2 span{
        color: #D5A875 !important;
    }
    .tamaniofototrans{
        width: 90%;
    }
    .margmenos{
        margin-top: -10px;
    }
    .titunosotros{

    }

    .beneficios{
        text-align: left;
    }
    .beneficios img{
        width: 70%;
    }
/*******************************************************************************************************************/  
}
/*******************************************************************************************************************/
/* Medium screens */
@media only screen and (min-width: 993px) { }
@media only screen and (min-width: 993px) and (max-width: 1200px) {
    .contenedor{
        padding: 0px 20px;
    }   
    .txtfrase{
        position: absolute;
        bottom: 0px;
        left: 90px;
        z-index: 100;
        background-color: #0000006c;
        padding: 20px;
    }
    .aligelem{
        text-align: right;
    }
    .align1{
        text-align: right;
    }

    .aligelem img{
        width: 70%;
    }
    .txtfrase h2{
        font-size: 3em;
        color: #fff;
        font-weight: 200;
    }
    
    .txtfrase h3{
        font-size: 2em;
        color: #fff;
        font-weight: 200;
    } 

    .contenedor2{
        width: 800px;
        margin: 0px auto;
        background-image:url(../img/cositos@4x.png);
        background-size: 100%;
        background-repeat: no-repeat;
        padding: 30px;
        text-align: center;
    }

    .transforma{
        padding: 40px;
    }
    .transforma h1{
        font-size: 2.5em;
    }
    .transforma h1 span{
        background-color: #D5A875;
        padding: 8px;
        color: #fff;
    }
    .transforma h2{
        font-size: 2.6em;
        color: #000;
        padding: 0px 10px;
    }
    .transforma h3{
        font-size: 1.8em;
        color: #000;
        font-weight: 200;
        padding: 0px 10px;
        line-height: 35px;
    }
    .transforma h2 span{
        color: #D5A875 !important;
    }

    .tamaniofototrans{
        width: 90%;
    }
    .margmenos{
        margin-top: -76px;
    }
    .beneficios{
        text-align: left;
    }
    .beneficios img{
        width: 70%;
    } 
/*******************************************************************************************************************/  
} 
/*******************************************************************************************************************/
/* Extra Large screens */
@media only screen and (min-width: 1201px) { }
@media only screen and (min-width: 1201px){
    .contenedor{
        padding: 0px 20px;
    }
    .aligelem{
        text-align: right;
    }

    .aligelem img{
        width: 70%;
    }
    .align1{
        text-align: right;
    }

    .txtfrase{
        position: absolute;
        bottom: 0px;
        left: 130px;
        z-index: 100;
        background-color: #0000006c;
        padding: 20px;
    }
    .txtfrase h2{
        font-size: 3em;
        color: #fff;
        font-weight: 200;
    }
    
    .txtfrase h3{
        font-size: 2em;
        color: #fff;
        font-weight: 200;
    }    

    .contenedor2{
        width: 800px;
        margin: 0px auto;
        background-image:url(../img/cositos@4x.png);
        background-size: 100%;
        background-repeat: no-repeat;
        padding: 30px;
        text-align: center;
    }

    .transforma{
        padding: 40px;
    }
    .transforma h1{
        font-size: 2.5em;
    }
    .transforma h1 span{
        background-color: #D5A875;
        padding: 8px;
        color: #fff;
    }
    .transforma h2{
        font-size: 2.6em;
        color: #000;
        padding: 0px 10px;
    }
    .transforma h3{
        font-size: 1.8em;
        color: #000;
        font-weight: 200;
        padding: 0px 10px;
        line-height: 35px;
    }
    .transforma h2 span{
        color: #D5A875 !important;
    }

    .tamaniofototrans{
        width: 90%;
    }

    .margmenos{
        margin-top: -76px;
    }

    .beneficios{
        text-align: left;
    }
    .beneficios img{
        width: 70%;
    }
/******************************************************************************************************************/   
}
/*******************************************************************************************************************/