/* utilidades */


* {margin:0; padding:0}
img,fieldset, abbr {border:none}
ul,li {list-style:none}

a {text-decoration: none}
a:hover {text-decoration: underline}

.ftl {float:left}
.ftr {float:right}
.clear:after {content:"."; clear:both; display:block; visibility:hidden; height:0;}
.hacked {overflow:hidden}

.hidden {display:none;}




html { font-size:100%}
body { font-size:62.5%; font-family: Arial, Helvetica, sans-serif; color:#666; text-align:center; background-color: #ececec}
	
legend, hr { display:none;}

.both { clear:both;}


html { font-size:100%}
body { font-size:62.5%; font-family: Arial, Helvetica, sans-serif; color:#666; text-align:center; background-color: #ececec}
	
legend, hr { display:none;}

.both {clear:both;}
	


/** Generated @ www.fontreactor.com **/
@font-face {
	font-family: 'ArialRoundedMTBold';
    src: url('../fuentes/original_Arial_Rounded_MT_Bold.eot?#iefix') format('embedded-opentype'), 
         url('../fuentes/original_Arial_Rounded_MT_Bold.woff') format('woff'),
         url('../fuentes/original_Arial_Rounded_MT_Bold.ttf') format('truetype'),
         url('../fuentes/original_Arial_Rounded_MT_Bold.svg') format('svg');
	font-weight: normal;
	font-style: normal;
}

@font-face {font-family: "Arial Rounded MT Std Light";
  src: url("../fuentes/031795c120315d27375070388a523351.eot"); /* IE9*/
 src: url("../fuentes/031795c120315d27375070388a523351.eot?#iefix") format("embedded-opentype"), /* IE6-IE8 */
  url("../fuentes/031795c120315d27375070388a523351.woff2") format("woff2"), /* chrome、firefox */
  url("../fuentes/031795c120315d27375070388a523351.woff") format("woff"), /* chrome、firefox */
  url("../fuentes/031795c120315d27375070388a523351.ttf") format("truetype"), /* chrome、firefox、opera、Safari, Android, iOS 4.2+*/
  url("../fuentes/031795c120315d27375070388a523351.svg#Arial Rounded MT Std Light") format("svg"); /* iOS 4.1- */
}


	.wrapper {clear: both; font-size:100%; width: 920px; margin: 5em auto 0 auto; text-align:left; }
	.wrapper2 {position: relative; clear: both; width: 100%; margin-top: 140px }
	
	
	.contenido { width: 920px;  text-align: left; margin-bottom: 40px; padding: 15px 15px 70px 15px; background-color: #fff  }
 		
	
	#social {height: 26px; padding: 6px 0; background-color: #000; padding-right: 3%  }
	#social ul  {float: right;  }
	#social ul li {float: right; margin-right: 12px; }
	#social img {padding-top: 3px;}

	
	header { display: block; margin-bottom: 20px; background-color: #fff }
	header #brand {margin: 26px 0 20px 0}
	header #brand.interior img {margin-bottom: 20px}
	
	header #imgCab {position: relative; height: 474px; background: #cba372 url("../img/huevo-liquido-ovonovo-3.jpg") 0 0 no-repeat; text-align: center  }
	
	#idioma {position: absolute; top: 60px; right: 5%; }
	#idioma li {display: inline; padding: 2px 12px 0 12px; border-right: 1px solid #ccc}
	#idioma li:last-child {border-right: none}
	
	#idioma li a {font-family: arial,Helvetica; color: #666; font-size: 12px; font-weight: bold}
	#idioma li.select a {color: #b30926;}
	#idioma li a:hover {color: #b30926; text-decoration: none }
		
	
	nav {margin-bottom: 15px;}
	nav  li {display: inline; margin: 0 40px 0 0}
	nav a  { font-size: 13px; color: #333; font-weight: bold}
	nav a:hover {color: #b30926; text-decoration: none}

	
	#marque {position: absolute; bottom: 7%; left:50%; margin-left: -490px;}
	#marque p {padding: 0 0 10px 0; font-family: ArialRoundedMTBold,arial,Helvetica; font-size: 30px; color: #fff; letter-spacing: 1px;  }
	#marque span {font-size: 20px; color: #fff; letter-spacing: 1px}
	#marque  a.btnInfo {display: inline-block; background: transparent; border: 1px solid #fff; color: #fff; margin-top: 25px; padding: 15px 35px 15px 35px; font-weight: bold; font-size: 14px } 
	#marque  a.btnInfo:hover {color: #fff; background-color:rgba(0, 0, 0, 0.1); text-decoration: none;	} 

	
		
	h1, h2 {padding: 40px 0 20px 0; font-size: 28px; font-weight:normal; color: #404040; letter-spacing: 1px;}
	h1 {padding: 50px 0 0 0}	
	
	h3 {font-size: 18px; font-weight: normal; padding: 30px 0 25px 0; color: #b30926; text-transform: uppercase; text-align: center; line-height: 26px} 
	
	
	.contenido .col1 {position: relative; float: left; width: 49%; margin-right: 2px;}
	.contenido .col2 {float: left; width: 49%}
	.contenido .col1 img, .contenido .col2 img {width: 100%}
	
	.contenido .borde { }
	
	
	.contenido .txt, .contenido .txt2 {padding: 36px 50px 20px 50px}
	.contenido .txt2 {padding-bottom: 25px }
		
	
	.contenido .txt  ul li , .contenido .txt2 ul li {text-align: center; font-size: 16px; font-weight: normal; line-height: 26px}
	.contenido p {text-align: center; font-size: 16px; font-weight: normal; line-height: 26px; margin-bottom: 18px}
	
	.contenido a.link {display: block; padding-top: 20px; color: #5182d9; font-size: 13px; text-transform: uppercase; text-align: center;}  
	.contenido a.link:hover {color: #b30926; text-decoration: none}


	.contenido  ul.iconos {display: block; text-align: center;}
	.contenido  ul.iconos li  { display: inline-block; width: 233px;  margin: 0 auto 38px auto; } 
	.contenido  ul.iconos  span  {margin-top: 14px; display: block; font-size: 12px; text-transform: uppercase}
	

	/* Galeria fotos */
	
	.galeria .txt h3 {padding-bottom: 40px;}
	.galeria ul li {margin-bottom: 60px;}
	.galeria ul li p {font-size: 14px;}

	.galeria img {width: 100%; padding-bottom: 12px;}
	
	
	form .text {float: left; width: 40%; height: 40px; border: 3px solid #f3ae2f; margin: 0 6% 25px 0; color: #666; font-size: 16px; padding-left: 20px}
	
	form .coment {clear: both; float: left; width: 100%; margin-top: 20px; font-size: 16px; color: #666; }
	form  textarea {width: 90%; height: 180px; border: 3px solid #f3ae2f; margin-top: 8px; padding: 20px; color: #666; font-size: 16px; font-family: arial;}
	
	form #lPrivacidad {display: block; clear: both; padding-top: 15px }
	form #lPrivacidad #cPrivacidad {float: left; width: 20px; height: 20px; margin-right: 10px }
	form #lPrivacidad p {text-align: left} 
	form #lPrivacidad a {color: #666} 
	form #lPrivacidad a:hover {color: #f3ae2f; text-decoration: none} 
	
	
	/* Inicializamos para Btn para Ipad/Iphone */
	form .btnEnviar {webkit-appearance: none; -webkit-border-radius: 0 }

	form .btnEnviar { background-color: #f3ae2f; border: none; font-size: 15px; color: #fff; margin-top: 25px; padding: 15px 35px 15px 35px; font-weight: bold;  cursor:pointer; ;  }


    .wrapper2 .capa-anti-eventos {width: 100%; height: 100%; position: absolute; cursor: pointer}

	
	footer {margin: 0 0 80px 0; padding: 0px 0 80px 0; background-color: #f3ae2f}
	.contenidoFooter {text-align: center; width: 920px; height: 220px;  }
	
	footer ul {float: left; display: inline; margin: 40px 30px 30px 30px; text-align: left   }
	footer ul li {line-height: 22px; }
	footer ul li.tit {font-weight: bold;  padding-bottom: 12px}
	footer ul li.logo {padding-top: 15px}
	footer ul li, footer ul li a {font-size: 15px}
	
	footer ul li a {color: #fff;}
	
	
.img-contenedor img {
-webkit-transition:all 4s ease; /* Safari y Chrome */
-moz-transition:all 4s ease; /* Firefox */
-o-transition:all 4s ease; /* IE 9 */
-ms-transition:all 4s ease; /* Opera */
width:100%;
}
.img-contenedor:hover img {
-webkit-transform:scale(1.17);
-moz-transform:scale(1.17);
-ms-transform:scale(1.17);
-o-transform:scale(1.17);
transform:scale(1.17);
}
.img-contenedor {/*Ancho y altura son modificables al requerimiento de cada uno*/

position: relative;
width:925px;
height:526px;
overflow:hidden;

}


.btnFoto {position: absolute; left: 340px; bottom: 48px;  font-size: 14px;  padding: 9px 20px 8px 20px; border: 3px solid #f3ae2f; text-align: center; z-index: 100;}
	
.btnFoto2 {position: absolute; left: 176px; bottom: 48px;  font-size: 14px;  padding: 9px 20px 8px 20px; border: 3px solid #f3ae2f; text-align: center; z-index: 100;}
.btnFoto3 {position: absolute; left: 640px; bottom: 48px;  font-size: 14px;  padding: 9px 20px 8px 20px; border: 3px solid #f3ae2f; text-align: center; z-index: 101;}	
	
.btnFoto4 {position: absolute; left: 35px; bottom: 48px;  font-size: 14px;  padding: 9px 20px 8px 20px; border: 3px solid #f3ae2f; text-align: center; z-index: 100;}
.btnFoto5 {position: absolute; left: 490px; bottom: 48px;  font-size: 14px;  padding: 9px 20px 8px 20px; border: 3px solid #f3ae2f; text-align: center; z-index: 101;}	
	

.btnVideo {position: absolute; left: 38%; top: 24%; color: #fff; text-align: center; z-index: 101; }	

.btnVideo a {display: block; padding: 15px 31px 14px 31px; border: 1px solid #fff;font-size: 10px; color:#fff; letter-spacing: 1px;}
.btnVideo a:hover {background-color: #fff; color: #333; text-decoration: none}


@media (min-width: 490px) and (max-width: 768px) {  


	.wrapper {width: 100% ; margin: 0.2em auto 0.2em auto;  }
	.contenido { float: left; width: 88%; display: block; height: 100%; padding: 0 3% 3% 3%; margin: 1% 3% 15% 3% }
	.img-contenedor  {width:100%; height: 100%}	

	nav, nav ul {text-align: center;}

	header #imgCab {height: 420px; background-position: -600px -30px; }
	#marque { margin-left: -380px;}
	#marque p {padding: 0 40px 10px 40px;   }

	.contenido img.producto {width: 100%; margin: 3% 0 0 0}


	.btnFoto2 {position: absolute; left: 116px; bottom: 48px;  }
	.btnFoto3 {position: absolute; left: 440px; bottom: 48px;  }


	form .text { width: 54%; }


	footer ul {margin: 40px 15px 20px 25px;   }
}


	
/* Versión movil */
	
	@media screen and (max-width: 480px) { 
	
	section, article {padding: 0; margin: 0}
	
	#social  {display: none }
	#idioma  {display: none }
	
	.btnFoto, .btnFoto2, .btnFoto3, .btnFoto4, .btnFoto5 {display:none}
	
		
	.wrapper {width: 100% ; margin: 0.2em auto 0.2em auto;  }
	.contenido { float: left; width: 88%; display: block; height: 100%; padding: 0 3% 3% 3%; margin: 1% 3% 15% 3% }
	
	.img-contenedor  {width:100%; height: 100%}
	
	
	/* menu */
	
	 nav {
		width:100%;
		height:100%;
		left:-100%;
		margin-left: 0px;
		
		position: absolute;
		z-index: 100;
	}
 
	 nav ul li {
		text-align: center;
		display:block;
		float:none;
		border-bottom:1px solid rgba(255,255,255, .3);
		width: 100%
				
	}
 
	.menu_bar {
	
		position: absolute;
		top: 0; 
		right: 0; 		
		display:block;
		
		height: 100px; 
	}
	
	 
	.menu_bar .bt-menu {
				
		display:block;
		width: 80px;
		height: 120px;
		background: #f3ae2f url(../img/btn-menu-movil.png) no-repeat center 38px ;
		background-size: 38px;
		color:#000;
	
				
		-webkit-box-sizing:border-box;
		-moz-box-sizing:border-box;
		box-sizing:border-box;
		
			
	}
	
	#menu {width: 100%;  }
	#menu {background-color: #f3ae2f}
	#menu li {float: none; padding: 14px 0 15px 0; background-image: none }
	#menu li a {color: #fff; font-size: 14px; margin: 0 0 20px 0 !important  }
	
	
	#menu li.sel {  padding: 9px 0 9px 0;}
	#menu li.sel a { color: #333; background-color: inherit !important}
	
	
	
	
	/* menu */

	
	#marque {left: 3%; z-index: 1; margin-left: 0; bottom: 18%; width: 94%; }
	#marque p {padding: 0 0 10px 0; font-size: 22px; line-height: 32px;  font-weight: normal; /*text-shadow: 1px 2px #999; */  letter-spacing: 0;   }
	#marque span {display: none }
	
	header #brand {margin: 0 0 12px 0; padding-top: 16px; text-align: left}
	header #brand img {width: 166px; margin: 6px 0 0 27px}
	

	header #imgCab {height: 420px; background-position: -890px -34px  }

	
	
	 h1 {margin-top: 40px}		
	 h1, h2 { font-size: 26px; padding: 5px 20px 40px 20px;  }
	
	.contenido .col1 { width: 100%; }
	.contenido .col2 { width: 100%}
	.contenido .col1 img, .contenido .col2 img {width: 100%}
		
	
	.contenido .txt {padding: 4% 8% 8% 8%}
	.contenido .txt2 {padding: 4% 8% 8% 8%}
	
	.contenido img.producto {width: 100%; margin: 3% 0 0 0}
	.contenido  ul.iconos {margin-bottom: 30px;   }
	

	/* galeria fotos */

	.contenido .txt {padding: 4% 4% 8% 4%}

	

	
	form  {padding: 8% 0 3% 0 }
	form .text { width: 94%; }
	form  textarea {width: 86%; }	
	

	
	footer { margin: 0; padding: 30px 0 80px 0;   }
	.contenidoFooter {width: 100%;  text-align: center; height: 500px !important;    }
	
	footer ul {margin: 20px 100px 20px 0; width: 100%  }
		
	footer ul li {line-height: 24px; text-align: center; width: 100%}
	footer ul li, footer ul li a {font-size: 17px}
	
	
	
}