/*
Theme Name: Magna Records
Theme URI: http://www.magnarecords.com/
Description: Tema personalizado para el sitio web de Magna Records.
Version: 1.0
Author: Kiko Ruiz Lloret / KRDiseño
Author URI: http://www.kikoruiz.es/
Tags: magnarecords

	Magna Records v1.0
	http://www.magnarecords.com/plantilla/
	
	This theme was designed and built by Kiko Ruiz Lloret / KRDiseño,
	whose blog you will find at http://www.kikoruiz.es/
	
	The CSS, XHTML and design is released under GPL:
	http://www.opensource.org/licenses/gpl-license.php

*/

* { margin: 0; padding: 0; outline: none; }
html, body, img { margin: 0; padding: 0; border: 0; }
html, body { height: 100%; }
img { display: block; }

body {
	min-width: 960px;
	background: #101010 url(images/fondo.jpg) repeat-y center;
	font: normal 13px/1.6em "Lucida Grande", sans-serif;
	color: white;
	text-align: center;
}

h1 { font: bold 24px/24px "Lucida Grande", sans-serif; }
h2 { font: normal 18px/18px "Lucida Grande", sans-serif; text-transform: uppercase; }
h3 { font: bold 20px/20px "Lucida Grande", sans-serif; }
h4 { font: bold 16px/19px "Lucida Grande", sans-serif; }

p { margin-top: 15px; }

ul { list-style: none; }

a { background-color: inherit; color: #f94731; }
a:link, a:visited { text-decoration: underline; }
a:hover, a:active { text-decoration: none; }

/****************************************
GENERAL
****************************************/

#fondo-pagina { position: relative; min-height: 100%; }

#cabecera-graffiti {
	z-index: 1;
	position: absolute;
	top: 20px;
	right: 0;
	width: 350px;
	height: 120px;
	text-indent: -9999px;
	background-repeat: no-repeat;
	background-position: top left;
}

.graffiti-1 { background-image: url(images/graffiti-1.jpg); }
.graffiti-2 { background-image: url(images/graffiti-2.jpg); }
.graffiti-3 { background-image: url(images/graffiti-3.jpg); }
.graffiti-4 { background-image: url(images/graffiti-4.jpg); }

#cuerpo {
	z-index: 0;
	overflow: hidden;
	padding-bottom: 135px; /* Height of the footer */
	background: url(images/cuerpo-fondo.jpg) no-repeat top center;
}

/****************************************
COLUMNAS
****************************************/

#fondo-contenedor {
	clear: both;
	overflow: hidden;
	float: left;
	width: 100%;
	text-align: left;
}

#alinea-centro {
	position: relative;
	left: 50%;
	float: left;
	width: 200%;
	margin-left: -480px;
	background: url(images/cabecera-fondo.png) repeat-x 0 20px;
}

#alinea-der {
	position: relative;
	left: 960px;
	float: left;
	width: 100%;
}

#col-izq-env, #col-der-env {
	position: relative;
	right: 25%;
	float: left;
	width: 25%;
}

#col-izq, #col-der { overflow: hidden; position: relative; min-height: 150px; }

#col-izq { right: 960px; }
#col-der { right: 480px; }

#col-centro {
	float: left;
	width: 960px;
	margin-left: -960px;
	position: relative;
	right: 50%;
}

/****************************************
CONTENEDOR
****************************************/

#contenedor {
	overflow: hidden;
	width: 920px;
	padding: 20px 20px 0;
	background: url(images/contenedor-fondo.jpg) no-repeat top left;
}

/****************************************
CABECERA
****************************************/

#cabecera { width: 920px; height: 120px; }

/****************************************
NAVEGACIÓN
****************************************/

#navegacion { width: 920px; height: 64px; background: url(images/navegacion-fondo.jpg) no-repeat top left; }

#navegacion ul li { width: auto; float: left; }

#navegacion > ul { position: relative; width: 920px; height: 40px; }

#navegacion > ul > li {
	padding-right: 2px;
	background: url(images/nav-separador.png) no-repeat top right;
	line-height: 40px;
	color: #999;
}

#navegacion > ul > li > a {
	display: block;
	height: 40px;
	padding: 0 15px;
	font: normal 13px/40px "Lucida Grande", sans-serif;
	color: #999;
	text-decoration: none;
}

#navegacion > ul > li > a:hover, #navegacion > ul > li:hover > a { background-color: inherit; background: url(images/nav-sobre.png) repeat-x top; }
#navegacion > ul > li > a:hover { color: white; }

#navegacion > ul > li:hover > ul > li { background: url(images/subnav-sobre.png) repeat-x top; color: white; }

#navegacion > ul > li.current_page_item > a,
#navegacion > ul > li.current-cat > a,
#navegacion > ul > li.sf-breadcrumb > a { background-color: inherit; background: url(images/nav-activo.png) repeat-x top; color: white; cursor: default; }

/* SUB NAVEGACIÓN */

#navegacion > ul > li > ul { position: absolute; height: 24px; }

#navegacion > ul > li > ul > li { margin-left: 1px; padding-left: 15px; }
#navegacion > ul > li > ul > li:first-child { margin-left: 0; }

#navegacion > ul > li > ul > li > a {
	display: block;
	height: 24px;
	margin-right: 15px;
	font: normal 10px/24px "Lucida Grande", sans-serif;
	color: #999;
	text-decoration: none;
	text-transform: uppercase;
}

#navegacion > ul > li > ul > li > a:hover { background-color: inherit; color: white; }

#navegacion > ul > li.current_page_item > ul > li,
#navegacion > ul > li.current-cat > ul > li,
#navegacion > ul > li.sf-breadcrumb > ul > li { background: url(images/subnav-activo.png) repeat-x top; }

/* Buscador */

form#buscador {
	overflow: hidden;
	float: right;
	width: auto;
	height: 24px;
}

form#buscador > div { float: left; width: auto; }

form#buscador > div > label > span { display: none; }

form#buscador > div > label > input {
	height: 18px;
	padding: 4px 5px 2px;
	background-color: inherit;
	background: url(images/busqueda-campo-fondo.png) repeat-x top;
	border: none;
	font: normal 12px/1em "Lucida Grande", sans-serif;
	color: #ccc;
}

form#buscador > p { float: left; margin-top: 0; background: url(images/busqueda-boton.jpg) no-repeat top left; }

form#buscador > p > input {
	width: 32px;
	height: 24px;
	padding: 0;
	background: none;
	border: none;
	font: normal 11px/24px "Lucida Grande", sans-serif;
	text-indent: -9999px;
	cursor: pointer;
}

/****************************************
CONTENIDO
****************************************/

#contenido { width: 920px; min-height: 280px; padding-top: 20px; overflow: hidden; }
#contenido > div { width: auto; float: left; }

#cont-izq { width: 240px; margin-right: 20px; }

#cont-der { width: 660px; }

/****************************************
CONTENIDO IZQUIERDA
****************************************/

/* Hoja izquierda */

.hoja-izq {
	width: 240px;
	padding: 0 0 15px;
	background: url(images/cont-izq-abajo.png) no-repeat bottom left;
}

#slider { position: relative; }

.hoja-izq > div, .hoja-izq > ul, .hoja-izq > p { background: url(images/hoja-izq-fondo.png) repeat-y left; }
.hoja-izq > div { width: 220px; padding: 10px 10px 0; }
.hoja-izq > ul, .hoja-izq > h2 { width: 200px; padding: 10px 20px 6px; }

.hoja-izq > h2 { padding-bottom: 8px; background: url(images/hoja-titular.png) no-repeat top left; }
.hoja-izq > h2:first-child { width: 160px; padding: 20px 60px 10px 20px; background: url(images/hoja-esquina.png) no-repeat top right; }

.hoja-izq > div > div.scroll {
	overflow: auto;
    overflow-x: hidden;
    position: relative;
	clear: left;
	width: 220px;
	height: 80px;
}

.hoja-izq > div > div.scrollContainer { overflow: hidden; height: 80px; }

.hoja-izq > div > div .panel { overflow: hidden; width: 220px; height: 80px; }

.hoja-izq > div > div .panel:hover { background: #f94731 url(images/noticia-fondo-sobre.gif) repeat-x bottom; }

.hoja-izq > div > div .panel > a, .hoja-izq > div > div .panel img, .hoja-izq > div > div .panel p { position: absolute; top: 10px; left: 0; }

.hoja-izq > div > div .panel > a {
	left: 10px;
	z-index: 1;
	width: 60px;
	height: 60px;
	background: url(images/noticia-img-borde.png) no-repeat top right;
	text-indent: -9999px;
}

.hoja-izq > div > div .panel img { z-index: 0; width: 60px; height: 60px; padding: 0 0 10px 10px; background: url(images/noticia-img-sombra.png) no-repeat bottom left; }

.hoja-izq > div > div .panel p { width: 130px; margin: 19px 0 0 80px; font: normal 10px/14px "Lucida Grande", sans-serif; color: #d9d9d9; }
.hoja-izq > div > div .panel p a { font-size: 11px; color: #d9d9d9; }

.hoja-izq > div > div .panel p.panel-fecha { margin-top: 0; font-weight: bold; }

.hoja-izq > div > div .panel:hover p, .hoja-izq > div > div .panel:hover a { color: white; } 

/* Navegación por noticias */

.hoja-izq > p { margin-top: 0; padding: 10px 0 6px; text-align: center; }
.hoja-izq > p img {
	display: inline-block;
	width: 27px;
	height: 24px;
	cursor: pointer;
}

/* Listas */

.hoja-izq > ul > li > a { color: #b2b2b2; }
.hoja-izq > ul > li > a:hover { color: white; }

.hoja-izq > ul#lista-enlaces { padding-bottom: 16px; }

/* Banners */

.banners { margin: 5px 0; padding-bottom: 15px; background: url(images/cont-izq-abajo.png) no-repeat bottom left; }

/****************************************
CONTENIDO DERECHA
****************************************/

/* Próximo evento */

#proximo-evento {
	overflow: hidden;
	width: 620px;
	height: 130px;
	margin-bottom: 20px;
	padding: 20px 20px 0;
	background: url(images/fondo-eventos.jpg) no-repeat top left;
}

#proximo-evento > h2, #proximo-evento > p { width: 400px; }
#proximo-evento > h2 { padding-bottom: 5px; }

#proximo-evento > h4 { margin-top: 15px; }

#proximo-evento > p { margin-top: 0; font: normal 12px/18px "Lucida Grande", sans-serif; }

#proximo-evento > p.evento-fecha { color: #fdc7c1; }

#proximo-evento > p > span { text-transform: capitalize; }

#proximo-evento a { color: white; }

/* Hoja derecha de contenido */

#hoja-cont {
	width: 660px;
	margin-bottom: 5px;
	padding-bottom: 15px;
	background: url(images/contenido-abajo.png) no-repeat bottom left;
	color: #404040;
}

#hoja-cont > h1 {
	width: 580px;
	padding: 20px 60px 6px 20px;
	background-color: inherit;
	background: url(images/contenido-arriba.png) no-repeat top right;
	color: #f94731;
}

#hoja-cont > div, #hoja-cont > ul {
	overflow: hidden;
	width: 620px;
	padding: 0 20px 20px;
	background: url(images/contenido-fondo.gif) repeat-y left;
}

#hoja-cont > div > h3 { width: 580px; padding-top: 20px; border-top: 1px solid #f94731; }
#hoja-cont > div > h3#no-results { font: bold 16px/22px "Lucida Grande", sans-serif; }
#hoja-cont > div > h3 > a { color: #404040; }
#hoja-cont > div > h3 > span { font-weight: normal; }

#hoja-cont > div > p {
	float: right;
	width: 40px;
	height: 47px;
	margin-top: 5px;
	padding: 14px 0 13px 0;
	background-color: inherit;
	background: url(images/noticia-fecha-fondo.jpg) no-repeat top left;
	text-align: center;
	color: white;
	text-transform: lowercase;
}

#hoja-cont > div > p > span { display: block; font: normal 10px/13px "Lucida Grande", sans-serif; text-transform: lowercase; }
#hoja-cont > div > p > span:first-child { font: bold 18px/20px "Lucida Grande", sans-serif; }
#hoja-cont > div > p > span.year { font: bold 10px/15px "Lucida Grande", sans-serif; }

#hoja-cont > div > div.entrada { overflow: hidden; float: left; width: 560px; }
body#page #hoja-cont > div > div.entrada { float: none; width: auto; }

#info-adicional { font: normal 11px/17px "Lucida Grande", sans-serif; color: #b3b3b3; }

#hoja-cont > div > div.entrada > p.editar-entrada { clear: both; }

a.post-edit-link { padding: 2px 5px; background-color: #f94731; color: white; text-decoration: none; }

#hoja-cont > div > div.entrada > p a img.alignleft { float: left; margin: 0 20px 20px 0; }
#hoja-cont > div > div.entrada > p a img.aligncenter { display: block; margin-left: auto; margin-right: auto; }
#hoja-cont > div > div.entrada > p a img.alignright { float: right; margin: 0 0 20px 20px; }

/* Hoja de contenido (a todo el ancho del contenido) */

body#single #hoja-cont { width: 920px; background: url(images/cont-total-abajo.png) no-repeat bottom left; }
body#single #hoja-cont > h1 { width: 840px; background: url(images/cont-total-arriba.png) no-repeat top right; }
body#single #hoja-cont > div { width: 880px; background: url(images/cont-total-fondo.gif) repeat-y left; }
body#single #hoja-cont > div > h3 { width: 840px; }
body#single #hoja-cont > div > div.entrada { width: 820px; }

/* Paginación normal */

#hoja-cont > ul { padding-bottom: 0; }

#hoja-cont > ul > li {
	float: right;
	width: auto;
	margin-bottom: 15px;
	padding-right: 15px;
	background: url(images/noticia-boton-adelante.jpg) no-repeat top right;
}

#hoja-cont > ul > li > a {
	display: block;
	height: 28px;
	padding: 0 15px 0 20px;
	background: url(images/noticia-boton-adelante.jpg) no-repeat top left;
	font: normal 11px/24px "Lucida Grande", sans-serif;
	color: white;
	text-decoration: none;
}

#hoja-cont > ul > li:first-child { float: left; padding: 0 0 0 15px; background: url(images/noticia-boton-atras.jpg) no-repeat top left; }

#hoja-cont > ul > li:first-child > a { padding: 0 20px 0 15px; background: url(images/noticia-boton-atras.jpg) no-repeat top right; }

/* Paginación WP-PageNavi */

#hoja-cont > div.wp-pagenavi { overflow: hidden; background: url(images/cont-nav-linea.gif) no-repeat top center; padding-top: 20px; text-align: center; }

#hoja-cont > div.wp-pagenavi a, #hoja-cont > div.wp-pagenavi span { display: inline-block; padding: 2px 5px; margin: 0 2px; border: none; }

#hoja-cont > div.wp-pagenavi span:first-child { color: #b3b3b3; }

#hoja-cont > div.wp-pagenavi a { background-color: #f94731; color: white; text-decoration: none; }

#hoja-cont > div.wp-pagenavi a:hover { background-color: #404040; text-decoration: underline; }

/****************************************
ESTILOS GENERALES DE CONTENIDO
****************************************/

.entrada h1, .entrada h2, .entrada h3, .entrada h4, .entrada h5, .entrada h6 { margin-top: 15px; }

.entrada h1 { font: bold 18px/18px "Lucida Grande", sans-serif; }
.entrada h2 { font: bold 16px/16px "Lucida Grande", sans-serif; text-transform: none; }
.entrada h3 { font: bold 14px/14px "Lucida Grande", sans-serif; }
.entrada h4 { font: bold 13px/13px "Lucida Grande", sans-serif; }
.entrada h5 { font: bold 12px/12px "Lucida Grande", sans-serif; }
.entrada h6 { font: bold 11px/11px "Lucida Grande", sans-serif; }

.entrada ul, .entrada ol { margin-top: 15px; padding-left: 15px; }
.entrada ul { list-style-type: disc; }

.entrada ul li, .entrada ol li {  }

.entrada ul li ul, .entrada ol li ol { margin-top: 0; }
.entrada ul li ul { list-style-type: circle; font-size: 11px; }

/* Formulario */

#hoja-cont form { margin-top: 20px; }

#hoja-cont form > div { overflow: hidden; clear: both; margin-top: 10px; }

#hoja-cont form > div > label { line-height: 2.5em; }

#hoja-cont form > div > label em, em.obligatorio { color: #f94731; }

#hoja-cont form > div > span, #hoja-cont form > div > label > span { display: block; float: left; width: auto; }

#hoja-cont form > div > label > span:first-child { width: 120px; }

#hoja-cont form > div > span > input, #hoja-cont form > div > label > span > input, #hoja-cont form > div > label > span > textarea, .entrada > form > p input#pwbox-404 {
	width: 244px;
	height: 22px;
	padding: 5px 5px 0;
	border: 3px solid #ccc;
	font: normal 13px/1.4em "Lucida Grande", sans-serif;
	background: #f8f8f8 url(images/form-campo-fondo.gif) repeat-x top;
	color: #404040;
}

#hoja-cont form > div > label > span > textarea { width: 344px; height: auto; }

#hoja-cont form > p.text-captcha { margin-top: 5px; color: #999; }

#hoja-cont form > p.text-captcha, #hoja-cont form > div.cont-captcha, #hoja-cont form > p.submit { padding-left: 120px; }

#hoja-cont form > div.cont-captcha { margin-top: 5px; }

#hoja-cont form > div.cont-captcha > img { margin-bottom: 10px; }

div.wpcf7-response-output { margin: 0 !important;  padding: 0 !important; }
div.wpcf7-mail-sent-ok { border: none !important; color: green !important; }
div.wpcf7-mail-sent-ng { border: none !important; color: #f94731 !important; }
div.wpcf7-spam-blocked { border: none !important; color: #f94731 !important; }
div.wpcf7-validation-errors { border: none !important; color: #f94731 !important; }

/* Formulario para el acceso a páginas protegidas con contraseña */

.entrada > form { padding-bottom: 10px; }
.entrada > form > p:first-child { margin-top: 0; }
.entrada > form > p input#pwbox-404 { margin-top: 5px; } 
.entrada > form > p > input { margin-top: 15px; }

/****************************************
PIE
****************************************/

#pie {
	clear: both;
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100%;
	height: 135px; /* Height of the footer */
	background: url(images/pie-fondo.png) repeat-x top;
	text-align: center;
}

#pie > div {
	position: relative;
	overflow: hidden;
	width: 920px;
	margin: 0 auto;
	padding: 20px;
	background: url(images/pie-sombra-sup.png) no-repeat 0 1px;
	text-align: left;
}

#pie > div > p {
	width: auto;
	float: right;
	margin-top: 0;
	background-color: inherit;
	font: normal 12px/24px "Lucida Grande", sans-serif;
	color: #f94731;
}

#pie > div > p a, #pie > div > ul > li { color: #b2b2b2; }
#pie > div > p a:hover { color: white; }

#pie > div > p#creditos {
	position: absolute;
	top: 50px;
	left: 20px;
	float: none;
	margin-top: 0;
	color: #666;
}

#pie > div > p#creditos > a { color: #666; }

#pie > div > p#creditos > a:hover { color: white; }

#pie > div > ul { float: left; width: auto; }

#pie > div > ul > li { display: inline; }
#pie > div > ul > li:after  { content: " |"; }

#pie > div > ul > li#arriba:after  { content: ""; }

#pie > div > ul > li > a { color: #b2b2b2; text-decoration: none; font-size: 12px; }
#pie > div > ul > li > a:hover, #pie > div > ul > li.current_page_item > a, #pie > div > ul > li.current-cat > a { color: white; text-decoration: underline; }
#pie > div > ul > li.current_page_item > a, #pie > div > ul > li.current-cat > a { text-decoration: none; }

#pie > div > ul#logos-pie {
	clear: both;
	overflow: hidden;
	width: 100%;
	padding-top: 10px;
	border-top: 1px solid #f94731;
}

#pie > div > ul#logos-pie > li:after  { content: ""; }

#pie > div > ul#logos-pie > li > a {
	display: block;
	float: right;
	width: auto;
	height: 60px;
	margin-left: 10px;
	background: url(images/logos-pie.png) no-repeat 0 0;
	text-indent: -9999px;
}

#pie > div > ul#logos-pie > li > a#logo-halloffame { width: 81px; background-position: 0 0; }
#pie > div > ul#logos-pie > li > a#logo-halloffame:hover { background-position: 0 -60px; }

#pie > div > ul#logos-pie > li > a#logo-lbc { width: 58px; background-position: -81px 0; }
#pie > div > ul#logos-pie > li > a#logo-lbc:hover { background-position: -81px -60px; }

#pie > div > ul#logos-pie > li > a#logo-nach { width: 88px; background-position: -139px 0; }
#pie > div > ul#logos-pie > li > a#logo-nach:hover { background-position: -139px -60px; }