@import url("https://fonts.googleapis.com/css2?family=Roboto+Flex:opsz,wght@8..144,100..1000&display=swap");

:root {
  --gris-autoria: #787878;
  --blanco-puro: #FFFFFF;
  --negro-texto-parrafo: #3D3D3D;
  --negro-texto:#3D3D3D;
  --negro-intenso: #000000;
  --negro-menos-intenso: #2B282B;
  --frambuesa-vibrante: #FF1D46;
  --degradado-card: linear-gradient(180.32deg, rgba(217, 217, 217, 0) 2.37%, rgba(0, 0, 0, 0.8) 74.07%);
  --gris-autoria: #535353;
  --negro-ott: #181D21;
  --gris-antetitulo: #837D83;
  --azul-marino-exn: #10242C;
  --verde-oscuro-exn: #1D6C5C;
  --verde-claro-exn: #3DE0BF;
  --verde-mas-claro-exn:#BBF9DF ;
  --blanco-roto-exn:#F2F7ED ;
  --azul-marino-exd: #10242C;
  --amarillo-oscuro-exd: #EDFF00;
  --amarillo-claro-exd: #FCFF94;
  --blanco-roto-exd: ;#F2F7ED;
}

.cx-icon {
  display: inline-block;
  height: 1em;
  background-color: currentColor;
  mask-repeat: no-repeat;
  mask-position: center;
  mask-size: contain;
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-position: center;
  -webkit-mask-size: contain;
}

/* Icono específico */
.cx-noticias {
  aspect-ratio: 3739.3 / 1080;
  mask-image: url('../icons/exn.svg');
  -webkit-mask-image: url('../icons/exn.svg');
}
.cx-noticias-two {
  aspect-ratio: 3739.3 / 1080;
  mask-image: url('../icons/exntwo.svg');
  -webkit-mask-image: url('../icons/exntwo.svg');
}
.cx-general {
  aspect-ratio: 3143.8 / 1080;
  mask-image: url('../icons/exg.svg');
  -webkit-mask-image: url('../icons/exg.svg');
}
.cx-deportes {
  aspect-ratio: 3739.3 / 1080;
  mask-image: url('../icons/exd.svg');
  -webkit-mask-image: url('../icons/exd.svg');
}
.cx-deportes-two {
  aspect-ratio: 3739.3 / 1080;
  mask-image: url('../icons/exdtwo.svg');
  -webkit-mask-image: url('../icons/exdtwo.svg');
}
.advertising-left-bar img{width: 100%;}
.advertising-top-bar img{width: 100%;}
.advertising-right-bar img{width: 100%;}

.region-header .menu--main .menu-item a{}
.region-secondary-menu ul{
 display: flex;
  list-style: none outside;
  justify-content: space-between;
}

.region-header .menu--main .menu-item a,
.region-secondary-menu .menu-item a{
  font-size: 14px;
  font-weight: bold;
  line-height: 120%;
  color: var(--gris-autoria);
}

home{

}

@media (max-width: 575px) {
  /* xs: móviles pequeños */
}

@media (min-width: 576px) and (max-width: 767px) {
  /* sm: móviles grandes */
}

@media (min-width: 768px) and (max-width: 991px) {
  /* md: tablets */
}

@media (min-width: 992px) {
  .layout-container{
    font-family: "Roboto Flex", sans-serif;
    display: grid;
    grid-template-areas:
      "al ac ar"
      "al head ar"
       "al highlighted ar"
      "al container ar"
      "al footer ar";
      grid-template-columns: 18% 64% 18%;
      margin: 0;
  }

  .advertising-left-bar{
     grid-area: al;
  }
  .advertising-top-bar{
    grid-area: ac;
  }
  .advertising-right-bar{
    grid-area: ar;
  }
  header{
    grid-area: head;
  }
  .region-highlighted{
    grid-area: highlighted;
  }
  main{
    grid-area: container;
  }
  footer{
    grid-area: footer;
  }
  .navigation.menu--main ul{
    list-style: none outside;
    text-align: left;
  }
  .navigation.menu--main li{
    padding: 0 36px 0 0;
    display: inline-block;
  }
  .navigation.menu--main li a{
    color: var(--negro-texto-parrafo);
  }
  .navigation.menu--main li.menu-item--active-trail a{
    color: var(--frambuesa-vibrante);
  }
  .navigation.menu--main .menu-icon-5 {
    border-right: 1px solid #ccc; /* puedes ajustar el color y grosor */
    margin-right: 10px;           /* espacio entre la barra y el siguiente ítem */
    padding-right: 10px;          /* espacio interior a la derecha */
  }

}

.menu-item a:hover{
  text-decoration: none;
}

.region-secondary-menu nav ul{
  list-style: none outside;
    text-align: left;
}
.region-secondary-menu nav li{
  padding: 0 36px 0 0;
    display: inline-block;
  
}
.region-secondary-menu .menu--noticias li.menu-item--active-trail a{
    color: var(--negro-texto-parrafo);
    border-bottom: 3px solid var(--verde-claro-exn);
    text-decoration: none;
}
.region-secondary-menu .menu--noticias li.menu-item a:focus,
.region-secondary-menu .menu--noticias li.menu-item a:hover{
    color: var(--verde-claro-exn);
    text-decoration: none;
}





.field--name-field-shared-media-iframe .iframe-player,
.views-field-field-shared-media-iframe .iframe-player,
.field--name-field-shooowit-iframe .iframe-player {
  position: relative;
  padding-bottom: 56.25%;
  height: 0;
  overflow: hidden;
}
.field--name-field-shared-media-iframe .iframe-player iframe,
.views-field-field-shared-media-iframe .iframe-player iframe,
.field--name-field-shooowit-iframe .iframe-player iframe {
  border: 0;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}