/* CSS Document */
/*
		Full d'estil creat per Carles Aguilo
		amb l'ajuda d'alguns recursos d'internet,
		sobretot gracies als creadors de Suckerfish Dropdowns.
		
		Sou lliures d'agafar totes les idees de codi que vulgueu, 
		es aixi com he apres el poc que se. Fins i tot he apres a copiar aquestes
		frases a John Hicks.
		
*/

/********************************************************************/
/* BODY i tot aixo */
body {
	/*background-image: url(../imatges/rec_css/fons_degradat.jpg);*/
	background-repeat: repeat-x;
	background-color: #333333;
	text-align: center;
	padding-top: 18px;
	font-family: Helvetica, Arial, sans-serif;
	}
#pagina {
	width: 850px;
	/*background-image: url(../imatges/top_arrodonit.jpg);*/
	background-position: top;
	background-repeat: no-repeat;
	background-color: #FAFAFA;
	padding-top: 20px;
	margin-left: auto;
	margin-right: auto;
	}
/********************************************************************/
/* part superior de la pagina */
#capsalera {
	margin-right: 20px;
	margin-left: 20px;
	border-bottom: 1px solid #b5b5b5;
	padding-bottom: 20px;
	margin-bottom: 20px;
	}
#tira {
	float: right;
	color: #7a7a7a;
	font-size: 1.2em;
	text-align: right;
	}
#tira a {
	color: #7a7a7a;
	}
#tira .aquest {
	color: #bc0031;
	}
#tira a:hover {
	text-decoration: underline;
	color: #bc0031;
	}
#capsalera h1 {
	background-image: url(../imatges/logo_mostra10.png);
	background-repeat: no-repeat;
	display: block;
	width: 508px;
	height: 151px;
	float: left;
	}
#capsalera h1 a {
width: 275px;
	height: 167px;
	display: block;
	}
#capsalera #tira img {
	margin-right: 10px;
	margin-top: 94px;
	}
	
/********************************************************************/
/* MENU */

/* Thanks to Suckerfish Dropdowns*/
#navlist {	
	background-image: url(../imatges/rec_css/fons_menu.png);
	background-repeat: repeat-x;
	height: 64px;
	width: 810px;
	margin-left: 20px;
	margin-right: 20px;
	text-align: left;
	
	}

#navlist a,
#navlist span {
	display: block;
	color: #fafafa;	
}

#navlist li { /* all list items */
	float: left;
	font-size: 1.4em;
	font-weight: bold;	
	display: block;
	width: 122px;
	padding-left: 12px;
	padding-top: 30px;
	padding-bottom: 18px;
	border-right: 1px solid #fafafa;
}

#navlist li:hover, #navlist li.sfhover {
	background-color: #e7e7e7;
	padding-top: 26px;
	border-top: 4px solid #7a7a7a;
	border-right: 1px solid #7a7a7a;
	border-left: 1px solid #7a7a7a;
	width: 121px;
	}

#navlist li:hover span, #navlist li.sfhover span {
	position: relative;
		left: -1px;
	}

#navlist li:hover a, #navlist li.sfhover a {
	color: #292929;
	}
	
#navlist li:hover li a, #navlist li.sfhover li a {
	color: #bc0031;
	}

#navlist li:hover li span, #navlist li.sfhover li span {
	color: #7a7a7a;
	}
	
#navlist li ul { /* second-level lists */
	position: absolute;
	left: -999em; /* using left instead of display to hide menus because display: none isn't read by screen readers */
	background-color: #e7e7e7;
	border-bottom: 5px solid #7a7a7a;
	border-right: 1px solid #7a7a7a;	
	width: 132px;
	margin-left: -12px;
	margin-top: 18px;
	z-index: 6000;
}

#navlist li:hover ul, #navlist li.sfhover ul { /* lists nested under hovered list items */
	left: auto;
}

#navlist li li {
	float: none;
	}
	
#navlist ul li em {
	font-style: normal;
	}
	
#navlist li li {
	display: block;
	font-size: 0.9em;
	font-weight: normal;
	padding-top: 0em;
	padding-bottom: 0em;
	border-top: 1px solid #fafafa;
	width: 132px;
	padding-left: 0px;
}

#navlist li li a,
#navlist li li span {
	color: #bc0031;
	padding-top: 0.8em;
	padding-bottom: 0.8em;
	padding-left: 12px;
	width: 120px;
	}
	
#navlist li li span {
	color: #7a7a7a;
}
	
#navlist li li a:hover {
	color: #fafafa;
	background-color: #7a7a7a;
	}
	
#navlist li li:hover, #navlist li li.sfhover {
	border-top: 1px solid #fafafa;
	background-color: #7a7a7a;
	padding-top: 0em;
	width: 120px;	
	}

#navlist li li:hover span:hover, #navlist li li.sfhover span.sfhover {
	background-color: #e7e7e7;
	}
	
#actual {
	background-image: url(../imatges/rec_css/fons_menu_selecc.png);
	background-repeat: repeat-x;
	color: #bc0031;
	}
	
#navlist li#actual:hover, #navlist li#actual .sfhover {
	background-color: transparent;
	padding-top: 30px;
	border-top: 0px;
	border-right:  1px solid #fafafa;
	border-left: 0px;
	width: 122px;
	
	}
	
/************************************/
/* contingut de la PAGINA */

#content {
	margin: 20px 20px 20px 20px;
	}
/* les ENGRUNES */
#migas {
	color: #7a7a7a;
	margin-top: 10px;
	font-size: 1.1em;
	text-align: left;
	margin-left: 25px;
	}
	
#migas a {
	text-decoration: none;
	color: #bc0031;
	}
	
#migas a:hover {
	text-decoration: underline;
	}
	
	
/******************************************************/
/* el MENU DE SEGON NIVELL INDEPENDENT */
#subnavlist {
	float: right;
	width: 207px;
	background-color: #e7e7e7;
	border-top: 5px solid #7a7a7a;
	padding-left: 29px;
	padding-bottom: 150px;
	text-align: left;
	position: relative;
	right: 20px;
	border-bottom: 1px solid #7a7a7a;
	}

#subnavlist h3 {
	font-size: 1.8em;
	font-weight: bold;
	color: #bc0031;
	margin-top: 15px;
	margin-bottom: 37px;
	}
	
#subnavlist a {
	color: #7a7a7a;
	}
	
#subnavlist a:hover {
	text-decoration: underline;
	}
	
#subnavlist li {
	line-height: 1.7em;
	font-size: 1.4em;
	margin-bottom: 5px;

	}
#subnavlist li {
	line-height: 1.7em;
	font-size: 1.4em;
	margin-bottom: 5px;

	}
	
#subnavlist li li {
	font-size: 0.9em;
	padding-left: 15px;

	}

/* el que esta DESTACAT */
#subnavlist li.now {
	background-color: #b5b5b5;
	background-image: url(../imatges/triangle.jpg);
	background-repeat: no-repeat;
	background-position: left;
	margin-left: -46px;
	padding-left: 46px;
	width: 207px;
	position: relative;
	color: #fafafa;
	
	}
	
#subnavlist li li.now {
	margin-left: -46px;
	padding-left: 61px;
	width: 192px;
	}
	
/* les COORDENADES */
#coords {
	float: left;
	width: 152px;
	text-align: left;
	font-size: 1.0em;
	line-height: 1.3em;
	color: #7a7a7a;
	border-top: 5px solid #7a7a7a;
	border-bottom: 1px solid #7a7a7a;
	background-image: url(../imatges/rec_css/fons_coords.png);
	background-position: left;
	background-repeat: repeat-y;
	padding-bottom: 50px;
	padding-top: 389px;
	position: relative;
	}
	
#coords img {
	position: absolute;
	top: 0px;
	}
	
#coords strong {
	font-weight: normal;
	color: #292929;
	}

#coords p {
	width: 94px;
	margin-left: 29px;
	margin-bottom: 1.8em;
	}
	
#coords a, #text a {
	color: #bc0031;
	}
	
#coords a:hover, #text a:hover {
	text-decoration: underline;
	}
	
/* el TEXT */
#text {
	margin-left: 80px;
	color: #292929;
	width: 340px;
	float: left;
	text-align: left;
	margin-bottom: 34px;
	}
	

#text p {
	font-size: 1.2em;
	line-height: 1.8em;
	margin-bottom: 1.8em;
	letter-spacing: 0.02em;
	}
	
#text h2 {
	width: 270px;
	font-size: 1.6em;
	line-height: 1.3em;
	color: #bc0031;
	display: block;
	border-bottom: 1px solid #b5b5b5;
	font-weight: normal;
	letter-spacing: 0em;
}

.data, #llegir p.data {
	color: #b5b5b5;
	font-size: 1.1em;
	font-family: Arial, Helvetica, sans-serif;
	}
	
#text p.mes_notis {
	text-align: right;
	margin-bottom: 0.0em;
	}

/* El TEXT al segon nivell es diu LLEGIR */
#llegir {
	float: left;
	text-align: left;
	margin-left: 25px;
	margin-top: 19px;
	border-left: 1px solid #b5b5b5;
	padding-left: 14px;
	width: 470px;
	}	
	
#llegir p {
	font-size: 1.2em;
	line-height: 1.8em;
	color: #292929;
	margin-bottom: 1.0em;
	}
	
#llegir h2 {
	font-size: 2.2em;
	color: #bc0031;
	font-weight: normal;
	margin-bottom: 60px;
	}
	
#llegir h3, #text h3 {
	color: #bc0031;
	font-size: 1.6em;
	font-weight: normal;
	margin-top: 1.8em;
	line-height: 2.4em;
	margin-bottom: 3px;
	clear: both;
	line-height: 1.3em;
	}
	
#llegir h4 {
	font-size: 1.4em;
	font-weight: bold;
	margin-top: 25px;
	margin-bottom: 18px;
	}
	
#llegir a {
	color: #bc0031;
	}
	
#llegir a:hover {
	text-decoration: underline;
	}
	
#llegir img {
	float: left;
	padding-right: 9px;
	margin-bottom: 18px;
	}
	
#llegir a img {
	float: none;
	margin: 0px;
	}

#llegir #album a img {
	float: left;
	margin-bottom: 8px;
	}
	
	 	
#llegir table {
	font-size: 1.2em;
	line-height: 1.5em;
	}
	
#llegir tr {
	
	background-color: #e7e7e7;
	}

#llegir td {
	padding-left: 5px;
	background-color: #e7e7e7;
	border-bottom: 1px solid #fafafa;
	padding-right: 15px;
	}
	


#llegir th {
	font-weight: normal;
	color: #bc0031;
	padding-left: 5px;
	background-color: #b5b5b5;
	}
	
#llegir .anys {
	font-family: Georgia, "Times New Roman", Times, serif;
	padding-right: 20px;
	padding-bottom: 0.3em;
	padding-top: 0.3em;
	
	}
	
#llegir ul, #text ul {
	font-size: 1.2em;
	margin-left: 20px;
	line-height: 1.5em;
	}
	
#llegir ul li, #text ul li {
	margin-bottom: 1.5em;
	line-height: 1.5em;
	}

#llegir ul ul, #text ul ul {
	font-size: 1.0em;
	}
	
/* DESTACATS */
#destacats {
	float: right;
	text-align: left;
	width: 182px;
	}
	
#destacats .bloc {
	border-top: 5px solid #7a7a7a;
	width: 182px;
	margin-bottom: 20px;
	border-bottom: 1px dotted #b5b5b5;
	/*
	
	
	text-align: center;*/
	}
	
/*html>body #destacats .bloc {
	width: auto;
	}*/
	
#destacats .bloc h3 {
	background-image: url(../imatges/rec_css/fletxeta.gif);
	background-repeat: no-repeat;
	height: 30px;
	color: #fafafa;
	font-size: 1.2em;
	font-weight: bold;
	padding-left: 9px;
	padding-top: 6px;
	overflow: hidden;
		}
	
#destacats .bloc p {
	margin-top: 5px;
	font-size: 1.2em;
	color: #292929;
	margin-bottom: 9px;
	}
	
#destacats .bloc p a {
	color: #7a7a7a;
	text-decoration: none;
	}

#destacats .bloc p a:hover {
	text-decoration: underline;
	color: #bc0031;
}


/* Tornar a pujar */
.amunt {
	clear: both;
	margin-top: 3px;
	text-align: right;
	width: 100%;
	border-top: 1px solid #b5b5b5;
	padding-top: 9px;
	}

/* El PEU de la pagina al segon nivell */
#base_pagina {
	clear: both;
	padding-top: 30px;
	/*background-image: url(../imatges/rec_css/fons_peu_blanc.jpg);*/
	background-position: bottom;
	background-repeat: no-repeat;
	text-align: right;
	padding-left: 25px;
	padding-right: 25px;
	padding-bottom: 15px;
	}
	
	/****************************************************************/
/* PEU */

#peu {
	border-top: 1px solid #bc0031;
	width: 810px;
	background-color: #7a7a7a;
	color: #fafafa;
	clear: both;
	padding-left: 20px;
	padding-right: 20px;
	padding-top: 7px;
	padding-bottom: 15px;
	/*background-image: url(../imatges/rec_css/fons_peu.jpg);*/
	background-repeat: no-repeat;
	background-position: bottom;
	}
	
#peu #suport {
	padding-bottom: 14px;
	border-bottom: 1px solid #bc0031;
	margin-bottom: 14px;
	}
	
#peu h3 {
	text-align: left;
	font-weight: normal;
	font-size: 1.2em;
	margin-bottom: 15px;
	}
	
#peu #suport img {
	margin-right: 10px;
	margin-bottom: 10px;
	}
	
#peu #colab {
	width: 613px;
	margin-left: auto;
	margin-right: auto;
	text-align: center;
	}
	
#peu #colab img{
	margin: 1px 1px 1px 1px;
	}
	
/***************************************************/
/* mes enlla del peu */
#estandards {
	height: 29px;
	background-color: #292929;
	font-size: 1.1em;
	color: #b5b5b5;
	width: 850px;
	clear: both;
	margin-left: auto;
	margin-right: auto;
	text-align: center;
	}
	
#estandards a {
	color: #bc0031;
	}
	
#estandards a:hover {
	text-decoration: underline;
	}
	
.esquerra {
	float: left;
	margin-top: 5px;
	}
	
.dreta {
	float: right;
	margin-top: 5px;
	}


/***************************************/
/* MAPA */

#mapa #llegir h3 {
	border-bottom: 1px solid #b5b5b5;
	width: 200px;
	display: block;
	color: #292929;
	}
	
#mapa #llegir ul li {
	margin-bottom: 0.5em;
	}
	
/****************************************/
/* PROGRAMA */

#programa caption, #llegir table caption  {
	font-size: 1.2em;
	line-height: 1.8em;
	font-weight: bold;
	color: #7a7a7a;
	}
	
#programa table {
	margin-bottom: 45px;
	border-bottom: 5px solid #7a7a7a;
	}
	
#programa .lloc {
	font-style: italic;
	font-size: 1.1em;
	padding-bottom: 8px;
	padding-top: 16px;
	
	}
	
#programa acronym {
	font-size: 0.8em;
	cursor: crosshair;
	}
	

/*****************************************
/* FOTOGRAMES */

div.frame {
	width: 110px;
	height: 150px;
	text-align: center;
	float: left;
	border-bottom: 3px solid #7a7a7a;
	border-top: 1px dashed #7a7a7a;
	margin-right: 5px;
	margin-bottom: 8px;
	background-color: #e7e7e7;
	position: relative;
	}
	
#llegir .frame p {
	line-height: 1.1em;
	width: 110px;
	height: 10px;
	position: absolute;
	top: 100px;
	float: none;
	left: 0px;
	}
	
#llegir .frame img {
	float: none;
	margin-left: auto;
	margin-right: auto;
	text-align: center;
	padding: 0px;
	margin-top: 5px;
	margin-bottom: 0px;
	}
	
/******************************************/
/* FITXA PRODUCCIONS */

.dades {
	font-size: 0.9em;
	float: left;
	width: 150px;
	margin-left: 8px;
	color: #7a7a7a;
	border-top: 3px solid #7a7a7a;
	padding-top: 6px;
	}
	
#llegir .dades p {
	line-height: 1.3em;
	}
