﻿/* Selector universal: establecer un tamaño uniforme para todos los elementos */
* {
	font-size: 100%;
	margin: 0;
	padding: 0;
}

html {
	width: 100%;
	min-width: 960px;
	background-color: transparent;
	}

body {
	font: 100%/150% "Trebuchet MS", "Lucida Grande", "Bitstream Vera Sans", Arial, Helvetica, sans-serif;
	color: #000;
/* alinear al centro de la pantalla para IE5 */
	text-align:center;
/* Utilizar una imagen distinta para que no haya problemas con las imágenes transparentes en IE, ya que el código JS inutiliza los enlaces sobre la imagen de fondo */
	background: #fff url(../img/fondo_suave.png) 50% 0 repeat !important;
	background: #fff url(../img/fondo_suave.jpg) 50% 0 repeat;
	}

/* Capas: definición de las capas, posición, colores e imágenes de fondo */

#contenedor {
	width: 960px;
	margin: 10px auto 0 auto;
/* alinear nuevamente los elementos */
	text-align:left;
	position: relative;
}

#encabezado {
	background: transparent url(../img/cabecera.png) no-repeat 0 0 !important;
	background: transparent url(../img/cabecera.jpg) no-repeat 0 0;
	text-align: left;
	min-height: 246px;
	margin: 0 0 8em 0;
	color: #bb2769;
}

#menu {
	position: absolute;
	top: 240px;
	right: 0;
	width: 960px;
	height: 2.5em;
	min-height: 90px;
	line-height: 100%;
	background-color: #4c82b9;
	color: #FFFFFF;
	padding: 0 0 10px 0;
	visibility: visible;
}

#contenido {
	background: transparent url(../img/blanco_t.png) repeat 0 0;
	/* 3/4 de la pantalla */
	width: 630px;
	text-align: left;
	float: left;
	padding: 10px;
	margin: 0 0 2em 0;
	background-color: #FFFFFF;
	border: 1px solid #bb2769;
}

#lateral {
	width: 280px;
	float: right;
	font-size: 0.8em;
	padding: 10px 0 10px 0;
}

#pie {
	clear: both;
	padding: 2em 0 0;
	font: normal normal normal 80%/100% "Trebuchet MS", "Lucida Grande", Verdana, Tahoma, Arial, Helvetica, sans-serif;
	color: #fff;
	background: transparent url(../img/pie.png) 0 0 repeat-x;
}

#completa {
	margin: auto;
}

.mono {
	width: 90%;
	margin: 1em auto;
	border: 1px #BB2769 solid;
}

.mono h4 {
	background-color: #E98BB5;
	color: #BB2769;
	font-variant: normal;
	font-weight: bold;
	padding: 5px;
}

.mono p {
	padding: 0 5px;
}

.mono form {
	text-align: center;
	margin: auto;
}

.mono input.control {
	text-align: center;
	width: 50%;
	margin: 1em;
	background-color: #BB2769;
	color: #fff;
	border: 1px solid #fff;
	padding: 10px;	
}

.sesabierta {
	margin: 0.5em 2em;
}

.sesabierta input.control {
	text-align: center;
	background-color: #4c82b9;
	color: #fff;
	border: 1px solid #000;
	padding: 2px 5px;
}

.opcion {
	color: #4c82b9;
}

.opcion .frase {
	font-size: 2em;
}

.opcion ul {
	list-style-type: none;
	width: 960px;
}

.opcion li {
	float: left;
	display: block;
	width: 270px;
	margin: 20px;
	text-align: center;
}

.opcion ul li a {
	display: block;
	padding: 20px 0;
}

.opcion a:link, .opcion a:visited {
	text-decoration: none;
	border: none;
}

.opcion a:hover, .opcion a:active {
	display: block;
	text-decoration: none;
	border: none;
	background-color: #d4e6f4;
}

/* Elementos del encabezamiento: El título se oculta a la pantalla pero en impresión deberá mostrarse */

#encabezado h1 {
	padding: 50px 0 0 0;
	font: normal small-caps normal 3.2em/80% "Trebuchet MS", "Lucida Grande", Verdana, Tahoma, Arial, Helvetica, sans-serif;
	display: none;
}

#encabezado p {
	padding: 7em 0 2em 0;
	font: normal small-caps normal 1.6em/100% "Trebuchet MS", "Lucida Grande", Verdana, Tahoma, Arial, Helvetica, sans-serif;
}

/* Elementos de los menús principal y de cambio de idioma */

#menuPrincipal {
	position: relative;
	top: 2em;
}

#menuPrincipal ul {
	list-style-type: none;
	margin: 0;
	padding: 10px 20px 0 10px;
}

#menuPrincipal li {
	float: left;
	margin: 0 10px 0 0;
	font-size: 1.2em;
}

#menuPrincipal li ul {
	position: absolute;
	top: 2.6em;
	left: 0;
	width: 940px;
	list-style-type: none;
	margin: 0;
	padding: 0 10px;
	background-color: #99cc00;
	visibility: visible;
}

#menuPrincipal ul li ul li {
	float: left;
	margin: 0 5px;
	font-size: 0.8em;
	font-weight: bold;
}

li.actual {
	background-color: #99cc00;
	color: #FFFFFF;
	padding: 10px;
	border-top-width: 5px;
	border-top-style: solid;
	border-top-color: #ccff66;
}

ul li ul li.actual {
	background-color: #99cc00;
	color: #000;
	padding: 10px;
	border: none;
}

#menuPrincipal a {
	display: block;
	text-decoration: none;
	padding: 10px;
	text-decoration: none;
	border: none;
}

#menuPrincipal a:link {
	display: block;
	color: #fff;
	background-color: transparent;
	border-top: 5px solid #d5e2ef;
}

#menuPrincipal a:visited {
	display: block;
	color: #ffffff;
	background-color: transparent;
	border-top: 5px solid #99cc00;
}

#menuPrincipal a:hover {
	display: block;
	color: #99cc00;
	background-color: #ccff66;
	border-top: 5px solid #99cc00;
}

#menuPrincipal a:active {
	display: block;
	color: #99cc00;
	background-color: #ccff66;
	border-top: 5px solid #99cc00;
}

#menuPrincipal ul li ul li a {
	display: block;
	text-decoration: none;
	padding: 10px;
}

#menuPrincipal ul li ul li a:link {
	display: block;
	color: #FFFFFF;
	border: none;
}

#menuPrincipal ul li ul li a:visited {
	display: block;
	color: #ffffff;
	border: none;
}

#menuPrincipal ul li ul li a:hover {
	display: block;
	color: #99cc00;
	background-color: #ccff66;
	border: none;
}

#menuPrincipal ul li ul li a:active {
	display: block;
	color: #99cc00;
	background-color: #ccff66;
	border-top: none;
}

#menuIdioma {
	position: relative;
	top: 20px;
	right: 0;
}

#menuIdioma ul {
	list-style: none;
	padding: 0 10px;
}

#menuIdioma li {
	display: inline;
	float: right;
}

#menuIdioma a:link, #menuIdioma a:visited {
	color: #fff;
	text-decoration: none;
}

#pie ul {
	list-style-type: none;
	margin: 0 10px 0 0;
	padding: 0 10px 30px 10px;
	background-color: #4c82b9;
	width: 940px;
}

#pie li {
	float: left;
}

#pie ul li a{
	display: block;
	padding: 3px 10px;
	}

#pie ul li a:link, #pie ul li a:visited {
	color: #fff;
	text-decoration: none;
}

#pie ul li a:hover, #pie ul li a:active {
	color: #000;
	background-color: #79add8;
	text-decoration: none;
}

/* Estilo para el contenido principal */

#contenido h1, #completa h1 {
	font: normal small-caps normal 1.8em/200% "Trebuchet MS", "Lucida Grande", Verdana, Tahoma, Arial, Helvetica, sans-serif;
}

#contenido h2, #completa h2 {
	font: normal small-caps normal 1.4em/140% "Trebuchet MS", "Lucida Grande", Verdana, Tahoma, Arial, Helvetica, sans-serif;
	padding: 1em 0 0 0;
}

#contenido p {
	font: normal normal normal 100%/140% "Trebuchet MS", "Lucida Grande", Verdana, Tahoma, Arial, Helvetica, sans-serif;
	margin: 10px 0;
}

#contenido blockquote p {
	color: #000;
	font-style: italic;
}

#contenido ul {
	margin: 0 50px;
}

#completa tr, #completa td {
	margin: 0;
	padding: 1px;
}

.formulario {
	margin: 1em 0;
	background-color: #E98BB5;
	text-align: center;
	padding: 0 0 10px 0;
}

#completa .formulario {
	width: 49%;
	float: left;
	margin: 3px;
	background-color: #E98BB5;
	text-align: center;
	padding: 0 0 10px 0;
}

.formulario p {
	text-align: left;
	padding: 0 10px;
}

#contenido .formulario h2, #completa .formulario h2 {
	text-align: left;
	color: #fff;
	background-color: #BB2769;
	margin: 0 0 1em 0;
	padding: 10px;
	font: bold small-caps normal 1.4em/100% "Trebuchet MS", "Lucida Grande", Verdana, Tahoma, Arial, Helvetica, sans-serif;
}

.formulario label {
	display: block;
	padding: 15px 0 0 0;
}

.formulario form {
	width: 80%;
	margin: 1em auto;
	text-align: left;
}

#completa .formulario form {
	width: 95%;
	margin: 1em auto;
}

.formulario input {
	width: 100%;
	min-width: 100%;
	text-align: right;
	color: #BB2769;
	background-color: #f9fbfd;
}

.formulario select {
	width: 100%;
	display: inline;
	color: #000;
}

fieldset {
	border: none;
}

.formulario input.control {
	text-align: center;
	width: 40%;
	min-width: 40%;
	max-width: 40%;
	margin: 1em;
	float: left;
	background-color: #BB2769;
	color: #fff;
	border: 1px solid #fff;
	padding: 10px;
}

.ayudaFormulario {
	display: none;
}

.formulario p.nota {
	clear: both;
	margin: 5em 10px 0 10px;
	padding: 10px;
	color: #000;
	border-top: 1px solid #BB2769;
	background-color: transparent;
}

/* Elementos de la columna lateral */

#lateral h2 {
	color: #688A00;
	margin: 1em 0 1em 0;
	padding: 3px;
	font-variant: normal;
	font-weight: bold;
	border-top-width: 1px;
	border-bottom-width: 2px;
	border-top-style: solid;
	border-bottom-style: solid;
	border-top-color: #688a00;
	border-bottom-color: #688a00;
}

#lateral ul {
	margin: 0 10px 0 30px;
}

#lateral .autor {
	text-align: right;
}


/* Elementos del pie de página*/

#pie p {
	text-align: center;
	background-color: #4C82B9;
	margin: 0;
	padding: 10px;
	line-height: 150%;
}

#pie a, #pie a:link, #pie a:visited, #pie a:hover, #pie a:active {
	font-weight: bold;
	text-decoration: none;
	border-bottom: none;
	color: #fff;
}

/* Instrucciones */
.instrucciones {
	width: 98%;
	margin: auto;
}

/* Estilos generales */
h1, h2, h3, h4 {
	color: #bb2769;
	font-variant: small-caps;
}

.resaltar {
	color: #BB2769;
}

table {
	width: 100%;
	text-align: left;
}

caption {
	width: 100%;
	text-align: left;
	font-weight: bold;
	background-color; #d4e6f4;
	margin: 0;
	padding: 5px;
}

th {
	text-align: left;
	font-weight: bold;
	color: #4c82b9;
}

td {
	padding: 3px;
}
acronym, abbr {
	font-variant: small-caps;
}

blockquote {
	font-style: italic;
}

blockquote p {
	font-style: italic;
	padding: 0 30px;
}

a {
	text-decoration: none;
}

a:link, a:visited {
	color: #688a00;
	border-bottom: 1px dashed #688a00;
}

a:hover, a:active {
	color: #4C82B9;
	border-bottom: 1px dashed #ffffff;
	background-attachment: fixed;
}

dl {
	margin: 0 40px;
}

dt {
	font-weight: bold;
}
dd {
}

img.icono {
	float: right;
}

img {
	border: none;
}
