/*
***************************************************************************
** Selectors HTML 
***************************************************************************
*/
* {		/* Selector universal */
	padding: 0px;
	margin: 0px;
}
body {
		/* Definició de font, tipus i tamany general del site. */
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 14px;
	background-color: #f9f1f2;		/* Color 10% */
		/* Margin superior i inferior (per sobtre capçalera i sota el peu) */
	margin-top: 15px;
	margin-bottom: 15px;
}
a {
	/*color: #c9868e;*/		/* Color 90% */color: #9b1f2e;
	text-decoration: none;
	outline-style: none;
	font-weight: bold;
}
a:hover {
	/*color: #9b1f2e;*/		/* Color 100% */color: #c9868e;
}
a:visited {
	text-decoration: none;
	font-weight: bold;
}
h1 {
	text-align: center;
	border: none;
	padding: 5px 0;
	font-size: 2.5em;
	font-family: Desdemona;
	font-weight: normal;
}
h2 {
	text-align: center;
	border: none;
	padding: 5px 0;
	font-size: 1.50em;
	font-family: Harpoon;
}
h3 {
	text-align: center;
	border: none;
	padding: 3px 0;
	font-size: 1.25em;
	font-family: Harpoon;
}
p {
	padding: 0.5em;
}

ul, ol {	/* Marge a dreta i esquerra */
	margin: 0 1em 0 2em;
}
li {	/* padding superior i inferior per donar aire */
	margin: 0 1em 0 1em;
	padding: 0.5em 0 0.5em 0;
}

/*
***************************************************************************
** Classes genèriques
***************************************************************************
*/
.clear {		/*** Neteja floats ***/
	clear: both;
}
.flota_esq {
	float: left;
}
.flota_dret {
	float: right;
}
.petit08 {		/**** Font petita 80% ***/
	font-size: 0.8em;
}
.gran125 {
	font-size: 1.25em;
}
.ressaltat {
	font-size: 1.25em;
	text-align: center;
}

/*
***************************************************************************
** Definició del layout
**	ID #wrapper: El contenidor de tot plegat
**		ID #capsalera: Definició de la capçalera. 
**		ID #pagina: Part central de la plana. 
**			ID #index: El menú a l'esquerra.
**			Class .contingut: El contingut de la pàgina.
**		ID #peu: Definició del peu.
***************************************************************************
*/
#wrapper {
		/* 80% d'ample i centrat */
	width: 80%;
	margin-right: auto;
	margin-left: auto;
		/* Controlem, on es pugui (on es conegui l'element min-width) ample mínim de 600px. */
	min-width: 890px;
}
#pagina {
	width: auto;
	border-top: 1px solid #9b1f2e;		/* Color 100% */
	/*border-bottom: 1px solid #9b1f2e;*/		/* Color 100% */
	padding: 10px 0px;
	margin-left: 222px;
	margin-top: 5px;
	margin-bottom: 5px;
}
#index {
	float: left;
	width: 123px;
}
.contingut {
		/* Margin esquerre per l'index */
	/*margin-left: 125px;*/
		/* Paddings per donar aire a dreta i esquerra */
	/*padding-right: 1em;
	padding-left: 1em;*/
}
/*
**********************************************************
** Definició de la capçalera. 
**********************************************************
** Els elements que conté son 
**		#capsalera (el contenidor)
**		#cap_logo (el img del logo)
**		#cap_medalla (el img amb la foto de la medalla)
**		#cap_1886 (el text "Des de 1886 ...")
**		#cap_onsom (el text amb l'adreça)
**********************************************************
*/
#capsalera {
	width: 100%;  
	position: relative;		/* Per posicionar absolutament el que hi ha dins */
	margin-right: auto;
	margin-left: auto;
	border-bottom: 10px solid #dbafb4;		/* Color 60% */
	margin-bottom: 3px;
	height: 110px;
}
#cap_logo {
	float: left;
}
#cap_medalla {
	width: 70px;
}
#cap_1886 {
	margin-left: 250px;
	margin-top: 1em;
	font-size: 1.3em;
	font-style: italic;
	font-weight: bold;
	color: #9b1f2e;		/* Color 100% */
}
#cap_onsom {
	font-size: 0.8em; /* petit08 */
	text-align: center; 
	padding: 2px 0 5px 0; 
	color: #9b1f2e;		/* Color 100% */
}
/*
**********************************************************
** Definició del peu de les pàgines. 
**********************************************************
** Els elements que conté son 
**		#peu (el contenidor)
**		#peu_membres (l'espai per les imatges d'entiats catalanes i FAC )
**		#peu_lluisos (el text "Lluisos d'horta...")
**		#peu_xml (Imatge XML)
**********************************************************
*/
#peu {
	width: 100%;
	font-size: 0.9em;
	color: #9b1f2e;		/* Color 100% */
	border-top: 1px solid #9b1f2e;		/* Color 100% */
	border-bottom: 1px solid #9b1f2e;		/* Color 100% */
	padding-top: 10px;
	padding-bottom: 10px;
}
#peu_membres {
	float: left;
	width: 375px;
}
#peu_membres img {
	padding-right: 10px;
}
#peu_lluisos {
	text-align: center;
	margin-left: 375px;
	margin-right: 70px;
}
#peu_xml {
	float: right;
	width: 50px;
}
#peu_xml img {
	padding-right: 10px;
	padding-bottom: 10px;
}
#peu p {
	padding: 0;
}
/*
***************************************************************************
** Els botons de l'index, amb aspecte gràfic arrodonit.
***************************************************************************
*/
a.boto_index {
	height: 26px;
	width: 120px;
	display: block;
	cursor: hand;
	background-image: url(../grafics/a_menu.gif);
	background-position: center center;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight: bold;
	text-align: center;
	vertical-align: middle;
	line-height: 26px;
	color: #000000;
	text-decoration: none;
	outline-style: none;
}
a.boto_index:hover, a.boto_index:active {
	background-image: url(../grafics/p_menu.gif);
}
/*
***************************************************************************
** Classes per les notícies.
***************************************************************************
*/
.noticia {
	padding: 1em;
	border: thin solid #9b1f2e;		/* Color 100% */
	width: auto;
}
.noticia h2 {
	border-bottom: thin solid #9b1f2e;		/* Color 100% */
}
.not_cos {
}
.not_enrere {
	border-top: thin solid #9b1f2e;		/* Color 100% */
	text-align: center;
	font-size: 1.25em;
}
.not_publi {
	font-size: 0.8em;
	text-align: right;
	color: #9b1f2e;		/* Color 100% */
}
/*
***************************************************************************
** ID's per juntadirectiva.php.
***************************************************************************
*/
#junta_membres {
	width: 40%;
	height: auto;
	float: left;
	border: thin solid #9b1f2e;		/* Color 100% */
	padding: 1em;
}
#junta_seccions{
	height: auto;
	margin-left: 50%;
	border: thin solid #9b1f2e;		/* Color 100% */
	padding: 1em;
}

/*
***************************************************************************
** Vespres de Jazz
***************************************************************************
*/
/* Barra de menús de l'esquerra */
#left { float: left; width: 200px; }
#left h3 { padding-bottom: 1em; }
#left ul {
	list-style-image: none; list-style-type: none; text-align: left; width: 160px; margin: 0; padding: 0; }
#left li {
	display: block;
	border-bottom: 1px solid #9b1f2e;  border-right: 1px solid #9b1f2e; 		/* Color 100% */
	width: 150px; height: 2em; padding: 0; margin: 5px 0; 
	/*margin-bottom: 3px; 	padding-top: 5px;	padding-bottom: 5px;*/ }
#left li a {
	display: block;	padding: 5px 0;
	/*height: 1.5em;*/ }
#left li a:hover {
	display: block;	/*height: 1.5em;*/
	border-right: 3px solid #9b1f2e;	 		/* Color 100% */
	/*margin-bottom: 3px;	padding-top: 5px;	padding-bottom: 5px;*/ }

/* Tot el contingut central dividit en 3 columnes */
.contingut_centre { margin-left: 210px; text-align:left; position: relative; }

/* Columna esquerra -> Eliminada */
.col_esq { left: 0; top: 10px; position: absolute; width: 200px; text-align: center; }
.col_esq img { padding-bottom: 2em; }

/* Columna dreta -> Logo vespres + altres imatges */
.col_dreta { right: 10px;  position: absolute; width: 200px; text-align: center; }

/* El centre central */
.central { margin: 0 210px 5px 0; }
.centre_quadre {
	background-color: #edd7d9; 		/* Color 30% */
	border-top: 4px solid #f3e4e6; border-left: 4px solid #f3e4e6; 		/* Color 20% */
	border-right: 4px solid #e1bcc0; border-bottom: 4px solid #e1bcc0;  /* Color 50% */}

/* A sota les fotos a la plana inicial dels vespres */
.peu_fotos { text-align: left; }
.peu_fotos img { padding: 10px 0 10px 0; }
/*
***************************************************************************
** Fi de Vespres de Jazz
***************************************************************************
*/

/*
***************************************************************************
** Cinema de Valors
***************************************************************************
*/
.contingut_cinema #left 	{ left:0; width: 200px; height: 365px; margin-left: 20px; /*background-image: url(../grafics/cinema_valors/logo.gif);*/ } 
.contingut_cinema #left h1	{ visibility: hidden; } /*{ text-align: left; font-size: 300%; font-weight: bold; font-style: italic; color: #0000FF; }*/
.contingut_cinema #right 	{ right: 0; text-align: right; margin-right: 20px; }
.contingut_cinema #content 	{ /*clear: both;*/ /*width: 800px; */ position:relative; margin-left: auto; margin-right: auto; padding-top: 5px; }
.contingut_cinema #content h2 { padding-top: 20px; }
.contingut_cinema a 		{ color: #FF6600; text-decoration: none; outline-style: none; font-weight: bold; }
.contingut_cinema a:hover 	{ text-decoration: underline; color: #FF6600; }

/*
.pelis_content		{ background-image: url(../grafics/cinema_valors/mig.gif); background-repeat: repeat-y; color:#FFFFFF; top: 20px; }
.pelis_top			{ background-image: url(../grafics/cinema_valors/sup.gif); background-position: top center; background-repeat: no-repeat; }
.pelis_bottom		{ background-image: url(../grafics/cinema_valors/inf.gif); background-position: bottom center; background-repeat: no-repeat; padding-bottom: 16px; }
.pelis_in			{ padding: 0 10px 0 10px; }
*/
.pelis_content		{}
.pelis_top			{}
.pelis_bottom		{}
.pelis_in			{ padding: 0 10px 0 10px; }

.ressenya 		{ font-size: 90%; }
.tornar 		{ font-size: 90%; text-align: right; vertical-align: top; }
/*
***************************************************************************
** Fi de Cinema de Valors
***************************************************************************
*/

/*
***************************************************************************
** Titelles als LLuïsos
***************************************************************************
*/
.contingut_titelles #logo 	{ margin-left: auto; margin-right: auto; text-align: center; padding-top: 7px; /*background-image: url(../grafics/cinema_valors/logo.gif);*/ } 
.contingut_titelles #left h1	{ visibility: hidden; } /*{ text-align: left; font-size: 300%; font-weight: bold; font-style: italic; color: #0000FF; }*/
.contingut_titelles #right 	{ right: 0; text-align: right; margin-right: 20px; }
.contingut_titelles #content 	{ /*clear: both;*/ /*width: 800px; */ position:relative; margin-left: auto; margin-right: auto; padding-top: 5px; }
.contingut_titelles #content h2 { padding-top: 20px; }
.contingut_titelles a 		{ color: #FF6600; text-decoration: none; outline-style: none; font-weight: bold; }
.contingut_titelles a:hover 	{ text-decoration: underline; color: #FF6600; }

/*
.pelis_content		{ background-image: url(../grafics/cinema_valors/mig.gif); background-repeat: repeat-y; color:#FFFFFF; top: 20px; }
.pelis_top			{ background-image: url(../grafics/cinema_valors/sup.gif); background-position: top center; background-repeat: no-repeat; }
.pelis_bottom		{ background-image: url(../grafics/cinema_valors/inf.gif); background-position: bottom center; background-repeat: no-repeat; padding-bottom: 16px; }
.pelis_in			{ padding: 0 10px 0 10px; }
*/
.pelis_content		{}
.pelis_top			{}
.pelis_bottom		{}
.pelis_in			{ padding: 0 10px 0 10px; }

.ressenya 		{ font-size: 90%; }
.tornar 		{ font-size: 90%; text-align: right; vertical-align: top; }
/*
***************************************************************************
** Fi de Titelles als LLuïsos
***************************************************************************
*/
