
.masthead {
    position: relative;
    height: 100vh;
    min-height: 300px;
    display: block;
    position: relative;
}
.masthead::after{
    content: "";
    background: url("ELEMENTOS/BG HOME S1.png");
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    position: absolute;
    z-index: -1;   
}
.llamadas{
    max-width: 35%;

}
.planes{
    max-width: 75%;

}
.funciona1{
    max-width: 55%;
}
.funciona2{
    max-width: 55%;
}
.funciona3{
    max-width: 60%;
}

.imgB{
    width: 100%;
    height: 100%;
    
}

.imgB2{
    max-width: 15%;
}

.nopadding {
    padding: 0 !important;
    margin: 0 !important;
 }

 .circulo {
    width: 100px;
    height: 100px;
    -moz-border-radius: 50%;
    -webkit-border-radius: 50%;
    border-radius: 50%;
    background: white;
}
.opc{
    box-shadow: 0px 12px 50px 5px rgba(0,0,0,0.37);
 
}

.centered {
    position: absolute;
    top: 8px;
    left: 16px;
  }

.oferta1{
    background-image: url("ELEMENTOS/BG MENU HOME S5.png");
    background-size: 75%;
    background-repeat: no-repeat;
    background-position-x: center;
}
.textoOferta{
    
    padding-left: 10%;
    padding-right: 10%;
    padding-top: 10%;
    padding-bottom: 20%;
    height: 100%;
    -webkit-border-radius: 23px;
    -moz-border-radius: 23px;
    border-radius: 23px;
    background-color: white;
}
.col-md-3 .textoOferta{
    padding-left: 5%;
    padding-right: 5%;

}
li {
margin-bottom: 3%;
}

.botonop{
border-radius: 12px !important;
}  

.carousel-control-prev-icon {
    width: 40px !important;
    height: 40px !important;
    background-image: url("ELEMENTOS/flechaD.png") !important;
}
.carousel-control-next-icon {
    width: 40px !important;
    height: 40px !important;
    background-image: url("ELEMENTOS/flechaI.png") !important;
}

.contactanosDiv{
    background-color: #f4f3f3;
}

.footer{
    background-color: #1bacaf;
    padding-top: 5%;
    padding-bottom: 2%;
}
.bordesup{
    -webkit-border-top-left-radius: 23px;
    -webkit-border-top-right-radius: 23px;
    -moz-border-radius-topleft: 23px;
    -moz-border-radius-topright: 23px;
    border-top-left-radius: 23px;
    border-top-right-radius: 23px;
    height: 5%;
    background-color: #1bacaf;
    width: 90%;
    margin-left: 5%;
}
.bordeinf{
    -webkit-border-bottom-right-radius: 23px;
    -webkit-border-bottom-left-radius: 23px;
    -moz-border-radius-bottomright: 23px;
    -moz-border-radius-bottomleft: 23px;
    border-bottom-right-radius: 23px;
    border-bottom-left-radius: 23px;
    height: 5%;
    background-color: #1bacaf;
    width: 90%;
    margin-left: 5%;
}
.iconify{
    margin-right: 5%;
}
.flecha{
    position: absolute; 
    top: 90%; 
    margin-inline: 48%; 
    display: inline-block; 
    z-index: 1;  
}

.btn-outline-primary{
    color: black !important;
    border-color: #45a7a9 !important;

}
.btn-outline-primary:hover{
    background: #45a7a9 !important;
    color: white !important;

}
.btn-outline-primary:focus{
    background: #45a7a9 !important;
    color: white !important;
}

.btn-outline-primary:target {
    background: #45a7a9 !important;
}

.btn-outline-primary:not(:disabled):not(.disabled).active, .btn-outline-primary:not(:disabled):not(.disabled):active, .show > .btn-outline-primary.dropdown-toggle {
    background: #45a7a9 !important;
    color: white !important;
}

.espaceNav > li{
    padding-left:5px;
    padding-right:5px;
  }
  /*.espaceNav > li:last-child{
    padding-left:5px;
    padding-right:25px;
  }*/
  .navbar-toggler-icon {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(255,255,255, 1)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 8h24M4 16h24M4 24h24'/%3E%3C/svg%3E") !important;
}
.imgLogo{
    
    height: 47px;
}
#section01 a span {
    color: #000000 !important;
  }

.supermegaidparaprobar{
    font-size: 130px;
}
.divcartas{
    padding-bottom: 10%;
}
.corte1{
    width: 100%;
    position: absolute;
    bottom: 0;
}
.corte{
   width: 100%;
   vertical-align: bottom;
}



/*------Cambia-------*/
.mastheadSer{
    position: relative;
    height: 60vh;
    min-height: 600px;
    display: block;
    position: relative;
}
/*------Cambia-------*/
.mastheadSer::after{

    content: "";
    background: url("ELEMENTOS/BG\ SERVICIOS\ S1.png");
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    position: absolute;
    z-index: -1;   
}
/*------No-Cambia-------*/
.textoOfertaSer{
    
    padding-left: 10%;
    padding-right: 10%;
    padding-top: 10%;
    padding-bottom: 20%;
    height: 100%;
    -webkit-border-radius: 23px;
    -moz-border-radius: 23px;
    border-radius: 23px;
    background-color: white;
}
/*------NO-Cambia-------*/
.col-md-3 .textoOfertaSer{
    padding-left: 5%;
    padding-right: 5%;
}
/*------NO-Cambia-------*/
.botonopSer{
    border-radius: 12px !important;
}  
/*-------Cambia-------*/
.bordesupSer{
    -webkit-border-top-left-radius: 23px;
    -webkit-border-top-right-radius: 23px;
    -moz-border-radius-topleft: 23px;
    -moz-border-radius-topright: 23px;
    border-top-left-radius: 23px;
    border-top-right-radius: 23px;
    height: 5%;
    background-color: #1c9292;
    width: 90%;
    margin-left: 5%;
}
/*-------Cambia-------*/
.bordeinfSer{
    -webkit-border-bottom-right-radius: 23px;
    -webkit-border-bottom-left-radius: 23px;
    -moz-border-radius-bottomright: 23px;
    -moz-border-radius-bottomleft: 23px;
    border-bottom-right-radius: 23px;
    border-bottom-left-radius: 23px;
    height: 5%;
    background-color: #1c9292;
    width: 90%;
    margin-left: 5%;
}
/*-------Cambia-------unico*/
.preguntas{
    text-align: justify;
    padding-top: 5%;
}
/*-------Cambia-------unico*/
.preguntas .row{
    padding-bottom: 2%;
}
/*-------Cambia-------unico*/
.preguntas .b{
    padding-bottom: 5%;
    
}
/*-------Cambia-------unico*/
.serviciosTitle{
    color: #45a7a9;
    justify-content: center;
    font-weight: bold;
    display: flex;
    
}
/*-------Cambia-------unico*/
.preguntasTitle{
    color: #45a7a9;
    
    font-weight: bold;
    display: flex;
    font-size: 50px;

}
/*-------Cambia-------unico*/
 .collapsible button {
    background-color: #ffffff;
    color: #444;
    cursor: pointer;
    padding: 18px;
    width: 100%;
    
    text-align: left;
    outline: none;
    font-size: 15px;
    font-weight: bold;
    position: relative;
    border-top: 0.5px solid rgb(202, 202, 202);
    border-bottom: none;
    border-left: none;
    border-right: none;
    
  }
  /*-------Cambia-------unico*/
  .collapsible:first-child button{
    border: none ;
}
  
  /*-------Cambia-------unico*/
.collapsible button:hover {
    background-color: rgb(243, 243, 243);
  }
  
/*-------Cambia-------unico*/
  .collapsible .content {
    padding: 0 18px;
    display: none;
    overflow: hidden;
    background-color: #ffffff;
  } 
/*-------Cambia-------unico*/
  .collapsible.active .content {
    display: block;
  } 
/*-------Cambia-------unico*/
  .collapsible{
      border-bottom: #1bacaf;
  }
/*-------Cambia-------unico*/
  .collapsible.active .flechaD {
    transform: translate(0px, -20%) rotate(180deg) !important;
   -webkit-transform: translate(0px, -20%) rotate(180deg) !important;
   -ms-transform: translate(0px, -20%) rotate(180deg) !important;
} 
.corteSer{
   width: 100%;
   vertical-align: bottom;
}

/*-------Cambia-------*/
.btn-outline-primary.botonopSer{
    color: white !important;
    border-color: white !important;
}
/*-------Cambia-------*/
.btn-outline-primary:hover.botonopSer{
    background: white !important;
    color: black !important;
    border-color: white !important;
}
/*-------Cambia-------*/
.btn-outline-primary.botonopSer:focus{
    background: white !important;
    color: black !important;
    border-color: white !important;
}
/*-------Cambia-------*/
.btn-outline-primary.botonopSer:target {
    background: #45a7a9 !important;
    border-color: white !important;
}
/*-------Cambia-------*/
.btn-outline-primary.botonopSer:not(:disabled):not(.disabled).active, .btn-outline-primary.botonopSer:not(:disabled):not(.disabled):active, .show > .btn-outline-primary.botonopSer.dropdown-toggle {
    background: white !important;
    color: black !important;
    border-color: white !important;
}
/*-------Cambia-------*/
.btn-outline-primary.botonopSer.focus, .btn-outline-primary.botonopSer:focus {
    box-shadow: 0 0 0 .2rem white;
}

/*NOSOTROS*/
.mastheadNos {
    background-color: #f4f3f3;
    padding-bottom: 10%;
    background: url("ELEMENTOS/BG NOSOTROS S1.png");
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}
 
.corte1Nos{
    width: 100%;
    position: relative;
    bottom: 0;
}
@media only screen and (min-width: 1000px) {
    .objText{
        padding-right: 19%;
    }
    .exitoText{
        padding-right: 32%;
    }
    .somosText{
        margin-left: 15%;
    }
    .valText{
        padding-left: 4%;
    }
    .valTitle{
        padding-left: 4%;
    }
}
.exitoText{
    font-weight: bold;
    color: #106064;
    text-align: justify;
    
}
.pqigst{
    padding-left: 4%;
    text-align: justify;
    border-left: solid #1bacaf;
    
}
.objText{
 
    text-align: justify;

}
.valText{
    padding-right: 1%;
    text-align: justify;
}
.subT{
    font-weight: bold;
    color: white;
    background-color: #106064;
}
.somosDiv{
    background: rgb(17,79,81);
    background: linear-gradient(90deg, rgba(17,79,81,1) 0%, rgba(27,168,171,1) 100%);
    padding-top: 2%;
    padding-bottom: 2%;
}
.somosText{
    font-weight: bold;
    color: white;
    
}
.expDiv{
    padding-top: 10%;
    padding-bottom: 10%;
}
.expTitle{
    font-weight: bold;
    color: #106064;
}
.expText{
    text-align: justify;
}
.telefonoBack{
    background: url("ELEMENTOS/BG\ NOSOTROS\ S5.jpg");
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;  
}
.imgChava{
    position: absolute;
    top: 0;
    right: 0;
}
.logoN{
    max-width: 55%;
    height: auto;
}
.textBanner{
    text-align: justify;
}


 /*Para cuando pantalla Minimo a 576*/
 @media only screen and (max-width: 576px) { 
    .pqigst{
        border-left: solid #ffffff !important;
    }
 }

/*Para cuando telefono o pantalla MENOR a 769*/
@media only screen and (max-width: 768px) {
    
    [id*="tarjeta"] {
      padding-bottom: 15%;
    }
    [id*="formClientes"]{
        text-align: center;
        padding-bottom: 5%;
    }
    /*--------Cambia-------mismo media-unico*/
    .mastheadSer{
        height: 75vh !important;
    }
    /*--------Cambia-------mismo media- unico*/
    .col-md-6:nth-child(2) .collapsible:first-child button{
        border-top: 0.5px solid rgb(202, 202, 202);
        border-bottom: none;
        border-left: none;
        border-right: none;
    }
    .textBanner{
        text-align: justify;
        margin-inline: 5%;
    }

 }
 @media only screen and (min-width: 1800px) { 
    
    .textoFoto{
        margin-left: -15% !important;
    }
    .letra1{
        font-size: 34px !important;
    }
    .letra2{
        font-size: 55px !important;
    }    
    .letra3{
        font-size: 26px !important;
    }     
    
 }

 /*Para cuando pantalla MAYOR a 768*/
 @media only screen and (min-width: 768px) { 
    
    .h1Cliente{
        color: #106064;  
    }
    .isplayDiv{
        display: flex;
        line-height: 25px;
    }
    
    [class*="itemsF"]{
        display: none;
    }
    .instaFoot{
        margin-bottom: 2%;
    }
    .ubicanos{
        margin-top: 1%;
    }
    .letra1{
    	color: #f8f9fa;
    }	
    .letra2{
    	color: #f8f9fa;
    }	
    .letra3{
    	color: #f8f9fa;
    }
    .textBanner{
        text-align: justify;
        margin-inline: 20%;
    }
    .logoN{
        margin-top: 15%;
    }	
    

    
 }

/*Para cuando telefono o pantalla MENOR a 767*/
 @media only screen and (max-width: 767px) { 
    [class*="footer"]{
        text-align: center;
    }  
    .h1Cliente{
        color: #106064;  
    }
    .imgChava{
        max-width: 75% !important;
    }
    .masthead::after{
        opacity: 0.3; 
    }
    .letra1{
        color: black !important;
        text-shadow: 0px 0px #000000 !important;
    }
    .letra2{
        color: black !important;
        text-shadow: 0px 0px #000000 !important;
    }    
    .letra3{
        color: black !important;
        text-shadow: 0px 0px #000000 !important;
    }     
    .flecha{
        display: none;
    }
    .mastheadSer::after{

        opacity: 0.8;  
    }   
    .logoN{
        max-width: 55%;
        height: auto;
        margin-top: 85% !important;
    }  
    .exitoText{
        font-weight: bold;
        color: #106064;
        text-align: justify;
        padding-right: 0% !important;
    }
    .objText{
        padding-right: 5% !important;
    } 
 }
/*Para cuando telefono o pantalla MENOR a 350*/
 @media only screen and (max-width: 350px) {
      
    .h1Cliente{ 
        font-size: 40px;
    }
    .prodText{
        font-size: 30px;
    }
    /*-------Cambia-------unico*/
    .serviciosTitle{
        font-size: 50px !important;
        padding-top: 30%;
    }
    /*-------Cambia-------unico*/
    .coluPreguntas{
        margin-right: -5%;
    }
    .mastheadSer{
        height: 100vh;
    }
    .pqigst{
        padding-right: 5% !important;
    }
    .exitoText{
        font-size: 25px !important;
        padding-right: 5% !important;
    }
    .logoN{
        max-width: 55%;
        height: auto;
        margin-top: 85% !important;
    } 
   

 }
  /*Para cuando pantalla MENOR a 1200*/
 @media only screen and (max-width: 1200px) {
    
    .divcartas{
        padding-bottom: 15%;
    }
    
    
}
/*Para cuando pantalla MENOR a 991*/
@media only screen and (max-width: 991px) {
    .imgChava{
        max-width: 100% ;
    }
}
 /*-------Cambia-------unico*/
 @media only screen and (min-width: 993px){
    .serviciosTitle{
        color: #45a7a9;
        justify-content: center;
        font-weight: bold;
        display: flex;
        font-size: 107px;
    }
 }
 /*-------Cambia-------unico*/
 @media only screen and (max-width: 993px){
    .serviciosTitle{
        font-size: 75px;
        
    }
    .coluPreguntas{
        margin-right: -5%;
    }
 }
@media only screen and (min-width: 992px){
    li:last-child {
        margin-bottom: -30px;
    }
    .imgChava {
        max-width: 116%;
    }
}





ul.navbar-nav > li {padding: 0px 0px 0px 15px; text-align: center;}
ul.navbar-nav.espaceNav > li {padding: 3px 8px 0px 11px;}
ul.navbar-nav.espaceNav > li.icono { padding-top: 0px;}
.logo-bar {padding-top: 22px;}
#header.small-header .social-bar{ display: none; } 
#header.small-header .logo-bar{ padding-top: 0px; } 
@media only screen and (max-width: 991px) {
    .logo-bar {
        padding-top: 0px;
    }
}


.sofertas { background-color: #f4f3f3; }
.sofertas h2.title{ color: #0f5f61; }
.sofertas h2.subtitle{ color: #464646; }
.sofertas .textoOferta h3 { color: #45a7a9; padding-bottom: 20%;}

.sofertas.green{ background-color: #45a7aa; }
.sofertas.green h2.title{ color: #fff; }
.sofertas.green p.subtitle{ color: #fff; }
.sofertas.green .textoOferta h3 { color: #45a7a9; }
.sofertas.green .bordesup {     background-color: #1c9292; }
.sofertas.green .bordeinf {     background-color: #1c9292; }
.sofertas.green .botonop  { color: white !important; border-color: white !important; }
.sofertas.green .botonop.active  {      background: white !important; color: black !important; border-color: white !important; }
.sofertas.green .imagebot {background: url(<?=WEBROOT?>public/assets/gr.png); background-size: 100% 100%;}
.sofertas.green .imagebot img{opacity: 0;}
