@charset "utf-8";

body{
    margin:0;
    padding: 0;
    
}

#total{
    margin: 0;
    padding: 0;
    width: 100%;
    height: auto;
   display: block;
    background-color: #fff;
    overflow-x: hidden;
  
}

#bannerInicio{
    
    overflow: visible;
    margin: 0 auto 0 auto;


}
#bannerInicioconte{
    width: 100%;
    background-color: #2e3544;
    display: flex;
    background-image: url("img/banner-poster.png");
    background-position: center;
    background-repeat: repeat-y;
    

}

#videobanner {
    /* override other styles to make responsive */
    width: 100%    !important;
    height: auto   !important;
    pointer-events: none;
  }


/*////////MENU CHICO ///////*/

#menuchico{
    width: 100%;
    height: 50px;
    background-color:#2e3544 ;
    position: fixed;
    display: flex;
    margin: 0;
}

.botmenuchico{
    width: auto;
    /*background-color:#2e3544 ;*/
    margin: auto;
    display: block;
    height: 50px;
    float: left;
}

.botmenuchicoproductos{
    width: auto;
    /*background-color:#2e3544 ;*/
    margin: auto;
    display: block;
    height: 50px;
    float: left;
}

.botmenuchico a{
    font-family: 'Nunito Sans', sans-serif;
    font-size: 30px;
    color: #a2aabb;
    text-decoration: none;   
}

.botmenuchico a:hover{
    font-family: 'Nunito Sans', sans-serif;
    font-size: 30px;
    color: #ffffff;
    text-decoration: none;
}

.botmenuchicoproductos a{
    font-family: 'Nunito Sans', sans-serif;
    font-size: 30px;
    color: #a2aabb;
    text-decoration: none;   
}

.botmenuchicoproductos a:hover{
    font-family: 'Nunito Sans', sans-serif;
    font-size: 30px;
    color: #ffffff;
    text-decoration: none;
}


#submenuchico{
    width: 100%;
    position: relative;
    overflow: visible;
    visibility: hidden;
}

.botsubmenuchico{
    width: 100%;
    background-color:#475161 ;    
    display: flex;
    height: 50px;
}

.botsubmenuchico a{
    font-family: 'Nunito Sans', sans-serif;
    font-size: 20px;
    color: #a2aabb;
    text-decoration: none;  
    padding: 10px; 
}

.botsubmenuchico a:hover{
    font-family: 'Nunito Sans', sans-serif;
    font-size: 20px;
    color: #ffffff;
    text-decoration: none;
}




#menuconte{
    position: fixed;
    width: 100%;
    height: 100%;
    text-align: center;
    /*background-color: #9cbd25;*/
    pointer-events:auto;
    visibility: hidden;
    
    

}


/*///////     MENU   JS  /////////////*/

.menufranja{
    width: 25%;
    height: 100%;
    float: left;
    margin: 0;
    
    
    
}

.menufranja embed{
    width: 100%;
    height: 100%;
    float: left;
    margin: 0;
   
    
    
   
    
    
    
}

#botabrirmenu{
    width: 100%;
    height: 80px;
    position: fixed;
    margin: 0 0 0 auto;
    z-index: 1;
    background-image: url("img/logo-inicio.jpg");
    background-repeat: no-repeat;
    background-color: #2e3545;
    

}

#botabrirmenu a{
    float:right;
    display: block;
    
    
    
    
}

#botabrirmenu a img{
    height: 80px;
    
    
    
}



#franjaconte1{
    width: 100%;
    height: 100%;
    background-color: #262c38;
    font-family: 'Nunito Sans', sans-serif;
    font-size: 20px;
    color: #ffffff;
    padding: 0;
    overflow: hidden;
    
    
    

}


#franjaconte2{
    width: 100%;
    height: 100%;
    background-color: #2e3544;
    font-family: 'Nunito Sans', sans-serif;
    font-size: 20px;
    color: #ffffff;
    padding: 0;
    overflow: hidden;
    

}
#franjaconte3{
    width: 100%;
    height: 100%;
    background-color: #262c38;
    font-family: 'Nunito Sans', sans-serif;
    font-size: 20px;
    color: #ffffff;
    padding: 0;
    overflow: hidden;
    

}
#franjaconte4{
    width: 100%;
    height: 100%;
    background-color: #2e3544;
    font-family: 'Nunito Sans', sans-serif;
    font-size: 20px;
    color: #ffffff;
    padding: 0;  
    overflow: hidden;
    

}

.franjacontelink{
    display: block;
    width: 100%;
    height: 100%;
    line-height: 100%;
    text-decoration: none;
    color: white;
}

.franjacontelink p{
    margin: 0;
    
    padding: 120%  0 0 15%;
}

#fondomovil{
    width: 100%;
    height: 100%;
    background-image:url("img/bkg-franjamenu.png");
    background-color: #e66b33;
    background-size: 100%;
    background-position: top;
    background-repeat: no-repeat;
    font-family: 'Nunito Sans', sans-serif;
    font-size: 16px;
    line-height: 30px;
    color: #ffffff;
    
   
}

#fondomovil p{
    margin: 0 0 30px 0;
    
    padding: 110%  0 0 15%;
}

#fondomovil p a{
    color: #fff;
    text-decoration: none;
}
#fondomovil2{
    width: 100%;
    height: 100%;
    background-image:url("img/bkg-franjamenu2.png");
    background-color: #e66b33;
    background-size: 100%;
    background-position: top;
    background-repeat: no-repeat;
   
}

/*///////   MENU    ////////*/

#menu{
    margin-left: -100%;
    margin-right: -100%;
    overflow: visible;
    
    
}

#botmenu{
    
    height: 80px;
    width: 100%;
    background-color: #72ac35;
    position: fixed;
    pointer-events:auto;
    display: block;
    
}

#botmenu:hover{
    
    height: 80px;
    width: 100%;
    background-color: #ca04b0;
    position: fixed;
    
}




/*///////     HOME      //////*/


.text-overflow-center {
    
    text-align: center;
}


#banner{
    margin: 0 auto 0 auto;
    overflow: visible;
}

#titular{
    width: 70%;
    margin: 0 auto 70px auto;
    padding: 0;
    background-color: #fff;
    display: block;
    
}

.titulo0{
    font-family: 'Nunito Sans', sans-serif;
    font-size: 40px;
    color: #a2aabb;
    margin: 70px auto 25px auto;
    width: 100%;
    
    line-height: 46px;
    padding: 0 0 30px 0 ;
    font-weight: 100;
}


.titulo1{
    font-family: 'Nunito Sans', sans-serif;
    font-size: 40px;
    color: #a2aabb;
    margin: 100px auto 50px auto;
    max-width: 900px;
    
    line-height: 46px;
    padding: 0 10% 0 0 ;
    font-weight: 100;
}

.titulo1b{
    font-family: 'Nunito Sans', sans-serif;
    font-size: 40px;
    color: #a2aabb;
    margin: 100px auto 50px auto;
    max-width: 900px;
    
    line-height: 46px;
    padding: 0 0 0 10% ;
    font-weight: 100;
}

.titulo2{
    font-family: 'Nunito Sans', sans-serif;
    font-size: 40px;
    color: #a2aabb;
    margin: 0 0 50px 0;
    line-height: 46px;
    padding: 0 0 30px 0 ;
    font-weight: 100;
}

.titulo3{
    font-family: 'Nunito Sans', sans-serif;
    font-size: 40px;
    color: #a2aabb;
    margin: 100px 0 50px 0;
    background-image: url("img/bkg-titular1.png");
    background-position: left bottom;
    background-repeat: no-repeat;
    
    line-height: 45px;
    padding: 0 0 30px 0 ;
    font-weight: 100;
}

.titulo3WBA{
    color: #72ac35;
    font-weight: bold;
}


.titulogrande{
    font-family: 'Nunito Sans', sans-serif;
    font-size: 60px;
    color: #a2aabb;
    margin: 100px auto -80px auto;
    max-width: 900px;
    
    line-height: 46px;
    padding: 0 10% 0 0 ;
    font-weight: bold;
}

#titular p{
    font-family: 'Nunito Sans', sans-serif;
    font-size: 21px;
    color: #2e3544;
    padding: 0;
    margin: 0 0 -50px 0;
    width: 100%;
}

#banner2{
    
    margin: 0 auto 0 auto;
    overflow:hidden;
    display: block;
    padding: 0;
    background-color: #e66b33;

}

#banner2img{
    background-image: url("img/banner2circ.png");
    background-position: center;
    width: 400px;
    height: 400px;
    margin: 0 auto 0 auto;
    padding: 0;

}

#banner2conte{
    width: 100%;
    height: 400px;
    padding: 0 0 80px 0;
    background-image: url("img/banner2bkg.png");
}

#banner2txt{
    width: 100%;
    padding: 0 0 120px 0;
    margin: -70px 0 0 0;
    background-color:#e66b33;
    font-size: 40px;
    font-family: 'Nunito Sans', sans-serif;
    font-weight: 300;
    text-align: center;
    color: #fff;
    height: auto;
    overflow:visible;

}

#iniciosec1{
    width: 100%;
    height: auto;
    margin: 0;
    padding: 0;
    background-color: #fff;
    align-content: center;
    clear: both;
    


}

#iniciosec1txt{
    float: left;
    padding: 0 0;
    width: 40%;
    margin: 0 5% 0 5%;
    display: block;
}

#iniciosec1txt p{
    max-width: 900px;
    font-family: 'Nunito Sans', sans-serif;
    font-size: 21px;
    color: #2e3544;
    padding: 0 10% 0 0;
    margin: 0 auto 70px auto;
}

#iniciosec1graf{
    float: left;
    margin: 50px 0 0 0;
    padding: 0;
    width: 50%;
    min-width: 600px;
    display: block;
    text-align: center;
    
    
}

#iniciosec1graf img{
    margin: 0 0 0 15%;
    padding: 0; 
    width: 600px;
    height: 514px;
  
}



#inicio2{
    width: 100%;
    height:auto;
    margin: 0;
    padding: 0;
    background-color: #e1ebf4;
    align-content: center;
    clear: both;
    overflow-y: auto;
    overflow-x: hidden;

    
    


}

#inicio2txt{
    float: left;
    padding: 0;
    width: 40%;
    display: block;
    margin: 0 5% 0 5%;

}

#inicio2txt p{
    max-width: 900px;
    font-family: 'Nunito Sans', sans-serif;
    font-size: 21px;
    color: #2e3544;
    padding: 0  0 0 10%;
    margin: 0 auto 70px auto;

}

#inicio2graf{
    float: right;
    margin: 50px  0 0 0;
    padding: 0;
    width: 50%;
    min-width: 600px;
    display: block;
    text-align: center;
    
    
}


#inicio2graf img{
    margin: 0 15% 0 0;
    padding: 0;
    width: 600px;
    height: 514px;
    

    

    
}

#inicio3{
    width: 100%;
    padding: 100px 0 0 0;
    background-color:#e66b33;
    font-size: 60px;
    font-family: 'Nunito Sans', sans-serif;
    font-weight: 300;
    text-align: center;
    color: #fff;
    height: auto;
    overflow:visible;
    clear: both;
    
}



/*#inicio3 img{
 margin: 80px 0 0 0;
}*/
#inicio3-graf4-conte{
    width: 100%;
    height: 150px;
    margin: 100px auto 0 auto;
    background-image: url("img/inicio-graf4.png");
    background-position: center;
    display: block;

}

#inicio3-graf5-conte{
    width: 100%;
    min-height: 150px;
    margin: 200px auto 0 auto;
    background-image: url("img/inicio-graf5.png");
    background-repeat: no-repeat;
    background-position: center;
    background-color:#d45c28;
    display: block;

}

 #inicio3b {
    width: 100%;
    padding: 50px 0 0 0;
    background-color:#d45c28;
    font-size: 40px;
    font-family: 'Nunito Sans', sans-serif;
    font-weight: 300;
    text-align: center;
    color: #fff;
    height: auto;
    overflow:visible;
    
}
#inicio3b img{
    margin: 80px 0 0 0;
   }

#inicio3btxtconte{

    margin: 0 auto 0 auto;
    
    display: flex;

    

}
.inicio3btxt1{
    width: 350px;
    margin: 0 0 0 auto;   
    float: left;
    font-size: 24px;
    font-family: 'Nunito Sans', sans-serif;
    font-weight: 300;
    text-align: center;
    color: #fff;
    display: block;
 

    
}

.inicio3btxt2{
    width: 350px;
    margin: 0 ;   
    float: left;
    font-size: 24px;
    font-family: 'Nunito Sans', sans-serif;
    font-weight: 300;
    text-align: center;
    color: #fff;
    display: block;

 
    
}

.inicio3btxt3{
    width: 350px;
    margin: 0 auto 0 0 ;   
    float: left;
    font-size: 24px;
    font-family: 'Nunito Sans', sans-serif;
    font-weight: 300;
    text-align: center;
    color: #fff;
    display: block;


    
}

#inicio3c {
    width: 100%;
    padding: 50px 0 0 0;
    background-color:#d45c28;
    font-size: 40px;
    font-family: 'Nunito Sans', sans-serif;
    font-weight: 300;
    text-align: center;
    color: #fff;
    height: auto;
    overflow:visible;
    ;
}
#inicio3ctxtconte{
    width: 100%;
    min-height: 200px;
    margin: 0 auto 0 auto;
    display: flex;

    overflow:visible;

    

}


#inicio4 {
    width: 100%;
    padding: 50px 0 40px 0;
    background-color:#e66b33;
    font-size: 40px;
    font-family: 'Nunito Sans', sans-serif;
    font-weight: 300;
    text-align: center;
    color: #fff;
    height: auto;
    overflow:visible;
    
}
#inicio4ctxtconte{
    width: 57%;
    max-width: 1200px;
    
    margin: 0 auto 0 auto;
    text-align: center;
    font-size: 24px;
    font-family: 'Nunito Sans', sans-serif;
    font-weight: 300;
    background-color:#e66b33;
    color: #fff;
    overflow:visible;
    
    padding: 40px 0 40px 0;

    

}

/*//// ANALYTICS ////////////////*/

#inicio5{
    width: 100%;
    height: auto;
    margin: 0;
    padding: 0;
    background-color: #e1ebf4;
    align-content: center;
    overflow: auto;
    
    


}

#inicio5txt{
    float: right;
    padding: 0 0;
    width: 40%;
    margin: 0 5% 0 5%;
    display: block;
}

#inicio5txt p{
    max-width: 900px;
    font-family: 'Nunito Sans', sans-serif;
    font-size: 21px;
    color: #2e3544;
    padding: 0 10% 0 0;
    margin: 0 auto 70px auto;
}

#inicio5graf{
    float: left;
    margin: 50px 0 0 0;
    padding: 0;
    width: 50%;
    min-width: 600px;
    display: block;
    text-align: center;
    
    
}

#inicio5graf img{
    margin: 0 0 0 15%;
    padding: 0;
    
    width: 600px;
    height: 514px;
    
    
}




/*////CONTACTO/////*/

#contacto{
    width: 100%;
    background-color: #2a303f;
    display: flex;
    padding: 0 0 50px 0;
    overflow:visible;

}


#contactoconte{
    width: 70%;
    margin: 0 auto 0 auto;
    

}

.titulocontacto{
    font-family: 'Nunito Sans', sans-serif;
    font-size: 40px;
    color: #94a5bd;
    margin: 100px 0  40px 0;
    height: 90px;
    padding: 0;
    font-weight: 400;
    
    display:block;
}

.contactolinks{
    
    margin: 0 100px 0 0;
    float: left;
    font-size: 17px;
    font-family: 'Nunito Sans', sans-serif;
    color: #fff;
    
    align-items: center;
}


    
    

.contactolinks a{
    float: left;

    font-size: 17px;
    font-family: 'Nunito Sans', sans-serif;
    text-decoration: none;
    color: #fff;
    vertical-align: middle;
    
}

.contactolinks a:hover{
    float: left;

    font-size: 17px;
    font-family: 'Nunito Sans', sans-serif;
    text-decoration: none;
    color: #94a5bd;
    vertical-align: middle;
    
}
.contactolinks a img{ 
    float: left;
    outline: none;
    margin: 0 20px 100px 0;
    vertical-align: middle;
}

.contactolinks a:hover img{ 
    float: left;
    outline: none;
    margin: 0 20px 100px 0;
    vertical-align: middle;
}
.agenda{
    font-family: 'Nunito Sans', sans-serif;
    font-size: 24px;
    color: #96a3b8;
    margin: 30px 0 0 0;
    line-height: 60px;
}

#formcontacto{
    width: 100%;
    margin: auto 0 auto 0;
    padding: 0;
    /*background-color: aqua;*/
  

}

.formtextfield{
    margin: 10px 0 10px 0;
    width: 100%;
    padding: 5px 10px 5px 10px;
    height: 60px;
    border: none;
    font-size: 20px;
    font-family: 'Nunito Sans', sans-serif;
    color: #96a3b8;
    border-radius: 8px;
    -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
    -moz-box-sizing: border-box;    /* Firefox, other Gecko */
    box-sizing: border-box;
    
}

#formleft{
    width: 48%;
    margin: 0 5%  0 0;
    float: left;
    
}
#formright{
    width: 47%;
    margin: 0 ;
    float: left;
    
}
#enviar{
    width: 100%;
    height: 60px;
    padding: 0;
    margin: 20px 0 0 0;
    border: none;
    background-color: #d45c28;
    font-size: 24px;
    font-family: 'Nunito Sans', sans-serif;
    color: #fff;
    border-radius: 8px;

}

#respuesta{
    width: 100%;
    height: auto;
    
}

#respuestaleft{
    width: 50%;
    height: 400px;
    float: left;
}

#respuestaleft p{
    font-family: 'Nunito Sans', sans-serif;
    font-size: 24px;
    color: #96a3b8;
    margin: 30px 0 0 0;
    line-height: 30px;
    margin: 150px 0 0 15%;
}

#respuestaright{
    width: 50%;
    height: 400px;
    float: right;
    background-color:#2a303f;
}

#respuestaright img{
    margin: 100px;
}

#footerlegal{
    
    background-color:#2a303f;
    width: 100%;
    height: auto;
    padding: 0 0 50px 0;
   
}

#footerlegal p{
    font-family: 'Nunito Sans', sans-serif;
    font-size: 14px;
    line-height: 30px;
    color: #96a3b8;
    width: 70%;
    margin: 0 auto 0 auto;
    padding: 0;

}



/***********PRODUCTOS*/

#headerproductosfondo{

    width: 100%;
    height: 465px;
    background-image: url("img/header-productos-bkg.png");
    background-repeat: repeat-x;
}

#headerproductos{
    width: 100%;
    height: 465px;
    background-image: url("img/header-productos-esquina.png");
    background-repeat: no-repeat;
    background-position: left;
    text-align: center;
    
}

.tituloproductos{
    font-family: 'Nunito Sans', sans-serif;
    font-size: 40px;
    color: #ffffff;
    margin: 0;
    padding: 0;
    font-weight: lighter;
}

#headerproductos img{
    outline: none;
    margin: 180px 0 0 0;
}



/*///////////CHATBOT///////////*/

.titulochatbotsconte {
    width: 100%;
    height: 136px;
    background-image: url("img/bkg-titulochatbots.png");
    background-position: bottom;
    background-repeat: repeat-x;
    text-align: center;
    margin: 85px 0 0 0;

}

.titulochatbotsconte2 {
    width: 100%;
    height: 136px;
    background-image: url("img/bkg-titulochatbots-2.png");
    background-position: bottom;
    background-repeat: repeat-x;
    text-align: center;
    margin: 85px 0 0 0;

}

.titulochatbotstxt {
    width:fit-content;
    margin: 80px auto 0 auto;
    font-family: 'Nunito Sans', sans-serif;
    font-size: 40px;
    color: #475161;
    padding: 0;
    font-weight: 400;
    background-image: url("img/bkg-titulochatbotstxt.png");
    background-position: bottom;
    background-repeat: repeat-x;
    line-height: 136px;
    display: block;

}


/*///////WATSAPP/////*/

/*#chatbot3{
    width: 100%;
    height:auto;
    margin: 0;
    padding: 0;
    align-content: center;
    clear: both;
    overflow-y: auto;
    overflow-x: hidden;
    background-color: #d45c28;

}

#chatbot3txt{
    float: left;
    padding: 0;
    width: 40%;
    display: block;
    margin: 0 5% 0 5%;

}

#chatbot3txt p{
    max-width: 900px;
    font-family: 'Nunito Sans', sans-serif;
    font-size: 28px;;
    padding: 0  0 0 10%;
    margin: 0 auto 70px auto;
    color: #ffffff;
    

}


#chatbot3graf{
    float: right;
    margin: 50px  0 0 0;
    padding: 0;
    width: 50%;
    min-width: 600px;
    display: block;
    text-align: center;
    
    
}

#chatbot3graf img{
    margin: 0 15% 0 0;
    padding: 0;
    width: 600px;
    height: 514px;

    
}*/

#chatbot1{
    width: 100%;
    height:auto;
    margin: 0;
    padding: 0;
    align-content: center;
    clear: both;
    overflow-y: auto;
    overflow-x: hidden;
    
    background-color: #f0f0f0;
    
    
}





#chatbot1b{
    
    width: 100%;
    height: auto;
    margin: 0;
    padding: 0;
    background-color: #2e3544;
    align-content: center;
    clear: both;
    overflow: visible;
    
}


#chatbot1txt{
    
    float: left;
    padding: 0;
    width: 40%;
    display: block;
    margin: 0 5% 0 5%;

}

#chatbot1btxt{
    width: 70%;
   
    margin: 0 auto 0 auto;
    padding: 70px 0 80px 0 ;
    
    display: block;

}
.azul{
    max-width: 900px;
    font-family: 'Nunito Sans', sans-serif;
    font-size: 21px;;
    padding: 0  0 0 10%;
    margin: 110px auto 70px auto;
    color: #2e3544;
    
}

.blanco{
    font-family: 'Nunito Sans', sans-serif;
    font-size: 21px;
    color: #ffffff;
    padding: 0;
    margin: 0;
}

#chatbot1graf{
    float: right;
    margin: 50px  0 0 0;
    padding: 0;
    width: 50%;
    min-width: 600px;
    display: block;
    text-align: center;
    
    
}

#chatbot1graf img{
    margin: 0 15% 0 0;
    padding: 0;
    width: 600px;
    height: 514px;
    

}

.integracion{
    font-family: 'Nunito Sans', sans-serif;
    font-size: 40px;
    color: #a2aabb;
    margin: 0 auto 25px auto;
    width: 100%;
    
    line-height: 46px;
    padding: 0 0 30px 0 ;
    font-weight: 100;
}


/*#chatbot7{
    width: 100%;
    height: auto;
    margin: 0;
    padding: 0;
    align-content: center;
    overflow-y: auto;
    overflow-x: hidden;
    clear: both;
    background-color: #2e3544; 
   
    


}



#chatbot7txt{
    float: right;
    padding: 0;
    width: 40%;
    margin: 0 5% 0 5%;
    display: block;

}


#chatbot7 h1{
    font-family: 'Nunito Sans', sans-serif;
    font-size: 60px;
    margin: 100px auto 50px auto;
    line-height: 60px;
    color: #96a3b8;
    max-width: 900px;
   padding:  0 10% 0 0
    
}


#chatbot7txt p{
    max-width: 900px;
    font-family: 'Nunito Sans', sans-serif;
    font-size: 28px;
    padding: 0 10% 0 0;
    margin: 0 auto 70px auto;
    color: #fff;
    

}
#chatbot7graf{
float: left;
    margin:  50px 0 0 0;
    padding: 0;
    width: 50%;
    min-width: 600px;
    display: block;
    text-align: center;
}     

#chatbot7graf img{
    margin: 0  0 0 15% ;
    padding: 0;
    
    width: 600px;
    height: 514px;

}*/


#chatbot2{
    width: 100%;
    height: auto;
    margin: 0;
    padding: 0;
    align-content: center;
    overflow-y: auto;
    overflow-x: hidden;
    clear: both;
    background-color: #505d70;
 
}

#chatbot2txt{
    float: right;
    padding: 0;
    width: 40%;
    margin: 0 5% 0 5%;
    display: block;

}

#chatbot2txt p{
    max-width: 900px;
    font-family: 'Nunito Sans', sans-serif;
    font-size: 21px;
    padding: 0 10% 0 0;
    margin: 0 auto 70px auto;
    color: #fff;
    

}

#chatbot2graf{
    float: left;
    margin:  50px 0 0 0;
    padding: 0;
    width: 50%;
    min-width: 600px;
    display: block;
    text-align: center;

    
}

#chatbot2graf img{
    margin: 0 0 0 15%;
    padding: 0;
    
    width: 600px;
    height: 514px;

    
}

#chatbot2txt h1{
    font-family: 'Nunito Sans', sans-serif;
    font-size: 40px;
    margin: 100px auto 50px auto;
    line-height: 46px;
    color: #96a3b8;
    max-width: 900px;
   padding:  0 10% 0 0
}



#chatbot3{
    width: 100%;
    height:auto;
    margin: 0;
    padding: 0;
    align-content: center;
    clear: both;
    overflow-y: auto;
    overflow-x: hidden;
    background-color: #d45c28;

}

#chatbot3txt{
    float: left;
    padding: 0;
    width: 40%;
    display: block;
    margin: 0 5% 0 5%;

}

#chatbot3txt p{
    max-width: 900px;
    font-family: 'Nunito Sans', sans-serif;
    font-size: 21px;;
    padding: 0  0 0 10%;
    margin: 0 auto 70px auto;
    color: #ffffff;
    

}


#chatbot3graf{
    float: right;
    margin: 50px  0 0 0;
    padding: 0;
    width: 50%;
    min-width: 600px;
    display: block;
    text-align: center;
    
    
}

#chatbot3graf img{
    margin: 0 15% 0 0;
    padding: 0;
    width: 600px;
    height: 514px;

    
}

#chatbot3 h1{
    font-family: 'Nunito Sans', sans-serif;
    font-size: 40px;
    color: #ffffff;
    margin: 100px auto 50px auto;
    max-width: 900px; 
    line-height: 46px;
    padding: 0 0 30px 10% ;
}


#chatbot4 {
    width: 100%;
    padding: 50px 0 0 0;
    background-color:#e66b33;
    font-size: 40px;
    font-family: 'Nunito Sans', sans-serif;
    font-weight: 300;
    text-align: center;
    color: #fff;
    height: auto;
    overflow:visible;
    
}
#chatbot4 img{
    margin: 80px 0 0 0;
    width: 100%;
   }

#chatbot4txtconte{
    width: 60%;
    margin: 30px auto 0 auto;
    

    

}
#chatbot5ctxtconte{
    width: 60%;
    min-width: 1200px;
    min-height: 200px;
    margin: 50px auto 0 auto;
    text-align: center;
    font-size: 24px;
    font-family: 'Nunito Sans', sans-serif;
    font-weight: 300;
    background-color:#e66b33;
    color: #fff;
    overflow:visible;
    padding: 40px 0 50px 0;
    

}



/*//////////////ISTAGRAM////////////////////*/


#chatbot6{
    width: 100%;
    height:auto;
    margin: 0;
    padding: 0;
    align-content: center;
    clear: both;
    overflow-y: auto;
    overflow-x: hidden;
    background-color: #f0f0f0; 
    
    

}



#chatbot6txt{
    float: left;
    padding: 0;
    width: 40%;
    display: block;
    margin: 0 5% 0 5%;

}
#chatbot6txt h1{
    
    font-family: 'Nunito Sans', sans-serif;
    font-size: 40px;
    margin: 100px auto 50px auto;
    max-width: 900px; 
    line-height: 46px;
    padding: 0 0 0 10% ;
    
    color: #96a3b8;

}

#chatbot6txt p{
    max-width: 900px;
    font-family: 'Nunito Sans', sans-serif;
    font-size: 21px;
    padding: 0  0 0 10%;
    margin: 0 auto 70px auto;
    color: #2e3544;
  

}

#chatbot6graf{
    float: right;
    margin: 50px 0 0 0;
    padding: 0;
    width: 50%;
    min-width: 600px;
    display: block;
    text-align: center;
    
    
}


#chatbot6graf img{
    margin: 0 15% 0 0;
    padding: 0;
    width: 600px;
    height: 514px;

}



#chatbot7{
    width: 100%;
    height: auto;
    margin: 0;
    padding: 0;
    align-content: center;
    overflow-y: auto;
    overflow-x: hidden;
    clear: both;
    background-color: #2e3544; 
   
    


}



#chatbot7txt{
    float: right;
    padding: 0;
    width: 40%;
    margin: 0 5% 0 5%;
    display: block;

}


#chatbot7 h1{
    font-family: 'Nunito Sans', sans-serif;
    font-size: 40px;
    margin: 100px auto 50px auto;
    line-height: 40px;
    color: #96a3b8;
    max-width: 900px;
   padding:  0 10% 0 0
    
}


#chatbot7txt p{
    max-width: 900px;
    font-family: 'Nunito Sans', sans-serif;
    font-size: 21px;
    padding: 0 10% 0 0;
    margin: 0 auto 70px auto;
    color: #fff;
    

}
#chatbot7graf{
float: left;
    margin:  50px 0 0 0;
    padding: 0;
    width: 50%;
    min-width: 600px;
    display: block;
    text-align: center;
}     

#chatbot7graf img{
    margin: 0  0 0 15% ;
    padding: 0;
    
    width: 600px;
    height: 514px;

}




#chatbot8{
    width: 100%;
    padding: 100px 0 0 0;
    background-color:#505d70;
    height: auto;
    overflow:visible;
    
}



#chatbot8titular{
    width: 60%;
    max-width: 1200px;
    padding: 0;
    font-size: 40px;
    font-family: 'Nunito Sans', sans-serif;
    font-weight: 300;
    text-align: center;
    color: #fff;
    margin: 0 auto 90px auto;
    
}








/*#inicio3 img{
 margin: 80px 0 0 0;
}*/
#chatbot8-graf4-conte{
    width: 100%;
    height: 270px;
    margin: 100px auto 0 auto;
    background-image: url("img/chatbot-ig-graf4-bkg.png");
    background-repeat: repeat-x;
    align-content: center;

}

#chatbot8-graf4-1{
    width: 33%;
    height: 270px;
    margin: 0;
    background-image: url("img/chatbot-ig-graf4-1.png");
    background-repeat: no-repeat;
    background-size:auto;
    background-position: right;
    float: left;

}

#chatbot8-graf4-2{
    width: 34%;
    height: 270px;
    margin: 0;
    background-image: url("img/chatbot-ig-graf4-2.png");
    background-repeat: no-repeat;
    background-size:auto;
    background-position: center;
    float: left;

}

#chatbot8-graf4-3{
    width: 33%;
    height: 270px;
    margin: 0;
    background-image: url("img/chatbot-ig-graf4-3.png");
    background-repeat: no-repeat;
    background-size:auto;
    background-position: left;
    float: left;

}

#chatbot8-graf5-conte{
    width: 100%;
    min-height: 150px;
    margin: 200px auto 0 auto;
    background-image: url("img/inicio-graf5.png");
    background-position: center;
    display: block;

}



 #chatbot8b {
    width: 100%;
    padding: 0;
    background-color:#5f6d81;
    font-size: 40px;
    font-family: 'Nunito Sans', sans-serif;
    font-weight: 300;
    
    height: auto;
    display: flex;
    
    
}





#chatbot8b img{
    margin: 80px 0 0 0;
   }

#chatbot8btxtconte1{
    width: 33%;
    margin: 0 0 70px 0;
    background-color: #5f6d81;
    float: left;  

}

#chatbot8btxtconte2{
    width: 34%;
    margin: 0 0 70px 0;
    background-color: #5f6d81;
    float: left;  

}
#chatbot8btxtconte3{
    width: 33%;
    margin: 0 0 70px 0;
    background-color: #5f6d81;
    float: left;  

}

.chatbot8btxt1{
    max-width: 270px;
    margin:  0;
    padding: 0;
    float: right;
    font-size: 24px;
    font-family: 'Nunito Sans', sans-serif;
    font-weight: 300;
    text-align: center;
    color: #96a3b8;


    
}

.chatbot8btxt2{
    max-width: 270px;
    margin:  0 auto 0 auto;
    padding: 0;
    font-size: 24px;
    font-family: 'Nunito Sans', sans-serif;
    font-weight: 300;
    text-align: center;
    color: #96a3b8;

 
    
}

.chatbot8btxt3{
    max-width: 270px;
    margin:  0;
    padding: 0;
    float: left;
    font-size: 24px;
    font-family: 'Nunito Sans', sans-serif;
    font-weight: 300;
    text-align: center;
    color: #96a3b8;

    
}




#chatbot9 {
    width: 100%;
    padding: 0;
    background-color:#505d70;
    height: auto;
    display: flex;
    
}

#chatbot9txt {
    width: 70%;
    
    padding: 0;
    background-color:#505d70;
    font-size: 24px;
    font-family: 'Nunito Sans', sans-serif;
    font-weight: 300;
    text-align: left;
    color: #fff;
    margin: 90px auto 90px auto;
    
}


/*#chatbot6{
    width: 100%;
    height:auto;
    margin: 0;
    padding: 0;
    align-content: center;
    clear: both;
    overflow-y: auto;
    overflow-x: hidden;
    background-color: #f0f0f0; 
    
    

}



#chatbot6txt{
    float: left;
    padding: 0;
    width: 40%;
    display: block;
    margin: 0 5% 0 5%;

}
#chatbot6 h1{
    
    font-family: 'Nunito Sans', sans-serif;
    font-size: 60px;
    margin: 100px auto 50px auto;
    max-width: 900px; 
    line-height: 66px;
    padding: 0 0 30px 10% ;
    
    color: #96a3b8;

}

#chatbot6txt p{
    max-width: 900px;
    font-family: 'Nunito Sans', sans-serif;
    font-size: 28px;
    padding: 0  0 0 10%;
    margin: 0 auto 70px auto;
    color: #2e3544;
  

}

#chatbot6graf{
    float: right;
    margin: 50px 0 0 0;
    padding: 0;
    width: 50%;
    min-width: 600px;
    display: block;
    text-align: center;
    
    
}


#chatbot6graf img{
    margin: 0 15% 0 0;
    padding: 0;
    width: 600px;
    height: 514px;

}*/

#chatbot10{
    width: 100%;
    height:auto;
    margin: 0;
    padding: 0;
    align-content: center;
    clear: both;
    overflow-y: auto;
    overflow-x: hidden;
    background-color: #d45c28; 
    
    


}



#chatbot10txt{
    float: left;
    padding: 0;
    width: 40%;
    display: block;
    margin: 0 5% 0 5%;

}
#chatbot10 h1{
    font-family: 'Nunito Sans', sans-serif;
    font-size: 40px;
    margin: 100px auto 50px auto;
    max-width: 900px; 
    line-height: 46px;
    padding: 0 0 0 10% ;
    
    color: #fff;
    
}

#chatbot10txt p{
    max-width: 900px;
    font-family: 'Nunito Sans', sans-serif;
    font-size: 21px;
    padding: 0  0 0 10%;
    margin: 0 auto 70px auto;
    color: #fff;
   

}

#chatbot10graf{
    float: right;
    margin: 50px 0 0 0;
    padding: 0;
    width: 50%;
    min-width: 600px;
    display: block;
    text-align: center;
    
    
}

#chatbot10graf img{
    margin: 0 15% 0 0;
    padding: 0;
    width: 600px;
    height: 514px;

}

/*////   W E B //////*/

#chatbot11{
    width: 100%;
    height:auto;
    margin: 0;
    padding: 0;
    align-content: center;
    clear: both;
    overflow-y: auto;
    overflow-x: hidden;
    background-color: #f0f0f0; 
    
    

}



#chatbot11txt{
    float: left;
    padding: 0;
    width: 40%;
    display: block;
    margin: 0 5% 0 5%;

}
#chatbot11 h1{
    
    font-family: 'Nunito Sans', sans-serif;
    font-size: 40px;
    margin: 100px auto 50px auto;
    max-width: 900px; 
    line-height: 46px;
    padding: 0 0 0 10% ;
    
    color: #96a3b8;

}

#chatbot11txt p{
    max-width: 900px;
    font-family: 'Nunito Sans', sans-serif;
    font-size: 21px;
    padding: 0  0 0 10%;
    margin: 0 auto 70px auto;
    color: #2e3544;
  

}

#chatbot11graf{
    float: right;
    margin: 50px 0 0 0;
    padding: 0;
    width: 50%;
    min-width: 600px;
    display: block;
    text-align: center;
    
    
}


#chatbot11graf img{
    margin: 0 15% 0 0;
    padding: 0;
    width: 600px;
    height: 514px;

}




#chatbot12{
    width: 100%;
    background-color: #2e3544; 
    display: flex;
    


}



#chatbot12txt{
    width: 500px;
    float: left;
    display: block;
    margin: 100px auto 0 0;

}
#chatbot12txt h1{
    font-family: 'Nunito Sans', sans-serif;
    font-size: 40px;
    color: #96a3b8;
    margin: 0 0 70px 0;
    line-height: 40px;
}

#chatbot12txt p{
    font-family: 'Nunito Sans', sans-serif;
    font-size: 21px;
    color: #fff;
    padding: 0;
    margin: 0 0 70px 0;

}
#chatbot12 img{
    width: 700px;
    height:600px;
    max-width: 60%;
    outline: none;
    margin: 0 50px 0 auto;
    float: left;

}





/*//////////// CTA ///////////////*/

.ctablanco{
    text-align: center;
    display: block;
    background-color: #fff;
    color: #505d70;
    font-family: 'Nunito Sans', sans-serif;
    font-size: 30px;
    padding: 12px;
    border-radius: 8px;
    text-decoration: none;
    margin: 50px 0 50px 0;
    
}

.ctablancocentral{
    max-width: 500px;
    text-align: center;
    display: block;
    background-color: #fff;
    color: #505d70;
    font-family: 'Nunito Sans', sans-serif;
    font-size: 30px;
    padding: 12px;
    border-radius: 8px;
    text-decoration: none;
    margin: 70px auto 50px auto;
    
}

.ctanaranja{
    text-align: center;
    display: block;
    background-color: #e66b33;
    color: #fff;
    font-family: 'Nunito Sans', sans-serif;
    font-size: 30px;
    padding: 12px;
    border-radius: 8px;
    text-decoration: none;
    margin: 50px 0 50px 0;
    
}


/*//////////LIVECHAT*/

#livechat1{
    width: 100%;
    height:auto;
    margin: 0;
    padding: 0;
    background-color: #fff;
    align-content: center;
    clear: both;
    overflow-y: auto;
    overflow-x: hidden;
}

#livechat1txt{
    float: left;
    padding: 0;
    width: 40%;
    display: block;
    margin: 0 5% 0 5%;
}

#livechat1txt p{
    max-width: 900px;
    font-family: 'Nunito Sans', sans-serif;
    font-size: 21px;
    color: #475161;
    padding: 0  0 0 10%;
    margin: 0 auto 70px auto;

}

#livechat1graf{
    float: right;
    margin: 50px 0 0 0;
    padding: 0;
    width: 50%;
    min-width: 600px;
    display: block;
    text-align: center;
    

    
}

#livechat1graf img{
    margin: 0 15% 0 0;
    padding: 0;
    width: 600px;
    height: 514px;

    
}

#livechat1 h1{

    font-family: 'Nunito Sans', sans-serif;
    font-size: 40px;
    color: #a2aabb;
    margin: 100px auto 50px auto;
    max-width: 900px; 
    line-height: 46px;
    padding: 0 0 0 10% ;
    
}


#livechat2{
    width: 100%;
    height: auto;
    margin: 0;
    padding: 0;
    background-color: #495d71;
    align-content: center;
    overflow-y: auto;
    overflow-x: hidden;
    clear: both;
}

#livechat2txt{
    float: right;
    padding: 0 0;
    width: 40%;
    margin: 0 5% 0 5%;
    display: block;

}

#livechat2txt p{
    max-width: 900px;
    font-family: 'Nunito Sans', sans-serif;
    font-size: 21px;
    color: #fff;
    padding: 0 10% 0 0;
    margin: 0 auto 70px auto;
}

#livechat2graf{
    float: left;
    margin:  0;
    padding: 0;
    width: 50%;
    min-width: 600px;
    display: block;
    text-align: center;
        
}


#livechat2graf img{
    margin: 0  0 0 15% ;
    padding: 0;
    
    width: 600px;
    height: 514px;
    
   

    
}

#livechat2 h1{
    font-family: 'Nunito Sans', sans-serif;
    font-size: 40px;
    color: #94a5bd;
    margin: 100px auto 50px auto;
    line-height: 40px;
}



#livechat3{
    width: 100%;
    height:auto;
    margin: 0;
    padding: 0;
    background-color: #2e3544;
    align-content: center;
    clear: both;
    overflow-y: auto;
    overflow-x: hidden;
}

#livechat3txt{
    float: left;
    padding: 0;
    width: 40%;
    display: block;
    margin: 0 5% 0 5%;
}

#livechat3txt p{
    max-width: 900px;
    font-family: 'Nunito Sans', sans-serif;
    font-size: 21px;
    color: #fff;
    padding: 0  0 0 10%;
    margin: 0 auto 70px auto;

}

#livechat3graf{
    float: right;
    margin: 50px 0 0 0;
    padding: 0;
    width: 50%;
    min-width: 600px;
    display: block;
    text-align: center;
    

    
}

#livechat3graf img{
    margin: 0 15% 0 0;
    padding: 0;
    width: 600px;
    height: 514px;

    
}

#livechat3 h1{

    font-family: 'Nunito Sans', sans-serif;
    font-size: 40px;
    color: #a2aabb;
    margin: 100px auto 50px auto;
    max-width: 900px; 
    line-height: 46px;
    padding: 0 0 0 10% ;
    
}





    



/*/////////////CASOS//////////////*/

#casos1{
    width: 100%;
    margin: 0;
    padding: 0;
    background-color: #fff;
    display:flex;
}

#casos1txt{
    float: left;
    padding: 0;
    width: 40%;
    display: block;
    margin: 0 5% 0 5%;

}

#casos1txt p{
    max-width: 900px;
    font-family: 'Nunito Sans', sans-serif;
    font-size: 21px;
    color: #475161;
    padding: 0  0 0 10%;
    margin: 0 auto 70px auto;

}

#casos1graf{
    float: right;
    margin: 75px 0 0 0;
    padding: 0;
    width: 50%;
    min-width: 600px;
    display: block;
    text-align: center;
    

    
}

#casos1graf img{
    margin: 0 15% 0 0;
    padding: 0;
    width: 600px;
    height: 514px;

    
}

#casos1 h1{
    font-family: 'Nunito Sans', sans-serif;
    font-size: 40px;
    color: #a2aabb;
    margin: 100px auto 50px auto;
    max-width: 900px; 
    line-height: 46px;
    padding: 0 0 0 10% ;
}


#casos2{
    width: 100%;
    margin: 0;
    padding: 0;
    background-color: #f0f0f0;
    display:flex;
}

#casos2txt{
    float: left;
    padding: 0;
    width: 40%;
    display: block;
    margin: 0 5% 0 5%;

}

#casos2txt p{
    max-width: 900px;
    font-family: 'Nunito Sans', sans-serif;
    font-size: 21px;
    color: #475161;
    padding: 0  0 0 10%;
    margin: 0 auto 70px auto;

}
#casos2graf{
    float: right;
    margin: 50px 0 0 0;
    padding: 0;
    width: 50%;
    min-width: 600px;
    display: block;
    text-align: center;
    

    
}

#casos2graf img{
    margin: 0 15% 0 0;
    padding: 0;
    width: 600px;
    height: 514px;

    
}

#casos2 h1{
    font-family: 'Nunito Sans', sans-serif;
    font-size: 40px;
    color: #a2aabb;
    margin: 100px auto 50px auto;
    max-width: 900px; 
    line-height: 46px;
    padding: 0 0 0 10% ;
}

#casos1b{
    
    width: 100%;
    height: auto;
    margin: 0;
    padding: 0;
    background-color: #2e3544;
    align-content: center;
    clear: both;
    overflow: visible;
    
}



#casos1btxt{
    width: 70%;
   
    margin: 0 auto 0 auto;
    padding: 70px 0 80px 0 ;
    
    display: block;

}

#casos2b{
    
    width: 100%;
    height: auto;
    margin: 0;
    padding: 0;
    background-color: #2e3544;
    align-content: center;
    clear: both;
    overflow: visible;
    
}



#casos2btxt{
    width: 70%;
   
    margin: 0 auto 0 auto;
    padding: 70px 0 80px 0 ;
    
    display: block;

}

.resultado{
    font-family: 'Nunito Sans', sans-serif;
    font-size: 40px;
    color: #a2aabb;
    margin: 0 auto 0 auto;
    width: 100%;
    
    line-height: 46px;
    padding: 0 0 30px 0 ;
    font-weight: 100;
}


/*/////////////// VOICE BOT///////////////////*/






#voicebot1{

    width: 100%;
    padding: 50px 0 50px 0;
    background-color:#e66b33;
    font-size: 40px;
    font-family: 'Nunito Sans', sans-serif;
    font-weight: 300;
    text-align: center;
    color: #fff;
    height: auto;
    overflow:visible;
    
    

}

#voicebot1txtconte{
    
    width: 60%;
    max-width: 1200px;
    
    margin: 0 auto 0 auto;
    text-align: center;
    font-size: 24px;
    font-family: 'Nunito Sans', sans-serif;
    font-weight: 300;
    background-color:#e66b33;
    color: #fff;
    overflow:visible;
    
    padding: 40px 0 40px 0;

    

}


/*   CASOS   */

#caso1{
    width: 100%;
    height:auto;
    margin: 0;
    padding: 0;
    background-color: #fff;
    align-content: center;
    clear: both;
    overflow-y: auto;
    overflow-x: hidden;
}

#caso1txt{
    float: left;
    padding: 0;
    width: 40%;
    display: block;
    margin: 0 5% 0 5%;
}

#caso1txt p{
    max-width: 900px;
    font-family: 'Nunito Sans', sans-serif;
    font-size: 21px;
    color: #475161;
    padding: 0  0 0 10%;
    margin: 0 auto 70px auto;

}

#caso1graf{
    float: right;
    margin: 50px 0 0 0;
    padding: 0;
    width: 50%;
    min-width: 600px;
    display: block;
    text-align: center;
    

    
}

#caso1graf img{
    margin: 0 15% 0 0;
    padding: 0;
    width: 600px;
    height: 514px;

    
}

#caso1 h1{

    font-family: 'Nunito Sans', sans-serif;
    font-size: 40px;
    color: #a2aabb;
    margin: 100px auto 50px auto;
    max-width: 900px; 
    line-height: 46px;
    padding: 0 0 30px 10% ;
    
}



/* cygnus */

#cont-menu{
    width           : 100%;
    max-height      : 100%;
    position        : fixed;
    top             : 0;
    left            : 0;
    background-color: #2e3544;
    z-index         : 998;
    padding         : 5px 20px;
    box-sizing      : border-box;
    font-family: 'Nunito Sans', sans-serif;
}

#cont-menu *{
    box-sizing: border-box;
    will-change: contents;
}

    #cont-menu img{
        height: 75px;
        float     : left;
    }
    
    /* nav */
    #cont-menu nav{
        width      : 100%;
        position   : fixed;
        top        : 0;
        left       : 0;
        z-index    : -10;
        opacity    : 0;
        visibility : hidden;
        transition : all .2s ease;
        padding-top: 75px;
    }

    body.visible  #cont-menu nav{
        z-index    : 997;
        opacity    : 1;
        visibility : visible;
        height     : 100%;
        max-height : 100%;
    }

    #cont-menu nav section{
        width           : 0;
        height          : 100%;
        float           : left;
        background-color: #262c38;
        overflow        : hidden;
        position        : relative;
        transition      : all 1s ease;
    }
    #cont-menu nav section:nth-child(even){
        background-color: #2e3544;
    }

    body.visible #cont-menu nav section{
        width: 24.999%;
    }

        #cont-menu nav section a{
            color          : #fff;
            text-decoration: none;
            text-transform : uppercase;
            padding        : 20px 20px 20px 60px;
            box-sizing     : border-box;
            font-size      : 1.7rem;
            text-align     : left;
            width          : 100%;
            float          : left;
            position       : relative;
            margin-top     : 75%;
            z-index        : 800;
        }

        #cont-menu nav section a:hover{
            opacity: .6;
        }


        #cont-menu nav section:after{
            content         : ''; 
            width           : 100%;
            height          : 100%;
            z-index         : 1;
            position        : absolute;
            left            : 0;
            bottom          : 0;
            transform       : translateY(100%);
            transition      : all .2s linear;
            background-image: url(img/1.jpg);

        }
        #cont-menu nav section:after{
            background-image: url(img/2.jpg);
        }
        #cont-menu nav section:nth-child(even):after{
            background-image: url(img/1.jpg);
        }

        #cont-menu nav section:hover:after{
            transform: translateY(25%);
        }


        #cont-menu nav section:before{
            content         : '';
            width           : 100%;
            height          : 100%;
            z-index         : 5;
            position        : absolute;
            left            : 0;
            bottom          : 0;
            transform       : translateY(100%);
            transition      : all .4s ease-in;
            background-image: url(img/fondo-after.png);
        }
        #cont-menu nav section:hover:before{
            transform: translateY(27%);
        }

        .link-sub{
            cursor: default !important;
        }

        /* sub menú */
        .sub-menu{
            width     : 100%;
            float     : left;
            position  : relative;
            padding   : 20px 60px;
            margin-top: 50px;
            opacity   : 0;
            visibility: 0;
            transition: all .3s ease;
            transform : translateY(200px);
            z-index   : 0;
        }

            .sub-menu a{
                color          : #fff;
                text-decoration: none;
                padding        : 4px 0 !important;
                margin         : 0 !important;
                font-size      : 1.4rem !important;
            }

            #cont-menu nav section:hover .sub-menu,
            #cont-menu nav section a:hover + .sub-menu{
                opacity   : 1;
                visibility: visible;
                transform : translateY(0);
                z-index   : 70;
            }
 


        /* btn */
        .btn-menu {
            position: fixed;
            top     : 19px;
            right   : 30px;
            margin  : auto;
            width   : 30px;
            height  : 40px;
            cursor  : pointer;
            z-index : 999;
        }
        .btn-menu:hover{
            opacity: .6
        }

            .btn-menu input{
                appearance           : none;
                -webkit-appearance   : none;
                -moz-appearance      : none;
                -op-appearance       : none;
                border-radius        : 0;
                -webkit-border-radius: 0;
            }

            .btn-menu span {
                position     : absolute;
                top          : 0;
                right        : 0;
                bottom       : 0;
                left         : 0;
                width        : 100%;
                height       : 3px;
                margin       : auto;
                border-radius: 0;
                transition   : background 0s .25s;
                background   : #fff;
            }

                .btn-menu span:before,
                .btn-menu span:after {
                    position           : absolute;
                    width              : inherit;
                    height             : inherit;
                    content            : '';
                    transition-delay   : .25s, 0s;
                    transition-duration: .25s, .25s;
                    background         : #fff;
                    border-radius      : 0
                }
                .btn-menu span:before {
                    top: -12px;
                    transition-property: top, -webkit-transform;
                    transition-property: top, transform;
                }
                .btn-menu span:after {
                    bottom: -12px;
                    transition-property: bottom, -webkit-transform;
                    transition-property: bottom, transform;
                }

            /* hover - activo */
            body.visible #flag + span {
                background: none;
            } 
            body.visible #flag + span:before {
                top: 0;
                -webkit-transform: rotate(45deg);
                        transform: rotate(45deg);
            }
            body.visible #flag + span:after {
                bottom: 0;
                -webkit-transform: rotate(-45deg);
                        transform: rotate(-45deg);
            }
            body.visible #flag + span:before,
            body.visible #flag + span:after {
                transition-delay: 0s, .25s;
            }


#bannerInicioconte{
    padding-top: 60px;
}













@media screen and (max-width: 1460px){


    #cont-menu nav section a{
        font-size      : 1.6rem;
        text-align     : left;
        margin-top     : 68%;
    }

    #cont-menu nav section:hover:after{
        transform: translateY(14%);
    }

    #cont-menu nav section:hover:before{
        transform: translateY(13.5%);
    }

    /* sub menú */
    .sub-menu{
        margin-top: 45px;
    }

        .sub-menu a{
            padding  : 2px 0 !important;
            font-size: 1.3rem !important;
        }


}




@media screen and (max-width: 1370px){


    #cont-menu nav section a{
        margin-top     : 65%;
    }

    #cont-menu nav section:hover:after{
        transform: translateY(13%);
    }

    #cont-menu nav section:hover:before{
        transform: translateY(16%);
    }


}




@media screen and (max-width: 1200px){


    #cont-menu nav section a{
        font-size : 1.5rem;
        margin-top: 88%;
        padding   : 15px 15px 15px 40px;
    }

    #cont-menu nav section:hover:after{
        transform: translateY(15%);
    }

    #cont-menu nav section:hover:before{
        transform: translateY(19%);
    }

    /* sub menú */
    .sub-menu{
        margin-top: 35px;
        padding   : 20px 40px !important;
    }

        .sub-menu a{
            padding  : 0 !important;
            font-size: 1.3rem !important;
        }


}



@media screen and (max-width: 1024px){


    #cont-menu nav section a{
        font-size : 1.5rem;
        margin-top: 88%;
        padding   : 15px 15px 15px 40px;
    }

    #cont-menu nav section:hover:after{
        transform: translateY(15%);
    }

    #cont-menu nav section:hover:before{
        transform: translateY(16%);
    }

    /* sub menú */
    .sub-menu{
        margin-top: 115px;
        padding   :  4px 40px !important;
    }

        .sub-menu a{
            padding  : 0 !important;
            font-size: 1.3rem !important;
        }


}





@media screen and (max-width: 800px){


    #cont-menu{
        padding: 10px 30px;
    }

    #cont-menu nav{
        background-color: #2e3544;
        padding-top     : 0 !important;
        top             : 75px;
        overflow        : hidden;
    }

    #cont-menu nav section{
        width : 100%;
        height: 0;
    }
    body.visible #cont-menu nav section{
        width: 100%;
        height: auto !important;
    }
 
    #cont-menu nav section a{
        font-size : 1.6rem;
        height    : auto !important;
        margin-top: inherit;
        padding   : 40px 30px;
    }

    #cont-menu nav section:hover:after,
    #cont-menu nav section:hover:before{
        display: none !important;
        opacity: 0 !important;
    }

    

    /* sub menú */
    .sub-menu{
        margin-top: 0;
        padding   : 0 40px !important;
        opacity   : 1;
        visibility: visible;
        display   : none;
        transform : translateY(0);
    }

        .sub-menu a{
            padding  : 10px 0 !important;
            font-size: 1.5rem !important;
        }

        .sub-menu.abierto{
            display      : block;
            margin-bottom: 20px;
        }


        .link-sub:after{
            content    : '+';
            width      : 12px;
            height     : 12px;
            float      : right;
            font-weight: 400;
            color      : #fff;
        }


    .btn-menu{
        right: 30px;
    }


}



@media screen and (max-width: 540px){


 
    #cont-menu nav section a{
        font-size : 1.2rem;
        padding   : 30px;
    }

    

    /* sub menú */

        .sub-menu a{
            font-size: 1.1rem !important;
        }


}



@media screen and (max-width: 380px){


 
    #cont-menu nav section a{
        font-size : 1.1rem;
        padding   : 18px 30px;
    }

    

    /* sub menú */
        .sub-menu a{
            font-size: 1.2rem !important;
            padding  : 5px !important;
        }


}