@import url('reset.css');
@import url('base.css');

/*
	OTROS ESTILOS GENÉRICOS
*/


body {
	background-color: #6e7f4d;
	font-family: Geneva, Arial, Helvetica, sans-serif;
	line-height: 1;
}


/*
	ATAJO ES EL ENLACE DE SALTAR AL CONTENIDO PARA MEJORAR LA ACCESIBILIDAD.
	QUEREMOS QUE NO ESTÉ VISIBLE POR LO QUE LE PONEMOS DEL MISMO COLOR QUE EL FONDO.
*/
#atajo {
	font-size: xx-small;
	color: #6e7f4d;
}

/*
	ESTA CAPA SE UTILIZA PARA CENTRAL TODO EL CONTENIDO DE LA PÁGINA HORIZONTALMENTE
*/
#centrador {
	width: 800px;
	margin: 0 auto;
	text-align: center;
}

/*
	ESTILOS DEL ENCABEZADO
*/
#encabezado {
	width: 707px;
	height: 147px;
	background-image: url('./img/fondo-encabezado.jpg');
	background-repeat: no-repeat;
	text-align: left;
	padding-left: 46px;
	padding-right: 47px;
}

#encabezado img {
	/* MEJOR CON IDENTIFICADOR ÚNICO. CORREGIR */
	float: left;
	width: 173px;
	height: 147px;
}


/*
	ESTILOS DE LA BARRA DE BÚSQUEDA
*/

#barra {
	width: 800px;
	height: 46px;
	background-image: url('./img/barra.jpg');
	text-align: left;
}

#barra a, #barra span {
	display: inline;
	float: left;
	margin-top: 15px;
	margin-left: 46px;
	width: 173px;
	text-align: center;
	text-transform: uppercase;
	text-decoration: none;
	font-size: x-small;
	font-weight: bolder;
	color: #ffc;
}

#barra a:hover {
	color: #fff;
	text-decoration: none;
}

#barra input {
	float: left;
	margin: 10px 20px 10px 0px;
}

#barra #buscador {
	width:400px;
}

/*
	ESTILOS DE LA PÁGINA: INCLUYE EL PANEL, EL MENÚ Y LOS CONTENIDOS DE CADA PÁGINA
*/
#pagina {
	background-image: url('./img/fondo-pag.jpg');
	background-repeat: repeat-y;
	width: 800px;
	text-align: justify;
	margin: 0;
}

#pagina a {
	color: #039;
	text-decoration: none;
}

#pagina a:hover {
	text-decoration: underline;
}


/* 
	ESTILOS DEL PANEL:
	EL PANEL ES EL CONTENEDOR FLOTANTE DE LA IZQDA, DONDE AHORA SÓLO ESTÁ EL MENÚ.
	ESTÁ SEPARADO PARA PODER AÑADIR MÁS ELEMENTOS CON OTROS ESTILOS DISTINTOS AL DEL MENÚ
*/
#panel {
	display: inline; 
	padding:0;
	margin: 0px 10px 5px 46px;
	width: 172px;
	float: left;
	text-align: left;
}

#panel .destacado {
	width: 100%;
	background-color: #ffe;
	border: 1px solid #6e7f4d;
	margin: 5px 0px 0px 0px;
	font-size: x-small;
	color: #000;
}

#pagina #panel p {
	width: 100%;
	padding: 5px 5px 5px 5px;
}

/*
	ESTILOS DEL MENÚ
*/
#menu {
	width: 100%;
	
	border-bottom: 1px solid #6e7f4d;
	border-right: 1px solid #6e7f4d;
	background-color: #ecefe6;

	font-size: small;
	font-style: italic;
	color: #8C8ABB;
}

#menu a {
	text-decoration: none;
	text-align: left;
	font-size: small;
	font-style: italic;
	color: #8C8ABB;
}

#menu a strong{
	display: block;
	color: #039;
	font-size: small;
	font-weight: bold;
	font-style: normal;
}

#menu a:hover {
	color:black;
	text-decoration: none;
}

#menu li, #pagina #menu ul {
	padding: 5px 5px 5px 5px;
	list-style-type: none;
	margin: 0;
}

/*
	ESTILOS DEL CONTENIDO DE LA PÁGINA
*/

#contenidos {
	margin: 0px 46px 5px 47px;
	padding: 15px 15px 15px 15px;
}

#contenidos #derecha {
	width: 510px;
	display: inline; 
	float: right;
	margin: 0;
}

#contenidos p {
	padding: 5px 10px 5px 10px;
}

/*
	TABLAS
*/

#contenidos table {
	border: 1px solid #999;
	margin: 0 auto;
}

.impares {
	background-color:#D7EBFF;
}

.pares {
	background-color:#ffffff;
}

#contenidos td, #contenidos th {
	padding: 10px 10px 10px 10px;
	border: 1px solid #999;
	vertical-align: middle;
}

#contenidos div .encerrao {
	margin: 0 auto;
	width: 700px;
	height: 300px;
	overflow: auto;
}

#contenidos h1 {
	font-size: xx-large;
	border-bottom: 3px solid #6e7f4d;
	text-align: right;
	padding: 0px 20px 10px 20px;
	margin: 0px -15px 0px 0px;
}

#contenidos h2 {
	font-size: x-large;
	border-bottom: 2px solid #6e7f4d;
	border-top: 1px solid #6e7f4d;
	background-color: #ecefe6;
	text-align: right;
	padding: 10px 30px 10px 30px;
}

#contenidos h3 {
	font-size: large;
	border: 1px solid #6e7f4d;
	background-color: #ecefe6;
	text-align: left;
	margin: 10px 20px 10px 20px;
	padding: 10px 30px 10px 30px;
}

#contenidos .derecha {
	display: inline; 
	float: right;
	margin: 2px 8px 2px 5px;
}


#contenidos .izquierda {
	display: inline; 
	float: left;
	margin: 2px 5px 2px 8px;
}

#contenidos .resaltado {
	background-color: #ecefe6;
	color: #039;
	border: 2px solid #039;
}

#contenidos .resaltado p strong, #contenidos .resaltado p strong {
	margin-left: -5px;
}

/*
	LA ETIQUETA HR SE UTILIZA PARA SOLVENTAR LOS PROBLEMAS CON LOS ELEMENTOS
	FLOTANTES COMO EL MENÚ
*/
#pagina hr {
	margin: 0;
	padding: 0;
	clear: both;
	visibility: hidden;
}

#contenidos .resaltado h2, #contenidos .resaltado h3 {
	margin: 0;
	padding: 5px 5px 5px 5px;
	font-size: large;
	border-bottom: 5px solid #039;
	border-top: 0;
	border-left: 0;
	border-right: 0;
	background-color: #eef;
	text-align: center;
}

#contenidos img {
	display: block;
	padding: 5px 5px 5px 5px;
	/*border: 1px solid #000;*/
	margin: 5px 5px 10px 5px;
}

#contenidos ul.sinpunto li{
	list-style-type:none;
}

/*
	ESTILOS DEL PIE DE PÁGINA
*/

#pie {
	background-image: url('./img/pie.jpg');
	background-repeat: no-repeat;
	width: 800px;
	height: 131px;
	margin: -10px auto;
	clear: both;
}


#pie ul {
	padding: 10px 46px 10px 46px;
	margin: 0;
}


#pie li {
	display: block;
	padding: 0px 10px 0px 10px;
	float:right;
}

#pie a {
	color: #fff;
	font-weight: bold;
	font-size: small;
}

#pie img {
	height: 90px;
}

/*
	ESTILOS DE LOS FORMULARIOS DE LA PÁGINA.
	QUIZÁS CONVENDRÍA SEPARARLO EN OTRA HOJA DE ESTILO.
*/
#contenidos form {
	width: 507px;
	text-align: left;
	background-color: #E1E0ED;
	border-left: 1px solid #039;
	border-right: 2px solid #039;
	border-bottom: 2px solid #039;
}

#contenidos form ol li {
	list-style-type:none;
}

#contenidos form em {
	font-weight: bolder;
	color: #CC0000;
}

#contenidos form p {
	text-align: justify;
	font-size: small;
}

#contenidos form legend {
	font-weight: bold;
	padding: 10px 10px 10px 10px;
}

#contenidos form textarea, #contenidos form input, #contenidos form select { 
	width: 435px; 
	color: #063;
	margin-bottom: 10px;
	display: block;
}

#contenidos form textarea {
	height: 200px;
}

#contenidos form input:focus, #contenidos form textarea:focus { 
	color: #000; 
	background-color: #ecefe6;
}

#contenidos form input.checkbox, #contenidos form label.checkbox {
	display:inline; 
	width: auto;
}

#contenidos form .centrado {
	text-align: center;
	width: 100px;
	margin: 0 auto;
}

#contenidos form .centrado input {
	width: auto;
	font-weight: bold;
}

.guarnin {
	color: #f00;
}

/*
	ESTILOS DE LOS MENSAJES DE VALIDACIÓN CON VALIDATOR.JS
	AHORA ES SÓLO UN COPY/PASTE DEL BUZÓN.
*/

form.validable .errorvalidacion {
	border: solid 3px #900;
}

form.validable .okvalidacion {
	border: solid 3px #090;
}

form.validable .avisovalidacion {
	text-align: right;
	color: #900;
	font-size: 0.75em;
	font-weight: bolder;
	margin: 0;
	padding: 2px 10px 2px 10px;
}

/* GALERIAS */

#contenidos ul.galeria {
	padding: 15px 75px 15px 75px;
	margin: 0 auto;
	text-align: center;
}

#contenidos ul.galeria li {
	width: 20%;
	height: 100px;
	text-align: center;
	vertical-align: middle;
	list-style-type: none;
	float:left;
}

#contenidos ul.galeria img {
	margin: 0 auto;
}

/* TABLA HORARIO */

table.horario {
	width:80%;
	text-align:center;
	font-size:80%;
}

table.horario caption {
	font-size: 150%;
	font-weight: bold;
	margin: 5px;
}

table.horario th {
	background-color: #eef;
	color:#039;

}

table.horario td {
	background-color: #ecefe6;
}

/* AGENDA */

#contenidos .actividad, #contenidos .actividad_desarrollada {
	border:2px dotted;
	border-color:#CCCCCC;
	display:	block;
	min-height:120px;
}

#contenidos .actividad h4 {
	padding:0px 10px 10px 10px;
	right:	0px;
	text-align:center;
	font-size:125%;
	/*border:2px solid;*/
}

#contenidos .actividad_desarrollada h2 {
	padding:10px 10px 10px 10px;
	border:0;
	margin:0;
	text-align:center;
	font-size: large;
	color: #039;
	/*border:2px solid;*/
}

#contenidos .textoPlazo {
	color: #030;
	border-bottom:1px dotted #030;
	background-image:url('./img/calendario.jpg');
	background-position:right;
	background-repeat: no-repeat;
	vertical-align:middle;
	min-height: 50px;
	margin: 5px 5px 5px 105px;
	padding: 20px 75px 5px 5px;
	text-align: center;
}

#contenidos .documentos_adicionales {
	margin: 0px 10px 5px 10px;
	padding: 20px 20px 20px 20px;
	border: 1px dotted #039;
	background-color:#DBDAE9;
}

#contenidos .actividad .informacion {
	padding:10px 10px 10px 10px;
	vertical-align:middle;
}

#contenidos .actividad a img {
	float:left;
	left:0px;
	border:0px;
	max-height:100px;
	max-width:100px;
}


/* EXPOSICIONES Y CATALOGOS */

#contenidos img.minivertical {
	display: inline;
	border:0px;
	max-height:150px;
	max-width:175px;
}

#contenidos img.minihorizontal {
	display: inline;
	border:0px;
	max-height:175px;
	max-width:150px;
}

.texto {
	background-color:#E7E8AA;
	border: 1px solid;
}

#contenidos .texto h3 {
	font-size: large;
	border: 7px;
	background-color:#E7E8AA;
	text-align: center;
	margin: 10px 20px 10px 20px;
	padding: 10px 30px 10px 30px;
}

.texto br {
	line-height:15px;
	margin-bottom:10px;
}

.obra {
	margin: 0 auto;
	text-align: center;
}

.obra .descripcion {
	margin: 0 auto;
	width:80%;
	background-color:#DEDEDE;
	font-size:80%;
	text-align:center;
	border: 1px solid;
}

/*element selectors { background: #fff url(blah.jpg) no-repeat fixed 10px 20px; }*/

#portada_paginas_agua {
background:url(../includes/expocatalog/paginasdeagua/imagenes/texturafondoagua.jpg);
background-color:#FFFFFF;
background-repeat:no-repeat;
background-position:center;
}

#portada_arboles_cuento {
background: url(../includes/expocatalog/arbolescuento/imagenes/textura1.jpg);
background-color:#FFFFFF;
background-repeat:no-repeat;
background-position:center;
}


.enlacehtml {
font-size:90%;
/*font-weight: bold;*/
background: url(img/link_icon.gif) no-repeat left center;
padding-left: 25px;
}

.enlacepdf {
font-size:90%;
/*font-weight: bold;*/
background: url(img/acrobatreader.gif) no-repeat left center;
padding-left: 25px;
}

.centrar_mapa {
text-align:center
}



.nav_bar {
	text-align:center;
}

.nav_msg {
font-size:small;
}

.warning-msg{
/*max-width:70%;*/
border:solid 1px #DEDEDE;
background:#FFFFCC url(img/24-message-info.png) no-repeat;
background-position:left;
color:#222222;
padding:4px 4px 4px 28px;
margin:5px 5px 5px 5px;
text-align:center;
display:block;
}

.error-msg{
max-width:70%;
border:solid 1px #CF2027;
background:#F6CBCA url(img/24-em-cross.png) no-repeat;
background-position:left;
/*color:#CF2027;*/
padding:4px 4px 4px 28px;
margin:5px 5px 5px 5px;
text-align:center;
display:block;
}

.ok-msg{
max-width:70%;
border:solid 1px #758939;
background:#EEF4D4 url(img/24-em-check.png) no-repeat;
background-position:left;
/*color:#758939;*/
padding:4px 4px 4px 28px;
margin:5px 5px 5px 5px;
text-align:center;
display:block;
}

.return_msg {
background: url(img/24-arrow-previous.png) no-repeat left center;
padding-left: 25px;
text-align: center;
background-color:#E8E8E8;
padding:4px 4px 4px 28px;
border:1px solid #999999;
margin:5px 5px 5px 5px;
display:block;
}

.down_msg {
background: url(img/24-em-down.png) no-repeat left center;
padding-left: 25px;
text-align: center;
background-color:#E8E8E8;
padding:4px 4px 4px 28px;
border:1px solid #999999;
margin:5px 5px 5px 5px;
display:block;
}

.up_msg {
background: url(img/24-em-up.png) no-repeat left center;
padding-left: 25px;
text-align: center;
background-color:#E8E8E8;
padding:4px 4px 4px 28px;
border:1px solid #999999;
margin:5px 5px 5px 5px;
display:block;
}

/*
#contenidos .actividad a h4 {
vertical-align:middle;
}
*/