/*
	NORMALIZE
*/

* {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

*:before, *:after {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

article, aside, details, figcaption, figure, footer, header, hgroup, nav, section, summary {
  display: block;
}

audio, canvas, video {
  display: inline-block;
}

html {
  font-family: sans-serif;
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
}

body {
  margin: 0;
  padding: 0;
  text-align: center;
}

a {
  text-decoration: none;
  transition: all 0.7s cubic-bezier(0.19, 1, 0.22, 1);
  -webkit-transition: all 0.7s cubic-bezier(0.19, 1, 0.22, 1);;
}

a:hover, a:focus, a:active,
button:hover, button:focus, button:active {
  text-decoration: none;
  outline: none;
}

b, strong {
  font-weight: bold;
}

code, kbd, pre, samp {
  font-family: monospace, serif;
  font-size: 1em;
}

pre {
  white-space: pre;
  white-space: pre-wrap;
  word-wrap: break-word;
}

small {
  font-size: 80%;
}

img {
  border: 0;
  display: inline-block;
  max-width: 100%;
  height: auto;
}

figure {
  margin: 0;
}

ul, ol {
  padding: 0;
  margin: 0;
}

ul, li {
  list-style-type: none;
  padding-left: 0;
  margin-bottom: 0;
  margin-top: 0;
}

ol li {
  list-style-type: decimal;
}

p {
  line-height: 1em;
  margin-bottom: 0;
  margin-top: 0;
}

h1, .h1, h2, .h2, h3, .h3, h4, .h4 {
  margin-top: 0;
  margin-bottom: 0;
}

blockquote {
  margin: 0;
  padding: 0;
}

body.no-scroll {
  overflow: hidden;
}


/*
  FUENTES
*/


@font-face {
  font-family: 'Majerit';
  src: url('/fonts/v1.x/v1.0/majerit/majeritheadlinelight-roman-webfont.woff') format('woff');
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Majrit Bn';
  src: url('/fonts/v2.x/v2.2/majrit/MajritBn-Light.woff2') format('woff2'),
       url('/fonts/v2.x/v2.2/majrit/MajritBn-Light.woff') format('woff');
  font-weight: 200;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Majrit Bn';
  src: url('/fonts/v2.x/v2.2/majrit/MajritBn-Bold.woff2') format('woff2'),
       url('/fonts/v2.x/v2.2/majrit/MajritBn-Bold.woff') format('woff');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Majrit Bn';
  src: url('/fonts/v2.x/v2.2/majrit/MajritBn-ExtraBold.woff2') format('woff2'),
       url('/fonts/v2.x/v2.2/majrit/MajritBn-ExtraBold.woff') format('woff');
  font-weight: 800;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Majrit Bn';
  src: url('/fonts/v2.x/v2.2/majrit/MajritBn-Black.woff2') format('woff2'),
       url('/fonts/v2.x/v2.2/majrit/MajritBn-Black.woff') format('woff');
  font-weight: 900;
  font-style: normal;
  font-display: swap;
}


/* FONT-FACE ELIMINADO */

/* FONT-FACE ELIMINADO */

/* FONT-FACE ELIMINADO */

/* FONT-FACE ELIMINADO */

/* FONT-FACE ELIMINADO */

/* FONT-FACE ELIMINADO */

/* FONT-FACE ELIMINADO */

/* FONT-FACE ELIMINADO */



@font-face {
  font-family: 'Iconos Pais';
  src: url('/fonts/v2.x/v2.0/ico/iconos-pais.woff') format('woff');
  font-weight: normal;
  font-style: normal;
}

a:hover, a:active, a:focus {
    outline: none;
    border: 0;
    text-decoration:none;
}

a:hover,
button:hover {
  /*opacity: 0.6;
  transition: opacity 0.5s;*/
}

/*
  FLEXSLIDER
*/

.flexslider {
  margin: 0;
  padding: 0;
  position: relative;
  position: absolute;
  top: 0;
  left: 0;
}
.flexslider .slides > li {
  height: 100vh;
 /* display: none;*/
  /*-webkit-backface-visibility: hidden;*/
}
.flexslider .slides img {
  display: block;
  width: 100vw;
  height: 100vh;
}
.flexslider .slides:after {
  content: "\0020";
  display: block;
  clear: both;
  visibility: hidden;
  line-height: 0;
  height: 0;
}
html[xmlns] .flexslider .slides {
  display: block;
}
* html .flexslider .slides {
  height: 1%;
}
.no-js .flexslider .slides > li:first-child {
  display: block;
}

/*.flexslider:not(.flexslider-retratos) .slides img {
  height: auto;
  -moz-user-select: none;
}*/

.flex-viewport {

  height: 100vh;
  -webkit-transition: all 1s ease;
  -moz-transition: all 1s ease;
  -ms-transition: all 1s ease;
  -o-transition: all 1s ease;
  transition: all 1s ease;
}

.flex-viewport .slides,
.flex-viewport .slides > li {
  width: 100%;
  height: 100vh;
}

.flex-control-nav {
  overflow: hidden;
  position: absolute;
  bottom: 1.5rem;
  left: 50%;
  transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  -webkit-transform: translateX(-50%);
  -moz-transform: translateX(-50%);
  -o-transform: translateX(-50%);

  width: 100%;
  padding: 0.35rem 0;
  text-align: center;
  display:none;
}

.flex-control-nav li {
  text-indent: -666rem;
  overflow: hidden;
  margin: 0 5px;
  display: inline-block;
}

.flex-control-nav li:first-child {
  margin-left: 0;
}

.flex-control-nav li:last-child {
  margin-right: 0;
}

.flex-control-nav li a {
    display: block;
    width: 24px;
    height: 24px;
    background: #fff;
    border-radius: 50px;
    text-indent: 0;
    text-align: center;
    text-decoration: none;
    vertical-align: middle;
    padding-top: 5px;
    font-family: 'MarcinAntB', sans-serif;
    font-size:12px;
    color:#000;
    font-weight: 700;
}

.flex-direction-nav {display:none;}

.flex-direction-nav li {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -o-transform: translateY(-50%);
}

.flex-direction-nav li:nth-child(1) {
  left:10%;
}

.flex-direction-nav li:nth-child(2) {
  right:10%;
}

.flex-direction-nav li a {
  width: 2.625rem;
  height: 2.625rem;
  display: block;
  border-radius: 50%;
  background: white;
  box-shadow: rgba(0,0,0,0.05) 0 0.5625rem 1.25rem;
  z-index: 1;
  text-indent: -666rem;
  overflow: hidden;
  transition: all 0.7s;
  -webkit-transition: all 0.7s;
  -moz-transition: all 0.7s;
  -ms-transition: all 0.7s;
  -o-transition: all 0.7s;


}

.flex-direction-nav li a.flex-disabled {
  display: none;
}

.flex-direction-nav li a:hover {
  box-shadow: rgba(0,0,0,0.15) 0 0.5625rem 1.25rem;
}

.flex-direction-nav li a:before {
  content: '';
  display: block;
  border-top: 0.125rem solid black;
  border-right: 0.125rem solid black;
  width: 1rem;
  height: 1rem;
  position: absolute;
}

.flex-direction-nav .flex-prev {
  transform: rotate(-135deg);
  -ms-transform: rotate(-135deg);
  -webkit-transform: rotate(-135deg);
  -moz-transform: rotate(-135deg);
  -o-transform: rotate(-135deg); 
}

.flex-direction-nav .flex-next {
  transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -o-transform: rotate(45deg);
}

.flex-direction-nav .flex-prev:before {
  top: 14px;
  left: 12px;
}

.flex-direction-nav .flex-next:before {
  top: 16px;
  left: 11px;
}



/*
  MÓVIL
*/

body {
  font-family: 'Oswald';
  -webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
  overflow-x: hidden;
  text-align: center;
}

.cabecera {
  text-align: center;
  position: relative;
  z-index: 2;
}

.cabecera h1 {
  font-weight: 500;
  text-transform: uppercase;
  font-size: 2.2rem;
  line-height: 111%;
  max-width: 24rem;
  margin: 0 auto;
}

.cabecera p {
  font-weight: 200;
  font-size: 1rem;
  line-height: 140%;
  clear: both;
  max-width: 24rem;
  margin: 1rem auto;
}


.compartir {
  text-align: center;
  position: absolute;
  z-index: 20;
  top: 0.625rem;
  right: 4rem;
}

.compartir li {
  display: inline-block;
  vertical-align: middle;  
}

.compartir a {
  display: block;
  width: 2rem;
  height: 3rem;
  text-indent: -666rem;
  font-family: 'Iconos Pais';
  color: white;
  font-size: 2rem;
  line-height: 3rem;
  text-align: center;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  position: relative;
}

.compartir a:before {
  display: block;
  text-indent: 0;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.compartir a.facebook:before {
  content: "\e902";
}

.compartir a.twitter:before {
  content: "\e90a";
}


/* menu */


.hamburguesa { 
  cursor: pointer;
  width: 3rem;
  height: 3rem;
  float: right;
  position: relative;
  text-indent: -666rem;
  overflow: hidden;
  margin-top: 10px;
  margin-right: 10px;
  z-index: 22;
}

.hamburguesa:before,
.hamburguesa:after {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%,-50%);
  -ms-transform: translate(-50%,-50%);
  -webkit-transform: translate(-50%,-50%);
  -moz-transform: translate(-50%,-50%);
  -o-transform: translate(-50%,-50%);

  width: 2.25rem;
  transition: transform 0.4s ease;
  -webkit-transition: transform 0.4s ease;
  -moz-transition: transform 0.4s ease;
  -ms-transition: transform 0.4s ease;
  -o-transition: transform 0.4s ease;
}

.hamburguesa:before { 
  height: 1.375rem;
  border-top: 0.25rem solid white;
  border-bottom: 0.25rem solid white;
}

.hamburguesa:after { 
  height: 0.25rem;
  background: white;
}


.menu {
  max-height: 0;
  overflow: hidden;
  height: 100vh;
  width: 100%;
  z-index: 1;
}

.menu li {
  font-size: 2.25rem;
  line-height: 150%;
  font-weight: 700;
  transform: translateY(3.125rem);
  -ms-transform: translateY(3.125rem);
  -webkit-transform: translateY(3.125rem);
  -moz-transform: translateY(3.125rem);
  -o-transform: translateY(3.125rem);  
  opacity: 0;
  transition: all .8s cubic-bezier(.24,.72,.35,1.01);
  -webkit-transition: all .8s cubic-bezier(.24,.72,.35,1.01);
  -moz-transition: all .8s cubic-bezier(.24,.72,.35,1.01);
  -ms-transition: all .8s cubic-bezier(.24,.72,.35,1.01);
  -o-transition: all .8s cubic-bezier(.24,.72,.35,1.01);
}

.menu li:nth-child(1) { transition-delay: .2s; }
.menu li:nth-child(2) { transition-delay: .4s; }
.menu li:nth-child(3) { transition-delay: .6s; }
.menu li:nth-child(4) { transition-delay: .8s; }
.menu li:nth-child(5) { transition-delay: 1s; }
.menu li:nth-child(6) { transition-delay: 1.2s; }
.menu li:nth-child(7) { transition-delay: 1.4s; }
.menu li:nth-child(8) { transition-delay: 1.6s; }
.menu li:nth-child(9) { transition-delay: 1.8s; }
.menu li:nth-child(10) { transition-delay: 2s; }
.menu li:nth-child(11) { transition-delay: 2.2s; }
.capa-fix.activa .menu li {
  transform: translateY(0);
  -ms-transform: translateY(0);
  -webkit-transform: translateY(0);
  -moz-transform: translateY(0);
  -o-transform: translateY(0);
  opacity: 1;
}

.menu li.activa {
  font-weight: 900;
}

.menu li a {
  color: black;
}

.capa-fix.activa{
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  max-height: 100vh;
  background: white;
  z-index:5;
}

.capa-fix.activa .menu {
  max-height: 100vh;
}

.capa-fix.activa .menu ul {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  text-align: center;
  width: 100%;
}

.capa-fix.activa .cabecera_logo {
  background-image: url('../img/el-pais-alt.svg');
}

.capa-fix.activa .hamburguesa:before {
  border-color: black;
}
.capa-fix.activa .hamburguesa:after {
  background: black;
}

.capa-fix.activa .hamburguesa { 
  transform: rotate(135deg);
  -ms-transform: rotate(135deg);
  -webkit-transform: rotate(135deg);
  -moz-transform: rotate(135deg);
  -o-transform: rotate(135deg);
}

.capa-fix.activa .hamburguesa:before { 
  border-bottom: none;
  transform: rotate(90deg);
  -ms-transform: rotate(90deg);
  -webkit-transform: rotate(90deg);
  -moz-transform: rotate(90deg);
  -o-transform: rotate(90deg);
  top: 0.75rem;
  left: -0.1875rem;
}


/* logo pais */

.elpais-logo {
  display: inline-block;
  vertical-align: middle;
  margin: 0 auto;
  z-index: 20;
  position: fixed;
  left: 20px;
  top: 20px;
}

.elpais-logo a {
  width: 7rem;
  height: 1.65rem;
  background-size: contain;
  overflow: hidden;
  display: block;
}

.contenido {
  position: relative;
  font-family: 'MarcinAntB', sans-serif;
}

section {
  display: none;
  transition: all 0.75s;
    -webkit-transition: all 0.75s;
    -moz-transition: all 0.75s;
    -o-transition: all 0.75s;
}

section.activo {
  display:block;
  visibility: visible;
}


/* main */

.contenido {
  position: relative;
}

/* titulares */

.contenido h1, 
.contenido h2, 
.contenido h3 {
  font-family: "Majrit Bn", serif;
  font-weight: 900;
}


/* tema */

.tema {
  width: 100%;
  height: 100vh;
  position: absolute;
  top: 0;
  left: 0;
}

.tema.activo {
  
}

.portada-tema {
  width: 100%;
  height: 100vh;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 3;
}
  
.espana .portada-tema,
.espana .portada-tema {background: #044998;}
.mundo .portada-tema {background: #5CB0D3;}
.economia .portada-tema {background: #72B82A;}
.sociedad .portada-tema {background: #29BC89;}
.ciencia .portada-tema {background: #F8A11C;}
.cultura .portada-tema {background: #D94A73;}
.deportes .portada-tema {background: #C21E4E;}
.fallecidos .portada-tema {background: #4A4A4A;}
.fotos .portada-tema {background: #000000;}


.portada-tema .titulo {
  transform: rotate(-90deg) translateY(-50%);
  -webkit-transform: rotate(-90deg) translateY(-50%);
  -ms-transform: rotate(-90deg) translateY(-50%);
  -moz-transform: rotate(-90deg) translateY(-50%);
  -o-transform: rotate(-90deg) translateY(-50%); 
  position: absolute;
  top: 50%;
  left: 80px;
}

.portada-tema .titulo-desktop {
  display: none;
}

.portada-tema h2 {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
  color:#fff;  
  font-family:"Majrit Bn";
  font-size: 90px;
  font-weight: 200;
  text-transform: uppercase;
} 

.portada-tema .titulo-desktop h2 {
  font-size: 100px;
  letter-spacing: -0.03px;
}

/* pasador de flexslider */

.pasador {
  position: absolute;
  z-index: 4;
  bottom: 16px;
  left: 50%;
  transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  -webkit-transform: translateX(-50%);
  -moz-transform: translateX(-50%);
  -o-transform: translateX(-50%);
  width: 100%;
}

.pasador li {
  display: inline-block;
  width: 10px;
  height: 10px;
  border-radius: 50px;
  background:#fff;
  margin: 0 3px;
}

.pasador li.seleccionado {
  background:#000;
}

.pasador li button {
  display: inline-block;
  color:#fff;
  font-size:12px;
  font-weight: 700;
  text-align: center;
  padding: 1px 0 0 0;
  cursor:pointer;
  border: none;
  -webkit-appearance: none;
  background: none;
  width: 10px;
  height: 10px;
  border-radius: 50px;
  text-indent: -666rem;
  overflow: hidden;
  text-align: left;
}

.pasador li.seleccionado button{
  color:#fff;
}


      @-webkit-keyframes aparecen {
        0%   { opacity: :0; }
        100% { opacity: 1; }
      }
      @-moz-keyframes aparecen {
        0%   { opacity: :0; }
        100% { opacity: 1; }
      }
      @-o-keyframes aparecen {
        0%   { opacity: :0; }
        100% { opacity: 1; }
      }
      @keyframes aparecen {
        0%   { opacity: :0; }
        100% { opacity: 1; }
      } 


  /* animacion navegacion */
  .activo .pasador,
  .activo .navegacion a {
        -webkit-animation: aparecen 2s 1.5s forwards; 
        -moz-animation:    aparecen 2s 1.5s forwards ; 
        -o-animation:      aparecen 2s 1.5s forwards ; 
        animation:         aparecen 2s 1.5s forwards ; 
        opacity: 0;
  }









@media (max-width:63.938rem) { 
/* animacion para la portada */
.activo .portada-tema {
      -webkit-animation: portada 1s 1s forwards; 
      -moz-animation:    portada 1s 1s forwards ; 
      -o-animation:      portada 1s 1s forwards ; 
      animation:         portada 1s 1s forwards ; 
      top:0;
      left:0;

}

    @-webkit-keyframes portada {
      0%   { top:0; }
      100% { top:-100vh; z-index: -1; }
    }
    @-moz-keyframes portada {
      0%   { top:0; }
      100% { top:-100vh; z-index: -1;}
    }
    @-o-keyframes portada {
      0%   { top:0; }
      100% { top:-100vh;z-index: -1; }
    }
    @keyframes portada {
      0%   { top:0; }
      100% { top:-100vh;z-index: -1;}
    } 

.activo .titulo {

  -webkit-animation: texto 1s 1s forwards; 
  -moz-animation:    texto 1s 1s forwards; 
  -o-animation:      texto 1s 1s forwards; 
  animation:         texto 1s 1s forwards; 
  opacity: 1;
}

    @-webkit-keyframes texto {
      0%   { opacity: 1; }
      100% { opacity: 0; }
    }
    @-moz-keyframes texto {
      0%   { opacity: 1; }
      100% { opacity: 0; }
    }
    @-o-keyframes texto {
      0%   { opacity: 1; }
      100% { opacity: 0; }
    }
    @keyframes texto {
      0%   { opacity: 1; }
      100% { opacity: 0; }
    } 

    .mundo .portada-tema h2 { font-size: 60px; }


}

@media (min-width:64rem) { 

  .activo .portada-tema {
    -webkit-animation: portada 1s 1s forwards; 
    -moz-animation:    portada 1s 1s forwards ; 
    -o-animation:      portada 1s 1s forwards ; 
    animation:         portada 1s 1s forwards ; 
    top:0;
    left:0;
  }

  @keyframes portada {
    0%   { left:0; }
    80% {left:-40vw;}
    100% { left:-40vw; z-index: -1;}
  } 

  .activo .titulo-desktop {
    -webkit-animation: texto 1s 1s forwards; 
    -moz-animation:    texto 1s 1s forwards; 
    -o-animation:      texto 1s 1s forwards; 
    animation:         texto 1s 1s forwards; 
    opacity: 1;
  }

  @-webkit-keyframes texto {
    0%   { opacity: 1; }
    100% { opacity: 0; }
  }
  @-moz-keyframes texto {
    0%   { opacity: 1; }
    100% { opacity: 0; }
  }
  @-o-keyframes texto {
    0%   { opacity: 1; }
    100% { opacity: 0; }
  }
  @keyframes texto {
    0%   { opacity: 1; }
    100% { opacity: 0; }
  } 

}



.story,
.story .flexslider {
  width: 100%;
  height: 100vh;
}

.tema,
.story {
  overflow:hidden;
}

.story .slides > li {
  text-align: left;
}

.story .item {
  padding: 30px;
  position: relative;
  height: 100%;
}

.story-amarillo .slides > li,
.flex-control-nav .flex-active {
  background: #000;
  color:#fff;
}

.story-rojo .slides li a,
.story-verde .slides li a,
.story-azul .slides li a {
  color: white;
}



.story h2 {
  font-weight: 900;
  font-size: 30px;
  line-height: 110%;
  margin-bottom: 1.2rem;
  color:#fff;
}

.story_texto {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);  
  width: 100%;
  /*padding: 0 30px;*/
  padding: 0 60px;
  max-width: 400px;
}

.story_texto p,
.story_texto li {
  font-weight: 400;
  font-size: 1.025rem;
  line-height: 140%;
  color: #fff;
  padding-bottom: 20px;
}

.story_texto p { padding-bottom: 6px; }

.story_texto p a,
.story_texto li a {
  text-decoration: underline;
}

.story_texto p strong,
.story_texto li strong {
  font-weight: bold;
}

.story_texto ul {
  margin-top: 0.5rem;
}

.story_texto li {
  position: relative;
  padding-left: 1rem;
}

.story_texto li:before {
  content: '•';
  line-height: 140%;
  position: absolute;
  top: 0;
  left: 0;
}

.story_texto .ver {
  min-width: 105px;
  background: #fff;
  text-align: center;
  font-size: 12px;
  font-weight: 500;
  text-transform: uppercase;
  display: inline-block;
  border-radius: 20px;
  padding: 8px 10px;
  color: #000;
  margin-right: 10px;
  border: 0.125rem solid white;
  background: transparent;
  color: white;
}

.story_texto .ver + .ver {
  background: white;
  color: black;
}



.story a {
  color: white;
}

.story_imagen {
  display: block;
  box-shadow: rgba(0,0,0,0.15) 0 0.5625rem 1.25rem;
}

.story_fondo {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
}

.story_fondo:after {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  content: "";
  z-index: 1;
  background: rgba(0,0,0,0.4);
}


/* colores pasadores de seccion */
.espana .story_fondo{ background:#044998; }
.mundo .story_fondo{background:#5CB0D3;}
.economia .story_fondo{ background: #72B82A;}
.sociedad .story_fondo{background:#29BC89;}
.ciencia .story_fondo{ background: #F8A11C;}
.cultura .story_fondo{ background: #D94A73;}
.deportes .story_fondo{ background: #C21E4E;}
.fallecidos .story_fondo{ background: #4A4A4A;}
.fotos .story_fondo{ background: #000000;}

.story_fondo img {
  display: block;
  width: 100%;
  object-fit: cover;
  object-position: 50% 0;
}

/*.story_fondo + .story_texto {
  color: white;
  position: absolute;
  bottom: 0;
  left: 0;
  padding: 1.25rem;
  width: 100%;
}*/


.story_fondo + .story_texto a {
  color: white;
}

.story_imagen img {
  display: block;
  width: 100%;
  margin-bottom: 1.25rem;
}

.story_texto {
  z-index: 1;
}

.story_cita {
  position: absolute;
  bottom: 0;
  left: 0;
  padding: 1.25rem;
}

.story_cita:before {
  content: '';
  display: block;
  width: 2.875rem;
  height: 2.3125rem;
  background: url('/especiales/2018/resumen-anual/img/comillas.svg') no-repeat center;
  margin-bottom: 1rem;
}

.story_cita h2 {
  font-size: 2.4375rem;
  line-height: 120%;
}

.story_cita p {
  font-size: 0.875rem;
  line-height: 120%;
  font-weight: bold;
  text-transform: uppercase;
}

.story_boton {
  background: white;
  box-shadow: rgba(0,0,0,0.05) 0 0.5625rem 1.25rem;
  border-radius: 2rem;
  display: block;
  text-align: center;
  text-transform: uppercase;
  font-size: 0.75rem;
  line-height: 120%;
  padding: 0.9rem 1rem 0.7rem;
  margin-bottom: 1rem;
  transition: all 0.7s;
    -webkit-transition: all 0.7s;
    -moz-transition: all 0.7s;
    -o-transition: all 0.7s;
}

.story_boton:hover {
  box-shadow: rgba(0,0,0,0.15) 0 0.5625rem 1.25rem;
}

.story .button {
  position: absolute;
  bottom: 3.8rem;  
  display: block;
  padding: 8px 20px;
  color:#fff;
  font-size: 14px;
  font-weight: 300;
  text-transform: uppercase;
  border:none;
  z-index: 2;
  cursor:pointer;
  min-width: 110px;
  border-radius: 20px;
  text-align: center;
}

/* colores pasadores de seccion */
.b-espana { background:#044998; }
.b-mundo {background:#5CB0D3;}
.b-economia { background: #72B82A;}
.b-sociedad {background:#29BC89;}
.b-ciencia { background: #F8A11C;}
.b-cultura { background: #D94A73;}
.b-deportes { background: #C21E4E;}
.b-fallecidos { background: #4A4A4A;}
.b-fotos { background: #000000;}




.story .button.derecha {
  right: -1rem;
  padding-right: 2rem;
}

.story .button.izquierda {
  left: -1rem;
  padding-left: -1rem;
}



.navegacion a {
  display: block;
  width: 2rem;
  height: 2rem;
  text-indent: -666rem;
  overflow: hidden;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 18;
  background-position: center;
  background-size: contain;
  background-repeat: no-repeat;
  opacity: 1;
  transition: 0s;
}

.navegacion .anterior {
  left: 0.625rem;
  background-image: url('/especiales/2018/resumen-anual/img/anterior.svg');
}

.navegacion .siguiente {
  right: 0.625rem;
  background-image: url('/especiales/2018/resumen-anual/img/siguiente.svg');
}

.intro {
  height: 100vh;
  background: black;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 19;
  display: block;
  transition: all 1s;
}

.intro {
  top: -110vh;
}

.intro h1 {
  color: white;
  font-family: 'Majrit Bn';
  font-weight: 200;
  font-size: 1.3rem;
}

.intro h1 strong {
  font-weight: 900;
  display: block;
  font-size: 5.75rem;
  line-height: 120%;
}

.intro p {
  color: white;
  font-family: 'MarcinAntB', sans-serif;
  font-weight: normal;
  font-size: 0.875rem;
  line-height: 140%;
  margin-top: 0.625rem;
}

.intro_contenido {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%,-50%);
  width: 18rem;
  z-index: 6;
}

.intro .quitar{
  display: block;
  color: white;
}

.intro .flexslider {
  height: 100%;
  width: 100%;
}

.intro .flexslider li {
  background-size: cover;
  background-position: center;
}



.intro .quitar {
  text-indent: -666rem;
  overflow: hidden;
  position: absolute;
  bottom: -4rem;
  left: 50%;
  transform: translateX(-50%) translateY(0rem);
  display: block;
  width: 2.5rem;
  height: 2.5rem;
  border-radius: 100%;
  border: 0.0625rem solid white;
  animation: animarFlecha 1.35s infinite alternate;
  cursor: pointer;
  z-index: 1;
}

.intro .quitar:before {
  content: '';
  width: 1rem;
  height: 1rem;
  border-top: 0.0625rem solid white;
  border-right: 0.0625rem solid white;
  display: block;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%,-70%) rotate(135deg);
}


.creditos {
  margin: 1rem 0;
  font-family: 'MarcinAntB', sans-serif;
}

.creditos a { display: block; }

.creditos .cre-desplegar {
  display: inline-block;
  color: white;
  font-size: 0.875rem;
  line-height: 120%;
  font-weight: 800;
  padding: 0.5rem 1rem;
}

.creditos .cre-desplegar:after {
  content: '';
  display: inline-block;
  vertical-align: middle;
  transform: translate(-50%,-50%) rotate(135deg);
  border-top: 0.125rem solid white;
  border-right: 0.125rem solid white;
  width: 0.5rem;
  height: 0.5rem;
  margin-left: 1rem;
}

.creditos.visible > a:after {
  transform: translate(-50%,-50%) rotate(-45deg);
  margin-top: 0.65rem;
}

.creditos ul {
  max-height: 0;
  overflow: hidden;
  transition: all 1s;
}

.creditos.visible ul {
  max-height: 20rem;
}

.creditos li {
  color: white;
  font-size: 0.9rem;
  line-height: 140%;
  font-weight: normal;
  margin-bottom: 0.25rem;
}

.creditos li strong {
  display: block;
  font-weight: 800;
}

.creditos li a {
  color: white;
}

.creditos span + a {
  display: block;
}
@keyframes animarFlecha {
  100% {
    transform: translateX(-50%) translateY(1rem);
  } 
}

.story_play {
  display: block;
  position: absolute;
  top: 50%;
  right: 0%;
  transform: translateY(-50%);
  width: 100%;
  height: 100%;
  cursor: pointer;
  max-width: 669px;
}

.story_play:before {
  content: '';
  display: block;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%,-50%);
  width: 100%;
  height: 100%;
  background: url('/especiales/2018/resumen-anual/img/play.svg') no-repeat center;
  background-size: 8rem 8rem;
  display:none;
}



/* extend */

.oculto {
  display: none !important;
}


/*
  RESPONSIVE tablet
*/

@media (min-width:48rem){ /* 768PX */

  /* posicion del texto */

  .story_texto {
    left: 10%;
    top: 70%;
    transform: translate(-10%, -70%);
    -webkit-transform: translate(-10%, -70%);    
    -ms-transform: translate(-10%, -70%);  
    -moz-transform: translate(-10%, -70%);  
    -o-transform: translate(-10%, -70%);      
  }





}


/*
  RESPONSIVE DESKTOP
*/

@media (min-width:64rem){ /* 1024PX */

  .capa-fix {
    width: 66%;
    position: relative;
    height: 100px;    
  }
  
  .compartir {
    right: calc(10% + 4rem);
  }

  .hamburguesa {
    position: absolute;
    right: 10%;
  }

  .story_play:before { display: block; }

  .capa-fix.activa .hamburguesa { right: 0; }

  .portada-tema { position: fixed; z-index:2; }
  .portada-tema .titulo { display: none; }
  .portada-tema .titulo-desktop {display: block;}

  .flexslider {
    position: relative;
  }

  .activo .story, 
  .activo .flexslider { 
        -webkit-animation: index 2s 1s forwards; 
        -moz-animation:    index 2s 1s forwards ; 
        -o-animation:      index 2s 1s forwards ; 
        animation:         index 2s 1s forwards ; 
        z-index: 1;
  }

      @-webkit-keyframes index {
        0%   { z-index: 1; }
        100% { z-index: 3; }
      }
      @-moz-keyframes index {
        0%   { z-index: 1; }
        100% { z-index: 3; }
      }
      @-o-keyframes index {
        0%   { z-index: 1; }
        100% { z-index: 3; }
      }
      @keyframes index {
        0%   { z-index: 1; }
        100% { z-index: 3; }
      } 

  .flex-control-nav { display:none; }


  /* flex slider texto*/

  .story .flex-textos {
/*    width: 60%;*/
    width: calc(100% - 40vw);
    float: left;
  }

  .story .flex-fondos {
    /*width: 40%;*/
    width: 40vw;
    float: right;
  }

  .story_fondo:after { display:none; }

  /* imagenes de los storys */

  .story_fondo {
    left: auto;
    right:0;  
    z-index: 0;
  }

  .story_fondo img {
    object-fit: contain;
    object-position: 100% 50%;
  }

  /* texto de los storys */
  .story_texto {
    max-width: 320px;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    width: 100%;
    padding: 0 30px;
    max-width: 400px;   
  }


  /* botones del story */
  .story .button { 
    z-index:3; 
    opacity: 0;
  }

  .story .button.derecha {
    right:42vw;
    padding-right: 20px;
  }

  .story .button.izquierda {
    left: 2vw;
    padding-left: 20px;
  }


  /* animacion botones desktop */
  .activo .story .button {
        -webkit-animation: aparecen 2s 1.5s forwards; 
        -moz-animation:    aparecen 2s 1.5s forwards ; 
        -o-animation:      aparecen 2s 1.5s forwards ; 
        animation:         aparecen 2s 1.5s forwards ; 
        opacity: 0;
        background:#000;
  }

      @-webkit-keyframes aparecen {
        0%   { opacity: :0; }
        100% { opacity: 1; }
      }
      @-moz-keyframes aparecen {
        0%   { opacity: :0; }
        100% { opacity: 1; }
      }
      @-o-keyframes aparecen {
        0%   { opacity: :0; }
        100% { opacity: 1; }
      }
      @keyframes aparecen {
        0%   { opacity: :0; }
        100% { opacity: 1; }
      } 


  /* navegacion flex */

  .flex-control-nav {
    z-index: 3;
    left: calc(100vw - 127vw);
    width: auto;
    opacity: 0;
  }

  /* animacion navegacion */
  .activo .pasador,
  .activo .navegacion a {
        -webkit-animation: aparecen 2s 1.5s forwards; 
        -moz-animation:    aparecen 2s 1.5s forwards ; 
        -o-animation:      aparecen 2s 1.5s forwards ; 
        animation:         aparecen 2s 1.5s forwards ; 
        opacity: 0;
  }


  .flex-active-slide {z-index: 5;}

  .flex-active-slide .story_texto {
    z-index: 10;
  }

  .pasador {
    left: 50%;
    transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    -o-transform: translateX(-50%);   
    bottom: 64px;
    width: auto;
    min-width: 350px;
    text-align: center;
  } 

  .espana .flex-textos,
  .espana .flex-textos {background: #044998;}
  .mundo .flex-textos {background: #5CB0D3;}
  .economia .flex-textos {background: #72B82A;}
  .sociedad .flex-textos {background: #29BC89;}
  .ciencia .flex-textos {background: #F8A11C;}
  .cultura .flex-textos {background: #D94A73;}
  .deportes .flex-textos {background: #C21E4E;}
  .fallecidos .flex-textos {background: #4A4A4A;}
  .fotos .flex-textos {background: #000000;}

  .intro h1 {
    font-size: 2.5rem;
  }

  .intro h1 strong {
    font-size: 11rem;
    line-height: 110%;
  }
  
  .intro p {
    font-size: 1rem;
    margin-top: 1.625rem;
  }
  
  .intro_contenido {
    width: 27rem;
  }

} /* FIN 1024PX */

@media (min-width:85.375rem){ /* 1366PX */
  
  
}



.video {
  height: 100% !important;
}

.b-video {
    min-width: 105px;
    background: #fff;
    text-align: center;
    font-size: 12px;
    font-weight: 500;
    text-transform: uppercase;
    display: inline-block;
    border-radius: 20px;
    padding: 8px 10px;
    color: #000;
    margin-right: 10px;
    border: 0.125rem solid white;
    background: transparent;
    color: white;
} 

@media (min-width:64rem){ /* 1024PX */

  .b-video { display:none;}

 }
/*
.video {
    max-width: 669px;
    float: right;
    right: 0;
    width: 100%;  
    position: relative;
}*/

.playerMRSTN_img { display: none!important; }
.intro.activo {top:0;}
.capa-fix { z-index: 20; }
.capa-fix.activa {z-index: 22;}
.a-firma {
  font-size: 12px;
  font-weight: 700;
  color: #fff;
  display: block;
  text-transform: uppercase;
  position: relative;
  margin-bottom: 20px;
}

.a-firma:before {
  content: "FOTO: "
}

.intro.activo + .contenido .capa-fix { width: 100%; }
.intro.activo + .contenido .capa-fix .hamburguesa {right: 10px;}
.intro.activo + .contenido .capa-fix .compartir {right: 70px;}

@media (max-width:63.938rem){ 
  .ver_video .flex-textos .slides,
  .ver_video button.button,
  .ver_video .story_play,
  .ver_video .story_fondo:after,
  .ver_video .pasador {
    display: none;
  }

  .intro .flexslider li:nth-child(2) {
    background-position: right center!important;
  }

}