/*****************************************************************************************************************
*      Web:            Museo Thyssen-Bornemisza - Microsites Exposiciones para Exposiciones Temporales           *   
*      Autor:          Jorge Soriano correo@mrsoriano.com                                                        *
*      Hoja:           estilos.css                                                                               *
*      Descripcion:    Estilos generales del site                                                                * 
*      Fecha:          11/09/2009                                                                                *
**************************************************************************************************************** */

/* colores con los que vamos a trabajar

	color más oscuro: #FFFFFF
	color medio: #d9dbb9, utilizado para el rollover de los menús
	color más claro: #a19d83, utilizado para bordes 
	color para texto: #000000
	
*/

/************************************
	IMPORTAMOS LA HOJA RESET.CSS 
*************************************/

@import url("reset.css");

/***************************************************
	ESTRUCTURA DE LA PÁGINA Y CLASES GENÉRICAS
****************************************************/

body {	background:#FFFFFF;	font-family: Arial, Helvetica, sans-serif; color: #000000; font-weight:normal; font-size: x-small; padding:0 0 10em 0;}

.oculto { display:block; position:absolute; top:-999em; }

a:link, a:visited { color:#000000; text-decoration:none;}
	a:hover { color:#000000; text-decoration:underline;}
	a:active { color:#000000; text-decoration:none;}

#wrapper { width:97.2em; margin:0 auto; overflow:hidden;}


/*========= CABECERA =========*/

#header { overflow:hidden; height:25.4em;}

h1 { width:72.1em; height:5.3em; float:left; overflow:hidden;}
	h1 a { display:block; height:100%; width:45.5em;}
		h1 a strong { display:block; position:absolute; top:-999em; height:5.3em;width:45.5em;}
		h1 a span { display:block; position:absolute; background: transparent url(../img/template/logo.gif) no-repeat bottom left; height:5.3em;width:45.5em;}

a#cambio-idioma:link,a#cambio-idioma:visited,a#cambio-idioma:hover,a#cambio-idioma:active { font-size:1.1em; display:block; float:left; overflow:hidden; background:url(../img/template/back-cambio-idioma.gif) no-repeat bottom left; color:#000000; line-height:4.818em;}

#header img{ width:97.2em; height:20.1em;}

/*========= LATERAL IZQUIERDO =========*/

#aside { width:23em; float:left;}


#aside ul#menu { padding:5.2em 0 0 0;}
#aside ul#menu li a.parent { height:5.5em; overflow:hidden;}

#aside ul#menu li a:link{ color:#000000; display:block;}
	#aside ul#menu li a:visited { color:#000000; display:block;}
	#aside ul#menu li a:hover, #aside ul#menu li.seccion_activa a.parent:link, #aside ul#menu li.seccion_activa a.parent:visited, #aside ul#menu li.seccion_activa a.parent:hover, #aside ul#menu li.seccion_activa a.parent:active { color:#000000; background-color: #d9dbb9; display:block; text-decoration:none;}
	#aside ul#menu li a:active { color:#000000; display:block;}


#aside strong { font-weight:normal; height:2.13em; line-height:2.7em; font-size:1.5em; display:block; overflow:hidden; padding:0 0 0 2.6em; background: transparent url(../img/template/arrow-menu-seccion-off.gif) no-repeat bottom left;}
	#aside small { display:block; color:#a19d83; font-size:1.1em; padding:0 0 0 3.6em; height:2.1em;}
	
#aside ul.submenu { border-top:0.1em solid #a19d83;}
	#aside ul.submenu li{ height:1.9em; overflow:hidden; border-bottom:0.1em solid #a19d83;}
		#aside ul.submenu li a:link{ font-size:1.1em; line-height:1.81em; color:#000000; background: transparent url(../img/template/arrow-menu-off.gif) no-repeat center left; padding:0 0 0 5.27em; display:block; height:100%;}
		#aside ul.submenu li a:visited { font-size:1.1em; line-height:1.81em; color:#000000; background: transparent url(../img/template/arrow-menu-off.gif) no-repeat center left; padding:0 0 0 5.27em; display:block; height:100%;}
		#aside ul.submenu li a:hover, #aside ul li a.menu_activo:link, #aside ul li a.menu_activo:visited, #aside ul li a.menu_activo:hover, #aside ul li a.menu_activo:active { font-size:1.1em; line-height:1.81em; color:#000000; text-decoration:none; background: #d9dbb9 url(../img/template/arrow-menu-on.gif) no-repeat center left; padding:0 0 0 5.27em; display:block; height:100%;}
		#aside ul.submenu li a:active { font-size:1.1em; line-height:1.81em; color:#000000; background: transparent url(../img/template/arrow-menu-off.gif) no-repeat center left; padding:0 0 0 5.27em; display:block; height:100%;}


/*========= CONTENIDO CENTRAL =========*/

#container { width:52.1em; float:left; overflow:hidden;}

ul#rastro { height:3em; overflow:hidden; padding:0 0 0 3em;}
ul#rastro li { float:left; overflow:hidden;}
	ul#rastro li.last{ float:left; font-size:1.1em; padding:1.18em 1.8em 0 0; background:url(../img/template/back-rastro-on.gif) no-repeat top left;}
	ul#rastro li a:link{ float:left; font-size:1.1em; display:block; padding:1.18em 1.8em 0 0; background:url(../img/template/back-rastro-off.gif) no-repeat top left;}
	ul#rastro li a:visited{ float:left; font-size:1.1em; display:block; padding:1.18em 1.8em 0 0; background:url(../img/template/back-rastro-off.gif) no-repeat top left;}
	ul#rastro li a:hover{ float:left; font-size:1.1em; text-decoration:none; display:block; padding:1.18em 1.8em 0 0; background:url(../img/template/back-rastro-on.gif) no-repeat top left;}
	ul#rastro li a:active{ float:left; font-size:1.1em; display:block; padding:1.18em 1.8em 0 0; background:url(../img/template/back-rastro-off.gif) no-repeat top left;}

h2{ border-bottom:0.02em solid #a19d83; color:#000000; font-size:3.6em; font-weight:normal; height:2.16em; line-height:1.65em; padding:0 0 0 0.65em;}
	h2.sIFR-replaced{ font-size:3.1em; height:2.19em; line-height:1.65em; padding:0.3em 0 0 0.85em;}

#content { padding:0 3em; width:46.2em;}
	#content h3 { background:url(../img/template/back-h3.gif) no-repeat top left; font-size:1.5em; font-weight:normal; padding:0 0 0 1.4em; height:2em; overflow:hidden; line-height:2.6em;}
		#content h3.visita { background:none;padding:0 0 0 0; border-top:0.07em solid #a19d83; margin:1.3em 0 0 0; height:4.85em;}
			#content h3 small{ display:block; margin-top:-20px; font-size:0.8em; color:#d9dbb9;}
			
	#content small.first_small { font-size:1.2em; padding:0 0 0 1.75em; display:block; color:#a19d83; height:1.16em; line-height:1.16em;}
	#content small.second_small { font-size:1.1em; padding:0 0 0 2em; display:block; color:#d9dbb9; height:2.7em; line-height:1.16em;}

	#content p { font-size:1.2em; line-height:1.25em; padding:0 0 1em 0;}
		#content p em{ font-style:italic;}
	
	#content span.return { clear:both; float:left; display:block; width:18.58em; text-indent:2.5em; border-top:0.09em solid #a19d83; height:2.9em; line-height:2.9em; background:url(../img/template/back-boton-volver.gif) no-repeat center left; font-size:1.2em; color:#000000; margin-top:8.33em; cursor:pointer;}
		#content span.return_hover { text-decoration:underline;}
	
	#content ul.lista_mini_img { overflow:hidden; margin:0 0 3em 0;}
		#content ul.lista_mini_img * { font-size:x-small;}
		#content ul.lista_mini_img { border-bottom:0.1em solid #a19d83; overflow:hidden;}
			#content ul.lista_mini_img li { border-top:0.1em solid #a19d83; overflow:hidden; }
				#content ul.lista_mini_img li img { float:left; width:15.2em;}
				#content ul.lista_mini_img li h4 { float:left; height:100%; overflow:hidden; width:31em; font-weight:normal;}
					#content ul.lista_mini_img li h4 a:link { display:block; font-size:1.5em; overflow:hidden; line-height:2.55em; height:4.93em; padding:0 0 0 2em; background: transparent url(../img/template/arrow-listado-off.gif) no-repeat top left; text-decoration:none;}
					#content ul.lista_mini_img li h4 a:visited { display:block; font-size:1.5em; overflow:hidden; line-height:2.55em; height:4.93em; padding:0 0 0 2em; background: transparent url(../img/template/arrow-listado-off.gif) no-repeat top left; text-decoration:none;}
					#content ul.lista_mini_img li h4 a:hover { display:block; font-size:1.5em; overflow:hidden; line-height:2.55em; height:4.93em; padding:0 0 0 2em; background: #d9dbb9 url(../img/template/arrow-listado-on.gif) no-repeat top left; text-decoration:none;}
					#content ul.lista_mini_img li h4 a:active { display:block; font-size:1.5em; overflow:hidden; line-height:2.55em; height:4.93em; padding:0 0 0 2em; background: transparent url(../img/template/arrow-listado-off.gif) no-repeat top left; text-decoration:none;}
				#content ul.lista_mini_img li small { font-size:0.73em; margin:-2em 0 0; display:block; color:#d9dbb9;}
					#content ul.lista_mini_img li h4 a:link small { color:color:#d9dbb9; }
					#content ul.lista_mini_img li h4 a:visited small { color:color:#d9dbb9; }
					#content ul.lista_mini_img li h4 a:hover small { color:#a19d83 }
					#content ul.lista_mini_img li h4 a:active small { color:color:#d9dbb9; }


	#content ul.lista_maxi_img { margin:0 -3em; padding:0 0 3em 0; float:left; width:52.2em; overflow:hidden; clear:left;}
	#content ul.lista_maxi_img li { padding:0 3em; clear:left; overflow:hidden;}
		#content ul.lista_maxi_img h4 { background:url(../img/template/back-h4.gif) no-repeat top left; font-size:1.5em; font-weight:normal; padding:0 0 0 1.4em; height:2em; overflow:hidden; line-height:2.6em;}
		#content ul.lista_maxi_img img { float:left;}
		#content ul.lista_maxi_img li dl { float:left; margin:0 0 0 1.5em; width:22.4em;}
			#content ul.lista_maxi_img li dl dt { display:block; position:absolute; top:-999em;}		
			#content ul.lista_maxi_img li dl dd { font-size:1.5em; color:#000000;}		
				#content ul.lista_maxi_img li dl dd em { font-style:italic;}		
				#content ul.lista_maxi_img li dl dd small { font-size:0.73em; color:#000000; }		
				#content ul.lista_maxi_img li dl dd abbr { border-bottom:0.1em dotted #d9dbb9;}

	img#plano { display:block; margin:0 0 3em 0; width:49em;}

	div.left_col { float:left; width:22.3em; padding:0 1.6em 3em 0; overflow:hidden;}
	div.right_col { float:left; width:22.3em; padding:0 0 3em 0; overflow:hidden;}

	div.left_col dt, div.right_col dt { font-size:1.2em; line-height:1.25em;}
	div.left_col dd, div.right_col dd { font-size:1.2em; line-height:1.25em; margin:0 0 1em 0;}
	div.left_col dd.nomargin, div.right_col dd.nomargin { margin:0 0 0 0;}
	
	div.left_col dt strong, div.right_col dt strong{ font-weight:bold;}

	div.social { clear:left; width:22.2em; border-top:0.1em solid #a19d83; padding:1em 0 3em 0; overflow:hidden;}	
		div.social h4, div.social a.audio { font-size:1.2em; line-height:1.2em; color:#000000; background:url(../img/template/arrow-social-off.gif) no-repeat center left; padding:0 0 0 1.5em; float:left;}
		div.social ul { clear:left; padding:1em 0 0 0;}
			div.social ul li { float:left; overflow:hidden; margin:0 0.6em 0 0;}
				div.social ul li a:link{ float:left; display:block; border:0.1em solid #FFFFFF; height:1.2em;}
				div.social ul li a:visited{ float:left; display:block; border:0.1em solid #FFFFFF; height:1.2em;}
				div.social ul li a:hover{ float:left; display:block; border:0.1em solid #a19d83; height:1.2em;}
				div.social ul li a:active{ float:left; display:block; border:0.1em solid #FFFFFF; height:1.2em;}
	
	ul#patrocinadores { clear:both; float:left; margin:3em 0 0 0; overflow:hidden; width:110%;}
		ul#patrocinadores li { float:left;overflow:hidden; margin:0 1.5em 1.5em 0;}


/*========= LATERAL DERECHO =========*/

#bside { float:left; width:22.1em; padding:10.7em 0 0 0;}

	#bside h3 { font-weight:normal; line-height:1.74em; font-size:1.5em; display:block; overflow:hidden; padding:0.5em 0 0 1.9em; background:url(../img/template/arrow-menu-seccion-off.gif) no-repeat -0.8em bottom;}
		#bside small { display:block; color:#a19d83; font-size:1.1em; padding:0 0 0 2.7em; height:2.1em;}

	#bside ol#capitulos { margin:0;}
		#bside ol#capitulos li {  border-top:0.1em solid #a19d83; overflow:hidden; height:1.9em;}
			#bside ol#capitulos li a:link { color:#000000; padding:0 0 0 1em;font-size:1.2em; line-height:1.53em; height:100%; display:block;}
			#bside ol#capitulos li a:visited { color:#000000; padding:0 0 0 1em;font-size:1.2em; line-height:1.53em; height:100%; display:block;}
			#bside ol#capitulos li a:hover { color:#000000; padding:0 0 0 1em; background:#d9dbb9; text-decoration:none;font-size:1.2em; line-height:1.53em; height:100%; display:block;}
			#bside ol#capitulos li a:active { color:#000000; padding:0 0 0 1em;font-size:1.2em; line-height:1.53em; height:100%; display:block;}

#tooltip { position:absolute; display:block; border:1px solid #a19d83; background:#000000; font-size:1.1em; padding:5px; color:#FFFFFF; display:none;}


/****************************************
	PÁGINA ÍNDICE DE COLORES y PLANTILLAS
*****************************************/

body#index { background:#000000;}
ul#listado_colores { position:absolute; top:20%; left:50%; width:49.1em; height:12em; margin:-6em 0 0 -24.5em; overflow:hidden;}
	ul#listado_colores li { width:9.8em; height:9.8em; border:0.1em solid #FFF; float: left; overflow:hidden; margin:1em; border:0.1em solid #CCC;}
		ul#listado_colores li.uno { background:#FFFFFF;} 
		ul#listado_colores li.dos { background:#d9dbb9;} 
		ul#listado_colores li.tres { background:#a19d83;} 
		ul#listado_colores li.cuatro { background:#000000;} 

ul#listado_paginas {position:fixed; top:50%; left:60%; width:49.1em; height:12em; margin:-6em 0 0 -24.5em; overflow:hidden;}
	ul#listado_paginas li{ font-size:1.2em; line-height:1.4em;}
		ul#listado_paginas li a:link{color:#666;}
		ul#listado_paginas li a:visited{color:#666;}
		ul#listado_paginas li a:hover{color:#000; text-decoration:underline;}
		ul#listado_paginas li a:active{color:#666;}



em {  font-style: italic;}