/* ----- ESTILS GENERALS I DE TEXT ----- */
html {
        height:98%;
}
body {
	color: #CCC;
	background-color: #333;
	font-size:medium;
	font-family:Georgia, "Times New Roman", Times, serif;
	/*margin: 0 auto;
	/* width: 935px;
	height:98%; */
}
a {
	color: #FFF;
	text-decoration:none;
}
a:hover {
	color: #C96;
	text-decoration:none;
}
h1 {
	font-size: xx-large;
	font-weight: bold;
	font-style: italic;
	margin:0;
}
* html h1{
	position:relative;
	float:left;
	margin:-40px 0 0 0;
}
h2 {
	font-size: xx-large;
	font-weight: bold;
	font-style: italic;
	margin:10px 0 0 10px;
}
* html h2{
	position:relative;
	float:left;
	clear:both;
	margin:-50px 0 0 0;
}
h3{
	position:relative;
	display:block;
	float:left;
	width:98%;
	clear:both;
	padding:2px;
	margin: 0 0 30px 0;
	border-bottom:2px solid #ccc;
	color:#c96;
}
* html .putoIE{
	position:relative;
	float:left;
	clear:both;
	width:98%;
}
.subtitulo{
	position: relative;
	clear:both;
	font-style: italic;
	font-variant:small-caps;
	float:left;
	left:15px;
	margin-top:0px;
}
.volver {
	position: relative;
	float: right;
	clear:both;
	padding:20px 0 0 0;
	color: #AAA;
	margin:0px;
	font-size: large;
	font-variant:small-caps;
}
* html .volver {
	width:98%;
	position:relative;
	float:left;
	clear:both;
	text-align:right;

}
.piedepagina {
	position: relative;
	clear:both;
	color: #AAA;
	font-size:x-small; 
	text-align: center;
	font-family: Arial, Helvetica, sans-serif;
	font-weight: bold;
	font-style: italic;
}
.pieoculto {
	position: relative;
	clear:both;
	color: #333;
	font-size:xx-small; 
	text-align: center;
	margin:0px;
	padding:0px;
}
.titulo{
	font-size:larger;
	font-weight: bold;
	font-style: italic;
	margin: 0 0 -5px 0;
}
.texto_aventura {
	position: relative;
	clear:both;
	font-family: Gaze;
	font-size: large;
	text-align:justify;
	padding: 30px 20px 0 20px;
}
.creditos {
	font-size:75%;
	font-weight: normal;
	font-style: italic;
	font-variant: normal;
}
.retorno {	
	font-size:75%;
	text-align:right;
	width:100px;
	margin:-20px 0 0 auto;
}	
.multiusos {	
	width: 98%;
	float:left;
	clear:both;
	padding:0;
	margin:0 0 20px 0;	
}



/* -------------------------------------- ESTILS DE POSICIĶ I MOSTRADORS ----------------------------------------- */

.reverso {
	position: relative;
	float:left;
	clear:both;
	width:109px;
	height:161px;
	top: -60px;	
	left: 45%;
	margin:0 0 -60px 0;
}
* html .reverso {
	top: -50px;
	left: 400px
}
.reverso_horizontal {
	position: relative;
	float:left;
	clear:both;
	width:188px;
	height:125px;
	top: -80px;	
	left: 40%;
	margin:0 0 -60px 0;
}
.foro {
	position:relative;
	float:left;
	width:98%;
	clear:both;
}
.epoca {
	position: relative;
	float:left;
	clear:left;
	padding:0;
	width: 45%;
	text-align:center;
}
/* --- Mostrador per cartes ---*/
.mostrador {	
	width: 98%;
	position: relative;
	float:left;
	clear:both;
	padding:0;
	margin:0 0 20px 0;	
}
.mostrador ul{
	display:block;
	clear:both;
	width:750px;
	padding:0;
	margin:0 auto 0 auto;
}
.mostrador ul li{
	position: relative;
	float:left;
	list-style:none;
	margin:0 2px 0 2px;
	padding:0;
	width: 175px;
}
.mostrador li a{
	color:#AAA;
	font-weight:bold;
	display:block;
	text-align: center;
	width:175px;
}
.mostrador li a.nueva{
	color:#99C;/*66c*/
	font-weight:bold;
}
.mostrador li a:hover{
	color:#c96;
}
.mostrador li img{
	margin: 10px 0 30px 0;
}

/* --- Mostrador per fitxes ---*/

.mostrador_fichas {
	position: relative;
	float:left;
	width: 98%;
	padding:0 0 0 0;
	margin:0 0 20px 0;	
}
.mostrador_fichas dl {
	position: relative;
	display:inline;
	float:left;
	width: 430px;
	margin:10px 10px 30px 10px;
}
* html .mostrador_fichas dl {
	margin: 10px 5px 30px 5px;
}
.mostrador_fichas dt {
	position:relative;
	display:block;
	float:left;
	width:430px;
	text-align:center;
	padding:0;
	bottom: 10px;
	font-size:large;
	font-weight:bold;
	font-variant:small-caps;
	font-family:Georgia, "Times New Roman", Times, serif;
}
div.mostrador_fichas dd.imagen {
	position:relative;
	display: inline;
	padding:0;
	margin:0;
	float:left;
	width:195px;
	height:200px;
	margin:0 10px 0 0;
	text-align:center;
}
div.mostrador_fichas dd.imagen img{
	border: 0;
}
div.mostrador_fichas dd.imagen img.ficha1x1{
	width:100px;
	height:100px;
}
div.mostrador_fichas dd.imagen img.ficha2x1{
	width:200px;
	height:100px;
}
div.mostrador_fichas dd.imagen img.ficha1x2{
	width:100px;
	height:200px;
}
div.mostrador_fichas dd.imagen img.ficha2x2{
	width:200px;
	height:200px;
}
div.mostrador_fichas dd.texto {
	position:relative;
	display:inline;
	padding:0;
	margin:0;
	float:left;
	width:215px;
	font-size:small;
	text-align:justify;
}
div.mostrador_fichas dd.retos {
	position:relative;
	display:inline;
	padding:0;
	margin:0;
	float:left;
	width:215px;
	font-size:small;
	text-align:justify;
}
/* --- Mostrador para objetos 2d/3d ---*/

.mostrador_vertical {
	position: relative;
	float:left;
	width: 98%;
	padding:0 0 0 0;
	margin:0 0 20px 0;	
}
.mostrador_vertical dl {
	position: relative;
	display:inline;
	float:left;
	width: 430px;
	margin:10px 10px 30px 10px;
}
* html .mostrador_vertical dl {
	margin: 10px 5px 30px 5px;
}
.mostrador_vertical dt {
	position:relative;
	display:block;
	float:left;
	width:430px;
	text-align:center;
	padding:0;
	bottom: 10px;
	font-size:large;
	font-weight:bold;
	font-variant:small-caps;
	font-family:Georgia, "Times New Roman", Times, serif;
}
div.mostrador_vertical dd.imagen {
	position:relative;
	display: inline;
	padding:0;
	margin:0;
	float:left;
	width:200px;
	height:200px;
	margin:0 10px 0 0;
	text-align:center;
}
div.mostrador_vertical dd.imagen img{
	border: 0px;
}
/*div.mostrador_vertical dd.imagen img.vertical1x1{
	width:100px;
	height:100px;
}*/
/*div.mostrador_vertical dd.imagen img.vertical2x1{
	width:200px;
	height:100px;
}*/
/*width="80" height="130" border="0" es el tamaņo real del thumbnail*/
div.mostrador_vertical dd.imagen img.vertical1x2{
	width:120px;
	height:195px;
}
div.mostrador_vertical dd.imagen img.vertical2x2{
	width:200px;
	height:200px;
}
div.mostrador_vertical dd.texto {
	position:relative;
	display:inline;
	padding:0;
	margin:0;
	float:left;
	width:215px;
	font-size:small;
	text-align:justify;
}
div.mostrador_vertical dd.retos {
	position:relative;
	display:inline;
	padding:0;
	margin:0;
	float:left;
	width:215px;
	font-size:small;
	text-align:justify;
}
/* --- Mostrador per habitacions ---*/

.mostrador_habitacion {
	position: relative;
	float:left;
	width: 98%;
	padding:0 0 0 0;
	margin:0 0 20px 0;	
}
.mostrador_habitacion dl {
	position: relative;
	display:inline;
	float:left;
	width: 900px;
	margin:10px 20px 30px 50px;
}
.mostrador_habitacion dt {
	position:relative;
	display:block;
	float:left;
	width:900px;
	text-align:center;
	padding:0;
	bottom: 10px;
	font-size:large;
	font-weight:bold;
	font-variant:small-caps;
	font-family:Georgia, "Times New Roman", Times, serif;
}
div.mostrador_habitacion dd.imagen {
	position:relative;
	display: inline;
	padding:0;
	margin:0;
	float:left;
	width:450px;
	height:375px;
	margin:0 20px 0 0;
	text-align:center;
}
div.mostrador_habitacion dd.imagen img{
	border: 1px solid black;
}
div.mostrador_habitacion dd.texto{
	position:relative;
	display:inline;
	padding:0;
	margin:20px 0 0 0;
	float:left;
	width:300px;
	font-size:small;
	text-align:justify;
}

/* ---- Mostrador per Miniquests ---- */
.miniquest {
	position: relative;
	float:left;
	width: 99%;
	padding:0 0 0 0;
	margin:0 0 20px 0;	
}
.miniquest dl {
	position: relative;
	display:inline;
	float:left;
	width: 450px;
	margin:0 0 50px 22px;
}
.miniquest dt {
	position:relative;
	display:block;
	float:left;
	width:450px;
	text-align:center;
	padding:0;
	bottom: 10px;
	font-size:large;
	font-weight:bold;
	font-variant:small-caps;
	font-family:Georgia, "Times New Roman", Times, serif;
}
div.miniquest dd.texto {
	position:relative;
	display:inline;
	padding:0;
	margin:0;
	float:left;
	width:285px;
	font-size:small;
	text-align:justify;
}
div.miniquest dd.retos {
	position:relative;
	display: block;
	padding:0;
	margin:0;
	float:right;
	width:150px;
	text-align:center;
}
* html div.miniquest dd.retos{
	left:-50px;
	margin:0 -50px 0 0;
}
div.miniquest dd.retos ol{
	color: #AAA;
	background-color: #666;
	position:relative;
	width:150px;
	float: right;
	padding:5px 0 0 5px;
}
div.miniquest dd.retos li{
	position:relative;
	list-style-type:none;
	float:right;
	width:150px;
	text-align: center;
}
div.miniquest dd.retos a{
	position:relative;
	float:right;
	font-variant:small-caps;
	font-size:small;
	background: url(web/pergamino_trans.gif) no-repeat;
	width: 150px;
	padding: 40px 0 5px 0;
	color: #AAA;
	text-decoration:none;
}
div.miniquest dd.retos a:hover{
	color: #FFF;
	text-decoration:none;
}

/* ---- Mostrador per Herois ---- */
.heroes {
	position: relative;
	float:left;
	width: 98%;
	padding:0;
	margin:30px 0 0 0;	
}
.heroes dl {
	position: relative;
	float:left;
	display:block;
	clear:both;
	width:98%;
	text-align:center;
}
.heroes dt {
	position:relative;
	display:block;
	float:left;
	border: 2px;
	border-style:solid;
	border-color:#C96 #333 #C96 #333;
	margin:0 10% 0 15%;	
	width:66%;
	text-align:center;
	padding:0;
	font-size:large;
	font-weight:bold;
	font-variant:small-caps;
	font-family:Georgia, "Times New Roman", Times, serif;
}
* html .heroes dt{
	margin:0 0 0 43px;
}
.heroes dd.frontal {
	position:relative;
	clear:both;
	display:block;
	width:98%;
	float:left;
	margin:20px 10% 0 15%;
}
* html .heroes dd.frontal{
	margin:20px 0 0 43px;
}
div.heroes dd.frontal img{
	margin:0 5px 0 0;
}
.heroes dd.descripcion {
	position:relative;
	display:block;
	clear:both;
	width:98%;	
	float:left;
	text-align:center;
	padding:0;
	top: 10px;
	bottom: 10px;
	font-family:Georgia, "Times New Roman", Times, serif;
	font-variant:italics;
}
/* ---- Mostrador per Habilitats ---- */
.habilidades {	
	width: 98%;
	position: relative;
	float:left;
	clear:both;
	padding:0;
	margin:0 0 20px 0;	
}
.habilidades ul{
	display:block;
	clear:both;
	width:750px;
	padding:0;
	margin:0 auto 0 auto;
}
.habilidades ul li{
	position: relative;
	float:left;
	list-style:none;
	margin:0 5px 0 5px;
	padding:0;
	width: 240px;
}
* html .habilidades ul li{
	margin:0 3px 0 3px;
}
.habilidades li a{
	color:#AAA;
	font-weight:bold;
	display:block;
	text-align: center;
	width:240px;
}
.habilidades li a:hover{
	color:#c96;
}
.habilidades li img{
	margin: 10px 0 10px 0;
}
* html .habilidades li img{
	margin: 5px 0 5px 0;
}

/* --------------------------------------------- BOTONS VARIATS ------------------------------------------------- */
.botonera {
	position:relative;
	float:right;
	clear:right;
	width:450px;
	font-size: medium;
	font-variant:small-caps;
	margin: 0 20px 0 0;
}
.botonera ol{
	color: #AAA;
	background-color: #666;
	position:relative;
	width:450px;
	float: right;
	padding:5px 0 0 5px;
}
.botonera li{
	list-style-type:none;
	float:left;
	text-align: left;
}
.botonera a{
	position:relative;
	float:left;
	background: url(web/pergamino_trans.gif) no-repeat;
	width: 150px;
	padding: 40px 0 5px 0;
	color: #AAA;
	text-decoration:none;
}
.botonera a:hover{
	position:relative;
	float:left;
	color: #FFF;
	text-decoration:none;
}
.botonera p {
	text-align:center;
}
.botones_pergamino {
	position:relative;
	display:block;
	float:right;
	clear:right;
	width:500px;
	padding:0;
}
.botones_pergamino a{
	position:relative;
	display:block;
	background: url(web/pergamino_recto.png) no-repeat center center;
	color:#000;
	font-size:larger;
	font-weight:bold;
	font-variant:small-caps;
	width: 285px;
	height:67px;
	padding: 30px 0 0 0;
	text-decoration:none;
	text-align:center;
}
.botones_pergamino a:hover{
	position:relative;
	display:block;
	color: #c96;
	text-decoration:none;
}
.botones_pergamino dl {
	position:relative;
	width:500px;
	float: left;
}
.botones_pergamino dt {
	position:relative;
	width:285px;
	float: left;
}
.botones_pergamino dd {
	position:relative;
	width:200px;
	float:right;
	color: #CCC;
	background-color: #333;
	margin:0;
	padding: 20px 0 0 0;
	text-align:justify;
	font-size: smaller;
}
.botones_pergamino_pq {
	position:relative;
	display:block;
	float:right;
	clear:right;
	width:400px;
	padding:0 100px 0 0;
}
.botones_pergamino_pq a{
	position:relative;
	display:block;
	background: url(web/pergamino_recto_mini.png) no-repeat center center;
	color:#000;
	font-size:larger;
	font-weight:bold;
	font-variant:small-caps;
	width: 180px;
	height:45px;
	padding: 15px 0 0 0;
	text-decoration:none;
	text-align:center;
}
* html .botones_pergamino_pq a{
	font-size:medium;
	padding: 15px 0 0 5px;
}
.botones_pergamino_pq a:hover{
	position:relative;
	display:block;
	color: #c96;
	text-decoration:none;
}
.botones_pergamino_pq dl {
	position:relative;
	width:400px;
	float: left;
}
.botones_pergamino_pq dt {
	position:relative;
	float: left;
	width:180px;
	height: 45px;
	padding: 0 0 10px 0;
}
* html .botones_pergamino_pq dt {
	margin: -12px 0 0 0;
}
.botones_pergamino_pq dd {
	position:relative;
	clear:right;
	float:right;
	width:180px;
	height: 45px;
	color: #CCC;
	background-color: #333;
	margin:0;
	padding: 5px 0 5px 15px;
	text-align:justify;
	font-size: smaller;
}

/* -------------------------------------------------- REPTES --------------------------------------------------- */

.reto{
	position:relative;
	float:left;
	clear:both;
	width:98%;
	text-align:center;
}

/* --- Pergami News --- */

.pergamino_news_fondo{
	position:relative;
	float:left;
	clear:left;
	left:20px;
	width:400px;
	height:400px;
	background: url(web/pergamino_news.png) no-repeat center center;
}
.pergamino_news_texto{
	position:relative;
	float:left;
	top:15px;
	left:30px;
	width:347px;
	height:297px;
	overflow:auto;
	text-align:center;
}
.pergamino_news_texto p{
	color: #000;
	margin: 0 0 5px 0;
	font-size: small;
	font-style:italic;
	text-align:left;
}
.pergamino_news_texto p a{
	color:#333;
	font-weight:bold;
	font-style:normal;
}
/* --- Pergami Fix --- */

.pergamino_fijo_fondo{
	position:relative;
	float:left;
	clear:both;
	left:100px;
	width:750px;
	height:306px;
	background:url(web/pergamino_fijo.gif) no-repeat center center;
}
.pergamino_fijo_texto{
	position:relative;
	float:left;
	clear:both;
	top:15px;
	left:30px;
	width:687px;
	height:145px;
	overflow:auto;
	text-align:center;
	font-size: large;
}
.pergamino_fijo_texto p{
	color: #000;
	font-family: Gaze, Georgia, "Times New Roman", Times, serif;
	margin: 0 0 5px 0;
}
div.pergamino_fijo_texto p.titulo{
	font-size:xx-large;
}

/* --- Pergami Variable --- */

.pergaminoCabecera{
	position:relative;
	float:left;
	width:750px;
	left:100px;
	background:url(web/pergamino_top.gif) no-repeat top center;
}
.pergaminoPie{
	position:relative;
	float:left;
	width:750px;
	background:url(web/pergamino_bottom.gif) no-repeat bottom center;
}
.pergaminoTexto{
	position:relative;
	float:left;
	width:730px;
	text-align:center;
	margin: 0 0 0 15px;
}
.pergaminoTexto p{
	text-align:center;
	font-size: large;
	color: #000;
	font-family: Gaze, Georgia, "Times New Roman", Times, serif;
	margin: 0 5px 5px 0;
}
div.pergaminoTexto p.titulo{
	font-size:xx-large;
}
.pergaminoContenedor{
	position:relative;
	float:left;
	width:750px;
	background:url(web/pergamino_center.gif) repeat-y center center;
	margin: 30px 0 147px 0;
}

/* ---------------------------------- NOTES, LLETRES I MONSTRES ERRANTS ---------------------------------------- */

.notas_de_reto{
	position:relative;
	float:left;
	clear:both;
	width:750px;
	text-align:center;
	left:100px;
	margin:-30px 0 0 0;
}
.notas_de_reto ul {
	position:relative;
	list-style: none;
	margin: 0 0 0 250px;
	padding: 0;
	text-align:justify;
	width:450px;
}
* html .notas_de_reto ul {
	margin: 0 0 0 200px;
}
.notas_de_reto ul li{
	position:relative;
	background-repeat: no-repeat;
	background-position: 0 50% 50% 50%;
	padding: 10px 0 10px 50px;
	margin: .4em 0 0 0;
}
.notas_de_reto ol {
	position:relative;
	list-style: none;
	margin: 0 0 0 150px;
	padding: 0;
	text-align:justify;
	width:450px;
}
* html .notas_de_reto ol {
	margin: 0;
}
.notas_de_reto ol li{
	position:relative;
	background-repeat: no-repeat;
	background-position: 0 50% 50% 50%;
	padding: 10px 0 10px 50px;
	margin: .4em 0 0 0;
}
div.notas_de_reto li.nada {
	background-image: url(aventuras/iconos/nada_EUwww.heroquest.es.png);
}
/* --- Monstres ---*/
div.notas_de_reto li.orco {
	background-image: url(aventuras/iconos/Orco_EUwww.heroquest.es.jpg);
}
div.notas_de_reto li.esqueleto {
	background-image: url(aventuras/iconos/Esqueleto_EUwww.heroquest.es.jpg);
}
div.notas_de_reto li.zombi {
	background-image: url(aventuras/iconos/Zombi_EUwww.heroquest.es.jpg);
}
div.notas_de_reto li.fimir {
	background-image: url(aventuras/iconos/Fimir_EUwww.heroquest.es.png);
}
div.notas_de_reto li.momia {
	background-image: url(aventuras/iconos/Momia_EUwww.heroquest.es.png);
}
div.notas_de_reto li.guerrero_del_caos {
	background-image: url(aventuras/iconos/Guerrero_del_Caos_EUwww.heroquest.es.png);
}
div.notas_de_reto li.guerrero_ct {
	background-image: url(aventuras/iconos/guerrero_ct_EUwww.heroquest.es.png);
}
div.notas_de_reto li.goblin {
	background-image: url(aventuras/iconos/Goblin_EUwww.heroquest.es.png);
}
div.notas_de_reto li.hombre_bestia {
	background-image: url(aventuras/iconos/Hombre_BestiaESwww.heroquest.es.jpg);
}

/* --- Lletres --- */
div.notas_de_reto li.a_eu {
	background-image: url(aventuras/iconos/A_EUwww.heroquest.es.jpg);
}
div.notas_de_reto li.b_eu {
	background-image: url(aventuras/iconos/B_EUwww.heroquest.es.jpg);
}
div.notas_de_reto li.c_eu {
	background-image: url(aventuras/iconos/C_EUwww.heroquest.es.jpg);
}
div.notas_de_reto li.d_eu {
	background-image: url(aventuras/iconos/D_EUwww.heroquest.es.jpg);
}
div.notas_de_reto li.e_eu {
	background-image: url(aventuras/iconos/E_EUwww.heroquest.es.jpg);
}
div.notas_de_reto li.f_eu {
	background-image: url(aventuras/iconos/F_EUwww.heroquest.es.jpg);
}
div.notas_de_reto li.g_eu {
	background-image: url(aventuras/iconos/G_EUwww.heroquest.es.png);
}
div.notas_de_reto li.h_eu {
	background-image: url(aventuras/iconos/H_EUwww.heroquest.es.png);
}
div.notas_de_reto li.i_eu {
	background-image: url(aventuras/iconos/I_EUwww.heroquest.es.png);
}
div.notas_de_reto li.j_eu {
	background-image: url(aventuras/iconos/J_EUwww.heroquest.es.png);
}
div.notas_de_reto li.k_eu {
	background-image: url(aventuras/iconos/K_EUwww.heroquest.es.png);
}
div.notas_de_reto li.l_eu {
	background-image: url(aventuras/iconos/L_EUwww.heroquest.es.png);
}
div.notas_de_reto li.m_eu {
	background-image: url(aventuras/iconos/M_EUwww.heroquest.es.png);
}
/* --- Nous personatges --- */
table.personaje {
	position:relative;
	width:400px;
	height:75px;
	margin: 0 0 25px 175px;
	text-align: center;
	background: url(aventuras/iconos/caracteristicas.www.heroquest.es.png) no-repeat bottom center;
}
* html table.personaje{
	margin:0 0 25px 0;
	background: url(aventuras/iconos/caracteristicas.www.heroquest.es.png) no-repeat top center;
}
table.personaje caption {
	position:relative;
	background:#333;
	color:#CCC;
	margin: 0 0 0 175px;
	width:400px;
	font-size:medium;
	caption-side:top;
	text-align:center;
}
* html table.personaje caption{
	margin:0;
}
table.personaje tr.caracteristicas {
	display:none;
	text-align: center;
}
table.personaje tr.valores {
	color:#fff;
	font-weight: bold;
	text-align: center;
}
table.personaje td {	
	font-family:Times;
	font-size:large;
	width:80px;
	height:50px;
	padding: 15px 0 0 0;
}