.color-primario, .activo-secundario.active, a.color, .notificacion a, .pagination .page-item .page-link, .foro-aportacion .cuerpo a, article .texto-articulo a {color: #28abe3;}
.fondo-primario, .activo-primario.active, .btn-primary, .btn-group .btn.btn-primary.active, .pagination .page-item.active .page-link, ::selection {background-color: #28abe3;}
.color-secundario, .activo-primario.active, .color-secundario-hover:hover, a.color:hover {color: #faaf3a;}
.fondo-secundario, .activo-secundario.active, .btn-secondary {background-color: #faaf3a;}
.borde-primario {border-color: #28abe3;}
.borde-secundario {border-color: #faaf3a;}
::selection {color: #FFF;}
.color-gris {color: #999;}
.hidden {display: none !important;}
.text-left {text-align: left;}
.text-right {text-align: right;}
.text-center {text-align: center;}
#capaAceptaCookies {position: fixed; z-index: 150; left: 0; right: 0; bottom: 0; padding: 10px; background-color: rgba(0, 0, 0, 0.8); color: #FFF; text-align: center;}
.validado {background-color: #faaf3a;}
.texto-pie-oculto{color:#666; display: none;}

body {background: #e6e9ee; color: #434a54; padding-top: 70px;}
body.menu-abierto, body.menu-colabora-abierto {overflow: hidden;}
body #wrapper {transition: margin 0.2s;}
.container {margin-top: 10px;}
a {color: #666; cursor: pointer;}
a.color {transition: color .2s;}
a.color:hover {text-decoration: none;}
.enlacespoiler a {display: inline-block; padding: 0 6px; font-size: .9em; background-color: #AAA; color: #FFF !important; border: 1px solid #999; border-radius: 3px;}
.enlacespoiler a:hover {text-decoration: none;}
@keyframes spoiler-fade {from {opacity: 0;} to {opacity: 1;}}
.spoiler {display: none; background-color: #FFC; transition: opacity .5s;}
.spoiler.activo {display: inline; animation-name: spoiler-fade; animation-duration: 1s;}
a.pie {color:#fff}
textarea.editor {border-top: 0 none; border-top-left-radius: 0; border-top-right-radius: 0;}
.editor-botones {padding: 5px; background-color: #e6e9ee; border: solid #d9d9d9; border-width: 1px 1px 0 1px;}
.editor-botones a {display: inline-block; margin-right: 5px; padding: 1px 6px; border: 1px solid transparent;}
.editor-botones a:hover, .editor-botones select:hover {border-color: #d9d9d9; text-decoration: none;}
.editor-botones .separador {display: inline-block; margin: 4px 5px 4px 0; height: 20px; border-left: 1px solid #CCC; vertical-align: top;}
.editor-botones select {margin-right: 5px; font-size: .9em; border-color: transparent; background: none;}
.progreso-circular {position: relative; width: 180px; height: 180px;}
.progreso-circular canvas {position: relative; z-index: 0; max-width:100%; max-height:100%}
.progreso-circular-info {position: absolute; left: 0; top: 0; right: 0; bottom: 0; padding: 40px; text-align: center; text-transform: uppercase; color: #434a54; line-height: 14px; font-size: 12px; z-index: 1;}
.progreso-circular .progreso-circular-info .textovj {font-size: 12px;}
.progreso-circular .progreso-circular-info .nota {margin: 15px 0 25px 0; font-size: 40px;}
.progreso-circular .progreso-circular-info .mdi {font-size: 20px;}
a.btn-default {background-color: buttonface; color: buttontext;}
.btn-social {padding: 4px 10px; line-height: 1; color: #FFF; font-size: 16px;}
.btn-facebook {background-color: #3b5998;}
.btn-twitter {background-color: #1da0f2;}
.btn-google {background-color: #dc4a38;}
.btn-whatsapp {background-color: #51c95d;}
.contenedor-video iframe {width: 100%; border: 0 none;}

form[data-form] .alerta {display: none;}
form[data-form].enviando .alerta.alerta-enviando, form[data-form].guardado .alerta.alerta-guardado, form[data-form].modificado .alerta.alerta-modificado {display: block;}

.btn {border: 0 none; border-radius: 0;}
.btn-group .btn {background-color: buttonface; color: #999; transition: background-color .3s, color .3s;}
.btn-group .btn.active {color: #FFF;}
.input-group-btn .btn {border: 1px solid rgba(0, 0, 0, .15); background-color: #FFF;}
.form-control + .input-group-btn .btn {border-radius: 0 3px 3px 0;}
.form-group > label {font-size: 0.75em; text-transform: uppercase;}
.form-control {border-radius: 3px; transition: box-shadow .4s;}
.form-control:focus {border-color: #28abe3; box-shadow: inset 0 1px 1px rgba(40, 171, 227, .6), 0 0 8px rgba(40, 171, 227, .6);}
.select-multiple {max-height: 300px; overflow: auto;}
select[multiple] {overflow: auto;}
.custom-file-control::after {content: "Selecciona archivo"}
.custom-file-control::before {content: "Seleccionar"}
.alert {border-radius: 0;}
.alert.alert-lg i {font-size: 4em;}
.alert.alert-lg {font-size: 1.1em;}
.breadcrumb {padding: 0; background: transparent; font-size: 0.8rem;}
.breadcrumb a {color: #28abe3;}
.breadcrumb-item + .breadcrumb-item::before {content: "·";}
.modal .modal-dialog {margin-top: 130px; opacity: 0; transform: scale(1.5); transition: opacity .3s, transform .3s;}
.modal.in .modal-dialog {opacity: 1; transform: scale(1);}
.modal .modal-content {border-radius: 3px;}
.modal.cargando .modal-body {min-height: 100px; background: url(/img/loader.gif) center no-repeat;}
.modal .modal-footer {border-top: 0 none;}
.modal .modal-footer .btn {margin-right: 10px;}
.well {margin-bottom: 10px; padding: 10px; background-color: #f5f5f5; border: 1px solid rgba(0,0,0,.125);}
.pagination, .pagination .page-item .page-link {border-radius: 0;}
.pagination .page-item .page-link {padding: 4px 10px;}
.pagination .page-item .page-link:hover {text-decoration: none;}
.pagination .page-item.active .page-link {border-color: transparent; color: #FFF;}

.titulo.fondo-primario {margin: 0 0 10px 0; padding: 10px; letter-spacing: -1px;}
h2.titulo {font-size: 24px;}
.avatar {width: 80px; height: 80px; border-radius: 5px;}
.avatar.avatar-s {width: 40px; height: 40px;} 
.avatar.avatar-xs {width: 25px; height: 25px;}
.boton-colabora {display: inline-block; padding: 0 15px; line-height: 40px; background-color: #8cc63e; color: #FFF !important; font-size: 14px; text-transform: uppercase;}
.boton-colabora:after {content: "\F417"; font-family: "Material Design Icons"; margin-left: 10px;}
.enlace-admin a, a.enlace-admin {display: inline-block; margin-bottom: 5px; padding: 2px 5px; background-color: firebrick; color: #FFF; font-size: 10px; line-height:15px}
.dropdown-item.enlace-admin {padding: 3px 20px; font-size: 1rem;}
.btn-gris {background-color: #aab2bd; color: #FFF; transition: background-color .3s;}
.btn-gris:hover {background-color: #c1cad7; color: #FFF;}
.btn-gris a {color: #FFF}
.btn-admin {background-color: firebrick; color: #FFF;}
.derecha {float:right}
.izquierda {float:left}
.plataformas span, .plataforma {display: inline-block; font-family: open_sansbold, sans-serif; font-size: 75%; font-weight: normal; color: #666; line-height: 1; text-align: center; vertical-align: baseline; text-transform: uppercase;}
.plataformas span {margin-right: 10px;}

.menu {position: fixed; top: 0; bottom: 0; margin-top: 60px; z-index: 999; width: 100%; padding: 20px; transition: left 0.2s, right 0.2s;}
.menu, #vj-header .btn-menu.active {background-color: #434a54; color: #FFF;}
.menu-abierto .menu {overflow: auto;}
.menu.izquierda {left: -100%;}
.menu.derecha {right: -100%;}
.menu nav ul {margin-bottom: 30px;}
.menu nav ul.ultimo {margin-bottom: 0px;}
.menu nav a {color: inherit;}
.menu-principal-abierto #menu-principal {left: 0;}
.menu-notificaciones-abierto #menu-notificaciones, .menu-usuario-abierto #menu-usuario {right: 0;}

#vj-header {height: 60px; padding: 10px 0; background: #FFF; position: fixed; top: 0; left: 0; right: 0; z-index: 900;}
#vj-header > * {display: inline-block; vertical-align: top;}
#vj-header .logo {margin: 0 10px; height: 40px;}
#vj-header .logo img {height: 100%;}
#vj-header .btn-menu {display: inline-block; position: relative; top: -10px; padding: 0 5px; height: 60px; font-size: 28px; text-align: center; vertical-align: top;}
#vj-header .btn-menu .mdi, #vj-header .btn-menu img {margin-top: 15px;}
#vj-header .btn-menu img {width: 28px; height: 28px;}

#boton-notificaciones {position: relative;}
#boton-notificaciones .on, #boton-notificaciones.tiene-notificaciones .off, #boton-notificaciones [data-notificaciones="num-notificaciones"] {display: none;}
#boton-notificaciones.tiene-notificaciones .on, #boton-notificaciones.tiene-notificaciones [data-notificaciones="num-notificaciones"] {display: inline-block;}
#boton-notificaciones [data-notificaciones="num-notificaciones"] {position: absolute; right: 10px; bottom: 10px; padding: 2px 4px; border: 2px solid #FFF; border-radius: 5px; color: #FFF; font-size: 9px;}

#menu-notificaciones {z-index:999}
#menu-notificaciones .opciones * {color: #FFF;}
#menu-notificaciones .opciones .btn {background-color: transparent;}
#menu-notificaciones .lista {position: absolute; overflow: auto; left: 0; top: 0; right: 0; bottom: 0; margin-top: 56px; padding: 20px;}
#menu-notificaciones .notificacion {position: relative; padding: 10px 40px 10px 0; border-top: 1px solid #656d78; color: #FFF; font-size: 14px;}
#menu-notificaciones .notificacion.no-leido {color: #F5D76E;}
#menu-notificaciones .notificacion:last-child {border-bottom: 1px solid #656d78;}
#menu-notificaciones .notificacion time {color: #656d78; font-size: .9em;}
#menu-notificaciones .notificacion button {border: 0; background: transparent; color: #FFF; font-size: 1.5em;}
#menu-notificaciones .notificacion [data-notificaciones="btn-opciones"] {position: absolute; top: 10px; right: 0; bottom: 10px; border: 0; background: #434a54; color: #FFF; font-size: 1.5em; z-index: 2;}
#menu-notificaciones .notificacion .notificacion-opciones {position: absolute; left: 0; top: 0; bottom: 0; width: 100%; margin-left: -100%; background-color: #434a54; font-size: 1.2em; z-index: 1; transition: margin-left .3s;}
#menu-notificaciones .notificacion.mostrar-opciones .notificacion-opciones {margin-left: 0;}
#menu-notificaciones .notificacion .notificacion-opciones a {display: inline-block; margin-right: 15px; padding: 5px; height: 100%; vertical-align: middle; color: #FFF;}
#menu-notificaciones .notificacion .notificacion-opciones a:before {content: ""; display: inline-block; height: 100%; vertical-align: middle;}
#menu-notificaciones .notificacion .notificacion-opciones a > span {font-size: .8em; display: inline-block; vertical-align: middle; text-align: center;}
#menu-notificaciones .notificacion .notificacion-opciones a .mdi {font-size: 1.7em;}
#menu-notificaciones .notificacion.leido [data-funcion-ok="marcarLeido"], #menu-notificaciones .notificacion.no-leido [data-funcion-ok="marcarNoLeido"], #menu-notificaciones .notificacion.no-puede-excluir [data-funcion-ok="marcarExcluir"] {display: none;}
#menu-notificaciones .capa-error {display: none; text-align: center;}
#menu-notificaciones .capa-actualizando {position: absolute; left: 0; top: 0; right: 0; bottom: 0; background: rgba(0, 0, 0, .5); z-index: 5;}
#menu-notificaciones .capa-actualizando img {position: absolute; left: 50%; top: 50%; margin: -30px 0 0 -30px;;}
#menu-notificaciones.error .lista, #menu-notificaciones .capa-error, #menu-notificaciones .capa-actualizando {display: none;}
#menu-notificaciones.error .capa-error, #menu-notificaciones.actualizando .capa-actualizando {display: block;}

#seccion-notificaciones .lista {overflow: auto; left: 0; top: 0; right: 0; bottom: 0; padding: 15px; background-color:#fff}
#seccion-notificaciones .notificacion {position: relative; padding: 10px 40px 10px 5px; border-top: 1px solid #656d78; font-size: 14px;}
#seccion-notificaciones .notificacion.no-leido {background-color: #F5D76E;}
#seccion-notificaciones .notificacion time {color: #656d78; font-size: .9em;}
#seccion-notificaciones .notificacion button {border: 0; background: transparent; font-size: 1.5em;}
#seccion-notificaciones .notificacion [data-notificaciones="btn-opciones"] {position: absolute; top: 10px; right: 0; bottom: 10px; border: 0; font-size: 1.5em; z-index: 2;}
#seccion-notificaciones .notificacion .notificacion-opciones {background-color:#fff; position: absolute; left: 0; top: 0; bottom: 0; width: 100%; margin-left: -100%; font-size: 1.2em; z-index: 1; transition: margin-left .3s;}
#seccion-notificaciones .notificacion.mostrar-opciones .notificacion-opciones {margin-left: 0;}
#seccion-notificaciones .notificacion .notificacion-opciones a {display: inline-block; margin-right: 15px; padding: 5px; height: 100%; vertical-align: middle}
#seccion-notificaciones .notificacion .notificacion-opciones a:before {content: ""; display: inline-block; height: 100%; vertical-align: middle;}
#seccion-notificaciones .notificacion .notificacion-opciones a > span {font-size: .8em; display: inline-block; vertical-align: middle; text-align: center;}
#seccion-notificaciones .notificacion .notificacion-opciones a .mdi {font-size: 1.7em;}
#seccion-notificaciones .notificacion.leido [data-funcion-ok="marcarLeido"], #seccion-notificaciones .notificacion.no-leido [data-funcion-ok="marcarNoLeido"], #seccion-notificaciones .notificacion.no-puede-excluir [data-funcion-ok="excluir"] {display: none;}

#menu-principal h3, #menu-principal li, #menu-usuario li {border-bottom: 1px solid #656d78;}
#menu-principal h3 {font-size: 1.1rem; padding: 0px 0px; font-family: open_sansbold, sans-serif; font-weight: normal;}
#menu-principal li a, #menu-usuario li a {display: block; position: relative; padding: 10px 10px 0px 10px; text-decoration: none; transition: color 0.3s;}
#menu-principal li a:after {content: "\F142"; font-family: "Material Design Icons"; color: #656d78; font-size: 1.5rem; position: absolute; right: 10px; top: 50%; margin-top: -13px; transition: color 0.3s;}
#menu-principal li a:hover, #menu-usuario li a:hover {color: #faaf3a;}
#menu-principal li a:hover:after {color: #FFF;}

#menu-usuario a {color: #FFF;}
#menu-usuario hr {border-color: #FFF;}
#menu-usuario nav a {padding-left: 10px;}
#menu-usuario nav a .icono {position: absolute; right: 10px; top: 50%; margin-top: -12px; font-size: 1.5rem;}
#menu-usuario nav a svg.icono {width: 24px; height: 24px;}
#menu-usuario nav a svg.icono path {fill: #FFFFFF; transition: fill 0.3s;}
#menu-usuario a:hover svg.icono path {fill: #faaf3a;}

#footer {margin-top: 20px; padding: 20px 0; background-color: #666; color: #FFF;}
#footer .social a {margin: 0 5px; color: #FFF;}
#footer .social img {width: 24px; height: 24px;}

#ventana-colabora-fondo {display: none; position: fixed; left: 0; top: 0; right: 0; bottom: 0; background: rgba(0, 0, 0, .5); z-index: 10000;}
#ventana-colabora {display: none; position: fixed; left: 0; right: 0; top: 0; bottom: 0; margin: 60px 10px 0 10px; overflow: auto; z-index: 10001;}
#ventana-colabora .cabecera {text-align: right;}
#ventana-colabora .cabecera [data-toggle=colabora] {color: #FFF; font-size: 1.5em;}
#ventana-colabora-contenido.cargando {min-height: 100px; background: url(/img/loader.gif) center no-repeat;}
.menu-colabora-abierto #ventana-colabora-fondo, .menu-colabora-abierto #ventana-colabora {display: block;}
#colabora-botones {color: #FFF; text-align: center; width: 95%}
#colabora-botones .colabora-boton {display: block;}
#colabora-botones .colabora-boton:hover {text-decoration: none;}
#colabora-botones .card {color: #999; font-size: .9em; border: 0 none; border-radius: 0; transition: color .3s;}
#colabora-botones .card .card-block {padding: .5rem;}
#colabora-botones .card .icono {font-size: 24px;}
#colabora-botones .card-title, #colabora-botones .card-footer {text-transform: uppercase;}
#colabora-botones .card-footer {background: none; color: #8cc63e; border-radius: 0; transition: background-color .3s, color .3s;}
#colabora-botones .colabora-boton:hover .card {color: #8cc63e;}
#colabora-botones .colabora-boton:hover .card-footer {background-color: #8cc63e; color: #FFF;}
#colabora-buscador, #ventana-colabora-contenido.mostrar-buscador #colabora-botones {display: none;}
#ventana-colabora-contenido.mostrar-buscador #colabora-buscador {display: block;}
#colabora-lista-juegos {max-height: 300px; overflow: auto;}
#colabora-lista-juegos > * {padding: 5px 0; border-bottom: 1px solid #e6eaed;}
#colabora-lista-juegos .plataforma {min-width: 45px; margin-right: 10px; text-align: center;}

.publicidad {overflow: hidden; text-align: center; position: relative;}
.publicidad-h {margin: 10px auto; text-align: center;}
.publicidad-v {margin-bottom: 10px;}
#sas_3851 {height: 0px}

.cuadro-blanco, .cuadro-blanco > .titulo, .cuadro-blanco .lista > * {padding: 20px;}
.cuadro-blanco {position: relative; margin-bottom: 10px; background-color: #FFF; border-top: 3px solid #28abe3;}
.cuadro-blanco > .lista:first-of-type, .cuadro-blanco > .opciones + .lista {margin-top: -20px;}
.cuadro-blanco > .lista:last-child, .cuadro-blanco .titulo:last-child {margin-bottom: -20px;}
.cuadro-blanco > .titulo, .cuadro-blanco .lista > * {margin-left: -20px; margin-right: -20px; border-bottom: 1px solid #e6eaed;}
.cuadro-blanco .opciones {position: absolute; top: 20px; right: 20px; line-height: 1.1;}
.cuadro-blanco .lista :last-child {border-bottom: 0 none;}
.cuadro-blanco > .titulo {margin-top: 0; margin-bottom: 20px; padding-top: 0; font-family: open_sansbold, sans-serif; font-weight: normal; font-size: 1.2rem; line-height: 1.1;}
.cuadro-blanco .lista > a, .cuadro-blanco .lista > .articulo {display: block; transition: background-color 0.3s;}
.cuadro-blanco .lista > a:hover, .cuadro-blanco .lista > .articulo:hover, .cuadro-blanco.lista > a:active, .cuadro-blanco.lista > .articulo:active {background-color: #f6f7fb; text-decoration: none;}

.articulo {display: block; position: relative;}
.articulo:hover, .articulo > a:hover {text-decoration: none; color: inherit;}
.articulo.articulo-h, .articulo.articulo-v .contenido {padding-right: 38px;}
.articulo.articulo-h:before {content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 3px; background-color: #28abe3; transform: scaleY(0); transition: transform .3s;}
.articulo.articulo-h:after, .articulo.articulo-v .contenido:after {content: "\F142"; font-family: "Material Design Icons"; position: absolute; right: 10px; top: 50%; margin-top: -21px; font-size: 28px; color: #e5e8ed; transition: color .3s;}
.articulo.articulo-h:hover:before {transform: scaleY(1);}
.articulo.articulo-h:hover:after, .articulo.articulo-v:hover .contenido:after {color: #000;}
.articulo.articulo-noticia .media-left img {width: 100px;}
.articulo .titular {font-size: 1.1em; transition: color .3s;}
.articulo:hover .titular {color: #faaf3a;}
.articulo .entradilla {font-size: .9em;}
.articulo.articulo-v {margin-bottom: 15px;}
.articulo.articulo-v .contenedor-imagen {position: relative; padding-top: 54%; overflow: hidden;}
.articulo.articulo-v .contenedor-imagen img {position: absolute; left: 0; top: 0; width: 100%;}
.articulo.articulo-v .info {position: absolute; left: 0; right: 0; bottom: 100%; padding: 10px; background-color: rgba(0, 0, 0, .7); color: #FFF; font-size: .75em;}
.articulo.articulo-v .info .plataformas span {margin-left: 10px; margin-right: 0; color: #FFF; font-size: 100%;}
.articulo.articulo-v .contenido {position: relative; padding: 10px 48px 10px 10px; background-color: #FFF; font-size: .9em;}
.articulo .antetitulo {display: inline-block; font-size: 0.8em; margin-right: 5px; padding: 3px 5px; background-color: #666; color: #FFF;}
a.articulo.articulo-juego {font-size: .8em;}
a.articulo.articulo-juego .fecha {width: 40px;}
a.articulo.articulo-juego .caratula img {width: 50px;}
a.articulo.articulo-juego .fecha {font-size: .8em; text-align: center;}

.articulo.articulo-noticia .opciones-admin {position: absolute; right: 20px; top: 20px; font-size: .8em;}
a.articulo.articulo-analisis .fecha {font-size: .8em;}
a.articulo.articulo-avance .fecha {font-size: .8em;}
.articulo-video {padding: 10px 0; font-size: .8em; border-bottom: 1px solid #e6eaed;}
.articulo-video h3 {font-size: 1.1rem;}

.articulo.aportacion {font-size: .8em;}

.reacciones > * {display: inline-block; margin: 0 10px;}
.reacciones > * i {font-size: 1.4em; vertical-align: middle;}
.reacciones > * span {vertical-align: middle;}
.reacciones [data-reaccion="me-gusta"] i {color: #1ad553;}
.reacciones [data-reaccion="favorito"] i {color: #ed88c0;}
.reacciones [data-reaccion="no-me-gusta"] i {color: #ed1e79;}
.reacciones [data-articulo="reaccion"] {display:none}

.juego-peque .miniatura {width: 50px;}

.juego-medio div div.m-b-1 img {max-width:100%}
.juego-medio .progreso-circular {margin: 10px auto; padding: 0;}

.portada-destacados {padding: 5px 5px 0 5px; margin-bottom: 20px; background-color: #000;}
.portada-destacados .row {margin-left: -5px; margin-right: -5px;}
.portada-destacados .row > * {padding-left: 5px; padding-right: 5px;}
.portada-destacados .banner {margin-bottom: 5px;}
.portada-destacados a {display: block; position: relative;}
.portada-destacados .caption {position: absolute; left: 0; right: 0; bottom: 0; padding: 10px; z-index: 2; color: #FFF; font-size: .8rem; text-shadow: #000 1px 1px 2px, #000 0 0 5px;}
.portada-destacados .caption > p {margin: 0;}
.portada-destacados .caption > h3 {margin: 0; font-size: 1.7em;}
.portada-destacados .col-xs-6 .caption > h3 {display: none;}

#home-social .mdi-twitter-box {color: #50c1e9;}
#home-social .mdi-facebook-box {color: #4b89dc;}
#home-social .mdi-instagram {color: #da789f;}
#home-contenidos {font-size: .9em;}
#home-contenidos .opciones {top: 10px;}
#home-articulos .articulo.articulo-v {margin-bottom: 0;}
#home-articulos .articulo.articulo-v .contenido {padding: 10px 38px 0 0; background-color: transparent;}
#home-articulos .articulo.articulo-v .contenido::after {right: 0;}

.contenidos-recomendados {height:200px}
.contenidos-recomendados img {width: 100%}
.contenido-recomendado img {object-fit:cover}

.cuerpo-articulo .imagen-cabecera img {width: 100%;}
.cuerpo-articulo .titular {margin: 10px 0; font-size: 1.4rem;}
.cuerpo-articulo .titular .antetitulo {font-size: 0.8em; margin-right: 5px; padding: 3px 5px; background-color: #666; color: #FFF;}
.cuerpo-articulo .entradilla {font-weight: bold;}
.cuerpo-articulo .info {line-height: 38px; font-size: .8em;}
.cuerpo-articulo .opciones-articulo {line-height: 36px;}
.cuerpo-articulo .opciones-articulo > div {display: inline-block; padding: 0 5px; border-left: 1px solid rgba(0, 0, 0, .1);}
.cuerpo-articulo .opciones-articulo .btn-comentar {margin-right: 0;}
.cuerpo-articulo .texto-articulo {margin-bottom: 20px;}
#capa-comentarios.cargando {padding-top: 80px; background: url("../img/loader.gif") 50% 10px no-repeat; text-align: center;}

.articulo-puntuaciones .media {margin-bottom: 20px; background: #FFF;}
.articulo-puntuaciones .media span {display: inline-block; font-size: 2em; width: 80px; text-align: center;}
.articulo-puntuaciones .media-left {padding-right: 0; background-color: #CACACA; color: #FFF; text-align: center; font-size: .8em;}
.articulo-puntuaciones .puntuacion-lo-mejor .media-left {background-color: #48cfad;}
.articulo-puntuaciones .puntuacion-lo-peor .media-left {background-color: #ed5565;}
.articulo-puntuaciones .puntuacion-total .media-left {background-color: #FFF; padding: 30px;}
.articulo-puntuaciones .puntuacion-total .media-body {font-size: 1.3em;}
.articulo-puntuaciones .media-body {padding: 0 20px; height: 80px;}

.medidor .borde {width: 100px; height: 100px; margin: 10px auto; position: relative; border-radius: 50%;}
.medidor .fondo {position: absolute; left: 0; top: 0; right: 0; bottom: 0; margin: 3px; background-color: #FFF; text-align: center; font-size: 32px; font-family: Jura, open_sansregular, sans-serif; line-height: 94px; border-radius: 50%;}

#foros-lista-foros {font-size: 0.8em;}
#foros-lista-foros .lista > .row > * {vertical-align: middle;}
#foros-lista-foros .foro {font-size: 1.5em; margin: 0;}
#foros-lista-foros .descripcion {font-size: 1.1em; margin-bottom: 0;}
#foros-aviso {text-align: center;}
#foros-aviso img {max-width: 100%;}

.foro-lista-aportacion {font-size: .8em;}
.foro-lista-aportacion > div:first-child {padding-left: 0;}
.foro-lista-aportacion > div:last-child {padding-right: 0;}
.foro-lista-aportacion .titulo {font-size: 1.1em; margin-bottom: 5px;}
.foro-lista-aportacion .titulo .mdi {display: none;}
.foro-lista-aportacion .paginacion {margin-bottom: 5px;}
.foro-lista-aportacion .paginacion a {display: inline-block; padding: 2px 5px; background-color: buttonface; font-size: .7em;}
.foros .ico-admin {width: 16px; height: 16px;}
.foros .media {overflow: visible;}
.foros .borrado > * {opacity: .2;}
.foro-lista-aportacion.activo .ico-activo, .foro-lista-aportacion.cerrado .ico-cerrado, .foro-lista-aportacion.borrado .ico-borrado, .foro-lista-aportacion.destacado .ico-destacado, .foro-lista-aportacion.copa .ico-copa {display: inline-block;}
.foros .ico-borrado {color: #F00;}
.foros .ico-activo {color: #F89406;}
.foros .ico-destacado {color: #EC644B;}
.foros .copa-oro .ico-copa {color: #F7CA18}
.foros .copa-plata .ico-copa {color: #D2D7D3;}
.foros .copa-bronce .ico-copa {color: #C0392B;}
.foros .btn-recuperar, .foros .borrado .btn-borrar, .foros .btn-abrir, .foros .cerrado .btn-cerrar, .foros .btn-quitar-destacado, .foros .destacado .btn-destacar, .foros .suscrito .btn-suscribir, .foros .btn-cancelar-suscripcion, .foros .btn-quitar-excluir {display: none;}
.foros .borrado .btn-recuperar, .foros .cerrado .btn-abrir, .foros .destacado .btn-quitar-destacado, .foros .excluido .btn-quitar-excluir, .foros .btn-suscribir, .foros .suscrito .btn-cancelar-suscripcion {display: inline-block;}

.foro-aportacion {margin-bottom: 15px; padding: 10px; background-color: #FFF; border-top: 3px solid #28abe3;}
.foro-aportacion .cabecera {margin: 0 -10px 10px -10px; padding: 0 10px 10px 10px; border-bottom: 1px solid #e6eaed;}
.foro-aportacion .avatar {width: 40px; height: 40px;}
.foro-aportacion .titulo {margin-bottom: 0; font-size: 1.2em;}
.foro-aportacion .usuario-info, .foro-aportacion .usuario-titulo {font-size: .8em;}
.foro-aportacion .links {min-width: 150px; font-size: .8em; text-align: right;}
.foro-aportacion time {display: inline-block; margin-bottom: 5px;}
.foro-aportacion .firma {text-align: center; border-top: 1px solid #e6eaed; padding-top: 5px; max-height: 155px; overflow: hidden;}
.foro-aportacion .cuerpo {margin-bottom: 15px;}
.foro-aportacion .cuerpo img, .foro-aportacion .firma img {max-width: 100%;}
.foro-aportacion .cita {padding: 5px; background-color: #eee; border: 1px solid #FFF; font-size: .9rem;}
.foro-aportacion .cita b:first-child {display: inline-block; margin: 0 0 10px 0; font-size: .8em;}
.foro-aportacion .cita .contenedor-video {max-width: 450px;}
.previsualizacion {margin: 20px 0; padding: 10px; border: 1px dotted #CCC;}
.previsualizacion .cargando {min-height: 100px; background: url(/img/loader.gif) center no-repeat;}
.foro-aportacion .cuerpo .smiley {max-height:30px; max-width:30px; border:0px solid #FFF}

.juego-ficha .cabecera-colabora, .juego-ficha .pie-colabora {padding: 10px 0; background-color: #f3f9eb; text-align: center; font-size: .8em;}
.juego-ficha .cabecera-colabora {margin: -20px -20px 25px -20px;}
.juego-ficha .pie-colabora {margin: 25px -20px -20px -20px;}
.juego-ficha .caratula {text-align: center; margin-bottom: 10px;}
.juego-ficha .caratula img {max-width: 100%;}
.juego-ficha .btn-mis-juegos {text-align: left; margin-bottom: 10px;}
.juego-ficha .campo {margin-bottom: 15px; font-size: .9em;}
.juego-ficha .campo .etiqueta {display: block; color: #999; font-weight: normal;}
.juego-ficha .progreso-circular {margin: 0 auto;}
.juego-ficha .pestanas {margin: 20px -20px; height: 75px; overflow-x: auto;}
.juego-ficha .pestanas .scroll {width: 1170px; height: 55px; border-bottom: 1px solid #e6e9ed;}
.juego-ficha .pestanas a {display: inline-block; position: relative; float: left; text-align: center; font-size: 14px; width: 106px; height: 55px;}
.juego-ficha .pestanas a:after {content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 3px; background-color: #29abe2; transform: scaleX(0); transition: transform .3s;}
.juego-ficha .pestanas a .mdi {display: block; font-size: 2em; color: #e6e9ed; transition: color .3s;}
.juego-ficha .pestanas a:hover, .juego-ficha .pestanas a:active {text-decoration: none;}
.juego-ficha .pestanas a.active:after, .juego-ficha .pestanas a:hover:after {transform: scaleX(1);}
.juego-ficha .pestanas a.active .mdi, .juego-ficha .pestanas a:hover .mdi {color: #29abe2;}
.juego-ficha .pestanas .mdi.color-gris-oscuro {color: #666;}
#juego-ficha-contenidos {background: #FFF center no-repeat;}
#juego-ficha-contenidos .publicidad-v {width: 300px;}
#juego-ficha-contenidos.cargando {min-height: 100px; background-image: url(/img/loader.gif);}
#juego-ficha-contenidos h2 {font-size: 1.4rem; margin-bottom: 20px; font-family: open_sansbold, sans-serif; font-weight: normal;}
.juego-ficha .media-left .publicidad {margin-right: 15px;}
.caratula-edit {padding-top: 15px; padding-bottom: 15px; text-align: center;}
#juego-ficha-contenidos .lista {padding: 20px;}
.caratula-edit.active {background-color: #f6f7fb;}
.caratula-edit.active .check-borrar {visibility: hidden;}

.articulo-paginas {text-align: center;}
.articulo-paginas a {display: inline-block; position: relative; padding: 5px; color: #999;}
.articulo-paginas a:before {content: "[";}
.articulo-paginas a:after {content: "]";}
.articulo-paginas ab:before {content: "\F224"; font-family: "Material Design Icons"; position: absolute; left: 0; top: 0; font-size: 32px; color: #333; z-index: -1;}

.imagen-contenido {border-left:5px solid #28abe3; margin:3px; width:200px; transition: border-color .5s; }
.imagen-contenido:hover {border-left: 5px solid #faaf3a}
.imagen-contenido-pie {font-size: .8em}

.pagination-guias {padding:10px}
.pagination-guias, .pagination-guias .page-item .page-link {border-radius: 0;}
.pagination-guias .page-item .page-link {padding: 4px 10px;}
.pagination-guias .page-item .page-link:hover {text-decoration: none;}
.pagination-guias .page-item.active .page-link {border-color: transparent; color: #FFF;}

.sorteo-imagen {max-width:100%; margin-bottom: 10px}
.sorteo-boton {font-size:1em}

.usuariosJuego {font-size: 1.2em}
.usuariosJuego .nombreYApellidos {font-size: 0.9em}
.usuariosJuego.fondoGris {background-color: #EEE}

@media (max-width: 767px)
{
    .breadcrumb .breadcrumb-item {display: none;}
    .breadcrumb .breadcrumb-item:nth-last-child(2) {display: block; font-size: 16px; line-height: 28px;}
    .breadcrumb .breadcrumb-item:nth-last-child(2):before {content: "\F04D"; font-family: "Material Design Icons"; color: #28abe3; font-size: 1.2em;}
    
    header .boton-colabora:after {margin-left: 0;}
    .buscador-cabecera {display: none; position: fixed; left: 0; top: 60px; right: 0; padding: 10px; background-color: #434a54;}
    .buscador-cabecera input {border: 0 none;}
    .buscador-cabecera input:focus {box-shadow: none;}
    .buscador-abierto .buscador-cabecera {display: block;}

    .cuerpo-articulo .imagen-cabecera {margin-left: -15px; margin-right: -15px;}
    .media.media-collapse-sm > div {display: block; width: auto;}

    .plat-foros {height:40px}    
    .plat-listas {height:40px}
    .caratula-listas {max-height:100%;max-width:100%}
    
    .g-recaptcha { transform:scale(0.70); -webkit-transform:scale(0.70); transform-origin:0 0; -webkit-transform-origin:0 0; }

    #sel-tipo{max-width:95%}
}

@media (min-width: 544px)
{
	.d-sm-none {display: none !important;}

    #vj-header .btn-menu {padding: 0 20px;}
    .menu {width: 80%;}
    #colabora-botones .card .icono {font-size: 48px;}
    
    .sorteo-texto {max-width:95%}
    .portada-destacados .col-xs-6 .caption > h3 {font-size: 1.2em;}
}

@media (max-width: 544px)
{
	.progreso-circular {position: relative; width: 75px; height: 75px;}
	.progreso-circular .progreso-circular-info {padding: 30px 20px;}
	.progreso-circular .progreso-circular-info .textovj, .progreso-circular .progreso-circular-info a {display: none;}
	.progreso-circular .progreso-circular-info .nota {margin: 0; font-size: 24px;}
	.articulo-puntuaciones .puntuacion-total .media-left {padding: 5px;}
}

@media (min-width: 768px)
{
	.d-md-none {display: none !important;}

    body {padding-top: 70px;}

    .menu {margin-top: 60px; width: 400px;}

    #vj-header .btn-menu[data-activo="buscador-abierto"] {top: 0; height: 40px;}
    #vj-header .btn-menu[data-activo="buscador-abierto"] i {margin-top: 6px;}
    .buscador-cabecera, .buscador-cabecera input, .buscador-cabecera input:focus, #vj-header .btn-menu[data-activo="buscador-abierto"].active {background-color: #e6e9ee; color: #434a54;}
    .buscador-cabecera {display: none; position:}
    .buscador-cabecera input {border: 0 none; height: 40px;}
    .buscador-cabecera input:focus {box-shadow: none;}
    .buscador-abierto .buscador-cabecera {display: inline-block;}

    .miniaturas-carousel {position: relative; margin-top: 10px;}
	.miniaturas-carousel .carousel-inner {margin: 0 30px; width: auto;}
	.miniaturas-carousel .carousel-control {width: 30px; background: none;}
    .miniaturas-carousel .carousel-inner .row > div {padding-top: 10px; border-top: 3px solid #ccd0d9;}
	.miniaturas-carousel .carousel-inner a {display: block; position: relative; cursor: pointer;}
	.miniaturas-carousel .carousel-inner a img {max-width: 100%;}
    .miniaturas-carousel .carousel-inner a > div {position: absolute; left: 0; top: 0; right: 0; bottom: 0; z-index: 1; background-color: rgba(0, 0, 0, .5); color: #FFF; font-size: .8em; opacity: 1; transition: opacity .5s;}
    .miniaturas-carousel .carousel-inner a .plataformas span {color: #FFF;}
    .miniaturas-carousel .carousel-inner a > div div {position: absolute; left: 0; right: 0; padding: 5px 10px;}
    .miniaturas-carousel .carousel-inner a > div div:first-child {top: 0;}
    .miniaturas-carousel .carousel-inner a > div div:last-child {bottom: 0;}
    .miniaturas-carousel .carousel-inner a.active > div {opacity: 0;}
    .miniaturas-carousel .carousel-inner a:after {content: ""; position: absolute; left: 0; top: -13px; right: 0; height: 3px; background-color: #28abe3; opacity: 0; transform: scaleX(0); transition: opacity .5s, transform .3s;}
    .miniaturas-carousel .carousel-inner a.active:after {opacity: 1; transform: scaleX(1);}

	.contenidos-recomendados {width: auto;}
	.contenidos-recomendados a {display: block; position: relative; cursor: pointer;}
	.contenidos-recomendados a img {max-width: 100%;}
    .contenidos-recomendados a > div {position: absolute; left: 0; top: 0; right: 0; bottom: 0; z-index: 1; background-color: rgba(0, 0, 0, .5); color: #FFF; font-size: .8em; opacity: 1; transition: opacity .5s;}
    .contenidos-recomendados a .plataformas span {color: #FFF;}
    .contenidos-recomendados a > div div {position: absolute; left: 0; right: 0; padding: 5px 10px;}
    .contenidos-recomendados a > div div:first-child {top: 0;}
    .contenidos-recomendados a > div div:last-child {bottom: 0;}
    .contenidos-recomendados a:after {content: ""; position: absolute; left: 0; top: -13px; right: 0; height: 3px; background-color: #28abe3; opacity: 0; transform: scaleX(0); transition: opacity .5s, transform .3s;}

    .portada-col-derecha .titulo {font-size: 1rem;}

    .articulo.articulo-noticia .media-left img {width: 150px;}

    .cuerpo-articulo .titular {font-size: 2.5rem;}
    .cuerpo-articulo .entradilla {font-size: 1.5em;}
    .cuerpo-articulo .opciones-articulo > div {padding-right: 0;}

    .foro-aportacion .avatar {width: 80px; height: 80px;}
    .foro-aportacion .cita img {max-width: 400px;}
    
    .plat-foros {height:100px}
    .plat-listas {height:70px}
    .caratula-listas {max-height:100%;max-width:100%}
    .articulo.articulo-h.articulo-truco a .row div {height:70px}
    
    .sorteo-texto {max-width:75%}   
    
}

@media (min-width: 992px)
{
	.d-lg-none {display: none !important;}

    .miniaturas-carousel .carousel-inner a .plataformas {display:none;}
    .miniaturas-carousel .carousel-inner a > div {font-size:.7em}

	.contenidos-recomendados a .plataformas {display:none;}
    .contenidos-recomendados a > div {font-size:.7em}

    #ventana-colabora {left: 50%; right: auto; width: 800px; margin: 80px auto auto -400px;}

	.portada-destacados .col-xs-6 .caption > h3 {display: block;}
}

@media (min-width: 1200px)
{
	.d-xl-none {display: none !important;}

    .miniaturas-carousel .carousel-inner a .plataformas {display:block;}
    .miniaturas-carousel .carousel-inner a > div {font-size:.8em}

	.contenidos-recomendados a .plataformas {display:block;}
    .contenidos-recomendados a > div {font-size:.8em}
	.contenido-recomendado {height:140px}
	
	.sorteo-texto {max-width:60%}
	
	#ventana-colabora {left: 50%; right: auto; width: 1000px; margin: 80px auto auto -500px;}

	#contenido-pagina {padding-left: 200px;}
	#menu-principal {left: 0; width: 200px; overflow-y: auto;}
}