::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}
::-webkit-scrollbar-track {
  background: transparent;
}
::-webkit-scrollbar-thumb {
  background-color: #555;
  -webkit-border-radius: 6px;
  -moz-border-radius: 6px;
  -ms-border-radius: 6px;
  -o-border-radius: 6px;
  border-radius: 6px;
}
::-moz-scrollbar {
  width: 6px;
  height: 6px;
}
::-moz-scrollbar-track {
  background: transparent;
}
::-moz-scrollbar-thumb {
  background-color: #555;
  -webkit-border-radius: 6px;
  -moz-border-radius: 6px;
  -ms-border-radius: 6px;
  -o-border-radius: 6px;
  border-radius: 6px;
}
::-moz-selection {
  color: #ffffff;
  background: #e5343a;
}
::selection {
  color: #ffffff;
  background: #e5343a;
}
.flex-container {
  width: 500px;
  height: 300px;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  /*
  display: flex; - convierte en flexibles a los elementos "hijo" del contenedor "padre" al que le damos la propiedad.
  */
  flex-direction: row;
  /* 
  flex-direction - establece la dirección y la posición de los ejes (cambia el "start" y el "end")
  
  flex-direction: row; <!-- predeterminada | mantiene el main axis en horizontal -->
  flex-direction: row-reverse; <!-- mantiene el main axis en horizontal pero invierto el orden de aparición de los "hijos" -->
  flex-direction: column; <!-- convierte el main axis en vertical -->
  flex-direction: column-reverse; <!-- convierte el main axis en vertical e invierte el orden de aparición de los "hijos" -->
  */
  flex-wrap: nowrap;
  /*
  flex-wrap - especifica si los elementos "hijos" son obligados a permanecer en una misma línea o pueden fluir en varias líneas.
  
  flex-wrap: nowrap; <!-- los elementos flex son distribuidos en una sola línea, lo cual puede llevar a que se desborde el contenedor flex -->
  flex-wrap: wrap; <!-- los elementos flex son colocados en varias líneas -->
  flex-wrap: wrap-reverse; <!-- actúa como wrap pero cross-start y cross-end están intercambiados. -->
  */
  justify-content: center;
  /*
  justify-content - alinea los elementos respecto al eje principal.
  
  justify-content: flex-start; <!-- predeterminada | alinea el contenido de la caja flexible al inicio del eje principal  -->
  justify-content: flex-end; <!-- alinea el contenido de la caja flexible al final del eje principal -->
  justify-content: center; <!-- alinea el contenido de la caja flexible en el centro del eje principal -->
  justify-content: space-between; <!-- el espacio entre elementos se distribuye unfirmemente para ocupar todo el eje principal -->
  justify-content: space-around; <!-- el espacio alrededor de los elementos se distribuye unfirmemente para ocupar todo el eje principal -->
  */
  align-items: center;
  /*
  align-items - alinea los elementos respecto al eje secundario.
  
  align-items: flex-start;
  align-items: flex-end;
  align-items: center;
  align-items: baseline; <!-- alinea los elemento respecto a la linea de base del texto -->
  align-items: stretch; <!-- predeterminada | rellena todo el espacio en el eje secundario -->
  */
}
.flex-item {
  width: 100px;
  height: 100px;
  /* el siguiente bloque de 3 reglas es para centrar el contenido de los "hijos". se pueden aplicar propiedades propias del "padre" también a los "hijos" */
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  justify-content: center;
  align-items: center;
  align-self: center;
  /*
  align-self - sobrescribe para un único elemento el valor de align-item fijado en el contenedor "padre".
  
  align-self: flex-start; <!-- se alinea al inicio -->
  align-self: flex-end; <!-- se alinea al final -->
  align-self: center; <!-- se alinea al centro -->
  align-self: baseline; <!-- se alinea sobre la base del texto -->
  align-self: stretch; <!--  -->
  */
  flex-basis: 100px;
  /*
  flex-basis - fija el tamaño base (no necesariamente el tamaño final) del item sobre el eje principal. Por tanto, puede estar sustituyendo (y primando) tanto a "width" como a "height" en función de cuál sea el main-axis. 
  
  flex-basis: auto; <!-- valor predeterminado. El tamaño estará definido por el contenido del item -->
  flex-basis: 100px; <!-- el ancho del item será de 100px -->
  */
  flex-grow: 1;
  /*
  flex-grow - determina el factor de crecimiento de los items para rellenar el espacio disponible.
  
  flex-grow: 0; <!-- valor predeterminado. El item no debe crecer: debe mantener su tamaño independientemente de que los demás crezcan -->
  
  Si a todos los items se les aplica un flex-grow: 1;, todos crecerán por igual. Sin embargo, si a un item concreto se le aplicase un valor "2", éste crecería el doble de lo que lo harían los demás para que entre todos se rellene el espacio diponible. 
  */
  flex-shrink: 1;
  /*
  flex-shrink - determina el factor de decrecimiento de los items para rellenar el espacio disponible. O sea, exactamente lo contrario a flex-grow.
  
  flex-shrink: 1; <!-- valor predeterminado. Todos los items decrecen por igual -->
  */
  flex: 1 1 100px;
  /*
  flex - es la propiedad abreviada para "flex-grow | flex-shirnk | flex-basis".
  
  Por tanto sería igual que escribir: 
  
  flex-grow: 1;
  flx-shrink: 1;
  flex-basis: 100px;
  */
}
.embed-container {
  position: relative;
  padding-bottom: 56.25%;
  height: 0;
  overflow: hidden;
  max-width: 100%;
  height: auto;
  margin-bottom: 40px;
}
.embed-container iframe,
.embed-container object,
.embed-container embed {
  position: absolute;
  top: 0;
  left: 0;
  width: 100% !important;
  height: 100% !important;
}
.fancypanel {
  display: none;
}
.fancypanel .container {
  max-width: 100%;
  padding-top: 15px;
  padding-bottom: 15px;
}
a:hover,
span:hover {
  -webkit-transition: all 0.1s ease-out;
  -moz-transition: all 0.1s ease-out;
  -ms-transition: all 0.1s ease-out;
  -o-transition: all 0.1s ease-out;
  transition: all 0.1s ease-out;
}
* {
  padding: 0;
  margin: 0;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -ms-box-sizing: border-box;
  -o-box-sizing: border-box;
  box-sizing: border-box;
}
*::before,
*::after {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -ms-box-sizing: border-box;
  -o-box-sizing: border-box;
  box-sizing: border-box;
}
*,
.clearfix,
.cierre {
  *display: inline-block;
  _height: 1%;
}
*::after,
.clearfix::after,
.cierre::after {
  content: "";
  clear: both;
}
*:hover,
.clearfix:hover,
.cierre:hover,
*:focus,
.clearfix:focus,
.cierre:focus,
*:active,
.clearfix:active,
.cierre:active {
  outline: none;
  text-decoration: none;
}
.cierre {
  clear: both;
  height: 0px;
}
.escritorio {
  display: block !important;
}
.responsive {
  display: none !important;
}
a.subir {
  font-size: 25px;
  line-height: 38px;
  color: #e5343a;
  position: fixed;
  bottom: 15px;
  right: 15px;
  text-align: center;
  width: 40px;
  z-index: 9999;
  background-color: rgba(255, 255, 255, 0.75);
  border: solid 1px rgba(0, 0, 0, 0);
  visibility: hidden;
  opacity: 0;
  -webkit-transition: all 0.5s ease-out;
  -moz-transition: all 0.5s ease-out;
  -ms-transition: all 0.5s ease-out;
  -o-transition: all 0.5s ease-out;
  transition: all 0.5s ease-out;
}
a.subir:hover {
  opacity: 1 !important;
  -webkit-transition: all 0.1s ease-out !important;
  -moz-transition: all 0.1s ease-out !important;
  -ms-transition: all 0.1s ease-out !important;
  -o-transition: all 0.1s ease-out !important;
  transition: all 0.1s ease-out !important;
  border: solid 1px rgba(0, 0, 0, 0.15);
}
i,
em {
  font-family: inherit;
}
small {
  font-size: 80%;
  line-height: inherit;
}
img {
  max-width: 100%;
}
hr {
  height: 1px;
  border: none;
  border-top: solid 1px #454545;
  margin-bottom: 20px;
  clear: both;
}
hr.dotted {
  border-top: dotted 1px #454545;
  margin: 0px;
}
table {
  width: 100%;
}
table tr {
  border-bottom: solid 1px #454545;
}
table tr th {
  padding: 1px 5px;
  font-weight: normal;
}
table tr th:first-of-type {
  padding-left: 0px;
}
table tr th:last-of-type {
  padding-right: 0px;
}
table tr td {
  padding: 1px 5px;
}
table tr td:first-of-type {
  padding-left: 0px;
}
table tr td:last-of-type {
  padding-right: 0px;
}
.wrapper-table {
  margin-bottom: 30px;
  overflow: auto;
}
.table {
  display: table;
  width: 100%;
  height: 100%;
  margin-bottom: 0px;
  text-align: center;
}
.table .cell {
  display: table-cell;
  vertical-align: middle;
  height: 100%;
}
@font-face {
  font-family: 'MuseoSans100';
  src: url('fuentes/museosans-100.eot');
  src: local('☺'), url('fuentes/museosans-100.woff') format('woff'), url('fuentes/museosans-100.ttf') format('truetype'), url('fuentes/museosans-100.svg#museo_sans100') format('svg');
  font-display: block;
}
@media screen and (-webkit-min-device-pixel-ratio: 0) {
  @font-face {
    font-family: 'MuseoSans100';
    src: url('fuentes/museosans-100.svg#museo_sans100') format('svg');
  }
}
@font-face {
  font-family: 'MuseoSans500';
  src: url('fuentes/museosans_500-webfont.eot');
  src: local('☺'), url('fuentes/museosans_500-webfont.woff') format('woff'), url('fuentes/museosans_500-webfont.ttf') format('truetype'), url('fuentes/museosans_500-webfont.svg#webfontKK3jdR7y') format('svg');
  font-display: block;
}
@media screen and (-webkit-min-device-pixel-ratio: 0) {
  @font-face {
    font-family: 'MuseoSans500';
    src: url('fuentes/museosans_500-webfont.svg#webfontKK3jdR7y') format('svg');
  }
}
@font-face {
  font-family: 'MuseoSans700';
  src: url('fuentes/museosans-700.eot');
  src: local('☺'), url('fuentes/museosans-700.woff') format('woff'), url('fuentes/museosans-700.ttf') format('truetype'), url('fuentes/museosans-700.svg#museo_sans700') format('svg');
  font-display: block;
}
@media screen and (-webkit-min-device-pixel-ratio: 0) {
  @font-face {
    font-family: 'MuseoSans700';
    src: url('fuentes/museosans-700.svg#museo_sans700') format('svg');
  }
}
/*
calc(~" ");

content: attr(data-*);
//con el atributo "data-*" añadido en una etiqueta html puedo incluir un texto en el "::before" ó "::after" como valor del "content"

[class*="col-"]

.transform(translate(-50%, -50%));

background-image: url(../gestor/recursos/uploads/imagenes/.svg);
background-size: cover;
background-position: center center;
background-repeat: no-repeat;

background: linear-gradient(to bottom, #34b8c0 0%, #6f51c7 100%);
*/
html {
  position: relative;
  min-height: 100vh;
}
body {
  font-family: 'MuseoSans500', sans-serif;
  font-size: 18px;
  line-height: 1.2;
  color: #343434;
  font-weight: normal;
  font-style: normal;
  text-align: left;
  background-color: transparent;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
body.navegando a.subir {
  visibility: visible;
  opacity: 1;
  -webkit-transition: all 0.5s ease-out;
  -moz-transition: all 0.5s ease-out;
  -ms-transition: all 0.5s ease-out;
  -o-transition: all 0.5s ease-out;
  transition: all 0.5s ease-out;
}
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: 'MuseoSans700';
  color: #2b2b31;
  line-height: 1.1;
  font-weight: normal;
  text-rendering: optimizeLegibility;
  display: block;
  margin: 0px 0px 50px;
}
h1 {
  font-size: 32px;
}
h2 {
  font-size: 26px;
}
h3 {
  font-size: 36px;
}
h4 {
  font-size: 17px;
  color: #494949;
  padding-bottom: 10px;
  margin-bottom: 10px;
  border-bottom: solid 1px #cbcbcb;
}
p {
  margin-bottom: 25px;
}
b,
strong {
  font-family: 'MuseoSans700';
  font-weight: normal;
}
a {
  color: inherit;
  outline: none;
  border: none;
  text-decoration: none;
}
a img {
  outline: none;
  border: none;
}
a:hover,
a:focus,
a:active {
  color: #e5343a;
  outline: none;
  text-decoration: none;
  cursor: pointer;
}
a.boton {
  color: #ffffff;
  display: inline-block;
  padding: 7px 20px;
  margin: 0px;
  background: #e5343a;
  border-radius: 18px;
}
a.boton:hover {
  background: #000000;
}
a.boton:active {
  position: relative;
  top: 1px;
}
ul {
  list-style-type: none;
  text-align: left;
  padding-left: 0px;
  margin-bottom: 10px;
}
ul.idioma {
  font-size: 14px;
  color: #454545;
  float: right;
  margin: 0px;
}
ul.idioma li {
  line-height: 18px;
  display: block;
  float: left;
  padding: 0 2px;
  position: relative;
}
ul.idioma li a {
  text-align: center;
  display: block;
  padding: 9px 7px 7px;
}
ul.idioma li a:hover,
ul.idioma li a.active {
  color: #ffffff;
  background: #2f2f2f;
  border-bottom-left-radius: 4px;
  border-bottom-right-radius: 4px;
}
ul.submenu {
  font-size: 12px;
  text-align: center;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  justify-content: center;
  margin-top: 10px;
}
ul.submenu li {
  padding: 0 20px;
}
ul.submenu li:first-child {
  padding-left: 0px;
}
ul.submenu li:last-child {
  padding-right: 0px;
}
ul.contacto {
  margin-top: 50px;
  margin-bottom: 50px;
}
ul.contacto li {
  margin-bottom: 5px;
}
ul.contacto li i {
  margin-right: 5px;
}
ul.redes {
  text-align: right;
  margin: 0px;
}
ul.redes li {
  display: inline-block;
  margin-left: 10px;
}
ul.redes li a {
  font-size: 16px;
  color: #ffffff;
  line-height: 30px;
  text-align: center;
  width: 34px;
  height: 34px;
  display: block;
  border: solid 2px #ffffff;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  -ms-border-radius: 50%;
  -o-border-radius: 50%;
  border-radius: 50%;
}
ul.redes li a:hover {
  color: #e5343a;
  background: #fff;
  text-decoration: none;
}
ul.redes li a.fa-facebook:hover {
  color: #3b5998;
}
ul.redes li a.fa-twitter:hover {
  color: #55acee;
}
ul.redes li a.fa-linkedin:hover {
  color: #007bb5;
}
ul.redes li a.fa-youtube:hover {
  color: #bb0000;
}
ul.archivos {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  margin: 0px;
}
ul.archivos > li {
  width: calc(100% / 6);
  margin: 45px 0px;
  padding: 0 10px;
}
ul.archivos > li a {
  display: block;
  text-align: center;
  text-overflow: ellipsis;
  overflow: hidden;
}
ul.archivos > li a::before {
  content: url('img/ic-pdf-landings.svg');
  display: block;
  padding-bottom: 10px;
}
ul.archivos > li.jpg a::before {
  content: url('img/ic-jpg.svg');
}
ul.archivos > li.eps a::before {
  content: url('img/ic-eps-landings.svg');
}
header {
  position: relative;
}
header .top {
  position: absolute;
  z-index: 1;
  left: 0;
  right: 0;
}
header .top a#logo {
  text-align: left;
  display: block;
  padding-top: 30px;
}
header .top a#logo img {
  max-height: 45px;
}
header #cabecera {
  height: 685px !important;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  justify-content: center;
  align-items: center;
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
}
header #cabecera .texto {
  text-align: center;
}
header #cabecera .texto h2 {
  font-size: 42px;
  color: #2b2b31;
  padding: 15px;
  margin: 0px;
  -webkit-text-shadow: 1px 1px 5px rgba(255, 255, 255, 0.75);
  -moz-text-shadow: 1px 1px 5px rgba(255, 255, 255, 0.75);
  -ms-text-shadow: 1px 1px 5px rgba(255, 255, 255, 0.75);
  -o-text-shadow: 1px 1px 5px rgba(255, 255, 255, 0.75);
  text-shadow: 1px 1px 5px rgba(255, 255, 255, 0.75);
}
header #cabecera .texto img {
  max-width: 90% !important;
}
header #layerslider {
  height: 685px !important;
  position: relative;
  z-index: 0;
}
header #layerslider .fondo {
  position: absolute;
  z-index: 0;
  top: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  left: 0 !important;
  background-size: cover;
  background-position: center;
}
header #layerslider .texto {
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  justify-content: center;
  align-items: center;
}
header #layerslider .texto h2 {
  font-size: 42px;
  color: #2b2b31;
  padding: 15px;
  margin: 0px;
  -webkit-text-shadow: 1px 1px 5px rgba(255, 255, 255, 0.75);
  -moz-text-shadow: 1px 1px 5px rgba(255, 255, 255, 0.75);
  -ms-text-shadow: 1px 1px 5px rgba(255, 255, 255, 0.75);
  -o-text-shadow: 1px 1px 5px rgba(255, 255, 255, 0.75);
  text-shadow: 1px 1px 5px rgba(255, 255, 255, 0.75);
}
header #layerslider .texto img {
  max-width: 90% !important;
}
section {
  padding-top: 80px;
}
section .txt-center {
  text-align: center;
}
section .franja.bg-gris {
  padding-top: 60px;
  padding-bottom: 60px;
  background-color: #f6f5f7;
}
section .franja.bg-gris p:first-of-type {
  margin-top: 7px;
}
section .franja.bg-gris p:last-of-type {
  margin-bottom: 0px;
}
section .franja.bg-gris a.boton {
  float: right;
}
section .franja.ultima-hora {
  padding-top: 35px;
  padding-bottom: 10px;
  position: relative;
  overflow: hidden;
  background: #f6f5f7;
}
section .franja.ultima-hora [class^="col-"]:first-of-type {
  color: #ffffff;
}
section .franja.ultima-hora [class^="col-"]:first-of-type p {
  position: relative;
}
section .franja.ultima-hora [class^="col-"]:first-of-type::before {
  content: '';
  display: block;
  background-color: #e5343a;
  position: absolute;
  z-index: 0;
  top: -1000px;
  right: 0;
  bottom: -1000px;
  left: -1000px;
}
section .franja.ultima-hora [class^="col-"]:last-of-type {
  padding-left: 45px;
}
section .entradilla {
  padding-bottom: 50px;
}
section.externa .entradilla {
  font-family: 'MuseoSans100';
}
section.externa .videos {
  padding-top: 30px;
  padding-bottom: 30px;
}
section.externa .videos .logo {
  height: 150px;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  justify-content: center;
  align-items: center;
}
section.externa .noticias {
  padding-top: 80px;
  padding-bottom: 80px;
}
section.externa .noticias h3 {
  text-align: center;
  margin-bottom: 90px;
}
section.externa .noticias .noticia {
  border: solid 1px #ededed;
  margin-bottom: 30px;
}
section.externa .noticias .noticia img {
  width: 100%;
}
section.externa .noticias .noticia .txt {
  font-size: 13px;
  padding: 20px;
}
section.externa .noticias .noticia .txt p {
  min-height: 100px;
}
section.externa .noticias .noticia .txt a.ver-mas {
  font-size: 15px;
}
section.externa .noticias .noticia .txt a.ver-mas::after {
  font-family: 'Font Awesome 5 Free';
  font-weight: 900;
  font-size: 24px;
  content: "\f0da";
  color: #e5343a;
  margin-left: 20px;
  position: relative;
  top: 5px;
}
section.interna h3 {
  margin-top: 40px;
}
section.interna .destacada {
  padding-top: 50px;
  padding-bottom: 100px;
}
section.interna .destacada p:last-of-type {
  margin-bottom: 80px;
}
section.interna .destacada img {
  width: 100%;
}
section.interna .videos {
  padding-top: 40px;
  padding-bottom: 40px;
}
section.interna .videos [class^="col-"] {
  padding-bottom: 40px;
}
.marquee {
  overflow: hidden;
}
.marquee a {
  margin-left: 15px;
}
footer {
  color: #ffffff;
  padding: 35px 0px 15px;
  background-color: #2f2f2f;
}
footer a:hover {
  color: #ffffff;
  text-decoration: underline;
}
footer .bottom {
  text-align: right;
  margin-top: 20px;
  padding-top: 20px;
  border-top: solid 1px #4a4848;
}
footer .bottom p {
  font-size: 11px;
  margin-bottom: 0px;
}
@media screen and (max-width: 991px) {
  ul.archivos > li {
    width: calc(100% / 4);
  }
}
@media screen and (max-width: 767px) {
  ul.redes {
    margin-top: 20px;
  }
  ul.submenu li {
    padding: 0 10px;
  }
  ul.archivos > li {
    width: calc(100% / 3);
  }
  h3 {
    font-size: 30px;
  }
  header .top a#logo {
    padding-top: 40px;
  }
  header #layerslider,
  header #cabecera {
    height: 100vh !important;
    min-height: 300px !important;
    max-height: 450px !important;
  }
  header #layerslider .texto h2,
  header #cabecera .texto h2 {
    font-size: 34px;
  }
  section .noticias {
    padding-top: 60px;
  }
  section .noticias h3 {
    margin-bottom: 50px;
  }
  section .franja.ultima-hora {
    padding-top: 25px;
    padding-bottom: 0px;
  }
  section .franja.ultima-hora [class^="col-"]:first-of-type::before {
    bottom: -20px;
  }
  section .franja.ultima-hora [class^="col-"]:last-of-type {
    padding-left: 15px;
    padding-top: 20px;
  }
  section.interna .destacada p:last-of-type {
    margin-bottom: 25px;
  }
  section.interna .destacada img {
    margin-bottom: 30px;
  }
}
@media screen and (max-width: 479px) {
  ul.archivos > li {
    width: calc(100% / 2);
  }
  section [class*="col-"] {
    width: 100% !important;
  }
}
@media print {
  a[href]::after {
    content: none !important;
  }
}
