﻿/* eskup en comentarios de noticia */

@import url("iconos.css");

/* ROBOTO */
@font-face {font-family: 'Roboto';src: url('/fonts/v1.x/v1.0/roboto/roboto-regular-webfont.woff') format('woff');font-weight: normal;font-style: normal;font-display:swap;}
@font-face {font-family: 'Roboto';src: url('/fonts/v1.x/v1.0/roboto/roboto-italic-webfont.woff') format('woff');font-weight: normal;font-style: italic;font-display:swap;}
@font-face {font-family: 'Roboto';src: url('/fonts/v1.x/v1.0/roboto/roboto-bold-webfont.woff') format('woff');font-weight: bold;font-style: normal;font-display:swap;}

/* BENTON */
@font-face {font-family: 'Benton Sans';src: url('/fonts/v2.x/v2.0/benton/bentonsans-regular-webfont.woff') format('woff');font-weight: normal;font-style: normal;font-display:swap;}
@font-face {font-family: 'Benton Sans';src: url('/fonts/v2.x/v2.0/benton/bentonsans-regularitalic-webfont.woff') format('woff');font-weight: normal;font-style: italic;font-display:swap;}
@font-face {font-family: 'Benton Sans';src: url('/fonts/v2.x/v2.0/benton/bentonsans-medium-webfont.woff') format('woff');font-weight: 500;font-style: normal;font-display:swap;}
@font-face {font-family: 'Benton Sans';src: url('/fonts/v2.x/v2.0/benton/bentonsans-bold-webfont.woff') format('woff');font-weight: 700;font-style: normal;font-display:swap;}
@font-face {font-family: 'Benton Sans';src: url('/fonts/v2.x/v2.0/benton/bentonsans-bolditalic-webfont.woff') format('woff');font-weight: 700;font-style: italic;font-display:swap;}
@font-face {font-family: 'Benton Sans';src: url('/fonts/v2.x/v2.0/benton/bentonsans-black-webfont.woff') format('woff');font-weight: 900;font-style: normal;font-display:swap;}
@font-face { font-family: 'Benton Sans'; src: url('/fonts/v2.x/v2.0/benton/bentonsans-book-webfont.woff') format('woff'); font-weight: 100; font-style: normal;font-display: swap; }

/* MAJERIT */
@font-face {font-family: 'Majerit';src: url('/fonts/v2.x/v2.0/majerit/majerittext-bolditalic-webfont.woff') format('woff');font-weight: 700;font-style: italic;font-display:swap;}

body.comentarios {margin: 0; font-family: 'Roboto', sans-serif; font-size: 0.6875rem; line-height: 1.3125rem; background-color: #fff; min-width: 18.750rem;}
.comentarios a {text-decoration: none; color: #000;}
.comentarios h1, .comentarios h2, .comentarios h3, .comentarios h4, .comentarios p, .comentarios figure {margin: 0;}
.comentarios a img {border: 0; display: block;}
.comentarios ul, .comentarios ul li {list-style-type: none; margin: 0; padding: 0;}
.comentarios button, html .comentarios input[type="button"], .comentarios input[type="reset"], .comentarios input[type="submit"] {-webkit-appearance: button; cursor: pointer; border: none;}
.comentarios button {background-color: transparent; border: 0; outline: 0; padding: 0; font-family: 'Roboto', sans-serif; font-size: 0.6875rem;}
.comentarios textarea {padding: 0; margin: 0; display: block; outline: none; overflow: auto; box-sizing: border-box;}
.comentarios div,
.comentarios span,
.comentarios p,
.comentarios a,
.comentarios li,
.comentarios td,
.comentarios strong,
.comentarios em {-webkit-text-size-adjust: 100%;}
.comentarios .colapsado {max-height: 0!important;}
.comentarios .oculto {display: none!important;}
.comentarios .visible {display: block!important;}
.comentarios .izquierda {float: left!important;}
.comentarios .derecha {float: right!important;}
.comentarios .centro {margin: 0 auto!important;}

#contenedor {width: 1px; min-width: 100%;} /* para que iOS haga responsive el contenido del iframe */

/* DEFINICIONES DE COLOR  #016ca2 (1,108,162,0.5) ===================================================================================================================================== */

.refresco,
p.botones_aceptar_moderacion a.boton_aceptar_moderacion,
.escribirmensaje .herramientas .herramientas-botones > a,
.escribirmensaje .herramientas .herramientas-botones button,
article footer .header-autor .distintivo,
.capa-confirmacion button.si {background-color: #016ca2;}
article .comentario .comentario-txt a,
article .herramientas .herramientas-respuestas button,
.conversacion .conversacion .mostrar-mas button,
.escribirmensaje .herramientas .herramientas-formateo .borrar-imagen .borrar,
.escribirmensaje .herramientas .herramientas-botones .contador,
article footer button.header-responde,
article footer span.header-responde {color: #016ca2;}
main .conversacion .conversacion .mostrar-mas button span:before {border-left-color: #016ca2;}
main article .herramientas .herramientas-respuestas button:before {border-top-color: #016ca2;}
article .comentario .comentario-contenido .comentario-txt a {border-bottom-color: rgba(1, 108, 162, 0.3);}
.escribirmensaje textarea:focus {outline-color: rgba(1, 108, 162, 0.08);}

.alto-contraste .configurador .capa-configurador ul li.seleccionado,
.alto-contraste .configurador .capa-configurador ul li.seleccionado button,
.alto-contraste .configurador .capa-configurador ul li.seleccionado button em,
.alto-contraste .configurador .capa-configurador ul li button:hover,
.alto-contraste .configurador .capa-configurador ul li button:hover em,
.alto-contraste article footer .header-autor .distintivo,
.alto-contraste article footer .header-autor .distintivo p {background-color: #016ca2!important;}

.touch .escribirmensaje .herramientas .herramientas-formateo .borrar-imagen:hover .borrar,
.touch article .herramientas .herramientas-respuestas button:hover {color: #016ca2;}
.touch .escribirmensaje .herramientas .herramientas-botones > a:hover,
.touch .escribirmensaje .herramientas .herramientas-botones button:hover {background-color: #016ca2;}
.touch article .herramientas .herramientas-respuestas button:hover:before {border-top-color: #016ca2;}


/* PESTANAS ======================================================================================================================= */

.contenedor-config-pag {margin: 1.25rem 0;}
.contenedor-config-pag .paginacion {float: right; margin: 0;}

.configurador {float: left; background-color: #dedede;}
.configurador__interior {position: relative;}
.configurador__interior,
.configurador__interior button {font-size: 0.625rem; text-transform: uppercase; text-align: left; font-weight: bold;}
.configurador h4,
.configurador button {float: left; line-height: 2.5rem;}
.configurador h4 {margin-left: 0.9375rem; color: #888;}
.configurador button {width: 11.250rem; padding: 0 2.1875rem 0 0.9375rem;}
.configurador button em {font-style: normal;}
.configurador button:hover {opacity: 0.5;}
.configurador button:before,
.configurador button:after {position: absolute; display: block; content: ""; border: 0.313rem solid transparent; right: 0.8125rem;}
.configurador button:before {top: 1.0625rem; border-top-color: #000;}
.configurador button:after {top: 1rem; border-top-color: #dedede;}
.configurador .capa-configurador {position: absolute; z-index: 120; right: 0; top: 2.562rem; background-color: #dedede;}
.configurador .capa-configurador ul li {display: block;}
.configurador .capa-configurador ul li button {border-bottom: 1px solid #fff; float: none;}
.configurador .capa-configurador ul li:last-child button {border-bottom: 0;}
.configurador .capa-configurador ul li button:hover {background-color: #333; color: #fff; opacity: 1;}
.configurador .capa-configurador ul li button:before,
.configurador .capa-configurador ul li button:after {display: none;}
.configurador .capa-configurador ul li.seleccionado button {background-color: #333; color: #fff;}

/* MENSAJES VARIOS ======================================================================================================================= */

/* notificaciones arriba */

.notificaciones {margin: 1.25rem 0; padding: 1.25rem 0; background-color: #333; color: #fff; text-align: center; text-transform: uppercase;}
.notificaciones p {line-height: 1rem;}
.notificaciones a{color: currentColor;border-bottom: 1px solid currentColor;}
article .notificaciones {margin: 1.25rem 0 0; padding: 1.25rem;}
.notificaciones.valorados {height: 6.875rem;}
.notificaciones.valorados p {line-height: 6.875rem;}

/* refresco pagina */

.refresco {text-align: center; font-size: 0.6875rem; margin: 1.25rem 0;}
.refresco button {display: block; width: 100%; color: #fff;}
.refresco button span {display: inline-block; text-transform: uppercase; margin: 1.25rem 1.875rem; line-height: 1.3125rem; position: relative;}
.refresco button span:before {content:"\21ba"; position: absolute; z-index: 5; left: -1.4375rem; top: 0.188rem; width: 1.0625rem; height: 0.9375rem; color: #fff; font-size: 1.25rem; line-height: 0.875rem; text-align: left; animation: rotando 0.8s 1 ease-out; -webkit-animation: rotando 0.8s 1 ease-out;}
.refresco button:hover {opacity: 0.7;}
.refresco button:hover span:before {animation: rotando 0.8s infinite linear; -webkit-animation: rotando 0.8s infinite linear;} 
@-webkit-keyframes rotando {0% {-webkit-transform: rotate(0deg); -ms-transform: rotate(0deg); transform: rotate(0deg);} 100% {-webkit-transform: rotate(-360deg); -ms-transform: rotate(-360deg); transform: rotate(-360deg);}}
@keyframes rotando {0% {-webkit-transform: rotate(0deg); -ms-transform: rotate(0deg); transform: rotate(0deg);} 100% {-webkit-transform: rotate(-360deg); -ms-transform: rotate(-360deg); transform: rotate(-360deg);}}

/* boton cargar mas mensajes */

.mostrar-mas {margin: 1.25rem 0 0; background-color: #dedede;}
.mostrar-mas button {display: block; width: 100%; font-size: 0.6875rem; font-weight: bold; text-align: center;}
.mostrar-mas button span {display: inline-block; text-transform: uppercase; margin: 1.25rem 1.25rem 1.25rem; position: relative;}
.mostrar-mas button span:before,
.mostrar-mas button span:after {position: absolute; display: block; content: ""; border: 0.313rem solid transparent; left: 50%; -ms-transform: rotate(90deg) translate(0,50%); -webkit-transform: rotate(90deg) translate(0,50%); transform: rotate(90deg) translate(0,50%); transition: bottom 0.05s linear;}
.mostrar-mas button span:before {bottom: -0.9375rem; border-left-color: #000;}
.mostrar-mas button span:after {bottom: -0.875rem; border-left-color: #dedede;}
.mostrar-mas button:hover span:before {bottom: -1.25rem;}
.mostrar-mas button:hover span:after {bottom: -1.1875rem;}

.conversacion .conversacion .mostrar-mas {margin-bottom: 1.25rem; background-color: transparent;}
.conversacion .conversacion .mostrar-mas button span:after {border-left-color: #fff;}
.conversacion .conversacion .mostrar-mas button {font-weight: normal;}

/* capa aviso al EDITAR un mensaje un usuario normal, no opinador */

.editar_mensaje_moderado {margin: 1.25rem 0 0; background-color: #333; padding: 2.8125rem 1.25rem 1.25rem; text-align: center;}
.editar_mensaje_moderado p {position: relative; line-height: 1.125rem; color: #fff;}
.editar_mensaje_moderado p:before {position: absolute; content: "!"; left: 50%; -ms-transform: translate(-50%, 0); -webkit-transform: translate(-50%, 0); transform: translate(-50%, 0); top: -1.875rem; width: 1.375rem; height: 1.375rem; border: 1px solid #fff; border-radius: 100%; font-size: 0.875rem; line-height: 1.25rem; font-weight: bold; text-align: center; padding-left: 1px; box-sizing: border-box; text-shadow: none; color: #fff;}
p.botones_aceptar_moderacion {display: inline-block; margin: 0.9375rem auto 0;}
p.botones_aceptar_moderacion a {float: right; display: inline-block; width: 6.250rem; text-align: center; padding: 0.313rem 0; text-transform: uppercase; font-size: 0.625rem; color: #fff;}
p.botones_aceptar_moderacion a.boton_cancelar_moderacion {background-color: #444;}
p.botones_aceptar_moderacion a.boton_aceptar_moderacion {margin: 0 0 0 0.313rem;}
p.botones_aceptar_moderacion a:hover {opacity: 0.5;}
p.botones_aceptar_moderacion:before {display: none;}

/* capa negra de confirmacion de borrado de mensaje */

.capa-confirmacion {opacity: 1; z-index: 150; top: 0; position: absolute; width: 100%; height: 100%; margin-left: -1.25rem; background-color: rgba(43,43,43,0.98); border: 0.313rem solid #fff; box-sizing: border-box; text-align: center; transition: all 0.2s ease;}
.capa-confirmacion.oculto {display: block!important; opacity: 0; z-index: -1; top: -0.313rem;}
.capa-confirmacion .cerrar {display: block;}
.capa-confirmacion .cerrar .icon-cerrar {color: #fff;}
.capa-confirmacion .capa-confirmacion__interior {position: absolute; left: 50%; top: 50%; width: 100%; padding: 1em; -ms-transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); color: #fff; box-sizing: border-box;}
.capa-confirmacion p {margin: 0 0 2%; font-size: 0.8125rem; color: #fff;}
.capa-confirmacion button.si,
.capa-confirmacion button.no {width: 6.250rem; text-align: center; padding: 0.625rem 0; text-transform: uppercase; font-size: 0.6875rem; color: #fff;}
.capa-confirmacion button.si {margin: 0 0.625rem 0 0;}
.capa-confirmacion button.no {background-color: #444;}
.capa-confirmacion button:focus,
.capa-confirmacion button:hover {outline: none;}
.capa-confirmacion button:hover {opacity: 0.5;}

/* boton cerrar */

.cerrar {position: absolute; z-index: 200; right: 0; top: 0; width: 2.188rem; height: 2.188rem; display: none;}
.cerrar:hover {opacity: 0.7;}
.cerrar .literal {display: block; text-indent: -9999px; overflow: hidden; font-size: 0; line-height: 0;}

/* ESCRIBIR MENSAJE ======================================================================================================================= */

.escribirmensaje {}
.escribirmensaje.colapsado {max-height: none!important;}
.escribirmensaje .escribirmensaje__interior {border: 1px solid #ddd;}
.escribirmensaje textarea {width: 100%; max-width: 100%; height: 6.250rem; padding: 1.25rem; border: 0; font-family: 'Benton Sans', sans-Serif; font-size: 0.875rem; line-height: 165%; color: #000;}
.escribirmensaje textarea:focus {outline-width: 0.125rem; outline-style: solid;}
.escribirmensaje .herramientas {border-top: 1px solid #ddd; height: 3.125rem;position: relative;}
.escribirmensaje .herramientas button,
.escribirmensaje .herramientas .adjuntar-imagen,
.escribirmensaje .herramientas .borrar-imagen,
.escribirmensaje .herramientas .contador {float: left; height: 3.125rem; line-height: 3.125rem; position: relative;}
.escribirmensaje .herramientas .herramientas-formateo {float: left;}
.escribirmensaje .herramientas .herramientas-formateo button {width: 3.125rem;}
.escribirmensaje .herramientas .herramientas-formateo button.negrita {font-family: 'Arial Black', 'Arial bold', Arial, Helvetica, sans-Serif; font-size: 0.875rem; font-weight: bold;}
.escribirmensaje .herramientas .herramientas-formateo button.cursiva {font-family: Georgia, "Times New Roman", Times, serif; font-size: 0.875rem; font-style: italic;}
.escribirmensaje .herramientas .herramientas-formateo .adjuntar-imagen,
.escribirmensaje .herramientas .herramientas-formateo .borrar-imagen {position: relative; width: 13.125rem; overflow: hidden;}
.escribirmensaje .herramientas .herramientas-formateo .adjuntar-imagen input[type="file"] {position: absolute; z-index: 10; left: -10.9375rem; top: 0; height: 100%; opacity: 0; cursor: pointer;}
.escribirmensaje .herramientas .herramientas-formateo .adjuntar-imagen .imagen,
.escribirmensaje .herramientas .herramientas-formateo .borrar-imagen .borrar {position: absolute; z-index: 9; width: 9.375rem; font-size: 0.563rem; text-transform: uppercase;}
.escribirmensaje .herramientas .herramientas-formateo .adjuntar-imagen .icon-imagen {position: relative; font-size: 1.125rem; margin-right: 0.625rem; top: 0.250rem;}
.escribirmensaje .herramientas .herramientas-formateo .borrar-imagen .borrar {}
.escribirmensaje .herramientas .herramientas-formateo .borrar-imagen .icon-borrar {position: relative; font-size: 0.9375rem; margin-right: 0.5rem; margin-left: -0.625rem; top: 0.188rem;}
.escribirmensaje .herramientas .herramientas-botones {float: right;}
.escribirmensaje .herramientas .herramientas-botones .contador {padding: 0 1.25rem 0 0; font-size: 1rem; text-align: right;}
.escribirmensaje .herramientas .herramientas-botones > a,
.escribirmensaje .herramientas .herramientas-botones button {margin: 1px 1px 1px 0; height: 3rem; width: 7.188rem; color: #fff; font-size: 0.875rem; line-height: 3rem; text-transform: uppercase; transition: background-color .07s linear;}
.escribirmensaje .herramientas .herramientas-botones .cancelar {display: none;}
.escribirmensaje .herramientas .herramientas-botones > a:hover,
.escribirmensaje .herramientas .herramientas-botones button:hover {opacity: 1; background-color: #333; color: #fff;}
.escribirmensaje .herramientas .herramientas-formateo .adjuntar-imagen:hover button.imagen,
.escribirmensaje .herramientas .herramientas-formateo .borrar-imagen:hover .borrar,
.escribirmensaje .herramientas button:hover {color: #888;}
.tooltip {position: absolute; z-index: 120; bottom: 100%; left: 50%; padding: 0.313rem 0.625rem 0.438rem; font-family: 'Roboto', sans-serif; font-size: 0.6875rem; line-height: 1rem; font-style: normal; font-weight: normal; text-transform: none; background-color: #333; color: #fff; white-space: nowrap; text-align: left; display: none;}
.tooltip sup {display: block; color: #999;}
.tooltip:after {position: absolute; left: 0; bottom: -0.375rem; width: 0; height: 0; border: 0.375rem solid; border-bottom: none; border-left: none; border-color: rgba(0, 0, 0, 0); border-top-color: #333; content: "";}
.escribirmensaje .herramientas button:hover .tooltip {display: block;}
.escribirmensaje .herramientas .herramientas-botones > a{display: inline-block;text-align: center;}
article .escribirmensaje {max-height: 62.500rem!important; transition: max-height 0.5s linear;}
article .escribirmensaje.colapsado {max-height: 0!important; overflow: hidden;}
article .escribirmensaje .escribirmensaje__interior {margin-top: 1.25rem;}
article .escribirmensaje .herramientas button {color: #000;}
article .escribirmensaje .herramientas .herramientas-botones .cancelar {display: block; background-color: #999;}
article .escribirmensaje .herramientas .herramientas-botones .cancelar:hover {opacity: 1; background-color: #333; color: #fff;}
article .escribirmensaje .herramientas,
article .escribirmensaje .herramientas button,
article .escribirmensaje .herramientas .adjuntar-imagen,
article .escribirmensaje .herramientas .borrar-imagen,
article .escribirmensaje .herramientas .contador {height: 2.625rem; line-height: 2.625rem;}
article .escribirmensaje .herramientas .herramientas-botones .contador {padding-right: 0.625rem; font-size: 0.875rem; color: #999;}
article .escribirmensaje .herramientas .herramientas-formateo button,
article .escribirmensaje .herramientas .herramientas-formateo .adjuntar-imagen,
article .escribirmensaje .herramientas .herramientas-formateo .borrar-imagen,
article .escribirmensaje .herramientas .herramientas-formateo .adjuntar-imagen .imagen,
article .escribirmensaje .herramientas .herramientas-formateo .borrar-imagen .borrar {width: 2.5rem;}
article .escribirmensaje .herramientas .herramientas-formateo .adjuntar-imagen .icon-imagen {margin: 0 0.75rem; top: 0.313rem;}
article .escribirmensaje .herramientas .herramientas-formateo .borrar-imagen .icon-borrar {margin: 0 0.8125rem;}
article .escribirmensaje .herramientas .herramientas-botones > a,
article .escribirmensaje .herramientas .herramientas-botones button {width: 5.313rem; height: 2.5rem; font-size: 0.6875rem; line-height: 2.5rem;}

/* aviso nombre apellidos */

.aviso_nombre_apellidos {background-color: #f4f4f4; border: solid #ddd; border-width: 0 1px 1px; padding-left: 2.8125rem;}
.aviso_nombre_apellidos .aviso_nombre_apellidos_texto {display: inline-block; position: relative; margin: 0.9375rem 0; font-size: 0.625rem; line-height: 0.875rem; text-transform: uppercase; text-shadow: 1px 1px 0 #fff; color: #999;}
.aviso_nombre_apellidos .aviso_nombre_apellidos_texto:before {position: absolute; content: "!"; left: -1.875rem; top: -0.250rem; width: 1.375rem; height: 1.375rem; background-color: #cacaca; border-radius: 100%; font-size: 0.875rem; line-height: 1.3125rem; font-weight: bold; text-align: center; padding-left: 1px; box-sizing: border-box; text-shadow: none; color: #fff;}

article .aviso_nombre_apellidos {display: inline-block; width: 100%; box-sizing: border-box; padding: 0 0 0 2.4375rem; margin: 0; text-align: left;}
article .aviso_nombre_apellidos .aviso_nombre_apellidos_texto {margin: 0.625rem 0; padding: 0;}
article .aviso_nombre_apellidos .aviso_nombre_apellidos_texto:before {top: -0.250rem;}

/* MENSAJE ======================================================================================================================= */

article {margin-bottom: 1.25rem;}
article .article__interior {background-color: #f4f4f4; border: 1px solid #ececec; border-radius: 1px; padding-left: 1.25rem; position: relative;}
article .article__contenido {position: relative; background-color: #fff;}
article .article__columna {margin-left: 23.750rem; margin-right: 1.25rem; border-top: 1px solid transparent;}

  /* barra superior mensaje */

article footer {position: absolute; top: 1.25rem; left: 6.250rem; width: 16.250rem;}
article footer .header-autores {}
article footer .header-autor,
article footer .header-responde {}
article footer .header-autor {font-weight: bold;}
article footer .header-autor .avatar {position: absolute; top: 0.125rem; width: 3.750rem; border: solid #ececec; border-width: 1px; margin: 0 0 0 -4.875rem;}
article footer .header-autor .avatar img {width: 100%; height: auto; display: block;}
article footer .header-autor .nombre {overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
article footer .header-autor .distintivo {position: absolute; z-index: 100; top: 1px; left: -7.188rem; width: 0.9375rem; height: 1.125rem; overflow: hidden; cursor: pointer; transition: all 0.2s linear; display: none;}
article footer .header-autor .distintivo p {padding: 0 0.438rem 0 0.9375rem; line-height: 1.0625rem; font-size: 0.6875rem; font-weight: normal; text-transform: uppercase; color: #fff; white-space: nowrap; opacity: 0; transition: all 0.2s linear;}
article footer .header-autor .distintivo:hover {width: auto;}
article footer .header-autor .distintivo:hover p {opacity: 1;}
article footer .header-autor .distintivo:after {content: ""; position: absolute; left: 0; top: 0; width: 0; height: 0; border-style: solid; border-width: 0.563rem 0.375rem; border-right: none; border-color: rgba(0, 0, 0, 0); border-left-color: #f4f4f4;}
article footer button.header-responde,
article footer span.header-responde {position: relative; width: 100%; text-align: left; line-height: 1.4375rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
article footer span.header-responde {display: inline-block;}
article footer button.header-responde:hover {opacity: 0.6;}
article footer .header-responde .icon-responde {display: inline-block; margin-right: 0.313rem; transition: all 0.2s linear;}
article footer .header-responde.pulsado {color: #000;}
article footer .header-responde.pulsado .icon-responde {-webkit-transform: rotate(-90deg); -ms-transform: rotate(-90deg); transform: rotate(-90deg);}
article footer .header-fecha {font-size: 0.625rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; text-transform: uppercase;}
article footer .header-fecha,
article footer .header-fecha a {color: #a7a7a7;}
article footer .header-fecha a:hover {color: #000;}
article footer .header-fecha .contador {font-weight: bold;}
article footer .header-fecha .contador:after {content: ". "}
article footer .header-fecha .icon-link {display: inline-block; width: 1.4375rem; text-align: center; position: relative; top: 1px;}
article footer span.header-responde {color: #666;}
article footer span.header-responde:hover {opacity: 1;}
article footer span.header-responde .icon-responde {border-left-color: #666;}
article footer.no-foto {left: 1.25rem; width: 21.250rem;}
article footer.no-foto .avatar {display: none;}
article footer.no-foto .header-autor .distintivo {left: -2.188rem;}

 /* ajuste para que se vea bien el mensaje unico */
article .header-mensaje {position: absolute; top: 1.25rem; left: 6.250rem; width: 16.250rem;}
article .header-mensaje .header-autores {}
article .header-mensaje .header-autor,
article .header-mensaje .header-responde {}
article .header-mensaje .header-autor {font-weight: bold;}
article .header-mensaje .header-autor .avatar {position: absolute; top: 0.125rem; width: 3.750rem; border: solid #ececec; border-width: 1px; margin: 0 0 0 -4.875rem;}
article .header-mensaje .header-autor .avatar img {width: 100%; height: auto; display: block;}
article .header-mensaje .header-autor .nombre {overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
article .header-mensaje .header-autor .distintivo {position: absolute; z-index: 100; top: 1px; left: -7.188rem; width: 0.9375rem; height: 1.125rem; overflow: hidden; cursor: pointer; transition: all 0.2s linear; display: none;}
article .header-mensaje .header-autor .distintivo p {padding: 0 0.438rem 0 0.9375rem; line-height: 1.0625rem; font-size: 0.6875rem; font-weight: normal; text-transform: uppercase; color: #fff; white-space: nowrap; opacity: 0; transition: all 0.2s linear;}
article .header-mensaje .header-autor .distintivo:hover {width: auto;}
article .header-mensaje .header-autor .distintivo:hover p {opacity: 1;}
article .header-mensaje .header-autor .distintivo:after {content: ""; position: absolute; left: 0; top: 0; width: 0; height: 0; border-style: solid; border-width: 0.563rem 0.375rem; border-right: none; border-color: rgba(0, 0, 0, 0); border-left-color: #f4f4f4;}
article .header-mensaje button.header-responde,
article .header-mensaje span.header-responde {position: relative; width: 100%; text-align: left; line-height: 1.4375rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
article .header-mensaje span.header-responde {display: inline-block;}
article .header-mensaje button.header-responde:hover {opacity: 0.6;}
article .header-mensaje .header-responde .icon-responde {display: inline-block; margin-right: 0.313rem; transition: all 0.2s linear;}
article .header-mensaje .header-responde.pulsado {color: #000;}
article .header-mensaje .header-responde.pulsado .icon-responde {-webkit-transform: rotate(-90deg); -ms-transform: rotate(-90deg); transform: rotate(-90deg);}
article .header-mensaje .header-fecha {font-size: 0.625rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; text-transform: uppercase;}
article .header-mensaje .header-fecha,
article .header-mensaje .header-fecha a {color: #a7a7a7;}
article .header-mensaje .header-fecha a:hover {color: #000;}
article .header-mensaje .header-fecha .contador {font-weight: bold;}
article .header-mensaje .header-fecha .contador:after {content: ". "}
article .header-mensaje .header-fecha .icon-link {display: inline-block; width: 1.4375rem; text-align: center; position: relative; top: 1px;}
article .header-mensaje span.header-responde {color: #666;}
article .header-mensaje span.header-responde:hover {opacity: 1;}
article .header-mensaje span.header-responde .icon-responde {border-left-color: #666;}
article .header-mensaje.no-foto {left: 1.25rem; width: 21.250rem;}
article .header-mensaje.no-foto .avatar {display: none;}
article .header-mensaje.no-foto .header-autor .distintivo {left: -2.188rem;}

  /* comentario mensaje */

article .comentario {margin: 1.25rem 0 0; position: relative;}
article .comentario .comentario-contenido {}
article .comentario .comentario-txt {word-wrap: break-word; word-break: break-word; font-family: 'Benton Sans', sans-Serif; font-size: 0.938rem; line-height: 165%;}
article .comentario .comentario-txt b {font-weight: 700;}
article .comentario .comentario-txt a {border-bottom: 1px dotted; padding: 0.25rem 0;}
article .comentario .comentario-txt a:hover {color: #999; border-bottom: none;}
article .comentario .comentario-txt .vervideo {border-bottom: 0; padding: 0;}

  /* tamanos txt */

.txt-menos_3 article .comentario .comentario-txt,
.txt-menos_3 .escribirmensaje textarea {font-size: 0.750rem; /* 12px */}
.txt-menos_2 article .comentario .comentario-txt,
.txt-menos_2 .escribirmensaje textarea {font-size: 0.813rem; /* 13px */}
.txt-menos_1 article .comentario .comentario-txt,
.txt-menos_1 .escribirmensaje textarea {font-size: 0.875rem; /* 14px */}
.txt-inicio article .comentario .comentario-txt,
.txt-inicio .escribirmensaje textarea {font-size: 0.938rem; /* 15px */}
.txt-mas_1 article .comentario .comentario-txt,
.txt-mas_1 .escribirmensaje textarea {font-size: 1.125rem; /* 18px */}
.txt-mas_2 article .comentario .comentario-txt,
.txt-mas_2 .escribirmensaje textarea {font-size: 1.375rem; /* 22px */}
.txt-mas_3 article .comentario .comentario-txt,
.txt-mas_3 .escribirmensaje textarea {font-size: 1.625rem; /* 26px */}

.txt-menos_3 article .comentario .comentario-txt a,
.txt-menos_2 article .comentario .comentario-txt a {padding: 0.125rem 0;}
.txt-menos_1 article .comentario .comentario-txt a {padding: 0.188rem 0;}

.txt-menos_3 .escribirmensaje textarea {height: 5rem;}
.txt-menos_2 .escribirmensaje textarea {height: 6rem;}
.txt-menos_1 .escribirmensaje textarea {height: 7rem;}
.txt-inicio .escribirmensaje textarea {height: 8rem;}
.txt-mas_1 .escribirmensaje textarea {height: 10rem;}
.txt-mas_2 .escribirmensaje textarea {height: 12rem;}
.txt-mas_3 .escribirmensaje textarea {height: 14rem;}

  /* fotos */
  
article .comentario .comentario-foto {background-color: #f4f4f4; margin: 1.25rem 0 0; text-align: center; line-height: 0;}
article .comentario .comentario-foto button {width: 100%; height: 2.5rem; font-size: 0.625rem; color: #a7a7a7; text-shadow: 1px 1px 0 #fff; text-align: center; text-transform: uppercase; transition: background-color 0.1s linear;}
article .comentario .comentario-foto button:hover {background-color: #dedede; color: #000; text-shadow: none;}
article .comentario .comentario-foto figure {position: relative; display: inline-block; vertical-align: top; max-width: 100%; max-height: 125.000rem; overflow: hidden; transition: max-height 2s linear;}
article .comentario .comentario-foto figure img {display: block; max-width: 100%; height: auto;}
article .comentario .comentario-foto figure button.ampliar-foto {display: block; position: absolute; left: 0; bottom: 0; width: 100%; height: 100%;}
article .comentario .comentario-foto figure button.ampliar-foto .rotulo {display: block; position: absolute; left: 0; bottom: 0; width: 7.688rem; height: 2.5rem; line-height: 2.5rem; background-color: rgba(0,0,0,0.6); color: #fff; text-shadow: none; transition: background-color 0.1s linear;}
article .comentario .comentario-foto figure button.ampliar-foto .icon-ampliar {margin-right: 0.313rem; font-size: 1.1875rem; vertical-align: text-bottom;}
article .comentario .comentario-foto figure button.ampliar-foto:hover {background-color: rgba(0,0,0,0.2);}
article .comentario .comentario-foto figure button.ampliar-foto:hover .rotulo {background-color: transparent;}

  /* videos */
  
article .comentario .contenedor_vervideo {background-color: #f4f4f4; margin: 1.25rem 0;}
article .comentario .contenedor_vervideo .vervideo {display: block; width: 100%; height: 2.5rem; font: 0.625rem/400% 'Roboto', sans-serif; color: #a7a7a7; text-shadow: 1px 1px 0 #fff; text-align: center; text-transform: uppercase; transition: background-color 0.1s linear;}
article .comentario .contenedor_vervideo .vervideo:hover {background-color: #dedede; color: #000; text-shadow: none;}
article .comentario .contenedor_vervideo object {display: block; margin: 0 auto; max-width: 100%;}	
article .comentario .comentario-video-alv {background-color: #f4f4f4; margin: 1.25rem 0; text-align: center; line-height: 0;}
article .comentario .comentario-video-alv span {padding-top: 0!important;}

  /* videos > como contenido externo (v2) */
  
article .comentario .embebido_video {background-color: #f4f4f4; margin: 1.25rem 0;}
article .comentario .embebido_video .vervideo {display: block; width: 100%; height: 2.5rem; font: 0.625rem/400% 'Roboto', sans-serif; color: #a7a7a7; text-shadow: 1px 1px 0 #fff; text-align: center; text-transform: uppercase; transition: background-color 0.1s linear;}
article .comentario .embebido_video .vervideo:hover {background-color: #dedede; color: #000; text-shadow: none;}
article .comentario .embebido_video iframe {display: block; margin: 0 auto!important; max-width: 100%;}

  /* contenido externo */
  
article .comentario .embebido_mensaje {background-color: #f4f4f4; margin: 1.25rem 0;}
article .comentario .embebido_mensaje .vervideo {display: block; width: 100%; height: 2.5rem; font: 0.625rem/2.5rem 'Roboto', sans-serif; color: #a7a7a7; text-shadow: 1px 1px 0 #fff; text-align: center; text-transform: uppercase; transition: background-color 0.1s linear;}
article .comentario .embebido_mensaje .vervideo:hover {background-color: #dedede; color: #000; text-shadow: none;}
article .comentario .embebido_mensaje iframe {display: block; margin: 0 auto!important; max-width: 100%;}

  /* boton desplegar comentario completo -- AL FINAL NO SE IMPLEMENTA */

article .comentario .desplegar {position: absolute; bottom: 0; left: 0; width: 100%; height: 3.750rem; border: solid #ececec; border-width: 1px 0; background-color: #fff; cursor: pointer; box-shadow: 0 -1px 0.625rem 0 rgba(0, 0, 0, 0.09);}
article .comentario .desplegar:hover {background-color: #f4f4f4;}
article .comentario .desplegar div {position: absolute; top: 1.3125rem; left: 50%; -ms-transform: translate(0.9375rem, 0); -webkit-transform: translate(0.9375rem, 0); transform: translate(0.9375rem, 0); width: 0; overflow: hidden; white-space: nowrap; font-size: 0.625rem; text-align: left; text-transform: uppercase; color: #333; transition: width 0.2s linear;}
article .comentario .desplegar:hover div {width: 6.250rem;}
article .comentario .desplegar:before,
article .comentario .desplegar:after {position: absolute; display: block; content: ""; border: 0.438rem solid transparent; left: 50%; -ms-transform: rotate(90deg) translate(0,50%); -webkit-transform: rotate(90deg) translate(0,50%); transform: rotate(90deg) translate(0,50%); transition: all 0.2s linear; }
article .comentario .desplegar:before {top: 1.625rem; border-left-color: #000;}
article .comentario .desplegar:after {top: 1.5625rem; border-left-color: #fff;}
article .comentario .desplegar:hover:after {border-left-color: #f4f4f4;}
article .comentario.alto-libre {max-height: 187.500rem; padding-bottom: 5rem; transition: max-height 8s linear;}
article .comentario.alto-libre .desplegar:before,
article .comentario.alto-libre .desplegar:after {-ms-transform: rotate(-90deg) translate(0,-50%); -webkit-transform: rotate(-90deg) translate(0,-50%); transform: rotate(-90deg) translate(0,-50%);}
article .comentario.alto-libre .desplegar:before {top: 1.0625rem;}
article .comentario.alto-libre .desplegar:after {top: 1.125rem;}

  /* barra inferior mensaje */

article .herramientas {padding: 0; position: relative;}
article .herramientas button {height: 100%; text-transform: uppercase; color: #a7a7a7; font-size: 0.625rem; line-height: 4.125rem;}

article .herramientas .herramientas-acciones {}

article .herramientas .herramientas-acciones .accion {float: left; height: 4rem; position: relative;}
article .herramientas .herramientas-acciones .responder {margin: 0 0.9375rem 0 0;}
article .herramientas .herramientas-acciones .compartir {margin: 0 0.9375rem;}
.responder span[class^="icon-"],
.compartir span[class^="icon-"] {display: none;}
article .herramientas .herramientas-acciones .responder.pulsado button,
article .herramientas .herramientas-acciones .compartir.pulsado button,
article .herramientas .herramientas-acciones .menu.pulsado button {color: #000;}

  /* votar v1: un solo boton y class = votar */

article .herramientas .herramientas-acciones .votar {position: relative; margin: 0 0.438rem 0 0.625rem; font-size: 0.625rem;}
article .herramientas .herramientas-acciones .votar button {padding: 0 0.438rem 0 0.313rem;}
article .herramientas .herramientas-acciones .votar.pulsado button {cursor: text;}
article .herramientas .herramientas-acciones .votar .icon-valorar {display: inline-block; font-size: 0.875rem; line-height: 1.8125rem; width: 1.875rem; height: 1.875rem; text-align: center; border-radius: 100%; transition: all 0.2s linear;}
article .herramientas .herramientas-acciones .votar:hover .icon-valorar {box-shadow: 0 0 0 0.188rem rgba(0,0,0,0.08); margin-right: 0;}
article .herramientas .herramientas-acciones .votar.pulsado:hover .icon-valorar {box-shadow: none;}
article .herramientas .herramientas-acciones .votar.pulsado .icon-valorar {background-color: #bbb; color: #fff; margin-right: 0;}
article .herramientas .herramientas-acciones .votar.gracias .icon-valorar {background-color: #333;}
article .herramientas .herramientas-acciones .votar .votar-contador {position: relative; left: -0.625rem; top: 0; display: inline-block; max-width: 1.5rem; overflow: hidden; color: #a7a7a7; transition: max-width 0.2s linear, opacity 0.2s linear;}
article .herramientas .herramientas-acciones .votar:hover .votar-contador,
article .herramientas .herramientas-acciones .votar.gracias .votar-contador,
article .herramientas .herramientas-acciones .votar.gracias.pulsado:hover .votar-contador {max-width: 0; opacity: 0;}
article .herramientas .herramientas-acciones .votar.pulsado .votar-contador {left: -0.125rem;}
article .herramientas .herramientas-acciones .votar.pulsado:hover .votar-contador {max-width: 1.5rem; opacity: 1;}
article .herramientas .herramientas-acciones .votar .votar-visor {position: relative; top: 0; display: inline-block; height: 0.9375rem; overflow: hidden; width: 0; transition: width 0.2s linear;}
article .herramientas .herramientas-acciones .votar:hover .votar-visor,
article .herramientas .herramientas-acciones .votar.gracias .votar-visor,
article .herramientas .herramientas-acciones .votar.gracias.pulsado:hover .votar-visor {width: 3.125rem;}
article .herramientas .herramientas-acciones .votar.pulsado:hover .votar-visor {width: 0;}
article .herramientas .herramientas-acciones .votar .literal,
article .herramientas .herramientas-acciones .votar .votar-gracias {position: absolute; left: -3.125rem; text-transform: uppercase; line-height: 0.9375rem; color: #a7a7a7; transition: all 0.3s linear;}
article .herramientas .herramientas-acciones .votar .votar-gracias {opacity: 0;}
article .herramientas .herramientas-acciones .votar.gracias .votar-gracias {opacity: 1; left: 0; color: #000;}
article .herramientas .herramientas-acciones .votar:hover .literal {left: 0;}
article .herramientas .herramientas-acciones .votar.pulsado .literal {left: -3.125rem;}
article .herramientas .herramientas-acciones .votar button,
article .herramientas .herramientas-acciones .votar .votar-contador,
article .herramientas .herramientas-acciones .votar .votar-visor {vertical-align: middle;}
article .herramientas .herramientas-acciones .votar .tooltip {display: block; width: 5.313rem; white-space: normal;}

  /* votar v2: dos botones y class = votar-doble */

article .herramientas .herramientas-acciones .votar-doble {margin: 0 0.438rem; font-size: 0.625rem;}
article .herramientas .herramientas-acciones .votar-doble .voto {position: relative;}
article .herramientas .herramientas-acciones .votar-doble .positivo {float: left;}
article .herramientas .herramientas-acciones .votar-doble .negativo {float: right; margin-left: 0.625rem;}
article .herramientas .herramientas-acciones .votar-doble button {padding: 0 0.188rem 0 0;}
article .herramientas .herramientas-acciones .votar-doble.pulsado button {cursor: text;}
article .herramientas .herramientas-acciones .votar-doble .icon-valorar {display: inline-block; font-size: 0.875rem; line-height: 1.250rem; width: 1.563rem; height: 1.563rem; text-align: center; border-radius: 100%;}
article .herramientas .herramientas-acciones .votar-doble .negativo .icon-valorar {transform: rotate(180deg); -webkit-transform: rotate(180deg);}
article .herramientas .herramientas-acciones .votar-doble .voto button:hover .icon-valorar,
article .herramientas .herramientas-acciones .votar-doble .voto.pulsado .icon-valorar {line-height: 1.375rem; color: #fff;}
article .herramientas .herramientas-acciones .votar-doble .voto button:hover .icon-valorar {background-color: #333;}
article .herramientas .herramientas-acciones .votar-doble .voto.pulsado .icon-valorar {background-color: #bbb;}
article .herramientas .herramientas-acciones .votar-doble .votar-contador {display: inline-block; max-width: 1.5rem/*24px*/; overflow: hidden; color: #a7a7a7;}
article .herramientas .herramientas-acciones .votar-doble .voto button:hover ~ .votar-contador {color: #000;}
article .herramientas .herramientas-acciones .votar-doble button,
article .herramientas .herramientas-acciones .votar-doble .votar-contador {vertical-align: middle;}
article .herramientas .herramientas-acciones .votar-doble .tooltip {display: block; width: 5.313rem; left: 0.813rem; white-space: normal;}
article .herramientas .herramientas-acciones .votar-doble .tooltip.gracias {width: 2.813rem;}



article .herramientas .herramientas-acciones .menu {z-index: 100;}
article .herramientas .herramientas-acciones .menu button {width: 2.5625rem; line-height: 4.750rem; overflow: hidden;}
article .herramientas .herramientas-acciones .menu .icon-mas {font-size: 1.5rem; line-height: 1.9375rem;}
article .herramientas .herramientas-acciones .menu .literal {display: block; text-indent: -9999px; overflow: hidden; font-size: 0;}

    /* d */

article .herramientas .herramientas-respuestas {position: absolute; right: 0; top: 1.3125rem; text-align: right;}
article .herramientas .herramientas-respuestas button {position: relative; height: 1.5625rem; line-height: 1.5625rem; padding: 0 1.5625rem 0 0.625rem; text-align: left; border-radius: 0.125rem;}
article .herramientas .herramientas-respuestas button:before,
article .herramientas .herramientas-respuestas button:after {position: absolute; display: block; content: ""; border: 0.313rem solid transparent; right: 0.625rem; transition: transform 0.2s linear;}
article .herramientas .herramientas-respuestas button:before {top: 0.625rem;}
article .herramientas .herramientas-respuestas button:after {top: 0.563rem; border-top-color: #fff;}
article .herramientas .herramientas-respuestas button em {display: inline-block; float: right; font-style: normal; margin-left: 0.250rem;}
article .herramientas .herramientas-respuestas.pulsado button {color: #a7a7a7;}
article .herramientas .herramientas-respuestas.pulsado button:before,
article .herramientas .herramientas-respuestas.pulsado button:after {-webkit-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg);}
article .herramientas .herramientas-respuestas.pulsado button:before {top: 0.313rem; border-top-color: #a7a7a7;}
article .herramientas .herramientas-respuestas.pulsado button:after {top: 0.375rem; border-top-color: #fff;}

article .herramientas .herramientas-respuestas span[class*="paso_"] {position: relative; transition: left .2s linear; float: left;}
article .herramientas .herramientas-respuestas .paso_1,
article .herramientas .herramientas-respuestas.pulsado .paso_2 {opacity: 1; width: auto; left: 0;}
article .herramientas .herramientas-respuestas .paso_2,
article .herramientas .herramientas-respuestas.pulsado .paso_1 {opacity: 0; width: 0; display: inline-block; left: -0.313rem;}

article .herramientas .herramientas-respuestas button:hover,
article .herramientas .herramientas-respuestas.pulsado button:hover {background-color: #333; color: #fff;}
article .herramientas .herramientas-respuestas button:hover:before,
article .herramientas .herramientas-respuestas.pulsado button:hover:before {border-top-color: #fff;}
article .herramientas .herramientas-respuestas button:hover:after,
article .herramientas .herramientas-respuestas.pulsado button:hover:after {border-top-color: #333;}

article .herramientas button:hover {color: #000;}


.herramientas-aviso {color:#4a4a4a;font-size: 12px;line-height: 17px;width: 330px; box-sizing: border-box;text-align: center;position: absolute;bottom: -40px;right: 117px;padding: 24px 20px;background: #fff;font-weight: 100;z-index: 20;border-radius: 4px;font-family: 'Benton Sans', arial, sans-serif;box-shadow: 0 3px 9px 0 rgba(0, 0, 0, 0.17);}
.herramientas-aviso:after {content: '';position: absolute;border-style: solid;border-width: 0 8px 8px;border-color: #FFFFFF transparent;display: block;width: 0;z-index: 2;top: 119px;right: -9px;transform: rotate(90deg);}
.herramientas-aviso b {display: block;font-weight: 700;padding-top: 20px;}
.herramientas-aviso a{color:#016ca2;border-bottom: 1px dotted currentColor;}
.escribirmensaje .herramientas .herramientas-botones .herramientas-aviso button.icon-cerrar {text-indent: 100%;white-space: nowrap;overflow: hidden;border: 0;background-color: #fff;padding: 0;box-sizing: border-box;box-shadow: 0 0 10px -2px rgba(0, 0, 0, 0.47);border-radius: 100%;width: 26px;height: 26px;position: absolute;top: -2px;right: -14px;}
.escribirmensaje .herramientas .herramientas-botones .herramientas-aviso button.icon-cerrar:before {display: none;}
.escribirmensaje .herramientas .herramientas-botones .herramientas-aviso button.icon-cerrar:after {text-indent: 0;width: 100%;height: 100%;line-height: 3.125rem;font-size: 1.6rem;text-align: center;border-radius: 100%;color: #222;content: '+';position: absolute;top: -12px;left: 12px;-webkit-transform: rotate(45deg);-moz-transform: rotate(45deg);-ms-transform: rotate(45deg);-o-transform: rotate(45deg);transform: rotate(45deg);}

/* ... en article */

article .herramientas-aviso {height: 170px;bottom: -30px;right: 86px;}
article .herramientas-aviso:after {top: 115px;}
article .herramientas-aviso b {padding-top: 10px;}

@media screen and (max-width: 30rem) { /* 480px */

	/* ... en article */
	
	article .herramientas-aviso {width: 98%;left: 4px;height: 140px;bottom: auto;top: -98px;}
	article .herramientas-aviso:after {transform: rotate(180deg);right: 22%;top: 138px;}
	article .escribirmensaje .herramientas .herramientas-botones .herramientas-aviso button.icon-cerrar {top: -26px;left: 50%; transform: translate(-50%,0);}

	.escribirmensaje .herramientas .herramientas-botones .herramientas-aviso button.icon-cerrar {width: 40px;height: 40px; ;top: -5px;right: -28px;}
	.escribirmensaje .herramientas .herramientas-botones .herramientas-aviso button.icon-cerrar:after{ font-size: 2rem; top: -8px; left: 8px; }
}
@media screen and (max-width: 26.875rem) { /* 430px */

	.herramientas-aviso {font-size: 11px;width: 70%;height: 187px;bottom: auto;top: -97px;right: auto;left: 4px;padding-top: 19px;box-shadow: 0 -1px 9px 0 rgba(0, 0, 0, 0.17);}
	.herramientas-aviso b {padding-top: 7px;}
}
@media screen and (max-width: 21.250rem) { /* 340px */

	.herramientas-aviso {width: 220px;height: 188px;padding-top: 13px;}
	
	/* ... en article */
	
	article .herramientas-aviso {font-size: 10px;padding: 13px 5px 5px;}
	article .herramientas-aviso b {padding-top: 3px;}
}
  /* capas desplegables: COMPARTIR Y MENU */
  
.capa  {bottom: 4rem; background-color: #333;} 
.capa,
.capa-rrss ul li:last-child:after, 
.capa-menu:after {position: absolute; z-index: 110; left: 50%; -ms-transform: translate(-50%, 0); -webkit-transform: translate(-50%, 0); transform: translate(-50%, 0);}
.capa-rrss ul li:last-child:after,
.capa-menu:after {bottom: -0.5rem; width: 0; height: 0; border: 0.5rem solid; border-bottom: none; border-color: rgba(0, 0, 0, 0); border-top-color: #333; content: "";}
.capa ul li {padding: 0.75rem 0.438rem; border: solid #3e3e3e; border-width: 1px 0 0; color: #fff; cursor: pointer;}
.capa ul li:first-child {border-width: 0;}
.capa ul li:hover {background-color: #222;}
.capa-rrss ul li:hover:after,
.capa-menu.pulsado:after {border-top-color: #222;}
.capa span[class^="icon-"] {display: inline-block; width: 0.9375rem; margin: 0 0.75rem 0 0.313rem; font-size: 0.8125rem; vertical-align: baseline; text-align: center;}

  /* capa COMPARTIR */
  
.capa-rrss {width: 7.5rem;}
.capa-rrss ul {}
.capa-rrss ul li {position: relative;}
article .herramientas .herramientas-acciones .compartir .capa-rrss span.icon-twitter {vertical-align: text-bottom;}
article .herramientas .herramientas-acciones .compartir .capa-rrss span.icon-linkedin {font-size: 0.6875rem;}
article .herramientas .herramientas-acciones .compartir .capa-rrss span.icon-google-plus {font-size: 0.8125rem; position: relative; top: 1px;}

  /* capa MENU */

.capa-menu,
.capa-menu:after {z-index: 20;}
.capa-menu {width: 7.5rem; height: 5.688rem; font-size: 0.625rem;}
.capa-menu.pulsado {width: 11.250rem; height: 10.188rem;}
.capa-menu.denunciar {height: 7.938rem;}
.capa-menu .opciones {position: absolute; top: 0; left: 0; width: 100%; height: 100%; white-space: nowrap; background-color: #333;}
.capa-menu.pulsado .opciones {border-right: 1px solid #3e3e3e; width: 2.5rem; z-index: 20;}
.capa-menu.pulsado .opciones ul li {border: 0; color: #666;}
.capa-menu.pulsado .opciones ul li.pulsado {color: #fff;}
.capa-menu.pulsado .opciones ul li:hover {color: #fff; background-color: transparent;}
article .herramientas .herramientas-acciones .menu .capa-menu .opciones ul li .literal {display: inline; text-indent: 0; font-size: 0.625rem;}
article .herramientas .herramientas-acciones .menu .capa-menu.pulsado .opciones ul li .literal  {display: none;}
.capa-menu .sub {margin-left: 2.5rem; height: 100%; background-color: #222;}
.capa-menu .sub ul {width: 100%; padding: 0.625rem; box-sizing: border-box;}
.capa-menu .sub ul li {padding: 0.438rem; margin-top: 1px; border-width: 0; background-color: #333; box-sizing: border-box; transition: text-indent 0.1s linear;}
.capa-menu .sub ul li:first-child {margin-top: 0;}
.capa-menu .sub ul li:hover {opacity: 0.6;}
.capa-menu [class^="icon-"] {margin-right: 0.9375rem; font-size: 0.6875rem;}
.capa-menu .opciones [class^="icon-"] {font-size: 1rem; vertical-align: sub;}
.capa-menu .opciones .icon-share {font-size: 0.875rem;}
.capa-menu .opciones .icon-embed {font-size: 1rem;}
.capa-menu .insertar {padding: 0.9375rem; box-sizing: border-box;}
.capa-menu .insertar p {margin-bottom: 0.375rem; font-size: 0.625rem; line-height: 0.9375rem; color: #fff;}
.capa-menu .insertar textarea {border: 0; width: 100%; resize: none; height: 6.250rem; box-sizing: border-box; font: 0.625rem/0.6875rem "Courier New", Courier, monospace; background-color: #222; color: #888; word-wrap: break-word; word-break: break-word; overflow: hidden;}
.capa-menu .denunciar ul li {padding-left: 0.625rem;}
.capa-menu .denunciar ul li.boton-disagree {display: none;}
.capa-menu .boton-editar,
.capa-menu .boton-borrar {display: none;}
.capa-menu .mensaje-gracias {padding: 0.625rem; box-sizing: border-box;}
.capa-menu .mensaje-gracias .mensaje-gracias__interior {height: 100%; background-color: #333; vertical-align: bottom;}
.capa-menu .mensaje-gracias p {display: inline-block; margin: 2.8125rem 0 0 0.625rem; line-height: 1rem; color: #fff; position: relative;}
.capa-menu .mensaje-gracias p:before {content: ""; position: absolute; z-index: 5; top: -1.875rem; left: 0.313rem; width: 0.5rem; height: 0.9375rem; border: solid #fff; border-width: 0 1px 1px 0; -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg);}

  /* capa menu en mensaje mio: oculto unos items y muestro otros, y ajusto el alto de la capa, tanto en normal como en conversacion */

.mensajes:not(.modo_conversacion) article.mio .capa-menu,
.conversacion article.mio > .article__interior > .article__contenido > .article__columna > .herramientas > .herramientas-acciones > .menu  > .capa-menu {height: 8.563rem;}
.mensajes:not(.modo_conversacion) article.mio .capa-menu.pulsado,
.conversacion article.mio > .article__interior > .article__contenido > .article__columna > .herramientas > .herramientas-acciones > .menu  > .capa-menu.pulsado {height: 10.375rem;}
.mensajes:not(.modo_conversacion) article.mio .capa-menu .boton-editar,
.mensajes:not(.modo_conversacion) article.mio .capa-menu .boton-borrar,
.conversacion article.mio > .article__interior > .article__contenido > .article__columna > .herramientas > .herramientas-acciones > .menu  > .capa-menu .boton-editar,
.conversacion article.mio > .article__interior > .article__contenido > .article__columna > .herramientas > .herramientas-acciones > .menu  > .capa-menu .boton-borrar {display: block;}
.mensajes:not(.modo_conversacion) article.mio .capa-menu .boton-marcar,
.conversacion article.mio > .article__interior > .article__contenido > .article__columna > .herramientas > .herramientas-acciones > .menu  > .capa-menu .boton-marcar {display: none;}
.mensajes:not(.modo_conversacion) article.mio .capa-menu .insertar textarea,
.conversacion article.mio > .article__interior > .article__contenido > .article__columna > .herramientas > .herramientas-acciones > .menu  > .capa-menu .insertar textarea {line-height: 0.750rem;}

  /* capa menu en mensaje mio: ajustes para hacerla apaisada cuando el mensaje mio es el primero de arriba */

.mensajes:not(.modo_conversacion) article.mio:first-child .capa-menu,
main > .conversacion > article.mio:first-child > .article__interior > .article__contenido > .article__columna > .herramientas > .herramientas-acciones > .menu  > .capa-menu {width: 15.625rem;}
.mensajes:not(.modo_conversacion) article.mio:first-child .capa-menu.pulsado,
main > .conversacion > article.mio:first-child > .article__interior > .article__contenido > .article__columna > .herramientas > .herramientas-acciones > .menu  > .capa-menu.pulsado {height: 2.813rem;}

/* CAPAS DESPLEGABLES: diseno apaisado para primer mensaje del hilo, pero no para los hijos anidados en modo conversacion */

.mensajes:not(.modo_conversacion) article:first-child .capa-rrss,
main > .conversacion > article:first-child > .article__interior > .article__contenido > .article__columna > .herramientas > .herramientas-acciones > .compartir  > .capa-rrss {width: 11.5rem;}
.mensajes:not(.modo_conversacion) article:first-child .capa-rrss:after,
main > .conversacion > article:first-child > .article__interior > .article__contenido > .article__columna > .herramientas > .herramientas-acciones > .compartir  > .capa-rrss:after {position: absolute; z-index: 110; left: 50%; -ms-transform: translate(-50%, 0); -webkit-transform: translate(-50%, 0); transform: translate(-50%, 0); bottom: -0.5rem; width: 0; height: 0; border: 0.5rem solid; border-bottom: none; border-color: rgba(0, 0, 0, 0); border-top-color: #333; content: "";}
.mensajes:not(.modo_conversacion) article:first-child .capa-rrss ul li:last-child:after,
main > .conversacion > article:first-child > .article__interior > .article__contenido > .article__columna > .herramientas > .herramientas-acciones > .compartir  > .capa-rrss ul li:last-child:after {display: none;}
.mensajes:not(.modo_conversacion) article:first-child .capa-rrss ul li,
main > .conversacion > article:first-child > .article__interior > .article__contenido > .article__columna > .herramientas > .herramientas-acciones > .compartir  > .capa-rrss ul li {float: left; width: 2.813rem; height: 2.813rem; line-height: 2.813rem; box-sizing: content-box; padding: 0; border-width: 0 0 0 1px; text-align: center; overflow: hidden;}
.mensajes:not(.modo_conversacion) article:first-child .capa-rrss ul li span[class^="icon-"],
main > .conversacion > article:first-child > .article__interior > .article__contenido > .article__columna > .herramientas > .herramientas-acciones > .compartir  > .capa-rrss ul li span[class^="icon-"] {margin: 0 auto; vertical-align: baseline;}
.mensajes:not(.modo_conversacion) article:first-child .herramientas .herramientas-acciones .compartir .capa-rrss span.icon-twitter,
main > .conversacion > article:first-child > .article__interior > .article__contenido > .article__columna > .herramientas > .herramientas-acciones > .compartir  > .herramientas .herramientas-acciones .compartir .capa-rrss span.icon-twitter {vertical-align: baseline;}
.mensajes:not(.modo_conversacion) article:first-child .herramientas .herramientas-acciones .compartir .capa-rrss span.icon-linkedin,
main > .conversacion > article:first-child > .article__interior > .article__contenido > .article__columna > .herramientas > .herramientas-acciones > .compartir  > .herramientas .herramientas-acciones .compartir .capa-rrss span.icon-linkedin {font-size: 0.8125rem; position: relative; top: -1px;}
.mensajes:not(.modo_conversacion) article:first-child .herramientas .herramientas-acciones .compartir .capa-rrss span.icon-google-plus,
main > .conversacion > article:first-child > .article__interior > .article__contenido > .article__columna > .herramientas > .herramientas-acciones > .compartir  > .herramientas .herramientas-acciones .compartir .capa-rrss span.icon-google-plus {font-size: 1rem;}

.mensajes:not(.modo_conversacion) article:first-child .capa-menu,
main > .conversacion > article:first-child > .article__interior > .article__contenido > .article__columna > .herramientas > .herramientas-acciones > .menu  > .capa-menu {width: 11.438rem; height: 2.813rem;}
.mensajes:not(.modo_conversacion) article:first-child .capa-menu ul li,
main > .conversacion > article:first-child > .article__interior > .article__contenido > .article__columna > .herramientas > .herramientas-acciones > .menu  > .capa-menu ul li {float: left; border-width: 0 0 0 1px; box-sizing: border-box; text-align: center; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.mensajes:not(.modo_conversacion) article:first-child .capa-menu ul li.boton-insertar,
main > .conversacion > article:first-child > .article__interior > .article__contenido > .article__columna > .herramientas > .herramientas-acciones > .menu  > .capa-menu ul li.boton-insertar {width: 5.313rem;}
.mensajes:not(.modo_conversacion) article:first-child .capa-menu ul li.boton-marcar,
main > .conversacion > article:first-child > .article__interior > .article__contenido > .article__columna > .herramientas > .herramientas-acciones > .menu  > .capa-menu ul li.boton-marcar {width: 6.125rem;}
.mensajes:not(.modo_conversacion) article:first-child .capa-menu ul li.boton-editar,
main > .conversacion > article:first-child > .article__interior > .article__contenido > .article__columna > .herramientas > .herramientas-acciones > .menu  > .capa-menu ul li.boton-editar {width: 5.188rem;}
.mensajes:not(.modo_conversacion) article:first-child .capa-menu ul li.boton-borrar,
main > .conversacion > article:first-child > .article__interior > .article__contenido > .article__columna > .herramientas > .herramientas-acciones > .menu  > .capa-menu ul li.boton-borrar {width: 5.125rem;}
.mensajes:not(.modo_conversacion) article:first-child .capa-menu ul li span[class^="icon-"],
main > .conversacion > article:first-child > .article__interior > .article__contenido > .article__columna > .herramientas > .herramientas-acciones > .menu  > .capa-menu ul li span[class^="icon-"] {margin-right: 0.5rem; margin-left: 0;}

.mensajes:not(.modo_conversacion) article:first-child .capa-menu.pulsado,
main > .conversacion > article:first-child > .article__interior > .article__contenido > .article__columna > .herramientas > .herramientas-acciones > .menu  > .capa-menu.pulsado {width: 18rem;}
.mensajes:not(.modo_conversacion) article:first-child .capa-menu.pulsado .insertar,
main > .conversacion > article:first-child > .article__interior > .article__contenido > .article__columna > .herramientas > .herramientas-acciones > .menu  > .capa-menu.pulsado .insertar {padding: 0.5rem 0.625rem 0.625rem;}
.mensajes:not(.modo_conversacion) article:first-child .capa-menu.pulsado .insertar p,
main > .conversacion > article:first-child > .article__interior > .article__contenido > .article__columna > .herramientas > .herramientas-acciones > .menu  > .capa-menu.pulsado .insertar p {margin-bottom: 0.125rem;}
.mensajes:not(.modo_conversacion) article:first-child .capa-menu.pulsado .insertar textarea,
main > .conversacion > article:first-child > .article__interior > .article__contenido > .article__columna > .herramientas > .herramientas-acciones > .menu  > .capa-menu.pulsado .insertar textarea {height: 0.750rem; white-space: nowrap; text-overflow: ellipsis;}
.mensajes:not(.modo_conversacion) article:first-child .capa-menu.pulsado .opciones,
main > .conversacion > article:first-child > .article__interior > .article__contenido > .article__columna > .herramientas > .herramientas-acciones > .menu  > .capa-menu.pulsado .opciones {display: none;}
.mensajes:not(.modo_conversacion) article:first-child .capa-menu.pulsado .sub,
main > .conversacion > article:first-child > .article__interior > .article__contenido > .article__columna > .herramientas > .herramientas-acciones > .menu  > .capa-menu.pulsado .sub {margin-left: 0;}
.mensajes:not(.modo_conversacion) article:first-child .capa-menu.pulsado .sub.denunciar ul,
main > .conversacion > article:first-child > .article__interior > .article__contenido > .article__columna > .herramientas > .herramientas-acciones > .menu  > .capa-menu.pulsado .sub.denunciar ul {padding: 0;}
.mensajes:not(.modo_conversacion) article:first-child .capa-menu.pulsado .sub.denunciar ul li,
main > .conversacion > article:first-child > .article__interior > .article__contenido > .article__columna > .herramientas > .herramientas-acciones > .menu  > .capa-menu.pulsado .sub.denunciar ul li {width: auto; margin-top: 0; padding: 0 0.5rem; line-height: 2.813rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.mensajes:not(.modo_conversacion) article:first-child .capa-menu.pulsado .sub.denunciar ul li.boton-insulto,
main > .conversacion > article:first-child > .article__interior > .article__contenido > .article__columna > .herramientas > .herramientas-acciones > .menu  > .capa-menu.pulsado .sub.denunciar ul li.boton-insulto,
.mensajes:not(.modo_conversacion) article:first-child .capa-menu.pulsado .sub.denunciar ul li.boton-spam,
main > .conversacion > article:first-child > .article__interior > .article__contenido > .article__columna > .herramientas > .herramientas-acciones > .menu  > .capa-menu.pulsado .sub.denunciar ul li.boton-spam {width: 30%;}
.mensajes:not(.modo_conversacion) article:first-child .capa-menu.pulsado .sub.denunciar ul li.boton-offtopic,
main > .conversacion > article:first-child > .article__interior > .article__contenido > .article__columna > .herramientas > .herramientas-acciones > .menu  > .capa-menu.pulsado .sub.denunciar ul li.boton-offtopic {width: 40%;}
.mensajes:not(.modo_conversacion) article:first-child .capa-menu.pulsado .sub.denunciar ul li.boton-disagree,
main > .conversacion > article:first-child > .article__interior > .article__contenido > .article__columna > .herramientas > .herramientas-acciones > .menu  > .capa-menu.pulsado .sub.denunciar ul li.boton-disagree {display: none;}
.mensajes:not(.modo_conversacion) article:first-child .capa-menu .mensaje-gracias .mensaje-gracias__interior,
main > .conversacion > article:first-child > .article__interior > .article__contenido > .article__columna > .herramientas > .herramientas-acciones > .menu  > .capa-menu .mensaje-gracias .mensaje-gracias__interior {text-align: center;}
.mensajes:not(.modo_conversacion) article:first-child .capa-menu .mensaje-gracias p,
main > .conversacion > article:first-child > .article__interior > .article__contenido > .article__columna > .herramientas > .herramientas-acciones > .menu  > .capa-menu .mensaje-gracias p {margin: 0 auto; line-height: 1.500rem;}
.mensajes:not(.modo_conversacion) article:first-child .capa-menu .mensaje-gracias p:before,
main > .conversacion > article:first-child > .article__interior > .article__contenido > .article__columna > .herramientas > .herramientas-acciones > .menu  > .capa-menu .mensaje-gracias p:before {top: 1px; left: -1.250rem;}


/* ---------------------------------------------------
   USUARIO NO LOGADO - class 'no-logado' en el body
   desactivamos visualmente algunas funciones
   --------------------------------------------------- */

.no-logado article .herramientas .herramientas-acciones .responder button {color: #ddd;}
.no-logado article .herramientas .herramientas-acciones .responder button:hover {color: #ddd; cursor: not-allowed;}
.no-logado article .herramientas .herramientas-acciones .votar button:hover{color: #a7a7a7; cursor: not-allowed;}
.no-logado article .herramientas .herramientas-acciones .votar:hover .icon-valorar {box-shadow: none;}
.no-logado article .herramientas .herramientas-acciones .votar:hover .votar-contador {max-width: 1.5rem; opacity: 1;}
.no-logado article .herramientas .herramientas-acciones .votar:hover .votar-visor {width: 0;}
.no-logado article .herramientas .herramientas-acciones .votar:hover .literal {left: -3.125rem;}
.no-logado article .herramientas .herramientas-acciones .votar-doble .voto button:hover {color: #a7a7a7; cursor: not-allowed;}
.no-logado article .herramientas .herramientas-acciones .votar-doble .voto button:hover .icon-valorar {background-color: #fff; color: #a7a7a7; line-height: 1.250rem;}
.no-logado article .herramientas .herramientas-acciones .votar-doble .voto.pulsado button:hover .icon-valorar {background-color: #bbb; color: #fff;line-height: 1.375rem;}
.no-logado article .herramientas .herramientas-acciones .votar-doble .voto button:hover ~ .votar-contador {color: #a7a7a7;}
.no-logado .capa ul li.boton-marcar {text-shadow: 1px 1px 0 #3c3c3c;}
.no-logado .capa ul li.boton-marcar,
.no-logado .capa-menu.pulsado .opciones ul li.boton-marcar:hover {color: #1f1f1f;}
.no-logado .capa ul li.boton-marcar:hover {background-color: transparent; cursor: not-allowed;}
.no-logado article .herramientas .herramientas-acciones .responder .tooltip,
.no-logado article .herramientas .herramientas-acciones .votar .tooltip,
.no-logado article .herramientas .herramientas-acciones .votar-doble .tooltip,
.no-logado .capa ul li.boton-marcar .tooltip {width: 5rem; white-space: normal; background-color: #e9e8cf; border: 0; color: #000; box-shadow: 0 0 0 0.188rem rgba(255,255,255,1); text-shadow: none; display: block;}
.no-logado article .herramientas .herramientas-acciones .responder .tooltip:after,
.no-logado article .herramientas .herramientas-acciones .votar .tooltip:after,
.no-logado article .herramientas .herramientas-acciones .votar-doble .tooltip:after,
.no-logado .capa ul li.boton-marcar .tooltip:after {border-width: 0.625rem; bottom: -0.625rem; border-top-color: #e9e8cf;}
.no-logado .capa ul li.boton-marcar {position: relative;}
.no-logado .capa ul li.boton-marcar:hover .tooltip {left: -100.188rem; bottom: 0;}
.no-logado .capa ul li.boton-marcar:hover .tooltip:after {left: auto; right: -0.5rem; bottom: 1.5625rem; -ms-transform: translate(0, 50%); -webkit-transform: translate(0, 50%); transform: translate(0, 50%); border: 0.5rem solid; border-right: none; border-color: rgba(0, 0, 0, 0); border-left-color: #e9e8cf;}
.no-logado .capa.pulsado ul li.boton-marcar:hover .tooltip {left: 2.75rem; bottom: -0.313rem}
.no-logado .capa.pulsado ul li.boton-marcar:hover .tooltip:after {left: -0.5rem; right: auto; bottom: 1.875rem; border-left: none; border-right: 0.5rem solid #e9e8cf;}

/* MENSAJE usuario destacado */

article.destacado footer .header-autor .distintivo {display: block;}

/* MENSAJE flotante */

article.flotante {margin-left: -1.25rem; margin-bottom: 0; overflow: hidden; max-height: 125rem; transition: max-height 8s linear;}
article.flotante.colapsado {transition-timing-function: ease-out; transition-duration: 0.3s;}
article.flotante .cerrar {display: block;}
article.flotante .article__interior {border-width: 0 0 1px 0; border-radius: 0; position: relative;}
article.flotante .article__interior:before,
article.flotante .article__interior:after {position: absolute; z-index: 10; display: block; content: ""; border: 0.625rem solid transparent; left: 11.25rem; -webkit-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg);}
article.flotante .article__interior:before {bottom: -1px; border-top-color: #d6d6d6;}
article.flotante .article__interior:after {bottom: -0.125rem; border-top-color: #fff;}
article.flotante .article__interior,
article.flotante .article__contenido {background-color: #fdfdfd!important;}
article.flotante.borrado .article__contenido {min-height: 0;}
article.flotante footer .header-autor .distintivo:after {border-left-color: #fdfdfd!important;}
article.flotante footer .header-autor .distintivo {display: none;}
article.flotante.destacado footer .header-autor .distintivo {display: block;}
article.flotante .herramientas div,
article.flotante .menu,
article.flotante .responder,
article.flotante .herramientas-respuestas,
article.flotante footer .header-fecha .icon-link {display: none;}

/* MENSAJE provisional */

article.provisional {}
article.provisional .rotulo-provisional {position: absolute; z-index: 100; top: 0; width: 100%; height: 100%; margin-left: -1.25rem; background-color: rgba(255,255,255,0.6); overflow: hidden;}
article.provisional .rotulo-provisional .rotulo-provisional__interior {position: absolute; top: 0; right: 2.5rem; width: 12.500rem; box-sizing: border-box; height: 100%;}
article.provisional .rotulo-provisional p {position: absolute; left: 50%; top: 50%; -ms-transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); width: 100%; padding: 1.25rem; box-sizing: border-box; font-size: 0.6875rem; text-transform: uppercase; color: #ddd;}
article.provisional .rotulo-provisional .rotulo-provisional__interior,
article.provisional .rotulo-provisional p:before,
article.provisional .rotulo-provisional p:after {background-color: #333;}
article.provisional .rotulo-provisional p:before,
article.provisional .rotulo-provisional p:after {position: absolute; border-radius: 100%; box-sizing: border-box;}
article.provisional .rotulo-provisional p:before {content: "!"; left: -3.4375rem; top: 0.9375rem; width: 1.875rem; height: 1.875rem; color: #fff; font-size: 0.875rem; line-height: 1.8125rem; text-align: center; padding-left: 1px;}
article.provisional .rotulo-provisional p:after {content: ""; left: -1.25rem; top: 1.25rem; width: 0.9375rem; height: 0.9375rem;}
article.provisional .rotulo-provisional p a {position: relative; display: block; padding: 0.625rem 0 0.625rem 1.25rem; text-align: center; color: #fff; border: 1px solid #222; border-radius: 0.250rem; background: linear-gradient(to bottom, rgba(0,0,0,0) 0%, rgba(0,0,0,0.2) 100%);}
article.provisional .rotulo-provisional p a:before {content:"\21ba"; position: absolute; z-index: 5; left: 0.6875rem; top: 0.8125rem; width: 1.0625rem; height: 0.9375rem; color: #fff; font-size: 1.25rem; line-height: 0.875rem; text-align: left;}
article.provisional .rotulo-provisional p a:hover {opacity: 0.7;} 
article.provisional .rotulo-provisional p a:hover:before {animation: rotando 0.8s infinite linear; -webkit-animation: rotando 0.8s infinite linear;} 

/* MENSAJE provisional y flotante -> cosas comunes */

article.provisional .article__contenido,
article.flotante .article__contenido {min-height: 6.500rem;}
article.provisional .article__columna,
article.flotante .article__columna {padding-bottom: 1.250rem;}
article.provisional footer .header-fecha .contador,
article.flotante footer .header-fecha .contador {display: none;}

/* MENSAJE borrado */

article.borrado {}
article.borrado > .article__interior {}
article.borrado > .article__interior .flotante {display: none;}
article.borrado > .article__interior .article__contenido {border-color: #e0e0e0; background: repeating-linear-gradient(-45deg,#f9f9f9,#f9f9f9 0.313rem,#fff 0.313rem,#fff 0.625rem)!important;}
article.borrado > .article__interior .article__columna {margin-left: 1.25rem!important; margin-right: 1.25rem!important;/* important para sobreescribir los de conversacion */}
article.borrado > .article__interior .comentario {margin: 0;}
article.borrado > .article__interior .comentario .comentario-txt {padding: 0.9375rem 0; font-family: 'Roboto', sans-serif; font-size: 0.625rem; line-height: 1.3125rem; text-transform: uppercase; text-align: center; color: #ccc; text-shadow: 1px 1px 0 #fff;}
article.borrado > .article__interior footer {display: none;}
article.borrado > .article__interior .herramientas .herramientas-acciones {display: none;}
article.borrado > .article__interior .herramientas .herramientas-respuestas {top: -2.375rem;}

article.borrado > .article__interior .herramientas .herramientas-respuestas button {background-color: #fff; box-shadow: inset 0 0 0 1px rgba(0,0,0,.03);}
article.borrado > .article__interior .herramientas .herramientas-respuestas button:hover,
article.borrado > .article__interior .herramientas .herramientas-respuestas.pulsado button:hover {background-color: #333; color: #fff;}


/* CONVERSACION ======================================================================================================================= */

.conversacion {margin: 1.25rem 0 0 1.25rem;}
main > .conversacion {margin: 0;}
.hijo .hijo .hijo .hijo .hijo .hijo .conversacion {margin: 1.25rem 0 0 0;} /* indentamos hasta el sexto nivel */

.hijo .article__interior {background-color: #e8e8e8;}
.hijo .hijo .article__interior {background-color: #dadada;}
.hijo .hijo .hijo .article__interior {background-color: #cdcdcd;}
.hijo .hijo .hijo .hijo .article__interior {background-color: #c0c0c0;}
.hijo .hijo .hijo .hijo .hijo .article__interior {background-color: #b3b3b3;}
.hijo .hijo .hijo .hijo .hijo .hijo .article__interior {background-color: #a7a7a7;}
.hijo footer .header-autor .distintivo:after {border-left-color: #e8e8e8;}
.hijo .hijo footer .header-autor .distintivo:after {border-left-color: #dadada;}
.hijo .hijo .hijo  footer .header-autor .distintivo:after {border-left-color: #cdcdcd;}
.hijo .hijo .hijo .hijo footer .header-autor .distintivo:after {border-left-color: #c0c0c0;}
.hijo .hijo .hijo .hijo .hijo footer .header-autor .distintivo:after {border-left-color: #b3b3b3;}
.hijo .hijo .hijo .hijo .hijo .hijo footer .header-autor .distintivo:after {border-left-color: #a7a7a7;}
.hijo .article__columna {margin-left: 22.500rem;}
.hijo .hijo .article__columna {margin-left: 21.250rem;}
.hijo .hijo .hijo .article__columna {margin-left: 20rem;}
.hijo .hijo .hijo .hijo  .article__columna {margin-left: 18.750rem;}
.hijo .hijo .hijo .hijo .hijo .article__columna {margin-left: 17.500rem;}
.hijo .hijo .hijo .hijo .hijo .hijo .article__columna {margin-left: 16.250rem;}
.hijo footer {width: 15rem;}
.hijo .hijo footer {width: 13.750rem;}
.hijo .hijo .hijo footer {width: 12.500rem;}
.hijo .hijo .hijo .hijo footer {width: 11.250rem;}
.hijo .hijo .hijo .hijo .hijo footer {width: 10rem;}
.hijo .hijo .hijo .hijo .hijo .hijo footer {width: 8.750rem;}
.hijo footer.no-foto {width: 20rem;}
.hijo .hijo footer.no-foto {width: 18.750rem;}
.hijo .hijo .hijo footer.no-foto {width: 17.500rem;}
.hijo .hijo .hijo .hijo footer.no-foto {width: 16.250rem;}
.hijo .hijo .hijo .hijo .hijo footer.no-foto {width: 15rem;}
.hijo .hijo .hijo .hijo .hijo .hijo footer.no-foto {width: 13.750rem;}

/* PAGINACION ======================================================================================================================= */

.paginacion {margin: 1.25rem 0; height: 2.5rem; text-align: right;}
.paginacion .paginacion__interior {display: inline-block; text-align: left;}
.paginacion ul li {display: block; float: left; width: 2.5rem; height: 2.5rem; margin-left: 1px; text-indent: -9999px; overflow: hidden; line-height: 2.5rem;}
.paginacion ul li.pagina {width: auto; min-width: 2.5rem; text-indent: 0; text-align: center; padding: 0 0.625rem; box-sizing: border-box;}
.paginacion ul li a,
.paginacion ul li span,
.paginacion ul li em {display: block; width: 100%; height: 100%; position: relative;}
.paginacion ul li a {background-color: #dedede;}
.paginacion ul li span {background-color: #f4f4f4;}
.paginacion ul li a:before,
.paginacion ul li a:after,
.paginacion ul li span:before,
.paginacion ul li span:after,
.paginacion ul li em:before,
.paginacion ul li em:after {position: absolute; z-index: 1; display: block; content: ""; border: 0.250rem solid transparent; top: 1rem; -webkit-transform: rotate(90deg); -ms-transform: rotate(90deg); transform: rotate(90deg);}
.paginacion ul li a:before,
.paginacion ul li span:before {left: 0.875rem;}
.paginacion ul li a:after,
.paginacion ul li span:after {left: 0.9375rem;}
.paginacion ul li a:before {border-top-color: #000;}
.paginacion ul li a:after {border-top-color: #dedede;}
.paginacion ul li span:before {border-top-color: #bbb;}
.paginacion ul li span:after {border-top-color: #f4f4f4;}
.paginacion ul li .siguiente:before,
.paginacion ul li .siguiente:after {-webkit-transform: rotate(-90deg); -ms-transform: rotate(-90deg); transform: rotate(-90deg);}
.paginacion ul li .siguiente:before {left: 1.125rem; border-top-color: #bbb;}
.paginacion ul li .siguiente:after {left: 1.0625rem; border-top-color: #f4f4f4;}
.paginacion ul li a.siguiente:before {border-top-color: #000;}
.paginacion ul li a.siguiente:after {border-top-color: #dedede;}
.paginacion ul li em:before {left: 0.6875rem; border-top-color: #bbb;}
.paginacion ul li em:after {left: 0.75rem; border-top-color: #f4f4f4;}
.paginacion ul li a em:before {border-top-color: #000;}
.paginacion ul li a em:after {border-top-color: #dedede;}
.paginacion ul li .inicio:before {left: 1rem;}
.paginacion ul li .inicio:after {left: 1.0625rem;}
.paginacion ul li a:hover {background-color: #333;}
.paginacion ul li a:hover:before,
.paginacion ul li a:hover em:before {border-top-color: #fff;}
.paginacion ul li a:hover:after,
.paginacion ul li a:hover em:after {border-top-color: #333;}

/* elementos con clearfix ======================================================================================================================= */

article .herramientas .herramientas-respuestas .paso_1,
.capa-menu .sub ul,
.contenedor-config-pag:after,
.contenedor-config-pag .configurador:after,
.configurador__interior:after,
.escribirmensaje .escribirmensaje__interior:after,
.escribirmensaje .herramientas .herramientas-botones:after,
.escribirmensaje .herramientas .herramientas-formateo:after,
.escribirmensaje .herramientas:after,
.paginacion ul:after,
article .herramientas .herramientas-acciones .votar:after,
article .herramientas .herramientas-acciones .votar-doble:after,
article .herramientas .herramientas-acciones:after,
article footer .header-autores:after {content: ''; clear: both; display: table;}

/* cargando ======================================================================================================================= */

.cargando-wrapper {width: 100%; overflow: hidden;}
.cargando {width: 1.875rem; height: 1.875rem; margin: 1.25rem auto; border: 1px solid; border-color: rgba(0, 0, 0, 0.2) rgba(0, 0, 0, 0.2) rgba(0, 0, 0, 0.2) #000; -webkit-animation: loading 1s infinite linear; animation: loading 1s infinite linear; border-radius: 100%;}
.cargando.blanco {border-color: rgba(255, 255, 255, 0.2) rgba(255, 255, 255, 0.2) rgba(255, 255, 255, 0.2) #fff;}
.cargando.peq {width: 1.25rem; height: 1.25rem; margin: 0.375rem auto; border-width: 0.125rem;}
@-webkit-keyframes loading {0% {-webkit-transform: rotate(0deg); -ms-transform: rotate(0deg); transform: rotate(0deg);} 100% {-webkit-transform: rotate(360deg); -ms-transform: rotate(360deg); transform: rotate(360deg);}}
@keyframes loading {0% {-webkit-transform: rotate(0deg); -ms-transform: rotate(0deg); transform: rotate(0deg);} 100% {-webkit-transform: rotate(360deg); -ms-transform: rotate(360deg); transform: rotate(360deg);}}


/* ---------------------------------------------------------------------------------------

	RESPONSIVE 
	
   -------------------------------------------------------------------------------------- */


@media only screen and (min-resolution: 100dpi)  { /* solo en alta densidad. hay que corregir que pinta la flecha de recarga mas pequena que en escritorio */

	/* boton refresco */
	
	.refresco button span:before {top: -0.313rem; left: -1.875rem; width: 1.75rem; height: 1.75rem; line-height: 1.375rem; font-size: 1.75rem;}
	.refresco button:hover {opacity: 1;}
	.refresco button:hover span:before {animation: none; -webkit-animation: none;} 
	
}

@media screen and (max-width: 53.125rem) {  /* 850px */

	/* configurador y paginacion: reducimos espacios para usuarios no logados */

	.no-logado .contenedor-config-pag {padding: 0.313rem 0;} 

	/* MENSAJE: datos y cuerpo uno encima del otro, sin columnas */

	article .article__contenido {padding: 1.25rem 1.25rem 0 1.25rem;}
	article .article__columna {margin-left: 0; margin-right: 0; border-top: 0;}
	article footer,
	article footer.no-foto {left: 0;}
	article footer {position: relative; top: 0; overflow: hidden;}
	article footer,
	article footer button.header-responde,
	article footer span.header-responde {width: auto; line-height: 1.1875rem;}
	article footer span.header-responde {margin-bottom: -0.313rem;}
	article footer .header-autor .nombre {float: left; margin-right: 0.375rem;}
	article footer .header-autor .avatar {width: 2.1875rem; top: 0; left: 2.5rem; margin-left: 0;}
	article footer .header-autor .distintivo,
	article footer.no-foto .header-autor .distintivo {left: 0.313rem;}
	article footer .header-fecha,
	article footer .header-autores {margin-left: 3.125rem;}
	article footer.no-foto .header-fecha,
	article footer.no-foto .header-autores {margin-left: 0;}
	article footer:after {content: ""; position: absolute; z-index: 10; top: 0; right: 0; display: block; width: 2.5rem; height: 99%; background: linear-gradient(to right, rgba(255,255,255,0) 0%, rgba(255,255,255,1) 100%);}
	article.flotante footer:after {background: linear-gradient(to right, rgba(253,253,253,0) 0%, rgba(253,253,253,1) 100%);}
	article .comentario {margin-top: 0.9375rem;}
	article.provisional footer {height: 2.375rem;}
	article.provisional .article__contenido,
	article.flotante .article__contenido {padding-bottom: 1.25rem; min-height: 0;}
	article.provisional .article__columna,
	article.flotante .article__columna {padding-bottom: 0;}
	article.flotante .article__interior:before,
	article.flotante .article__interior:after {left: 2.5rem;}
	article.borrado > .article__interior .article__contenido {padding: 0;}
	article.borrado > .article__interior .article__columna {margin-left: 1.25rem!important; margin-right: 1.25rem!important;/* important para sobreescribir los de conversacion */}
	article.flotante.borrado > .article__interior {display: inline-block; width: 100%; box-sizing: border-box;}
	article.flotante.borrado > .article__interior .article__contenido {padding: 0;}
	
	/* conversacion */

	.hijo .article__columna,
	.hijo .hijo .article__columna,
	.hijo .hijo .hijo .article__columna,
	.hijo .hijo .hijo .hijo  .article__columna,
	.hijo .hijo .hijo .hijo .hijo .article__columna,
	.hijo .hijo .hijo .hijo .hijo .hijo .article__columna {margin-left: 0;}
	article footer,
	.hijo footer,
	.hijo .hijo footer,
	.hijo .hijo .hijo footer,
	.hijo .hijo .hijo .hijo footer,
	.hijo .hijo .hijo .hijo .hijo footer,
	.hijo .hijo .hijo .hijo .hijo .hijo footer,
	article footer.no-foto,
	.hijo footer.no-foto,
	.hijo .hijo footer.no-foto,
	.hijo .hijo .hijo footer.no-foto,
	.hijo .hijo .hijo .hijo footer.no-foto,
	.hijo .hijo .hijo .hijo .hijo footer.no-foto,
	.hijo .hijo .hijo .hijo .hijo .hijo footer.no-foto {width: auto; margin-left: -2.5rem; padding-left: 2.5rem;}
}

@media screen and (max-width: 36.250rem) { /* 580px */

	/* aviso nombre y apellidos */

	.conversacion .aviso_nombre_apellidos {padding-left: 0; text-align: center;}
	.conversacion .aviso_nombre_apellidos .aviso_nombre_apellidos_texto:before {display: none;}
	.conversacion article .aviso_nombre_apellidos {clear: both; padding-left: 0;}
	.conversacion article .aviso_nombre_apellidos .aviso_nombre_apellidos_texto {margin-right: 0.313rem; margin-left: 0.313rem;}
	
	/* MENSAJE: cuerpo textos mas pequeno */
	
	.escribirmensaje textarea {padding: 0.625rem;}
	
	/* MENSAJE: botones mensaje mas juntos */
	
	article .herramientas .herramientas-acciones .responder {margin: 0 0.625rem 0 0;}
	article .herramientas .herramientas-acciones .compartir {margin: 0 0.625rem;}
	article .herramientas .herramientas-acciones .votar {margin: 0;}
	
	/* MENSAJE: boton mostrar respuestas: escondemos literal SOLO EN CONVERSACION */
		
	.conversacion article .herramientas .herramientas-respuestas button em,
	.conversacion article .herramientas .herramientas-respuestas button .paso_2 {display: none;}
	.conversacion article .herramientas .herramientas-respuestas.pulsado .paso_1 {opacity: 1; width: auto; left: 0;}
	.conversacion article .herramientas .herramientas-respuestas.pulsado:before {right: 0.9375rem;}
	.conversacion article .herramientas .herramientas-respuestas.pulsado:before {display: none;}
	
	/* MENSAJE: reducimos margen izquierdo */
	
	.conversacion {margin: 0.625rem 0 0 0.625rem;}
	article {margin-bottom: 0.625rem;}
	article.flotante {margin-left: -0.625rem;}
	article .article__interior {padding-left: 0.625rem;}
	.capa-confirmacion {margin-left: -0.625rem;}
	.conversacion .conversacion .mostrar-mas {margin: 0.625rem 0;}
	
	/* MENSAJE: ... hacemos mas pequeno el distintivo */
	
	article footer .header-autor .distintivo,
	article footer.no-foto .header-autor .distintivo {left: 0.188rem; height: 0.875rem;}
	article footer .header-autor .distintivo:after {border-width: 0.438rem 0.250rem;}
	article footer .header-autor .distintivo p {font-size: 0.625rem; line-height: 0.875rem;}
	
	/* MENSAJE: ... y empujamos a la izquierda el footer y el avatar */
	
	article footer .header-autor .avatar {left: 1.875rem;}
	article footer,
	.hijo footer,
	.hijo .hijo footer,
	.hijo .hijo .hijo footer,
	.hijo .hijo .hijo .hijo footer,
	.hijo .hijo .hijo .hijo .hijo footer,
	.hijo .hijo .hijo .hijo .hijo .hijo footer,
	article footer.no-foto,
	.hijo footer.no-foto,
	.hijo .hijo footer.no-foto,
	.hijo .hijo .hijo footer.no-foto,
	.hijo .hijo .hijo .hijo footer.no-foto,
	.hijo .hijo .hijo .hijo .hijo footer.no-foto,
	.hijo .hijo .hijo .hijo .hijo .hijo footer.no-foto {margin-left: -1.875rem; padding-left: 1.875rem;}
	
	/* MENSAJE BORRADO: lo hacemos mas fino */
	
	article.borrado > .article__interior .comentario .comentario-txt {padding: 0.625rem 0;}
	article.borrado > .article__interior .herramientas .herramientas-respuestas {top: -2.0625rem;}
	
	/* BOTON mostrar mas mensajes */
	
	.mostrar-mas button {font-size: 0.625rem;}
	
}

@media screen and (max-width: 30rem) { /* 480px */

	/* escribir mensaje principal */ /* ocultamos literal de adjuntar imagen y borrar */

	.escribirmensaje .herramientas .herramientas-formateo button,
	.escribirmensaje .herramientas .herramientas-formateo .adjuntar-imagen,
	.escribirmensaje .herramientas .herramientas-formateo .borrar-imagen,
	.escribirmensaje .herramientas .herramientas-formateo .adjuntar-imagen .imagen,
	.escribirmensaje .herramientas .herramientas-formateo .borrar-imagen .borrar {width: 2.5rem;}
	.escribirmensaje .herramientas .herramientas-formateo .adjuntar-imagen .icon-imagen {margin: 0 0.75rem; top: 0.313rem;}
	.escribirmensaje .herramientas .herramientas-formateo .borrar-imagen .icon-borrar {margin: 0 0.8125rem;}

	/* escribir mensaje en article */ /* dejamos contador caracteres arriba y pasamos los botones de cancelar/publicar abajo, Y LUEGO FUERA TAMBIEN */
	
	article .escribirmensaje .herramientas .herramientas-formateo,
	article .escribirmensaje .herramientas .herramientas-botones {float: none; width: 100%;}
	article .escribirmensaje .herramientas .herramientas-botones {}
	article .escribirmensaje .herramientas .herramientas-botones .contador {position: absolute; top: 0; right: 0; color: #000;}
	article .escribirmensaje .herramientas .herramientas-botones > a,
	article .escribirmensaje .herramientas .herramientas-botones button {width: 50%; margin: 0; border: 1px solid #fff; box-sizing: border-box;}
	article .escribirmensaje .herramientas .herramientas-botones button.cancelar {border-right: 0;}

	/* aviso nombre y apellidos */

	.aviso_nombre_apellidos,
	article .aviso_nombre_apellidos {text-align: center;}
	.aviso_nombre_apellidos {padding-left: 0;}
	.aviso_nombre_apellidos .aviso_nombre_apellidos_texto:before {display: none;}
	article .aviso_nombre_apellidos {clear: both; padding-left: 0;}
	article .aviso_nombre_apellidos .aviso_nombre_apellidos_texto {margin-right: 0.313rem; margin-left: 0.313rem;}
	
	/* MENSAJE: boton mostrar respuestas: escondemos literal FUERA DE CONVERSACION TB */
	
	article .herramientas .herramientas-respuestas button em,
	article .herramientas .herramientas-respuestas button .paso_2 {display: none;}
	article .herramientas .herramientas-respuestas.pulsado .paso_1 {opacity: 1; width: auto; left: 0;}
	article .herramientas .herramientas-respuestas.pulsado:before {right: 0.9375rem;}
	article .herramientas .herramientas-respuestas.pulsado:before {display: none;}
	
	/* MENSAJE: botones herramientas con icono */
	
	article .herramientas .herramientas-acciones .compartir {margin: 0 0.625rem 0 0.313rem;}
	article .herramientas .herramientas-acciones .responder .literal,
	article .herramientas .herramientas-acciones .compartir .literal {display: none;}
	article .herramientas .herramientas-acciones .responder .icon-responder,
	article .herramientas .herramientas-acciones .compartir .icon-share {display: inline-block; line-height: 1.875rem; width: 1.875rem; height: 1.875rem; text-align: center; border-radius: 100%; transition: all 0.2s linear;}
	article .herramientas .herramientas-acciones .responder .icon-responder {font-size: 0.8125rem;}
	article .herramientas .herramientas-acciones .compartir .icon-share {font-size: 0.75rem;}
	
	/* MENSAJE: reducimos margen derecho */
	
	article .article__contenido {padding: 1.25rem 0.625rem 0 1.25rem;}
	
	/* MENSAJE BORRADO: reducimos margenes laterales */
	
	article.borrado > .article__interior .article__columna {margin-left: 0.625rem!important; margin-right: 0.625rem!important;/* important para sobreescribir los de conversacion */}
	
	/* MENSAJE PROVISIONAL: empujamos el rotulo a la derecha */
	
	article.provisional .rotulo-provisional .rotulo-provisional__interior {right: 0;}
	
	/* CAPA EDICION MENSAJE: botones mas pequenos */
	
	p.botones_aceptar_moderacion a {width: 4.375rem; padding: 0.625rem 0;}
	p.botones_aceptar_moderacion a.boton_aceptar_moderacion {margin-left: 0.625rem;}
	
}

@media screen and (max-width: 26.250rem) { /* 420px */

	/* configurador y paginacion: ocultamos h4 y ems y reducimos espacios */
	
	.contenedor-config-pag .configurador h4,
	.contenedor-config-pag .configurador em {display: none;}
	.configurador button,
	.configurador .capa-configurador {width: 8.5rem;}
	.configurador button {padding-left: 0.313rem; padding-right: 0;}
	.configurador button:before,
	.configurador button:after {right: 0.5rem;}
	.configurador button:after {}
	.configurador .capa-configurador {}
	.configurador .capa-configurador ul li:last-child button {border-bottom: none;}

}

@media screen and (max-width: 22.500rem) { /* 360px */

	/* MENSAJE: botones herramientas mas juntos y literales de votar mas pequenos */
	
	article .herramientas .herramientas-acciones .responder {margin-right: 0.313rem;}
	article .herramientas .herramientas-acciones .compartir {margin-right: 0.313rem; margin-left: 0.313rem;}
	article .herramientas .herramientas-acciones .votar {margin-right: 0; margin-left: 0; font-size: 0.5rem;}
	article .herramientas .herramientas-acciones .votar .votar-contador {top: 0.125rem;}
	.conversacion article .herramientas .herramientas-acciones .votar {margin-right: 0; margin-left: 0; font-size: 0.5rem;}
	article .herramientas .herramientas-acciones .votar:hover .votar-visor,
	article .herramientas .herramientas-acciones .votar.gracias .votar-visor,
	article .herramientas .herramientas-acciones .votar.gracias.pulsado:hover .votar-visor {width: 2.4375rem;}
	article .herramientas .herramientas-acciones .votar-doble {margin-right: 0; font-size: 0.5rem;}
	article .herramientas .herramientas-acciones .votar-doble .negativo {margin-left: 0.313rem;}
	article .herramientas .herramientas-acciones .votar-doble .votar-contador {top: 0.125rem;}
	.conversacion article .herramientas .herramientas-acciones .responder {margin-right: 0;}
	.conversacion article .herramientas .herramientas-acciones .compartir {margin-right: 0; margin-left: 0;}
	.conversacion article .herramientas .herramientas-acciones .votar-doble .negativo button {padding-left: 0;}
	
	/* MENSAJE: capa menu desplazada a la izquierda a partir de hijo 5 conversacion */
	
	.hijo .hijo .hijo .hijo .hijo .capa-menu.pulsado {left: 0;}
	.hijo .hijo .hijo .hijo .hijo .capa-menu.pulsado:after {left: auto; right: 4.188rem; -webkit-transform: none; -ms-transform: none; transform: none;}
	
	/* MENSAJE: en el ultimo hijo de la conversacion no pintamos los marcadores de las votaciones */
	
	.hijo .hijo .hijo .hijo .hijo .hijo .herramientas .herramientas-acciones .votar-doble .votar-contador {display: none;}
	
	/* MENSAJE PROVISIONAL: quitamos pelotas en mensajes de conversacion */
	
	.conversacion article.provisional .rotulo-provisional p:before,
	.conversacion article.provisional .rotulo-provisional p:after {display: none;}
	

}

/* -----------------------------------------------------------------------------------

   si estamos en un dispositivo touch, nacho anyade un class touch al body del widget,
   y asi podemos anular los hover que molestan en touch (que son los que se confunden
   con los class 'pulsado' de los botones, por ejemplo)
	
   ----------------------------------------------------------------------------------- */

.touch .configurador [class^="configurador-"]:hover {opacity: 1;}
.touch .escribirmensaje .herramientas .herramientas-formateo .adjuntar-imagen:hover button.imagen,
.touch .escribirmensaje .herramientas button:hover {color: #000;}
.touch .escribirmensaje .herramientas .herramientas-botones > a:hover,
.touch .escribirmensaje .herramientas .herramientas-botones button:hover {color: #fff;}
.touch .escribirmensaje .herramientas button:hover .tooltip {display: none;}
.touch article .escribirmensaje .herramientas .herramientas-botones .cancelar:hover {background-color: #999;}
.touch article footer .header-fecha a:hover {color: #a7a7a7;}
.touch article footer button.header-responde:hover {opacity: 1;}
.touch article .herramientas .herramientas-acciones .votar-doble .voto button:hover .icon-valorar {background-color: #fff; color: #a7a7a7; line-height: 1.250rem;}
.touch article .herramientas .herramientas-acciones .votar-doble .voto.pulsado button:hover .icon-valorar {background-color: #bbb; color: #fff;line-height: 1.375rem;}
.touch article .herramientas .herramientas-acciones .votar-doble .voto button:hover ~ .votar-contador {color: #a7a7a7;}
.touch article .herramientas .herramientas-respuestas button:hover {background-color: transparent;}
.touch article .herramientas .herramientas-respuestas.pulsado button:hover {background-color: transparent; color: #a7a7a7;}
.touch article .herramientas .herramientas-respuestas.pulsado button:hover:before {border-top-color: #a7a7a7;}
.touch article .herramientas .herramientas-respuestas button:hover:after {border-top-color: #fff;}
.touch article .herramientas .herramientas-respuestas.pulsado button:hover:after {border-top-color: #fff;}
.touch article .herramientas button:hover {color: #a7a7a7;}
.touch p.botones_aceptar_moderacion a:hover,
.touch .capa-confirmacion button:hover,
.touch article.provisional .rotulo-provisional p a:hover {opacity: 1;}
.touch .paginacion ul li a:hover {background-color: #dedede;}
.touch .paginacion ul li a:hover:before,
.touch .paginacion ul li a:hover em:before {border-top-color: #000;}
.touch .paginacion ul li a:hover:after,
.touch .paginacion ul li a:hover em:after {border-top-color: #dedede;}

/* ----------------------------------------------------------------------------------

	ALTO CONTRASTE - class 'alto-contraste' en el body
	
   ---------------------------------------------------------------------------------- */

.alto-contraste {background-color: #000!important; color: #fff!important;}
.alto-contraste * {background-color: #000!important; color: #fff!important; border-color: #fff!important; box-shadow: none!important; text-shadow: none!important;}

/* bordes */

.alto-contraste .paginacion ul li a:after,
.alto-contraste .paginacion ul li span:after,
.alto-contraste .paginacion ul li em:after,
.alto-contraste .paginacion ul li a.siguiente:after,
.alto-contraste .paginacion ul li a.anterior:after,
.alto-contraste .configurador button:after,
.alto-contraste .capa-rrss ul li:last-child:after,
.alto-contraste .capa-menu:after,
.alto-contraste main article .herramientas .herramientas-respuestas button:before,
.alto-contraste .tooltip:after {border-top-color: #fff!important;}
.alto-contraste .paginacion ul li a:hover:before,
.alto-contraste .paginacion ul li a:hover em:before,
.alto-contraste article.flotante .article__interior:after,
.alto-contraste article .herramientas .herramientas-respuestas button:after,
.alto-contraste .capa ul li {border-top-color: #000!important;}
.alto-contraste .configurador .capa-configurador ul li button {border-bottom-color: #000!important;}
.alto-contraste article .article__columna {border-top-color: transparent!important;}
.alto-contraste article.flotante footer .header-autor .distintivo:after,
.alto-contraste .mostrar-mas button span:after {border-left-color: #000!important;}
.alto-contraste footer .header-autor .distintivo:after,
.alto-contraste .mostrar-mas button span:before {border-left-color: #fff!important;}
.alto-contraste .capa-confirmacion,
.alto-contraste article .escribirmensaje .herramientas .herramientas-botones > a,
.alto-contraste article .escribirmensaje .herramientas .herramientas-botones button,
.alto-contraste .editar_mensaje_moderado p:before {border-color: #000!important;}

/* fondo NEGRO */

.alto-contraste .capa-menu .sub ul li,
.alto-contraste article.borrado > .article__interior,
.alto-contraste article.flotante .article__interior,
.alto-contraste article.flotante .article__contenido {background-color: #000!important;}

/* fondo BLANCO */

.alto-contraste .paginacion ul li span,
.alto-contraste .paginacion ul li a,
.alto-contraste .paginacion ul li em,
.alto-contraste article .article__interior {background-color: #fff!important;}

/* fondo BLANCO color NEGRO */

.alto-contraste .capa-confirmacion,
.alto-contraste .capa-confirmacion .capa-confirmacion__interior,
.alto-contraste .capa-confirmacion .capa-confirmacion__interior p,
.alto-contraste .capa-confirmacion .capa-confirmacion__interior .acciones,
.alto-contraste article.provisional .rotulo-provisional .rotulo-provisional__interior,
.alto-contraste article.provisional .rotulo-provisional p,
.alto-contraste article.provisional .rotulo-provisional p:before,
.alto-contraste article.provisional .rotulo-provisional p:after,
.alto-contraste article .comentario .contenedor_vervideo,
.alto-contraste article .comentario .contenedor_vervideo a,
.alto-contraste article .comentario .comentario-video-alv,
.alto-contraste article .comentario .comentario-video-alv span,
.alto-contraste article .comentario .embebido_mensaje a,
.alto-contraste article .comentario .embebido_video,
.alto-contraste article .comentario .embebido_video a,
.alto-contraste article .comentario .comentario-foto,
.alto-contraste article .comentario .comentario-foto button,
.alto-contraste article .herramientas .herramientas-acciones .votar.pulsado .icon-valorar,
.alto-contraste article .herramientas .herramientas-acciones .votar-doble .voto.pulsado .icon-valorar,
.alto-contraste article .herramientas .herramientas-acciones .menu .capa-menu .opciones ul li .literal,
.alto-contraste .escribirmensaje .herramientas .herramientas-botones > a,
.alto-contraste .escribirmensaje .herramientas .herramientas-botones button,
.alto-contraste .aviso_nombre_apellidos .aviso_nombre_apellidos_texto:before,
.alto-contraste .capa span[class^="icon-"],
.alto-contraste .capa ul li,
.alto-contraste .capa-menu.pulsado,
.alto-contraste .capa-menu .opciones,
.alto-contraste .capa-menu .sub,
.alto-contraste .capa-menu .sub ul,
.alto-contraste .capa-menu .insertar p,
.alto-contraste .capa-menu .insertar textarea,
.alto-contraste .refresco,
.alto-contraste .refresco button,
.alto-contraste .refresco button span,
.alto-contraste .refresco button span:before,
.alto-contraste .notificaciones,
.alto-contraste .notificaciones p,
.alto-contraste .configurador button,
.alto-contraste .configurador button em,
.alto-contraste .configurador__interior,
.alto-contraste .configurador__interior h4,
.alto-contraste .tooltip,
.alto-contraste .tooltip sup,
.alto-contraste .editar_mensaje_moderado,
.alto-contraste .editar_mensaje_moderado p {background-color: #fff!important; color: #000!important;}

/* fondo transparente */

.alto-contraste .capa-confirmacion .cerrar,
.alto-contraste .capa-confirmacion .cerrar span,
.alto-contraste article .comentario .comentario-foto figure button.ampliar-foto,
.alto-contraste article footer,
.alto-contraste article.provisional .rotulo-provisional {background-color: transparent!important;}

/* color BLANCO */

.alto-contraste .capa-menu .sub ul li,
.alto-contraste .configurador .capa-configurador ul li.seleccionado,
.alto-contraste .configurador .capa-configurador ul li.seleccionado button,
.alto-contraste .configurador .capa-configurador ul li.seleccionado button em,
.alto-contraste .configurador .capa-configurador ul li button:hover,
.alto-contraste .configurador .capa-configurador ul li button:hover em,
.alto-contraste article footer .header-autor .distintivo,
.alto-contraste article footer .header-autor .distintivo p {color: #fff!important;}

/* color NEGRO */

.alto-contraste .capa-confirmacion .cerrar .icon-cerrar,
.alto-contraste .editar_mensaje_moderado p:before {color: #000!important;}

/* varios */

.alto-contraste .cargando {border-color: rgba(255, 255, 255, 0.2) rgba(255, 255, 255, 0.2) rgba(255, 255, 255, 0.2) #fff!important; border-width: 0.125rem;}
.alto-contraste article footer:after {background: linear-gradient(to right, rgba(0,0,0,0) 0%, rgba(0,0,0,1) 100%);}
.alto-contraste article.borrado > .article__interior .article__contenido {background-image: none!important;}
.alto-contraste .capa-menu .insertar p,
.alto-contraste .capa-confirmacion .cerrar .icon-cerrar,
.alto-contraste article .herramientas .herramientas-acciones .votar.pulsado .icon-valorar,
.alto-contraste article .herramientas .herramientas-acciones .votar-doble .voto.pulsado .icon-valorar {font-weight: bold;}
.alto-contraste article .herramientas .herramientas-acciones .votar-doble .icon-valorar {line-height: 1.375rem;}

