/******************** General **************************************************/
body {
	margin-left: 0px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;	
	background-color:#d8d4c1;	
	background-image:url(../img/fons_body.jpg);
	background-position:left top;
	background-repeat:no-repeat;
}

/* zona de continguts sense columna a la dreta (galeries)*/
#container {
	width:970px;
	margin-bottom:0px;
}

#capsalera {
	/*height:224px; MIDA NORMAL SENSE EL FLASH DE LA PROMOCIÓ ESTIU 2009*/
	height:auto;
	background-image:url(../img/fons_capsalera.gif);
	background-repeat:repeat-x;
}


#esquerra{
	width:199px;
	float:left;
}

#mig{
	width:214px;
	float:left;
	background-color:#c7c1aa;
}


#dreta{
	width:557px;
	float:right;
	min-height:377px;
}

#peu_pag{
	clear:both;
	background-image: url(../img/fons_peu.gif);
	background-repeat: repeat-x;
	background-position: left top;
	height:135px;
}

#netejarFloat{
	clear:both;
}


/***************************************** lletres *****************************************/
.text{ 
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #292929;
	text-decoration: none;
}

.titols{
	font-family: Arial, Helvetica, sans-serif;
	font-size: 18px;
	color: #000000;
	text-decoration: none;
}

.subTitols{
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	font-weight:bold;
	text-align:right;
	color: #000000;
	text-decoration: none;
}

.titols_blanc{
	font-family: Arial, Helvetica, sans-serif;
	font-size: 18px;
	color: #FFFFFF;
	text-decoration: none;
}

.titols_orange{
	font-family: Arial, Helvetica, sans-serif;
	font-size: 18px;
	color: #f07900;
	text-decoration: none;
}

.text_carro{ 
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: #000000;
	text-decoration: none;
}


/*********************************** links ***********************************/
a{
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: #000000;
	text-decoration: none;
}
	a:link 		{color:#000000}
	a:visited	{color:#000000}
	a:hover		{color:#FFFFFF}
	a:active	{color:#FFFFFF}

a.link_autors{
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: #000000;
	text-decoration: none;
	font-weight:bold;
}
	a:link.link_autors		{color:#000000}
	a:visited.link_autors	{color:#000000}
	a:hover.link_autors		{color:#FFFFFF}
	a:active.link_autors	{color:#FFFFFF}

a.link_blanc{ 
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: #FFFFFF;
	text-decoration: none;
}
	a:link.link_blanc		{color:#FFFFFF}
	a:visited.link_blanc	{color:#FFFFFF}
	a:hover.link_blanc		{color:#FFFFFF}
	a:active.link_blanc		{color:#FFFFFF}
	
a.link_subratllat{
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: #000000;
	text-decoration: underline;
}
	a:link.link_subratllat		{color:#000000}
	a:visited.link_subratllat	{color:#000000}
	a:hover.link_subratllat		{color:#FFFFFF}
	a:active.link_subratllat	{color:#FFFFFF}
	
a.link_titols{
	font-family: Arial, Helvetica, sans-serif;
	font-size: 18px;
	color: #000000;
	text-decoration: none;
}
	a:link.link_titols		{color:#000000}
	a:visited.link_titols	{color:#000000}
	a:hover.link_titols		{color:#FFFFFF}
	a:active.link_titols	{color:#FFFFFF}
	
a.link_compra{
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #000000;
	text-decoration: none;
	font-weight:bold;
}
	a:link.link_compra		{color:#000000}
	a:visited.link_compra	{color:#000000}
	a:hover.link_compra		{color:#FFFFFF}
	a:active.link_compra	{color:#FFFFFF}

		
/*********************************** presentació ********************************/
#container_dreta{
	width:470px;
	margin:0px 0px 20px 48px;
}

#titol_dreta{	
	width:470px;
	height:32px;
}

	#imatge_titol_dreta{
		margin-left:127px;
		margin-top:7px;
	}
	
	#linia_titol_dreta{
		margin-top:-7px;
	}

#text_dreta{
	width:355px;
	text-align:justify;
	margin-top:27px;
}

#boto_mes_autors {
	float:right;
	color:#FFF;
	margin-right:14px;
	font-family:Arial, Helvetica, sans-serif;
	font-size:11px; padding:4px;
	background-color:#000;
	border:1px solid #FFF;
}
	#boto_mes_autors:hover {
		background-color:#666;
		cursor:pointer;
	}

#containers_autors_nous{
	width:470px;
	margin-top:27px;
}

#marc_autors_nous{
	float:left;
	padding-right:10px;
	padding-bottom:10px;
}

#marc_foto_autors_nous{
	display:table; /*(només per FireFox) així fem que actui com una taula i podem aprofitar la propietat vertical-align*/
	background-color:#000000;
	width:106px;
	height:106px;
}

	#marc_foto_autors_nous div{
		padding:3px;
		text-align:center;
		vertical-align:middle;
		display:table-cell; /*(només per FireFox) ja hem dit que actui com una taula, ara aquesta capa actua com una cel·la*/
		vertical-align:middle; /*(només per FireFox) ja li podem dir que faci el vertical-align com si fos una taula*/		
	}
	
#marc_nom_autors_nous{
	width:106px;
	height:40px;
	overflow:hidden;
	background-color: #c9c7b2;
	background-image: url(../img/fons_obra_autor.gif);
	background-repeat: repeat-x;
	background-position: left top;
}

	#marc_nom_autors_nous div{
		padding:8px 5px 5px 5px;
		text-align:right;
	}

/************************************** categoria *******************************/
#titol_principal_categoria {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 18px;
	color: #000000;
	text-decoration: none;
	width:355px;
	text-align:right;
	padding-top:9px;
}

#linia_titol_categoria{
	width:470x;
	height:1px;
	margin-top:1px;
	margin-bottom:9px;
}


#marc_autors{
	float:left;
	padding-right:10px;
	padding-bottom:10px;
}
	
#marc_foto_autors{
	display:table; /*(només per FireFox) així fem que actui com una taula i podem aprofitar la propietat vertical-align*/
	background-color:#000000;
	width:146px;
	height:146px;
}

	#marc_foto_autors div{
		padding:8px;
		text-align:center;
		vertical-align:middle;
		display:table-cell; /*(només per FireFox) ja hem dit que actui com una taula, ara aquesta capa actua com una cel·la*/
		vertical-align:middle; /*(només per FireFox) ja li podem dir que faci el vertical-align com si fos una taula*/		
	}
	
#marc_nom_autors{
	width:146px;
	height:40px;
	overflow:hidden;
	background-color: #c9c7b2;
	background-image: url(../img/fons_obra_autor.gif);
	background-repeat: repeat-x;
	background-position: left top;
}

	#marc_nom_autors div{
		padding:8px 5px 5px 5px;
		text-align:right;
	}
	
#containers_autors{
	width:470px;
	margin-top:27px;
}

/*************************************** obres ***************************************/
#obres_esquerra{
	width:260px;
	float:left;
	margin-right:8px;
}

#descripcio_obres {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #292929;
	text-align:justify;
	padding:10px 0px 10px 0px;
}

#obres_dreta{
	width:200px;
	float:right;
	text-align:right;
}

#titol_principal_esquerra{
	font-family: Arial, Helvetica, sans-serif;
	font-size: 18px;
	color: #000000;
	text-decoration: none;
	width:355px;
	text-align:right;
	padding-top:9px;
	float:left;
}

#titol_principal_dreta{
	float:right;
	width:115px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 18px;
	color: #000000;
	text-decoration: none;
	text-align:right;
	padding-top:9px;
}

#a_escala {
	width:120px;
	height:17px;
	background-color:#000000;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	color:#FFFFFF;
	text-align:center;
	padding-top:2px;
	margin:0px 0px 10px 0px;
}

/*************************************** carro ***************************************/
.producteTransfer { /*moviment del carro*/
	border: 2px solid #000000;
}

.boto_buida_carro{
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: #FFFFFF;
	text-decoration: none;
	background-color: #000000;	
	border: 1px solid #000000;
	cursor:pointer;
}

.compraLinies{
	background-color:#000000;
}

#carro_dreta{ /* carro.asp */
	width:470px;
	text-align:justify;
	margin-top:27px;
}

/*************************************** formulari ***************************************/
.inputs{
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: #333333;
	text-decoration: none;
	border: 1px solid #000000;
}

.botons{
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: #FFFFFF;
	text-decoration: none;
	background-color: #000000;
	border: 1px solid #000000;
	cursor:pointer;
}

/*************************************** confirmar compra ***************************************/
#titol_confirmar {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 18px;
	color: #000000;
	text-decoration: none;
	text-align:left;
}

#linia_sota_confirmar{
	background-color:#000000;
	width:237px;
	height:1px;
	margin-top:1px;
	margin-bottom:9px;
}

#proteccio_dades{
	font-family:Arial, Helvetica, sans-serif;
	font-size:10px;
	padding: 10px 10px 10px 10px;
	text-align:justify;
	color: #333333;
	border: 1px solid #8b8b8b;
	background-color:#c9c5b3;
}

/*************************************** afegir carro ***************************************/
#cistella_esquerra{
	float:left;
	width:36px;
	height:40px;
	padding-top:9px;
	padding_left:3px;
}

#cistella_dreta{
	float:right;
	width:145px;
}
	#cistella_dreta{
		padding:2px;
	}

#veure_cistella_contenidor{
	width:187px;
	height:40px;
	margin-top:2px;
}

#veure_cistella{
	width:187px;
	height:40px;
	background-color:#000000;
	/* opacitat del 18% negre, varia la sentència depen de cada explorador */
	filter: alpha(opacity=18); /* IE */	
	opacity: .18; /* FF */
	-moz-opacity: .18; /* Mozilla */
}

#veure_cistella_text{
	width:187px;
	height:40px;
	position: relative; /* es posa posició absoluta o relativa perquè no agafi la opacitat del fons */
	text-align:right;
	margin-top:-40px;
}	

.botons_cistella{
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: #FFFFFF;
	text-decoration: none;
	background-color: #000000;
	border: 1px solid #000000;
	margin:2px;
	cursor:pointer;
}

/*************************************** obres ***************************************/
#obres_preu{
	border: 1px solid #f07900;
}
#obres_preu_esquerra{
	padding: 10px 5px 5px 5px;
	float:left;
}
#obres_preu_dreta{
	padding: 5px;
	float:right;
}

/************************************** escenari *************************************/
#fons_escenari {
	width:470px;
	height:270px;
}


/************************************** contactar *************************************/
#container_formulari{
	width:355px;
	text-align:right;
}
