@charset "utf-8";

/*-------------- Genericos / Reset --------------*/
* { margin: 0; padding: 0; line-height: 1em; font-size: 1em;}
body { font-size: 62.5%;}
body, input, select, textarea { color: #616265; font-family: Tahoma, Verdana, Helvetica, Arial, sans-serif;}
a { text-decoration: none;}
img { border: 0;}
hr, #skip { display: none;}
ul { list-style-type: none;}

/*-------------- Estructura --------------*/
#wrapper { 
	width: 97em; 
	margin: 0 auto;
	background-color: #F1F1F1;	
}

#header {
	background: url("../images/bg-cabecera.gif") repeat-x; 
	height: 9.3em; 
}    

#header {
	background: url("../images/bg-cabecera.gif") repeat-x; 
	height: 9.3em;  
	position: relative;
}    

#header h1 {
	position: absolute; 
	top: 1em;
	left: 3em;
}  

#header h1 span {
	display: none;
}

#header h2{
    display: none;
}

/* menú pricipal */

#header #main-menu {
	position: absolute;
	top: 2.4em;
	right: 2em; 
	font-size: 1.6em; 
	font-family: Georgia, "Times New Roman", Times, serif;
}

#header #main-menu li {
	float: left; 
	background-color: #3D3D3D; 
	margin: 0 0.3em;
}

#header #main-menu li a {
	display: block;
	padding: .3em; 
	color: #F1F1F1;
} 

#header #main-menu li a:hover {
	background-color: #F1F1F1; 
	color: #3D3D3D;      
} 

#header #main-menu li.home a {
    background: none;
    border: 1px solid #3d3d3d;
    padding: 0;
    width:25px;
    height: 25px;
    margin: 0;
}

#header #main-menu li.home a:hover {
    border: 1px solid #F1F1f1;
} 

#contacto {
    background-color: #6f6f70;
    font-size: 1.6em;
    font-family: Georgia, "Times New Roman", Times, serif;
    text-align: right;
    padding: 0.3em 2em 0.3em 0;
    color: #F1F1F1;
} 

#contacto img {
    vertical-align: middle;
}
                            
#footer {
	background-color: #606161;
	color: #F1F1F1; 
	text-align: center;
	font-size: 1.3em; 
	padding: 0.5em 0; 
	margin-top: 1em;
	clear:both;
}  

#footer a {
	font-family: Georgia, "Times New Roman", Times, serif; 
	color: #F1F1F1; 
	text-decoration: none; 
} 

#footer a:hover {
	text-decoration: underline;      
}  

/*-------------- Categorias --------------*/

#center {
	width: 61.8em;  
	float: left; 
	background: url("../images/bg-box-bottom.gif") no-repeat bottom left;  
	position: relative;
	margin: 1em 0.5em; 
	min-height: 58.5em;
	padding-bottom: 0.5em; 
} 

#center .center-top {
	background: url("../images/bg-box-top.gif") no-repeat; 
	position: absolute;   
	top: 0;
	left: 0;
	width: 61.8em; 
	height: 1em;
}   

#center ul.pasos {
	position: relative;
	top: 1em;
	left: 1em; 
} 

#center ul.pasos li span {
	display: none;
} 

#center ul.pasos li {
	float: left; 
	margin-right: 0.5em;
}

#center ul.pasos li.paso1 {
	background: url("../images/bot-paso1.gif") no-repeat;  
	width: 13em;
	height: 4.8em;
}  

#center ul.pasos li.paso2 {
	background: url("../images/bot-paso2.gif") no-repeat;  
	width: 13em;
	height: 4.8em;
}  

#center ul.pasos li.paso3 {
	background: url("../images/bot-paso3.gif") no-repeat;  
	width: 13em;
	height: 4.8em;
}  

#center ul.pasos li.paso1-off {
	background: url("../images/bot-paso1-off.gif") no-repeat;  
	width: 4.8em;
	height: 4.8em;

}  
#center ul.pasos li.paso1-off a.enllac
{
	width: 4.8em;
	height: 4.8em;
	position:absolute;
}

#center ul.pasos li.paso2-off a.enllac
{
	width: 4.8em;
	height: 4.8em;
	position:absolute;
}

#center ul.pasos li.paso2-off {
	background: url("../images/bot-paso2-off.gif") no-repeat;  
	width: 4.8em;
	height: 4.8em;
}  

#center ul.pasos li.paso3-off {
	background: url("../images/bot-paso3-off.gif") no-repeat;  
	width: 4.8em;
	height: 4.8em;
}

#center ul.pasos li.cesta a {
    position: absolute;
	right: 0;
	top: 0em; 
	font-family: Georgia, "Times New Roman", Times, serif;    
	color: #616262;
	font-size: 1.2em; 
	background: url("../images/ico-cesta.gif") no-repeat 0 15px;  
	width: 4.8em;
	height: 5.5em;  
	position: absolute;
	right: 2em;
	top: 0;
}   

#center ul.pasos li.cesta a:hover {
	background: url("../images/ico-cesta-on.gif") no-repeat 0 15px;  
    color: #e05757;
}

#center h5 {
	margin: 1em; 
	font-size: 1.6em;
	font-weight: normal;
	font-family: Georgia, "Times New Roman", Times, serif; 
	border-bottom: 2px solid #F1F1F1; 
	padding-bottom: 0.5em;
}

#center ul#categorias {
	font-family: Georgia, "Times New Roman", Times, serif;  
	padding: 2em; 
}  

#center ul#categorias li {
	padding-left: 5em;
	margin-bottom: 1.5em; 
}

#center ul#categorias li a {
	color: #616265; 
	font-size: 4.8em;    
}

#center ul#categorias li.blancos {
	background: url("../images/color-blancos.gif") no-repeat 0 5px; 
}  

#center ul#categorias li.neutros {
	background: url("../images/color-neutros.gif") no-repeat 0 5px;
}    

#center ul#categorias li.amarillos {
	background: url("../images/color-amarillos.gif") no-repeat 0 5px;
}   

#center ul#categorias li.verdes {
	background: url("../images/color-verdes.gif") no-repeat 0 5px;
}    

#center ul#categorias li.azules {
	background: url("../images/color-azules.gif") no-repeat 0 5px;
} 

#center ul#categorias li.rojos {
	background: url("../images/color-rojos.gif") no-repeat 0 5px;
}    

#center ul#categorias li.especiales {
	background: url("../images/color-especiales.gif") no-repeat 0 5px;
}

/*-------------- Listado colores --------------*/  

#center ul#categorias-listado {
	margin: 1.5em;
	border-bottom: 2px solid #F1F1F1;
	padding-bottom: 1em;
}

#center ul#categorias-listado li {
	float: right;
	margin: 0 0.5em;
} 

#center ul#categorias-listado li.primero {
	float: left;
}

#center h2 {
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 2.4em;
	font-weight: normal;
	margin: 0.5em;  
}   

#center ul#listado {
	margin-left: 0.5em; 
	margin-bottom: 2em; 
	font-family: Georgia, "Times New Roman", Times, serif;    
} 

#center ul#listado li {
    width: 7.2em;
	height: 8em;
	float: left;
	padding: 0.2em;
	margin: 0.5em;   
}

#center ul#listado li.active img { 
	padding: 0.2em; 
	border: 1px solid #5b5b5b; 
	width: 5em;
	height: 5em;
}  

#center ul#listado li.active p.peu { 
	display: block; 
	font-size: 1.2em;  
}

#center ul#listado li a { 
	float: left;
	width: 5em;
	height: 5em;
	border: 1px solid #CCC;  
	padding: 0.2em;
}    

#center ul#listado li a:hover { 
	border: 1px solid #5b5b5b;
	display: block;
} 

#center ul#listado li p.peu { 
	margin-top: 0.5em;
	float: left;
	display: none;
	font-size: 1.1em; 
}  

#center ul#listado li:hover p.peu, ul#listado li.hover p.peu { 
	display: block;
}  

#center form#tipo-producto {
	font-size: 1.4em;
   	font-family: Georgia, "Times New Roman", Times, serif; 
} 

#center form#tipo-producto fieldset {
	width: 18em;
	float: left; 
	margin: 1em; 
	padding: 0.5em;  
	border: 1px solid #CCC;
}   

#center form#tipo-producto legend {
   padding: 0.5em; 
}   

#center form#tipo-producto select {
	width: 17em; 
	border: 1px solid #CCC; 
	font-family: Georgia, "Times New Roman", Times, serif;  
} 

#center form#tipo-producto .bot-continuar {
	text-align: right;
	margin-right: 2.8em;
	margin-bottom: 2em;
}     

/*-------------- Ficha producto --------------*/    

#center #fotos-producto {
	float: left; 
	margin: 1em;
}  

#center #fotos-producto .foto-color {
	border: 1px solid #5b5b5b;
	padding: 0.1em; 
	margin-bottom: 1em;  
} 

#center #fotos-producto .foto-color img {
	width: 76px;
	height: 76px;
}  

#center #fitxa {
	font-size: 1.4em;
	margin: 0.5em 1em 2em 0; 
	float: left;  
	width: 35em; 
}    

#center #fitxa p {
	padding-bottom: 0.5em;
} 

#center #fitxa p.especial {
	color: #e31936!important;
}     

#center #fitxa img {
	margin: 0.5em 0 2em 0;	
}  

#center .bot-anadircesta {
	float:right; 
	margin-right: 2em;
	margin-bottom: 1em;     
}  


/*-------------- Columna adicional --------------*/ 

#sidebar {
   	width: 30em;  
	float: left;
	margin-left: 1em; 
	margin-bottom: 1em;
}  

#sidebar p {
  	font-size: 1.6em; 
	margin: 1em 0;
} 

#sidebar ul#box-info {
	background-color: #858585; 
	padding: 0.5em 1em;  
	color: #FFF;
	font-size: 1.4em;
}   

#sidebar ul#box-info li.tel {
	background: url("../images/ico-tel.gif") no-repeat 0 10px;
	padding: 1em 0 1em 2em; 
}    

#sidebar ul#box-info li.horario {
	background: url("../images/ico-horario.gif") no-repeat 0 10px;
	padding: 1em 0 1em 2em; 
}  

#sidebar ul#box-info li.precio {
	background: url("../images/ico-euro.gif") no-repeat 0 10px;
	padding: 1em 0 1em 2em; 
}  

#sidebar #destacado {
	width: 30em;
	height: 26.5em;
	background: url("../images/bg-destacado.gif") no-repeat; 
	margin-top: 1.5em; 
	position: relative;
}     

#sidebar #destacado h2 {
	background: url("../images/ico-destacado.gif") no-repeat 5px 8px; 
	font-size: 2em;
	font-family: Georgia, "Times New Roman", Times, serif;
	font-weight: normal;
	padding: 0.5em 1.8em; 
	border-bottom: 2px solid #F1F1F1;
	margin: 0 1em 0 0.3em;  
} 

#sidebar #destacado #imatge {
   	width: 13em;
 	height: 18em;
	float: left; 
	margin: 0 0.5em;
}  

#sidebar #destacado #imatge img {  
	/*les imatges haurien de fer 120px x 120px*/
   	margin-right: 0.5em; 
	width: 12em;
	height: 12em;
}  

#sidebar #destacado #imatge #bot-detalles {
	background: url("../images/bot-detalles-blancos.gif") no-repeat; 
	color: #FFF;
	font-weight: bold;
	padding: 0.8em 1em;
	margin: 0 0 0 4em;
} 

#sidebar #destacado #imatge #bot-detalles a {
	color: #FFF;
} 

#sidebar #destacado #info-destacado {
	margin-right: 0;
	width: 15em; 
	float: left;    
} 

#sidebar #destacado #info-destacado h3 {
	font-size: 1.6em; 
	font-weight: normal;
	margin: 0.5em 0;  
}       

#sidebar #destacado #info-destacado h3 a:hover {
	text-decoration: underline; 
}

#sidebar #destacado #info-destacado p {
	font-size: 1.4em;  
	margin: 0.5em 0; 
}

#sidebar #destacado #info-destacado p.especial {
	color: #e31936;
	margin: 0;    
}  

#sidebar #destacado #categoria {
	position: absolute;
	left: 0.5em;
	bottom: 1.5em;
	width: 28em;
	height: 3em;
}   

#sidebar #destacado #info-destacado p.especial {
	color: #e31936!important;
}

/*-------------- Formulario de compra --------------*/  
#box-big { 
	width: 92em;  
	float: left; 
	background: url("../images/bg-form.gif") no-repeat bottom left;  
    margin: 2em 0.5em;
	min-height: 58.5em;
    padding: 2em;  
}  

#box-big p {
	font-size: 1.4em;
}

#box-big h2 { 
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 2.4em;
	font-weight: normal;
	margin-bottom: 0.5em;
}       

#box-big h2.cesta { 
	background: url("../images/ico-cesta-mini.gif") no-repeat bottom left;
    padding: 0.1em 1.3em;
}

#box-big table {
	margin: 2em 0;  
	border: 1px solid #f1f1f1; 
}

#box-big table th { 
	background: url("../images/bg-th.gif") repeat-x;
	text-align: left; 
	padding: 0.4em 0.5em;
	font-family: Georgia, "Times New Roman", Times, serif;  
	font-size: 1.4em; 
	border: 1px solid #FFF;
	font-weight: normal;
} 

#box-big table td {
	font-size: 1.2em;
	padding: 0.4em 0.5em; 
	border: 1px solid #f1f1f1; 
}    

#box-big table td.total {
	text-align: right;
	font-size: 1.2em;
	background-color: #f9f9f9;
   	font-size: 1.4em; 
 	font-weight: bold;
} 

#box-big .acciones {
	float: right;
	padding-bottom:10px;
}  

#box-big table .actualizar {
	padding-left: 0.3em;
}

#box-big input.mini {
	width: 4em;
	text-align: right;
}  

form#datos-contacto {
	clear: both;  
}  

form#datos-contacto .column  {
	width: 43em; 
	float: left;
	margin: 1em;
}

form#datos-contacto fieldset {
	border: 1px solid #CCC;
	margin: 2em 0;  
} 

form#datos-contacto legend {
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 1.6em;
	padding: 0.3em;
}  

form#datos-contacto label {
    display: block;
	padding: 0.5em 0;
}  

form#datos-contacto input {
   	border: 1px solid #CBCBCB; 
	padding: 0.1em;
	text-align: left;
}  

form#datos-contacto input.checkbox, form#datos-contacto input.radio {
	border: none;
} 

form#datos-contacto input.largo {
	width: 28em;
} 

form#datos-contacto input.medio {
	width: 14em;
}   

form#datos-contacto input.mini{                    
	width: 7em; 
	text-align: left;  
}  

form#datos-contacto .privacidad {
	float: left;
	clear: both; 
	margin: 1em;
}   

form#datos-contacto .privacidad p {
	width: 30em;
}

form#datos-contacto textarea {
	width: 60em; 
	height: 6em; 
    margin: 1em 0;
	border: 1px solid #CBCBCB; 
	padding: 0.5em 0 0.5em 0.5em;         
}  

#recibo { 
	border: 1px solid #CCC;
	margin: 2em 0;
	padding-bottom: 2em;
}

#recibo h3 {
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 1.8em;
	padding: 0.3em;
	font-weight: normal; 
	margin-top: -0.9em;
	background-color: #FFF;
	width: 8em;  
	margin-left: 0.5em;  
} 

#recibo dl.column  {
	width: 30em; 
	float: left;
	margin: 1em;
	font-size: 1.4em;
}


#recibo dt {
	display: block;
	padding: 0.5em 0;   
	margin-top: 0.5em;
}

#recibo dd {
	color: #3d3d3d;
	font-weight: bold;
} 

#estatica  {
  	line-height: 1.2em;
	font-size: 1.4em;
} 

#estatica p {
   font-size: 1em;
	margin-bottom: 0.5em; 
   line-height: 1.2em;
} 

#estatica h1, h2, h3, h4, h5 {
	font-size: 1.2em; 
	margin: 0.5em 0;
}
 
#estatica img {
	margin: 0.5em 0;
}  

#estatica ul {
	margin: 0.5em 2em; 
	list-style: disc;
}    

#estatica ul li {
	padding: 0.2em 0;
}   

#estatica a {
	color: #000;
	text-decoration: underline;
}  

#estatica a:hover {
	text-decoration: none;
}

/*-------------- Otros --------------*/
#content:after, #center:after, #sidebar:after, ul.pasos:after, ul#listado:after, ul#categorias-listado:after, form#tipo-producto:after, #fitxa:after , #recibo:after{ content: "."; display: block; height: 0; clear: both; visibility: hidden;}  
#content, #center, #sidebar, ul.pasos, ul#listado, ul#categorias-listado, form#tipo-producto, #fitxa, #recibo { height: 1%;}