@import url("fonts.css");
@import url("icons.css");

:root {
    --primary-rgb: 0, 130, 202;
    --primary: rgb(0, 130, 202) !important;
    --primary-light: rgba(0, 130, 202,.15);
    --primary-regular: rgba(0, 130, 202,0.4);
    --primary-medium: rgba(0, 130, 202, 0.6);
    --primary-dark: rgba(0, 130, 202, 0.8);
    --secondary:rgb(111, 114, 113);
    --secondary-dark:rgba(111, 114, 113,0.8);
    --secondary-medium:rgba(111, 114, 113,0.6);
    --secondary-regular:rgba(111, 114, 113,.4);
    --secondary-light:rgba(111, 114, 113,.15);
    --light: rgb(255, 255, 255);
    --eco:rgb(25, 135, 84);
    --shadow:rgba(0, 0, 0, .4);
    --gutter-x:0.75rem;
    --alternative: rgb(0, 22, 137);
}


html,body{font-family:'DIN Next LT Pro',sans-serif;font-weight:normal;color:var(--secondary);background-color:#FFF;position:relative}
a.link{color:var(--primary);text-decoration:none;border-color:var(--primary);border-bottom:1px dotted}
a.link:hover{color:var(--primary);border-bottom:1px solid}
form,input,select,textarea,button{font-family:'DIN Next LT Pro',sans-serif;font-weight:normal!important}
.text-alternative{color:var(--alternative)!important}
.text-lg-width{max-width:720px}
.text-justify{text-align:justify;text-justify:inter-word}
.ft-primary {color: var(--primary)!important;}
.ft-light {color: var(--light)!important;}
.ft-eco {color: var(--eco)!important;}
.rounded-right{border-top-right-radius:50rem!important;border-bottom-right-radius:50rem!important}
.rounded-left{border-top-left-radius:50rem!important;border-bottom-left-radius:50rem!important}
.fx-rounded{border-top-left-radius:8rem;border-bottom-right-radius:8rem}
/*******************************************************************/
.bg-image{background-blend-mode:multiply;background-size:auto;background-position:top center}
.bg-primary{background-color:var(--primary)!important}
.bg-primary-medium{background-color:var(--primary-medium)!important}
.bg-regular{background-color:var(--secondary-regular)!important}
.bg-medium{background-color:var(--secondary-medium)!important}
.bg-dark{background-color:var(--secondary-dark)!important}
.bg-eco {background-color: var(--eco)!important;}
.bg-parallax {
    background-position: center center !important;
    background-size: cover !important;
    mix-blend-mode: multiply;
}
/*******************************************************************/
.form-control:-webkit-autofill,.form-control:-webkit-autofill:hover,.form-control:-webkit-autofill:focus,.form-control:-webkit-autofill:active{-webkit-transition-delay:99999s;-webkit-transition-property:background-color!important}
.form-control::-webkit-input-placeholder{opacity:.5}
.form-control::-moz-placeholder{opacity:.5}
.form-control:-ms-input-placeholder{opacity:.5}
.form-control::placeholder{opacity:.5}
.form-control{border-top:none;border-left:none;border-right:none;border-radius:0;padding-left:0;padding-right:0;background:none;border-bottom:1px solid;border-color:var(--secondary);color:var(--secondary);background-color:transparent}
.form-control:focus{color:var(--secondary);border-color:var(--primary);box-shadow:0 2px 0 0 var(--primary);background-color:transparent}
.input-with-icon{position:relative;vertical-align:middle}
.input-with-icon .form-control{padding-left:0}
.input-with-icon>.icon{position:absolute;top:7px;right:0;color:var(--secondary-medium)}
.was-validated input:invalid,.was-validated textarea:invalid,.form-control.is-invalid{border-bottom:1px solid var(--bs-danger);background-image:none!important}
.was-validated input:valid,.was-validated textarea:valid,.form-control.is-valid{border-bottom:1px solid var(--bs-success);background-image:none!important}
.was-validated input:focus,.was-validated textarea:focus,.form-control.is-invalid:focus{box-shadow:none!important;box-shadow:0 2px 0 0 var(--bs-danger)!important;background-image:none!important}
.was-validated input:valid:focus,.was-validated textarea:valid:focus,.form-control.is-valid:focus{box-shadow:none!important;box-shadow:0 2px 0 0 var(--bs-success)!important;background-image:none!important}
/*******************************************************************/
.btn-sm{padding-top:.4rem}
.btn-outline-primary{border-color:var(--primary);color:var(--primary)}
.btn-outline-primary:focus{border-color:var(--primary);box-shadow:0 0 0 3px var(--primary-light)!important}
.btn-outline-primary:hover,.btn-outline-primary:focus:hover{border-color:var(--primary);background-color:var(--primary)}
.btn-outline-primary:not(:disabled):not(.disabled).active,.btn-outline-primary:not(:disabled):not(.disabled):active,.show>.btn-outline-primary.dropdown-toggle{border-color:var(--primary);background-color:var(--primary-dark)}
.btn-outline-secondary{border-color:var(--secondary);color:var(--secondary)}
.btn-outline-secondary:focus{border-color:var(--secondary);box-shadow:0 0 0 3px var(--secondary-light)!important}
.btn-outline-secondary:hover,.btn-outline-secondary:focus:hover{border-color:var(--secondary);background-color:var(--secondary)}
.btn-outline-secondary:not(:disabled):not(.disabled).active,.btn-outline-secondary:not(:disabled):not(.disabled):active,.show>.btn-outline-secondary.dropdown-toggle{border-color:var(--secondary);background-color:var(--secondary-dark)}
.btn-outline-light.ft-eco{color:var(--light)!important}
.btn-outline-light:hover.ft-eco,.btn-outline-light:focus:hover.ft-eco{color:var(--eco)!important}
/*******************************************************************/
#navigation nav::after{content:"";background-color:#FFF;opacity:1;top:0;left:0;bottom:0;right:0;position:absolute;z-index:-1;-webkit-transition:opacity .5s ease 0s;transition:opacity .5s ease 0s}
#navigation.sticky nav::after{opacity:.95;box-shadow:0 0 .2rem var(--shadow)}
#navigation.reduce nav::after{opacity:.95}
#navigation .navbar{padding-top:0;padding-bottom:0}
#navigation .navbar-brand{padding:0;margin:0;width:220px;height:100px;-webkit-transition:all .5s ease 0s;transition:all .5s ease 0s;background-image:url(../images/logo.svg);background-repeat:no-repeat;background-position:left center;background-size:contain;border:0}
#navigation.reduce .navbar-brand{width:190px;height:80px}
#navigation .navbar-toggler{border-color:transparent;outline:none;padding:5px 0;border:none;border-radius:0;color:var(--secondary)}
#navigation .navbar-toggler:hover{color:var(--secondary-dark)}
#navigation .navbar-toggler:focus{box-shadow:0 0 0 0}
#navigation .navbar-toggler.collapsed{color:var(--secondary)}
#navigation .navbar-toggler.collapsed:hover{color:var(--secondary)}
#navigation .navbar-toggler .icon:before{content:'\e809';width:1.4rem;height:1.4rem;font-size:1.4rem}
#navigation .navbar-toggler.collapsed .icon:before{content:'\f008';width:1.4rem;height:1.4rem;font-size:1.4rem}
#navigation .nav-link{font-size:1rem;border:3px solid transparent;color:var(--secondary-dark);margin:0;padding-right:1rem;padding-left:1rem;text-transform:uppercase}
#navigation.reduce .nav-link{color:var(--secondary-dark)}
#navigation .nav-link:hover{border-bottom:3px solid var(--secondary-medium);color:var(--secondary)}
#navigation .nav-link.nav-link-pill{background-color:var(--secondary-light)}
#navigation .nav-link.nav-link-pill:hover{border-bottom:3px solid var(--secondary-medium)}
#navigation .nav-link.active{border-bottom:3px solid var(--secondary-regular)}
#navigation .nav-link.active:hover{border-bottom:3px solid var(--secondary-medium)}
/*******************************************************************/
#presentacion{width:100%;overflow:hidden;z-index:1000;position:relative}
#presentacion .ratio{margin-top:100px}
#presentacion video{object-fit:cover}
#presentacion.cover{margin:0;height:575px}
#presentacion.cover .bg-image{height:575px}
#presentacion.cover .caption{position:absolute;right:10%;top:50%;left:10%;padding-top:1.25rem;padding-bottom:1.25rem;color:#fff;max-width:40rem}
/*******************************************************************/
#sector .container,#sector .container-fluid{position:relative}
#sector .fix-right,#sector .fix-left{padding-top:1.5rem;position:relative;z-index:10}
#sector .block-static,#sector .block-float{background-repeat:no-repeat;background-position:center center;background-size:cover;height:380px}
#sector .block-float{margin-top:2rem}#sector .block-group{overflow:hidden;height:100%;min-height:450px}
#sector .block-photo{background-repeat:no-repeat;background-position:center center;background-size:cover;overflow:hidden;height:100%}
/*******************************************************************/
#procesos .accordion-item{border:none;position:relative;min-height:12rem}
#procesos .accordion-item .img-thumbnail{position:absolute;width:9rem;margin:1.5rem;border-width:0;padding:.15rem}
#procesos .accordion-button{background-color:transparent!important;color:var(--light);cursor:pointer;display:flex;align-items:center;position:absolute;left:0;right:0;bottom:0;top:0;border:none;outline:0;box-shadow:none;padding:0}
#procesos .accordion-button::after{background-image:none;content:'\f004';align-self:center;right:1.25rem;position:relative}
#procesos .accordion-header{padding-top:5rem;margin-left:12rem;font-weight:bold;align-self:baseline;flex-grow:1}
#procesos .accordion-body{margin-right:3.5rem;margin-left:12rem;padding:0;padding-top:3rem;padding-bottom:1rem;opacity:.1;transition:all .2s ease}
#procesos .accordion-body.show{opacity:1}

/*******************************************************************/
#servicios .card{overflow:hidden}
#sliders .carousel-item{width:100%;height:240px;background-size:cover}
#contacto{position:relative}
#contacto .ref{width:1.5rem;display:inline-block}
#contacto .note{margin-left:1.5rem}
#contacto a{color:var(--secondary);border-color:var(--psecondary)}
#contacto a.link:hover{color:var(--secondary)}
#mapa{border:1px solid var(--secondary-medium);border-radius:.25rem;width:100%;height:400px;overflow:hidden}
#mapa iframe{width:100%;margin-top:-50px;height:450px;border:none;background-color:var(--secondary-medium)}
@media (min-width: 768px)and (max-width: 991px)  {
    #mapa  {height: 500px;}   
    #mapa iframe {height: 550px;}
}
#footer{font-size:.6rem;color:var(--light);padding:2rem}
#footer .logo{width:130px;height:35px;position:relative;left:50%;margin-left:-70px;background:url(../images/logo.svg) no-repeat;filter:saturate(0) brightness(100)}
/*******************************************************************/
@media (max-width: 767px) {
	#procesos .accordion-body {
		margin-left: 2rem;
		margin-right: 3.2rem;
		padding-top: 5.5rem;
	}

	#navigation nav.center .navbar-brand {
		margin: 0 auto !important;
		background-position: center center;
	}

	#navigation nav.center {
		text-align: center;
	}
    #presentacion .ratio{height:360px;}
}
@media (min-width: 768px) {
    #presentacion .ratio{height:480px;}
}

 @media (min-width: 992px) {
 	#procesos .ps-auto {
 		padding-left: 20%;
 		padding-right: 20%;
 	}
 	.bg-parallax {
 		background-attachment: fixed !important;
 		background-position: center top !important;
 		background-size: auto !important;
 		background-repeat: repeat !important;
 	}
 	.pe-lg-6 {
 		padding-right: 4.5rem;
 	}
 	.ps-lg-6 {
 		padding-left: 4.5rem;
 	}
 	#sector .fix-right,
 	#sector .fix-left {
 		padding-top: 5rem;
 	}
    #presentacion .ratio{height:575px;}
 }
/*Sistema de grilla mix fluid and break ****************************/
@media (min-width: 1400px) {
    .row .fix-left{padding-left:calc(50% - 1320px/2 + var(--gutter-x))!important}
    .row .fix-right{padding-right:calc(50% - 1320px/2 + var(--gutter-x))!important}
   }
   @media (min-width: 1200px) and (max-width: 1399px) {
    .row .fix-left{padding-left:calc(50% - 1140px/2 + var(--gutter-x))!important}
    .row .fix-right{padding-right:calc(50% - 1140px/2 + var(--gutter-x))!important}
   }
   @media (min-width: 992px) and (max-width: 1199px) {
    .row .fix-left{padding-left:calc(50% - 960px/2 + var(--gutter-x))}
    .row .fix-right{padding-right:calc(50% - 960px/2 + var(--gutter-x))}
   }
   @media (min-width: 768px)and (max-width: 991px) {
    .row .fix-left{padding-left:calc(50% - 720px/2 + var(--gutter-x));padding-right:calc(50% - 720px/2 + var(--gutter-x))}
    .row .fix-right{padding-left:calc(50% - 720px/2 + var(--gutter-x));padding-right:calc(50% - 720px/2 + var(--gutter-x))}
   }
   @media (min-width: 576px) and (max-width: 767px) {
    .row .fix-left{padding-left:calc(50% - 540px/2 + var(--gutter-x));padding-right:calc(50% - 540px/2 + var(--gutter-x))}
    .row .fix-right{padding-left:calc(50% - 540px/2 + var(--gutter-x));padding-right:calc(50% - 540px/2 + var(--gutter-x))}
   }


/*******************************************************************/
#preloader{bottom:0;left:0;right:0;top:0;z-index:10000;position:fixed;}
#preloader:before{content:'';bottom:0;left:0;right:0;top:0;position:absolute;background-color:rgb(0, 130, 202)}
#preloader{opacity:1;transition-property:opacity,visibility;transition-duration:1s,0s;transition-delay:.2s,1.2s}
#preloader.hide{opacity:0;visibility:hidden}
.spinner{position:absolute;top:50%;left:50%;margin-top:-20px;margin-left:-20px;z-index:2000;}
.sk-circle{width:40px;height:40px;position:relative}.sk-circle .sk-child{width:100%;height:100%;position:absolute;left:0;top:0}.sk-circle .sk-child:before{content:'';display:block;margin:0 auto;width:15%;height:15%;background-color:#fff;border-radius:100%;-webkit-animation:sk-circleBounceDelay 1.2s infinite ease-in-out both;animation:sk-circleBounceDelay 1.2s infinite ease-in-out both}.sk-circle .sk-circle2{-webkit-transform:rotate(30deg);-ms-transform:rotate(30deg);transform:rotate(30deg)}.sk-circle .sk-circle3{-webkit-transform:rotate(60deg);-ms-transform:rotate(60deg);transform:rotate(60deg)}.sk-circle .sk-circle4{-webkit-transform:rotate(90deg);-ms-transform:rotate(90deg);transform:rotate(90deg)}.sk-circle .sk-circle5{-webkit-transform:rotate(120deg);-ms-transform:rotate(120deg);transform:rotate(120deg)}.sk-circle .sk-circle6{-webkit-transform:rotate(150deg);-ms-transform:rotate(150deg);transform:rotate(150deg)}.sk-circle .sk-circle7{-webkit-transform:rotate(180deg);-ms-transform:rotate(180deg);transform:rotate(180deg)}.sk-circle .sk-circle8{-webkit-transform:rotate(210deg);-ms-transform:rotate(210deg);transform:rotate(210deg)}.sk-circle .sk-circle9{-webkit-transform:rotate(240deg);-ms-transform:rotate(240deg);transform:rotate(240deg)}.sk-circle .sk-circle10{-webkit-transform:rotate(270deg);-ms-transform:rotate(270deg);transform:rotate(270deg)}.sk-circle .sk-circle11{-webkit-transform:rotate(300deg);-ms-transform:rotate(300deg);transform:rotate(300deg)}.sk-circle .sk-circle12{-webkit-transform:rotate(330deg);-ms-transform:rotate(330deg);transform:rotate(330deg)}.sk-circle .sk-circle2:before{-webkit-animation-delay:-1.1s;animation-delay:-1.1s}.sk-circle .sk-circle3:before{-webkit-animation-delay:-1s;animation-delay:-1s}.sk-circle .sk-circle4:before{-webkit-animation-delay:-.9s;animation-delay:-.9s}.sk-circle .sk-circle5:before{-webkit-animation-delay:-.8s;animation-delay:-.8s}.sk-circle .sk-circle6:before{-webkit-animation-delay:-.7s;animation-delay:-.7s}.sk-circle .sk-circle7:before{-webkit-animation-delay:-.6s;animation-delay:-.6s}.sk-circle .sk-circle8:before{-webkit-animation-delay:-.5s;animation-delay:-.5s}.sk-circle .sk-circle9:before{-webkit-animation-delay:-.4s;animation-delay:-.4s}.sk-circle .sk-circle10:before{-webkit-animation-delay:-.3s;animation-delay:-.3s}.sk-circle .sk-circle11:before{-webkit-animation-delay:-.2s;animation-delay:-.2s}.sk-circle .sk-circle12:before{-webkit-animation-delay:-.1s;animation-delay:-.1s}@-webkit-keyframes sk-circleBounceDelay{0%,80%,100%{-webkit-transform:scale(0);transform:scale(0)}40%{-webkit-transform:scale(1);transform:scale(1)}}@keyframes sk-circleBounceDelay{0%,80%,100%{-webkit-transform:scale(0);transform:scale(0)}40%{-webkit-transform:scale(1);transform:scale(1)}}
/*******************************************************************/
.fade-in-top{-webkit-animation:fade-in-top 1s ease-out both;animation:fade-in-top 1s ease-out both}
@-webkit-keyframes fade-in-top{0%{-webkit-transform:translateY(-50px);transform:translateY(-50px);opacity:0}100%{-webkit-transform:translateY(0);transform:translateY(0);opacity:1}}@keyframes fade-in-top{0%{-webkit-transform:translateY(-50px);transform:translateY(-50px);opacity:0}100%{-webkit-transform:translateY(0);transform:translateY(0);opacity:1}}
.fade-in-left{-webkit-animation:fade-in-left 1s ease-out both;animation:fade-in-left 1s ease-out both}
@-webkit-keyframes fade-in-left{0%{-webkit-transform:translateX(-500px);transform:translateX(-500px);opacity:0}100%{-webkit-transform:translateX(0);transform:translateX(0);opacity:1}}@keyframes fade-in-left{0%{-webkit-transform:translateX(-500px);transform:translateX(-500px);opacity:0}100%{-webkit-transform:translateX(0);transform:translateX(0);opacity:1}}
.fade-in-right{-webkit-animation:fade-in-right 1s ease-out both;animation:fade-in-right 1s ease-out both}
@-webkit-keyframes fade-in-right{0%{-webkit-transform:translateX(500px);transform:translateX(500px);opacity:0}100%{-webkit-transform:translateX(0);transform:translateX(0);opacity:1}}@keyframes fade-in-right{0%{-webkit-transform:translateX(500px);transform:translateX(500px);opacity:0}100%{-webkit-transform:translateX(0);transform:translateX(0);opacity:1}}
.kenburns-bottom{-webkit-animation:kenburns-bottom 2s ease-in reverse both;animation:kenburns-bottom 2s ease-in reverse both;}
@-webkit-keyframes kenburns-bottom{0%{-webkit-transform:scale(1) translateY(0);transform:scale(1) translateY(0);-webkit-transform-origin:50% 84%;transform-origin:50% 84%}100%{-webkit-transform:scale(1.25) translateY(15px);transform:scale(1.25) translateY(0px);-webkit-transform-origin:bottom;transform-origin:bottom}}@keyframes kenburns-bottom{0%{-webkit-transform:scale(1) translateY(0);transform:scale(1) translateY(0);-webkit-transform-origin:50% 84%;transform-origin:50% 84%}100%{-webkit-transform:scale(1.25) translateY(0px);transform:scale(1.25) translateY(0px);-webkit-transform-origin:bottom;transform-origin:bottom}}