@import url('https://fonts.googleapis.com/css?family=Raleway:300,400,700,900&display=swap');

.os-animation{opacity:0;}
.os-animation.animated{opacity:1;}
.os-animation1{opacity:0;}
.os-animation1{opacity:1;}
html,body{width:100%;height:100%;font-family: 'Raleway', sans-serif;}
#preloader{position:fixed;top:0;left:0;right:0;bottom:0;background-color:#ecf4ee;z-index:9999;}
#loader2{width:235px;height:54px;position:absolute;left:50%;top:50%;background:url(../imagenes/logo.png) no-repeat center 0;margin-left:-115px;margin-top:-27px;}
*{
font-family:sans-serif;
list-style:none;
text-decoration:none;
margin:0;
padding:0;
}
iframe{display:block;border:none;}

.os-animation{opacity:0;}
.os-animation.animated{opacity:1;}

#slide1{width:100%;height:100%;min-height:700px;}
#somos{ background-color:#374a93;}
#semos{background:url(../imagenes/somos.jpg) no-repeat 50% 50% fixed ;background-size:cover; text-align:center;}
#semos2{ background-color:#2d2f2f;}
#diseno{background:url(../imagenes/diseno.jpg) no-repeat 50% 50% fixed;background-size:cover; text-align:center;z-index:8;height:500px;}
#contacto{background:url(../imagenes/contacto.jpg) no-repeat 50% 50% fixed;background-size:cover; text-align:center;z-index:8;height:500px;}
#proyectos{ background-color:#374a93;}
#contactame{ background-color:#2d2f2f;}
#equipos{background:url(../imagenes/fondodisenos.jpg) no-repeat 50% 50% fixed;background-size: auto; text-align:center;z-index:8;}
#equiposa{ background-color:#f2f1ed;}
#clientes{ background-color:#f2f1ed;}


#slide8{ background-color:#272929;}


#productores{ background-color:#ffffff;}
#separador2{background:url(../imagenes/separador2.jpg) no-repeat 50% 50% fixed ;background-size:cover; height:500px; text-align:right;}


#contacto{ background-color:#ecf4ee;}

#elheader{ width:100%; height:70px; background-color:#ffffff; position:absolute; z-index:999; position:fixed;}
#elheader2{ width:100%; height:7px; background-color:#2d2f2f; position:absolute; z-index:999; position:fixed; top:70px;}

#suite{ background-color:#f1f2f3;height:100%;min-height:600px;}

#reservame{background:url(../imagenes/reserva.jpg) no-repeat 50% 50%  ;background-size:cover; min-height:700px; height:100%; text-align:right;}

#logo{POSITION:absolute;z-index:4;left:5%;top:31px;width:150px;height:69px;}
#logomovil{display: none;}

#losproductos{POSITION:relative;z-index:10;left:0;bottom:130px; width:100%; text-align:center; height:80px;}

#flechas{POSITION:relative;z-index:10;left:50%;bottom:130px; width:50px; height:50px; margin-left:-25px;}
#loservicios{POSITION:relative;z-index:10;left:0;bottom:100px; width:100%; height:50px;background:url(../imagenes/loservi.png) no-repeat 50% 50%  ;}

[class^="smooth"]{font-weight:700;font-size:15px;margin:0;padding-bottom:-2px;cursor:pointer;text-decoration:none;color:#374a93;-webkit-tap-highlight-color:rgba(0,0,0,0);text-transform:uppercase;}

.smooth{display:inline-block;vertical-align:middle;-webkit-transform:translateZ(0);transform:translateZ(0);box-shadow:0 0 1px rgba(0, 0, 0, 0);-webkit-backface-visibility:hidden;backface-visibility:hidden;-moz-osx-font-smoothing:grayscale;position:relative;overflow:hidden; line-height:70px;}
.smooth:before{content:"";position:absolute;z-index:-1;left:0;right:0;bottom:0;background:#2d2f2f;height:4px;-webkit-transform:translateY(4px);transform:translateY(4px);-webkit-transition-property:transform;transition-property:transform;-webkit-transition-duration:0.3s;transition-duration:0.3s;-webkit-transition-timing-function:ease-out;transition-timing-function:ease-out;}
.smooth:hover:before, .hvr-underline-reveal:focus:before, .hvr-underline-reveal:active:before{-webkit-transform:translateY(0);transform:translateY(0);}


.smooth2{color:#ffffff;font-size:16px;text-decoration:none;-webkit-transition:all .3s ease;-moz-transition:all .3s ease;transition:all .3s ease; }
.smooth2:hover{color:#374a93; -webkit-transition:all .3s ease;-moz-transition:all .3s ease;transition:all .3s ease;}


.texto1{color:#ffffff;font-size:17px;line-height:100%;}
.texto2{color:#374a93;font-size:17px;line-height:100%;}
.texto3{color:#ffffff;font-size:17px;line-height:120%;}
.texto3a{color:#ffffff;font-size:17px;line-height:120%; text-decoration: underline;}
.texto4{color:#ffffff;font-size:33px;line-height:170%; font-weight:700;}
.texto5{color:#ffffff;font-size:23px;line-height:170%;}
.texto6{color:#374a93;font-size:23px;line-height:170%;font-weight:700;}
.texto7{color:#ffffff;font-size:30px;}
.texto8{color:#ffffff;font-size:20px;line-height:200%;font-weight:300;}
.texto9{color:#374a93;font-size:50px;line-height:120%; font-weight:700;}
.texto10{color:#374a93;font-size:33px;line-height:120%; font-weight:700;}
.texto11{color:#ffffff;font-size:15px;}
.texto12{color:#374a93;font-size:20px;line-height:120%; font-weight:700; text-transform:uppercase;}


#arriba, #arriba1,#arriba2{display:inline-block;vertical-align:top;}
#arriba{width:1200px;vertical-align:middle; text-align:left; }
#arriba1{width:550px;margin-right:-4px; text-align:left; margin-top:7px;}
#arriba2{width:650px;margin-right:-4px;text-align:right;}

#contact, #contact1, #contact2, #contact0{display:inline-block;vertical-align:top;}
#contact{width:1200px;vertical-align:middle; text-align:left; }
#contact1{width:350px;margin-right:-4px;  text-align:left;}
#contact2{width:100%;margin-right:0px;  text-align:left;}
#contact0{width:75px;margin-right:-4px;  text-align:left;}




#pieses, #pieses1, #pieses2, #pieses3{display:inline-block;vertical-align:top;}
#pieses{width:1200px;vertical-align:middle; text-align:left; }
#pieses1{width:580px;margin-right:-4px;  text-align:left;}
#pieses2{width:570px;margin-right:-4px;  text-align:left;}
#pieses3{width:50px;margin-right:-4px;  text-align:left;}

#botomas, #botomas1, #botomas2{display:inline-block;vertical-align:top;}
#botomas{width:1200px;vertical-align:middle; text-align:left; margin-top:15px; }
#botomas1{width:900px;margin-right:-4px;  text-align:left;}
#botomas2{width:300px;margin-right:-4px;  text-align:left;}

#lamision, #lamision1, #lamision2{display:inline-block;vertical-align:top;}
#lamision{width:1200px;vertical-align:middle; text-align:left; margin-top:15px; }
#lamision1{width:350px;margin-right:-4px;  text-align:center;}
#lamision2{width:75px;margin-right:-4px;  text-align:center;}

#lineasomos{ width:100%; max-width:1200px; background-color:#575959; height:1px;}

.latabla{ width:90%; max-width:600px;}

.semos{ width:95%; max-width:779px;}

#loservi, #loservi1, #loservi2{display:inline-block;vertical-align:top;}
#loservi{width:100%;vertical-align:middle; text-align:left;}
#loservi1{width:50%;margin-right:-4px;  text-align:center; height:600px;background:url(../imagenes/se1.jpg) no-repeat 50% 50% ;background-size:cover;}
#loservi2{width:50%;margin-right:-4px;  text-align:center;height:600px;}


#loservidos, #loservidos1, #loservidos2{display:inline-block;vertical-align:top;}
#loservidos{width:100%;vertical-align:middle; text-align:left;}
#loservidos2{width:50%;margin-right:-4px;  text-align:center; height:600px;background:url(../imagenes/se2.jpg) no-repeat 50% 50% ;background-size:cover;}
#loservidos1{width:50%;margin-right:-5px;  text-align:center;height:600px;}


#loservitres, #loservitres1, #loservitres2{display:inline-block;vertical-align:top;}
#loservitres{width:100%;vertical-align:middle; text-align:left;}
#loservitres1{width:50%;margin-right:-4px;  text-align:center; height:600px;background:url(../imagenes/se3.jpg) no-repeat 50% 50% ;background-size:cover;}
#loservitres2{width:50%;margin-right:-4px;  text-align:center;height:600px;}

#otroservicio{ width:100%; background-color:#374a93;}

#losotros, #losotros1, #losotros2, #losotros3, #losotros4, #losotros0{display:inline-block;vertical-align:top;}
#losotros{width:1200px;vertical-align:middle; text-align:left;}
#losotros1{width:460px;margin-right:-4px; text-align:left;}
#losotros2{width:320px;margin-right:-4px;text-align:left;}
#losotros3{width:220px;margin-right:-4px;text-align:left;}
#losotros4{width:100%;margin-right:0px;text-align:left;}
#losotros0{width:100px;margin-right:-4px;text-align:left;}

#lospro, #lospro1{display:inline-block;vertical-align:top;}
#lospro{width:1200px;vertical-align:middle; text-align:left;}
#lospro1{width:300px;margin-right:-4px;text-align:center;}

#losclientes, #losclientes1, #losclientes2, #losclientes3, #losclientes4, #losclientes5{display:inline-block;vertical-align:top;}
#losclientes{width:1214px;vertical-align:middle; text-align:left;}
#losclientes1{width:257px;margin-right:-4px; text-align:left;}
#losclientes2{width:316px;margin-right:-4px;text-align:left;}
#losclientes3{width:181px;margin-right:-4px;text-align:left;}
#losclientes4{width:234px;margin-right:-4px;text-align:left;}
#losclientes5{width:226px;margin-right:-4px;text-align:left;}


.transparente{background-color:transparent; border:0;text-align:left;HEIGHT:30px;width:100%; font-size:15PX;color:#ffffff;}

.boton1{background-color:#374a93;text-align:center;HEIGHT:40px;width:150px;border:0;font-size:15PX;color:#ffffff;cursor:pointer;}

#subcon, #subcon1, #subcon2{display:inline-block;vertical-align:top;}
#subcon{width:1200px;vertical-align:middle; text-align:left; margin-top:15px; }
#subcon1{width:900px;margin-right:-4px;  text-align:left; }
#subcon2{width:300px;margin-right:-4px;  text-align:right;}

.equima{ width:95%; max-width:757px;}

#losequipos{ display:none;}

#losequipospc{ display:block; width:1200px; height:580px;}

@media screen and (max-width:1230px){
#losclientes{width:100%;vertical-align:middle; text-align:left;}
#losclientes1{width:100%;margin-right:0px; text-align:center;}
#losclientes2{width:100%;margin-right:0px;text-align:center;}
#losclientes3,#losclientes5,#losclientes4{width:100%;margin-right:0px;text-align:center;}	
}

@media screen and (max-width:1210px){
	
#losequipos, #losequipos1{display:inline-block;vertical-align:top;}
#losequipos{width:800px;vertical-align:middle; text-align:left; display:block}
#losequipos1{width:400px;margin-right:-4px;  text-align:left; }
	
#losequipospc{ display:none;}

#subcon{width:900px;vertical-align:middle; text-align:left; margin-top:15px; }
#subcon1{width:600px;margin-right:-4px;  text-align:left; }
#subcon2{width:300px;margin-right:-4px;  text-align:right;}

#contact{width:900px;vertical-align:middle; text-align:left; }
#contact1{width:280px;margin-right:-4px;  text-align:left;}
#contact2{width:100%;margin-right:0px;  text-align:left;}
#contact0{width:30px;margin-right:-4px;  text-align:left;}

#losotros{width:900px;vertical-align:middle; text-align:left;}
#losotros1{width:300px;margin-right:-4px; text-align:left;}
#losotros2{width:300px;margin-right:-4px;text-align:left;}
#losotros3{width:200px;margin-right:-4px;text-align:left;}
#losotros0{width:50px;margin-right:-4px;text-align:left;}


#lospro{width:900px;vertical-align:middle; text-align:left;}
#lospro1{width:300px;margin-right:-4px;text-align:center;}

#lamision{width:900px;vertical-align:middle; text-align:left; margin-top:15px; }
#lamision1{width:300px;margin-right:-4px;  text-align:center;}
#lamision2{ display:none;}

#pieses{width:900px;vertical-align:middle; text-align:left; }
#pieses1{width:580px;margin-right:-4px;  text-align:left;}
#pieses2{width:270px;margin-right:-4px;  text-align:left;}
#pieses3{width:50px;margin-right:-4px;  text-align:left;}

#botomas{width:900px;vertical-align:middle; text-align:left; margin-top:15px; }
#botomas1{width:600px;margin-right:-4px;  text-align:left;}
#botomas2{width:300px;margin-right:-4px;  text-align:left;}

#loservidos2{width:50%;margin-right:-4px;  text-align:center; height:700px;background:url(../imagenes/se2.jpg) no-repeat 50% 50% ;background-size:cover;}
#loservidos1{width:50%;margin-right:-4px;  text-align:center;height:700px;}

}

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

#subcon{width:90%;vertical-align:middle; text-align:left; margin-top:15px; }
#subcon1{ display:none;}
#subcon2{width:100%;margin-right:-4px;  text-align:left;}

#contact{width:90%;vertical-align:middle; text-align:left; }
#contact1{width:100%;margin-right:0px;  text-align:left;}
#contact2{width:100%;margin-right:0px;  text-align:left;}
#contact0{ display:none;}

#losotros{width:600px;vertical-align:middle; text-align:left;}
#losotros1{width:100%;margin-right:0px; text-align:left;}
#losotros2{width:100%;margin-right:0px;text-align:left;}
#losotros3{width:100%;margin-right:0px;text-align:left;}
#losotros0{ display:none;}

#lospro{width:600px;vertical-align:middle; text-align:left;}
#lospro1{width:300px;margin-right:-4px;text-align:center;}

#lamision{width:300px;vertical-align:middle; text-align:left; margin-top:15px; }
#lamision1{width:300px;margin-right:0px;  text-align:center;}

#pieses{width:90%;vertical-align:middle; text-align:left; }
#pieses1{width:100%;margin-right:0px;  text-align:center;}
#pieses2{width:100%;margin-right:0px;  text-align:center;}
#pieses3{ display:none;}

#botomas{width:100%;vertical-align:middle; text-align:left; margin-top:5px; }
#botomas1{width:100%;margin-right:-4px;  text-align:center;}
#botomas2{width:100%;margin-right:-4px;  text-align:center;}

#loservi1{ display:none;}
#loservi2{width:100%;margin-right:0px;  text-align:center;height:400px;}	

#loservidos2{ display:none;}
#loservidos1{width:100%;margin-right:0px;}

#loservitres1{ display:none;}
#loservitres2{width:100%;margin-right:0px;  text-align:center;height:600px;}

}

@media screen and (max-width:810px){
#losequipos{width:400px;vertical-align:middle; text-align:left;}
#losequipos1{width:400px;margin-right:0px;  text-align:left; }
}

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

#losotros{width:90%;vertical-align:middle; text-align:left;}

#lospro{width:300px;vertical-align:middle; text-align:left;}
#lospro1{width:300px;margin-right:0px;text-align:center;}
	


#loservicios{POSITION:relative;z-index:10;left:0;bottom:120px; width:100%; height:70px;background:url(../imagenes/loservi.png) no-repeat 50% 50%  ;}

}

.ball {
    margin: 0 auto;
    -moz-animation: spin 1.5s infinite linear;
    -webkit-animation: spin 1.5s infinite linear;
}

@-moz-keyframes spin {
    0% {
opacity: 1;   -moz-transform: translateY(-5px); }

    100% {
opacity: 1;  -moz-transform: translateY(5px);   }
}



@-webkit-keyframes spin {
    0% {
opacity: 1; -webkit-transform: translateY(-5px); }

    100% {
opacity: 1; -webkit-transform: translateY(5px); }  
}


.ball2{-moz-animation:spin2 1.5s infinite linear;-webkit-animation:spin2 1.5s infinite linear;-0-animation:spin2 1.5s infinite linear;animation:spin2 1.5s infinite linear;}
@-moz-keyframes spin2{0%{opacity:01;}
100%{opacity:1;-moz-transform:translateY(-6px);}
}
@-webkit-keyframes spin2{0%{opacity:1;}
100%{opacity:1;-webkit-transform:translateY(-6px);}
}
@-o-keyframes spin2{0%{opacity:1;}
100%{opacity:1;-0-transform:translateY(-6px);}
}
@-moz-keyframes spin2{0%{opacity:01;}
100%{opacity:1;-moz-transform:translateY(6px);}
}
@-webkit-keyframes spin{0%{opacity:1;}
100%{opacity:1;-webkit-transform:translateY(6px);}
}
@-o-keyframes spin{0%{opacity:1;}
100%{opacity:1;-0-transform:translateY(6px);}
}
.flecha3{-moz-animation:spin3 1.5s infinite linear;-webkit-animation:spin3 1.5s infinite linear;-0-animation:spin3 1.5s infinite linear;animation:spin3 1.5s infinite linear;}
@-moz-keyframes spin3{0%{opacity:01;}
100%{opacity:1;-moz-transform:translateY(6px);}
}
@-webkit-keyframes spin3{0%{opacity:1;}
100%{opacity:1;-webkit-transform:translateY(6px);}
}
@-o-keyframes spin3{0%{opacity:1;}
100%{opacity:1;-0-transform:translateY(6px);}
}


#menumovil{ display:none;}
.button_container {
  position: absolute;
  top: -10px;;
  right: 0px;
  height: 0px;
  width: 35px;
  cursor: pointer;
  z-index: 9999;
  -webkit-transition: opacity .25s ease;
  -moz-transition: opacity .25s ease;
  transition: opacity .25s ease;
}
.button_container:hover {
  opacity: .7;
}
.button_container.active .top {
  -webkit-transform: translateY(11px) translateX(0) rotate(45deg);
  -moz-transform: translateY(11px) translateX(0) rotate(45deg);
          transform: translateY(11px) translateX(0) rotate(45deg);
  background: #FFF;
}
.button_container.active .middle {
  opacity: 0;
  background: #FFF;
}
.button_container.active .bottom {
  -webkit-transform: translateY(-11px) translateX(0) rotate(-45deg);
  -moz-transform: translateY(-11px) translateX(0) rotate(-45deg);
          transform: translateY(-11px) translateX(0) rotate(-45deg);
  background: #FFF;
}
.button_container span {
  background: #2d2f2f;
  border: none;
  height: 5px;
  width: 100%;
  position: absolute;
  top: 0;
  left: 0;
  -webkit-transition: all .35s ease;
  -moz-transition: all .35s ease;
  transition: all .35s ease;
  cursor: pointer;z-index: 9999;
}
.button_container span:nth-of-type(2) {
  top: 11px;
}
.button_container span:nth-of-type(3) {
  top: 22px;
}

.overlay {
  position: fixed;
  background-color:#2d2f2f;
    top: 0;
  left: 0;
  width: 100%;
  height: 0%;
  opacity: 0;
  visibility: hidden;
  -webkit-transition: opacity .35s, visibility .35s, height .35s;
  -moz-transition: opacity .35s, visibility .35s, height .35s;
  transition: opacity .35s, visibility .35s, height .35s;
  overflow: hidden;
}
.overlay.open {
  opacity: .9;
  visibility: visible;
  height: 100%;
}
.overlay.open li {
  -webkit-animation: fadeInRight .5s ease forwards;
  -moz-animation: fadeInRight .5s ease forwards;
          animation: fadeInRight .5s ease forwards;
  -webkit-animation-delay: .35s;
  -moz-animation-delay: .35s;
          animation-delay: .35s;
}
.overlay.open li:nth-of-type(2) {
  -webkit-animation-delay: .4s;
  -moz-animation-delay: .4s;
          animation-delay: .4s;
}
.overlay.open li:nth-of-type(3) {
  -webkit-animation-delay: .45s;
  -moz-animation-delay: .45s;
          animation-delay: .45s;
}
.overlay.open li:nth-of-type(4) {
  -webkit-animation-delay: .50s;
  -moz-animation-delay: .50s;
          animation-delay: .50s;
}
.overlay nav {
  position: relative;
  height: 70%;
  top: 50%;
  -webkit-transform: translateY(-35%);
  -moz-transform: translateY(-35%);
          transform: translateY(-35%);
  
  font-weight: 900;
  text-align: right;
  margin-right:52px;
}
.overlay ul {
  list-style: none;
  padding: 0;
  margin: 0 auto;
  display: inline-block;
  position: relative;
  height: 100%;
}
.overlay ul li {
  display: block;
  min-height: 50px;
  position: relative;
  opacity: 0;
}
.overlay ul li a {
  display: block;
  position: relative;
  color: #FFF;
  text-decoration: none;
  overflow: hidden;
  font-size: 45px;
  opacity:1; text-transform:uppercase;
}
.overlay ul li a:hover,a:after, .overlay ul li a:focus:after, .overlay ul li a:active:after {
  width: 100%;font-size: 48px;
  opacity:1;-webkit-transition: .25s;
  transition: .25s;
}
.overlay ul li a:after {
  font-size: 55px;
  opacity:.9;-webkit-transition: .25s;
  transition: .25s;
  
}

@-webkit-keyframes fadeInRight {
  0% {
    opacity: 0;
    left: 20%;
  }
  100% {
    opacity: 1;
    left: 0;
  }
}

@keyframes fadeInRight {
  0% {
    opacity: 0;
    left: 20%;
  }
  100% {
    opacity: 1;
    left: 0;
  }
}

@media screen and (max-width:1210px){
#arriba{width:900px;vertical-align:middle; text-align:left; }
#arriba1{width:350px;margin-right:-4px; text-align:left; margin-top:7px;}
#arriba2{width:550px;margin-right:-4px;text-align:right;}	
}
@media screen and (max-width:910px){
#arriba{width:90%;vertical-align:middle; text-align:left; }
#arriba1{width:100%;margin-right:-4px; background-color:#ffffff; text-align:left;}
#arriba2,#arriba3{display:none;}

#menumovil{ z-index:9999;position: fixed;top: 37px;
  right: 30px;
  height: 27px;
  width: 35px; display:block;}


}