html, body { width:100%; height:100%; color:#fff;  background: #f6f6f6;  overflow-x: hidden;
    overflow-y: auto; font-family: 'Source Sans Pro', sans-serif; scroll-behavior: smooth; overflow-x:hidden; }
header { background:none; width: 100%; height: 150px; position: fixed; z-index: 100; background: #cfc3e8;  }
header { position: relative; display:inline-block; vertical-align:middle; }
section { width:100%; height:100%; position: relative;  background:none;  }
footer { width:100%; height:auto; padding: 80px 0; background:#f60 url(img/footer.jpg) no-repeat center center !important;  font-size:18px; }
footer a { color:#f05868; margin:10px 0;  display:inline-block; text-decoration:none; }
footer a:hover { color:#f05868; letter-spacing: 1px;}
footer a img { 
-webkit-filter: drop-shadow(1px 1px 0 #f05868) 
                    drop-shadow(-1px -1px 0 #f05868);
    filter:drop-shadow(1px 1px 0 #f05868) 
           drop-shadow(-1px -1px 0 #f05868);

 }
 html {
  scroll-behavior: smooth;
}
h1, h2, h3, h4, h5, h6 { font-family: 'Source Sans Pro', sans-serif; font-weight: 700; }
h1, h2, h3, h4, h5, h6, a, video, header, footer, section, .btn-green  {  transition: all .5s; }
a:hover { text-decoration: none; }

.boton_l { cursor: pointer; border: red solid 2px; }

#alianzas { color:#000; }
.am { display:block; width:300px; margin:0 auto; }

.licencia { border-top: rgba(255, 255, 255, .7) solid 1px; margin-top:30px; padding-top:30px; font-size:16px; }

.top { position:fixed; z-index:24500000000 !important; right:25px; bottom:25px; }
/*.top:hover { opacity: .3;}*/
.top img { width:65px; }
.btn-lg { display: block; font-size:14px !important; margin-top:10px; }
.aviso-cookies {  display: none;  background: rgba(0, 0, 0, .7);  padding: 20px;  width: 100%; 
  line-height: ;  position: fixed;  bottom: 0px;  left: 0px;  z-index: 100;  padding-top: 20px; color:#fff; text-align:center; }
.aviso-cookies a { color: #fff !important; }
.aviso-cookies.activo {  display: block; }
.aviso-cookies .titulo,
.aviso-cookies .parrafo {  margin-bottom: 15px; }
.aviso-cookies a.enlace {
  width: auto;  color: #fff;
  border: none;  background: #f05868;
  text-align: center;
  padding: 15px 20px;
  font-weight: 700;
  cursor: pointer;
  transition: .3s ease all;
  border-radius: 5px;
  margin-bottom: 15px;
  font-size: 22px;
  display: inline-block;
  text-decoration:  none;
}

.aviso-cookies .boton {
  width: auto;  color: #f05868;
  border: none;  background: #cfc3e8;
  text-align: center;
  padding: 15px 20px;
  font-weight: 700;
  cursor: pointer;
  transition: .3s ease all;
  border-radius: 5px;
  margin-bottom: 15px;
  font-size: 22px;
  display: inline-block;
}

.fondo-aviso-cookies.activo {
    display: block;
}
.fondo-aviso-cookies {
    display: none;
    background: rgba(0, 0, 0, .7);
    position: fixed;
    z-index: 99;
    width: 100vw;
    height: 100vh;
    top: 0;
    left: 0;
}

.pull_ { padding-left:65px !important; }

.burger { position:absolute; top:25px; right:25px; cursor: pointer; z-index: 9999999;   }
.logo { margin: 35px; z-index: 9999999; position: relative; display:inline-block; vertical-align:middle; }
#menu_ { background: rgba(0,0,0,0.7); position: absolute; top: -100px; left: 0; width: 100%; height: 100px; z-index: 9999; transition:all 400ms ease; }
#menu_ ul { width: auto; padding: none; margin-left: 180px; padding-top: 35px; font-weight: 600; }
#menu_ ul li { list-style: none; display: inline-block; margin-right: 5px;  }
#menu_ ul li a { color: #fff; text-decoration:none; }
#menu_ ul li a:hover { color: #f05868; text-decoration: none; }
.listo { margin-top: 100px; left: 0;  z-index: 99; transition:all 400ms ease; }
.active { color: #f05868 !important; }

.btn-green { background:#f05868; color:#fff; padding:10px 15px; font-size:16px; }
.btn-green:hover { background:#7d4b90 !important; }
.logo-foo { width:75%; }
.redes { position:absolute; right:20px; top:20px; text-align: right; }
.index video { width:100%;  }
button.flickity-prev-next-button.next { background: none; background-position:center; opacity:1; border-radius:0;  }
button.flickity-prev-next-button.previous { background: none; /*background: url(img/prev.png) no-repeat;*/ background-position:center; opacity:1; border-radius:0; }
button.flickity-prev-next-button.next .arrow { fill: #f05868; }
button.flickity-prev-next-button.previous .arrow { fill: #f05868; }

}


#toggle {
    list-style-type: none;
    margin: 0;
    padding:0;
    text-align:left;
    line-height:2.5em;
    font-size: 1.0em;
    text-transform:uppercase;
    font-style:normal;
}
#toggle li {
    padding:0;
    margin:0;
    vertical-align:top;
    float:left;
    position:relative;
}
#toggle li a {
    background-color:#222;
    margin:0 1px 0 0;
    padding:8px 17px;
    color:#fff;
    font-weight:300;
    text-decoration:none;
}
#toggle li ul {
    list-style-type: none;
    left:0;
    position:absolute;
    margin-top:-200px;
    transition:all 400ms ease;
}
#toggle li.open ul {
    margin-top:0px;
}

.menu {
  cursor: pointer;
  margin: 0 auto;
  padding-left: 1.25em;
  position: relative;
  width: 50px;
  height: 30px;
}
.menu-global {
  backface-visibility: hidden;
  position: absolute;
  left: 0;
  border-top: 7px solid #f05868;
  width: 100%;
  transition: 0.55s;
}
.menu-top {
  top: 0;
}
.menu-middle {
  top: 13px;
}
.menu-bottom {
  top: 26px;
}
.menu-top-click {
  backface-visibility: hidden;
  top: 15px;
  transform: rotate(50deg);
  transition: 0.55s 0.5s;
}
.menu-middle-click {
  opacity: 0;
}
.menu-bottom-click {
  backface-visibility: hidden;
  top: 15px;
  transform: rotate(-410deg);
  transition: 0.55s 0.5s;
}


/* INDEX */

.index { border-bottom: #fff solid 3px; padding: 140px 0 88px; position: relative; overflow: hidden; height:auto;  }
.index h1 { font-size: 65px; line-height: 60px; font-weight: 700; }
.index h1 > span { color:#f05868; }
.index .container { z-index:10; position:relative;  }
.index .container .col-lg-7 { background:rgba(0, 0, 0, .6); padding:25px; border-radius: 30px; }
.index .container .col-sm-7 { background:rgba(0, 0, 0, .6); padding:25px; border-radius: 30px; }
.index .pattern { position: absolute; z-index: 3; background: url(img/pattern.png) repeat ;
      top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; /* Esto asegura que el video cubra todo el contenedor */ }
.index video { position: absolute; z-index: 1;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      object-fit: cover; /* Esto asegura que el video cubra todo el contenedor */ }

.index_1 { background:url(img/pleca-index.jpg) no-repeat center center; -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover; 
border-bottom: #fff solid 3px; text-align: center; vertical-align: middle; height: 280px; padding-top: 125px;

   }
   /*
 .copy { border:#f05868 solid 2px; color:#f05868; font-weight: 700; padding: 10px 20px; width: 45% !important; margin: 0 auto; text-transform: uppercase; }
*/
video.vplay { position:relative; display: inline-block; width: 24.5%; z-index:9999999 !important; }
video.vplay:hover {  }
 
video.reel { position:relative; display: inline-block; width: 100%; }

.index_2 { background:url(img/index2_.jpg) no-repeat center center;
  background-size: cover;  /*background-attachment: fixed;*/
border-bottom: #fff solid 3px; text-align: center; vertical-align: middle; height: auto; padding: 75px 0;

   }

.boton-in { width: 45%; min-height: 450px; font-weight: 700;  transition:all 300ms ease; border-radius: 30px; position: relative; text-align: left; float: left; margin-right: 20px; margin-bottom: 30px; padding: 10px 10vh 0 10px; }
.boton-in:hover {  border:none; text-align: left; background:rgba(0, 0, 0, .4); }
.boton-in h3 { text-transform: uppercase; margin-bottom:20px; border-bottom:#f05868 solid 2px; padding-bottom:10px; }
.boton-in { font-weight:200; font-size:20px !important; }

figure { width: 80%; height: 50%; position: absolute; top: 120px; opacity: 0; font-style: italic; font-weight: 400;}
.boton-in:hover > figure { opacity: 1; }
figure a { color: black; font-weight: 700; }
figure a:hover { color: #fff; font-weight: 700; }

.galeria { background:url(img/galeria.jpg) no-repeat center center; -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover; 
border-bottom: #fff solid 3px; width: ; min-height: 906px; padding-top: 175px; padding-bottom: 175px;

   }

   .galeria h2 { color: #f05868; }

.videos { background:url(img/hugo.jpg) no-repeat center center;  background-size: cover; 
border-bottom: #fff solid 3px; width: ; height: auto; padding: 75px 0;}
.videos h3 { color:#ef5367 !important; font-size:18px;  }
.videos p { font-size:16px;  }

.hugo { background:url(img/hugo.jpg) no-repeat center center; -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover; 
border-bottom: #fff solid 3px; width: ; min-height: 906px; padding-top: 175px; padding-bottom: 175px;

   }

   .hugo h2 { color: #f05868; }
img.mosaico { display: inline-block; width: auto; height:100%; position:relative; }


.alianzas { padding:180px 5%; color:#7d4b90; height:auto; }

.alianzas h2 { font-size:43px; text-transform:uppercase; }
.alianzas p.copy { font-size:26px; max-width:690px; margin:15px auto; }
.alianzas p { font-size:22px; }
.alianzas span { font-size:82px; position:absolute; opacity:.2; font-weight:bold; top:0; left:0; }
.col-sm-4 { position:relative; font-size:22px; padding-top:75px; margin-bottom:90px; padding-left:90px; padding-right:65px; }

.alianza-logo { display:inline-block; vertical-align: top; width: 200px; margin:15px; border: rgba(125, 75, 144, .7) solid 3px; border-radius:25px;  }

/*NOSOTROS*/

.nosotros { background:url(img/nosotros.jpg) no-repeat center center; -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover; 
border-bottom: #fff solid 3px; padding-top: 25%; height: 1265px;
   }

.nosotros h1 { font-size: 65px; line-height: 60px; font-weight: 700; }
.nosotros span { color:#f05868; }



* { box-sizing: border-box; }

.carousel-main { width: 100%; height: 745px;}

.carousel {
  margin-bottom: 40px;
  width: 100%;
  height: 645px;
}

.carousel-cell {
  width: 100%;
  margin-right: 1px;
  counter-increment: carousel-cell;
  
}
.fade-fisa { height: auto !important; }
 
.fade-fisa .carousel-cell img {
  width: 100%; height: auto;
  
}

.avatar { width: 55px; height: 55px; float: left; position: relative; background: yellow; margin: 3px; }





#desc-slide { position: absolute; padding-left: 8%; padding-right: 25px; padding-bottom: 10px; top:325px; background: rgba(0,0,0,0.7); min-width:300px; height: auto; font-size: 18px; font-weight: 400;   }
#desc-slide h1 { font-size: 4.8em; text-transform: uppercase; margin-top: 10px; }

.carousel-nav {
 height: auto; margin-top: -150px; width: auto; text-align: right; 
}

.carousel-nav .carousel-cell {
  height: 20px;
  width: 20px;
  border:#fff solid 1px; margin: 0 2px;
}

.carousel-nav .carousel-cell:before {
 
}

.carousel-nav .carousel-cell.is-nav-selected {
  background: #ED2; border:#ED2 solid 2px;
}

.carousel-nav .previous { display: none;}
.carousel-nav .next { display: none;}



/* CONTACTO */


.pleca_map { position: relative; }
.pleca_map h1 { position: absolute; color: #434343; top: 300px; left: 10%; font-weight: 700; font-size: 65px; }

.contacto { background:url(img/contacto.jpg) no-repeat center center; -webkit-background-size: cover;
  -moz-background-size: cover;  -o-background-size: cover;
  background-size: cover; border-bottom: #434343 solid 8px; color:#434343; border-top: #434343 solid 12px;  padding-top: 50px; min-height: 900px;
   }
.contacto h2 { font-weight: 600px:; font-size:30px; margin-bottom: 25px;  }

.contacto b { font-size: 18px; }




/* SHADOWBOX MODAL */


/* The Modal (background) */
.modal {
  display: none;
  position: fixed;
  z-index: 1;
  padding-top: 100px;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  overflow: auto;
  background-color: black;
  transition:all 0.2s ease;  
}

/* Modal Content */
.modal-content {
  position: relative;
  background-color: #fefefe;
  margin: auto;
  padding: 0;
  width: 90%;
  max-width: 1200px;
}

/* The Close Button */
.close {
  color: #fff !important;
  position: absolute;
  top: 60px;
  right: 5%;
  font-size: 35px;
  font-weight: bold;
  z-index: 99999999999999;
}

.close:hover,
.close:focus {
  color: #999;
  text-decoration: none;
  cursor: pointer;
}

.mySlides {
  display: none;
   transition:all 0.2s ease;  
}

/* Next & previous buttons */
.prev {
  cursor: pointer;
  position: absolute;
  top: 50%;
  width: auto;
  padding: 16px;
  margin-top: -50px;
  color: #fff;
  font-weight: bold;
  font-size: 20px;
  transition: 0.6s ease;
  border-radius: 0 3px 3px 0;
  user-select: none;
  -webkit-user-select: none;
}

.next {
    cursor: pointer;
    position: absolute;
    top: 50%;
    width: 60px;
    padding: 16px;
    margin-top: 0;
    color: #fff;
    font-weight: bold;
    font-size: 20px;
    transition: 0.6s ease;
    border-radius: 0 3px 3px 0;
    user-select: none;
    -webkit-user-select: none;
}



/* Position the "next button" to the right */
.next {
  right: 0;
  border-radius: 3px 0 0 3px; background: red;
}

/* On hover, add a black background color with a little bit see-through */
.prev:hover,
.next:hover {
  background-color: rgba(0, 0, 0, 0.8);
}

/* Number text (1/3 etc) */
.numbertext {
  color: #f2f2f2;
  font-size: 12px;
  padding: 8px 12px;
  position: absolute;
  top: 0;
}

.caption-container {
  text-align: center;
  background-color: black;
  padding: 2px 16px;
  color: #fff;
}

img.demo {
  opacity: 0.6;
}

.active,
.demo:hover {
  opacity: 1;
}

img.hover-shadow {
  transition: 0.3s; width: 55px; height: 55px; position: absolute; 
}

.hover-shadow:hover {
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

.dropdown {
    position: relative;
    display: inline-block;
    margin-right: 10px;
}
.dropdown:hover {
    color: #f05868;
    cursor: pointer;
}

.dropdown-content {
    display: none;
    position: absolute;
    min-width: 310px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    padding: 12px 16px 0 0;
    z-index: 1;
}

.dropdown:hover .dropdown-content {
    display: block;
}

input { border: black solid 1px; float: left; width: 100%; height: 32px; background: none; padding: 4px; margin-bottom: 15px; }
.enviar { background: black; color:#fff; text-align: left; }


 /* Custom, iPhone Retina */ 
    @media only screen and (max-width : 680px) {

      .index_2 {  height: auto; padding-top: 25px; }
      .boton-in { width: 40%; height: 100px; border: #fff solid 1px; text-align: left; float: left; margin-right: 20px; margin-bottom: 30px; }
      .boton-in:hover { width: 40%; height: 150px; }

footer { width:100%; height:auto; background: url(img/footer.jpg) no-repeat center center; -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover; padding-top: 20px;   }

#desc-slide { position: absolute; padding-left: 3%; padding-right: 25px; padding-bottom: 10px; top:325px; background: rgba(0,0,0,0.7); min-width:300px; height: auto; font-size: 18px; font-weight: 400;   }
#desc-slide h1 { font-size: 2.8em; text-transform: uppercase; margin-top: 10px; }
.contacto { height: auto; }
  
    
        
    }



 /* Custom, iPhone Retina */ 
    @media only screen and (max-width : 580px) {

    	.index  { text-align: center; padding-top: 100px; }
    	.index img  { margin-top: 50px; }
    	.copy { width: 80% !important; }
    	.index_2 {  height: auto; padding-top: 25px; }
    	.boton-in { width: 100%; height: auto; padding-bottom: 75px; border: #fff solid 1px; text-align: left; float: left; margin-right: 20px; margin-bottom: 30px; }

.boton-in:hover { width: 100%; height: 150px; }

footer { width:100%; height:auto; background:url(img/footer.jpg) no-repeat center center; -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover; padding-top: 20px;   }


  
    
        
    }


 @media only screen and (max-width : 800px) {
#menu_ { background: rgba(0,0,0,0.7); position: absolute; top: -450px; left: 0; width: 100%; height: 450px; z-index: 9999; transition:all 400ms ease; }
#menu_ ul { width: auto; padding: none; margin-left: 100px; padding-top: 35px; font-weight: 600; }
#menu_ ul li { list-style: none; display: inline-block; margin-right: 0px; width: 50%;  }
#menu_ ul li a { color: #fff; font-size: 18px;  }
#menu_ ul li a:hover { color: #f05868; text-decoration: none; }
.listo { margin-top: 450px; left: 0;  z-index: 9999; transition:all 400ms ease; }
.active { color: #f05868 !important; }


.dropdown {
    position: relative;
    display: block;
    margin-right: 10px;
    font-size: 18px;
}
.dropdown:hover {
    color: #f05868;
    cursor: pointer;
}

.dropdown-content {
    display: none;
    position: inherit;
    min-width: 310px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    padding: 1px 16px 0 10px;
    z-index: 1;
}

.dropdown:hover .dropdown-content {
    display: block;
}

}


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

.index h1 {
    font-size: 42px;
    line-height: 50px;
    font-weight: 700;
}
.sucursales .gatito {
    object-fit: cover;
    position: absolute;
    top: 0;
    left: -45% !important;
    width: auto !important;
    height: 100% !important;
    z-index: 1;
    opacity: .2;
}

.col-sm-4 {
    position: relative;
    font-size: 22px;
    padding-top: 35px;
    margin-bottom: 20px;
    padding-left: 10px;
    padding-right: 10px;
}

.index .container .col-lg-7 {
    background: rgba(0, 0, 0, .6);
    padding: 3%;
    border-radius: 20px;
    margin: 5% !important;
    width: 90% !important; 
}

video.vplay {
    position: relative;
    display: inline-block;
    width: 49.5%;
    z-index: 9999999 !important;
}


.mosaico { float:left; width:100%; }
#menu_ { background: rgba(0,0,0,0.7); position: absolute; top: -450px; left: 0; width: 100%; height: 450px; z-index: 9999; transition:all 400ms ease; }
#menu_ ul { width: auto; padding: none; margin-left: 100px; padding-top: 35px; font-weight: 600; }
#menu_ ul li { list-style: none; display: block; margin-right: 0px;  }
#menu_ ul li a { color: #fff; font-size: 18px;  }
#menu_ ul li a:hover { color: #f05868; text-decoration: none; }
.listo { margin-top: 450px; left: 0;  z-index: 9999; transition:all 400ms ease; }
.active { color: #f05868 !important; }
.logo { width:110px; margin-left:10px; margin-right:45px; }
header { padding:10px; }
.btn-green { background:#f05868; color:#fff; padding:10px 15px; font-size:12px; }

footer .container .row div { margin-bottom:35px; }
}


       @media only screen and (max-width : 320px) {
         footer iframe { display: none; }
        
    }
