
* {
	font-family: Arial, Helvetica, sans-serif;	
	color: black;
}

html, body, td, th, p, input, textarea {
	font-size: 11px !important;
	color: #454545;
}

h2, h3 {
	font-size: 14px;
	font-weight: bold;
	margin: 0 0 1em;
}

h4 {
	font-size: 12px;
	font-weight: bold;
	margin: 0 0 1em;
}



body {
	background: #244b66 url('fondo.jpg') repeat-x top;
	width: 950px;
	margin: 0 auto;
	padding: 5px;
	position: relative;
}

#top {
	position: relative;
	margin-top: 22px;
}

#idiomas {
	position: absolute;
	right: 0;
	top: -15px;	
	text-align: right;
}

#idiomas ul {
	list-style: none;
	padding: 0;
	margin: 0;
}

#idiomas li {
	display: inline;
	padding: 0 10px;
}

#idiomas li a:link,
#idiomas li a:visited {
	text-decoration: underline;
}

#idiomas * {
	color: white;
}


#menu {
	height: 30px;
	background: #2389c4 url('bg_menu.gif') repeat-x;
	line-height: 30px;	
	margin: 5px;
}

#menu ul {
	list-style: none;
	padding: 0;
	margin: 0;
}

#menu li {
	display: block;
	float: left;
	cursor: pointer;
}

#menu li a {
	font-family: "Helvetica Neue LT Pro", Arial, Helvetica, sans-serif;
	text-transform: uppercase;
	font-size: 13px;
	color: white;
	text-decoration: none;
	display: block;
	height: 100%;
	padding: 0 18px;
}

#menu li a:hover {
	background: #215d81 url('bg_menu_h.gif') repeat-x;
}

#contenido {
	clear: both;
	position: relative;
	overflow: visible;
}

#footer {
	background-color: #0c1922;
	padding: 8px;
	text-align: center;
	margin: 0 5px 5px;
}

#footer ul {
	list-style: none;
	display: inline;
	margin: 0;	
	text-align: center;
}

#footer ul li {
	display: inline;
	margin-right: .5em;
}

#footer * {
	color: white;
}

h1 {
	width: 149px;
	height: 45px;
	overflow: hidden;
	background: url('xocolat.gif');	
	margin: 0 34px 22px ;
}

h1 * {
	display: none;
}

p {
	margin: 0 0 1em;
}

img {
	border: none;
}

.modulo {
	background-color: white;
	margin: 5px;
	overflow: auto;	
	clear: both;
	_overflow: visible;
	_height: 1%;
}


.modulo .h2 {
	height: 38px;
	background: #efefef url('bg_h2.gif') repeat-x;
	line-height: 38px;
	text-align: right;
	padding: 0 15px;
}

.modulo .h2 h2 {
	font-size: 13px;
	font-weight: normal;
	text-transform: uppercase;
	margin: 0;
	float: left;
}

.masvendidos .discos .semana {
	margin: 20px 20px 40px;
	clear: both;
	overflow: auto;
	_height: 1%;
}

.masvendidos .discos .semana h3 {
	font-size: 14px;
	font-weight: normal;
	color: #454545;
	margin: 0 0 15px;
}

.discosemana {
	width: 270px;
	margin: 0 5px;
	position: relative;
}


.discosemana .disco {
	text-align: center;	
	margin: 20px 20px 50px;
}

.discosemana .disco a {
	text-decoration: none;
}

.discosemana .disco .portada {
	margin-bottom: 10px;
}

.discosemana .disco .portada img {
	border: 1px solid #8b8a89;	
}

.discosemana .disco p {
	margin: 0 0 .2em;
}

.discosemana .disco .artista,
.discosemana .disco .artista * {
	font-size: 13px;
}

.discosemana .disco .titulo,
.discosemana .disco .titulo * {
	font-size: 11px;
	color: #454545;
}

.discosemana .disco .formato,
.discosemana .disco .precio,
.discosemana .disco .comprar {
	display: inline;
	margin-right: .3em;
}

.discosemana .disco .comprar {
	text-decoration: underline;
	color: #2e87ba;
}

.discosemana .disco .player {
	margin-top: 5px;
	
}
.discosemana .disco .descripcion {
	margin-top: 5px;
	line-height: 1.5em;
}

.condiciones {
	width: 270px;
	margin: 0 5px;
	position: relative;
}

.condiciones .texto {
	margin: 20px;
}


.discos {
	padding: 10px 10px 0;
	margin-bottom: 0;	
	clear: both;
	#padding-bottom: 10px;
	#margin-bottom: 10px;	
	
}

.discos .disco {
	width: 33%;
	float: left;
	height: 70px;
	margin-bottom: 15px;
	#margin-bottom: 10px;
}

.discos .disco a {
	text-decoration: none;
}

.discos .disco p {
	margin: 0 0 .2em;
}

.discos .disco .portada {
	width: 48px;
	float: left;
	margin-right: 10px;
	text-align: center;
	margin-bottom: 20px	
}

.discos .disco .portada img {
	border: 1px solid #8b8a89;	
}

.discos .disco .descripcion {
	display: none;
}

.discos .disco .artista,
.discos .disco .artista * {
	font-size: 13px;
}

.discos .disco .titulo,
.discos .disco .titulo * {
	font-size: 11px;
	color: #454545;
}

.discos .disco .formato,
.discos .disco .precio,
.discos .disco .comprar {
	display: inline;
	margin-right: .3em;
}

.discos .disco .comprar {
	text-decoration: underline;
	color: #2e87ba;
}


/* 
 * Top
 */
 
/*
 * Pie
 */

/* 
 * Disco destacado en portada
 */

div.novedades,
div.vinilos,
div.zonablau,
div.masvendidos,
div.zonachulos, 
div.zonasello{
	width: 665px;	
}

div.zonablau {
	height: 400px;
	overflow: hidden;
	background: white url('/css/zonablau.gif') no-repeat left 38px;
}

div.zonablau .discos {
	margin: 0 10px 0 232px;
}

div.zonablau .disco {
	width: 50%;
	height: 55px;
	#height: 50px;
}

div.zonachulos {
	height: 250px;
	overflow: hidden;
	background: white url('/css/zonachulos.gif') no-repeat left 38px;
}

div.zonachulos .discos {
	margin: 0 10px 0 232px;
}

div.zonachulos .disco {
	width: 50%;
	height: 55px;
	#height: 50px;
}

div.zonasello {
	height: 250px;
	overflow: hidden;
}

div.zonachulos .discos,
div.zonasello .discos {
	margin: 0 10px 0 232px;
}

div.zonachulos .disco,
div.zonasello .disco {
	width: 50%;
	height: 55px;
	#height: 50px;
}

div.zonasello img.logo {
	position: absolute;
	left: 41px;
	margin-top: 24px;
}






div.masvendidos .h2 .semana {
	display: block;
	float: left;
	margin-left: 1.5em;
}

div.masvendidos .disco {
	float: none;
	height: auto;
	width: 100%;
}

div.masvendidos h4.puesto {
	color: #2E87BA;
	margin: 6px 0 16px;
	font-size: 12px;
}

div.masvendidos .disco .puesto {
	font-weight: bold;
	color: #1c8fde;
}

div.masvendidos .masvendido {
	float: left;
	height: auto;
	width: 20%;	
	text-align: center;	
	_width: 20%;
	_overflow: hidden;
	
}

div.masvendidos .disco .portada {
	float: none;	
	height: 80px;
	width: 100%;
}

div.masvendidos .disco .portada img {
	border: 1px solid #8b8a89;
}

/* 
 *Portada
 */
 
#portada .vinilos,
#portada .novedades {
	height: 200px;
	overflow: hidden;
}

#portada .discosemana {
	height: 405px;
}

 
#portada .destacados {
	background-color: white;
	width: 665px;	
	height: 276px;
}

#portada .destacados .flash {
	margin: 10px;
}
 

#portada .generos {
	position: absolute;	
	right: 0;	
	width: 270px;
	bottom: 0;
	top: 691px;
	#bottom: 5px;	
	_right: 5px;
	_height: expression(this.offsetParent.offsetHeight - this.offsetTop - 5);
}

#ufi .generos {
	position: absolute;	
	right: 0;	
	width: 270px;
	bottom: 0;
	top: 511px;
	#bottom: 5px;	
	_right: 5px;
	_height: expression(this.offsetParent.offsetHeight - this.offsetTop - 5);
}



#portada .banner {
	position: absolute;
	top: 0;
	right: 0;
	margin-top: 0;
	height: 276px;
	width: 270px;
	_right: 5px;
}

#portada .banner .flash {
	margin: 10px;
}

#portada .discosemana {
	top: 281px;
	position: absolute;
	right: 0;
	bottom: 0;
	overflow: hidden;
	#bottom: 5px;
	_right: 5px;
}



/* Ficha disco */

.disco .ficha {
	width: 665px;
}

.disco .relacionados {
	width: 665px;
}

.disco .ficha .portada {
	float: left;
	padding: 15px;
	height: 150px;
}

.disco .ficha .portada img {
	border: 1px solid #8B8A89;
}

.disco .ficha .datos {
	float: left;
	height: 150px;
	margin: 15px 0;
	position: relative;
	width: 60%;
	_margin-left: 15px;
}

.disco .ficha .datos .artista {
	font-size: 15px;
	margin-bottom: .2em;
}

.disco .ficha .datos .titulo {
	font-size: 13px;
	color: #454545;
	margin-bottom: .2em;	
}

.disco .ficha .datos .formato,
.disco .ficha .datos .precio,
.disco .ficha .datos .comprar {
	font-size: 12px;
	margin-right: .2em;
	display: inline;
}

.disco .ficha .datos .formato,
.disco .ficha .datos .precio {
	color: #454545;
}
.disco .ficha .datos .precio {
	font-weight: bold;
}

.disco .ficha .datos .comprar {
	text-decoration: underline;
	color: #2e87ba;
	margin-left: .3em;
}

.disco .ficha .datosinner {
	position: absolute;
	bottom: 0;
	width: 100%;
}

.disco .player {

padding-top:5px;
}
.disco .ficha .descripcion {
	clear: both;
	margin: 0 15px 15px;
	font-size: 12px;
	line-height: 1.5em;
	color: #45545;
}

.disco .discosemana {
	position: absolute;
	width: 270px;
	right: 0;	
	top: 0;
	bottom: 0;		
	margin: 0 5px;	
	overflow: hidden;
	#bottom: 5px;
	_right: 5px;
	_height: expression(this.offsetParent.offsetHeight - 5);
}

/* Xocolat Centre */
.tienda .texto {
	margin: 20px;
	line-height: 1.5em !important;
	font-size: 12px !important;
	color: #454545 !important;
}

.tienda .galeria {
	margin: 20px 20px 25px 25px;
	float: right;
	overflow: visible;
	_display: inline;
}

.tienda .galeria .imagen {
	margin-bottom: 20px;
}

.tienda .direccion {
	margin-bottom: 1em;
}

/* Catálogo */

.generos {
	width: 270px;
	margin: 0 5px;	
	position: relative;
	overflow: hidden;
}

.generos ul {
	position: absolute;
	top: 38px;
	left: 0;
	right: 0;
	bottom: 0;
	overflow: auto;
	margin: 0;
	list-style: none;
	padding: 15px;
	text-align: center;
	line-height: 1.5em;
	overflow: auto;
	_overflow: visible;
}

.generos ul li {
	display: inline;
}

.generos ul li a {
	text-decoration: none;
	line-height: 26px;
	margin: 0 .1em;	
	color: #333333;		
}

.generos ul li a:hover {
	color: #2e87ba;
}

/* Catálogo */
body#catalogo .catalogo {
	width: 665px;	
	min-height: 600px;
	position: relative;	
	_height: auto !important;
	_height: 600px;
}

body#catalogo .generos {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;	
	#bottom: 5px;
	_right: 5px;
	_height: expression(this.offsetParent.offsetHeight - 5);
}

body#catalogo .catalogo h2 em {
	text-transform: lowercase;
}

body#catalogo .catalogo p.error {
	margin: 20px;
}

/* Cesta */

body#cesta .cesta {
	min-height: 585px;
	_height: auto !important;
	_height: 585px;	
	width: 645px;	
	padding: 48px 10px 10px;
	position: relative;
	overflow: hidden;
}

body#cesta .cesta .h2 {
	position: absolute;
	left: 0;
	right: 0;
	top: 0;	
	overflow: hidden;
	_width: 100%;
}
body#cesta .condiciones {
	position: absolute;
	right: 0;
	bottom: 0;	
	top: 0;
	left: auto;
	overflow: hidden;
	#bottom: 5px;
	_right: 5px;
	_height: expression(this.offsetParent.offsetHeight - 5);
}

body#cesta .condiciones .texto {
	overflow: auto;
}


#cesta .articulos {
	margin: 20px;
}

#cesta .articulos h3 {
	display: none;
}

#cesta .articulos table {
	border-collapse: collapse;
	width: 100%;
	margin-bottom: 40px;
}

#cesta .articulos table th,
#cesta .articulos table td {
	padding: 8px 6px;
	border-bottom: 1px solid #d7dbdf;
	text-align: left;
}

#cesta .articulos table tfoot th {
	border-bottom: none;	
}

#cesta .articulos table .referencia {
	padding-left: 0;
}

#cesta .articulos table .precio,
#cesta .articulos table .importe {
	text-align: right;
	padding-right: 0;
}

#cesta .articulos table .quitar {
	border: none;
	width: 0;
	padding-left: 15px;
	padding-right: 0;
}

#cesta .articulos table th.quitar {
	visibility: hidden;
	padding-left: 0;
	width: 0;
}

#cesta .articulos table td.quitar a {
	display: block;
	background: url('quitar.gif') no-repeat left center;
	width: 0;
	padding-left: 16px;
	height: 16px;
	overflow: hidden;
}

#cesta #accesousuario,
#cesta #accesocliente,
#cesta #tipoenvio,
#cesta #datosenvio{
	padding: 20px;
	border-top: 1px solid #d7dbdf;
	position: relative;
}

#cesta .mensajes {
	padding: 20px;
}

#cesta form .mensajes {
	padding: 0;
}

#cesta form {
	margin: 0;
	padding: 0;
	position: relative;
}

#cesta form .campo {
	margin: 0 0 10px;
}

#cesta form label {
	display: block;
	margin-bottom: .3em;
}

#cesta #accesousuario .campo_recordar input {
	margin-left: 0;
}


#cesta #accesousuario .campo_pagar,
#cesta #accesocliente .campo_cargar,
#cesta #datosenvio .campo_pagar,
#cesta #datosenvio .campo_cargar,
#cesta #datosenvio .campo_finalizar{
	position: absolute;
	right: 20px;
	top: 50%;
	margin-top: -15px;
	height: 30px;
	_top: 40px;
}

#cesta #datosenvio .campo_pagar {
	margin-top: -35px
}

#cesta #datosenvio .campo_finalizar {
	margin-top: 5px;
}

#cesta #accesousuario .campo_pagar input,
#cesta #accesocliente .campo_cargar input,
#cesta #datosenvio .campo_pagar input,
#cesta #datosenvio .campo_cargar input,
#cesta #datosenvio .campo_finalizar input {
	border: none;
	cursor: pointer;
	height: 30px;	
	line-height: 500px;
	overflow: hidden;
	padding: 0;
	text-indent: 500px;
	vertical-align: middle;
	display: block;	
}


#cesta #accesousuario .campo_pagar input,
#cesta #datosenvio .campo_pagar input {
	background: transparent url('pagar_ca.gif') no-repeat;
	width: 64px;
}

#cesta #datosenvio .campo_finalizar input {
	width: 153px;
	background: transparent url('finalizar_ca.gif') no-repeat;	
}

#cesta .campo_usuario input,
#cesta .campo_password input {
	width: 14em;
}

#cesta .campo_email input,
#cesta .campo_tipoenvio select,
#cesta textarea {
	width: 24em;
}

#cesta textarea {
	height: 6em;
}

/* Contacto */

#contacto .contacto {
	min-height: 570px;
	width: 665px;	
	_height: auto !important;
	_height: 570px;
		
}

#contacto .texto {
	float: right;
	margin: 20px;	
	width: 35%;
}

#contacto .generos {
	position: absolute;
	right: 0;
	bottom: 0;	
	top: 0;
	#bottom: 5px;
	_right: 5px;
	_height: expression(this.offsetParent.offsetHeight - 5);
}

#contacto label, 
#contacto form {
	margin: 0;
	padding: 0;
}

#contacto div.formulario {
	float: left;
	width: 320px;
	padding: 10px 20px 20px;
}

#contacto .formulario p.error,
#contacto .formulario p.ok {
	margin: 1em 0 2em;
	color: #2e87ba;
}

#contacto .formulario .campo label {
	display: block;
	margin-bottom: 5px;
}

#contacto .formulario .campo_texto,
#contacto .formulario .campo_textarea {
	width: 300px;
	margin-bottom: 15px;
}

#contacto .formulario .campo_textarea {
	height: 150px;
}

#contacto .formulario .campo_submit {
	background: transparent url('enviar_ca.gif') no-repeat;
	border: none;
	cursor: pointer;
	height: 30px;
	width: 83px;
	line-height: 500px;
	overflow: hidden;
	padding: 0;
	text-indent: 500px;
	vertical-align: middle;
	display: block;
}

#contacto .datos {
	width: 285px;
	float: right;
	padding: 20px;
	margin-top: 20px;
	background: url('blau.gif') no-repeat center top;
	padding-top: 200px;	
	text-align: center;
}


#contacto .datos,
#contacto .datos p {
	line-height: 2em;
}


/* Los más vendidos */
body#masvendidos {
	
}

body#masvendidos .generos {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	#bottom: 5px;
}


/* MODULOS UFI */

.canalufi{
	width:270px;
	right:0px;
	position:absolute;
	top:250px;
	height:250px;
	overflow:hidden;

}

.canalufi .contenido{
	background: #a198db url('podcast.jpg');
	height:212px;
}


.canalufi .contenido #texto{
position:relative;
top:135px;
left:10px;
}

.canalufi .contenido #texto .titulo{
font-size:14;
font-weight:600;
}


.canalufi .contenido .flash{
position:relative;
top:145px;
left:10px;
}



.zonaufi{

width: 665px;	
height: 440px;
overflow: hidden;

}


.ufigrande{
width:270px;
	right:0px;
	position:absolute;
	top:-5px;
	height:250px;
}

.ufigrande .contenido{
padding:10px;
}

#portada .ufipeque{
position:absolute;
top:1207px;
right:0;
height:243px;
width:270px;
}

.ufipeque .contenido{
padding:10px;
}

.ufipeque a{
text-decoration:none;
font-size:14px;
text-align:center;
}


/*PROMO */

.promo {
position:absolute;
top:40px;
left:400px;
}


/* Nota legal */
.legal .texto {
	padding: 20px;
}

/* FACEBOOK */
#facebook {
width: 655px;
background:#FFFFFF;
margin:5px;
padding:5px;
}

/*espai xocolat */
#portada .espai{
	top: 281px;
	position: absolute;
	right: 0;
	bottom: 0;
	overflow: hidden;
	#bottom: 5px;
	_right: 5px;
}


#contacto .espai{
	position: absolute;
	right: 0;
	bottom: 0;	
	top: 0;
	#bottom: 5px;
	_right: 5px;
	_height: expression(this.offsetParent.offsetHeight - 5);
}
.espai {
	width: 270px;
	margin: 0 5px;
	position: relative;
}


.espai .cont{
	text-align: center;	
	margin: 10px 10px 20px;
}


.espai .cont img {
	margin-bottom: 10px;
	border: 1px solid #8b8a89;	
}


.espai .cont .titulo{
	font-size: 14px;
	color: #454545;
	margin:5px 0 10px 0;
}



}

.espai .cont .texte{
	margin-top: 5px;
	line-height: 1.5em;
}


