/********************************************************************************
 *	mapa.css - Archivo de estilos para los mapas de letras de Aventura y CÍA v3	* 
 ********************************************************************************
 *	Aquí se definen todos los estilos para construir los mapas de letras para		*
 *	los índices de Aventura y CÍA v3: reviews.php y juegos.php.									*
 *																																							*
 *	Aunque bien es cierto que se podían haber hecho en modo texto, se ha				*
 *	preferido por motivos de diseño construirlos a partir de juegos de					*
 *	imágenes, pero cuidando siempre la accesibilidad del conjunto. Se utiliza		*
 *	la fabulosa técnica para evitar el retraso de carga de la imagen rollover		*
 *	que quién sabe que mente preclara inventó pero que yo descubrí gracias a		*
 *	Ramón Pravia en su blog Caótico Neutral:																		*
 *	http://simplelogica.net/caoticoneutral/?p=26. Gracias a él.									*
 *																																							*
 *	Autor:	Javier Cadenas																											*
 *	Fecha:	abril de 2006		Última modificación:	noviembre de 2007							*
 ********************************************************************************/
#mapa
{
	margin-right: 30px;
}
#mapa a, #mapa .separador
{
	display: block;
	float: left;
}
#mapa a, #mapa p, #mapa span
{
	background-position: 0 0;
	background-repeat: no-repeat;
	height: 25px;
	padding-bottom: 0;
}
#mapa a:hover
{
	background-position: 0 -25px;
}
#mapa_general, #mapa_letras, #mapa_ordenar_por
{
	margin: 0 auto;
}
#mapa_general a#filtro_todo
{
	background-image: url(../imagenes/diseno_web/filtro_todo.jpg);
	width: 72px;
}
#mapa_letras
{
	width: 700px;
}
#mapa_letras a
{
	width: 17px;
}
#mapa_letras .separador
{
	background-image: url(../imagenes/diseno_web/separador.jpg);
	width: 9px;
}
#mapa_ordenar_por
{
	background-image: url(../imagenes/diseno_web/ordenar_por.jpg);
	padding-left: 120px;
	width: 299px;
}
#mapa_ordenar_por a#orden_lanzamiento
{
	background-image: url(../imagenes/diseno_web/orden_lanzamiento.jpg);
	width: 109px;
}
#mapa_ordenar_por a#orden_nombre
{
	background-image: url(../imagenes/diseno_web/orden_nombre.jpg);
	width: 68px;
}
#mapa_ordenar_por a#orden_puntuacion
{
	background-image: url(../imagenes/diseno_web/orden_puntuacion.jpg);
	width: 100px;
}
#mapa_ordenar_por .separador
{
	background-image: url(../imagenes/diseno_web/separador2.jpg);
	width: 11px;
}
#a
{
	background: url(../imagenes/diseno_web/a.jpg) no-repeat;
}
#b
{
	background: url(../imagenes/diseno_web/b.jpg) no-repeat;
}
#c
{
	background: url(../imagenes/diseno_web/c.jpg) no-repeat;
}
#d
{
	background: url(../imagenes/diseno_web/d.jpg) no-repeat;
}
#e
{
	background: url(../imagenes/diseno_web/e.jpg) no-repeat;
}
#f
{
	background: url(../imagenes/diseno_web/f.jpg) no-repeat;
}
#g
{
	background: url(../imagenes/diseno_web/g.jpg) no-repeat;
}
#h
{
	background: url(../imagenes/diseno_web/h.jpg) no-repeat;
}
#i
{
	background: url(../imagenes/diseno_web/i.jpg) no-repeat;
}
#j
{
	background: url(../imagenes/diseno_web/j.jpg) no-repeat;
}
#k
{
	background: url(../imagenes/diseno_web/k.jpg) no-repeat;
}
#l
{
	background: url(../imagenes/diseno_web/l.jpg) no-repeat;
}
#m
{
	background: url(../imagenes/diseno_web/m.jpg) no-repeat;
}
#n
{
	background: url(../imagenes/diseno_web/n.jpg) no-repeat;
}
#num
{
	background: url(../imagenes/diseno_web/num.jpg) no-repeat;
}
#o
{
	background: url(../imagenes/diseno_web/o.jpg) no-repeat;
}
#p
{
	background: url(../imagenes/diseno_web/p.jpg) no-repeat;
}
#q
{
	background: url(../imagenes/diseno_web/q.jpg) no-repeat;
}
#r
{
	background: url(../imagenes/diseno_web/r.jpg) no-repeat;
}
#s
{
	background: url(../imagenes/diseno_web/s.jpg) no-repeat;
}
#t
{
	background: url(../imagenes/diseno_web/t.jpg) no-repeat;
}
#todo
{
	background: url(../imagenes/diseno_web/todo.jpg) no-repeat;
}
#u
{
	background: url(../imagenes/diseno_web/u.jpg) no-repeat;
}
#v
{
	background: url(../imagenes/diseno_web/v.jpg) no-repeat;
}
#w
{
	background: url(../imagenes/diseno_web/w.jpg) no-repeat;
}
#x
{
	background: url(../imagenes/diseno_web/x.jpg) no-repeat;
}
#y
{
	background: url(../imagenes/diseno_web/y.jpg) no-repeat;
}
#z
{
	background: url(../imagenes/diseno_web/z.jpg) no-repeat;
}
a#filtro_almohadilla
{
	background-image: url(../imagenes/diseno_web/filtro_almohadilla.jpg);
	width: 20px;
}
a#filtro_a
{
	background-image: url(../imagenes/diseno_web/filtro_a.jpg);
}
a#filtro_b
{
	background-image: url(../imagenes/diseno_web/filtro_b.jpg);
}
a#filtro_c
{
	background-image: url(../imagenes/diseno_web/filtro_c.jpg);
}
a#filtro_d
{
	background-image: url(../imagenes/diseno_web/filtro_d.jpg);
}
a#filtro_e
{
	background-image: url(../imagenes/diseno_web/filtro_e.jpg);
}
a#filtro_f
{
	background-image: url(../imagenes/diseno_web/filtro_f.jpg);
}
a#filtro_g
{
	background-image: url(../imagenes/diseno_web/filtro_g.jpg);
}
a#filtro_h
{
	background-image: url(../imagenes/diseno_web/filtro_h.jpg);
}
a#filtro_i
{
	background-image: url(../imagenes/diseno_web/filtro_i.jpg);
}
a#filtro_j
{
	background-image: url(../imagenes/diseno_web/filtro_j.jpg);
}
a#filtro_k
{
	background-image: url(../imagenes/diseno_web/filtro_k.jpg);
}
a#filtro_l
{
	background-image: url(../imagenes/diseno_web/filtro_l.jpg);
}
a#filtro_m
{
	background-image: url(../imagenes/diseno_web/filtro_m.jpg);
}
a#filtro_n
{
	background-image: url(../imagenes/diseno_web/filtro_n.jpg);
}
a#filtro_o
{
	background-image: url(../imagenes/diseno_web/filtro_o.jpg);
}
a#filtro_p
{
	background-image: url(../imagenes/diseno_web/filtro_p.jpg);
}
a#filtro_q
{
	background-image: url(../imagenes/diseno_web/filtro_q.jpg);
}
a#filtro_r
{
	background-image: url(../imagenes/diseno_web/filtro_r.jpg);
}
a#filtro_s
{
	background-image: url(../imagenes/diseno_web/filtro_s.jpg);
}
a#filtro_t
{
	background-image: url(../imagenes/diseno_web/filtro_t.jpg);
}
a#filtro_u
{
	background-image: url(../imagenes/diseno_web/filtro_u.jpg);
}
a#filtro_v
{
	background-image: url(../imagenes/diseno_web/filtro_v.jpg);
}
a#filtro_w
{
	background-image: url(../imagenes/diseno_web/filtro_w.jpg);
	width: 21px;
}
a#filtro_x
{
	background-image: url(../imagenes/diseno_web/filtro_x.jpg);
}
a#filtro_y
{
	background-image: url(../imagenes/diseno_web/filtro_y.jpg);
}
a#filtro_z
{
	background-image: url(../imagenes/diseno_web/filtro_z.jpg);
}