:root{
	--heavy-blue:#0B1217; 
	--dark-blue:#15242E;
	--navy-blue:#375875;
	--light-blue:#688EA1;
  --crystal-blue:#D7EBEF;
	--light:#ffffff;
	--dark:#000000;
  --backgroundModal:rgba(0,0,0,0.8);

	--maxWidth:1080px;

  --fontWeightLight:100;
  --fontWeightRegular:400;
  --fontWeightBold:700;

  --fontsizeTitle:32px;
  --fontsizeTitle_:28px;
  --fontsizeSubtitle:24px;
  --fontsizeSubtitle_:20px;
  --fontsizeRegular:16px;
  --fontsizeRegular_:12px;

}

/* * { box-sizing:border-box; font-family: century-gothic, sans-serif; } */
* { box-sizing:border-box;font-family: 'Century Gothic Paneuropean', sans-serif; }
body { padding: 0;margin:0;}
.container{ max-width:var(--maxWidth); margin:0 auto;width:90%; }
section{padding:100px 0;}
p,a{font-weight: var(--fontWeightRegular);font-size: var(--fontsizeRegular);}
h1{font-size:var(--fontsizeTitle);}
h2{font-size:var(--fontsizeTitle_);}
h3{font-size:var(--fontsizeSubtitle);}
h4{font-size:var(--fontsizeSubtitle_);}
h5{font-size:var(--fontsizeRegular);}
h6{font-size:var(--fontsizeRegular_);}


@media(max-width:460px){
  h1{font-size:smaller;}
}

a.conocer{display:inline-block;margin-top:50px;color:var(--light);text-decoration:none;position: relative;}
a.conocer:after{content:'';position:absolute;bottom:-10px;left:0;width:100%;height:1px;background-color: var(--light);}

@media(max-width:940px){
  section{padding:50px 0;}
}
section.contruction{height:50vh;display: flex; align-items: center;justify-content: center;flex-direction: column;}
section.heavyblue{background-color: var(--heavy-blue);}
section.darkblue{background-color: var(--dark-blue);}
section.navyblue{background-color: var(--navy-blue);}
section.lightblue{background-color: var(--light-blue);}
section.dark{background-color: var(--dark);}

/*header*/
header{background-color:var(--dark-blue);padding:20px; }
header .container{display:grid;padding-left:0;display:grid;grid-template-columns: 1fr 5fr;align-items:center;}
header .container .logoContainer{width:100%;text-align: center;}
header .container .logoContainer img{width:100%;max-width:50px;margin:0 auto;}
header .container .menuContainer{display: grid;align-content: center;justify-content: end;}
header .container .menuContainer input[type=checkbox]{display:none;}
header .container .menuContainer input[type=checkbox] + label{z-index:10;float:right;display:none;width:30px;height:30px;position: relative;}
header .container .menuContainer input[type=checkbox] + label:hover{cursor:pointer;}
header .container .menuContainer input[type=checkbox] + label:after,
header .container .menuContainer input[type=checkbox] + label:before
{content:'';width:30px;height:3px;background-color: var(--light);position: absolute;left:0;transform-origin: center;transition:all 300ms ease-in-out;}
header .container .menuContainer input[type=checkbox] + label:before{top:20px;}
header .container .menuContainer input[type=checkbox] + label:after{bottom:20px;}
.overlay{position: fixed; top: 0;left: 0;width: 100%;height: 100%; opacity: 0;visibility: hidden;transition: opacity .35s, visibility .35s, height .35s;overflow: hidden;background: black;z-index: -1;}

header .container .menu{transition:all 300ms ease-in-out;padding:0;margin:0;list-style: none;display: flex;flex-direction: row;grid-gap:25px;}
header .container .menu a{color:var(--light);text-decoration: none;}

@media(max-width:940px){
	header{left:0;display:grid;width:100%;height:100px;padding:10px;}
  header .container{grid-template-columns: 1fr 5fr;}
  
  header .container .logoContainer{text-align: left;max-width: 50px;}
  header .container .menuContainer{position: relative;    align-content: center;justify-content: end;}
  header .container .menuContainer input[type=checkbox] + label{display:block;}
  header .container .menuContainer .menu{position:fixed;top:0;right:-100%;width:250px;height:100vh !important;padding:100px 10px 20px 20px;background:var(--dark-blue);z-index: 1;flex-direction: column; justify-content: start !important;}
  
  header .container .menuContainer input[type=checkbox]:checked + label:after{transform: translate(0, 5px) rotate(45deg);}
  header .container .menuContainer input[type=checkbox]:checked + label:before{transform: translate(0, -6px) rotate(-45deg)}
  header .container .menuContainer input[type=checkbox]:checked + label ~ .menu{right:0;}
  header .container .menuContainer input[type=checkbox]:checked + label ~ .overlay{visibility: visible;opacity: 0.4;}
}

/*footer*/
footer{background-color: var(--dark);padding:100px 0;}
footer .container{display:grid;grid-template-columns: repeat(5,1fr);}
footer .container .footerCard:nth-child(1) img{max-width: 170px;}
footer .container .footerCard ul{padding:0 0 30px 0;margin:0;}
footer .container .footerCard ul li{margin:20px 0;}
footer a{text-decoration: none;color:var(--light);}
footer .copyrightContainer{text-align: center;color:var(--light);}
@media(max-width:940px){
  footer{padding:50px 0;}
  footer .container{display:grid;grid-template-columns: 1fr;}
  footer .container .footerCard:nth-child(1){text-align: center;}
  footer .container .footerCard{padding:20px 0;}
  footer .container .footerCard ul{padding:0;}
}

/* 
  **************************
  **************************
        index / home
  **************************
  **************************
*/

/*header INDEX*/
header.index{z-index:10;position: absolute;top:0;left:5%;width:25%;transition: all 300ms;height:100vh;}
header.index .container{display:flex;flex-direction: column;height: 100%;justify-content: center;padding-left:20px;}
header.index .container .logoContainer{width:100%;text-align: center;}
header.index .container .logoContainer img{width:100%;max-width:150px;margin:0 auto;}
header.index .container .menu{flex-direction: column;height: 50vh;justify-content: space-evenly;}
header.index .container .menu a{font-size:1.5rem;}
@media(max-width:940px){
	header.index{left:0;display:grid;width:100%;height:100px;padding:10px;}
  header.index .container{padding-left:0;display:grid;grid-template-columns: 1fr 5fr;}
  header.index .container .logoContainer{text-align: left;max-width: 50px;}
  header.index .container .menu a{font-size:1.2rem;}
}

/*CAROUSEL INDEX*/
/* Slideshow container */
.slideshow-container-main{padding:0;	overflow:hidden; width:100%;height:100vh;display: flex;  flex-direction: column;  align-items: center;}
.slideshow-container {  width: 100%; height:100%; position: relative;}
.mySlides {display: none;height: 100%;background-size:cover;background-position: center; }
.mySlides:nth-child(1){background-image: url("../assets/OLICER-slider-1.png");}
.mySlides:nth-child(2){background-image: url("../assets/OLICER-slider-1.png");}
.mySlides:nth-child(3){background-image: url("../assets/OLICER-slider-1.png");}
.mySlides:nth-child(4){background-image: url("../assets/OLICER-slider-1.png");}
.mySlides:nth-child(5){background-image: url("../assets/OLICER-slider-1.png");}
.mySlides:nth-child(6){background-image: url("../assets/OLICER-slider-1.png");}
.show { display: block;}
.mySlides .container-text{display:grid; align-items:center; justify-content:center;    align-content: center;  width:70%;height: 100%;margin: 0 0 0 30%;height: 100%;}
.mySlides .titleContainer{max-width: 460px;text-align: center;}
.mySlides .titleContainer h1{font-weight:var(--fontWeightLight);font-size:3rem; text-transform: uppercase;color: var(--light);}
.mySlides .buttonContainer{text-align: center;}
.mySlides .button-rubro{ border:1px solid transparent; color: var(--light); padding: 15px 35px;text-align: center;  background: var(--dark-blue);text-decoration: none;}
.mySlides .button-rubro:hover{background:transparent; border: 1px solid var(--light); color:var(--light); transition: all 300ms ease-in-out; }

/* Next & previous buttons */
.buttons {position: absolute;bottom: 5%;right:5%;display:grid;grid-template-columns: 1fr 1fr;;}
.prev, .next { font-size:var(--fontsizeSubtitle_); border:1px solid var(--light); padding: 10px 25px;color: var(--light);  font-weight: var(--fontWeightBold); transition: 0.6s ease;  user-select: none;}
.buttons span:hover { border:1px solid var(--dark-blue); cursor: pointer; color: var(--light);  user-select: none;   background-color: var(--dark-blue); }

.fade {
  -webkit-animation-name: fade;
  -webkit-animation-duration: 1s;
  animation-name: fade;
  animation-duration: 1s;
}

@-webkit-keyframes fade {
  from {opacity: .6}
  to {opacity: 1}
}

@keyframes fade {
  from {opacity: .6}
  to {opacity: 1}
}
@media(max-width:940px){
  .mySlides .container-text{width:100%;margin:0;grid-gap:50px;}
  .mySlides .titleContainer{text-align: center;}
}
@media(max-width:768px){
  .buttons {width:100%;left:0;justify-content:center;grid-template-columns: 75px 75px;}
}

.textSection .container{display:grid;grid-template-columns: 1fr 2fr;align-items: center;}
.textSection .container .titleContainer{max-width: 90%;}
.textSection .container .titleContainer h2{font-weight:var(--fontWeightLight);font-size:2rem;color:var(--dark);}
.textSection .container .titleContainer h2 b{font-weight:var(--fontWeightBold);}
.textSection .container .descriptionContainer{max-width:70%;}
.textSection .container .descriptionContainer p{font-size:1rem;color:var(--dark);}
.textSection .ctaSection {text-align: center;padding-top:25px;}
.textSection .ctaSection a{font-weight:var(--fontWeightRegular);color: var(--light); font-size: 1.5rem;padding: 15px 35px;text-align: center;  background: var(--dark-blue);text-decoration: none;}

@media(max-width:940px){
  .textSection .container{grid-gap:0;grid-template-columns: 1fr;text-align: center;}
  .textSection .container .titleContainer{max-width: 100%;}
  .textSection .container .descriptionContainer{max-width:100%;}
}
@media(max-width:460px){
  .textSection .container .titleContainer h2{font-size:1.5rem;}
}

.nosotrosSection{background-color: var(--navy-blue);color:var(--light);}
.nosotrosSection .container{display:grid;grid-template-columns: 1fr 2fr;align-items: center;}
.nosotrosSection .container .titleContainer{max-width: 90%;}
.nosotrosSection .container .titleContainer h3{font-size:1.5rem;}
.nosotrosSection .container .descriptionContainer{max-width: 70%;}
@media(max-width:940px){
  .nosotrosSection .container{grid-gap:0;grid-template-columns: 1fr;}
  .nosotrosSection .container .titleContainer{max-width:100%;}
  .nosotrosSection .container .descriptionContainer{max-width:100%;}
}


.serviciosSection{background-color: var(--dark);background-image: url(../assets/inicio-servicio-portada.png);
background-position: 100%;background-size:contain;background-size: contain;
background-repeat: no-repeat;}
.serviciosSection .container .textContainer{max-width: 50%;color:var(--light);}
.serviciosSection .container .textContainer h3{font-size:1.5rem;font-weight: var(--fontWeightBold);margin-bottom:50px;}
.serviciosSection .container .textContainer p{font-size:1rem;line-height: 30px;}
@media(max-width:940px){
  .serviciosSection{padding:200px 0 50px 0;background-position-y:-200px;background-position-x:50%;background-size:auto;}
  .serviciosSection .container .textContainer{max-width:100%;margin:0 auto;width:100%;}
}
@media(max-width:640px){
  .serviciosSection{background-position-y:-150px;}
}

.serviciosGridSection .container{display:grid;grid-template-columns: repeat(5,1fr);grid-gap:15px;}
.serviciosGridSection .container .serviceCard{width:100%;}
.serviciosGridSection .container .serviceCard img{width:100%;max-width: 200px;margin:0 auto;}
@media(max-width:768px){
  .serviciosGridSection .container{display:grid;grid-template-columns: 1fr;}
  .serviciosGridSection .serviceCard{text-align: center;}
}

.video{padding:100px 0;text-align: center; background-color: var(--dark-blue); background-image: url(../assets/OLICER-slider-1.png);background-position: center;background-size: cover;}
.video p{color:var(--light);font-size:var(--fontsizeTitle);}
.video button{background-color: transparent;border:0;outline:none;}
.video button:hover{cursor:pointer;}

/* The Modal (background) */
.modal {display: none; position: fixed; z-index: 1;left: 0;top: 0;width: 100%;height: 100%;overflow: auto;background-color: var(--backgroundModal);}
.modal-content { margin: 5% auto;  padding: 20px;width: 80%; max-width: 600px; }
.modal-content .close {color: var(--light);display:block; text-align: right;  font-size: var(--fontsizeTitle);font-weight: var(--fontWeightBold);padding:0 0 10px 0;}
.modal-content .close:hover,.modal-content .close:focus {color: var(--light-blue);text-decoration: none;cursor: pointer;}
.modal-content .video-responsive {max-width:560px;background-color: var(--light-blue); height: 0;overflow: hidden;position: relative; padding-bottom: 56.25%;padding-top: 30px;} 
.modal-content .video-responsive iframe, 
.modal-content .video-responsive object, 
.modal-content .video-responsive embed {height:calc(100% - 40px);width: calc(100% - 40px);left: 0;position: absolute;top: 0;margin:20px;}

/*
  *************************
  *************************
          global
  *************************
  *************************
*/
.bannerText{padding:50px 0;}
.bannerText .container{max-width: 640px;margin:0 auto;color:var(--light);}
.bannerText h4{font-weight: var(--fontWeightBold);}
.bannerText p{font-weight: var(--fontWeightLight);}
.bannerImage{height:60vh;background-repeat: no-repeat;background-size: cover;background-position: center;}
@media(max-width:768px){
  .bannerImage{height:35vh;}
}

/* 
  **************************
  **************************
          nosotros
  **************************
  **************************
*/

#nosotros .bannerImage{background-image: url(../assets/nosotros-portada.png);}

.bannerNosostros .container{display:grid;color:var(--light);grid-template-columns: 200px auto;}
.bannerNosostros .container h2{margin:0;text-transform: uppercase;}
.bannerNosostros .container p{grid-row-start:2;grid-row-end:3;grid-column-start: 2;grid-column-end: 3;}
@media(max-width:768px){
  .bannerNosostros .container{grid-template-columns: 1fr;}
  .bannerNosostros .container p{grid-row-start: 2;grid-row-end:3;grid-column-start: 1;grid-column-end: 2;}
}



/* 
  **************************
  **************************
          contacto
  **************************
  **************************
*/
#contacto .bannerText{text-align: center;}
#contacto .heavyblue .container{ display:grid; grid-template-columns: 1fr 1fr; grid-gap:50px; max-width:640px;align-items:center ;}

#contacto .containerContacto a{text-decoration:none;  display:grid; grid-template-columns: 40px 1fr; grid-gap:30px; margin:0 0 25px 0; justify-content: start; align-items: center; }
#contacto .containerContacto a img{ width:100%; max-width: 35px; }
#contacto .containerContacto a p{font-size:var(--fontsizeSubtitle_); color:var(--light); width:100%; margin:0; }

#contacto .containerForm form{width:100%;text-align: center;} 
#contacto .containerForm input[type="text"],
#contacto .containerForm input[type="email"],
#contacto .containerForm input[type="phone"],
#contacto .containerForm textarea{ background-color: transparent; color:var(--light); margin:0 auto 25px auto;border:1px solid var(--light); outline:0; width: calc(100% - 2px); padding:10px 15px; } 
#contacto .containerForm textarea{ height:100px; resize:none;margin-bottom: 0; } 
#contacto .containerForm input[type="submit"]{ font-size:var(--fontsizeSubtitle_); padding:10px 15px; width:70%; background-color: var(--crystal-blue); transition: all 300ms ease-in-out; font-weight: var(--fontWeightBold); color:var(--dark-blue); border:1px solid transparent; } 
#contacto .containerForm input[type="submit"]:disabled{ opacity: .5; } 
#contacto .containerForm input[type="submit"]:disabled:hover{ cursor: none; background-color: var(--crystal-blue); color:var(--dark-blue); border:1px solid transparent; } 
#contacto .containerForm input[type="submit"]:hover{ cursor:pointer; background-color: transparent; color:var(--crystal-blue); border:1px solid var(--light-blue); } 
#contacto .containerForm h3{ margin-top:0; text-align: center; font-weight: var(--fontWeightLight);color:var(--light); } 
#contacto .containerForm input.error{border:1px solid red;}
#contacto .containerForm input.valid{border:1px solid #089404;}
#contacto .containerForm .check_container{ color:var(--light);display:grid;grid-template-columns: 25px 1fr;max-width:80%;margin:0 auto;}
#contacto .containerForm .check_container a{color:var(--light);}
#contacto .containerForm #formulario_response{color:var(--light);}

.lds-dual-ring{opacity:0; display: inline-block;width: 25px;height: 25px;}
.lds-dual-ring.active{opacity: 1;}
.lds-dual-ring:after {
  content: " ";
  display: block;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  border: 6px solid var(--light-blue);
  border-color: var(--light-blue) transparent var(--light-blue) transparent;
  animation: lds-dual-ring 1.2s linear infinite;
}
@keyframes lds-dual-ring {
  0% {transform: rotate(0deg);}
  100% {transform: rotate(360deg);}
}


@media(max-width:768px){
  #contacto .heavyblue .container{grid-template-columns:1fr;}
  #contacto .containerContacto{max-width:70%;margin:0 auto;}
  #contacto .containerContacto a{grid-template-columns: 20px 1fr;}
}

#contacto #bolsa-de-trabajo{background-image: url("../assets/contacto-portada.png");background-repeat:no-repeat; background-position:center; background-size: cover; background-color:var(--light); }
#contacto #bolsa-de-trabajo .container .textContainer{ max-width: 360px;   }
#contacto #bolsa-de-trabajo .container .textContainer span{ font-size:var(--fontsizeSubtitle_);   }
#contacto #bolsa-de-trabajo .container .textContainer a{ color:var(--dark);text-decoration: none;   }
@media(max-width:460px){
  #contacto #bolsa-de-trabajo{background-position:75% -105px; background-size: 850px; }
  #contacto #bolsa-de-trabajo .container .textContainer{ padding:50vh 0 0 0; }
}



/* 
  **************************
  **************************
          proyectos
  **************************
  **************************
*/
#proyectos .light{padding:0;display:grid;grid-template-columns: 1fr 1fr;align-items:center;}
#proyectos .light img{max-width: 730px;width: 100%;}
#proyectos .light .containerText{width: 80%;line-height:25px;}
@media(max-width:820px){
  #proyectos .light{grid-template-columns: 1fr;}
  #proyectos .light .containerText{margin:25px auto;}
}

#proyectos .gridProyectos .row{display:grid;grid-template-columns: 1fr 1fr;align-items:center;margin-bottom:50px;overflow:hidden;}
#proyectos .gridProyectos .row .card{max-width:630px;width:100%;margin:0 auto;}
#proyectos .gridProyectos .row .card img{width:100%;display:block;}
#proyectos .gridProyectos .row .card p{background: var(--dark-blue);color:var(--light);text-align: right;width:100%;padding:10px 20px;margin:0;}
#proyectos .gridProyectos .row:nth-child(even) .card{grid-column-start: 2;grid-column-end: 3;}
#proyectos .gridProyectos .row:nth-child(even) .textContainer{ max-width:90%; grid-column-start: 1;grid-column-end: 2; grid-row-start: 1; grid-row-end:2; justify-self: center;}

@media(max-width:768px){
  #proyectos .gridProyectos .row{grid-template-columns: 1fr;}
  #proyectos .gridProyectos .row:nth-child(even) .card{grid-column-start: 1;grid-column-end: 2;}
  #proyectos .gridProyectos .row:nth-child(even) .textContainer{ width:100%;grid-row-start: 2; grid-row-end:3; justify-self: center;}
}

#proyectos .lightblue .container{max-width:560px;color:var(--light);}