/* CSS del Ayuntamiento de Sant Cugat */
/* Hoja de estilos de la home */


@import 'general.css';


/* Flash Banner
------------------------------------------------------------------------------------------------------------------------ */
#flash{ float: left; width: 64.8em; height: 15.1em; background: #FFF;}
#flashcontent{ height: 15.1em; background: transparent url(/imgfiles/images/flash_img.gif) left top no-repeat;}
	#flashcontent #imagenes {float:left; width: 53.0em; text-align:left;}
	#flashcontent #imagenes a, #flashcontent #imagenes a:hover{text-decoration:none; border: none; outline:none;}
	#flashcontent #perfiles {float: left; width:11.4em; }
	#flashcontent #perfiles ul{ float: left; width:11.1em; letter-spacing: -1px; font-weight:bold;}
	#flashcontent #perfiles ul li{ float: left; width: 100%; margin-top: .2em;}
		#flashcontent #perfiles ul li.infants{ border-left: 0.3em  solid #6eab24;}
		#flashcontent #perfiles ul li.joves{border-left: 0.3em  solid #ffa00d;}
		#flashcontent #perfiles ul li.families{ border-left: 0.3em solid #e0d703;}
		#flashcontent #perfiles ul li.dones{ border-left: 0.3em  solid #d72215;}
		#flashcontent #perfiles ul li.gentgran{ border-left: 0.3em  solid #1264a3;}
		#flashcontent #perfiles ul li.nous{ border-left: 0.3em  solid #441562;}
	#flashcontent #perfiles ul a{display: block; padding: .5em 0 .6em .7em; background: #f7fbdf; border: 0; color: #000;}
	#flashcontent #perfiles ul span{display: block; padding: .5em 0 .6em .7em; background: #f7fbdf; border: 0; color: #000;}
	#flashcontent #perfiles ul a:hover{ background: #e2e7c2;}


/* Contenido de arriba y Contenido de abajo
------------------------------------------------------------------------------------------------------------------------ */
#contenido_arriba{ width: 52.7em; margin-top: 1.5em;}
#contenido_abajo{ width: 52.7em; margin-top: 2.5em;}
#contenido_arriba:after, #contenido_abajo:after{ content: "."; display: block; height: 0; clear: both; visibility: hidden;}
#contenido_arriba, #contenido_abajo{ display: block;}


/* Noticias
------------------------------------------------------------------------------------------------------------------------ */
#noticias{ float: left; position: relative; width: 32.1em; margin-left: .6em;}                                                        

	/* Titulo de Noticias - Tecnica basada en la de Gianluca Troiani, pero corrige el problema de accesibilidad que se produce al aumentar la medida de la fuente - Fi Image Replacement */
	#noticias{ position: relative; z-index: 1;}                                                        
	#noticias h2{ display: block; height: 15px; width: 100%; color: #FE5207;}
	#noticias h2 span{ position: relative; z-index: -1;}	

	/* Contenido de Noticias */
	#noticias_contenido{ margin-left: .8em; padding: .4em 0 .4em 1em; border: 1px solid #DDE7A2;}
		.noticia{ width: 30em;  padding: 1.1em 0 1em 0; }
		.noticia:after{ content: "."; display: block; height: 0; clear: both; visibility: hidden;}
		 .noticia{ display: block;}

			.noticia h3{ font-size: 1.2em; line-height: 1.5em;  }
			.noticia h4{ font-size: 1.1em; line-height: 1.55em;}
			.noticia p{margin-top: .4em;  font-size: 1.1em; line-height: 1.25em;}
			.noticia img{ float: left; width: 5em; padding: 0 1em 0 0;  background: transparent url(/imgfiles/images/raquo_naranja_06x02.gif) top right no-repeat;}

			.noticia img.grande{ width: 8em;}


/* Agenda
------------------------------------------------------------------------------------------------------------------------ */
#agenda{ float: left; position: relative; width: 18.4em; margin-left: .6em}                                                        

	/* Titulo de Agenda - Tecnica basada en la de Gianluca Troiani, pero corrige el problema de accesibilidad que se produce al aumentar la medida de la fuente - Fi Image Replacement */
	#agenda{ position: relative; z-index: 1;}                                                        
	#agenda h2{ display: block; height: 19px; width: 100%; color: #FE5207;}
	#agenda h2 span{ position: relative; z-index: -1;}

	/* Contenido de Agenda */
	#agenda_contenido{ margin-left: 8px; padding-bottom: 24px; background: #F5F8E6 url(/imgfiles/images/back_agenda.gif) left top repeat-y;}
		.vevent{ width: 15.3em; margin: 0 .1em 0 1em; padding: 1.1em .6em 1.5em .1em;}
		.vevent:after{ content: "."; display: block; height: 0; clear: both; visibility: hidden;}
		.vevent{ display: block;}
			.vevent div{ display: block; margin-left: .5em; line-height: 1em; color: #000;}
			.vevent div abbr{ cursor: text;}
			.vevent div span{ display: inline; margin: 0; padding: 0 .1em; font-weight: bold; color: #FFF; background: #000;}
			.vevent div span.festivo{ background: #D72215;}
			.vevent div span.periodo{ padding-left: 2em; background: transparent url(/imgfiles/images/ico_agenda_negro.gif) left center no-repeat; color: #000; font-weight: normal;}
			.vevent a.imagen{ float: left; margin-left: .5em; margin-top: .4em; border: none;}
			.vevent a.imagen img{ width: 15.4em;}
			.vevent h3{ float: left; font-size: 1.1em; line-height: 1.35em; padding-left: .45em; margin: .1em 0 0 0; background: transparent url(/imgfiles/images/raquo_naranja_06x02.gif) top left no-repeat;}
			.vevent h3 a{ float: none; display: inline;}


/* Enlaces de mas noticias y mas actividades de noticias y agenda
------------------------------------------------------------------------------------------------------------------------ */
p.mascosas{ position: absolute; right: 8px; bottom: -7px; padding: .4em; line-height: 1em; font-weight: bold; background-color: #FFF}
p.mascosas em{ padding: 3px 0 0 5px; background: transparent url(/imgfiles/images/raquo_naranja_07x02.gif) top left no-repeat; font-style: normal;}
p.mascosas a{ color: #000; border-bottom-color: #000;}
p.mascosas a:hover{ color: #6eab24; border-bottom: 1px solid #6eab24;}


/* Radio de Sant Cugat
------------------------------------------------------------------------------------------------------------------------ */
#radio{ float: left; position: relative; width: 31.3em; margin-left: 1.4em; display: inline;}                                                        

	/* Titulo de Radio - Tecnica basada en la de Gianluca Troiani, pero corrige el problema de accesibilidad que se produce al aumentar la medida de la fuente - Fi Image Replacement */
	#radio{ position: relative; z-index: 1;}
	#radio h2{ float: left; display: block; height: 24px; width: 56%; font-size: .9em; line-height: .9em; font-weight: normal; color: #FE5207;}
	#radio h2 span{ position: relative; z-index: -1;}
	
	/* Enlace a la Radio - Tecnica basada en la de Gianluca Troiani, pero corrige el problema de accesibilidad que se produce al aumentar la medida de la fuente - Fi Image Replacement */
	#radio p{ position: relative; z-index: 1;}
	#radio p a{ float: left; display: block; height: 24px; width: 44%; font-size: .9em; font-weight: normal; line-height: 1.1em; background: transparent url(/imgfiles/images/tit_home_radio.gif) 100% 0 no-repeat; border: 0; color: #FE5207;}
	#radio p a span{ position: relative; display: block; z-index: -1; border: 0;}

	/* Contenido de Radio */
	#radio_contenido{ float: left; border: 1px solid #DDE7A2; border-top: 0;}
		.nota{ float: left; width: 29.1em; margin: 0 .1em .1em .1em; padding: .1em .9em 0 .9em; display: inline; background: transparent url(/imgfiles/images/back_radio.gif) left top repeat-x;}
			.nota h3{ margin-bottom: .27em; padding-bottom: 1.27em; font-size: 1.1em; line-height: 1.55em; background: transparent url(/imgfiles/images/ico_targetblank.gif) right bottom no-repeat;}
			.nota span{ float: left; width: 0.1em; padding: 0 1em 1.4em 0; background: transparent url(/imgfiles/images/raquo_naranja_06x02.gif) right top no-repeat;}


/* Santoral
------------------------------------------------------------------------------------------------------------------------ */
#santoral{ float: left; position: relative; width: 17.6em; margin: .1em 0 0 1.4em;}                                                        

	/* Titulo de Agenda - Tecnica basada en la de Gianluca Troiani, pero corrige el problema de accesibilidad que se produce al aumentar la medida de la fuente - Fi Image Replacement */
	#santoral{ position: relative; z-index: 1;}                                                        
	#santoral h2{ display: block; height: 12px; width: 100%; line-height: 1em; color: #FE5207;}
	#santoral h2 span{ position: relative; z-index: -1;}

	/* Contenido de Agenda */
	#santoral_contenido{ padding: .9em 1em 1.1em .5em; border: 1px solid #DDE7A2;}
		#santoral_contenido p{ margin-bottom: 7px; padding-left: 5px; font-size: 1.1em; line-height: 1.2em; color: #000;}
		#santoral_contenido p.felicitar{ margin-bottom: 3px; font-size: 1em; font-weight: bold; background: transparent url(/imgfiles/images/raquo_naranja_04x02.gif) left top no-repeat;}


/* fred
----------------------------------------------------------------------------------------------------------------------------*/

#fred{ float: left; position: relative; width: 32.1em; margin-left: .6em;}                                                        

	/*
 Titulo de Noticias - Tecnica basada en la de Gianluca Troiani, pero 
corrige el problema de accesibilidad que se produce al aumentar la 
medida de la fuente - Fi Image Replacement */
	#fred{ position: relative; z-index: 1;}                                                        
	#fred h2{ display: block; height: 15px; width: 100%; color: #FE5207;}
	#fred h2 span{ position: relative; z-index: -1;}	

	/* Contenido de Noticias */
	#fred_contenido{ margin-left: .8em; padding: .4em 0 .4em 1em; border: 1px solid #DDE7A2;}
		.fred{ width: 30em;  padding: 1.1em 0 1em 0; }
		.fred:after{ content: "."; display: block; height: 0; clear: both; visibility: hidden;}
		 .fred{ display: block;}

			.fred h3{ font-size: 1.2em; line-height: 1.5em;  }
			.fred h4{ font-size: 1.1em; line-height: 1.55em;}
			.fred p{margin-top: .4em;  font-size: 1.1em; line-height: 1.25em;}
			.fred img{ float: left; width: 5em; padding: 0 1em 0 0;  background: transparent url(/imgfiles/images/raquo_naranja_06x02.gif) top right no-repeat;}

			.fred img.grande{ width: 8em;}


/* fred2
------------------------------------------------------------------------------------------------------------------------ */
#fred2{ float: left; position: relative; width: 18.4em; margin-left: .6em}                                                        

	/*
 Titulo de Agenda - Tecnica basada en la de Gianluca Troiani, pero 
corrige el problema de accesibilidad que se produce al aumentar la 
medida de la fuente - Fi Image Replacement */
	#fred2{ position: relative; z-index: 1;}                                                        
	#fred2 h2{ display: block; height: 19px; width: 100%; color: #FE5207;}
	#fred2 h2 span{ position: relative; z-index: -1;}

	/* Contenido de Agenda */
	#fred2_contenido{ margin-left: 8px; padding-bottom: 24px; background: #F5F8E6;}
		.vevent{ width: 15.3em; margin: 0 .1em 0 1em; padding: 1.1em .6em 1.5em .1em;}
		.vevent:after{ content: "."; display: block; height: 0; clear: both; visibility: hidden;}
		.vevent{ display: block;}
			.vevent div{ display: block; margin-left: .5em; line-height: 1em; color: #000;}
			.vevent div abbr{ cursor: text;}
			.vevent div span{ display: inline; margin: 0; padding: 0 .1em; font-weight: bold; color: #FFF; background: #000;}
			.vevent div span.festivo{ background: #D72215;}
			.vevent div span.periodo{ padding-left: 2em; background: transparent url(/imgfiles/images/ico_agenda_negro.gif) left center no-repeat; color: #000; font-weight: normal;}
			.vevent a.imagen{ float: left; margin-left: .5em; margin-top: .4em; border: none;}
			.vevent a.imagen img{ width: 15.4em;}
			.vevent h3{ float: left; font-size: 1.1em; line-height: 1.35em; padding-left: .45em; margin: .1em 0 0 0; background: transparent url(/imgfiles/images/raquo_naranja_06x02.gif) top left no-repeat;}
			.vevent h3 a{ float: none; display: inline;}