@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@@300;400;500;700&display=swap');
@font-face {font-family: 'regular';src: url("gr.woff") format("woff");font-style: normal;}
@font-face {font-family: 'medium';src: url("gm.woff") format("woff");font-style: normal;}

.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: 'regular';}
*{
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;}

*:focus { 
    outline: none; 
} 

#popup {
		background-color: rgba(6,12,49,0.9);
		position: fixed;
		top:0;
		left:0;
		right:0;
		bottom:0;
		margin:0;
		-webkit-animation:autopopup 2s;
		-moz-animation:autopopup 2s;
		animation:autopopup 2s;z-index:9999;
	}
		@-webkit-keyframes autopopup {
			from {opacity: 0;margin-top:-200px;}
			to {opacity: 1;}
		}
		@-moz-keyframes autopopup {
			from {opacity: 0;margin-top:-200px;}
			to {opacity: 1;}
		}
		@keyframes autopopup {
			from {opacity: 0;margin-top:-200px;}
			to {opacity: 1;}
		}

	#popup:target {
		-webkit-transition:all 1s;
		-moz-transition:all 1s;
		transition:all 1s;
		opacity: 0;
		visibility: hidden;z-index:9999;
	}

	.popup-contenedor {
		position: relative;
		margin:1% auto;
		padding:0;
		background-color: transparent;
		color:#333;
		border-radius: 3px;
		width:495px;
		height:356px;
		z-index:9999;
		top:100px;
		
	}

	a.popup-cerrar {
		position: absolute;
		bottom:-48px;
		right:45px;
		font-size: 30px;
		text-decoration: none;
		line-height: 1;
		color:#241e20;
	}
	
#elheader2{ width:100%; height:100px; background-color:#FFFFFF; top:0px; left:0; position:absolute; z-index:6;}
#whatsapp{ width:281px; height:108px; bottom:10px; right:10px; position:fixed; z-index:6;}

#slide1{text-align:center;width:100%;min-height:700px; height:100%;}
#soyfeliz{ width:100%; text-align:center;height:300px;}
#separador{background:url(../imagenes/separa.jpg) no-repeat 50% 50% fixed ;background-size:cover; text-align:center; width:100%; height:500px;}
#footi{ width:100%; background-color:#000000;}
#historia{ width:100%; background-color:#ece4d9;}
#separarecetas{background:url(../imagenes/recetas.jpg) no-repeat 50% 50% fixed ;background-size:cover; text-align:center; width:100%; height:500px;}
#enviar{ width:100%; height:350px;}
#contactame{ width:100%; background-color:#f1f2f4;}
#recetame{ width:100%; background-color:#f7f8f9; z-index:999;}


#todo{ width:100%; height:100%; min-height:700px; left:0; top:0; position:relative; z-index:5;}
#flechas{POSITION:absolute; width:249px; height:66px;  left:50%; margin-left:-125px; bottom:0px; background:url(../imagenes/ff.png); z-index:3;}

.textito1{color:#00195b;font-size:19px; font-family: 'medium';}
.textito2a{color:#00195b;font-size:19px; font-family: 'medium';}

.texto1{color:#00195b;font-size:19px; font-family: 'medium';}
.texto2{color:#00195b;font-size:13px;line-height:160%; font-weight:500;font-family: 'regular';}
.texto3{color:#00195b;font-size:53px;line-height:160%; font-weight:400;font-family: 'Playfair Display', serif;}
.texto4{color:#00195b;font-size:21px;line-height:160%; font-weight:400;font-family: 'regular';}
.texto5{color:#ffffff;font-size:48px;line-height:100%; font-weight:400;font-family: 'Playfair Display', serif;}
.texto6{color:#ffffff;font-size:18px;line-height:160%; font-weight:400;font-family: 'regular';}
.texto7{color:#000000;font-size:48px;line-height:120%; font-weight:400;font-family: 'Playfair Display', serif;}
.texto8{color:#ffffff;font-size:14px;line-height:160%; font-weight:400;font-family: 'regular';}
.texto9{color:#777878;font-size:14px;line-height:160%; font-weight:400;font-family: 'regular';}
.texto10{color:#000000;font-size:18px;font-family: 'regular';  }
.texto11{color:#ffffff;font-size:25px;line-height:120%; font-weight:700;font-family: 'Playfair Display', serif;}
.texto12{color:#ffffff;font-size:16px;line-height:160%; font-weight:400;font-family: 'regular';}
.texto13{color:#000000;font-size:50px;line-height:120%; font-weight:400;font-family: 'Playfair Display', serif;}
.texto14{color:#000000;font-size:16px;line-height:160%; font-weight:400;font-family: 'regular';}
.texto14a{color:#000000;font-size:18px;line-height:160%; font-weight:400;font-family: 'regular';}
.texto15{color:#000000;font-size:30px;line-height:120%; font-weight:400;font-family: 'Playfair Display', serif;}
.texto15a{color:#000000;font-size:31px;line-height:120%; font-weight:400;font-family: 'Playfair Display', serif; text-decoration:underline;}

#arriba, #arriba1,#arriba2,#arriba3{display:inline-block;vertical-align:top;}
#arriba{width:100%;vertical-align:middle; text-align:left;}
#arriba1{width:10%;margin-right:-5px; text-align:right; margin-top:8px; }
#arriba2{width:70%;margin-right:-5px;text-align:right; margin-top:20px; }
#arriba3{ width:20%; min-width:220px;margin-right:-5px;text-align:right; background-color:#e3813a; height:100px; }

input[type="search"]{
	width: 19px;
	background:url('../imagenes/search.png') no-repeat 9px center;
	padding: 9px 10px 9px 32px;
	border-radius: 15em;
	transition: all .5s;
	outline: none;
	border:0;
}
input[type="search"]:focus{
	width: 120px;
	padding-left:10px;
	color: #000;
	background-color: #FFF;
	text-align:center;
}

#elcono{width:100%; height:500px;  left:0; top:0; position:relative;}


.formab{text-align:left;HEIGHT:60px;width:90%;border:0; font-size:14PX;color:#0c1f5a;font-weight:400;padding-left:30px; background-color:#ffffff; border-radius: 30px 30px 30px 30px; -moz-border-radius: 30px 30px 30px 30px; -webkit-border-radius: 30px 30px 30px 30px; text-transform:uppercase;}


.boton1{text-align:center;HEIGHT:50px;width:290px;border:0; font-size:14PX;color:#ffffff;font-weight:400; background-color:#00a7e0; border-radius: 30px 30px 30px 30px; -moz-border-radius: 30px 30px 30px 30px; -webkit-border-radius: 30px 30px 30px 30px; cursor:pointer;}

.forma2{text-align:center;HEIGHT:40px;width:100%;border:0; font-size:14PX;color:#1a2459;font-weight:500; background-color:transparent; }


.transparente3{text-align:left;HEIGHT:50px;width:290px;border:0; font-size:14PX;color:#0c1f5a;font-weight:400;padding-left:30px; background-color:#E5E5E5; }
.transparente4{text-align:left;border:0; width:450px;font-size:14PX;color:#0c1f5a;font-weight:400;background-color:#E5E5E5; }


#menumovil{ display:none;}

.lasredes{opacity:1;-webkit-transition:all .3s ease;-moz-transition:all .3s ease;transition:all .3s ease;}
.lasredes:hover{opacity:.6;-webkit-transition:all .3s ease;-moz-transition:all .3s ease;transition:all .3s ease;}

#todosobremi{ width:100%; height:1958px; left:0; top:0; position:relative; z-index:5;}
#pleca1{POSITION:absolute; width:700px; height:1958px;  left:0;  top:0px; background:url(../imagenes/f1.jpg); z-index:1;}
#pleca2{POSITION:absolute; width:480px; height:1929px;  right:0; top:0px; background:url(../imagenes/f2.png); z-index:1;}

#anamaria{POSITION:absolute; width:964px;  left:50%; margin-left:-482px; background-color:#ffffff; text-align:center;z-index:2;}

#ana, #ana1,#ana2,#ana3{display:inline-block;vertical-align:top;}
#ana{width:100%;vertical-align:middle; text-align:left;margin-top:8px; }
#ana1{width:50%;margin-right:-4px; text-align:left; margin-top:37px; }
#ana2{width:50%;margin-right:-4px;text-align:right; background-color:#ffffff; }
#ana3{ display:none;}


#elpropo{ width:100%; height:500px; left:0; top:0; position:relative; z-index:5;}
#pleca3{POSITION:absolute; width:480px; height:500px;  right:0; top:0px; background:url(../imagenes/f3.jpg); z-index:1;}

#receta, #receta1,#receta2{display:inline-block;vertical-align:top;}
#receta{width:100%;vertical-align:middle; text-align:left;}
#receta1{width:25%;margin-right:-5px; text-align:left; height:500px; }
#receta2{width:25%;margin-right:-4px;text-align:right; height:500px;   }

.latabla{ width:370px; height:500px;}

#todoenviar{ width:100%; height:350px; left:0; top:0; position:relative; z-index:5;}
#pleca4{POSITION:absolute; width:249px; height:66px;  left:50%; margin-left:-125px; top:-66px; background:url(../imagenes/ff.png); z-index:3;}
#formularios{POSITION:absolute; width:450px;  left:50%; margin-left:-225px; top:85px; z-index:3; background-color:#ffffff;}


#abajo, #abajo1,#abajo2{display:inline-block;vertical-align:top;}
#abajo{width:90%;vertical-align:middle; text-align:left;}
#abajo1{width:35%;margin-right:-5px; text-align:left;  }
#abajo2{width:65%;margin-right:-5px;text-align:left; margin-top:20px; }

#todocontactame{ width:100%; height:900px; left:0; top:0; position:relative; z-index:5;}

#contacto, #contacto1,#contacto2{display:inline-block;vertical-align:top;}
#contacto{width:100%;vertical-align:middle; text-align:left;}
#contacto1{width:50%;margin-right:-4px; text-align:left; height:900px; }
#contacto2{width:50%;margin-right:-5px;text-align:right; height:900px;background:url(../imagenes/con2.jpg) no-repeat 50% 50% ;background-size:cover;}

#todocontacto1{ width:100%; height:100%; left:0; top:0; position:relative; z-index:5;}
#todocontacto1a{ width:224px; height:224px; right:0; top:100px; position:absolute; z-index:1;}
#todocontacto1b{ width:430px; right:20px; top:280px; position:absolute; z-index:1;}
#todocontacto1c{ width:317px; left:20px; top:280px; position:absolute; z-index:1;}


#lasrecetas{background:url(../imagenes/recetas1.jpg) no-repeat 0 50% ;background-size:cover; text-align:center; width:100%;height:1160px }
#todorecetas{ width:100%; height:100%; min-height:700px; left:0; top:0; position:relative; z-index:5;}
#todorecetas1{POSITION:absolute; width:481px; height:858px;  left:0;  top:302px;  z-index:1; background:url(../imagenes/recetas2.png);}
#todorecetas2{POSITION:absolute; width:1142px; height:883px;  left:50%; margin-left:-571px; top:150px;  z-index:3;}

#todorecetas5{POSITION:absolute; width:1000px; height:70px;  left:50%; margin-left:-500px; bottom:0px;  z-index:4; background-color:#ffffff; z-index:5;}
#todorecetas3{ display:none;}


#todorecetas4{POSITION:absolute; width:215px; height:857px;  right:0; top:1400px;  z-index:1; background:url(../imagenes/recetas3.png); z-index:1;}
#todorecetas6{POSITION:absolute; width:114px; height:102px;  right:140px;  top:1105px;  z-index:1; background:url(../imagenes/recetas4.png); z-index:1;}
#todorecetas6a{POSITION:absolute; width:114px; height:102px;  right:140px;  top:600px;  z-index:1; background:url(../imagenes/recetas4.png); z-index:1;}

.lima2{ width:100%; max-width:850px;}


#sbmenus, #sbmenus1,#sbmenus2{display:inline-block;vertical-align:top;}
#sbmenus{width:1000px;vertical-align:middle; text-align:left;}
#sbmenus1{width:500px;margin-right:-4px; text-align:left; margin-top:14px;  }
#sbmenus2{width:500px;margin-right:-4px;text-align:right; }


#lasre, #lasre1{display:inline-block;vertical-align:top;}
#lasre{width:1200px;vertical-align:middle; text-align:left; z-index:999;}
#lasre1{width:400px;margin-right:-4px; text-align:center; margin-top:20px;  }

#unore{
border-radius: 10px 10px 0px 0px;
-moz-border-radius: 10px 10px 0px 0px;
-webkit-border-radius: 10px 10px 0px 0px; 
width:380px; height:250px;}

#dosre{
border-radius: 0px 0px 10px 10px;
-moz-border-radius: 0px 0px 10px 10px;
-webkit-border-radius: 0px 0px 10px 10px;
width:380px; height:250px;
}


#detallame, #detallame1,#detallame2{display:inline-block;vertical-align:top;}
#detallame{width:100%;vertical-align:middle; text-align:left;}
#detallame1{width:50%;margin-right:-5px; text-align:left; height:550px; }
#detallame2{width:50%;margin-right:-4px;text-align:left; height:550px;  }

#ingredientes{ width:450px; margin-top:50px; margin-left:50px;}


#articulosban{ width:100%; background-color:#00115d; height:643px; left:0; top:0; position:relative; z-index:5;}

#articulosban1{ width:482px;height:643px; background:url(../imagenes/art1.png); left:0; top:0; position:absolute; z-index:1;}
#articulosban2{ width:320px;height:557px; background:url(../imagenes/art5.png); right:0; top:0; position:absolute; z-index:2;}
#articulosban3{width:1200px;height:643px; left:50%; margin-left:-600px; top:0; position:absolute; z-index:1;}
#articulosban4{ width:928px;height:643px; background:url(../imagenes/art6.png); right:0; top:0; position:absolute; z-index:3;}

#artiban, #artiban1,#artiban2{display:inline-block;vertical-align:top;}
#artiban{width:100%;vertical-align:middle; text-align:left;}
#artiban1{width:50%;margin-right:-5px; text-align:center; height:643px;  }
#artiban2{width:50%;margin-right:-4px;text-align:left; height:643px;background:url(../imagenes/art4.png) no-repeat 50% 50% ;background-size:cover;  }


#artis, #artis1,#artis2{display:inline-block;vertical-align:top;}
#artis{width:1000px;vertical-align:middle; text-align:left; background-color:#f7f8fa;}
#artis1{width:500px; height:440px;margin-right:-4px; text-align:left;  }
#artis2{width:450px;margin-right:-4px;text-align:left; margin-left:50px; }

@media screen and (max-width:1600px){
#todorecetas4{ display:none;}

}

@media screen and (max-width:1500px){
#receta1{width:50%;}
#receta2{width:50%;}

#articulosban4{ display:none;}
}

@media screen and (max-width:1220px){
#arriba1{width:10%;}
#arriba2{width:65%;}
#arriba3{ width:25%; }

#lasre{width:800px;vertical-align:middle; text-align:left; z-index:999;}

#articulosban3{width:1000px;height:643px; left:50%; margin-left:-500px; top:0; position:absolute; z-index:}

}

@media screen and (max-width:1160px){
#todorecetas3{POSITION:absolute; width:100%;  left:0%; top:150px;  z-index:3; display:block;}
#todorecetas2{ display:none;}

#articulosban2{ display:none;}
}

@media screen and (max-width:1020px){
	
#artis{width:800px;vertical-align:middle; text-align:left; background-color:#f7f8fa;}
#artis1{width:350px; height:440px;margin-right:-4px; text-align:left;  }
#artis2{width:350px;margin-right:-4px;text-align:left; margin-left:50px; }	

#arriba1{width:10%;}
#arriba2{width:60%;}
#arriba3{ width:30%; }

#abajo{width:450px;vertical-align:middle; text-align:left;}
#abajo1{width:100%;margin-right:0px; text-align:center; }
#abajo2{width:100%;margin-right:0px;text-align:center; margin-top:20px; }

#todocontactame{ width:100%; height:1200px;}

#contacto1{width:100%;margin-right:0px; text-align:left; height:800px; }
#contacto2{width:100%;margin-right:0px;text-align:right; height:400px;}

#todocontacto1a{ width:224px; height:224px; right:0; top:100px; position:absolute; z-index:1;}
#todocontacto1b{ width:430px; right:50%; margin-right:-215px; top:180px; position:absolute; z-index:1;}
#todocontacto1c{ width:430px; text-align:left; left:50%; margin-left:-215px;  top:80px; position:absolute; z-index:1;}

#todorecetas5{POSITION:absolute; width:800px;margin-left:-400px;}

#sbmenus{width:800px;vertical-align:middle; text-align:left;}
#sbmenus1{width:300px;margin-right:-4px; text-align:left; margin-top:14px;  }
#sbmenus2{width:500px;margin-right:-4px;text-align:right; }

#detallame1{width:100%;margin-right:0px; text-align:left; height:400px; }
#detallame2{width:100%;margin-right:0px;text-align:left; height:500px;  }

#ingredientes{ width:90%; margin-top:50px; margin-left:5%;}
#todorecetas6a{ display:none;}

#articulosban3{width:100%;height:643px; left:0%; margin-left:00px; top:0; position:absolute; z-index:}

}

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

#anamaria{width:90%;  left:5%; margin-left:0px;}

#ana1{width:100%;margin-right:-4px; text-align:center; margin-top:37px; }
#ana2{width:100%;margin-right:-4px;text-align:center; }

#todosobremi{ width:100%; height:3200px;}

#soyfeliz{ width:100%; text-align:center;height:350px;}

}

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

#artis{width:450px;vertical-align:middle; text-align:left; background-color:#f7f8fa;}
#artis1{width:450px; height:440px;margin-right:0px; text-align:left;  }
#artis2{width:450px;margin-right:0px;text-align:left; margin-left:00px; }

#todorecetas3{POSITION:absolute; width:100%;  left:0%; top:250px;  z-index:3; display:block;}

#todorecetas5{POSITION:absolute; width:100%;margin-left:0px; left:0; height:90px;}

#sbmenus{width:450px;vertical-align:middle; text-align:left;}
#sbmenus1{width:450px;margin-right:0px; text-align:center; margin-top:14px; height:20px;  }
#sbmenus2{width:450px;margin-right:0px;text-align:right; }
#receta2{width:100%;margin-right:0px;}

#lasre{width:400px;vertical-align:middle; text-align:left; z-index:999;}
#lasre1{width:400px;margin-right:0px; text-align:center; margin-top:20px;  }

#artiban{width:100%;vertical-align:middle; text-align:left;}
#artiban1{width:100%;margin-right:-5px; text-align:center; height:643px;  }
#artiban2{ display:none;}
}


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


	
#todorecetas6{ display:none;}	
#todorecetas4{ display:none;}	
#lasrecetas{height:1000px }	

#todorecetas1{height:558px; }
#todorecetas2{height:583px; }

#pleca1{ display:none;}
#pleca2{POSITION:absolute; width:100%;}

#todosobremi{height:3300px;}

#separador{background:url(../imagenes/separa.jpg) no-repeat 50% 50%  ;}

#receta1{width:100%;margin-right:0px; text-align:left; height:500px; }




}

@media screen and (max-width:600px){
#ana3{width:100%;margin-right:-4px;text-align:center; display:inline-block;}
#ana2{ display:none;}

#soyfeliz{ width:100%; text-align:center;height:400px;}
#elpropo{ width:100%; height:550px;}
#pleca3{ height:550px; }
}

@media screen and (max-width:500px){
#lasrecetas{height:900px }	

#todorecetas1{height:458px; }
#todorecetas2{height:483px; }

#pleca3{POSITION:absolute; width:100%;}
}
	
.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;}
 #buscarmovil{ display:none;  }
 
@media screen and (max-width:950px){

#arriba{width:90%;vertical-align:middle; text-align:left; }
#arriba1{width:100%;margin-right:-4px;  text-align:left;}
#arriba2,#arriba3{display:none;}

#menumovil{ z-index:9999;position: absolute;top:40px;
  right: 30px;
  height: 27px;
  width: 35px; display:block;}
  
  #buscarmovil{ 
  width:260px; right:0px;text-align:center; background-color:#e3813a; height:70px; top:100px;position: absolute;display:block;z-index:1;
  }
  
}

.button_container {
  position: absolute;
  top: -2px;;
  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: #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: #e3813a;
  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(6,12,49,0.8);
    top: 0;
  left: 0;
  width: 100%;
  height: 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 {
  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: center;
  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: 80px;
  position: relative;
  opacity: 0;
}
.overlay ul li a {
  display: block;
  position: relative;
  color: #ffffff;
  text-decoration: none;
  overflow: hidden;
  font-size: 60px;
  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: 61px;
  opacity:1;-webkit-transition: .25s;
  transition: .25s; opacity:.8;color: #f3c043;
}
.overlay ul li a:after {
  font-size: 61px;
  opacity:.9;-webkit-transition: .25s;
  transition: .25s;
  
}


[class^="hvr-"] {
    font-family: 'medium'; text-transform:uppercase; font-size:13px; letter-spacing:4px;
}

[class^="hvr-"] {
   margin: .4em;
  padding: 1em;
  cursor: pointer;
  text-decoration: none;
  color: #000000;
  /* Prevent highlight colour when element is tapped */
  -webkit-tap-highlight-color: rgba(0,0,0,0);

  /* Smooth fonts */
  -webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	border-radius:30px;-moz-border-radius:30px;-webkit-border-radius:30px; 
}
.hvr-radial-out {
  display: inline-block;
  vertical-align: middle;
  -webkit-transform: perspective(1px) translateZ(0);
  transform: perspective(1px) translateZ(0);
  box-shadow: 0 0 1px transparent;
  position: relative;
  overflow: hidden;
  -webkit-transition-property: color;
  transition-property: color;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
}
.hvr-radial-out:before {
  content: "";
  position: absolute;
  z-index: -1;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: #f3c043;
  border-radius: 100%;
  -webkit-transform: scale(0);
  transform: scale(0);
  -webkit-transition-property: transform;
  transition-property: transform;
  -webkit-transition-duration: 0.6s;
  transition-duration: 0.6s;
  -webkit-transition-timing-function: ease-out;
  transition-timing-function: ease-out;
}
.hvr-radial-out:hover, .hvr-radial-out:focus, .hvr-radial-out:active {
  color: white;
}
.hvr-radial-out:hover:before, .hvr-radial-out:focus:before, .hvr-radial-out:active:before {
  -webkit-transform: scale(2);
  transform: scale(2);
}



.smooth2 {
    font-family: 'medium'; text-transform:uppercase; font-size:13px; letter-spacing:4px;

   margin: .4em;
  padding: 1em;
  cursor: pointer;
  text-decoration: none;
  color: #000000;
  /* Prevent highlight colour when element is tapped */
  -webkit-tap-highlight-color: rgba(0,0,0,0);

  /* Smooth fonts */
  -webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	border-radius:30px;-moz-border-radius:30px;-webkit-border-radius:30px; 
}
.smooth2 {
  display: inline-block;
  vertical-align: middle;
  -webkit-transform: perspective(1px) translateZ(0);
  transform: perspective(1px) translateZ(0);
  box-shadow: 0 0 1px transparent;
  position: relative;
  overflow: hidden;
  -webkit-transition-property: color;
  transition-property: color;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
}
.smooth2:before {
  content: "";
  position: absolute;
  z-index: -1;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: #f3c043;
  border-radius: 100%;
  -webkit-transform: scale(0);
  transform: scale(0);
  -webkit-transition-property: transform;
  transition-property: transform;
  -webkit-transition-duration: 0.6s;
  transition-duration: 0.6s;
  -webkit-transition-timing-function: ease-out;
  transition-timing-function: ease-out;
}
.smooth2:hover {
  color: white;
}
.smooth2:hover:before{
  -webkit-transform: scale(2);
  transform: scale(2);
}





.rece1 {
    font-family: 'medium'; text-transform:uppercase; font-size:15px;letter-spacing:4px;

   margin: .4em;
  padding: 1em;
  cursor: pointer;
  text-decoration: none;
  color: #000000;
  /* Prevent highlight colour when element is tapped */
  -webkit-tap-highlight-color: rgba(0,0,0,0);

  /* Smooth fonts */
  -webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	border-radius:30px;-moz-border-radius:30px;-webkit-border-radius:30px; 
}
.rece1 {
  display: inline-block;
  vertical-align: middle;
  -webkit-transform: perspective(1px) translateZ(0);
  transform: perspective(1px) translateZ(0);
  box-shadow: 0 0 1px transparent;
  position: relative;
  overflow: hidden;
  -webkit-transition-property: color;
  transition-property: color;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
}
.rece1:before {
  content: "";
  position: absolute;
  z-index: -1;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: #f3c043;
  border-radius: 100%;
  -webkit-transform: scale(0);
  transform: scale(0);
  -webkit-transition-property: transform;
  transition-property: transform;
  -webkit-transition-duration: 0.6s;
  transition-duration: 0.6s;
  -webkit-transition-timing-function: ease-out;
  transition-timing-function: ease-out;
}
.rece1:hover {
  color: white;
}
.rece1:hover:before{
  -webkit-transform: scale(2);
  transform: scale(2);
}

.rece2 {
    font-family: 'medium'; text-transform:uppercase; font-size:15px;letter-spacing:4px;

   margin: .4em;
  padding: 1em;
  cursor: pointer;
  text-decoration: none;
  color: #000000;
  /* Prevent highlight colour when element is tapped */
  -webkit-tap-highlight-color: rgba(0,0,0,0);

  /* Smooth fonts */
  -webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	border-radius:30px;-moz-border-radius:30px;-webkit-border-radius:30px; 
}
.rece2 {
  display: inline-block;
  vertical-align: middle;
  -webkit-transform: perspective(1px) translateZ(0);
  transform: perspective(1px) translateZ(0);
  box-shadow: 0 0 1px transparent;
  position: relative;
  overflow: hidden;
  -webkit-transition-property: color;
  transition-property: color;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
}
.rece2:before {
  content: "";
  position: absolute;
  z-index: -1;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: #7c9f4d;
  border-radius: 100%;
  -webkit-transform: scale(0);
  transform: scale(0);
  -webkit-transition-property: transform;
  transition-property: transform;
  -webkit-transition-duration: 0.6s;
  transition-duration: 0.6s;
  -webkit-transition-timing-function: ease-out;
  transition-timing-function: ease-out;
}
.rece2:hover {
  color: white;
}
.rece2:hover:before{
  -webkit-transform: scale(2);
  transform: scale(2);
}





.rece3 {
    font-family: 'medium'; text-transform:uppercase; font-size:15px;letter-spacing:4px;

   margin: .4em;
  padding: 1em;
  cursor: pointer;
  text-decoration: none;
  color: #000000;
  /* Prevent highlight colour when element is tapped */
  -webkit-tap-highlight-color: rgba(0,0,0,0);

  /* Smooth fonts */
  -webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	border-radius:30px;-moz-border-radius:30px;-webkit-border-radius:30px; 
}
.rece3 {
  display: inline-block;
  vertical-align: middle;
  -webkit-transform: perspective(1px) translateZ(0);
  transform: perspective(1px) translateZ(0);
  box-shadow: 0 0 1px transparent;
  position: relative;
  overflow: hidden;
  -webkit-transition-property: color;
  transition-property: color;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
}
.rece3:before {
  content: "";
  position: absolute;
  z-index: -1;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: #00c4d7;
  border-radius: 100%;
  -webkit-transform: scale(0);
  transform: scale(0);
  -webkit-transition-property: transform;
  transition-property: transform;
  -webkit-transition-duration: 0.6s;
  transition-duration: 0.6s;
  -webkit-transition-timing-function: ease-out;
  transition-timing-function: ease-out;
}
.rece3:hover {
  color: white;
}
.rece3:hover:before{
  -webkit-transform: scale(2);
  transform: scale(2);
}







.rece4 {
    font-family: 'medium'; text-transform:uppercase; font-size:15px;letter-spacing:4px;

   margin: .4em;
  padding: 1em;
  cursor: pointer;
  text-decoration: none;
  color: #000000;
  /* Prevent highlight colour when element is tapped */
  -webkit-tap-highlight-color: rgba(0,0,0,0);

  /* Smooth fonts */
  -webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	border-radius:30px;-moz-border-radius:30px;-webkit-border-radius:30px; 
}
.rece4 {
  display: inline-block;
  vertical-align: middle;
  -webkit-transform: perspective(1px) translateZ(0);
  transform: perspective(1px) translateZ(0);
  box-shadow: 0 0 1px transparent;
  position: relative;
  overflow: hidden;
  -webkit-transition-property: color;
  transition-property: color;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
}
.rece4:before {
  content: "";
  position: absolute;
  z-index: -1;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: #ff6750;
  border-radius: 100%;
  -webkit-transform: scale(0);
  transform: scale(0);
  -webkit-transition-property: transform;
  transition-property: transform;
  -webkit-transition-duration: 0.6s;
  transition-duration: 0.6s;
  -webkit-transition-timing-function: ease-out;
  transition-timing-function: ease-out;
}
.rece4:hover {
  color: white;
}
.rece4:hover:before{
  -webkit-transform: scale(2);
  transform: scale(2);
}

@media screen and (max-width:820px){
	.rece1,.rece2,.rece3,.rece4{ font-size:13px;}
	
}