@charset "UTF-8";
@import url('https://fonts.googleapis.com/icon?family=Material+Icons');
@import url('/css/rtve.2019.noticias/elecciones-municipales-TE_SYAT19E/listado-partidos.css');

.infoBox{position:relative;/* overflow:hidden;float:left; */width:100%;max-width: 118rem;margin: 0 auto;display:block;}
.infoBox.init {overflow:hidden}
.infoBox img {width:100%;height:auto;}
.infoBox .container{position:relative;display:block;float:left;}
.infoBox div.textBox {width: 100%;float: right;/* margin-left:30%; */min-height:26rem;}
.infoBox .textBox,.infoBox .cand {width: 100%;float:left;padding: 1rem 3rem 0 1rem;margin-top: 3.5rem;}
.infoBox > p{font-size: 1.6rem;width: 75%;margin: 0 auto;line-height: 1.3;}
.infoBox.init > p {line-height: 1.5;color: #1a1a1a;}
.infoBox .textBox  p, .infoBox h5,.infoBox h4, .infoBox .result > span,.infoBox .result li span:last-child,.infoBox .text .title.infoBox > p,.infoBox > p {/*font-family: 'Roboto', arial, sans-serif;*/color:#1a1a1a;line-height: 1;}
.infoBox .textBox  p {font-weight:400;font-size:1.6rem;line-height: 1.5;padding-bottom:1.6rem;}
.infoBox > div > span{/*text-align:center;*/font-size: 1.8rem;line-height: 1.2;font-weight: 900;position: absolute;top: 0;}
.infoBox.init > div > span {font-size: 2rem;}
.infoBox > div > span{width:50%;}
.infoBox > div > span.active h4{cursor:pointer;background: #fff;border-top-left-radius: 0.5rem;border-top-right-radius: 0.5rem;font-weight: 700;}
.infoBox h4 {/* text-transform:uppercase; */font-weight: 300;}
.infoBox:not(.init) h4{min-width: 14rem;display: inline-block;padding: 1rem 1rem 1rem 1rem;text-align: center;}
.infoBox .elec-auto > span,.infoBox .elec-muni > span{padding: 1rem 1rem 0 1rem;z-index: 1;}
.infoBox .elec-auto > span{left:0;}
.infoBox .elec-muni > span{left:50%;}
/*.infoBox .elec-muni > .container, */.infoBox .elec-auto > .container {margin-top: 6rem;}
.infoBox .elec-muni > .container {margin-top: 0;}
.infoBox h5{font-weight:900;font-size:2rem;padding: 2rem 0 2rem 0;text-transform: uppercase;color:#3d3d3d;}
.infoBox .cand .result {float:left;opacity:0.5; position:relative;height:3.5rem;margin-top:-3.5rem}
.infoBox .cand .result > span {display: inline-block;color:#3d3d3d;}
.infoBox .cand .result .escanio{font-size: 1.6rem;padding: 1rem; position:relative;}
.infoBox .cand .result .imgT {width: 3.5rem;height: 3.5rem;padding-top: 0;}
.infoBox .text .title + span {clear: left;font-size: 1.6rem;font-weight:400}


/* leyenda */
.infoBox .container .cont_leyenda {width: 100%;float: left;background: #f1f1f1;}
.infoBox .container .cont_leyenda span{font-weight:bold;font-size:1.6rem;padding: 2rem 2rem 1.5rem 2rem;/*float:left;*/display:inline-block;}
.infoBox .container .cont_leyenda span + span{font-size:1.5rem;}
.infoBox .container .cont_leyenda span + span strong {font-weight: 300;}
.infoBox .container .cont_leyenda span.nota {display:block;padding-top: 0;font-size: 1.4rem;font-weight: 300;}

/* mapa */
.infoBox .map {width: 36.5rem;height: 28.6rem;padding: 2rem;position:absolute;top:0;left: 0;}
.infoBox > div > .container > ul > li, .infoBox.init > div > .container > ul {clip: rect(0,0,0,0);position: absolute;}
.infoBox > div > .container > ul > li.active,.infoBox > div > .container > ul {clip:auto;position:relative;}

/* INICIALMENTE */
.infoBox.init{margin-bottom: 8rem;}
.infoBox.init > div > div,.infoBox.init > div{width:50%;;display:block;float:left;left:10rem;}
.infoBox.init  .map{position:relative; -webkit-transition: all 1s ease-in-out;-moz-transition: all 1s ease-in-out;-o-transition: all 1s ease-in-out;transition: all 1s ease-in-out;}


/* CANDIDATOS */
.infoBox .cand li:hover {cursor:pointer}
.infoBox .cand {padding:0;position:relative;}
.infoBox .cand .imgT{padding-top:20.641025%;width: 16.66666666666667%;clear:none;display:block;float:left;overflow: hidden;opacity:1;;position:relative;}
.infoBox .cand .imgT:hover{opacity:0.9;}
.infoBox .cand .active .imgT{opacity:1;}
.infoBox .cand.active li:not(.active) .imgT{opacity:0.5;}
.infoBox .cand .text{margin-top: 20.641025%;position:absolute;top:0;left: 0;padding:3rem 4rem 3rem 2rem;opacity:0;clip: rect(0,0,0,0);width: 100%;min-height: 14rem;}
.infoBox .cand .active .text{opacity:1;clip:auto;}
.infoBox .text .title, .infoBox .text .subtitle{font-size: 2rem;padding-bottom: 0.5rem;text-transform: uppercase;color:#fff;line-height: 1.2;font-weight: 700;width: 27%;float: left;display: inline-block;padding-right: 3rem;}
.infoBox .cand .text p{color:#fff;font-size: 1.6rem;line-height: 1.5;width: 73%;display: inline-block;}

/* escanos e img */
.infoBox .cand .imgT img {position:absolute;top:0;left:0;width:auto;height:100%;}
.infoBox .cand li {position:relative;}
.infoBox .cand5 li > .imgT, .infoBox .cand5 .result{width:20%;}
.infoBox .cand5 li > .imgT img{margin-left: -37.5%;}
.infoBox .cand6 li > .imgT, .infoBox .cand6 .result{width:16.66666666666667%;}
.infoBox .cand6 li > .imgT img{margin-left: -50%;}
.infoBox .cand7 li > .imgT, .infoBox .cand7 .result{width:14.2857%;}
.infoBox .cand7 li > .imgT img{margin-left: -75%;}
.infoBox .cand8 li > .imgT, .infoBox .cand8 .result{width:12.5%;}
.infoBox .cand8 li > .imgT img{margin-left: -100%;}
.infoBox .cand9 li > .imgT, .infoBox .cand9 .result{width:11.1111%;}
.infoBox .cand9 li > .imgT img{margin-left: -115%;}

/** COLORES **/
.infoBox .active .cand .result {background: #f1f1f1;}


/* MAPAS */
.infoBox .map-auto g:hover > *, .infoBox .map-auto g.active > * {cursor:pointer;fill:#F36010 !important;}
.infoBox .map-auto g#otros:hover > polygon{cursor:auto;fill:rgb(232, 232, 216) !important;}
.infoBox .map-auto g#otros:hover > polyline{fill:none !important; cursor:auto;}
.infoBox .map-auto g#and:hover > *,.infoBox .map-auto g#cat:hover > *,.infoBox .map-auto g#gal:hover > *,
.infoBox .map-auto g#vas:hover > *, .infoBox .map-auto g#val:hover > *{fill:#D8D8D8 !important;cursor:auto;}
.infoBox .map-muni circle:hover{stroke-width:1rem !important;cursor:pointer;}
.infoBox .map-muni circle.active{stroke-width:1rem !important;}

/* FUEGOS ARTIFICIALES */
.infoBox li.active{-webkit-transition-delay: 0.05s;transition-delay: 0.05s;-webkit-transition-duration: 0.35s;transition-duration: 0.35s;opacity: 1;}
.infoBox.init li{opacity: 0;-webkit-transition: opacity 0.2s, -webkit-transform 0.35s;transition: opacity 0.2s, transform 0.35s;}
.infoBox .textBox{left:100%;margin-top:2rem;/* position:relative; *//*transform:rotate(30deg);*/}
.infoBox li.active .textBox{left:0;  -webkit-transition-duration: 0.5s;transition-duration: 0.5s; /*  transition-timing-function: cubic-bezier(0, 0.85, 0.47, 1.29);transform:rotate(0deg);*/}
.infoBox .result, .infoBox .cand{opacity:0;}
.infoBox li.active .result, .infoBox li.active .cand{opacity:1; -webkit-transition-duration: 0.50s;transition-duration: 0.50s;}
.infoBox li.active .result{-webkit-transition-delay: 0.25s;transition-delay: 0.25s;}
.infoBox li.active .cand{-webkit-transition-delay: 0.40s;transition-delay: 0.40s;}
.infoBox .cand .text {-webkit-transition: opacity 0.2s, -webkit-transform 0.35s;transition: opacity 0.2s, transform 0.35s;-webkit-transition-delay: 0.25s;transition-delay: 0.25s;}


/** modificaciones **/
/* titulares */
.wrapper.bodier .container.municipales2019 {width: 100%;}
.municipales2019 .grid.g1 {margin: 0;}
.municipales2019 .gridBox {padding: 0;}

/* portada */
.infoBox.init > div > span {text-align:center;position: absolute;top: 31rem;}
.infoBox.init h4{text-transform:uppercase;font-weight: 900;color:#F36010}
.infoBox.init .elec-auto > span,.infoBox.init .elec-muni > span{padding-top: 2rem}
/* .infoBox.init .map {left:12.5%} */

/* mapa */
.infoBox.init .elec-muni > .container, .infoBox.init .elec-auto > .container {margin-top: 3rem;margin-bottom: 6rem;}
.infoBox.init .map g * {fill:rgb(172, 188, 188);stroke:#fff;}
.infoBox.init .map g#ica * {stroke: #C8C8C8;}
.infoBox.init .map  g #other polygon, .infoBox.init .map  #otros polygon {fill: rgb(232, 232, 216);}
.infoBox.init .map-auto g#otros > polyline, .infoBox.init #mapa g#other > path{fill:none !important; cursor:auto;}
.infoBox.init .map #puntos circle {fill: #F36010;stroke:#F36010}
.infoBox.init .elec-auto .map #and path, .infoBox.init .elec-auto .map #gal path,
.infoBox.init .elec-auto .map #vas polygon, .infoBox.init .elec-auto .map #cat polygon, .infoBox.init .elec-auto .map #val polygon {fill:#D8D8D8;}
.infoBox.init .map-auto g#otros > polyline, .infoBox.init #mapa g#other > path {stroke: rgb(172, 188, 188);}

/* pestanas */
.municipales2019 .gridBox .infoBox:not(.init):after {content: '';display: block;width: 200%;height: 4.5rem;background: #c8c8c8;position: absolute;top: 0;left: -50%;z-index: 0;}
.infoBox:not(.init) .elec-auto > span {text-align:right}

/* navegacion */
.elec-auto span ~ .container .nav, .elec-muni span ~ .container .nav {display: none;}
.elec-auto span.active~.container .nav, .elec-muni span.active~.container .nav {display: block;padding: 1rem 2rem 2rem 2rem;border-bottom: .1rem solid #c8c8c8;}
.elec-auto .nav ul, .elec-muni .nav ul {text-align:center}
.elec-auto .nav ul li, .elec-muni .nav ul li {display:inline-block;font-size: 1.6rem;padding:0.5rem 0.65rem;margin: 0 1.5%;font-weight: 300;line-height: 1;color: #1a1a1a;}
.elec-auto .nav ul li.active, .elec-muni .nav ul li.active {font-weight:700;/* border-left: 0.3rem solid #f46010; */box-shadow: inset 0.3rem 0 0 #f46010;}
.infoBox > div > span h4:hover, .elec-auto .nav ul li:not(.active):hover, .elec-muni .nav ul li:not(.active):hover {font-weight: 400;cursor:pointer;}

.infoBox > div > .container > ul > li.active h3 {font-weight: 700;font-size: 2rem;line-height: 1.2;text-transform: uppercase;padding: 1rem 0;}
.infoBox > div > .container > ul > li.active {padding-top: 2rem;}

.infoBox .cand .text:after {content: 'X';display: block;width: 3rem;height: 3rem;position: absolute;top: 0;right: 0;left: auto;text-align: center;font-size: 2rem;line-height: 3rem;color:#fff}


.infoBox.init .map {display:block;}
.infoBox .map,
.infoBox .elec-muni > .active + .container .map,
.infoBox .elec-auto > .active + .container .map {display:none}

.infoBox .cand.active {padding: 0 0 14rem 0;/*padding: 0;*/} /* peh texto encima active */


.infoBox div.textBox .imgT {width:30%;float:left;padding: 2rem;}
.infoBox div.textBox .text {width:70%;display:inline-block}

.infoBox .result li .imgT + span:after, .infoBox .cand .result .escanio:after {content: '';display:inline-block;text-align: center;text-transform:none;text-rendering: optimizeLegibility;font-family:'Material Icons';font-size:3rem;line-height: 3.5rem;color: #00000091;-webkit-font-smoothing:antialiased;font-feature-settings:"liga";position: absolute;margin-left: 3.5rem;top: 0;}
.infoBox .elec-auto .result li .imgT + span:after, .infoBox .elec-auto .cand .result .escanio:after  {content: 'person';}
.infoBox .elec-muni .result li .imgT + span:after, .infoBox .elec-muni .cand .result .escanio:after {content: 'group';}



@media only screen and (max-width:1180px) {
.infoBox {overflow:hidden;}
.municipales2019 .gridBox .infoBox:not(.init):after {width: 100%;left: 0%;}
}