@font-face {
	font-family:'oblack';
	src: url("oblack.woff") format("woff");
	font-weight: normal;
	font-style: normal;
	font-display:swap;
}


@font-face {
	font-family:'oregular';
	src: url("oregular.woff") format("woff");
	font-weight: normal;
	font-style: normal;
	font-display:swap;
}


@font-face {
	font-family:'obold';
	src: url("obold.woff") format("woff");
	font-weight: normal;
	font-style: normal;
	font-display:swap;
}

@font-face {
	font-family:'timeout';
	src: url("timeout.woff") format("woff");
	font-weight: normal;
	font-style: normal;
	font-display:swap;
}

html,body{width:100%;height:100%; font-family:'oregular';}


*{
list-style:none;
text-decoration:none;
margin:0;
padding:0;
}
iframe{display:block;border:none;}

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

 *:focus { 
    outline: none; 
} 


#flechahome{text-align:center;width:90%; max-width: 1600px; left: 5%; height:65px; margin-top: 700px; position: absolute;}

#superior{width: 100%; height: 9px; background-color: #f6a300; z-index: 99;}

#elheader{ width:100%; height:80px; position: absolute; text-align: center;  top:9px; left: 0; z-index: 99; }

#flotante1{ width: 188px; height: 93px; top: 0; left: 0; position: absolute; }
#flotante2{ width: 61px; height: 156px; top: 800px; left: 0;  position: absolute; }
#flotante3{ width: 174px; height: 392px; top: 700px; right: 0;  position: absolute; }
#flotante4{ width: 271px; height: 317px; top: 2300px; left: 0;  position: absolute; z-index:1; }
#flotante5{ width: 170px; height: 497px; top: 3000px; right: 0;  position: absolute; }
#flotante7{ width: 98px; height: 163px; top: 4200px; right: 0;  position: absolute; }
#flotante8{ width: 228px; height: 280px; top: 4400px; left: 0;  position: absolute; }


.texto1{color:#2c2c2a;font-size:120px; line-height: 100%; text-decoration:none; font-family:'oblack';}
.texto2{color:#74b571;font-size:120px; line-height: 100%; text-decoration:none; font-family:'oblack';}
.texto3{color:#74b571;font-size:8vw;  line-height: 100%; text-decoration:none; text-transform: uppercase; font-family:'oregular';}
.texto4{color:#e9e9e9;font-size:16px; font-weight: 400; line-height: 180%; text-decoration:none; font-family:'obold';}
.texto5{color:#2c7739;font-size:20px; line-height: 160%; text-decoration:none; font-family:'obold';}
.texto6{color:#30302f;font-size:20px; line-height: 160%; text-decoration:none; font-family:'oregular';}
.texto7{color:#2c7739;font-size:40px; ine-height: 100%; text-decoration:none; font-family:'obold'; text-transform: uppercase;}
.texto8{color:#530502;font-size:100px; line-height: 100%; text-decoration:none; font-family:'oblack';}
.texto9{color:#51183d;font-size:100px; line-height: 100%; text-decoration:none; font-family:'oblack';}
.texto10{color:#2d2e2d;font-size:100px; line-height: 100%; text-decoration:none; font-family:'oblack';}
.texto11{color:#f9f7ea;font-size:120px; line-height: 100%; text-decoration:none; font-family:'oblack';}
.texto12{color:#30302f;font-size:120px; line-height: 100%; text-decoration:none; font-family:'oblack';}
.texto13{color:#f9f7ea;font-size:20px; line-height: 160%; text-decoration:none; font-family:'obold';}
.texto14{color:#30302f;font-size:16px; line-height: 160%; text-decoration:none; font-family:'oregular';}
.texto15{color:#f9f7ea;font-size:16px; line-height: 160%; text-decoration:none; font-family:'oregular';}
.texto16{color:#30302f;font-size:25px; line-height: 120%; text-decoration:none; font-family:'timeout'; text-transform: uppercase;}
.texto17{color:#e2a221;font-size:25px; line-height: 120%; text-decoration:none; font-family:'timeout'; text-transform: uppercase;}
.texto18{color:#f9f7ea;font-size:25px; line-height: 120%; text-decoration:none; font-family:'timeout'; text-transform: uppercase;}


#arriba, #arriba1,#arriba2,#arriba3,#arriba4{display:inline-block;vertical-align:top; }
#arriba{ width:1700px;vertical-align:middle; text-align:left; }
#arriba1{width:362px;margin-right:-4px; text-align:left;z-index:1; margin-top: 4px;}
#arriba2{width:1189px; margin-right:-4px;text-align:center; z-index:1; margin-top: 26px; }
#arriba3{width:149px; margin-right:-4px;text-align:right; margin-top: 22px;  }

#logo{ width: 362px; height:95px ; position: relative; left: 0; top: 0; }
#logo1{ width: 362px; height:95px ; position: absolute; left: 0; top: 0; z-index: 1; }
#logo2{ width: 362px; height:95px ; position: absolute; left: 0; top: 0; z-index: 2;  }


#slide1{text-align:center;width:100%; height:950px;background:url("../imagenes/fondo1.jpg") no-repeat center 0  ;background-size:cover; z-index: -2;  }


#pasto1{ width: 48px; height:51px ; position: absolute; right: 2%; top: 660px; z-index: 1; }
#pasto2{ width: 35px; height:37px ; position: absolute; left: 300px; top: 950px; z-index: 1; }
#pasto3{ width: 55px; height:58px ; position: absolute; left: 100px; top: 1100px; z-index: 1; }
#pasto4{ width: 45px; height:48px ; position: absolute; right: 100px; top: 1100px; z-index: 1; }
#pasto5{ width: 30px; height:32px ; position: absolute; right: 200px; top: 1300px; z-index: 1; }
#pasto6{ width: 40px; height:42px ; position: absolute; left: 50px; top: 1600px; z-index: 1; }
#pasto7{ width: 35px; height:37px ; position: absolute; right: 100px; top:1800px; z-index: 1; }
#pasto8{ width: 35px; height:37px ; position: absolute; left: 100px; top:2500px; z-index: 1; }

#home{ width: 100%; height:100% ;  position: relative; left: 0; top: 0; z-index: 1; }
#home1{ width: 386px; height:124px ; position: absolute; right: 200px; top: 200px; z-index: 1; }
#home2{ width: 100%; height:397px ; position: absolute; left: 0; top: 0px; z-index: 2;  }
#home3{ width: 100%; position: absolute; left: 0; top: 150px; z-index: 4;  }
#home4{ width:100%; height:540px; position: absolute; text-align: center; left: 0; top: 400px; z-index: 3;   }
#home5{ width:313px; height:293px; position: absolute; text-align: center; right: 16%; top: 650px; z-index: 4;   }

#slideinicio{overflow: hidden;}

#elslide, #elslide1,#elslide2,#elslide3,#elslide4,#elslide5,#elslide6{display:inline-block;vertical-align:top; }
#elslide{  width:1650px; height:540px; left: 50%; margin-left:-825px ; position: absolute; text-align:left;z-index:1;}
#elslide1{width:263px; height: 379px; margin-right:-4px; text-align:left;z-index:1; margin-top: 20px;}
#elslide2{width:118px; height: 85px; margin-right:-4px; text-align:left;z-index:1; margin-top: 120px;}
#elslide3{width:844px; height: 513px; margin-right:-4px; text-align:left;z-index:1; margin-top: 20px;}
#elslide4{width:118px; height: 85px; margin-right:-4px; text-align:left;z-index:1; margin-top: 120px;}
#elslide5{width:263px; height: 342px; margin-right:-4px; text-align:left;z-index:1; margin-top: 20px;}
#elslide6{ display: none;}


.anterior{ width: 100%; height: 100%; }
.ante{ width: 100%; height: 100%; }
.siguiente{ width: 100%; height: 100%; }
.sig{ width: 100%; height: 100%; }
.producto{ width: 100%; height: 100%; }

#carrusel{
	background:url("../imagenes/nubes.png")center repeat-x;
	animation:200s para reverse infinite linear;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	height: 397px;
	width: 100% ;
	text-align: center; 
}

@keyframes para {
	100% {
		background-position: 
		7680px;
	}
}

#irala{text-align:center;width:100%; background:url("../imagenes/fondo2.jpg") no-repeat center 0  ;background-size:cover;   }

.infotext{ width: 90%; max-width: 850px; display: inline-block; text-align: center; z-index: 9999;}
.infotext2{ width: 90%; max-width: 650px; display: inline-block; text-align: center; z-index: 9999;}
.infotext3{ width: 90%; max-width: 500px; display: inline-block; text-align: center; z-index: 9999;}


.lata{display: inline-block; z-index: 9999;}

#info{ width: 100%; text-align: center;}

#mayor, #mayor1,#mayor2,#mayor3,#mayor4{display:inline-block;vertical-align:top;  z-index: 9999; }
#mayor{ width: 99%; max-width:1570px;vertical-align:middle; text-align:center;}
#mayor1{width:500px;   margin-right:30px; margin-bottom: 30px; text-align:center; background-color: #ffb500; border-radius: 25px 25px 25px 25px; -moz-border-radius: 25px 25px 25px 25px; -webkit-border-radius: 25px 25px 25px 25px; z-index: 9999;}
#mayor2{width:500px;   margin-right:30px; margin-bottom: 30px; text-align:center; background-color: #e18bc3; border-radius: 25px 25px 25px 25px; -moz-border-radius: 25px 25px 25px 25px; -webkit-border-radius: 25px 25px 25px 25px; z-index: 9999;}
#mayor3{width:500px;  margin-right:0; margin-bottom: 30px; text-align:center; background-color: #97a9e9; border-radius: 25px 25px 25px 25px; -moz-border-radius: 25px 25px 25px 25px; -webkit-border-radius: 25px 25px 25px 25px; z-index: 9999;}


#mayo, #mayo1,#mayo2,#mayo3,#mayo4{display:inline-block;vertical-align:top; }
#mayo{ width:100%;vertical-align:middle; text-align:center; }
#mayo1{width:100%;margin-right:0; text-align:center;z-index:1; margin-top: 20px;}
#mayo2{width:85%; margin-right:-4px;text-align:right; z-index:1; }
#mayo3{width:15%; margin-right:-4px;text-align:center; margin-top: 265px; }


#separador{text-align:center;width:100%; height:215px ; background:url("../imagenes/fondo3.jpg") no-repeat 0 0  ;background-size:cover;   }


#compromiso{text-align:center;width:100%; background:url("../imagenes/fondo4.jpg") no-repeat center 0  ;background-size:cover;   }

#almendras{ width: 1029px; height:835px ; position: relative; left: 0; top: 0; display: inline-block; }
#almendras1{ width: 100%; height:100% ; position: absolute; left: 0; top: 0; z-index: 1; }
#almendras2{ width: 313px; height:293px ; position: absolute; right: 0; bottom: 0; z-index: 2;  }


#bol, #bol1{display:inline-block;vertical-align:top; }
#bol{ width:1200px;vertical-align:middle; text-align:left; }
#bol1{width:400px;margin-right:-4px; text-align:left;z-index:1; margin-bottom: 40px;}


#subol, #subol1, #subol2, #subol3{display:inline-block;vertical-align:top; }
#subol{ width:340px;vertical-align:middle; text-align:left; }
#subol1{width:205px;margin-right:-4px; text-align:left;}
#subol2{width:64px;margin-right:-4px; text-align:right; margin-top: 90px;}
#subol3{width:100%;margin-right:0px; text-align:left;}


#contacto{text-align:center;width:100%; background:url("../imagenes/fondo5.jpg") no-repeat 0 0  ;background-size:cover; z-index: -2;  }

#contactame{width:90%; max-width: 1700px; text-align:center; background-color: #f9f7ea; border-radius: 25px 25px 25px 25px; -moz-border-radius: 25px 25px 25px 25px; -webkit-border-radius: 25px 25px 25px 25px; z-index: 9999; display: inline-block;}


#cuadro, #cuadro1,#cuadro2{display:inline-block;vertical-align:top;}
#cuadro{ width: 95%; max-width:1400px;  vertical-align:middle; text-align:center;}
#cuadro1{width:24%;  margin-left:-4px; text-align:left;  }


#abajo, #abajo1,#abajo2,#abajo3,#abajo4{display:inline-block;vertical-align:top;}
#abajo{ width: 90%; max-width:1700px;  vertical-align:middle; text-align:center;}
#abajo1{width:12%;  margin-left:-4px; text-align:left;  }
#abajo2{width:13%;  margin-left:-4px; text-align:left; margin-top: 15px;  }
#abajo3{width:60%;  margin-left:-4px; text-align:center; margin-top: 15px;   }
#abajo4{width:15%;  margin-left:-4px; text-align:right; margin-top: 15px;   }

#footer{width: 100%; background-color: #ffb500; text-align: center;}

.bolsa{ background-image: url("../imagenes/pn.png"); -moz-transition:all .6s;-webkit-transition:all .6s;-o-transition:all .6s;}
.bolsa:hover{ background-image: url("../imagenes/pn2.png"); -moz-transition:all .6s;-webkit-transition:all .6s;-o-transition:all .6s;}

::placeholder{color:#7b7b7b;}

.forma2{text-align:left;HEIGHT:65px;width:90%; padding-left: 5%; border:1; border:0; font-size:14PX;font-weight:400; background-color:#dad7c3;  color:#30302f; -webkit-border-radius: 100px;-moz-border-radius: 100px;border-radius: 100px;border:0;
}

.boto5{ text-align:center; font-size:14px; line-height: 65px; text-transform: uppercase; width: 95%; max-width: 1050px;  border:0;color:#ffffff; background-color: #30302f; text-decoration:none;-moz-transition:all .6s;-webkit-transition:all .6s;-o-transition:all .6s; font-weight:700; cursor: pointer; display: inline-block;-webkit-border-radius: 100px;-moz-border-radius: 100px;border-radius: 100px;}
.boto5:hover{background-color: #686868;}

.smooth{ font-size:18px;  color:#30302f; text-decoration:none;-moz-transition:all .6s;-webkit-transition:all .6s;-o-transition:all .6s;font-family:'timeout';}
.smooth:hover{color: #73b571; }

.enlace{ font-size:18px;  color:#30302f; text-decoration:none;-moz-transition:all .6s;-webkit-transition:all .6s;-o-transition:all .6s;font-family:'timeout';}
.enlace:hover{color: #73b571; }
.enlace.recetas-invertido {
    color: #73b571; /* Verde por defecto */
}

.enlace.recetas-invertido:hover {
    color: #30302f; /* Negro/Gris oscuro al pasar el cursor */
}
.enlace2{ font-size:18px;  color:#73b571; text-decoration:none;font-family:'timeout';}

ul, ol {list-style:none;}
.nav > li { float:left;transition:all .6s;-moz-transition:all .6s;-webkit-transition:all .6s;-o-transition:all .6s;}
.nav li a {;text-decoration:none;display:block;}
.nav li {line-height:20px;}
.nav li ul {display:none;position:absolute; background-color:#ffffff; min-width:190px;  text-align:left;border-radius:10px;}
.nav li:hover > ul { display:block; padding-top:10px;  padding-bottom:10px; }

.donas { font-weight:400; color:#30302f; font-size:11px; transition:all .6s;-moz-transition:all .6s;-webkit-transition:all .6s;-o-transition:all .6s; text-transform: uppercase; line-height: 200%;font-family:'oregular';}
.donas:hover {color: #73b571; }	



@media screen and (max-width:1720px){
#arriba{ width:1500px;}
#arriba2{width:989px;}
}


@media screen and (max-width:1670px){
#home4{ width:100%; height:450px ;  }

#elslide{ width:1280px; height: 450px; position: absolute;  left:50%; margin-left: -640px;  text-align:left;z-index:1;}
#elslide1{width:200px; height: 288px; }
#elslide2{width:80px; height: 58px; }
#elslide3{width:700px; height: 425px; }
#elslide4{width:80px; height: 58px; }
#elslide5{width:220px; height: 286px; }
    
}

@media screen and (max-width:1620px){
.texto8,.texto9,.texto10{font-size:60px;}
    
#mayor1{width:370px;   margin-right:10px;}
#mayor2{width:370px;   margin-right:10px;}
#mayor3{width:370px;  margin-right:0;}    
    
#mayo2{width:100%; margin-right:0px;text-align:center; z-index:1; }
#mayo3{ display: none; }
}


@media screen and (max-width:1520px){
#almendras{ width: 800px; height:649px ; }  
    
#arriba{ width:1300px;}
#arriba2{width:789px;}
}

@media screen and (max-width:1365px){
#abajo1{width:17%;}
#abajo2{width:18%;}
#abajo3{width:45%;}
#abajo4{width:20%; }   
}


@media screen and (max-width:1320px){
#arriba{ width:1200px;}
#arriba2{width:689px;}

.texto1,.texto2,.texto11,.texto12{font-size:100px; }
}

@media screen and (max-width:1300px){
#home4{ width:100%; height:360px ;  }

#elslide{ width:1080px; height: 360px; position: absolute;  left:50%; margin-left: -540px;  text-align:left;z-index:1;}
#elslide3{width:500px; height: 340px; margin-right:-4px; text-align:left;z-index:1;}
}
    
@media screen and (max-width:1220px){
  
    
#cuadro1{width:50%;  margin-left:-4px; text-align:left;  } 

#bol{ width:800px;vertical-align:middle; text-align:left; }
}


@media screen and (max-width:1100px){
#home4{ width:100%; height:495px ;  }

#elslide{ width:680px; height: 495px; position: absolute;  left:50%; margin-left: -340px;  text-align:left;z-index:1;}
#elslide1,#elslide5{ display: none;}    
#elslide3{width:500px; height: 340px; margin-right:-4px; text-align:left;z-index:1;}
 
    
}


@media screen and (max-width:1050px){
#abajo1{width:100%;  margin-left:0px; text-align:center;  }
#abajo2{width:100%;  margin-left:0px; text-align:center; margin-top: 15px;  }
#abajo3{width:100%;  margin-left:0px; text-align:center; margin-top: 15px;   }
#abajo4{width:100%;  margin-left:0px; text-align:center; margin-top: 15px;   }    
    
    

}


@media screen and (max-width:1020px){
#flotante8{ width: 150px; height: 184px; }    
    
#mayor1,#mayor2{ margin-right: 0;}    
    
.texto1,.texto2,.texto11,.texto12{font-size:90px; }
}



@media screen and (max-width:820px){
#home5{ width:250px; height:234px; margin-top: 100px;}    
    
    
#bol{ width:340px;vertical-align:middle; text-align:center; }
#bol1{width:100%;margin-right:0px; text-align:center;z-index:1;}


#subol{ width:340px;vertical-align:middle; text-align:center; }
#subol1{width:100%;margin-right:0px; text-align:center;}
#subol2{ display: none;}
#subol3{width:100%;margin-right:0px; text-align:center;}    
    
#almendras{ width: 600px; height:487px ; }    
#almendras2{ display: none;}  
    
#flotante4{ display: none;}    
#flotante5{ display: none;}     
    
.texto1,.texto2,.texto11,.texto12{font-size:80px; }
}


@media screen and (max-width:700px){
#home4{ width:100%; height:373px ; top: 350px;  }

#elslide{ width:420px; height: 373px; position: absolute;  left:50%; margin-left: -210px;  text-align:left;z-index:1;}
#elslide3{width:350px; height: 213px; margin-right:-4px; text-align:left;z-index:1;}
#elslide2{width:35px; height: 25px; }
#elslide4{width:35px; height: 25px; } 
#elslide6{width:100%; height: 129px;  margin-right:0px; text-align:center;z-index:1; margin-top: 0px; display: inline-block}       
}


@media screen and (max-width:620px){
#cuadro1{width:100%;  margin-left:0px; text-align:left;  }    
    
#almendras{ width: 350px; height:284px ; }  
    
.texto8,.texto9,.texto10{font-size:90px;}
    
    
.texto1,.texto2,.texto11,.texto12{font-size:70px; }
    
#mayor1{width:98%; }
#mayor2{width:98%;  }
#mayor3{width:98%;}

#mayo2{width:100%; margin-right:0px;text-align:center; z-index:1; }
#mayo3{ display: none; }
    
    
}



@media screen and (max-width:520px){
.texto1,.texto2,.texto11,.texto12{font-size:60px; }
}



#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: .9;
}
.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: #ffffff;
}
.button_container.active .middle {
  opacity: 0;
  background: #ffffff;
}
.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: #ffffff;
}
.button_container span {
  background: #00782f;
  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:rgba(0,120,47,.95);
    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:1;
  visibility: visible;
  height: 100%;
}
.overlay.open li {
  -webkit-animation: fadeInUp .5s ease forwards;
  -moz-animation: fadeInUp .5s ease forwards;
          animation: fadeInUp .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.open li:nth-of-type(5) {
  -webkit-animation-delay: .55s;
  -moz-animation-delay: .55s;
          animation-delay: .55s;
}
.overlay.open li:nth-of-type(6) {
  -webkit-animation-delay: .60s;
  -moz-animation-delay: .60s;
          animation-delay: .60s;
}
.overlay.open li:nth-of-type(7) {
  -webkit-animation-delay: .65s;
  -moz-animation-delay: .65s;
          animation-delay: .65s;
}
.overlay.open li:nth-of-type(8) {
  -webkit-animation-delay: .7s;
  -moz-animation-delay: .7s;
          animation-delay: .7s;
}
.overlay.open li:nth-of-type(9) {
  -webkit-animation-delay: .75s;
  -moz-animation-delay: .75s;
          animation-delay: .75s;
}
.overlay.open li:nth-of-type(10) {
  -webkit-animation-delay: .8s;
  -moz-animation-delay: .8s;
          animation-delay: .8s;
}
.overlay.open li:nth-of-type(11) {
  -webkit-animation-delay: .85s;
  -moz-animation-delay: .85s;
          animation-delay: .85s;
}
.overlay nav {
  position: relative;
  height: 70%;
  top: 40%;
  -webkit-transform: translateY(-35%);
  -moz-transform: translateY(-35%);
          transform: translateY(-35%);
  
  font-weight: 900;
  text-align: center;
  margin-right:0;
}
.overlay ul {
  list-style: none;
  padding: 0;
  margin: 0 auto;
  display: inline-block;
  position: relative;
  height: 100%;
}
.overlay ul li {
  display: block;
  min-height: 60px;
  position: relative;
  opacity: 0;
}
.overlay ul li a {
  display: block;
  position: relative;
  color: #30302f;
  text-decoration: none;
  overflow: hidden;
  font-size: 35px;
  opacity:1;
  font-family:'oregular'; color: #ffffff;
}
.overlay ul li a:hover,a:after, .overlay ul li a:focus:after, .overlay ul li a:active:after {
  width: 100%; color: #CFCFCF;-webkit-transition: .25s;
  transition: .25s;
}
.overlay ul li a:after {
  font-size: 40px;
  opacity:.9;-webkit-transition: .25s;
  transition: .25s;
}
.subme {  width: 100%;font-size: 32px;color: #ffffff; font-weight:600; }


@-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:1220px){
#arriba{width:100%;vertical-align:middle; text-align:left; }
#arriba2,#arriba3{ display:none;}
    

#menumovil{ z-index:9999;position: absolute;top: 50px;
  right: 15px;
  height: 27px;
  width: 35px; display:block; z-index:999;}

#elheader{ z-index:9999;}
}



 .scroll-div {
            width: 60px;
            height: 60px;
            position: absolute;
            left: 2%;
            bottom:10px;
            z-index: 9999;
            transition: opacity 0.3s ease;
        }

        .hidden {
            opacity: 0;
            pointer-events: none;
        }




.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;   -moz-transform: translateY(5px); }
}

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

@-moz-keyframes spin2 {
    0% {
opacity: 1;   -moz-transform: translateX(0px); }

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



@-webkit-keyframes spin2 {
    0% {
opacity: 1; -webkit-transform: translateX(0px); }

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


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

@-moz-keyframes spin3 {
    0% {
opacity: 1;   -moz-transform: translateX(0px); }

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



@-webkit-keyframes spin3 {
    0% {
opacity: 1; -webkit-transform: translateX(0px); }

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


.redes{transition:all 1s;-moz-transition:all 1s;-webkit-transition:all 1s;-o-transition:all 1s; opacity: 1; margin: 2px;}
.redes:hover{ opacity: .6;}   


.cell{-moz-animation:bounci 2.5s infinite linear;-webkit-animation:bounci 2.5s infinite linear;-0-animation:bounci 2.5s infinite linear;animation:bounci 2.5s infinite linear;}
.cell2{-moz-animation:bounci 1.5s infinite linear;-webkit-animation:bounci 1.5s infinite linear;-0-animation:bounci 1.5s infinite linear;animation:bounci 1.5s infinite linear;}
.cell3{-moz-animation:bounci 3.5s infinite linear;-webkit-animation:bounci 3.5s infinite linear;-0-animation:bounci 3.5s infinite linear;animation:bounci 3.5s infinite linear;}
.cell4{animation: shaker 8s infinite linear;}
.cell5{animation: bop 4s infinite linear;}

 @keyframes bop {
            0% { 
                transform:  scale(1) rotate(0deg); 
            }
             50% { 
                transform:  scale(.9) rotate(-2deg) ; 
            }
            100% { 
                transform:  scale(1) rotate(0deg); 
            }
        }


@-webkit-keyframes shaker {
  0%, 100% {
    -webkit-transform: translateX(0) rotate(0deg) scale(1);
    transform: translateX(0) rotate(0deg) scale(1);
  }

  10%, 30%, 50%, 70%, 90% {
    -webkit-transform: translateX(-3px) rotate(-2deg) scale(0.97);
    transform: translateX(-3px)  rotate(-1deg) scale(0.97);
  }

  20%, 40%, 60%, 80% {
    -webkit-transform: translateX(3px) rotate(2deg) scale(1);
    transform: translateX(3px) rotate(1deg) scale(1);
  }
}

@keyframes shaker {
  0%, 100% {
    -webkit-transform: translateX(0) rotate(0deg) scale(1);
    -ms-transform: translateX(0) rotate(0deg) scale(1);
    transform: translateX(0) rotate(0deg) scale(1);
  }

  10%, 30%, 50%, 70%, 90% {
    -webkit-transform: translateX(-3px) rotate(-2deg) scale(0.97);
    -ms-transform: translateX(-3px) rotate(-2deg) scale(0.97);
    transform: translateX(-3px) rotate(-2deg) scale(0.97);
  }

  20%, 40%, 60%, 80% {
    -webkit-transform: translateX(3px) rotate(1deg) scale(1);
    -ms-transform: translateX(3px) rotate(1deg) scale(1);
    transform: translateX(3px) rotate(1deg) scale(1);
  }
}

 @keyframes shak {
            0%, 60%, 100% { 
                transform: translateX(0) rotate(0deg) scale(1); /* Estado de pausa sin cambios */
            }
            10%, 30%, 50% { 
                transform: translateX(-10px) rotate(-2deg) scale(0.97); /* Movimiento hacia la izquierda con rotación y reducción */
            }
            20%, 40% { 
                transform: translateX(10px) rotate(2deg) scale(1); /* Movimiento hacia la derecha con rotación y reducción */
            }
        }


@keyframes bounci {
  0% {
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }

  40% {
    -webkit-transform: translateY(-12px);
    -ms-transform: translateY(-12px);
    transform: translateY(-12px);
  }


     100% {
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }
}

.bounce {
  -webkit-animation-name: bounce;
  animation-name: bounce;
}

.ampliar{
-webkit-transform:scale(1);
-webkit-transition-duration: 0.6s;
-webkit-opacity: 1;

-moz-transform:scale(1);
-moz-transition-duration: 0.6s;
-moz-opacity: 1;

-ms-transform:scale(1);
-ms-transition-duration: 0.6s;
-ms-opacity: 1;
}
.ampliar:hover{
-webkit-transform:scale(1.1);
-webkit-opacity:.8;
-webkit-transition-duration: 0.6s;

-moz-transform:scale(1.1);
-moz-opacity:.8;
-moz-transition-duration: 0.6s;

-ms-transform:scale(1.1);
-ms-opacity:.8;
-ms-transition-duration: 0.6s;

}