/* CSS Reset */
/* Global reset */
/* Based upon 'reset.css' in the Yahoo! User Interface Library: http://developer.yahoo.com/yui */
*, html, body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, label, fieldset, input, p, blockquote, th, td { margin:0; padding:0 }
table { border-collapse:collapse; border-spacing:0 }
fieldset, img { border:0 }
address, caption, cite, code, dfn, em, strong, th, var { font-style:normal; font-weight:normal }
ol, ul, li { list-style:none }
caption, th { text-align:left }
h1, h2, h3, h4, h5, h6 { font-size:100% }
q:before, q:after { content:''}
a { text-decoration:none }

/* The below restores some sensible defaults */
strong { font-weight:bold }
em { font-style:italic }
* a { position:relative } /* Gets links displaying over a PNG background */
a img { border:none } /* Gets rid of IE's blue borders */


a 							{ outline: 0; }
a:hover						{ text-decoration: underline; }


/* `Clear Floated Elements
----------------------------------------------------------------------------------------------------*/

/* http://sonspring.com/journal/clearing-floats */
.clear 						{ clear: both; display: block; overflow: hidden; visibility: hidden; width: 0; height: 0; }

/* http://perishablepress.com/press/2008/02/05/lessons-learned-concerning-the-clearfix-css-hack */
.clearfix:after 			{ clear: both; content: ' '; display: block; font-size: 0; line-height: 0; visibility: hidden; width: 0; height: 0; }
.clearfix 					{ display: inline-block; }
* html .clearfix 			{ height: 1%; }
.clearfix 					{ display: block; }
/* ***********************************************************/

/* Sticky footer */
html, body 					{ height: 100%; }
#pagewrap 					{ min-height: 100%; height: auto !important; height: 100%; margin: 0 auto -164px;  }
#footer, #push 				{ height: 164px;  }
#push						{ clear: both; }
/* Estructura */
body 						{ background: #0060ca url(../images/body-bg.png) repeat-x top left; color: #222;
							  font: normal normal 12px/1.5 Arial, Helvetica, Verdana, sans-serif; }
body#casita_site			{
	background-color: #0060ca;
	background-image: url(../images/body2-bg.jpg);
	background-repeat: no-repeat;
	background-position: center top;
}
#pagewrap 					{ position: relative; background: url(../images/reflejos.jpg) no-repeat top left; }
#casita_site #pagewrap		{ background: transparent; }
#header 					{ position: relative; }
#casita_site #header		{ height: 442px; margin-bottom: 50px; }
#main 						{ min-height: 370px; height:auto !important; height:370px; }
#footer 					{ background: #3db7ed; clear: both; width: 100%; z-index: 1; position: relative; }
#footer-inside 				{ overflow: hidden; height: 144px; padding-top: 10px; padding-bottom: 10px; }

/* Elementos */
#header h1 a				{ display: block; width: 348px; height: 261px; text-indent: -9999px;
							  position: relative; left: -10px; top: 0px;
	 						  background: transparent url(../images/logo.png) no-repeat top left;}
#casita_site h1 a			{ display: block; width: 299px; height: 296px; text-indent: -9999px;
							  position: relative; left: 0px; top: 20px;
	 						  background: transparent url(../images/logo-casita.png) no-repeat top left; }
#header h2					{ height: 88px; margin-top: 160px;
	 						  background: url(../images/largo-verano.png) no-repeat top right; text-indent: -9999px;}
#foto-grande				{ position: absolute; top: 10px; right: 150px; }
#logochico					{ position: absolute; top: 10px; right: 0px; display: block;}

/* menu */
ul#menu						{ text-align: center; margin: 50px 0; padding-bottom: 80px;
							  background: url(../images/ornamento.png) no-repeat bottom center;}
ul#menu li					{  }
ul#menu li a				{ color: white; font-size: 30px; display: block; text-align: center; }
ul#menu li a:hover			{ text-decoration: none; }
ul#menu li.sel a,
ul#menu li.sel a:hover		{ cursor: default; color: #fb2;}

#casita_site #main p				{ color: white; font: normal normal 18px/1.5 Arial, Helvetica, Verdana, sans-serif;
	 						  margin-bottom: 1em;}
#casita_site h4				{ color: #ed2; font-size: 26px; line-height: .8;}
#casita_site .detalle		{ margin: 0 0 30px; padding: 0; }
#casita_site .detalle img	{ border: 5px solid #ed2; width: 150px; }
#mi-casita a				{ width: 297px; height: 270px; text-indent: -9999px; display: block; margin: -20px 0 50px;
							  background: url(../images/casita.png) no-repeat top left; }
#casita_site .descargas		{ padding-bottom: 50px; font-size: 16px; }							

/* Pie */
.logos-pie 					{ padding-top: 30px; height: 114px; background: url(../images/border-pie.png) repeat-y top right; }
.logos-pie img				{ padding-right: 40px;}
.logos-pie #aguasol-pie		{  }
.logos-pie #casita-pie		{  }
.logos-pie #lonera-pie		{ padding-bottom: 10px; }

.datos-pie					{ color: #049; line-height: 1; padding-top: 5px;}
.datos-pie h3				{ font-size: 24px; color: white; margin-bottom: .8em; }
.datos-pie p				{ line-height: 20px; margin-bottom: 10px; padding-left: 30px; }
.datos-pie p.direccion		{ background: url(../images/direccion-icono.png) no-repeat left center; }
.datos-pie p.telefono		{ background: url(../images/telefono-icono.png) no-repeat left center; }
.datos-pie p.correo			{ background: url(../images/correo-icono.png) no-repeat left center; }
.datos-pie p.correo	a		{ color: #049; }


/* Grilla productos */
#grilla-productos			{ margin-top: 20px; }
.producto					{ position: relative; text-align: center; color: white; padding-bottom: 50px;}
.producto .marco			{ width: 263px; height: 190px; position: absolute; top: -15px; left: -17px;
	 						  background: url(../images/marco.png) no-repeat top left; z-index: 2;}
.producto h3				{ font-size: 20px; font-weight: bold; position: relative; z-index: 3; margin: 7px 0 0; line-height: 24px;}
.producto h3 a				{ color: #bef; padding-left: 30px; background: url(../images/bullet.png) no-repeat left center; display:inline-block; }
.producto h3 a:hover		{ color: #fff; text-decoration: none;}
.smallertext .producto h3	{ font-size: 17px;}


/* Detalle producto */
.detalle				{ margin-top: 20px; color: white; padding-bottom: 50px; font-size: 14px;}
.detalle img			{ border: 10px solid #fff; -moz-border-radius: 7px; -webkit-border-radius: 7px;  border-radius: 7px;
						  -moz-box-shadow: 0px 0px 6px #049; -webkit-box-shadow: 0px 0px 6px #049; box-shadow: 0px 0px 6px #049;}
.detalle .imagen		{ position: relative; }
#main h2				{ color: #bef; margin: 10px 0; font-size: 35px; border-bottom: 1px solid white; }

.detalle .zoom			{ display: block; width: 23px; height: 24px; text-indent: -9999px;
	 					  background: url(../images/zoom.png) no-repeat top left; 
						  position: absolute; bottom: 25px; right: 20px; z-index:2; }
.detalle .descripcion	{ color: #bef; margin-top: 10px; font-style: italic; line-height: 1.3;}						
.descargas		{ margin-top: 20px; }
.descargas a	{ display: block; margin-bottom: 10px;
	 					  line-height: 24px; color: white; padding-left: 30px; background: url(../images/bullet.png) no-repeat left center; display:inline-block; }

form					{ margin: 50px 0; }
.rowElem				{ margin-bottom: 10px; }
label					{ display: block; font-size: 14px; color: white; font-weight: bold; }
textarea				{ padding: 5px; width: 300px; border: 1px solid #fff; color: #04b; overflow: auto; font-size: 14px;
						  -moz-box-shadow: 0px 0px 4px #049; -webkit-box-shadow: 0px 0px 4px #049; box-shadow: 0px 0px 4px #049;
						  -moz-border-radius: 5px; -webkit-border-radius: 5px;  border-radius: 5px; 
						  background-color: #dff;
						  background-image: -moz-linear-gradient(top, #dff, #bef);
						  background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0, #dff),color-stop(1, #bef));
						  background-image: linear-gradient(top, #dff, #bef);
						  filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#DDFFFF', EndColorStr='#BBEEFF'); }
input					{ width: 300px; padding: 5px; border: 1px solid #fff; color: #04b; font-size: 14px;
	  					  -moz-box-shadow: 0px 0px 4px #049; -webkit-box-shadow: 0px 0px 4px #049; box-shadow: 0px 0px 4px #049;
						  -moz-border-radius: 5px; -webkit-border-radius: 5px;  border-radius: 5px;
						  background-color: #dff;
						  background-image: -moz-linear-gradient(top, #dff, #bef);
						  background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0, #dff),color-stop(1, #bef));
						  background-image: linear-gradient(top, #dff, #bef);
						  filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#DDFFFF', EndColorStr='#BBEEFF');}
button					{ border: 1px solid #fb2; color: white; padding: 7px 20px; cursor: pointer;
						  text-shadow: 0px 1px 0px #c40; font-size: 14px; font-weight: bold; min-width: 170px;
 						  -moz-box-shadow: 0px 0px 4px #049; -webkit-box-shadow: 0px 0px 4px #049; box-shadow: 0px 0px 4px #049;
						  -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; 
						  background-color: #f90;
						  background-image: -moz-linear-gradient(top, #fb2, #f90);
						  background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0, #fb2),color-stop(1, #f90));
						  background-image: linear-gradient(top, #fb2, #f90);
						  filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#FFBB22', EndColorStr='#FF9900');}