/** estilos fichajes **/
div#porDate {display: none;}
div#info {display: block;width:100%;padding: 3rem 4rem 4rem 4rem;}
div#info > h3 {font-size: 1.6rem;line-height: 2.2rem;font-weight:300;text-transform:uppercase;color:#e4e4e4;margin-bottom: 5rem;background: #0a3a1f;position: relative;display:none}
div.inf-timeLine:before {content: "";display: block;width: 200%;background: transparent;height: 0;position: absolute;top: -0.8rem;left:-50%;box-shadow: 0 5rem 5rem 5rem #fff;/*z-index: -1;*/}
.wrapper.bodier > .container.falseSpechead .grid {z-index: 3;}
div.inf-timeLine #info {box-shadow: 3rem 0 2rem -2rem #e8e8e8, -3rem 0 2rem -2rem #e8e8e8;-moz-box-shadow: 3rem 0 2rem -2rem #e8e8e8, -3rem 0 2rem -2rem #e8e8e8;-webkit-box-shadow: 3rem 0 2rem -2rem #e8e8e8, -3rem 0 2rem -2rem #e8e8e8;}

/** plegar/desplegar **/
#eventos span.blind {display: block;position: relative;padding: 1rem 3rem;font-size: 1.6rem;line-height: 1.2;font-weight: 300;color:#3c3c3c;}
#eventos span.blind:not(.be_on){border-bottom:.1rem solid #c7c7c7;}
#eventos div.blindBox {clip: rect(0,0,0,0);opacity: 0;height: 0;position: absolute;top: -100%;}
#eventos div.blindBox.be_on{clip: auto;opacity: 1;height: auto;position: relative;top: 0;}
#eventos span.blind, #eventos .blindBox {transition:opacity ease-in-out 0.7s;-webkit-transition:opacity ease-in-out 0.7s;-moz-transition:opacity ease-in-out 0.7s;}
#eventos span.blind:before {transition:all ease-in-out 0.7s;}

/* ico */
#eventos span.blind:before {content:"expand_more";float: right;line-height: 1;font-family: 'Material Icons';-webkit-font-smoothing: antialiased;font-size: 4.5rem;color: #0a3a1f;font-feature-settings: "liga";margin-top: -1rem;cursor: pointer;}
#eventos span.blind.be_on:before {content:"expand_less";}

/** fichas **/
#eventos div.blindBox.be_on{width: 100%;padding: 1.5rem;background: url("i/fondo.jpg");}

/* semanas */
div#eventos {display: block;width: 100%;padding: 1rem 0;}
div#eventos ul {width: 100%;display: flex;display: -webkit-box;display: -moz-flex; display: -ms-flexbox;display: -webkit-flex;flex-flow: nowrap;-webkit-flex-flow: nowrap;}
#eventos li.evento {display: inline-block;padding: 1.2rem;margin: 0.4rem;box-shadow:-0.1rem -0.1rem 0.3rem rgba(0,0,0,0.3);background:rgba(199,199,199,0.65);position:relative;flex-grow: 1;-webkit-box-flex: 1;-moz-box-flex: 1;-webkit-flex-grow: 1; -ms-flex: 1;flex-basis: 100%;-webkit-flex-basis: 100%; -webkit-box-flex-basis: 100%; -moz-box-flex-basis: 100%;}
#eventos li.evento:not(.open) {max-width: 7rem;}
#eventos li.evento.active.open {background: #f3f3f3;padding: 1.5rem;}
#eventos li.evento.active {background: transparent;cursor: pointer;}
#eventos li.evento.active.open > a {position: absolute;top: 0;left: 0;width: 100%;height: 100%;}
div#eventos a[href=""] {display: none;}

/* dia */
.infoBox {display: block;width: 100%;height: 100%;overflow: hidden;max-height: 30rem;}
.infoBox h4 {display: block;padding: 1.2rem 0;font-size: 1.6rem;line-height: 1.2;font-weight:300;color:#8a8a8a;text-align:center;max-width:4.35rem;margin: 0 auto;white-space: nowrap;overflow: hidden;}
.infoBox h4 span {font-weight:300;color: #3c3c3c;letter-spacing: -0.6pt;}
.active .infoBox h4 {position: relative;color:#3c3c3c;}
.active .infoBox h4, .active:not(.open) .infoBox h4 span,.active.open .infoBox h4 span:before {font-weight:900;}

/* mes */
li .infoBox h4, .active .infoBox h4 {color:transparent;}
#eventos div:nth-last-child(5) .blindBox ul li:nth-child(n+4) .infoBox h4 span:after,
#eventos div:nth-last-child(n+6) .blindBox li .infoBox h4 span:after {content: "ago.";padding-left: 0.3rem;}
#eventos div:nth-last-child(-n+4) li .infoBox h4 span:after {content: "jul.";padding-left: 0.3rem;}
#eventos div:nth-last-child(9) .blindBox ul li:last-child .infoBox h4 span:after,
#eventos div:nth-last-child(n+10) .blindBox li .infoBox h4 span:after {content: "sep.";padding-left: 0.3rem;}

.active.open .infoBox {max-height:none;}
.active.open .infoBox h4 {padding-left: 1.5rem;margin-bottom:4rem;text-align: left;max-width: none;font-weight:300}
.active.open .infoBox h4:before {content:"";display:inline-block;width:0.3rem;height:100%;background:#0a3a1f;position: absolute;top: 0;left:0}
.active.open .infoBox h4 span:before {content: "De ";}
#eventos div:nth-last-child(5) li:nth-child(n+4).active.open .infoBox h4 span:after,
#eventos div:nth-last-child(n+6) .blindBox .active.open .infoBox h4 span:after {content: " de agosto";}
#eventos div:nth-last-child(-n+4) .active.open .infoBox h4 span:after {content: " de julio";}
#eventos div:nth-last-child(9) .blindBox li:last-child.active.open .infoBox h4 span:after,
#eventos div:nth-last-child(n+10) .blindBox .active.open .infoBox h4 span:after {content: " de septiembre";}



/* imagen */
#eventos .imagen {padding-top:0;transition: padding ease-in 0.5s;}
#eventos .active.open .imagen {padding-top: 28.125%;}
#eventos .imagen, #eventos .imagen + .texto {width: 50%;}
div#eventos img[src=""] {display: none;}
#eventos .imagen, #eventos .texto {clip: rect(0,0,0,0);opacity: 0;height: 0;position: absolute;left: -100%;transition:left ease-in-out 1s, opacity linear 1s;}
#eventos .active.open .imagen, #eventos .active.open .texto{clip: auto;opacity: 1;height: auto;position: relative;left: 0;}

/* texto */
#eventos .texto {padding:0 2rem;display: inline-block;width:100%;}
#eventos .texto span.title {font-size: 2.6rem;line-height: 1.5;font-weight: 900;color:#3c3c3c;display: block;margin-bottom:2rem;}
#eventos .texto span.information {font-size: 1.6rem;line-height: 1.5;font-weight: 300;color:#3c3c3c;display: block;}

/* abrir/cerrar ficha */
#eventos .active.imagen, #eventos .active .texto{max-width:5rem;opacity:0;max-height:30rem}
#eventos .open .imagen, #eventos .open .texto{max-width:none;opacity:1;max-height:none}

/** estilos pf noticia **/
.p_final div#porDate {display:block;background: transparent;box-shadow: none;}
.p_final div#porDate .legend {display:none;}
.p_final .article > .falseH1 {margin-top:10rem}
.p_final .mainContent .artBody + .slideH {top:21rem}
.p_final .mainContent .artBody .inf-timeLine {box-shadow: none;z-index:3;overflow:visible;}
.p_final div#info {padding:0;margin:0}
.p_final div#info > h3 {text-indent: 25%;margin:0;box-shadow: 0 5rem 5rem 5rem #fff;padding: 1rem 0;display: block;}
.p_final div#info > h3 strong {color: #e4e4e4;font-weight:900}
.p_final .falseH1 .pretitle:before {border-color:#0a3a1f;}

/* catalogo de semanas */
.p_final .inf-timeLine #porDate:after {content: "";display: block;width: 25%;height: 100%;position: absolute;top: 0;left: 37.5%;box-shadow: 0.3rem 0.3rem 3rem -1rem rgba(0,0,0,0.2);z-index: 0;}
.p_final .inf-timeLine .controlEventos {background:#fff;margin-top: -2.8rem;display: block;max-width: 33%;overflow: hidden;box-shadow: -1rem 0 2rem -2rem rgba(0,0,0,0.5), 1rem 0 2rem -2rem rgba(0,0,0,0.5);position: relative;z-index: 1;}
.p_final .controlEventos ul {width:900%;position:relative;}
.p_final .controlEventos ul li span.blind {font-size: 1.6rem;}
.p_final .controlEventos ul li span.blind strong {font-weight:900}
.p_final .controlEventos li:not(.disabled) span {font-weight:300}

/* dos filas */
.p_final .controlEventos ul li {width:5.56%;text-align:left;padding-bottom: 2rem;position: relative;}
.p_final .controlEventos ul li:nth-child(odd):before {content: "";display: block;width: .1rem;height: 60%;position: absolute;top: 25%;right: .1rem;background: #c7c7c7;}
.p_final .controlEventos ul li:nth-child(even) {text-align: right;}
.p_final .controlEventos ul li a span {padding:1rem 0;float:left;width: 14.285%;text-align: center;position:relative}
.p_final .controlEventos ul li a[href="#"] {cursor:initial;width:0;margin:0;}
.p_final .controlEventos ul li a:not([href="#"]) span{font-weight:900}
.p_final .controlEventos ul li .blindBox {padding:0 1%}
.p_final .controlEventos ul li a.active span:after {content: "";width: 80%;height: .4rem;background: #0a3a1f;display: block;position: absolute;top:auto;bottom: 0;left: 10%;}

/* controlbox catalogo */
.p_final #porDate .controlBox {display: block;width: 100%;position: absolute;top: 50%;left: 33.5%;max-width: 33%;margin-top: -0.5rem;}
.p_final #porDate .controlBox span {display: block;width: 4rem;height: 4rem;float: left;cursor: pointer;}
.p_final #porDate .controlBox span:before {float: left;line-height: 1;font-family: 'Material Icons';-webkit-font-smoothing: antialiased;font-size: 3.5rem;color: #0a3a1f;font-feature-settings: "liga";}
.p_final #porDate .controlBox span.back {float: left;margin-left:-3rem;}
.p_final #porDate .controlBox span.back:before {content:"arrow_back_ios";}
.p_final #porDate .controlBox span.next {float:right;margin-right:-4rem}
.p_final #porDate .controlBox span.next:before {content:"arrow_forward_ios";}

.mainContent .artBody blockquote span.q1,
.mainContent .artBody blockquote span.ladillo,
.artBody .analisis p,.artBody .analisis p strong,.artBody .analisis p a,
.artBody .figcaption .signs, .artBody figcaption .signs em {color:#0a3a1f;}

/* hover/focus */
#eventos .blindBox.be_on>ul li a:focus {background:transparent;box-shadow:inset 0.2rem 0.2rem 0.4rem rgba(0,0,0,0.6), inset -0.2rem -0.2rem 0.4rem #666;outline:transparent}
#eventos li.evento.active:hover {background:rgba(255,255,255,0.4)}.p_final .controlEventos ul li a:not([href="#"]) span:hover {background: #0a3a1f;color:#f2f2f2;}

/* mes */
/* article[data-url*='1961680'] .controlEventos li a[href*='1961680'] span:after,
article[data-url*='1961669'] .controlEventos li a[href*='1961669'] span:after {content:"";display:block;position:absolute;bottom:0;left:15%;width:70%;height:.4rem;background:#0a3a1f;} */

/** no-js **/
.no-js #eventos .infoBox, .no-js #eventos div.blindBox, .no-js #eventos li.evento.active:not(.open),.no-js #eventos .texto{max-width:none;max-height:none;}
.no-js #eventos div.blindBox, .no-js #eventos .imagen,.no-js #eventos .texto{clip:auto;opacity:1;height:auto;position:relative;top:0;left:0;width:100%;}
.no-js #eventos .imagen{padding-top:56.25%}

@media only screen and (max-width:1200px){
  #eventos .imagen, #eventos .imagen + .texto {width: 100%;}
  #eventos .texto {padding:0;}
}

@media only screen and (max-width:1400px){
  #eventos .texto {padding: 0 0 0 2rem;}
  #eventos .texto span.title {font-size:2.2rem;}

}
