/* Hoja de estilo de la web del Instituto Oftalmológico */
/* Ultima actualización 8 de Abril de 2010 */


/*-------------------------------------------    
    Estructura
-------------------------------------------*/

* {
	margin: 0;
	padding: 0;
}


body {
	color: #000;
	background-color: #fff;
	font: normal 62.5% Verdana, Geneva, sans-serif;
}

img {
	border: 0;
}

a, a:visited {
	color: #000;
}

a:hover, a:focus {
	color: #c70b0c;
}

#envoltorio {
	margin: 3em auto;
	width: 75em;
}

#envoltorio.portada {
	border: solid 1px #898989;
	width: 798px;
}

#envoltorio.construccion {
	margin: 3em auto;
}

#izda {
	float: left;
	width: 22em;
}

#dcha {
	float: right;
	width: 49em;
	border-left: 1px dashed #999999;
	padding: 0 0 0 3em;
	min-height: 75em;
}

ul {
	list-style: none;
}

ul li {
	display: block;
	float: left;
}

ul li a {
	text-decoration: none;
	display: block;
}

.oculto {
	position: absolute;
	top: -999em;
	text-indent: -999em;
}

.aclarar {
	clear: both;
}


/*-------------------------------------------    
    Portada
-------------------------------------------*/

#logo_portada {
	height: 20.5em;
}

h1 {
	height: 9em;
	font-size: 1.1em;
	display: block;
	position: relative;
	top: 4em;
	width: 13.5em;
	margin: 0 auto;
}

#logo_portada h1 span {
  	background: transparent url("../imagenes/logo_portada.gif") no-repeat left top;
	height: 100%;
	width: 100%;
	position: absolute;
	left: 0;
	top: 0;
}

#menu_portada ul li {
	width: 50%;
}

#menu_portada ul li a {
	font-weight: bold;
	color: #fff;
	text-align: center;
	padding: 1.5em 0;
	font-size: 1.1em;
	height: 100%;
}

#menu_portada ul li a:hover {
	text-decoration: none;
}

#menu_portada ul li a#mp1 {
	background-color: #0177c1;
}

#menu_portada ul li a#mp2 {
	background-color: #fc7217;
}

#menu_portada ul li a#mp3 {
	background-color: #7da21e;
}

#menu_portada ul li a#mp1:hover, #menu_portada ul li a#mp2:hover, #menu_portada ul li a#mp3:hover {
	background-color: #8b8b8b;
}

#naranja {
	background-color: #fc7217;
	color: #fff;
}

#naranja p {
	font-weight: bold;
	font-size: 1.1em;
	width: 30em;
	margin: 0 auto;
	padding: 1em 0 4em;
	display: block;
	text-align: center;
}

#naranja p a {
	color: #fff;
	text-decoration: none;
}

#naranja p a:hover {
	color: #000;
}

#logo_construccion {
	padding: 10em 0 0;
	height: 25em;
}

#logo_construccion h1 {
	height: 11em;
	width: 16em;
}

#logo_construccion h1 span {
  	background: transparent url("../imagenes/logo_construccion.gif") no-repeat left top;
	height: 100%;
	width: 100%;
	position: absolute;
	left: 0;
	top: 0;
}

#copy {
	clear: both;
	height: 13em;
}

#copy p {
	color: #898989;
	padding: 11em 0 0 27em;
}

#envoltorio.construccion #copy p {
	padding: 3em 0 0 25em;
}


/*-------------------------------------------    
    Menú y Home
-------------------------------------------*/

#logo {
	height: 20.5em;
}

#logo h1 span {
  	background: transparent url("../imagenes/logo.gif") no-repeat left top;
	height: 100%;
	width: 100%;
	position: absolute;
	left: 0;
	top: 0;
	cursor: pointer;
}

#menu {
	width: 18em;
	margin: 0 0 0 2em;
}

#menu dl dt {
	text-align: right;
	margin: 0 auto;
	padding: 0.4em 1em;
	border-bottom: 1px solid #999999;
}

#menu dl dt a, #herramientas ul li a {
	font-weight: bold;
	font-size: 1.1em;
	text-decoration: none;
}

#menu dl dd {
	text-align: right;
	margin: 0 auto;
	padding: 0.4em 1em;
	border-bottom: 1px dotted #999999;
}

#menu dl dt a, #menu dl dd a {
	text-decoration: none;
}

#menu dl dt a.actual, #menu dl dd a.actual {
	color: #c70b0c;
	text-decoration: none;
}

#herramientas {
	margin: 3em 0 2em 7em;
}

#herramientas ul li {
	float: none;
	margin: 0 0 0.8em 0;
}

#herramientas ul li a {
	padding: 0 0 0 2em;
}

#herramientas ul li a.mas {
  	background: transparent url("../imagenes/mas.gif") no-repeat left top;
	height: 1.3em;
}

#herramientas ul li a:hover.mas {
  	background-position: left bottom;
}

#herramientas ul li a.menos {
  	background: transparent url("../imagenes/menos.gif") no-repeat left top;
	height: 1.2em;
}

#herramientas ul li a:hover.menos {
  	background-position: left bottom;
}

#izda img {
	margin: 0 0 0 6em;
}

h2 {
	text-transform: uppercase;
	color: #0066cc;
	font-size: 1.1em;
	padding: 2em 0 1em;
}

div.evento {
	line-height: 1.3;
	border-bottom: 1px dashed #0066cc;
	padding: 1em 0;
}

div.evento strong {
	display: block;
}

div.evento a {
	float: right;
	position: relative;
	top: -1em;
	color: #0066cc;
	text-decoration: none;
}

div.evento a:hover {
	color: #c70b0c;
}

div.fondo {
	background-color: #ffffdc;
}

/*-------------------------------------------    
    Secciones
-------------------------------------------*/

#grupo_fotos {
	float: right;
	margin: 0 0 1.7em 2em;
}

#grupo_fotos img {
	display: block;
	margin: 0 0 0.7em;
}

p {
	padding: 0 0 1em;
}

#dcha p a, #dcha strong a {
	color: #fa7317;
	text-decoration: none;
}

#dcha p a:hover, #dcha p a:focus, #dcha strong a:hover {
	text-decoration: underline;
}

h2.organiza {
	margin: 3em 0 0 10em;
}

h3 {
	margin: 0 0 0 10em;
	font-size: 1.1em;
}

h2.informacion {
	margin: 2em 0 0 0;
}

h3.informacion {
	margin: 0 0 1em;
	font-size: 1.1em;
	color: #0066cc;
}

div.ficha_medico {
	margin: 1em 0 2em 0;
	border-bottom: 1px dashed #0066CC;
	padding: 0 0 2em;
	width: 50em;
	min-height: 11em;
}

div.ficha_medico.ultimo {
	border-bottom: none;
}

div.ficha_medico img {
	float: left;
}

div.ficha_medico div {
	margin: 0 0 0 11em;
}

div.ficha_medico strong {
	color: #0066CC;
	font-size: 1.1em;
}

div.ficha_medico ul {
	list-style-type: disc;
	padding: 1em 0 0 1.3em;
}

div.ficha_medico ul li {
	float: none;
	display: list-item;
	font-size: 1em;
}

ul.lista_enlaces {
	list-style-image: url("../imagenes/flecha_azul.gif");
	margin: 2em 0 0 12.3em;
}

ul.lista_enlaces li {
	float: none;
	display: list-item;
	margin: 0 0 0.5em;
}

ul.lista_enlaces li a {
	color: #0066CC;
	margin: 0 0 0 -0.5em;
}

ul.lista_enlaces li a:hover {
	color: #c70b0c;
}

span.fecha {
	display: block;
	color: #666;
}

strong.noticia {
	display: block;
	padding: 0 0 1em;
}

a.volver {
	color: #0066CC;
  	background: transparent url("../imagenes/flecha_azul_i.gif") no-repeat left 0.3em;
	padding: 0 0 0 0.8em;
	display: block;
	font-weight: bold;
}

a.volver:hover, a.volver:focus {
	color: #c70b0c;
}

dl.eventos {
	margin: 0 0 2em 2em;
}

dl.eventos dt {
	font-weight: bold;
}

dl.eventos dd {
	margin: 0 0 0.5em 2em;
}

.linea_inferior {
	border-bottom: 1px dashed #0066CC;
	margin: 0 0 1em;
	padding: 0 0 1em;
}

ul.revistas li {
	margin: 0 1.5em 1em 0;
}

ul.revistas li span {
	font-weight: bold;
	margin: 0 0 0.5em;
	display: block;
	color: #0066CC;
}

address {
	font-style: normal;
}

iframe {
	 margin: 0 0 1em;
}
/*-------------------------------------------    
    Información
-------------------------------------------*/

h4 {
	margin: 1em 0 1.2em;
	font-size: 1.1em;
}

dl.preguntas {
	list-style-type: disc;
}

dl.preguntas dt {
	display: list-item;
	margin: 0 0 0 1.3em;
}

dl.preguntas dt a {
	color: #0066cc;
	text-decoration: none;
}

dl.preguntas dt a:hover {
	color: #C70B0C;
}

dl.preguntas dd {
	border-top: 1px dashed #0066CC;
	border-bottom: 1px dashed #0066CC;
	padding: 0.6em 3em;
	margin: 0.6em 0;
}

img.izquierda {
	float: left;
	padding: 0 1em 1em 0;
}

img.centrar {
	padding: 0 0 1em;
}

ul.doble {
	margin: 0 0 2em;
}

ul.doble li {
	margin: 0 0 0.5em 2em;
	float: none;
}

ul.doble li ul {
	margin: 0.5em 0 0;
}

ul.doble li ul li a {
	text-decoration: underline;
}

ul.lista_imagenes li {
	margin: 0.5em 1.7em;
}

h5 {
	font-size: 1.1em;
	margin: 1em 0 1.2em;
}

/*-------------------------------------------    
    Formulario
-------------------------------------------*/

#formulario {
}

#formulario fieldset {
	border-bottom: 1px dashed #0066CC;
	border-top: none;
	border-left: none;
	border-right: none;
	padding: 0 0 1em;
	margin: 0 0 1em;
	width: 48em;
}

#formulario fieldset.ultimo {
	border-bottom: none;
	border-top: none;
	border-left: none;
	border-right: none;
}

#formulario legend {
	text-indent: 0;
	position: relative;
	font-size: 1em;
	font-weight: bold;
	margin: 0 0 1em;
}

#formulario legend.oculto {
	position: absolute;
	top: -999em;
	text-indent: -999em;
}

#formulario legend span {
	font-size: 0.9em;
	font-weight: normal;
}

#formulario label {
	width: 13em;
	display: block;
	float: left;
	margin: 0.5em 1em 0.5em;
	text-align: right;
}

#formulario label.seleccionar {
	width: 42em;
	display: block;
	float: none;
	margin: 0;
	padding: 0.6em 0;
	text-align: left;
	height: 2em;
}

#formulario input {
	margin: 0.5em 0;
	width: 22em;
}

#formulario input.enviar {
	margin: 0.5em 0;
	width: 5em;
	border: 0;
	color: #0066CC;
  	background: transparent url("../imagenes/flecha_azul.gif") no-repeat left 0.4em;
	font-weight: bold;
	cursor: pointer;
	margin: 0 0 2em 14em;
}

#formulario input.enviar:hover {
	color: #C70B0C;
}

#formulario input#perdida, #formulario input#moscas, #formulario input#ondulaciones, #formulario input#consulta, #formulario input#correccion {
	width: 2em;
	float: left;
	margin: 0;
	height: 2em;
}

#formulario textarea {
	margin: 0.5em 0;
	width: 37em;
	height: 10em;
}

table {
	width: 44em;
	border-collapse: collapse;
	margin: 0 auto;
}

table th {
	width: 20em;
}

table th.corto {
	width: 11em;
}

table td {
	text-align: center;
	border-bottom: 1px dashed #888;
}

table td.ultimo {
	border-bottom: none;
}

table td.col_nombre {
	text-align: left;
}

#formulario table input {
	width: 2em;
}





/*-------------------------------------------    
    Pie
-------------------------------------------*/

#pie {
	clear: both;
	margin: 0 0 0 6em;
	width: 70em;
	position: relative;
	top: 4em;
}

#franja_colores {
  	background: transparent url("../imagenes/franja_pie.gif") no-repeat left top;
	height: 2em;
}

#pie p, #pie a {
	text-align: right;
	color: #666;
}

#pie a:hover {
	color: #c70b0c;
}