/************************************************************
****** DarkGaze -- www.darkgazefactory.com ******************
*********Para el Smial de Númenor. 2007**********************
*************************************************************/

/* GENERAL */

* {
	padding: 0;
	margin: 0;
	}

body {
	background: #000000; 
	font: normal 90% Georgia, Palatino, Times, "Times New Roman", serif; 
	color: #000000;
	}
	
/* ENLACES GENERALES **********************************************************/

a:link {
	text-decoration: none;
	color:#000000;
	font-weight:bold;
	}

a:visited {
	text-decoration: none;
	color:#000000;
	font-weight: bold;

	}

a:hover {
	text-decoration: none;
	color: #CCCCCC;
	font-weight:bold;
	}

a:active {
	text-decoration: none;
	color:#CCCCCC;
	font-weight:bold;
	}
	
/* Secciones DIV **************************************************************/

#contenedor { 
	background: #000000;	
	width: 100%;
	height: 100%;
	background: url(img/cabecera-tile.jpg) repeat-x;
	}

#cabecera { 
	background: url(img/cabecera.jpg) top left no-repeat;  /*ANIMACION ESTANDARTE*/
	width: 100%;
	height: 150px;
	text-indent: -1000em;
	}

#contenido {
	margin: 0px;
	height: auto;
	}

#indice {
	background: url(img/cabecera-left.jpg) no-repeat;
	top:150px;
	float: left;
	height: auto;
	width: 180px;
	font-weight: bold;
	font-size: 16px;
	text-align: center;
	}

#texto { 
	margin-left: 180px;
	margin-right: 80px;
	background: #990033;
	padding: 20px;
	border-top: #333333 1px solid;
	}

#pieDePagina { 
	position: relative;
	bottom: 0px;
	left: 0px;
	background: #000000;
	width: 100%;
	height: 30px;
	left: 0px;
	clear:both;
	}
	
#animacion{
	position: relative;
	top: 0px;
	left:0px;
	/*background: url(img/anim_bandera.gif) no-repeat;*/
	height: 130px;
	width: 170px;
}


/* Propiedades para texto **********************************************************/

p { 
	font: 100% Georgia, Palatino, Times, "Times New Roman", serif; 
	line-height: 17px;
	margin-top: 0px; 
	text-align: justify;
	padding-left: 14px;
	padding-bottom: 10px;
	padding-right: 15px;
	}
	
.texto-cita{
	font-style:italic;
	font-weight:normal;
	text-align: center;
	padding: 10px;
	}

.texto-subcita{
	font-style:italic;
	font-weight:normal;
	text-align: right;
	font-size: smaller;
	}

.texto-subimg{
	font-style:italic;
	font-weight: normal;
	text-align: center;
	font-size: smaller;
	}
	
.texto-plano{
	text-align: left;
	font-size: small;
	}
	
.texto-volver{
	font-style: italic;
	font-size: smaller;	
	}

.centrado{
	text-align:center; 
	padding: 10px;
	} 

.titulo{
	font-size: large;
	line-height: normal;
	font-family: georgia, verdana;
	text-align: center;
	margin-top: 10px;
	}

.subtitulo{
	font-size: 18px;
	font-weight: bold;
	text-align: center;
	text-decoration: underline;
	margin: 10px;
	line-height: 22px;
	}
	
.subsubtitulo{
	font-size: small;
	font-weight: bold;
	margin: 5px;
	text-decoration: underline;
}
	
.comentario{
	font-size: smaller;
	font-style: italic;
	}

.remarcado{
	font-weight: bold;
	color: #999999;
	}

.recuadroClaro{
	/*Hay que ponerle las cuatro esquinas redondeadas que corresponden. 4 divs internos en este orden: bl, br, tl, tr*/
	background-color: #C60042;
	width: auto;
}

/* Estilos del Indice **********************************************************/
/*
Boton 1,2 y 3 son los 3 botones que transparentan en el indice. A partir del boton nº3, ya podemos usar siempre los genéricos.
*/

.boton1_on{
	background: url(img/boton-on.jpg) no-repeat;
	float:right;
	width: 130px;
	height: 40px;
	margin-top: 20px;
	}

.boton1_off{
	background: url(img/boton-off.jpg) no-repeat;
	float:right;
	width: 130px;
	height: 40px;
	margin-top: 20px;
	}
	
.boton2_on{
	background: url(img/boton2-on.jpg) no-repeat;
	float:right;
	width: 130px;
	height: 40px;
	margin-top: 10px;
	}
	
.boton2_off{
	background: url(img/boton2-off.jpg) no-repeat;
	float:right;
	width: 130px;
	height: 40px;
	margin-top: 10px;
	}

.boton3_on{
	background: url(img/boton3-on.jpg) no-repeat;
	float:right;
	width: 130px;
	height: 40px;
	margin-top: 10px;
	}

.boton3_off{
	background: url(img/boton3-off.jpg) no-repeat;
	float:right;
	width: 130px;
	height: 40px;
	margin-top: 10px;
	}
	
.boton_on{ /*Boton azul claro generico*/
	background: url(img/boton-on.jpg) no-repeat;
	float:right;
	width: 130px;
	height: 40px;
	margin-top: 10px;
	}
	
.boton_off{ /*Boton azul oscuro generico*/
	background: url(img/boton-off.jpg) no-repeat;
	float:right;
	width: 130px;
	height: 40px;
	margin-top: 10px;
	}
	
.boton_grande{ /*Boton azul oscuro generico*/
	background: url(img/boton-grande.jpg) no-repeat;
	float:right;
	width: 111px;
	height: 120px;
	margin-top: 7px;
	}


.estiloIndice{
	padding-top: 5px;
	}

/* Propiedades de Listas **********************************************************/

#texto ul {
	list-style-type: box;				
	margin: 15px;
	}

#texto ul li {
	margin-left: 10px;
	margin: 5px;
	}

#texto ol {
	margin: 15px;
	}

#texto ol li {
	margin: 10px;
	}
	
/* IMAGENES ************************************************************/	

.imagen{
	margin: 10px;
	border: #666666 inset medium;
}

.imagen-sin_borde{
	margin: 10px;
	margin-right: 20px;
}

/* SEPARADORES **********************************************************/

.separador200{ height:200px;}
.separador100{  height:100px;}
.separador50{ height:50px;}
.linea{
	background-color: #4477aa;
	height: 2px;
	width: 400px;
	margin-top: 15px;
	margin-bottom: 15px;
	}
	
	
/* BORDES REDONDEADOS **********************************************************/
.bl {background: url(img/bl.jpg) 0 100% no-repeat; height: 40px;}
.br {background: url(img/br.jpg) 100% 100% no-repeat}
.tl {background: url(img/tl.jpg) 0 0 no-repeat}
.tr {background: url(img/tr.jpg) 100% 0 no-repeat}
.bl2 {background: url(img/bl2.jpg) 0 100% no-repeat; height: 40px;}
.br2 {background: url(img/br2.jpg) 100% 100% no-repeat}
.tl2 {background: url(img/tl2.jpg) 0 0 no-repeat}
.tr2 {background: url(img/tr2.jpg) 100% 0 no-repeat}
.bl3 {background: url(img/bl3.jpg) 0 100% no-repeat}
.br3 {background: url(img/br3.jpg) 100% 100% no-repeat}
.tl3 {background: url(img/tl3.jpg) 0 0 no-repeat; padding: 5px;}
.tr3 {background: url(img/tr3.jpg) 100% 0 no-repeat}
.clear {font-size: 1px; height: 1px}
