/* AGUANA CSS*/
@charset "utf-8";

/* ==============================
   ANIMATIONS
   ============================== */
    @-webkit-keyframes zoomeIn {
		0% { -webkit-transform: scale(1.1); }
		100% { -webkit-transform: scale(1); }
	}
	@-moz-keyframes zoomeIn {
		0% { -moz-transform: scale(1.1); }
		100% { -moz-transform: scale(1); }
	}
	@keyframes zoomeIn {
		0% { transform: scale(1.1); }
		100% { transform: scale(1); }
	}

/* ==============================
   LAYOUT
   ============================== */
    .mobile{display: none;}
    .desktop{display: block;}
    .page-wrapper{overflow: hidden;opacity: 0;}
    .page-wrapper.active{overflow: hidden;opacity: 1;}
    .container{position: relative;max-width: 1280px;margin: 0 auto;}
    .nosotros, .servicios, .contacto{padding: 80px 0;}
    .nosotros:after, .servicios:after, .contacto:after{content: '';clear: both;}
    .heading h1{position: relative;font-weight: 700;font-size: 5em;margin: 0 0 80px 0;}
    .heading h1:after{ position: absolute;content: '';width: 70px;height: 6px;background: #2fade4;left: 0;right: 0;margin: 0 auto;bottom: -40px;}

/* ==============================
   PRELOADER
   ============================== */
    .preloader {position: fixed;z-index: 999; width: 100%;background:#58B7E4;overflow: hidden;-webkit-transition:5s cubic-bezier(0.25, 0.46, 0.45, 0.94);-moz-transition: 5s cubic-bezier(0.25, 0.46, 0.45, 0.94);transition:5s cubic-bezier(0.25, 0.46, 0.45, 0.94);}
    .preloader svg{width: 215px;fill:#292929; position: absolute;height: 100px;margin: auto 0;top: 0;bottom: 0;z-index: 1;-webkit-transition:7s cubic-bezier(0.25, 0.46, 0.45, 0.94);-moz-transition: 7s cubic-bezier(0.25, 0.46, 0.45, 0.94);transition:7s cubic-bezier(0.25, 0.46, 0.45, 0.94);}
    .preloader.active svg{-webkit-transform: translate(160%,0%);-moz-transform: translate(160%,0%);transform: translate(160%,0%);}
    .preloader:after{ content: '';position: absolute;background: #fff;height: 2px;width: 32px;top: 0;bottom: 0;margin: auto 0;-webkit-transition:7s cubic-bezier(0.25, 0.46, 0.45, 0.94);-moz-transition: 7s cubic-bezier(0.25, 0.46, 0.45, 0.94);transition:7s cubic-bezier(0.25, 0.46, 0.45, 0.94);}
    .preloader.active:after{width: 380px;}
    .preloader.active{-webkit-transform: translateX(100%);-moz-transform: translateX(100%);transform: translateX(100%);}

/* ==============================
   INTRO
   ============================== */
    .intro {padding: 80px 0 0;}
    .intro p{font-size: 2em;text-align: center;line-height: 1.5;color: #292929;}
    .hero {position: absolute;width: 100%;height: 100%;display: table;text-align: center;z-index: 5;}
    .hero h1{display: table-cell;vertical-align: middle;font-size: 9em;font-weight: 700;color: #fff;}

/* ==============================
   HEADER
   ============================== */
    header{position: fixed;width: 100%;z-index: 6;-webkit-transition:.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);-moz-transition: .5s cubic-bezier(0.25, 0.46, 0.45, 0.94);transition:.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);}
    header.stick{  background: #fff;z-index: 5;border-bottom: 2px solid #2fade4;}
    .logo{float: left;padding: 11px 0 0 0;}
    header.stick .logo{padding: 0 0 0 0;}
    .logo h1 a{ text-indent: -9999px;background: url('../img/logo.svg');background-size: 201px;display: block;width: 198px;height: 77px;}
    header.stick .logo h1 a{ text-indent: -9999px;background: url('../img/logo-b.svg');background-size: 164px;display: block;width: 166px;height: 57px;}
    nav{}
    nav ul{ float: right;line-height: 100px;-webkit-transition:.5s;-moz-transition: .5s ;transition:.5s ;}
    nav ul li{display: inline-block;vertical-align: top;position: relative;}
    nav ul li a{  font-size: 116%;margin: 0 20px;text-transform: uppercase;color: #fff;-webkit-transition:.5s;-moz-transition: .5s ;transition:.5s ;position: relative;}
    nav ul li a:after{  position: absolute;content: '';-webkit-transition: .5s;-moz-transition: .5s;transition: .5s;width: 0;height: 1px;background: #fff;bottom: -8px;left: 0;right: 0;margin: 0 auto;}
    nav ul li a:hover:after{width: 100%;}
    header.stick nav ul li a {color: #292929;}
    header.stick nav ul li a:after {background: #292929;}
    header.stick nav ul {line-height: 60px;}

/* ==============================
   HOME
   ============================== */
    .home{ position: relative;width: 100%;top: 0;overflow: hidden;}
    .home:after{ content: '';position: absolute;width: 100%;height: 100%;background: rgba(51, 51, 51, 0.9);}
    .home img.bg{position: absolute;width: 100%;height: 100%; -webkit-animation-name: zoomeIn;-moz-animation-name: zoomeIn;animation-name: zoomeIn;-webkit-animation-duration: 25s;-moz-animation-duration: 25s;animation-duration: 25s;-webkit-animation-fill-mode: both;-moz-animation-fill-mode: both;animation-fill-mode: both;-webkit-animation-direction: alternate;-moz-animation-direction: alternate;animation-direction: alternate;-webkit-animation-iteration-count: infinite;-moz-animation-iteration-count: infinite;animation-iteration-count: infinite;}
    .home .bg{position: absolute;width: 100%;height: 100%;background-image: url(../img/bg-home.jpg);  background-size: cover;background-position: center;
        -webkit-animation-name: zoomeIn;-moz-animation-name: zoomeIn;animation-name: zoomeIn;-webkit-animation-duration: 25s;-moz-animation-duration: 25s;animation-duration: 25s;-webkit-animation-fill-mode: both;-moz-animation-fill-mode: both;animation-fill-mode: both;-webkit-animation-direction: alternate;-moz-animation-direction: alternate;animation-direction: alternate;-webkit-animation-iteration-count: infinite;-moz-animation-iteration-count: infinite;animation-iteration-count: infinite;}
    .bottom-info{ background: rgba(0, 158, 227, 0.8);position: absolute;z-index: 1; height: 0;width: 100%;bottom: 0;-webkit-transition:1s cubic-bezier(0.25, 0.46, 0.45, 0.94);-moz-transition: 1s cubic-bezier(0.25, 0.46, 0.45, 0.94);transition:1s cubic-bezier(0.25, 0.46, 0.45, 0.94);text-align: center;}
    .bottom-info.active{ height: 80px; line-height: 80px; z-index: 6;}
    .bottom-info .three .icon{display: inline-block;line-height: 80px;}
    .bottom-info .three .icon span{ font-size: 3.5em;color: rgba(19, 19, 19,0.6); }
    .bottom-info .three .info{display: inline-block;    vertical-align: middle;text-align: left;}
    .bottom-info .three .info h5{font-weight: 700;color: #FBFBFB;font-size: 131%;}
    .bottom-info .three .info p{color: #FBFBFB; font-size: 116%;padding: 2px 0 0 0;}
    .bottom-info .three .info p a{color: #b3dff3 !important; font-size: 116%;}
    .bottom-info .three .info p a:hover{color: #fff !important; font-size: 116%;}

/* ==============================
   SERVICIOS
   ============================== */
    .servicios .three, .row .three {overflow: hidden;height: 280px;}
    .servicios .servicio h1 {font-size: 1.5em;font-weight: bold;color: #4a4a4a;text-align: center;margin: 110px 0 0 0;}
    .servicios .servicio p{padding: 10px 20px;font-size: 123%;text-align: center;font-weight: 400;}
    .servicios .servicio span {font-size: 83px;display: block;text-align: center;color: #2fade4;margin: 10px auto;position: absolute;left: 0;right: 0;}
    .servicios .servicio span.icon-g-stock{font-size: 140px;margin: -26px 0 0 0;}
    .servicios .servicio span.icon-deposito{font-size: 110px;margin: -10px 0 0 0;}
    .servicios .three.active:after{-webkit-transform: translateX(0%);-moz-transform: translateX(0%);transform: translateX(0%);}
    .servicios .three:before{ content: '';position: absolute;height: 42px;width: 1px;background: #c1e2f1;right: 0;z-index: 1;bottom: 0;top: 0;margin: auto 0;}
    .servicios .three:last-child:before{ display: none;}
    .servicios .heading h1{text-align: center;}
    .servicios a{ display: block;background: #2fade4;padding: 14px;text-align: center;width: 140px;margin: 0 auto;color: #fff;font-weight: 700;position: absolute; bottom: 0;left: 0;right: 0;}
    .servicios a:hover{ background: #1e698a;}

/* ==============================
   NOSOTROS
   ============================== */
    .nosotros{background: #2fade4;}
    .block-nosotros {margin: 0 0 50px 0;}
    .block-nosotros ul {padding: 0 30px 0 94px;}
    .block-nosotros ul li{font-size: 1.5em;line-height: 1.5;color: #ffffff;font-weight: 300;}
    .nosotros p{ font-size: 1.5em;line-height: 1.5;color: #ffffff;padding: 0 30px 0 94px;}
    .nosotros .heading h1{color: #fff;}
    .nosotros .heading h1:after{ position: absolute;content: '';width: 70px;height: 6px;background: #fff;left: 0;margin: 0 ;bottom: -40px;}
    .nosotros .block-nosotros .header span{ font-size: 3.7em;color: rgba(29, 79, 101,0.4);display: inline-block;vertical-align: middle;}
    .nosotros .block-nosotros .header h2{ color: #fff;display: inline-block;vertical-align: middle;font-size: 2.4em;font-weight: 700;padding-left: 23px;}

/* ==============================
   CONTACTO
   ============================== */
    .contacto .heading h1:after{ position: absolute;content: '';width: 70px;height: 6px;left: 0;margin: 0 ;bottom: -40px;}
    .block-form .form-group{ display: inline-block;width: 48%;margin: 0 0 15px 0;}
    .block-form .form-group.first{ margin-right: 2%;}
    .info {text-align: center;}
    .info span{ color: #2fade4;font-size: 28px;}
    .info h4{color: #757575;font-size: 116%;text-align: center;margin: 10px 0;}
    .info p{font-weight: 700;}
    .info a{color: #2fade4;}
    .form-tip span{color: #2fade4;}
    .submit_btn{display: block;background: #2fade4;padding: 14px;text-align: center;width: 140px;margin: 0 auto;color: #fff;font-weight: 700;position: absolute; bottom: 0;right: 0;cursor: pointer;}
    .submit_btn:hover{ background: #1e698a;}
    .success {color: #2a962a;padding: 5px 0 0 20px;}

/* ==============================
   FOOTER
   ============================== */
    footer{ padding: 30px;margin: 50px 0 0 0;}
    footer p{color: #292929;font-weight: 400;text-align: center;}
 
/* ==============================
   RESPONSIVE
   ============================== */
    @media only screen and (max-width: 1440px) {
        .hero h1 {font-size: 7em;}
    }  
    @media only screen and (max-width: 1366px) {
        .bottom-info .three .info h5 {
            font-size: 123%;
        }
        .bottom-info .three .info p {
            font-size: 100%;
        }
    } 
    @media only screen and (max-width: 1280px) {
        .container{padding: 0 15px;}
    } 
    @media only screen and (max-width: 768px) {
        .mobile{display: block;}
        .desktop{display: none;} 
        .three, .row .three {width: 50%;}
        .home {height: 600px !important;}
        .hero h1 {font-size: 5em;}
    }
    @media only screen and (max-width: 680px) {
        
        .home {height: 600px !important;}
        .three, .row .three {width: 100%;}
        .servicios .three, .row .three {overflow: hidden;height: auto;}
        .servicios a {margin: 5px auto 0;position: relative;}
        .servicios .servicio p br{display: none;}
        .heading h1 {font-size: 3em;}
        .intro {padding: 50px 0 0;}
        .intro p {font-size: 1.5em;}
        .six, .row .six {width: 100%;}
        .nosotros p {padding: 0;}
        .nosotros .block-nosotros .header span {display: none;}
        .nosotros .block-nosotros .header h2 {padding-left: 0;}
        .block-nosotros ul {padding: 0;}
        .block-form .form-group {display: block;width: 100%;}
        .submit_btn {margin: 10px auto;position: relative;}
        footer {padding: 30px;margin: 10px 0 0 0;}
        header.stick .logo h1 a {background-size: 150px;width: 150px;}
        .hero h1 {font-size: 2.2em;}
        .logo {float: left;padding: 0px 0 0 0;}
        .logo h1 a {background-size: 176px;display: block;width: 175px;height: 67px;}
        #btn-nav{ width: 35px;height: 32px;position: absolute;right: 15px;top: 20px;margin: 0;-webkit-transform: rotate(0deg);-moz-transform: rotate(0deg);-o-transform: rotate(0deg);transform: rotate(0deg);-webkit-transition: .5s ease-in-out;-moz-transition: .5s ease-in-out;-o-transition: .5s ease-in-out;transition: .5s ease-in-out;cursor: pointer;}
        #btn-nav span{ display: block;position: absolute;height: 5px;width: 100%;background: #009fe3;border-radius: 9px;opacity: 1;left: 0;-webkit-transform: rotate(0deg);-moz-transform: rotate(0deg);-o-transform: rotate(0deg);transform: rotate(0deg);-webkit-transition: .25s ease-in-out;-moz-transition: .25s ease-in-out;-o-transition: .25s ease-in-out;transition: .25s ease-in-out;}
        #btn-nav span:nth-child(1) {top: 0px;}
        #btn-nav span:nth-child(2), #btn-nav span:nth-child(3) {top: 13px;}
        #btn-nav span:nth-child(4) {top: 26px;}
        #btn-nav.open span:nth-child(1) {top: 18px;width: 0%;left: 50%;}
        #btn-nav.open span:nth-child(2) {-webkit-transform: rotate(45deg);-moz-transform: rotate(45deg);-o-transform: rotate(45deg);transform: rotate(45deg);}
        #btn-nav.open span:nth-child(3) {-webkit-transform: rotate(-45deg);-moz-transform: rotate(-45deg);-o-transform: rotate(-45deg);transform: rotate(-45deg);}
        #btn-nav.open span:nth-child(4) {top: 18px;width: 0%;left: 50%;}
        nav {position: absolute;top: 67px;width: 100%;background: #009fe3;opacity: 0;z-index: -5;-webkit-transition: .5s;-moz-transition: .5s;transition: .5s;}
        nav.active {opacity: 1;z-index: 1;}
        nav ul {float: none;height: 100%;line-height: 70px;-webkit-transition: .5s;-moz-transition: .5s;transition: .5s;}
        nav ul li {display: block;vertical-align: top;position: relative;border-bottom: 1px solid #fff;text-align: center;}
        header.stick nav ul li a {color: #fff;}
        header.stick nav {top: 59px;}
    }