﻿@font-face {
	font-family: 'Roboto Condensed';
	src: url('/fonts/v1.x/v1.0/roboto/robotocondensed-regular-webfont.eot');
	src: url('/fonts/v1.x/v1.0/roboto/robotocondensed-regular-webfont.eot?#iefix') format('embedded-opentype'), url('/fonts/v1.x/v1.0/roboto/robotocondensed-regular-webfont.woff') format('woff'), url('/fonts/v1.x/v1.0/roboto/robotocondensed-regular-webfont.ttf') format('truetype'), url('/fonts/v1.x/v1.0/roboto/robotocondensed-regular-webfont.svg#robotocondensed') format('svg');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: 'Roboto Condensed';
	src: url('/fonts/v1.x/v1.0/roboto/robotocondensed-bold-webfont.eot');
	src: url('/fonts/v1.x/v1.0/roboto/robotocondensed-bold-webfont.eot?#iefix') format('embedded-opentype'), url('/fonts/v1.x/v1.0/roboto/robotocondensed-bold-webfont.woff') format('woff'), url('/fonts/v1.x/v1.0/roboto/robotocondensed-bold-webfont.ttf') format('truetype'), url('/fonts/v1.x/v1.0/roboto/robotocondensed-bold-webfont.svg#robotocondensedbold') format('svg');
	font-weight: bold;
	font-style: normal;
}
@font-face {
	font-family: 'Roboto';
	src: url('/fonts/v1.x/v1.0/roboto/roboto-regular-webfont.eot');
	src: url('/fonts/v1.x/v1.0/roboto/roboto-regular-webfont.eot?#iefix') format('embedded-opentype'), url('/fonts/v1.x/v1.0/roboto/roboto-regular-webfont.woff') format('woff'), url('/fonts/v1.x/v1.0/roboto/roboto-regular-webfont.ttf') format('truetype'), url('/fonts/v1.x/v1.0/roboto/roboto-regular-webfont.svg#robotoregular') format('svg');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: 'Roboto';
	src: url('/fonts/v1.x/v1.0/roboto/roboto-italic-webfont.eot');
	src: url('/fonts/v1.x/v1.0/roboto/roboto-italic-webfont.eot?#iefix') format('embedded-opentype'), url('/fonts/v1.x/v1.0/roboto/roboto-italic-webfont.woff') format('woff'), url('/fonts/v1.x/v1.0/roboto/roboto-italic-webfont.ttf') format('truetype'), url('/fonts/v1.x/v1.0/roboto/roboto-italic-webfont.svg#robotoitalic') format('svg');
	font-weight: normal;
	font-style: italic;
}
@font-face {
	font-family: 'Roboto';
	src: url('/fonts/v1.x/v1.0/roboto/roboto-bold-webfont.eot');
	src: url('/fonts/v1.x/v1.0/roboto/roboto-bold-webfont.eot?#iefix') format('embedded-opentype'), url('/fonts/v1.x/v1.0/roboto/roboto-bold-webfont.woff') format('woff'), url('/fonts/v1.x/v1.0/roboto/roboto-bold-webfont.ttf') format('truetype'), url('/fonts/v1.x/v1.0/roboto/roboto-bold-webfont.svg#robotobold') format('svg');
	font-weight: bold;
	font-style: normal;
}

html, body {height: 100%;}
a {color: #016ca2; text-decoration: none; outline: none;}
a img {border: 0;}
ul, ul li {list-style-type: none; margin: 0; padding: 0;}
p {margin: 0;}
.estirar:after {visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0;}

body {margin: 0; font-family: 'Roboto', sans-serif; font-size: 13px; line-height: 21px; background-color: #fbfbfb; min-width: 220px;}

/* BASE: ENTREVISTADO */

/* barra superior con info */

.info_sup {position: fixed; z-index: 10; top: 0; left: 0; width: 100%; height: 56px; background-color: #f4f4f4; box-shadow: inset 0 -5px 9px -5px rgba(0, 0, 0, 0.3);}
.info_sup .medio {position: absolute; display: inline-block; margin: 7px 0 0 10px;}
.info_sup .medio a.logo {width: 85px; height: 19px; display: block; background: url(/iconos/v1.x/v1.4/entrevistas_digitales/logo_elpais.svg) no-repeat 0 0/100% auto; background: url(/iconos/v1.x/v1.4/entrevistas_digitales/logo_elpais.png) 0 0 no-repeat/100% auto; transition: opacity 0.1s linear;}
.info_sup .medio a.logo:hover {opacity: 0.5;}
.info_sup .medio h1 {float: left; width: auto; margin: 2px 0 0; text-transform: uppercase; font-weight: normal; font-size: 12px; line-height: 21px;}
.info_sup .medio h1 a {color: #016ca2; opacity: 0.8;}
.info_sup .medio h1 a:hover {opacity: 0.5; text-decoration: none;}
.info_sup .medio h2 {float: left; text-transform: lowercase; font-size: 17px; line-height: 21px; margin: -1px 0 0 15px; color: #016ca2; position: relative;}
.info_sup .medio h2:before {position: absolute; left: -10px; top: 1px; content: "/";}
.info_sup .medio h3 {position: absolute; left: 0; top: 60px; margin: 0; font: normal 15px Georgia, "Times New Roman", Times, serif; text-transform: uppercase; color: #fff; background-color: #333; padding: 7px 10px 8px; max-width: 146px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden;}
.info_sup .inner {margin: 0 auto; font-size: 11px;}
.info_sup .inner p {float: left; padding: 7px 17px; width: 100%; color: rgba(0, 0, 0, 0.8); font-size: 10px; font-weight: bold; text-transform: uppercase; box-sizing: border-box;}
.info_sup .inner p:after {position: absolute; left: 40px; bottom: 0; width: 0; height: 0; border: 7px solid; border-top: none; border-color: rgba(0, 0, 0, 0); border-bottom-color: #fff; content: "";}
.info_sup .inner p span {display: block; overflow: hidden; max-width: 240px; font-size: 22px; font-weight: normal; color: rgba(0, 0, 0, 1);}
.info_sup .inner .datos_entrevistado {position: absolute; width: 230px; right: -1px; top: 0; border-right: 1px solid rgba(0, 0, 0, 0.05);}
.info_sup .inner .datos_entrevistado p {border-left: 1px solid rgba(0, 0, 0, 0.05); color: rgba(0, 0, 0, 0.4); width: 50%;}
.info_sup .inner .datos_entrevistado p span {color: rgba(0, 0, 0, 0.5);}
.info_sup .inner .datos_entrevistado p:after {display: none;}

.entrevistado .info_sup .inner p {width: auto; max-width: 160px;}
.entrevistado .info_sup .inner p:after {display: none;}

.entrevistado .info_sup .inner p.flashazo {-webkit-animation: flashazo 6s; animation: flashazo 6s;}

@-webkit-keyframes flashazo {
	0% {background-color: rgba(0,0,0,0);}
	3% {background-color: rgba(0,0,0,.2);}
	6% {background-color: rgba(0,0,0,0);}
	9% {background-color: rgba(0,0,0,.2);}
	12% {background-color: rgba(0,0,0,0);}
	15% {background-color: rgba(0,0,0,.2);}
	18% {background-color: rgba(0,0,0,0);}
	21% {background-color: rgba(0,0,0,.2);}
	24% {background-color: rgba(0,0,0,0);}
	27% {background-color: rgba(0,0,0,.2);}
	90% {background-color: rgba(0,0,0,.2);}
	100% {background-color: rgba(0,0,0,0);}
}
@keyframes flashazo {
	0% {background-color: rgba(0,0,0,0);}
	3% {background-color: rgba(0,0,0,.2);}
	6% {background-color: rgba(0,0,0,0);}
	9% {background-color: rgba(0,0,0,.2);}
	12% {background-color: rgba(0,0,0,0);}
	15% {background-color: rgba(0,0,0,.2);}
	18% {background-color: rgba(0,0,0,0);}
	21% {background-color: rgba(0,0,0,.2);}
	24% {background-color: rgba(0,0,0,0);}
	27% {background-color: rgba(0,0,0,.2);}
	90% {background-color: rgba(0,0,0,.2);}
	100% {background-color: rgba(0,0,0,0);}
}


.info_sup .inner a.despedida {float: right; position: relative; padding: 28px 0 0; margin-right: 20px; color: #000; text-transform: uppercase; font-size: 10px;}
.info_sup .inner a.despedida:before,
.info_sup .inner a.despedida:after {position: absolute; display: block; content: ""; border: 5px solid transparent; right: -20px; transform: rotate(90deg);}
.info_sup .inner a.despedida:before {top: 36px; border-left-color: #000;}
.info_sup .inner a.despedida:after {top: 35px; border-left-color: #f4f4f4;}
.info_sup .inner a.despedida:hover {opacity: 0.5;}

/* estructura */

.info_sup .inner,
.contenedor_widget {width: 494px;} /* los 460px del sumario de noticia + 17px de padding a cada lado */
.contenedor_widget {margin: 0 auto; min-height: 100%; background-color: #fff; padding: 73px 17px 0; box-shadow: 0 0 5px rgba(0,0,0,0.1); box-sizing: border-box;}


/* FILTRADOR --------------------------------------------------------------- */

.filtrador .info_sup .inner,
.filtrador .envoltorio-paneles {width: 920px; margin: 0 auto;}
.filtrador .info_sup .inner .panel-izquierdo,
.filtrador .info_sup .inner .panel-derecho {padding: 17px 0; position: relative;}
.filtrador .info_sup .inner .panel-izquierdo {float: left;}
.filtrador .info_sup .inner .panel-derecho {float: right;}
.filtrador .info_sup .inner .panel-izquierdo,
.filtrador .contenedor_widget {width: 511px; margin-left: 6px;}
.filtrador .info_sup .inner .panel-derecho,
.filtrador .contenedor_tweets {width: 387px;}
.filtrador .envoltorio-paneles,
.filtrador .contenedor_widget,
.filtrador .contenedor_tweets {min-height: 100%;}
.filtrador .contenedor_widget,
.filtrador .contenedor_tweets {padding: 55px 17px 0; box-sizing: border-box;}
.filtrador .contenedor_widget {float: left; background-color: #fff; box-shadow: 0px 0 15px -5px rgba(0, 0, 0, 0.6);}
.filtrador .contenedor_tweets {float: right; padding-left: 0; padding-right: 0;}

.filtrador h4 {margin: 0; font-size: 14px; text-transform: uppercase;}
.filtrador .panel-izquierdo h4 {float: left;}
.filtrador .panel-izquierdo:after,
.filtrador .panel-derecho:after {position: absolute; left: 20px; bottom: -7px; width: 0; height: 0; border: 7px solid; border-bottom: none; border-color: rgba(0, 0, 0, 0); border-top-color: #d0d0d0; content: "";}
.filtrador .panel-derecho:after {left: 0;}

.filtrador a.ancla_nueva_pregunta {float: right; position: relative; top: 0; right: 5px; padding-right: 17px; font-size: 10px; text-transform: uppercase; color: #016ca2; position: relative;}
.filtrador a.ancla_nueva_pregunta:before,
.filtrador a.ancla_nueva_pregunta:after {position: absolute; display: block; content: ""; border: 5px solid transparent; right: 0; transform: rotate(90deg);}
.filtrador a.ancla_nueva_pregunta:before {top: 8px; border-left-color: #016ca2;}
.filtrador a.ancla_nueva_pregunta:after {top: 7px; border-left-color: #f4f4f4;}
.filtrador a.ancla_nueva_pregunta:hover {opacity: 0.5;}

.filtrador .encabezado {margin: 0 -17px 17px -17px; padding-left: 17px; padding-right: 38px; background-color: #fff; border-bottom: 1px solid #e4e4e4; position: relative;}
.filtrador .encabezado p {float: left; padding: 17px 17px 36px 0; width: 100%; color: rgba(0, 0, 0, 0.8); font-size: 10px; font-weight: bold; text-transform: uppercase; box-sizing: border-box;}
.filtrador .encabezado p span {display: block; overflow: hidden; max-width: 240px; font-size: 22px; font-weight: normal; color: rgba(0, 0, 0, 1);}
.filtrador .datos_entrevistado {position: absolute; width: 230px; right: 0; top: 0;}
.filtrador .datos_entrevistado p {padding-left: 17px; border-left: 1px solid rgba(0, 0, 0, 0.05); color: rgba(0, 0, 0, 0.4); width: 50%;}
.filtrador .datos_entrevistado p span {color: rgba(0, 0, 0, 0.5);}
.filtrador .datos_entrevistado p:after {display: none;}


@media screen and (max-width: 1270px) { /* pasamos el encabezado de EL PAIS arriba */
	.info_sup {height: 91px;}
	.info_sup .medio {position: static; display: block; margin: 0; padding: 7px 0 0 10px; background-color: #000;}
	.info_sup .medio a.logo {float: left;}
	.info_sup .medio h3 {position: relative; top: -2px; left: 0; padding: 3px 10px; max-width: none; display: inline-block; margin: 0 0 0 5px; background-color: transparent;}
	.filtrador .contenedor_widget,
	.filtrador .contenedor_tweets {padding-top: 96px;}
}








