@charset "utf-8";
/* COMO HACER APLICAR UN CAMBIO SÓLO A UN EXPLORADOR (HACK) 
IE6 --->	* html propiedad
IE7 --->	*+html propiedad
Opera 9 y anteriores --->	html:first-child propiedad
*/

/* COMIENZO RESET PAGINAS Y REGLAS GENERALES FRAMEWORK CSS:
 * -sin bordes
 * -sin márgenes ni paddings
 * -sin fondos ni estilo para listas
*/

* {margin: 0; padding: 0; font: 11px Arial;} /* nada tendrá padding ni margen, y las fuentes serán 11px */
q:before,q:after {content: "";}
sup {font-size: 0.8em;}
sub {font-size: 0.8em;}
ul {list-style-type: none;}
a {border: none; text-decoration: underline; color: #066aa7;}
a:link, a:visited, a:active {outline: none;}
a:hover {text-decoration: none;}
img {border: none; text-decoration: none;} /* background: url(); aparecerá como fondo de la imagen, útil para imágenes de carga */
acronym {border: 0;}
.manolink{cursor: pointer;}

/* igualar las fuentes a todos los elementos */
h1, h2, h3, h4, h5, strong {font-size: 100%; font-weight: bold;}

/* tablas */
table {width: 100%; border-collapse: collapse; border-spacing: 0;}

/* propociona altura a divs sin altura con contenido flotado */
/* http://www.positioniseverything.net/easyclearing.html */
.clearfix:after {content: "."; display: block; height: 0; clear: both; visibility: hidden;}
.clearfix {display: inline-block;}
* html .clearfix {height: 1%;}
.clearfix {display: block;}

.b {border: 1px solid Yellow;} /*clase de uso rápido para destacar los bordes de un bloque*/


/*
 * cómo hacer png transparentes en IE6
 * dado un div...:
 * #bloque {background: url(/imagenes/index/abcd.png); behavior: url(/estilos/ie6pngfix/iepngfix.php);
 * 
 * si abcd.png está guardado con canal alfa, dejará ver el fondo. behavior sólo lo interpreta IE6.
 * 
 */

/* FIN RESET PAGINAS Y REGLAS GENERALES FRAMEWORK CSS */

/**********************************************
				ESTRUCTURA DE LA PAGINA
***********************************************/

body { text-align: center; background-color:#fff;}

sup{ font-size:6px; }
#todo{width:100%; float:left; border-top: 6px solid #fbb900; border-bottom: 6px solid #fbb900; }
#pagina { margin: 0 auto; width: 980px; text-align: left; background:#ffffff; height:auto;}

/**********************************************
				CABECERA
***********************************************/

#cabecera{width:980px; float:left;}
	h1 a{ float:left;display: inline; margin-top:4px; margin-left:27px;background: url(/imagenes/comunes/h1-logo.gif) no-repeat; text-indent:-9999px; height:97px; width:191px; cursor:pointer;}
	#nav_util {float:right;display:inline;margin:9px 24px auto -6px; position:relative;z-index:99;} 
		#nav_util ul{float:left;margin:5px 12px 0 0;} 
		#nav_util li {color: #030303; display: inline;margin-left:4px;}
			#nav_util li a {height: 14px; font-family:Arial; color: #030303; font-size: 10px; text-decoration: none;font-weight:bold;}
			#nav_util li img {margin-right:5px; }
	#nav_util form{float:left;}
		#nav_util form fieldset{border:0;margin:0;padding:0;}
		#nav_util form #buscar{border:1px solid #a6a6a6;margin:-2px 0 0 0;padding:1px;}
		#nav_util form #submitbuscar{background: url(/imagenes/comunes/buscar.gif) no-repeat;width:22px;height:22px;border:0;cursor:pointer;}
			
	#menu{float:right; display:inline; height:50px; margin-right:23px; margin-top:42px; width:612px;}
		#menu ul{float:right;}
		#menu li{display:inline; float:left; }
		#menu li a{display:block; height:51px; text-indent:-9999px;}
			#menu li .productos{background:url(/imagenes/comunes/menu.gif) no-repeat 0px 0px; width:135px;}
			#menu li .productos-selec { width: 135px; background: url(/imagenes/comunes/menu.gif) no-repeat 0px -50px;}
			#menu li .productos:hover { width: 135px; background: url(/imagenes/comunes/menu.gif) no-repeat 0px -50px;}
		
			#menu li .calidad{background:url(/imagenes/comunes/menu.gif) no-repeat -134px 0px; width:124px;}
			#menu li .calidad-selec{background:url(/imagenes/comunes/menu.gif) no-repeat -134px -50px; width:124px;}
			#menu li .calidad:hover {background:url(/imagenes/comunes/menu.gif) no-repeat -134px -50px; width:124px;}
			
			#menu li .noticias{background:url(/imagenes/comunes/menu.gif) no-repeat -257px 0px; width:124px;}
			#menu li .noticias-selec{background:url(/imagenes/comunes/menu.gif) no-repeat -257px -50px; width:124px;}
			#menu li .noticias:hover{background:url(/imagenes/comunes/menu.gif) no-repeat -257px -50px; width:124px;}
			
			#menu li .faqs{background:url(/imagenes/comunes/menu.gif) no-repeat -380px 0px; width:104px;}
			#menu li .faqs-selec{background:url(/imagenes/comunes/menu.gif) no-repeat -380px -50px; width:104px;}
			#menu li .faqs:hover{background:url(/imagenes/comunes/menu.gif) no-repeat -380px -50px; width:104px;}
			
			#menu li .contacto{background:url(/imagenes/comunes/menu.gif) no-repeat -483px 0px; width:124px;}
			#menu li .contacto-selec{background:url(/imagenes/comunes/menu.gif) no-repeat -483px -50px; width:124px;}
			#menu li .contacto:hover{background:url(/imagenes/comunes/menu.gif) no-repeat -483px -50px; width:124px;}

#imagen-cabecera{width:980px; float:left;  height:233px;}
	
/**********************************************
				MIGAS
***********************************************/
#migas{ width:963px; float:left; padding-left:17px; padding-top:9px; padding-bottom:8px; border-right:1px solid #ECECEC; border-left:1px solid #ECECEC; }
	#migas a{float:left; font-family:Arial; font-size:10px; color:#000000; text-transform: uppercase; text-decoration:none;}
	#migas a:hover{float:left; font-family:Arial; font-size:10px; color:#000000; text-transform: uppercase; text-decoration:underline;}
	#migas a.inicio{display:block; background:url(/imagenes/comunes/home.gif) top left no-repeat; text-align:right; width:50px;}
	
/**********************************************
				CONTENIDO
***********************************************/
#contenido{width:980px; float:left; border-right:1px solid #ECECEC; border-left:1px solid #ECECEC; }

/**********************************************
				PIE
***********************************************/	
#pie{width:980px; float:left; background: url(/imagenes/comunes/border-pie.gif) no-repeat;  padding-top:34px; height:92px; padding-bottom:10px; }
	#pie #logos{ margin-left:16px; width:314px; float:left;}
	#pie #logos li{ display:inline;float:left; margin-left:5px; }
	#pie #logos #stella{border-right: 2px solid rgb(169, 169, 169); padding-right: 20px; margin-left:0px; margin-right:10px;}
	
	#pie  #aviso{margin-right:15px; float:right; margin-top:26px;  color:#a0a0a0; font-family:Arial; font-size:9px;}
	#pie  #aviso img{margin-right:5px; }
	#pie  #aviso a {font-family:Arial; color:#000000; font-size:9px; margin-right:5px; }
	#pie #enlace-calidad{float:right; margin-right:10px; text-indent:-9999px; background: url(/imagenes/comunes/enlace-calidad.jpg) no-repeat; width:101px; height:85px; margin-top:-18px;}
	
/*************************************************
				Ventanita de ToolBox
**************************************************/
#toolbox{width:243px; margin-left:45px; margin-top:7px; }
	#toolbox h3{width:213px; height: 46px; float:left; background:url(/imagenes/productos/toolbox.gif) no-repeat; text-indent:-9999px;}
	#toolbox .text{width:213px; float:left; margin-top:10px;}
		#toolbox .text p{text-align:justify; font-family:Arial; font-size:11px; color:#7D7D7D;}
			#toolbox .text p strong{text-align:justify; font-family:Arial; font-size:11px; font-weight:bold; color:#2E2E2E;}
			#toolbox a.calcular{display:block; float:right; font-family: Arial; font-size:10px; color:#043882; width:87px; background:url(/imagenes/productos/calcular.gif) center right no-repeat; text-decoration:none; padding-top:4px; padding-bottom:6px;}
			
/***************************************************
				Ventanita de Puntos de Venta
***************************************************/
#pdv{float:left; display:inline; width:328px;_width:320px; height:154px; background:url(/imagenes/index/puntos-venta.gif) no-repeat #043882;}
	#pdv p{color:#fff; width:166px; margin-left:149px; margin-top:59px; margin-bottom:10px;}
	#pdv a{color:#fff;}
	#pdv #ver-puntos{background:transparent url(/imagenes/index/btn-blanco.gif) no-repeat scroll right center; color:#FFFFFF; display:block; margin-left:150px; padding-bottom:6px; padding-right:30px; padding-top:6px; width:130px;text-decoration:none;}
		#pdv .azul{color:#6894d2;}
/***************************************************
			Ventanita de Incentivos
***************************************************/

#incentivos{float:left; display:inline; width:329px; height:154px; background:url(/imagenes/comunes/fondo-incentivos.jpg) no-repeat #9BAFCD;}
	#incentivos p{color:#fff; width:175px; margin-left:122px; margin-top:75px; margin-bottom:10px;}
	#incentivos #ver-incentivos{background:transparent url(/imagenes/comunes/btn-blanco.gif) no-repeat scroll right center; color:#FFFFFF; height:23px; margin-left:183px; padding-bottom:4px; padding-right:30px; padding-top:6px; width:90px; display:block;}
