/* ****************************************************************************************************************
 *      Web:            Microsite Rafael -                                                                        *
 *      Autor:          Ruben Manzano ruben.manzano@gmail.com                                                     *
 *      Hoja:           general.css                                                                               *
 *      Descripcion:    Diferentes técnicas fotográficas para el estudio de una obra. Museo Thyssen-Bornemisza    * 
 *      Fecha:          4/08/2009                                                                                *
 *****************************************************************************************************************/



/* ########### REINICIO DE ESTILOS

/*** HACKS PARA IE ***/

/* Si necesitas aplicarlo a IE7 utiliza este:*/
*:first-child+html {
}
/*** NEUTRALIZANDO ESTILOS:
elementos que queremos limpiar completamente: ***/
* {margin: 0; padding: 0; /*border: none;* eliminado para darle el estilo por defecto a los botones de formulario*/ }
html #cabecera, html #contenidos, html #pie { font: 62.5% Arial, Helvetica, sans-serif; /*text-shadow: #000 0px 0px 0px;Elimina el efecto bold en Safari*/ }

/*** NEUTRALIZANDO ESTILOS:
elementos con margen vertical: ***/
h1, h2, h3, h4, h5, h6, p, pre,
blockquote, ul, ol, dl, address { font-weight: normal; margin: 0; }

/*** Algunos ajustes basicos: ***/
sup { position: relative; bottom: 0.3em; vertical-align: baseline; }
sub { position: relative; bottom: -0.2em; vertical-align: baseline; }
li, dd, blockquote { margin-left: 1em; list-style: none; }

/*** LINKS: */

a, a:link, a:visited, a:hover, a:active {
outline: 0; /*Elimina la línea de puntos que aparece alrededor de los enlace al clicarlos*/ text-decoration: none;}
a img { border: none; text-decoration: none; }
img {border: none; text-decoration: none; /*Si añades un background aparecerá como fondo de la imagen, útil para imágenes de carga*/ }

/*** FORMULARIOS: ***/
/*label,*/ button { cursor:pointer; }
/*input, select, textarea { font-size: 100%;}*/
input:focus, select:focus, textarea:focus { background-color: #FFF;}
fieldset { border: none;}
/*** Algunas clases útiles: ***/
.clear {clear: both;}
.float-left {float: left;}
.float-right {float: right;}
.helvetica {font-family: Arial, Helvetica, Geneva, sans-serif;}

.estirar{ height: 1%;}
.estirar:after {clear:both; content:".";display:block; height:0pt; visibility:hidden; }

.alt{ display: none;}


/* ############ ESTILOS DEL MICROSITE */


/* genericos */

body{ background: #e7e5d9;}

div#contenedor{ text-align: center; margin: auto; width: 1028px; overflow: hidden;}

div#cabecera{ width: 1028px; height: 113px; /*background: lightBlue;*/}

	/* logo */
	
	h1{ float: left; width: 452px; height: 69px; padding: 42px 0 0 49px;}
		h1 a:link,
		h1 a:visited,
		h1 a:hover,
		h1 a:active{ width: 390px; height: 13px; display:block; }
		h1 img{ position: relative; z-index: 10; }
		h1 span{ position: relative; z-index: 1; top: -100px; font-size: 0.01em; display:block;}


	/* menu navegacion */

div#cabecera ul{ float: left; width: 435px; padding: 28px 76px 0 8px;}

	div#cabecera ul li{ text-align: left; font-size: 1.2em; border-bottom: 1px solid #acacac; margin: 0 0 4px 0;}
	
		/* estos también se aplican a los enlaces de los microsites */
		
		ul li.menuNavIzq{ float: left; clear: left; width: 214px;}
		ul li.menuNavDcha{ float: right; clear: right; position: relative; top: -39px; width: 211px; left: 19px;}
		
			ul li a:link{ color: #4f4c4d; background: url(../imagenes/fnd-flechaMenu.png) no-repeat 0px 4px; display: inline-block; padding: 0 0 0 19px;}
			ul li a:visited{ color: #4f4c4d; background: url(../imagenes/fnd-flechaMenu.png) no-repeat 0px 4px; display: inline-block; padding: 0 0 0 19px;}
			ul li a:hover{ color: #3c8599; background: url(../imagenes/fnd-flechaMenuHover.png) no-repeat 0px 4px; display: inline-block; padding: 0 0 0 19px;}
			ul li a:active{  color: #3c8599; background: url(../imagenes/fnd-flechaMenuHover.png) no-repeat 0px 4px; display: inline-block; padding: 0 0 0 19px;}
			
			ul li.activo a:link{ color: #3c8599; background: url(../imagenes/fnd-flechaMenuHover.png) no-repeat 0px 4px; display: inline-block; padding: 0 0 0 19px;}
			ul li.activo a:visited{ color: #3c8599; background: url(../imagenes/fnd-flechaMenuHover.png) no-repeat 0px 4px; display: inline-block; padding: 0 0 0 19px;}
			ul li.activo a:hover{ color: #3c8599; background: url(../imagenes/fnd-flechaMenuHover.png) no-repeat 0px 4px; display: inline-block; padding: 0 0 0 19px;}
			ul li.activo a:active{ color: #3c8599; background: url(../imagenes/fnd-flechaMenuHover.png) no-repeat 0px 4px; display: inline-block; padding: 0 0 0 19px;}
			
	/* contenidos */
	
	div#contenidos{ background: #fff; height: 472px; width: 1028px; clear: both; text-align: left; overflow: hidden;}
	
		div#flash{ width: 458px; height: 47.2em; float: left;}
		
		div#textos{ height: 47.2em; width: 472px; float: left;}
		
		
	/* pie */
	
	div#pie{ clear: both; text-align: left; padding: 30px 0 0 0;}
	
	
		/* creditos */
	
		div#copy{ width: 400px; float: left; padding: 0 0 0 58px;}
			
			div#copy p{ color: #000; font-size: 1.2em; letter-spacing: 0.1px;}
			
			div#copy ul li{ display: inline; color: #7f7f7f; margin: 0; padding: 0; font-size: 1.1em;}
			
			
		/* menu microsite */
	
		div#microsites{ width: 464px; float: left; padding: 0 0 0 58px;}
	
			div#microsites h2{ background: url(../imagenes/fnd-encabezadoPie.png) no-repeat; width: 458px; height: 60px; text-indent: -9999px; position: relative; top: -5px; left: -2px; }
			div#microsites p{ width: 115px; background: transparent url(../imagenes/fnd-flechaMenu.png) no-repeat scroll 0 4px; padding:0 0 0 19px; float: left; font-size: 1.3em; color: #000; margin: 0 0 0 26px;}
				
			div#microsites ul{ float: right; width: 275px; position: relative; top: 38px;}
				
				div#microsites ul li{ text-align: left; font-size: 1.2em; border-bottom: 1px solid #acacac; margin: 0 0 4px 0;}
				div#microsites ul li.menuNavDcha{ width: 257px; float: none; left: -8px; top: -37px;}
				
					div#microsites ul li a span{ text-transform: uppercase;}
		
		
/* ########## HOME */

	div#textosHome{ height: 47.2em; width: 514px; float: left; padding: 0 0 0 56px;}
	
		div#textosHome h2{ width: 379px; height: 130px; background: url(../imagenes/fnd-tituloHome.png) no-repeat; text-indent: -9999px; position: relative; top: 227px;}
	
		div#textosHome ul{ position: relative; top: 257px;}
			div#textosHome ul li.organiza{ font-size: 1em; color: #7f7f7f; margin: 0; padding: 0; }
			div#textosHome ul li.fechas{ font-size: 1.5em; color: #333; margin: 0; padding: 0; font-weight: normal;}
			
			
/* ########## INTERIORES */

	div#textosInterior{ padding: 114px 0 0 0; height: 35.8em;}
	
		div#colIzquierda{ padding: 0 0 0 56px; float: left;  width: 214px;}
		
			div#colIzquierda h2{ background: url(../imagenes/fnd-flechaEncabezado.png) no-repeat; height: 26px; padding: 26px 0 22px 0; border-bottom: 1px solid #e5e6e1; letter-spacing: -0.3px; font-size: 1.5em;}
			
				div#textosInterior p{ margin: 17px 0 0 0; color: #a6a6a6; font-size: 1.1em;}
				
				
		div#colDerecha{ float: right; width: 220px; padding: 10px 51px 0 0;}
		
		p.textoRediografia{ padding: 96px 0 0 0;}
		
		
		/* listas en introducción */
		
			#colIzquierda h2.h2Intro{ padding-bottom: 0; margin: 0; border-bottom: none; height: auto;}
					
					div#colIzquierda ul{ margin-bottom: 40px;}
					
					div#colIzquierda ul li{ color: #7f7f7f; margin: 0; padding: 0}
					
					div#colIzquierda li.modoEncabezado{ font-size: 1.4em; color: #000; font-style: italic;}
		
					div#colDerecha ul{ padding: 13px 0 0 0;}
		
					
					div#colDerecha ul li a:link{ color: #3c8599; font-size: 1.2em; text-decoration: underline; font-size: 1.1em; background: transparent url(../imagenes/fnd-flechaMenuIntro.png) no-repeat scroll 0 4px;}
					div#colDerecha ul li a:visited{ color: #3c8599; font-size: 1.2em; text-decoration: underline; font-size: 1.1em; background: transparent url(../imagenes/fnd-flechaMenuIntro.png) no-repeat scroll 0 4px;}
					div#colDerecha ul li a:hover{ color: #4f4c4d; font-size: 1.2em; text-decoration: underline; font-size: 1.1em; background: transparent url(../imagenes/fnd-flechaMenuIntroHover.png) no-repeat scroll 0 4px;}
					div#colDerecha ul li a:active{ color: #3c8599; font-size: 1.2em; text-decoration: underline; font-size: 1.1em; background: transparent url(../imagenes/fnd-flechaMenuIntro.png) no-repeat scroll 0 4px;}