@charset "iso-8859-1";

/* General: estas reglas se utilizan globalmente en toda la web */

html, * {font-family: Arial, Helvetica, sans-serif;}
body, div, span, p, a, img, input, select, textarea, h1, h2, h3, h4, h5, h6, hr {margin: 0px; padding: 0px; border: 0px none;}
body {background: url(../img/web/fondoPagina.jpg) top repeat-x #CCC; font-size: 9pt;}
input, select, textarea {font-size: 9pt;}
input.formulario {height: 16px; border: 1px solid #CCC; padding: 2px;}
select.formulario, textarea.formulario {border: 1px solid #CCC; padding: 2px;}
/*CodeRed*/input.formularioBoton {background: url(../img/web/botonTuneado.png) no-repeat; padding-left:3px; padding-right:3px; display: inline-block; vertical-align: middle; height: 25px; font-size: 10pt; color: #FFF; text-decoration: none; font-stretch: ultra-expanded; font-weight: 600; cursor: pointer;}
a {color: #416385; cursor: pointer; text-decoration: none;}
a:hover {text-decoration: underline;}
a:visited {color: #6d90b3;}
h1 {font-size: 18pt;}
h2 {font-size: 14pt;}
h3 {font-size: 11pt;}
table {border-collapse: collapse;}
/*CodeRed*/table td {padding: 2px;}
p {font-size: 9pt; text-align: justify;}
/*CodeRed*/ a.enlaceAdministracion {border: 1px solid #F00; background-color: #FFC5C5; color: #000; font-weight: bold; text-decoration: none; padding: 0px 1px 0px 1px; font-size: 9pt;}
/*CodeRed*/ a.enlaceAdministracion:hover {background-color: #FF6565;}

.spoiler {display: none; background-color: #FF9;}
.enlacespoiler a {background-color: #666666; border: 1px #000 solid; padding: 0px 2px; color: #FFF; text-decoration: none;}
.enlacePlataforma {padding: 2px 5px; border-radius: 5px; margin-right: 5px; color: #FFF;}

hr {clear: both; padding: 3px 0px 0px 0px; margin: 0px 0px 3px 0px; height: 1px; border-bottom: 1px dotted #999;}
.degradado {background-image: url(../img/web/fondoDegradado.png); background-position: bottom; background-repeat: repeat-x;}
.izquierda {float: left;}
.derecha {float: right;}
.textoDerecha {text-align: right;}
.textoCentrado {text-align: center;}
.textoJustificado {text-align: justify;}
.textoPeque {font-size: 8pt;}
.animAjax {background: url(../img/web/ajax.gif) center no-repeat;}
.textoAjax {background: url(../img/web/ajax.gif) 0px 50% no-repeat; padding: 3px 0px 3px 25px;}
.clear {clear: both;}
.ocultar {display: none !important;}


a.botonTuneado {display: inline-block; cursor: pointer; padding: 0px 10px; height: 23px; line-height: 23px; font-size: 10pt; color: #FFF; text-align: center; text-decoration: none; font-stretch: ultra-expanded; font-weight: 600; border-radius: 5px; border: 1px solid #dadada; background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, rgb(139,139,139)), color-stop(0.48, rgb(78,79,78)), color-stop(0.49, rgb(58,58,57)), color-stop(1, rgb(0,0,0))); background-image: -moz-linear-gradient(center top, rgb(139,139,139) 0%, rgb(79,79,78) 48%, rgb(58,58,57) 49%, rgb(0,0,0) 100%); background-image: -o-linear-gradient(top, rgb(139,139,139) 0%, rgb(78,79,78) 48%, rgb(58,58,57) 49%, rgb(0,0,0) 100%);}
a.botonTuneado:hover {color: #333; text-decoration: none; border-color: #FC0; background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, rgb(255,236,154)), color-stop(1, rgb(255,204,0))); background-image: -moz-linear-gradient(center top, rgb(255,236,154) 0%, rgb(255,204,0) 100%); background-image: -o-linear-gradient(top, rgb(255,236,154) 0%, rgb(255,204,0) 100%); text-shadow: 1px 1px 1px #FFF;}

a.botonTuneadoJS {border: 0px none; height: 25px; line-height: 23px; position: relative; cursor: pointer;}
a.botonTuneadoJS span {display: inline-block; height: 25px; line-height: 25px; background: url(../img/web/botonTuneado.png) no-repeat;}
a.botonTuneadoJS span img {vertical-align: middle;}
a.botonTuneadoJS .i {width: 10px; background-position: top left; position: absolute; left: 0px; top: 0px;}
a.botonTuneadoJS .c {background-position: top center; text-align: center;}
a.botonTuneadoJS .d {width: 10px; background-position: top right; position: absolute; right: 0px; top: 0px;}
a.botonTuneadoJS:hover .i {background-position: bottom left;}
a.botonTuneadoJS:hover .c {background-position: bottom center; text-align: center;}
a.botonTuneadoJS:hover .d {background-position: bottom right;}

a.botonCerrarPeque {display: inline-block; vertical-align: middle; width: 12px; height: 12px; background: url(../img/web/iconoCerrarPeque.png) top;}
a.botonCerrarPeque:hover {background-position: bottom;}
.marcadorPeque {display: block; width: 80px; height: 40px; line-height: 40px; background: url(../img/web/fondoNotaPeque.png) center no-repeat; font-family: Impact, Arial; font-size: 24pt; color: #FFF; text-align: center;}
.marcadorGrande {display: block; width: 100px; height: 50px; line-height: 50px; background: url(../img/web/fondoNotaGrande.png) center no-repeat; font-family: Impact, Arial; font-size: 28pt; color: #FFF; text-align: center;}
a.marcadorPeque, a.marcadorGrande {cursor: pointer; text-decoration: none; color: #FFF}

.opcionesAdministracion {padding: 1px;}
.opcionesAdministracion a {border: 1px solid #F00; background-color: #FFC5C5; color: #000; font-weight: bold; text-decoration: none; padding: 0px 1px 0px 1px; font-size: 7pt;}
.opcionesAdministracion a:hover {background-color: #FF6565;}
.advertenciaAdministracion {background-color:#ffeeee; border: 1px solid red; padding: 5px;}
.estiloFechaHoy {color: #009900;}
.estiloFechaAyer {color: #005500;}
.estiloFechaOtroDia {color: #000;}

#barraNavegacion {height: 15px; padding-left: 3px; border: 1px solid #CCC; border-collapse: collapse; margin-bottom: 15px; background-image: url(../img/web/fondoBarraNavegacion.png); background-position: center; background-repeat: repeat-x;}
#barraNavegacion a {color: #000; border: 0px none; margin-left: 3px; text-transform: uppercase; font-weight: bold; text-decoration: none; float: left;}
#barraNavegacion a:hover {text-decoration: underline;}
#barraNavegacion .separadorBarraNavegacion {width: 15px; height: 15px; background: url(../img/web/separadorBarraNavegacion.png) center no-repeat; float: left;}
#barraNavegacion span {margin-left: 3px; text-decoration: none; color: #000;}

.paginacion {margin: 20px 0px; clear: both; text-align: center;}
.paginacion span.seleccionado, .paginacion a {display: inline-block; min-width: 12px; height: 20px; line-height: 20px; padding: 0px 4px; margin: 0px 1px; border: 1px solid #416385; text-align: center; text-decoration: none; border-radius: 2px;}
.paginacion span.seleccionado, .paginacion a:hover {text-decoration: none; background: #416385; color: #FFF;}


.navegacion {height: 25px; margin: 20px 0px; clear: both; text-align: center;}
.navegacion .izquierda {width: 150px; float: left; text-align: left;}
.navegacion .centro {width: 530px; line-height: 25px; float: left; text-align: center;}
.navegacion .derecha {width: 150px; float: right; text-align: right;}
.navegacion .botonTuneado {border-color: #7e7e7e; background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, rgb(207,207,207)), color-stop(1, rgb(151,151,151))); background-image: -moz-linear-gradient(center top, rgb(207,207,207) 0%, rgb(151,151,151) 100%); background-image: -o-linear-gradient(top, rgb(207,207,207) 0%, rgb(151,151,151) 100%); text-shadow: 1px 1px 1px #111;}
.navegacion .botonTuneado:hover {border-color: #1a5189; background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, rgb(74,127,181)), color-stop(1, rgb(55,108,162))); background-image: -moz-linear-gradient(center top, rgb(74,127,181) 0%, rgb(55,108,162) 100%); background-image: -o-linear-gradient(top, rgb(74,127,181) 0%, rgb(55,108,162) 100%); color: #FFF; text-shadow: 1px 1px 1px #111;}
.navegacion .botonTuneado:hover {background-position: bottom;}
.navegacion .izquierda .botonTuneadoJS span {background-image:url(../img/web/botonTuneadoFlechaIzquierda.png);}
.navegacion .derecha .botonTuneadoJS span {background-image:url(../img/web/botonTuneadoFlechaDerecha.png);}
.navegacion .botonTuneado {width: 130px; color: #FFF;}

a.enlaceUsuarios {padding: 3px 3px 3px 30px; background-position: 2px 50%; background-repeat: no-repeat; font-size: 12pt;}
.usuarioCatalogo {background-image: url(../img/web/iconoUsuarioJuegos.png);}
.usuarioDeseos {background-image: url(../img/web/iconoUsuarioDeseos.png);}
.usuarioFavoritos {background-image: url(../img/web/iconoUsuarioFavoritos.png);}
.usuarioVenta {background-image: url(../img/web/iconoUsuarioVenta.png);}
.usuarioCompra {background-image: url(../img/web/iconoUsuarioCompra.png);}

/* Formularios */

.cuadroOpciones {border: 1px solid #CCC; background: #FAFAFA; padding: 10px;}
.cuadroOpciones h4 {font-size: 9pt; margin-bottom: 10px;}

.campo {clear: both; display: table; margin-bottom: 5px;}
.campo label.rotulo {width: 160px; float: left;}
.campo .opciones {width: 600px; float: left;}
.campo .formulario {width: 500px;}
.campo .peque {width: 40px;}
.campo .radio {margin-right: 5px;}
.campo p {font-size: 8pt; color: #555; margin-top: 3px;}
.campo .error {background: url(../img/web/icono_advertencia.png) 0px 50% no-repeat; color: #F00; padding-left: 20px; line-height: 16px;}
.campoBotones {height: 25px; margin-top: 15px; text-align: right;}
.campoBotones .botonTuneado .c {min-width: 120px;}

.formularioRespuesta {padding: 10px; margin: 20px 0px;}
.formularioRespuesta h4 {font-size: 12pt; margin-bottom: 10px;}
.formularioRespuesta .campo {clear: both; display: table; margin-bottom: 5px;}
.formularioRespuesta label.rotulo {float: none; font-weight: bold;}
.formularioRespuesta .formulario {width: 804px;}
.formularioRespuesta textarea {height: 220px;}
.formularioRespuesta textarea.textoArticulo {height: 450px;}
.formularioRespuesta .editor {margin-top: 5px; padding: 3px; border: 1px solid #CCC; background: #efefef; border-bottom: 0px none;}
.formularioRespuesta .editor ul {height: 18px; margin: 0px; padding: 0px;}
.formularioRespuesta .editor li {list-style: none; float: left; margin-right: 2px;}
.formularioRespuesta .editor li a {display: block; border: 1px solid transparent;}
.formularioRespuesta .editor li a:hover {border-color: #CCC; background: #e5e5e5;}
.formularioRespuesta .editor li a.botonCuadrado {width: 16px; height: 16px;}
.formularioRespuesta .editor li a.botonTexto {height: 16px; line-height: 16px; padding: 0px 2px; text-decoration: none;}
.formularioRespuesta .editor li .separador {border-left: 2px outset #CCC; width: 2px; height: 16px; margin: 0px 1px;}
.formularioRespuesta .editor li select {border: 1px solid #CCC;}
.formularioRespuesta .capaSmileys {padding: 0px 2px; margin: 5px 0px; position: relative;}
.formularioRespuesta .capaSmileys .botonScrollSmileys {position: absolute; top: 50%; margin-top: -13px; border: 1px solid transparent; background: url(../img/editorFormulario/scroll-smileys.png) no-repeat; display: block; width: 25px; height: 25px;}
.formularioRespuesta .capaSmileys .botonScrollSmileys:hover {border-color: #CCC; background-color: #e5e5e5;}
.formularioRespuesta .capaSmileys .botonScrollSmileys.atras {background-position: left 50%; left: 0px;}
.formularioRespuesta .capaSmileys .botonScrollSmileys.adelante {background-position: right 50%; left: 100%; margin-left: -27px;}
.formularioRespuesta .capaSmileys .scroll {overflow: hidden; margin: 0px; min-height: 16px; max-height: 64px;}
.formularioRespuesta .capaSmileys .scroll a {margin: 0px 4px;}
.formularioRespuesta .capaSmileys .scroll a img {max-height: 64px;}
.formularioRespuesta .capaSmileys .scroll.conBotones {margin: 0px 30px;}
.formularioRespuesta .capaSmileys .enlaceMasSmileys {position: absolute; left: 100%; top: 50%; margin: -5px 0px 0px -80px;}
.formularioRespuesta .postMensaje {margin: 5px 0px; padding: 10px; border: 1px dotted #333; background: #ffe476; color: #111;}
.formularioRespuesta .pie {height: 25px; line-height: 25px; margin: 5px 0px;}
.formularioRespuesta .pie .botones {line-height: 25px; float: left;}
.formularioRespuesta .pie .botones .botonTuneado {margin-right: 5px;}
.formularioRespuesta .pie .botones input {vertical-align: middle; margin: 0px 2px 0px 10px;}
.formularioRespuesta .pie .botones label {line-height: 25px;}
.formularioRespuesta .pie .enviando {background: url(../img/web/ajax.gif) 5px 50% no-repeat #FF9; border: 1px dotted #CCC; padding: 2px 5px 2px 26px; float: right;}
.formularioRespuesta .pie .guardado {background-color: #CFC; background-image: url(../img/web/guardado.png);}
.formularioRespuesta .tituloNoticia {margin-left: 100px; clear: none;}
.formularioRespuesta .tituloNoticia .formulario {width: 704px;}
.formularioRespuesta .cuadroTipoNoticia {width: 95px; float: left;}
.formularioRespuesta .cuadroTipoNoticia select {width: 95px;}
.formularioRespuesta .textoNoticia {width: 650px; float: left;}
.formularioRespuesta .textoNoticia .formulario {width: 644px;}
.formularioRespuesta .plataformasNoticia {margin-left: 655px;}
.formularioRespuesta .plataformasNoticia select {width: 153px; height: 249px;}
.formularioRespuesta .plataformasNoticia .selectMultiple {margin-top: 5px;}


/* Megabanner de la portada */

.megaBanner {width: 520px; height: 250px; background: #FFF;}
.megaBanner .scrollBanners {width: 520px; height: 200px; background: center no-repeat; overflow: hidden;}
.megaBanner ul {margin: 0px; padding: 0px;}
.megaBanner .scrollBanners li .texto {height: 34px; margin-top: 150px; padding: 8px 10px; background: url(../img/web/megabanner.png) 0px -150px repeat-x; color: #FFF;}
.megaBanner .scrollBanners li .texto h3 {font-size: 12pt;}
.megaBanner .scrollBanners li .texto h3 span {padding-left: 10px; font-size: 8pt;}
.megaBanner .boton {display: block; width: 20px; height: 50px; background: url(../img/web/megabanner.png) top no-repeat; cursor: pointer;}
.megaBanner a.izquierda {background-position: left top;}
.megaBanner a.derecha {background-position: right top;}
.megaBanner a.izquierda:hover {background-position: 0px -50px;}
.megaBanner a.derecha:hover {background-position: -20px -50px;}
.megaBanner .scrollMiniaturas {width: 480px; height: 50px; float: left; overflow: hidden;}
.megaBanner li {list-style: none; width: 520px; height: 200px; float: left; background: center no-repeat;}
.megaBanner li a {display: block; height: 100%; text-decoration: none;}
.megaBanner .scrollMiniaturas ul {height: 50px;}
.megaBanner .scrollMiniaturas li {width: 96px; height: 50px;}
.megaBanner .scrollMiniaturas li a.seleccionado {background-image: url(../img/web/megabanner.png); background-position: 0px -100px; background-repeat: repeat-x;}
.megaBanner .scrollMiniaturas li a {width: 86px; height: 40px; padding: 5px;}
.megaBanner .scrollMiniaturas li a img {width: 86px; height: 40px;}


/* Encuestas */

.encuesta {font-size: 9pt; padding: 5px;}
.encuesta h2 {margin-bottom: 5px;}
.encuesta input {vertical-align: middle; margin-right: 5px;}
.encuesta .textoPregunta {margin-bottom: 4px; font-weight: bold;}
.encuesta .opcion {margin-bottom: 4px;}
.encuesta .respuesta {height: 15px; margin: 3px 0px 5px 0px;}
.encuesta .respuesta .porcentaje {font-size: 8pt; width: 40px; float: left;}
.encuesta .respuesta .barra {height: 11px; border: 1px solid #CCC; padding: 1px; margin-left: 40px;}
.encuesta .respuesta .barra div {height: 11px;}


/* Cabecera de la página. Abarca el logotipo de la web y la zona donde aparece la información del usuario */

#marcoCabecera {height: 100px; background: #333;}
#marcoCabecera .contenido {width: 974px; height: 100%; margin: 0px auto; position: relative;}
#marcoCabecera #areaUsuario {position: absolute; right: 0px; top: 5px;}
#areaUsuario div.login {color: #DDD;}
#areaUsuario div.login .campos {width: 250px; height: 60px; float: left;}
#areaUsuario div.login .campos label {display: block; float: left; width: 110px; line-height: 21px; margin-bottom: 5px;}
#areaUsuario div.login .campos input {width: 120px; margin-bottom: 5px;}
#areaUsuario div.login .opciones {width: 250px; float: right; text-align: center;}
#areaUsuario div.login .opciones .linea {line-height: 25px;}
#areaUsuario div.login .botones .anim {width: 110px;}
#areaUsuario div.login .botones .anim #textoIniciandoSesion {padding-left: 25px; line-height: 25px; background: url(../img/web/iniciandoSesion.gif) 0px 50% no-repeat; visibility: hidden;}
#areaUsuario div.login .botones #botonIniciarSesion .c {width: 104px;}
#areaUsuario div.login a.recordarClave {clear: both; display: block; color: #FFF;}

#areaUsuario .panelUsuario {height: 80px; padding: 5px; margin-right: 85px; color: #FFF;}
#areaUsuario .panelUsuario a.Nick {font-size: 12pt; color: #EEE; text-decoration: none;}
#areaUsuario .panelUsuario a.Nick:hover {color: #FC0;}
#areaUsuario .panelUsuario .vjs {font-size: 7pt;}
#areaUsuario .panelUsuario .marcoAQueEstasJugando {height: 19px; padding: 4px 0px;}
#areaUsuario .panelUsuario #aQueEstasJugando {width: 405px; padding: 1px 0px; background: #333; border: 1px solid #333; font-style: italic; color: #CCC; text-align: right;}
#areaUsuario .panelUsuario #aQueEstasJugando.seleccionado {background: #FFF; border: 1px solid #CCC; font-style: normal; color: #222; text-align: left;}
#areaUsuario .panelUsuario .marcoAQueEstasJugando span {line-height: 19px; padding-left: 25px; background: 0px 50% no-repeat;}
#areaUsuario .panelUsuario .marcoAQueEstasJugando .enviando {background-image: url(../img/web/iniciandoSesion.gif);}
#areaUsuario .panelUsuario .marcoAQueEstasJugando .mensajeok {background-image: url(../img/web/tick.png); color: #AFA;}
#areaUsuario .panelUsuario .marcoAQueEstasJugando .botonCerrarPeque {margin-left: 5px;}
#areaUsuario li {margin-left: 5px; float: left; list-style: none;}
#areaUsuario li a {display: block; width: 24px; height: 24px; padding: 3px; border-radius: 5px; border: 1px solid #555; position: relative; outline: 0px;}
#areaUsuario li a:hover {background-color: #CCC; border-color: #DDD;}
#areaUsuario li a .numeroMensajes {position: absolute; right: 2px; bottom: 2px; width: 12px; height: 12px; border-radius: 6px; background: #F00; color: #FFF; line-height: 12px; text-align: center; font-size: 6pt;}
#areaUsuario li a.seleccionado {border: 1px solid #555; border-radius: 5px 5px 0px 0px; border-bottom: 0px none; background: #FFF; z-index: 101;}
#areaUsuario img.Avatar {position: absolute; right: 0px; top: 5px; width: 80px; height: 80px;}


/* Barra con los botones de divisiones de plataformas */

#barraPlataformas {height: 30px; background: url(../img/web/fondoPlataformas.png) top repeat-x; text-align: center;}
#barraPlataformas .contenido {width: 974px; margin: 0px auto; text-align: left;}
#barraPlataformas ul {float: left; margin: 0px; padding: 0px;}
#barraPlataformas li {list-style: none; float: left; line-height: 30px; color: #FFF; letter-spacing: -1px;}
#barraPlataformas li img {margin-right: 5px; vertical-align: middle;}
#barraPlataformas a, #barraPlataformas li.seleccionado {text-decoration: none; display: block; padding: 0px 8px; height: 30px; color: #FFF; border-radius: 5px 5px 0px 0px;}
#barraPlataformas a:hover {background: url(../img/web/fondoPlataformas.png) bottom repeat-x;}
#barraPlataformas a.botonConfigurarMiVJ {text-decoration: none; display: block; padding: 0px 8px; line-height: 30px; height: 30px; float: right;}

/* Barra con el buscador de juegos y los botones de las tiendas online */

#barraBuscador {width: 100%; height: 30px; background-image: url(../img/web/fondoBarraBuscador.png); background-position: center; background-repeat: repeat-x; border-bottom: 1px solid #666; text-align: center; z-index: 2;}
#barraBuscador .contenido {width: 974px; color: #FFF; margin: 0px auto 0px auto; padding-top: 4px; font-size: 9pt; text-align: left; position: relative;}
#barraBuscador .contenido #buscadorJuegos {float: left;}
#barraBuscador .contenido .botonesTienda {float: right;}
#barraBuscador .contenido .botonesTienda a {display: inline-block; margin-left: 5px; height: 24px; background: url(../img/web/botonTienda.png) left top;}
#barraBuscador .contenido .botonesTienda a.botonTienda {width: 160px; background-position: left top;}
#barraBuscador .contenido .botonesTienda a.botonCarrito {width: 30px; background-position: right top;}
#barraBuscador .contenido .botonesTienda a.botonTienda:hover {background-position: left bottom;}
#barraBuscador .contenido .botonesTienda a.botonCarrito:hover {background-position: right bottom;}
#barraBuscador .iconosRedesSociales {position: absolute; right: 0px; top: 0px; line-height: 30px;}
#barraBuscador .iconosRedesSociales img {vertical-align: middle;}

/* Publicidad superior */
#publicidadSuperior {margin: 4px auto; width: 728px; height: 90px; overflow: hidden; position: relative;}


/* Es el marco que contiene el cuerpo de la página. El cuerpo a su vez contiene el menú izquierdo y el contenido la página  */
#marcoPagina {width: 974px; margin: 0px auto 20px auto; border: 1px solid #333; background: url(../img/web/bandaLateral.gif) left repeat-y #FFF; display: table;}


/* Columna de la izquierda, que contiene el menú de la izquierda y la publicidad lateral */
#columnaIzquierda {width: 130px; float: left;}
#menuLateral {width: 120px; margin: 0px; padding: 20px 0px 5px 10px; background: #666; color: #BBB; text-transform: uppercase; font-size: 10pt;}
#menuLateral ul {margin: 5px 0px 20px 5px; padding: 0px;}
#menuLateral li {list-style: none;}
#menuLateral li a {font-size: 10pt; color: #EEE; text-transform: capitalize; text-decoration: none; padding-left: 6px;}
#menuLateral li a:hover {color: #FC0; border-left: 3px solid #FC0; padding-left: 3px;}
#publicidadLateral {width: 120px; padding: 5px; overflow: hidden; position: relative;}


/* Este div alberga el contenido de cada página. El ancho efectivo que se puede utilizar en cada página es de 830 píxels */
#contenidoPagina {width: 830px; background: #FFF; padding: 5px 7px 10px 0px; float: right;}


/* Pie de página, incluye el mapa web y la barra de copyright */
#piePagina {background-color: #666; border-top: 3px solid #777; text-align: center;}
#piePagina #contenido {display: table; width: 974px; margin: 20px auto 20px auto; text-align: center;}
#piePagina ul {float: left; margin: 0px 20px; padding: 0px; width: 154px; display: inline;}
#piePagina li {color: #FFF; font-size: 10pt; margin: 0px; list-style: none; text-align: left;}
#piePagina li a {color: #CCC; font-size: 8pt; text-decoration: none; border-bottom: 1px solid #777; padding: 0px 1px; display: block;}
#piePagina li a:hover {color: #FFF;}
#piePagina .usuariosOnline {clear: both; width: 100%; color: #FFF; text-align: center;}
#piePagina .usuariosOnline a {color: #FC0; font-weight: bold;}
#piePagina .textoOculto {color: #666; font-size: 6pt;}
#barraCopyright {background: #000; color: #EEE; text-align: center; padding: 2px 0px;}


/* Portada */
.portadaIzquierda {width: 520px; margin-right: 10px; float: left;}
.portadaDerecha {width: 300px; float: right;}
.columnaGrande {width: 615px; float: left;}
.columnaPeque {width: 205px; margin-left: 10px; float: right;}
.portadaIzquierda h2, .portadaDerecha h2, .columnaGrande h2, .columnaPeque h2, .listaContenidos h2 {margin-bottom: 5px;}
.columnaGrande, .columnaPeque {height: 540px;}

#megaBanner {width: 520px; height: 250px; margin-right: 10px;}
#publicidadPortada {width: 300px; height: 250px; overflow: hidden; position: relative;}

#noticiasPortada {position: relative; height: 555px;}
#noticiasPortada ul {height: 488px; margin: 0px; padding: 0px; overflow: hidden;}
#noticiasPortada li {list-style: none; padding: 4px 0px; border-bottom: 1px dotted #CCC;}
#noticiasPortada .fecha {font-weight: bold;}
#noticiasPortada .tipoNoticia {padding: 1px 3px; background: #999; color: #FFF;}
#noticiasPortada h3 {font-size: 10pt; margin-bottom: 5px;}
#noticiasPortada .plataformas span {color: #666; padding: 1px 3px; font-size: 8pt;}
#noticiasPortada .pieNoticias {position: absolute; width: 520px; left: 0px; top: 515px; line-height: 25px; padding: 8px 0px 7px 0px;}
#noticiasPortada .pieNoticias a.derecha {display: block; width: 16px; height: 20px; background: url(../img/web/rss.png) center no-repeat;}

#videosPortada {height: 555px; position: relative;}
#videosPortada ul {margin: 0px; padding: 0px;}
#videosPortada li {list-style: none; width: 298px; height: 110px; border: 1px solid #CCC; margin-bottom: 10px;}
#videosPortada li a {display: block; width: 278px; height: 90px; padding: 10px; text-decoration: none; cursor: pointer;}
#videosPortada li a:hover {background: #EEE;}
#videosPortada li a .imagen {width: 120px; height: 90px; float: left; margin-right: 10px;}
#videosPortada li a .derecha {width: 148px; height: 90px; overflow: hidden;}
#videosPortada li a h3 {font-size: 9pt; margin-bottom: 5px;}
#videosPortada li a p {color: #555;}
#videosPortada .pieVideos {line-height: 40px; height: 40px; display: none; width: 298px; position: absolute; bottom: 0px; left: 0px;}
#videosPortada .pieVideos a.botonTuneado {position: absolute; left: 0px; top: 8px;}

.listaContenidos {width: 270px; float: left; margin-right: 5px;}
.listaContenidos ul {margin: 0px; padding: 0px;}
.listaContenidos li {list-style: none; width: 270px; height: 90px; border-bottom: 1px dotted #CCC;}
.listaContenidos li a {display: block; width: 260px; height: 80px; padding: 5px; text-decoration: none; font-size: 8pt;}
.listaContenidos li a:hover {background: #EEE;}
.listaContenidos li h3 {font-size: 9pt;}
.listaContenidos li .imagen {height: 80px; float: left; margin-right: 5px;}
.listaContenidos li img {width: 45px;}

#encuestaPortada {width: 195px; }
#destacadosPortada {height: 89px; margin: 0px 0px 20px 0px; padding: 0px;}
#destacadosPortada li {list-style: none; margin-right: 2px; float: left;}


/* Reglas que se usan en configurarMiVj.jsp */
.selectorMiVj {width: 400px; float: left; margin-right: 30px;}
.coloresMiVj {width: 400px; float: left;}
.selectorMiVj h2, .coloresMiVj h2 {font-size: 12pt; margin: 0px 0px 10px 0px;}
.selectorMiVj select {width: 400px; height: 572px;}
.pieMiVj {clear: both;}
.pieMiVj a.botonTuneado {margin-left: 10px;}


/* Reglas para el listado de foros. Algunas de estas reglas también pueden utilizarse en el listado de aportaciones */
h2.cabeceraForos {padding: 0px; margin: 0px; font-weight: normal; font-size: 16pt; color: #666; float: left;}
.listaForos {width: 100%; margin-bottom: 15px;}
.listaForos a {font-weight: bold;}
.listaForos th {height: 20px; text-align: center;}
.listaForos td {border: 0px none; border-bottom: 1px dotted #999; padding: 5px 3px; vertical-align: middle; text-align: left;}
.listaForos td span {padding-right: 2px;}
.listaForos h3 {margin: 0px 0px 5px 0px;}
.listaForos h3 a {font-size: 11pt;}

.listaForos td.columnaInfoForo {vertical-align: top;}
.listaForos div.descripcionForo {font-size: 9pt; color: #666; margin-bottom: 4px;}
.listaForos div.descripcionForo table {border: 0px none;}
.listaForos div.descripcionForo td {border: 0px none;}
.listaForos div.moderadoresForo {font-size: 7pt;}
.listaForos td.columnaUltimaAportacion {width: 244px; text-align: center;}
.listaForos td.columnaNAportaciones {width: 64px; text-align: center;}
.cuadroLosMejores {display: block; border: 1px dotted #f5e082; background: #ffffe5; padding: 0px 5px 0px 5px;}
.cuadroLosMejores h2 {width: 100%; text-align: center; font-weight: bold; padding: 0px; margin: 0px 0px 10px 0px; font-size: 10pt;}


/* Reglas para el listado de aportaciones */
.foroNumeroAportaciones {font-size: 7pt; text-align: center;}
.topicForo {color: #666; text-align: center;}
.avisoForo {border: 1px solid #CCC; margin: 10px auto 10px auto; text-align: center;}
.avisoForo span {width: 100%; text-align: center; text-transform: uppercase; display: block; font-family: "Arial Black", Gadget, sans-serif; font-weight: bold;}
.avisoForo div {margin: 2px 15px 10px 15px;}
.selectorForos {float: right;}
.selectorForos select {width: 250px; border: 1px solid #CCC;}
.selectorForos input, .selectorForos a.botonSelectTuneado {border-color: #CCC;}
.barraOpcionesForo {height: 22px; line-height: 22px; margin: 5px 0px; padding: 2px; border: 1px solid #CCC; color: #666; background-color: #DDD;}
.barraOpcionesForo input {border-color: #CCC; width: 140px;}
.barraOpcionesForo .botonBuscar {margin-right: 10px; border: 1px solid #CCC; border-left: 0px none; background:url(../img/web/botonBuscar.png) top no-repeat; width: 24px; height: 20px; display: block;}
.barraOpcionesForo .botonBuscar:hover {background-position: bottom;}
.barraOpcionesForo .botonOpcionesForo {padding-left: 20px; margin-right: 10px; background: center left no-repeat; float: right;}
.buscadorForos {width: 100px; height: 19px; border: 1px solid #CCC; margin: 1px 0px; font-size: 8pt;}
.aportacionesMovidas {display: none; padding: 3px; border: 1px solid #F5E082; background: #FFFFE5; color: #000; font-size: 7pt; margin: 5px 0px;}
.aportacionesMovidas span {display: block; text-align: center; font-weight: bold; margin-bottom: 5px;}

.botonNuevoTema {float: left; margin: 0px 0px 10px 0px;}
.ultimaAportacion {float: right; margin: 0px 0px 10px 0px; text-align: right;}
.ultimaAportacion span {font-weight: bold; padding-right: 2px;}
.ultimaAportacion a {font-weight: bold;}

.listaForos td.columnaIconoAportacion {width: 25px;}
.listaForos td.columnaTituloAportacion h3 * {font-size: 9pt;}
.listaForos td.columnaTituloAportacion .paginacionAportacion {margin-top: 5px;}
.listaForos td.columnaUltimaRespuesta {width: 120px; text-align: center;}
.listaForos td.columnaNRespuestas, .listaForos td.columnaNVisitas, .listaForos td.columnaMod {width: 55px; text-align: center;}
.listaForos td.columnaMod .opcionesAdministracion a {margin-left: 2px;}
.listaForos td.copaOro {background: url(../img/copas/oro.png) center right no-repeat;}
.listaForos td.copaPlata {background: url(../img/copas/plata.png) center right no-repeat;}
.listaForos td.copaBronce {background: url(../img/copas/bronce.png) center right no-repeat;}

.listaAdministradores {float: left; font-size: 7pt;}
.listaAdministradores a, .listaAdministradores b {font-size: 8pt;}
.listaAdministradores span {font-weight: bold;}


/* Aportación */
h1.tituloAportacion {margin: 10px 0px; padding: 0px; font-size: 18pt; color: #333; font-weight: normal;}
.cajaAportacion {width: 830px; margin-bottom: 30px;}
.cajaAportacion .cabeceraAportacion {padding: 5px; background: #F0F0FF; border: 1px solid #CCCCCF; min-height: 84px;}
.cajaAportacion .avatar {float: left; width: 80px; height: 80px; margin-right: 5px; border: 2px solid #CCCCCF;}
.cajaAportacion .conAvatar {margin-left: 89px;}
.cajaAportacion .infoAportacion {position: relative;}
.cajaAportacion .infoAportacion .titulo {height: 20px; padding: 0px 5px;}
.cajaAportacion .infoAportacion .titulo h3 {margin: 0px; padding: 0px; line-height: 20px; font-size: 10pt;}
.cajaAportacion .infoAportacion .temaBorrado {background-color: #F00; color: #FFF;}
.cajaAportacion .infoAportacion .temaBorrado h3 a {color: #FFF;}
.cajaAportacion .infoAportacion .fecha {font-weight: bold; line-height: 20px; color: #FFF;}
.cajaAportacion .infoAportacion .datosUsuario {margin: 5px 10px 5px 0px;}
.cajaAportacion .infoAportacion .datosUsuario p {margin-bottom: 3px;}
.cajaAportacion .infoAportacion .datosUsuario .nick a {font-size: 11pt;}
.cajaAportacion .infoAportacion .datosUsuario span {margin-left: 5px;}
.cajaAportacion .infoAportacion .copa {width: 60px; height: 55px; text-align: center; line-height: 55px; padding: 0px 15px 0px 45px; font-size: 24pt; background: center no-repeat; color: #111; position: absolute; left: 100%; margin-left: -120px; top: 20px;}
.cajaAportacion .infoAportacion .oro {background-image: url(../img/copas/placa_oro.png);}
.cajaAportacion .infoAportacion .plata {background-image: url(../img/copas/placa_plata.png);}
.cajaAportacion .infoAportacion .bronce {background-image: url(../img/copas/placa_bronce.png);}
.cajaAportacion .puntuaciones {background: #FF9; padding: 2px; display: none;}
.cajaAportacion .infoAportacion .opcionesAdministracion {padding: 4px 0px; margin-left: 5px; font-size: 7pt;}
.cajaAportacion .infoAportacion .opcionesAdministracion a {margin-left: 2px;}
.cajaAportacion .textoAportacion {width: 830px; margin: 15px 0px;}
.cajaAportacion .textoAportacion img {max-width: 830px;}
.cajaAportacion .textoAportacion .textoEnano img {max-width: 500px;}
.cajaAportacion .opcionesAportacion {height: 35px; margin: 10px 0px;}
.cajaAportacion .opcionesAportacion .derecha {line-height: 25px; padding: 5px 0px;}
.cajaAportacion .opcionesAportacion .botonTuneado {margin-left: 10px;}
.cajaAportacion .verMasEdiciones {padding: 0px 2px;}
.cajaAportacion .edicionAportacion {background: #FF9; padding: 0px 2px; display: none;}
.cajaAportacion .firma {width: 830px; max-height: 150px; margin-top: 5px; overflow: hidden; background: #E5E5E5; text-align: center;}
.panelPrevisualizacion {width: 830px; outline: 1px dotted #CCC; min-height: 30px; padding: 10px 0px;}
.panelPrevisualizacion h1 {margin: 10px; padding: 0px; font-size: 18pt; color: #555; font-weight: normal;}

/* CodeRed - Reglas para las listas de contenidos */
#contenidosLista ul {margin: 0px; padding: 0px;}
#contenidosLista li {list-style: none; padding: 4px 0px; border-bottom: 1px dotted #CCC;}
#contenidosLista .fecha {font-weight: bold;}
#contenidosLista .tipoNoticia {padding: 1px 3px; background: #999; color: #FFF;}
#contenidosLista h3 {font-size: 12pt; margin-bottom: 5px;}
#contenidosLista .plataformas {color: #666; font-size: 10pt; margin-bottom: 5px;}
#contenidosLista .entradilla {color: #666; font-size: 10pt; margin-bottom: 5px;}
.tipoNoticia {padding: 1px 3px; background: #999; color: #FFF;}

/* CodeRed - Reglas para los comentarios de contenidos */
.comentariosContenidos {font-size: 9pt; margin-bottom:5px; width:820px; background-color:#eeeeee; border: 1px dotted black; text-align:left; padding:5px}
.textoEnano {font-size: 7pt}

/* Ficha de los juegos */
.tituloJuego {margin: 10px 0px 0px 0px; padding: 0px; font-size: 18pt; color: #333; font-weight: normal;}
.notaFichaJuego {display: block; margin-top: 10px; border: 1px solid #CCC; background: #EFEFEF; color: #416385; position: relative; padding: 10px 100px 10px 10px;}
.notaFichaJuego:hover {text-decoration: none;}
.notaFichaJuego .marcadorPeque {position: absolute; right: 10px; top: 10px;}
.notaFichaJuego .barra {width: 230px; height: 20px; margin-top: 5px; position: relative;}
.notaFichaJuego .barra .marcador {width: 0%; height: 100%; background: url(../img/web/marcadorNotaFichaJuego.png); z-index: 1; position: absolute; left: 0px; top: 0px;}
.notaFichaJuego .barra .lineas {width: 100%; height: 100%; background: url(../img/web/bordeNotaFichaJuego.png); z-index: 2; position: absolute; left: 0px; top: 0px;}
.iconosJuego {margin: 10px 0px; line-height: 24px;}
.iconosJuego img {vertical-align: middle;}
.fichaJuego {width: 520px; float: left;}
#caratulaJuego {float: left; margin-right: 10px; display: none;}
#caratulaJuego img.caratula {margin-bottom: 5px; border: 1px solid #111;}
.datoFichaJuego {margin-bottom: 5px; padding-bottom: 5px; border-bottom: 1px dotted #CCC; font-size: 8pt;}
.datoFichaJuego strong {display: block; float: left; width: 135px;}
.datoFichaJuego p {margin-left: 140px; font-size: 8pt;}
.infoFichaJuego {padding: 10px; display: table; width: 810px;}
.infoJuego {width: 390px;}
.anuncioFichaJuego {float: right; margin-left: 10px; width: 300px; height: 250px; overflow: hidden; position: relative;}
.descripcionFichaJuego {padding: 10px 0px;}
.fichaJuegoColabora {margin: 10px 0px; height: 24px; line-height: 24px;}
.fichaJuegoColabora a.colabora {display: inline-block; width: 91px; height: 24px; background: url(../img/web/botonColabora.png) left top no-repeat; float: left; margin-right: 5px;}
.fichaJuegoColabora a.colabora:hover {background-position: left bottom;}
.fichaJuegoColabora ul {margin: 0px; padding: 0px; height: 24px;}
.fichaJuegoColabora ul li {list-style: none; margin-right: 5px; float: left;}
.fichaJuegoColabora ul li a {display: inline-block; line-height: 22px; height: 22px; padding: 0px 5px 0px 26px; background: url(../img/web/mas.png) 5px 50% no-repeat #fafafa; border: 1px solid #CCC; color: #416385; text-decoration: none;}
.fichaJuegoColabora ul li a:hover {background-color: #EEE;}
.fichaJuegoColabora ul li a.editar {background-image: url(../img/web/editar.png);}

/* Páginas de contenidos */

.cabeceraContenido {border: 1px solid #CCC; padding: 5px 90px 5px 5px; margin: 10px 0px; min-height: 80px; position: relative; background: #F0F0FF;}
.cabeceraContenido img {position: absolute; width: 80px; height: 80px; left: 100%; top: 5px; margin-left: -85px;}
.cabeceraContenido h2 {font-size: 10pt; color: #333; font-weight: normal;}
.cabeceraContenido p {font-size: 10pt; color: #333; margin-top: 2px;}
.cabeceraContenido .tituloContenido {font-size: 16pt;}
.contenidoArticulo {margin: 20px 0px 10px 0px; display: table;}
.contenidoArticulo .texto {font-size: 11pt; line-height: 19px;}
.contenidoArticulo .enlacesSocial {margin-bottom: 20px;}
.contenidoArticulo.conImagenes .texto {width: 610px; padding-right: 18px; float: left;}
.contenidoArticulo .imagenes {float: right; width: 202px;}
.contenidoArticulo .imagenes td {text-align: center; font-size: 8pt; padding: 0px 0px 10px 0px;}
.contenidoArticulo .imagenes img {border: 1px solid;}
.CabeceraReportaje {margin-bottom: 15px;}

.tablaPuntuaciones {width: 100%; border-collapse: collapse;}
.tablaPuntuaciones th {padding: 3px; font-size: 11pt; font-weight: bold;}
.tablaPuntuaciones td {background-color: #EAEAEA; padding: 5px;}
.tablaPuntuaciones td.conPuntuacion {padding-right: 95px; min-height: 40px; display: block; position: relative;}
.tablaPuntuaciones td strong {font-size: 12pt;}
.tablaPuntuaciones td .marcadorPeque, .tablaPuntuaciones td .marcadorGrande {position: absolute; left: 100%; top: 50%; margin: -20px 0px 0px -85px;}
.tablaPuntuaciones td.notaFinal {background-color: #5a5a5a; color: #FFF; padding-right: 115px; min-height: 50px; display: block; position: relative;}
.tablaPuntuaciones td.notaFinal strong {font-size: 14pt; text-transform: uppercase;}
.tablaPuntuaciones td.notaFinal p {font-size: 11pt;}
.tablaPuntuaciones td .marcadorGrande {margin: -25px 0px 0px -105px;}
.tablaPuntuaciones td .notaNoApoyada {color: red; font-weight: bold;}
.tablaPuntuaciones td.expectacionAvance {width: 100px; text-align: center;}
.tablaPuntuaciones td.expectacionAvance span {font-size: 11pt; font-weight: bold;}
.tablaPuntuaciones td.expectacionAvance span.textoRegular {color: red;}
.tablaPuntuaciones td.expectacionAvance span.textoInteresante {color: orange;}
.tablaPuntuaciones td.expectacionAvance span.textoPrometedor {color: green;}
.tablaPuntuaciones td.expectacionAvance span.textoBombazo {color: blue;}

/* Pestañas */

ul.pestanas {height: 31px; margin: 10px 0px; padding: 10px 0px 0px 0px; background: url(../img/web/fondoPestanasJuego.png) bottom repeat-x;}
ul.pestanas li {list-style: none; float: left; margin-right: 5px;}
ul.pestanas li a {display: block; height: 100%; line-height: 25px; height: 25px; padding: 2px 5px; border: 1px solid #CCC; background: #EFEFEF; color: #416385; text-decoration: none;}
ul.pestanas li a:hover, ul.pestanas li.seleccionado a {background: #FFF; border-bottom-color: #FFF;}

/* CodeRed - Para usar el botón de buscar en cualquier sitio de la web */
.botonBuscar {margin-right: 10px; border: 1px solid #CCC; border-left: 0px none; background:url(../img/web/botonBuscar.png) top no-repeat; width: 24px; height: 20px; display: block;}
.botonBuscar:hover {background-position: bottom;}