@import url('/css/rtve.infografias/base/timeline.2015.desktp.css');

/* DIARIO DE CAMPANA */
.inf-timeLine #eventos .evento .pointer{width:5.56%;font-size:1.4rem;line-height:2.8rem;padding:2.5rem 0;margin-top:3.4rem;top:-11.2rem;}

.inf-timeLine #eventos #ev1 .pointer{left:0;}
.inf-timeLine #eventos #ev2 .pointer{left:5.555555%;}
.inf-timeLine #eventos #ev3 .pointer{left:11.111111%;}
.inf-timeLine #eventos #ev4 .pointer{left:16.666666%;}
.inf-timeLine #eventos #ev5 .pointer{left:22.222222%;}
.inf-timeLine #eventos #ev6 .pointer{left:27.777777%;}
.inf-timeLine #eventos #ev7 .pointer{left:33.333333%;}
.inf-timeLine #eventos #ev8 .pointer{left:38.888888%;}
.inf-timeLine #eventos #ev9 .pointer{left:44.444444%;}
.inf-timeLine #eventos #ev10 .pointer{left:50%;}
.inf-timeLine #eventos #ev11 .pointer{left:55.555555%;}
.inf-timeLine #eventos #ev12 .pointer{left:61.111111%;}
.inf-timeLine #eventos #ev13 .pointer{left:66.666666%;}
.inf-timeLine #eventos #ev14 .pointer{left:72.222222%;}
.inf-timeLine #eventos #ev15 .pointer{left:77.777777%;}
.inf-timeLine #eventos #ev16 .pointer{left:83.333333%;}
.inf-timeLine #eventos #ev17 .pointer{left:88.888888%;}
.inf-timeLine #eventos #ev18 .pointer{left:94.444444%;}

.inf-timeLine #eventos .evento .pointer:first-line{font-size:4rem;}
.inf-timeLine #eventos .evento:first-child .pointer{padding:2.5rem 0;}
.inf-timeLine #eventos .evento:first-child .pointer:first-line{font-size:100%;}
.inf-timeLine #eventos .evento .pointer{background:transparent;}
.inf-timeLine #eventos .evento:not(.active) .pointer:hover{color:#d25000;}
.inf-timeLine #eventos .evento.active .pointer{background:#d25000;border-radius:1rem 1rem 0 0;}

/***cajas***/
.inf-timeLine #eventos:after{content:"Diciembre";display:block;width:100%;font-size:1.8rem;line-height:3.4rem;text-align:center;color:#494847;position:absolute;top:-11.4rem;left:0;z-index:1;}
.inf-timeLine #eventos:before{content:"";width:100%;height:11rem;display:block;background:#f2f2f2;border-bottom:.2rem solid #d25000;box-shadow:0 .5rem 1rem 0 rgba(0,0,0,.3);position:absolute;top:-11.2rem;left:0;z-index:-1;}
.inf-timeLine #eventos{display:block;z-index:3;}
.inf-timeLine li.active .infoBox{padding:3rem 0;background:#fff;box-shadow:0 .5rem 1rem 0 rgba(0,0,0,.3);margin-top:11.2rem;margin-bottom:0;}

.inf-timeLine .media{width:40%;padding:0;position:relative;border-left:5rem solid transparent;float:left;}
.inf-timeLine .media .mediaBox{margin:0;}
.bodier .inf-timeLine .media a:hover .ico.play img{background-image:url("/css/rtve.2015/i/iconos/icons_40x40_ffffff.png");background-color:#d25000;}
.bodier .grid > .gridBox > .cell .inf-timeLine .evento .play img{margin-bottom:0;}

.inf-timeLine .overBox{width:60%;padding:0 5rem 0 2rem;position:relative;float:right;}
.inf-timeLine .infoBox > a,.inf-timeLine .desc,.inf-timeLine .related{padding:0;position:relative;}

/*flechas*/
.inf-timeLine .next, .inf-timeLine .back{opacity:.2;
-webkit-transition:opacity ease-in .3s;
-moz-transition:opacity ease-in .3s;
transition:opacity ease-in .3s;}
.inf-timeLine .next{background-image:url("/css/rtve.2015/i/iconos/individuales/arrow_next__40x40_000000.png");}
.inf-timeLine .back{background-image:url("/css/rtve.2015/i/iconos/individuales/arrow_back__40x40_000000.png");}
.inf-timeLine .next.active, .inf-timeLine .back.active{opacity:.5;}
.inf-timeLine .next.active:hover, .inf-timeLine .back.active:hover{opacity:.8;}
.inf-timeLine .next, .inf-timeLine .back,.inf-timeLine .next.active, .inf-timeLine .back.active{background-color:transparent;}
.inf-timeLine .next, .inf-timeLine .back{top:-11.2rem;margin-top:0;height:3.4rem;width:6rem;border-width:0;border-width:.2rem 0;border-style:solid;border-color:transparent;background-size:contain;}

/**textos**/
.inf-timeLine li .infoBox .overBox a h2{font-size:3rem;color:#494847;letter-spacing:-.25pt;word-spacing:-1pt;line-height:1;margin-bottom:1rem;}
.inf-timeLine .desc{margin-bottom:1.5rem;}

/*relacionados*/
.inf-timeLine .related li{position:relative;display:block;padding:0 0 .5rem 1.7rem;}
.inf-timeLine .related li:before{content:'\25BA';display:block;width:1.5rem;height:1.5rem;font-size:1.2rem;line-height:1.6rem;color:#d25000;position:absolute;top:0;left:0;}
.inf-timeLine .related li a{background:none;display:inline;font-size:1.6rem;font-weight:300;color:#d25000;line-height:2rem;padding:0;border-bottom:solid .1rem transparent;}
.inf-timeLine .related li a:hover{border-bottom-color:#d25000;}