@import url(http://fonts.googleapis.com/css?family=Roboto:400,300,700,100);
@import url(./animate.min.css);

/* RESET */
body {background: #242424;}
h1,h2,h3,h4,h5 {padding: 0; margin: 0}
ul {margin: 0; padding: 0}
#ZDESTA_SI {visibility: visible;position: relative;top:auto; left: auto;}
.vipZone {background: #F2F2F2;min-width:95.2em;}
#wrapper .vipZone .container {background: none;margin: 0 auto;float: none;}
#wrapper .vipZone .container .c100 {background: none !important;}
.box{position:absolute;top:0;left:0;width:100%;height:100%;display:table;}


.secciones {margin: 0; padding: 0;}
.seccion > * {display: none;}
.seccion.active > * {display: block;}
.seccion:hover .titleSection span.box span {-webkit-animation: flipInY 750ms;-moz-animation: flipInY 750ms;-o-animation: flipInY 750ms;animation: flipInY 750ms;}

.next-button,
.back-button {position: absolute; top: 200px; color: #fff;font-size:100%;display: none;cursor: pointer;}

#resumen-2014 {width: 100%;margin:8em 0;position: relative;padding-top: 60%;font-family: 'Roboto', sans-serif; font-weight: 100;}
#resumen-2014 #home {position: absolute;width: 100%;height: 100%;top: 0;left: 0;overflow: visible;}
#resumen-2014 *{box-sizing:border-box; -moz-box-sizing:border-box; -webkit-box-sizing:border-box; -ms-box-sizing:border-box;cursor:pointer;}
#resumen-2014 a{color:#fff;}
/* BORDES */
.t11,.t12,.t13,
.t21,.t22,.t23,
.t31,.t32,.t33,
.t41,.t42,.t43,
.t51,.t52,.t53{display:block;border:solid 2px #F2F2F2;}


/* TAMAÑOS */
.t11,.t12,.t13{width:20%;}
.t21,.t22,.t23{width:40%;}
.t31,.t32,.t33{width:60%;}
.t41,.t42,.t43{width:80%;}
.t51,.t52,.t53{width:100%;}

.t11,.t21,.t31,.t41,.t51{height:33.33%;}
.t12,.t22,.t32,.t42,.t52{height:66.66%;}
.t13,.t23,.t33,.t43,.t53{height:100%;}

.p00,.p01,.p02,.p03,.p04,
.p10,.p11,.p12,.p13,.p14,
.p20,.p21,.p22,.p23,.p24,
.p30,.p31,.p32,.p33,.p34{position:absolute;}

/* POSICIONES */

.p00, .p01, .p02, .p03, .p04 {top:0;}
.p10, .p11, .p12, .p13, .p14 {top:33.33%;}
.p20, .p21, .p22, .p23, .p24 {top:66.66%;}
.p30, .p31, .p32, .p33, .p34 {top:100%;}

.p00, .p10, .p20, .p30, .p40 {left:0;}
.p01, .p11, .p21, .p31, .p41 {left:20%;}
.p02, .p12, .p22, .p32, .p42 {left:40%;}
.p03, .p13, .p23, .p33, .p43 {left:60%;}
.p04, .p14, .p24, .p34, .p44 {left:80%;}

.seccion.active > .titleSection.t11{top:0;left:0;}

/* HOME */
.introH1 {display: none; background: #383838;}
.introH1 > .box{padding:1.2em;}
.introH1 .title {padding: 4.214em 0 1.2em 0;text-align: center; color: #646464; font-weight: 300; text-transform: uppercase; font-size: 280%; display: block;line-height:1;}
.introH1 strong{color: #fff;font-size: 420%;width: 100%;display: block;text-align: center;font-weight: 100;margin-top: -1.2em;}
.introH1 p {text-align: center;color: #b8b8b8;font-size: 160%;line-height: 1.2;font-weight: 300;padding: 0.5em 1.5em 0 1.5em;}


#video {display: none; width:60%;}
#video object {width: 100%; height: 100%}
.introH1.active,#video.active {display: block;}

/* ITEMS */
.item {display: none;cursor: pointer;z-index: 100;overflow: hidden;}
.item .itemTitle {display: none;}
.item .itemTitle span {position: absolute; bottom: 10px; top: auto; color: #fff; text-align: center; display: inline-block; line-height: 120%;font-weight: normal;padding: 5px;font-size: 16px;width: 100%;
box-sizing: border-box;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;}
.item:hover .itemTitle span{}
.item.active:hover .itemTitle span{-webkit-animation: none;-moz-animation: none;-o-animation: none;animation: none;}
.item .itemDesc {display: none;}
.item .itemPreview { position: absolute;top: 0;left: 0;overflow: hidden;width: 100%;height: 100%;}
.item .itemPreview img {height: 100%;margin: 0;margin-left:-40%;}
.item .itemMedia {display: none;}
.item .itemMedia > *  {width: 100%;}


.item:hover .itemTitle {display: block;height: 100%;width: 100%;position: relative;background: url('/css/rtve.infografias/resumen-2013/i/mas.png') center center no-repeat rgba(0,0,0,0.9);z-index: 20;
-webkit-animation: flipInY 700ms ease-out 0s;
   -moz-animation: flipInY 700ms ease-out 0s;
     -o-animation: flipInY 700ms ease-out 0s;
        animation: flipInY 700ms ease-out 0s;}
#news .item:hover .itemTitle {background-color: rgba(243,140,73,0.9);}
#deportes .item:hover .itemTitle {background-color: rgba(51,173,136,0.9);}
#cultura .item:hover .itemTitle {background-color: rgba(197,83,134,0.9);}
#fotos .item:hover .itemTitle {background-color: rgba(124,187,231,0.9);}
#difuntos .item:hover .itemTitle {background-color: rgba(59,59,59,0.9);background-image: none;}

.item.active { top: 0px;left: 0; width: 100%; height:100%; z-index: 101; background: #333; cursor: default;}
.item.active * {/* -webkit-transition:all 500ms; */}
.item.active:hover .itemTitle {background: none !important; -webkit-animation:none; -moz-animation:none; -o-animation:none; animation:none;}
.item.active .itemTitle { display: inline-block;position: absolute;width: 910px;}
.item.active .itemTitle span {position: static;font-weight: 100;padding: 1em 1.2em 0.35em 1.2em;}
.item.active .itemDesc {position: absolute;bottom: 10px;left: 20px;width: 910px;display: block;color: #fff;text-align: center;z-index: 106;}
.item.active .itemDesc p {font-size:170%;line-height: 120%;font-weight: 300;}
.item.active .itemDesc a {cursor: pointer; text-decoration: underline; color: #FFF;}
.item.active .itemPreview {display: none;}
.item.active .itemPreview img {}
.item.active .itemMedia {display: block;width: 60%;text-align: center;z-index: 104;height: 100%;position: absolute;top: 0;left: 0;overflow:hidden;}
.item.active .itemMedia > .VideoContainer{height:100%;}
.item .itemMedia > iframe {height: 360px; border:none;}
.item.active.audio .itemPreview {    display: block;    width: 640px;    height: 360px;    margin: 0px auto;    top: 60px;    left: 153px;}
.item.active.audio .itemPreview img {width: 100%; height: auto}
.item.active.audio .itemMedia {}
.item.active .close-button {position: absolute; width: 25px; height: 25px; display: block; top: 5px; right: 5px; background: url('/css/rtve.infografias/resumen-2013/i/cerrar.png') no-repeat left top;text-indent: -999%;cursor: pointer;z-index: 999;}
#cultura .item.active {background: #c55386;}
#difuntos .item.active {background: #3b3b3b;width:80%;left:20%;}

/* TITLE SECTION*/

.titleSection .box span {font-weight: 100;color: #fff;font-size: 360%;text-align: center;vertical-align: middle;display: table-cell;line-height:1;}
#news .titleSection .box span {background: #FF8D42;}
#deportes .titleSection .box span  {background: #00AF87;}
#cultura .titleSection .box  span {background: #E25289;}
#fotos .titleSection .box  span {background: #52BCE9;}

.secciones.active .titleSection {display: none;}
.secciones.active .seccion.active .titleSection {display: block;top: 0;left: 0;overflow: hidden;z-index: 1;}
.seccion.active .itemsSection {position: absolute; top: 0; left: 0; width: 100%; height: 100%;}
.seccion.active .itemsSection .item {display: block;}


/* SECCION NOTICIAS */
#news.active > * {display: block;}
#news .area{top: 0;left: 0;display: block;width: 100%;height: 100%;position: absolute;}
#news .area .areaTitle {z-index: 12; position: absolute; height:33%; width:20%; background: #242424; border: solid 2px #F2F2F2;color: #fff; font-weight: 100; font-size:300%;text-align: center;}
#news .area.item_1 .areaTitle {left: 40%; top: 66.66%;border-top-width: 4px;border-right-width: 4px;border-bottom: 0;}
#news .area.item_2 .areaTitle { left:20%; top:33.33%;border-bottom-width: 4px;border-left-width: 4px;margin-left: -2px;margin-top: 2px;border-top-width: 0;border-right-width: 0;}
#news .area.item_3 .areaTitle { left:60%; top:0;border-bottom: 0;}
#news .area.item_4 .areaTitle { top: 66.66%; left:80%;border-bottom-width: 0;}
#news.active .areas-noticias.active .area .areaTitle {margin:0;border: 2px solid #fff;}
.areaTitle > .box > span{display: table-cell;vertical-align: middle;line-height: 1;}
#news.active .area .areaPreview { z-index: 10; overflow: hidden;box-sizing:border-box; -moz-box-sizing:border-box; -webkit-box-sizing:border-box; -ms-box-sizing:border-box}
#news.active .area .areaPreview div {width: 100%;height: 100%;display: block;}
#news.active .area .areaPreview div img{height: 100%; position:absolute; top:0; left:50%; -webkit-transform:translateX(-50%); -moz-transform:translateX(-50%); -ms-transform:translateX(-50%); -o-transform:translateX(-50%); transform:translateX(-50%); }
#news.active .area.item_3 .areaPreview div img{height: auto; width: 100%}
#news.active .areas-noticias.active .area {margin:0;}
#news.active .areas-noticias.active .area .areaTitle {background:#515151;width:20%;height:33.33%;border-width: 2px;}
#news.active .areas-noticias.active .area .areaPreview {display: none}
#news.active .areas-noticias.active .area.active .areaTitle {background: #313131;}
#news.active .areas-noticias.active .area.item_1 .areaTitle {top: 0; left:20%;}
#news.active .areas-noticias.active .area.item_2 .areaTitle {left:40%; top: 0;}
#news.active .areas-noticias.active .area.item_3 .areaTitle {left:60%; top: 0;}
#news.active .areas-noticias.active .area.item_4 .areaTitle {top: 0; left:80%;}
#news.active .areas-noticias.active .area.active .itemsArea {position: absolute; top: 0; left: 0; width: 100%; height: 100%; margin: 0; padding: 0;}
#news.active .areas-noticias.active .area.active .itemsArea .item {display:block;}
#news.active .areas-noticias.active .area.active .item.active {top: 33.33%;height: 66.66%;}
#news.active .areas-noticias.active .area.active .item.active .itemTitle {position: relative;top: auto;left: auto;float: left;width: 40%;margin-left: 60%;}
#news.active .areas-noticias.active .area.active .item.active .itemTitle span {text-align: left; font-size: 24px;}
#news.active .areas-noticias.active .area.active .item.active:hover .itemTitle {height: auto;}
#news.active .areas-noticias.active .area.active .item.active .itemMedia > iframe {height: 376px}
#news.active .areas-noticias.active .area.active .item.active .itemMedia > img {height: 100%;width: auto;}
#news.active .areas-noticias.active .area.active .item.active .itemMedia > .AudioContainer {position: absolute;bottom: 0;}
#news.active .areas-noticias.active .area.active .item.active.audio .itemPreview {margin: 0;position: absolute;top: 0;left: 0;width: 566px;}
#news.active .areas-noticias.active .area.active .item.active.audio .itemPreview img {height: 100%;}
#news.active .areas-noticias.active .area.active .item.active .itemDesc {width: 40%;position: relative;float: right;bottom: auto;top: auto;left: auto;right: auto;text-align: left;height: 66.66%;overflow: hidden;padding: 0em 2em 0 3em;}

/* SECCION DEPORTES Y CULTURA */

#deportes.active .sectionDesc,#cultura.active .sectionDesc {border: 2px solid #F2F2F2;width: 80%;position: absolute;top: 2px;left: 20%;height: 33%;background: #33ad88;color: #fff;font-size: 12px;line-height: 140%;border-top: 0;padding:1.2em;}
#cultura.active .sectionDesc {background:#E25289;border-top: 0; }
#deportes.active .item.active,#cultura.active .item.active  {top: 33.33%;height: 66.66%;}
#deportes.active .item.active .itemTitle,#cultura.active .item.active .itemTitle {position: relative;top: auto;left: auto;float: left;width: 40%;margin-left: 60%/* transition: all 300ms; */}
#deportes.active .item.active .itemTitle span,#cultura.active .item.active .itemTitle span {text-align: left;font-size: 240%;font-weight: 300;}
#deportes.active .item.active:hover .itemTitle,#cultura.active .item.active:hover .itemTitle {height: auto;}
#deportes.active .item.active .itemMedia,#cultura.active .item.active .itemMedia {width: 566px;margin: 0;border-right: solid 4px #F2F2F2;position: absolute;top: 0;left: 0;}
#deportes.active .item.active .itemMedia > .VideoContainer, #cultura.active .item.active .itemMedia > .VideoContainer {height: 376px;}
#deportes.active .item.active .itemMedia > iframe,#cultura.active .item.active .itemMedia > iframe {height: 376px;}
#deportes.active .item.active .itemMedia > img,#cultura.active .item.active .itemMedia > img  {height: 100%;width: auto;margin-left: -10%;}
#deportes.active .item.active .itemMedia > .AudioContainer,#cultura.active .item.active .itemMedia > .AudioContainer {position: absolute;bottom: 0;}
#deportes.active .item.active.audio .itemPreview, #cultura.active .item.active.audio .itemPreview {margin: 0;position: absolute;top: 0;left: 0;width: 566px;}
#deportes.active .item.active.audio .itemPreview img,#cultura.active .item.active.audio .itemPreview img {height: 100%;width: auto;}
#deportes.active .item.active .itemDesc,#cultura.active .item.active .itemDesc {width: 40%;position: relative;float: right;bottom: auto;top: auto;left: auto;right: auto;text-align: left;height: 66.66%;overflow: hidden;padding: 0em 2em 0 3em;}

/* SECCION FOTOS */
#fotos.seccion.active .itemsSection .item.active {display: block;background: rgb(124,187,231);}
#fotos.seccion.active .itemsSection .item.active .itemTitle {    background: rgba(0,0,0,0.8) !important;    width: auto;    height: auto;    z-index: 999;}
#fotos.seccion.active .itemsSection .item.active .itemDesc { z-index: 999;display: block;bottom: 0;left: 0;top: auto;right: 0;width: 100%; padding: 10px 90px;box-sizing:border-box; -moz-box-sizing:border-box; -webkit-box-sizing:border-box; -ms-box-sizing:border-box;background: rgba(0,0,0,0.8); font-size: 14px; line-height: 150%;}
#fotos.seccion.active .itemsSection .item.active .itemMedia {width: 100%;}
#fotos.seccion.active .itemsSection .item.active .itemMedia img{height: 100%;bottom: 0;position: absolute;left: 0;}
#fotos.seccion.active .back-button,#fotos.seccion.active .next-button{text-indent:-999em;z-index: 999;top: 50%;width:6em;height:8em;text-align: center;background: #7cbbe7;line-height: 1;display: block;margin-top:-4em;}
#fotos.seccion.active .next-button {left: auto;right:0.2em;background:url("/css/rtve.infografias/resumen-2014/i/arrow_right.png") #7cbbe7 no-repeat center center;}
#fotos.seccion.active .back-button {left: 0.2em;background:url("/css/rtve.infografias/resumen-2014/i/arrow_left.png") #7cbbe7 no-repeat center center;}

/* SECCION DIFUNTOS */

#difuntos .mes.active .titleMes,
#difuntos .mes .titleMes:hover {color: #fff;}
#difuntos .sectionDesc{position: absolute;top: 0;left: 0;width: 20%;height: 100%;border: 4px solid #f2f2f2;background: #383838;}
#difuntos .mes .itemsSection {width:500%;display: none;}
#difuntos .mes .titleMes {position: relative;height: auto;width: 100%;display: block;top: 12em;left: 0;font-size: 160%;color: #707070;text-align: center;-o-transition: all 0.3s;transition: all 0.3s;-moz-transition: all 0.3s;-webkit-transition: all 0.3s;line-height: 1.8;z-index:200;}
#difuntos .mes.active .itemTitle{height: 30px;position: absolute;top: auto;bottom: 0;line-height: 30px;}
#difuntos .mes.active .itemTitle span {position: relative;top: auto;left: auto; padding: 0; margin:0;bottom: 0;line-height: 30px;}
#difuntos .mes.active .itemPreview img {width: auto;height:100%;}
#difuntos .itemsSection > .t21 .itemPreview img {width:100%;height:auto;}
#difuntos .itemsSection > .t11 .itemPreview img,#difuntos .itemsSection > .t22 .itemPreview img {width:auto;height:100%;margin-left: -33.33%;}
.secciones.active #difuntos.seccion.active .titleSection{border:0;}
#difuntos .titleSection .box span{background: #383838;}
#difuntos.seccion.active .titleSection{background:none; }
#difuntos .mes.active .itemsSection {display: block;}
#difuntos .mes.active .detailContent {display: none;}
#difuntos .mes.active .detailContent .loading {font-size: 24px; color: #fff; position: absolute; top: 200px; left: 50%;margin-left: -60px;}
#difuntos .mes.active .close-button {display: none;}
#difuntos .item.active .itemTitle {display: none;}
#difuntos .item.active .detailContent {display: block;width: 100%;height: 100%;overflow-y: auto;}
#difuntos .item.active .detailContent .news h2.M a span {color: #fff;font-weight: 100;font-size: 30px;}
#difuntos .item.active .detailContent .news .chapeaux ul li {color: #fff;font-weight: 100;background: none;padding: 2px 0px;}
#difuntos .item.active .close-button {position: absolute; width: 25px; height: 25px; display: block; top: 5px; right: 5px; background: url('/css/rtve.infografias/resumen-2013/i/cerrar.png') no-repeat left top;text-indent: -999%;cursor: pointer;z-index: 999;}
#difuntos .item .itemPreview img{margin: 0;}
.close-button{text-indent:-999%;position:absolute;}
/* nav-second */
#nav-second {display: block;position: absolute;top: -50px;left: 0;width: 100%;}
#nav-second ul li {float: left;display: inline-block;width: 158px;text-align: center;}
#nav-second ul li:first-child {text-align: left;}
#nav-second ul li:last-child {text-align: right;}
#nav-second ul li span {color: #595959;font-size: 200%;display: inline-block;line-height: 1;width: 100%;cursor: pointer;font-weight: 500;;}
#nav-second ul .nav-portada.active span{color: #FF8D42;}
#nav-second ul .nav-news.active span{color: #FF8D42;}
#nav-second ul .nav-deportes.active span{color: #00AF87;}
#nav-second ul .nav-cultura.active span{color: #E25289;}
#nav-second ul .nav-fotos.active span{color: #52BCE9;}
#nav-second ul .nav-difuntos.active span{color: #383838;}
#fotos.seccion.active .next-button,#fotos.seccion.active .back-button{display: none;}
#fotos.seccion.active .next-button.active,#fotos.seccion.active .back-button.active{display: block;}
#video .f16x9{position: static;}
#resumen-2014.nacional{margin-bottom: 30%;}