@charset "utf-8";
/* CSS Document */
/** Redefinición de Etiquetas */
body{
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 18px;
	font-style: normal;
	line-height: normal;
	font-weight: normal;
	font-variant: normal;
	color: #FFFFFF;
	vertical-align: middle;
	margin-left: 0px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	text-align:center;
	background:#000000;
}

a:visited {color:#996633}

a:hover {color: #999999;}

a:active {color:#666666;}

a:link {color: #CC6600;}

iframe {background-color:transparent;} 

/**Menú Principal */
#capa1 {position: absolute;left: 0;top: 0;width: 253px;height:254px;z-index: 3;visibility: visible;}
#capa3 {position: absolute;left: 700px;top: 167px;width: 170px;height:150px;z-index: 3;visibility: hidden;}

#roseton {width: 253px; height: 254px; background: url(/images/roseton_es.png); margin: 0px; padding: 0px; position: relative;}
#roseton li {margin: 0;padding: 0;list-style: none;display: block;position: absolute;z-index: 3;}
#roseton a {display: block;}

#menu1 {display: block; left: 143px; top: 0px; width: 90px; height: 45px;}
#menu2 {display: block; left: 126px; top: 48px; width: 90px; height: 56px;}
#menu3 {display: block; top: 95px; left: 115px; height: 50px; width: 60px}
#menu4 {display: block; top: 117px; left: 83px; height: 70px; width: 50px}
#menu5 {display: block; left: 47px;	top: 140px;	width: 40px; height: 70px;}
#menu6 {display: block; left: 0px; top: 148px; width: 40px; height: 90px;}
#menu1 a {position:relative; top:0px; left:0px; height: 45px; width:90px}
#menu2 a {position:relative; top:0px; left:0px; height: 56px; width:90px}
#menu3 a {position:relative; top:0px; left:0px; height: 50px; width:60px}
#menu4 a {position:relative; top:0px; left:0px; height: 70px; width:50px}
#menu5 a {position:relative; top:0px; left:0px; width: 40px; height: 70px;}
#menu6 a {position:relative; top:0px; left:0px; width: 40px; height: 90px;}

#menu1 a:hover {position:relative; top:0px; left:-30px; width:135px; height:103px; background: url(/images/roseton_es.png) -113px -254px no-repeat;}
#menu2 a:hover {position:relative; top:-10px; left:-20px; width:120px; height:103px; background: url(/images/roseton_es.png) -106px -546px no-repeat;}
#menu3 a:hover {position:relative; top:-25px; left:-24px; width:120px; height:103px; background: url(/images/roseton_es.png) -91px -832px no-repeat;}
#menu4 a:hover {position:relative; top:-20px; left:-20px; width:99px; height:115px; background: url(/images/roseton_es.png) -63px -351px no-repeat;}
#menu5 a:hover {position:relative; top:-30px; left:-10px; width:68px; height:124px; background: url(/images/roseton_es.png) -37px -618px no-repeat;}
#menu6 a:hover {position:relative; top:-30px; left:0px; width:58px; height:132px; background: url(/images/roseton_es.png) -0px -372px no-repeat;}

/**Maquetación de Contenido Principal*/
#contenedor {width: 1000px; position: relative; top:10px; margin: 0px auto;}
#contenido{position:inherit; width:550px; text-indent:5%}
#anuncios{position:inherit; width:164px; height:216px; text-align:center;}
#anunciosdiv{position:absolute; top:117px; left:12px; height:216px; width:161px; z-index:3; text-align:center;}
#fronton{position:absolute; top:10px; left:172px; width:828px; height:172px; z-index:2;}
#iframe{position:absolute; top:130px; left:191px; width:621px; height:450px; z-index:1; overflow:hidden; background: #000000 url(/images/mascara_fondo.jpg) center no-repeat;}
#latIzq{position:absolute; top:146px; left:0px; width:191px; height:434px; z-index:2; border:0px none;}
#latDer{position:absolute; top:170px; left:812px; width:188px; height:410px; z-index:2; border:0px none;}
#pie{position:absolute; top:580px; left:0px; width:1000px; height:20px; z-index:2; background:url(/images/textura.jpg); vertical-align:middle;}


/**Maquetación de Secciones*/
#conciertos{margin: 0 auto; text-align: center; border:1px solid #000000}
#discos{position:relative; top:50px; margin:0px auto; width:500px;}
#noticias{position: relative; top:40px; margin: 0px auto; width: 500px; background:none;}
#anuncios{position:absolute; top:0px; left:0px; height:216px; width:161px; z-index:3; text-align:center;}
#musica{position:relative; top:40px; height:400px; width:620px; text-align:center; margin:0px auto; background:url(/images/musicaback_es.jpg) no-repeat center top; overflow:auto; vertical-align:center;}
#musica table{position:relative; margin:0px auto; top:100px}
#letras{position: relative; top:50px; margin:0px auto; width:500px;}
#galeria{position:relative; top:50px; margin:0px auto; width:550px; text-align:center;}
#alma{position:relative; top:50px; margin:0px auto; width:454px; height:334px; background:url(/images/almafondo_es.jpg) no-repeat;}
/** Menús de Alma */
	#personas {width: 302px; height: 198px; background: url(/images/personajes.png); position:absolute; top:80px; left:20px;}
	#personas li {margin: 0;padding: 0;list-style: none;display: block;position: absolute;z-index: 3;}
	#personas a {display: block;}
	
	#burkha{display: block; left: 0px; top: 0px; width: 173px; height: 68px;}
	#burkha a {position:relative; top:0px; left:0px; height: 68px; width:173px;}
	#burkha a:hover {background: url(/images/personajes.png) 0px -198px no-repeat;}
	
	#agu{display: block; left: 173px; top: 0px; width: 129px; height: 68px;}
	#agu a {position:relative; top:0px; left:0px; height: 68px; width:129px;}
	#agu a:hover {background: url(/images/personajes.png) -173px -198px no-repeat;}
	
	#jesus{display: block; left: 0px; top: 68px; width: 173px; height: 68px;}
	#jesus a {position:relative; top:0px; left:0px; height: 68px; width:173px;}
	#jesus a:hover {background: url(/images/personajes.png) 0px -266px no-repeat;}
	
	#almi{display: block; left: 173px; top: 68px; width: 129px; height: 68px;}
	#almi a {position:relative; top:0px; left:0px; height: 68px; width:129px;}
	#almi a:hover {background: url(/images/personajes.png) -173px -266px no-repeat;}
	
	#juanpy{display: block; left: 0px; top: 136px; width: 173px; height: 68px;}
	#juanpy a {position:relative; top:0px; left:0px; height: 68px; width:173px;}
	#juanpy a:hover {background: url(/images/personajes.png) 0px -334px no-repeat;}
	
	#dani{display: block; left: 173px; top: 136px; width: 129px; height: 68px;}
	#dani a {position:relative; top:0px; left:0px; height: 68px; width:129px;}
	#dani a:hover {background: url(/images/personajes.png) -173px -334px no-repeat;}
/** Fin de los menús de Alma */
#historia{position:absolute; top:80px; left:330px;}
#colaboraciones{position:absolute; top:300px; left:100px; width:234px; height:26px;}
#baul{position:absolute; top:40px; left:120px; width:395px; height:380px; background:#000000 url(/images/baulback_es.jpg) center bottom no-repeat;}
/**Secciones de Baul*/
	#seccion {width: 395px; height: 160px; background: url(/images/titles_baul_es.png); position:relative; top:10px}
	#seccion li {margin: 0;padding: 0;list-style: none;display: block; position:absolute;}
	#seccion a {display: block;}
	
	#fotos{display: block; left: 0px; top: 80px; width: 100px; height: 40px;}
	#fotos a {position:relative; top:0px; left:0px; height: 40px; width:100px;}
	#fotos a:hover {background: url(/images/titles_baul_es.png) 0px -239px no-repeat;}
	
	#videos{display: block; left: 35px; top: 10px; width: 115px; height: 35px;}
	#videos a {position:relative; top:0px; left:0px; height: 35px; width:115px;}
	#videos a:hover {background: url(/images/titles_baul_es.png) -35px -169px no-repeat;}
	
	#prensa{display: block; left: 175px; top: 0px; width: 120px; height: 30px;}
	#prensa a {position:relative; top:0px; left:0px; height: 30px; width:120px;}
	#prensa a:hover {background: url(/images/titles_baul_es.png) -175px -159px no-repeat;}
	
	#deus{display: block; left: 250px; top: 45px; width: 145px; height: 60px;}
	#deus a {position:relative; top:0px; left:0px; height: 60px; width:145px;}
	#deus a:hover {background: url(/images/titles_baul_es.png) -250px -204px no-repeat;}
	
	#tienda{display: block; left: 245px; top: 130px; width: 120px; height: 30px;}
	#tienda a {position:relative; top:0px; left:0px; height: 30px; width:120px;}
	#tienda a:hover {background: url(/images/titles_baul_es.png) -245px -289px no-repeat;}
/** Fin de las secciones de baul*/
#modificador{position: relative; margin:0px auto; width:800; top:50px}
#hermes{position:absolute; background:url(/images/hermes.jpg) no-repeat; width:188px; height:410px;}
/**Para el modificador*/
	#menu {position: absolute; top:110px; left:10px; list-style:none;margin:0;padding:20px;}
	#menu li {margin:2px; padding:0; float:left;}
	#menu li a {display:block; width:105px; padding:4px 0; text-decoration:none; text-align:center; font-size:12px; color:#FFCC66; background-color:#330000; border-left:10px solid #FF9933;}
	#menu li a:hover {color:#99CC00; background-color:#003366; border-left-color:#99CC00;}
	#iframemod{position: absolute; top:100px; left:188px;}
	#titlemod{position: absolute;top:0px;left:188px;height:100px;width:612px;text-indent:20px;vertical-align:middle;}
	#piemod{position:absolute; top:410px; left:0px; width:800; height:20px; vertical-align:middle;}
/**Fin de modificador*/
/**Para Deus ex Machina **/
#deus {list-style:none;	margin:0;	padding:0;}
#deus li {	margin:2px;	padding:0; //Ya no necesito el padding, tambien quitare el borde que puse antes.
	float:left;}
#deus li a {display:block; width:480px; height:15px; padding:13px 17px 13px 0px; text-decoration:none; text-align:center; font-size:11px; color:#FFCC66; background-image:url(images/libros.jpg); font-weight: bold;}
#deus li a:hover { color:#FFCC00; background-image:url(/images/libros.jpg); background-position:bottom; } 
/**Fin de Deus ex Machina **/
/** Para la galería**/
#menugal {  
	list-style:none;
	margin:0 auto;
	padding:0;
}
#menugal li {
	margin:0px;
	margin-bottom:2px;
	padding:0px; //Ya no necesito el padding, tambien quitare el borde que puse antes.

}
#menugal li a {
	display:block;
	width:300px;
	padding:4px 0;
	text-decoration:none;
	text-align:center;
	font-size:12px;
	color:#FFCC66;
	background-color:#330000;
	border-left:10px solid #FF9933;  //Agrego un borde ancho a la izquierda
}
#menugal li a:hover {
	color:#99CC00;
	background-color:#003366;
	border-left-color:#99CC00; //Luego le cambio el color al borde en el evento hover.
}
div.tomaxa {
		background:#888888 none repeat scroll 0 0;
		border:3px #FF0000;
		color:#000000;
		float:left;
		height:250px;
		text-align:center;
		width:550px;
		vertical-align:middle;
	}
div.foto {
		border:none;
		width:180px;
		height:125px;
		vertical-align:middle;
		float:left;
		padding-left:2px;
	}
  .vhcenter { display: table-cell;  text-align: center;  vertical-align: middle;  width:180px;  height: 125px }  
  .vhcenter * { vertical-align: middle; }  /* IE/Mac \*//*/  .vhcenter { display: block; line-height: 0.6; }  .vhcenter span { display: inline-block;  height: 100%; width: 1px; }  /*El siguiente código sólo se ejecutará en caso de que sea el navegador Internet Explorer*/ 
   .vhcenter span { display: inline-block;  height: 100%; }
   .tituloGal{
	font-size: 16px;
	font-family: Georgia, "Times New Roman", Times, serif;
	font-weight: bold;
	color: #CC6600;
	text-align: left;
	margin-top:0;
	margin-bottom:0;
	font-variant: normal;
	border:0;
}

/** Fin de la Galería **/

/**Clases para texto*/
.titulo1{
	font-size: 16px;
	font-family: Georgia, "Times New Roman", Times, serif;
	font-weight: bold;
	color: #CC6600;
	text-align: left;
	margin-top:0;
	margin-bottom:0;
	font-variant: normal;
	border:0;
}

.titulo2{
	font-size: 14px;
	font-family: Georgia, "Times New Roman", Times, serif;
	font-style: italic;
	font-weight: bold;
	color: #CC9933;
	text-align:left;
	margin-top:0;
	margin-bottom:0;
	border:0;
}

.Estilo4 {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 16px;
	font-weight: bold;
	color: #000000;
	background:url(/images/backTable.jpg) repeat-y;
	text-align: right;
	padding:10px;
}
.TituloTable {
	font-family: Georgia, "Times New Roman", Times, serif;
	font-style: italic;
	font-weight: bold;
	color: #FFCC66;
	font-size: 14px;
}

p{
	font-size: 14px;
	font-family: Georgia, "Times New Roman", Times, serif;
	font-style: normal;
	color: #FFFFFF;
	text-align: justify;	
	margin-top:10;
	margin-bottom:0;
	border:0;
}

.letras{
	font-size: 14px;
	font-family: Georgia, "Times New Roman", Times, serif;
	font-style: normal;
	color: #FFFFFF;
	text-align: center;	
	margin-top:10;
	margin-bottom:0;
	border:0;
}

.publicado{
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 10px;
	font-style: italic;
	line-height: normal;
	color: #CCCC66;
}

.letraPequena{
	border:0;
}