/*
----------------------------
ESTILOS FIJOS DE LA CABECERA
----------------------------
*/

/* logo de el pais fuera */
.agrupador__interior { clear: both; }

/* color de fondo */
.agrupador__interior,
.visible .agrupador-menu__interior,
.visible .agrupador-menu__interior:before,
.visible .boton_agrupador-menu:before,
.agrupador--simple .visible.agrupador-menu { background-color: #001722; }

/* botones redes sociales peques */
.agrupador-compartir [class^="boton_"] { font-size: 1.5rem; width: 1.525rem; height: 1.525rem; }

/* logo */
.principal:not(.principal--fijo) .agrupador-nombre a { background: url('/estaticos/2017/04/escaparate/img/agrupador-nombre.svg') center no-repeat; width: 249px; height: 100%; display: block; }

/* agrupador seccion: mostrar nombres de otros tags */
.agrupador-seccion:before {
    content: "/ ";
}
.agrupador-seccion { display: inline-block;
        color: #11C4FF;
    line-height: 48px; }

@media(min-width:1000px){
  /* color de fondo para cabecera fija en desktop */
  .principal--fijo .cabecera { background-color: #001722;}
}

@media(min-width:768px){
  .principal:not(.principal--fijo) .agrupador-nombre { margin-right: 50%; transform: translate(50%, 0); }
  /* menú ajustado a la izquierda */
  .principal:not(.principal--fijo) .agrupador-menu { background-color:#001722; margin: 0 20px; }
  .principal:not(.principal--fijo) .agrupador-menu ul { }
  .principal:not(.principal--fijo) .agrupador-menu li a { color:#99A2A7; }
  .principal:not(.principal--fijo) .agrupador-menu li:last-child a {
    color: #5ac1fa;
    padding-left: 13px;
    background: url(http://ep01.epimg.net/elpais/iconos/v2.x/v2.1/icon/icono-flash.svg) no-repeat;
    background-position: center left;
    background-size: 10px;
}
  .principal:not(.principal--fijo) .agrupador-menu .agrupador-compartir { top: 0.775rem; right: 0.225rem; /* volver a poner cuando NO tenga menú --- top: -3.4rem; right: 1.225rem; */ }
  .principal:not(.principal--fijo) .agrupador-nombre { height: 6rem; }
  .principal:not(.principal--fijo) .agrupador-menu:not(.visible) .agrupador-menu-navegacion { padding-left: 0; margin-right: auto; text-align: center; }
  
  /* agrupador seccion: mostrar nombres de otros tags */
  .principal:not(.principal--fijo) .agrupador__interior {
    text-align: center;
  }
  
  .principal:not(.principal--fijo) .agrupador-nombre {
    float:  none;
    transform: none;
    display: inline-block;
    vertical-align: middle;
    margin: auto;
  }
  
	.principal:not(.principal--fijo) .agrupador-seccion { 
    display: inline-block;
    vertical-align: middle;
    line-height: 42px;
    color: #11C4FF;
    font-size: 36px;
    text-align: center;
    font-family: 'MarcinAntB', sans-serif;
    font-weight: 200;
    font-style: normal;
    letter-spacing: -1px;
  }
  
  .principal:not(.principal--fijo) .agrupador-seccion:before { 
    content: "/ ";
  }
}
  
@media(max-width:999px){
  /* logo en cabecera fija */
  .principal--fijo .agrupador-nombre a { margin: 0 10px; background: url('/estaticos/2017/04/escaparate/img/agrupador-nombre.svg') center no-repeat; }
}

@media(max-width:767px){
  /* logo en cabecera versión móvil */
  .agrupador-nombre { height: 3rem; }
  /* logo en cabecera versión móvil */
  .principal:not(.principal--fijo) .agrupador-nombre a, .principal--fijo .agrupador-nombre a { margin: 0 10px; }
  /* cabecera en versión móvil ajustada a los márgenes */
  .salida_portadilla .principal:not(.principal--fijo) .cabecera .cabecera__interior { margin-left: 0; margin-right: 0; }
}


/*
------------------------------
PERSONALIZACIÓN DE LA CABECERA
------------------------------
*/

@media(min-width:768px){
  
  /* color de la linea situada arriba del menú */
  .principal:not(.principal--fijo) .agrupador-menu {
    /* border-top: 1px solid #CCD1D3; linea blanca */
    border-top: 1px solid #11C4FF; /* linea azul */
    /* border-top: 1px solid #FF4D4D; linea roja */
    
    /* quitar cuando tenga menú
    min-height: 0;
    margin: 0;
    fin quitar cuando tenga menú */
  }

  /* agrupador seccion: mostrar nombres de otros tags */
	.principal:not(.principal--fijo) .agrupador-seccion { 
    color: #11C4FF;
    /* color: #CCD1D3; blanco */
    /* color: #FF4D4D; rojo */
  }

}

@media(max-width:999px){
  /* logo en cabecera fija */
  .principal--fijo .agrupador-nombre a { width: 120px; }
}

@media(max-width:767px){
  /* logo en cabecera versión móvil */
  .principal:not(.principal--fijo) .agrupador-nombre a, .principal--fijo .agrupador-nombre a {  width: 120px; }
}


/*
-----------------------------------
ESTILOS PERSONALIZADOS EN LA PÁGINA
-----------------------------------
*/

body {
  -webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

h1,
h2,
h3,
h4,
h5,
h6,
.sumario_despiece .sumario-titulo {
  font-family: 'MarcinAntB', sans-serif;
}

.articulo-antetitulo,
.articulo-antetitulo a {
/*  text-align: center;*/
  color: #11C4FF;
}

body.salida_articulo .articulo-antetitulo {
  text-align: center;
}

body.salida_articulo .articulo-titulo {
  text-align: center;
  font-weight: 200;
}

body.salida_articulo .articulo-encabezado {
  padding-top: 1.50rem;
}

body.salida_articulo .articulo-subtitulos h2, 
body.salida_articulo .articulo-subtitulo {
  text-align: center;
  font-weight: 200;
}

body.salida_articulo .articulo-subtitulos,
body.salida_articulo .compartir:not(.compartir--fijo) {
  margin-bottom: 1.5rem;
}

body.salida_articulo .articulo-introduccion a,
body.salida_articulo .articulo-cuerpo a {
  border-bottom: 0.063rem dotted #11C4FF;
}

.articulo a,
body.salida_articulo .articulo-cuerpo a,
body.salida_articulo .articulo-introduccion a {
  color: #11C4FF;
}

body.salida_articulo .sumario_despiece {
  border-top: 0.063rem solid #11C4FF;
  background: #F8F8F8;
}

body.salida_articulo .sumario_despiece .sumario-titulo {
  font-weight: 500;
}

body.salida_portadilla .articulos_cierre .articulo:nth-child(1):nth-last-child(6) h2,
body.salida_portadilla .articulos_cierre .articulo:nth-child(1):nth-last-child(6) ~ .articulo h2,
body.salida_portadilla .bloque_actualidad .articulo h2,
body.salida_portadilla .bloque_actualidad .articulo .foto_w360 + h2,
body.salida_portadilla .articulos_cierre .articulo:nth-child(1):nth-last-child(3) .foto + h2,
body.salida_portadilla .articulos_cierre .articulo:nth-child(1):nth-last-child(3) ~ .articulo .foto + h2,
body.salida_portadilla .bloque_b .articulo-titulo,
body.salida_portadilla .bloque_a .articulo a,
body.salida_portadilla .bloque_c .articulo .articulo-titulo, 
body.salida_portadilla .bloque_c .articulo .foto_w360 + .articulo-titulo,
body.salida_portadilla .bloque_automatico .articulos .articulo .articulo-titulo,
body.salida_portadilla .articulos_cierre .articulo:nth-child(1):nth-last-child(4) .foto + h2,
body.salida_portadilla .articulos_cierre .articulo:nth-child(1):nth-last-child(4) ~ .articulo .foto + h2,
body.salida_portadilla .articulo h2 {
  font-weight: 200;
}

body.salida_portadilla .articulo-metadatos .autor-nombre {
  font-weight: 700;
}


/*
-------------
ESTILOS BOTON
-------------
*/

.escaparate_contenedor_boton,
.articulo-cuerpo > p.escaparate_contenedor_boton {
  max-width: 60.9rem;
  width: 100%;
  margin: 0 auto 4.376rem;
  margin-bottom: 4.376rem;
  padding: 0 1rem;
  text-align: center;
  position: relative;
  clear: both;
}

.escaparate_contenedor_boton:before {
  content: '';
  display: block;
  width: 100%;
  height: 1px;
  background: #E9E9E9;
  position: absolute;
  top: 50%;
  margin-top: -1px;
  left: 0;
}

.escaparate_contenedor_boton a,
body.salida_articulo .escaparate_contenedor_boton a {
  background: #11C4FF;
  color: white;
  font-family: 'MarcinAntB', sans-serif;
  font-weight: 700;
  font-style: normal;
  font-size: 1rem;
  line-height: 120%;
  text-align: center;
  display: inline-block;
  vertical-align: middle;
  padding: .625rem 1.25rem;
  border-radius: 1.25rem;
  margin: 0 auto;
  position: relative;
  transition: all .3s;
  box-shadow: 0 5px #0093c4;
}

.escaparate_contenedor_boton a:hover,
body.salida_articulo .escaparate_contenedor_boton a:hover {
  opacity: 1;
  box-shadow: 0 3px #0093c4;
  transform: translateY(2px);
}

p.escaparate_contenedor_boton a:before { content: none; display: none; }

@media (min-width: 62.5em){
  .principal--fijo .agrupador-nombre a {
    color: black;
  }
}