/*
Theme Name: ECT-GLOBAL
Author: JL
Author URI: https://www.behance.net/jl3gd
Description: Este tema está dirigido exclusivamente a la empresa ECT-GLOBAL.
Version: 1.0
License: GNU General Public License v3 or later
License URI: http://www.gnu.org/licenses/gpl-3.0.html
*/

* {
  padding: 0;
  margin: 0;
  box-sizing: border-box;
  font-family: "Metrophobic", serif;
  scrollbar-width: thin;
  scrollbar-color: var(--color-principal) transparent;
}

::-webkit-scrollbar {
  width: 12px;
  height: 12px;
}

a,
li {
  text-decoration: none;
  list-style: none;
}

:root {
  --color-principal: #99cc51;
  --color-secundario: #0093dd;
  --negro-principal: black;
  --negro-complementario: #1f1a17;
  --blanco: white;
  --error: #ff1e2d;
}

.oscuro {
  --color-principal: #99cc51 !important;
  --color-secundario: #0093dd !important;
  --negro-principal: white !important;
  --negro-complementario: #e0e5e8 !important;
  --blanco: #1f1a17 !important;
  --error: #ff1e2d !important;
}

.oscuro .carrusel {
  background-color: var(--negro-complementario);
}

p,
h1,
li,
h1,
h2,
h3,
h4,
h5,
h6,
li a {
  color: var(--negro-principal);
}

#wp-admin-bar-comments,
.hide-if-no-customize {
  display: none !important;
}

/* GRID */

body {
  display: grid;
  grid-template-areas:
    "cabecera  "
    "subenlaces"
    "slider    "
    "contenido "
    "footer    ";
  grid-template-rows: auto auto auto 1fr auto;
  height: 100vh;
  background-color: var(--blanco);

  .cabecera {
    grid-area: cabecera;
    display: flex;
    align-items: center;
    justify-content: space-around;
    height: 145px;
    gap: 20px;
  }

  .cabecera__enlaces_principales {
    grid-area: subenlaces;
    display: flex;
    font-size: 1em;
    text-transform: uppercase;
    font-weight: 800;
    list-style: none;
    justify-content: space-around;
    align-items: center;
    gap: 2em;
  }

  .contenedor,
  .contenedor-no-aside {
    grid-area: contenido;
    display: grid;
    transition: grid-template-columns 0.5s ease;
  }

  .contenedor {
    grid-template-columns: 1fr 300px;
  }

  .contenedor-no-aside {
    grid-template-columns: 1fr 0px;
    overflow-y: visible;
    overflow-x: clip;
  }

  .boton-aside.cerrado {
    right: -2px;
  }

  .contenedor__principal {
    flex: 1;
    display: flex;
    flex-direction: column;
    margin: 20px;
    gap: 20px;
    position: relative;
    overflow: hidden;
  }

  aside {
    display: flex;
    flex-direction: column;
    border-left: 3px solid var(--color-principal);
    padding: 40px 10px;
    text-align: center;
    box-sizing: border-box;
    height: 100%;
    overflow-y: scroll;
    position: relative;
    transition: transform 0.5s ease;
    min-height: 100%;
    max-height: 50vh;
    background-color: var(--blanco);
  }

  footer {
    grid-area: footer;
    background-color: var(--color-principal);
    border-top: 3px solid var(--color-secundario);
    display: flex;
    flex-direction: row;
    justify-content: space-around;
    padding: 0 20px;
  }

  /* COOKIES */

  .cookies,
  #cookies-eu-banner {
    position: fixed;
    width: 100%;
    background-color: var(--color-principal);
    z-index: 10;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 20px;
    border-radius: 30px 30px 0 0;
    bottom: 0px;
    font-size: 12px;
    animation: cookie_appear 1s;
  }

  .cookies-info,
  #cookies-eu-label {
    text-align: center;
    color: black;
    font-size: 15px;
  }

  @keyframes cookie_appear {
    0% {
      bottom: -50%;
    }

    100% {
      bottom: 30px;
    }
  }

  .cookie-enlace {
    color: #fff;
  }

  .botones-cookies,
  #cookies-eu-buttons {
    display: flex;
    gap: 20px;
  }

  .botones-cookies button,
  #cookies-eu-reject,
  #cookies-eu-accept,
  #cookies-eu-settings {
    border: none;
    background-color: black;
    padding: 10px;
    border-radius: 15px;
    color: white;
    font-size: 15px;
    transition: ease 0.5s;
  }

  .botones-cookies button:hover,
  #cookies-eu-reject:hover,
  #cookies-eu-accept:hover,
  #cookies-eu-settings:hover {
    cursor: pointer;
    background-color: var(--color-principal);
  }
  #cookies-eu-settings {
    background-color: white;
  }

  .hidden {
    display: none;
  }

  /* HEADER */

  header {
    display: flex;
    flex-direction: column;
    background-color: var(--blanco);
  }

  header > .cabecera__buscador {
    display: none;
  }

  .cabecera__logo img,
  .footer__logo {
    width: 220px;
    padding: 20px;
  }

  .cabecera__buscador {
    border: 3px solid var(--color-secundario);
    border-radius: 20px;
    width: 33%;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
  }

  .cabecera__buscador input[type="text"],
  .cabecera__buscador input[type="text"]:focus,
  .cabecera__buscador input[type="text"]:focus-visible {
    border: none;
    outline: none;
    padding-top: 4px;
    font-size: 20px;
  }

  .cabecera__buscador input[type="text"] {
    margin: 10px 0 15px 10px;
    text-transform: uppercase;
    background: transparent;
    color: var(--negro-complementario);
    width: 100%;
  }

  .cabecera__lupa {
    background-color: transparent;
    border: none;
    margin-right: 5px;
    font-size: 1.5em;
    margin-top: 3px;
    color: var(--color-secundario);
  }

  .cabecera__lupa:hover {
    color: var(--color-principal);
    cursor: pointer;
  }

  .cabecera__enlaces a {
    color: var(--negro-principal);
    text-transform: uppercase;
  }

  .cabecera__enlaces:hover {
    color: var(--color-secundario);
  }

  .subenlace__principal {
    display: none;
  }

  .cabecera__extras {
    display: flex;
    align-items: center;
    gap: 20px;
  }

  .idiomas-usuario {
    display: flex;
    gap: 20px;
    align-items: center;
    margin: 20px;
  }

  .idioma__elegido img,
  .idioma a img {
    width: 35px;
  }

  .extras__idioma {
    display: none;
  }

  .idioma__elegido {
    position: relative;
  }

  .idioma__elegido:hover .extras__idioma {
    position: absolute;
    right: 0;
    display: flex;
    gap: 20px;
  }

  .subenlaces .idioma__elegido {
    display: none;
  }

  .extras-acceso {
    width: 1em;
    font-size: 2em;
    color: var(--negro-principal);
  }

  .extras-acceso:hover {
    color: var(--color-secundario);
  }

  .enlace_principal-fecha {
    color: var(--color-principal);
  }
  .enlace_principal-aula {
    background-color: var(--color-secundario);
    padding: 10px;
    border-radius: 10px;
    text-wrap: nowrap;
  }
  .enlace_principal-aula:hover {
    background-color: var(--color-principal);
  }

  .enlace_principal a {
    color: var(--negro-principal);
  }

  .enlace_principal a:hover {
    color: var(--color-secundario);
  }

  .barras_responsive {
    display: none;
  }

  .enlaces {
    display: flex;
    align-items: center;
    justify-content: space-around;
    height: auto;
    background: linear-gradient(
      90deg,
      var(--color-principal),
      var(--color-secundario)
    );
    border-bottom: 3px solid var(--color-principal);
    text-transform: uppercase;
    color: var(--blanco);
    transition: 1s;
    flex-wrap: wrap;
  }

  .subenlaces .cabecera__enlaces,
  .submenu_separador,
  .subenlace_principal {
    display: none;
  }

  .current-menu-ancestor,
  .current_page_item,
  .current-menu-item {
    background: var(--color-principal) !important;
    font-weight: 900;
  }

  .current-menu-item.cabecera__enlaces {
    padding: 10px;
    border-radius: 20px;
  }

  #fecha_header {
    color: var(--color-principal);
  }

  #subenlace,
  #subenlace a {
    color: var(--blanco);
  }

  .subenlace__principal {
    padding: 5px;
    position: relative;
    display: block;
  }

  .subenlace_activo,
  .subenlace__principal:hover {
    background-color: var(--color-secundario);
  }

  .subenlace__principal:hover > .sub-menu,
  .subenlace_activo {
    transition: transform 0.5s ease-out, opacity 0.5s ease-out;
    transform: scaleY(1);
    opacity: 1;
    padding: 4px 0;
  }

  .sub-menu {
    display: block;
    transform: scaleY(0);
    transform-origin: top;
    position: absolute;
    right: 0px;
    z-index: 3;
    opacity: 0;
    transition: transform 0.5s ease-out;
  }

  li#subenlace:first-child > .sub-menu {
    left: 0;
  }

  li#subenlace:first-child > .sub-menu li {
    text-align: left;
  }

  .subenlace__secundario {
    background-color: var(--color-secundario);
    width: 350px;
    text-align: end;
  }

  #fecha_subheader {
    display: none;
  }

  .subenlace__secundario a {
    display: block;
    padding: 5px 10px;
    color: var(--blanco);
    font-weight: 300;
  }

  .subenlace__secundario a:hover {
    background-color: var(--color-principal);
    color: var(--negro-complementario);
    font-weight: 900;
  }

  .logo_subheader,
  .submenu_separador,
  .subenlace__sesion {
    display: none;
  }

  .claro-oscuro button {
    font-size: 25px;
    border: none;
    background-color: transparent;
    color: var(--negro-principal);
  }

  .claro-oscuro:hover {
    color: var(--color-secundario);
  }

  .subenlace__sesion .claro-oscuro {
    font-size: 25px;
    border: none;
    background-color: transparent;
    color: var(--blanco);
  }

  .subenlace__sesion .claro-oscuro:hover {
    color: var(--color-secundario);
  }

  .off {
    display: none;
  }

  /* SLIDER */

  .slider {
    height: 300px;
    grid-area: slider;
    width: 100%;
    position: relative;
    overflow: hidden;
    z-index: -1;
    margin-top: -3px;
  }

  .slider ul {
    display: flex;
    width: 100%;
    margin: 0;
    padding: 0;
    list-style: none;
  }

  .slider__grupo {
    flex: 0 0 100%;
    position: relative;
    height: 100%;
    /* overflow oculto para el texto pero animamos dentro de imagen */
    overflow: hidden;
  }

  .slider__imagen {
    width: 100%;
    height: 300px;
    object-fit: cover;
    display: block;
    animation: flotar 20s ease-in-out infinite;
    transform-origin: center center;
  }

  @keyframes flotar {
    0% {
      transform: scale(1) translateY(0);
    }
    50% {
      transform: scale(1.05) translateY(-20px);
    }
    100% {
      transform: scale(1) translateY(0);
    }
  }

  .slider__titulo {
    position: absolute;
    top: 220px;
    width: 500px;
    padding: 40px;
    transform: translateY(-195px);
    text-transform: uppercase;
    font-size: 40px;
    color: var(--blanco);
  }

  .slider__grupo:nth-child(odd) .slider__titulo {
    right: 0;
    text-align: right;
    background: linear-gradient(-90deg, var(--color-principal), transparent);
  }

  .slider__grupo:nth-child(even) .slider__titulo {
    left: 0;
    background: linear-gradient(90deg, var(--color-secundario), transparent);
  }

  /* COMENTARIOS */
  .comentarios,
  .lista_comentarios,
  .respuestas {
    display: block;
  }

  .comentarios__titulo {
    background-color: var(--color-principal);
    padding: 20px;
    text-transform: uppercase;
    text-align: center;
    color: var(--blanco);
  }

  .formulario__comentario {
    display: flex;
    flex-direction: column;
  }

  .formulario__comentario label {
    margin: 10px 0;
  }

  .formulario__comentario textarea {
    resize: none;
    width: 100%;
    min-height: 250px;
    padding: 20px;
  }

  .formulario__comentario button,
  .comentario__responder {
    width: 250px;
    background-color: var(--color-secundario);
    padding: 10px;
    color: var(--blanco);
    border: none;
    margin: 10px 0;
    border-radius: 5px;
    text-transform: uppercase;
  }

  .comentario__responder {
    width: 150px;
  }

  .formulario__comentario button:hover,
  .comentario__responder:hover {
    background-color: var(--color-principal);
  }

  .comentario,
  .respuesta {
    display: flex;
    flex-direction: column;
    gap: 30px;
  }

  .comentario__usuario {
    display: flex;
  }

  .respuesta {
    display: flex;
    width: 80%;
    margin-left: 20%;
    flex-direction: row;
  }

  .comentario__foto,
  .respuesta__foto {
    width: 50px;
    height: 50px;
    border-radius: 100%;
    border: 2px solid var(--color-principal);
    margin: 15px;
  }

  .comentario__nombre,
  .respuesta__nombre {
    color: var(--color-principal);
  }

  .comentario__texto,
  .respuesta__texto {
    margin: 20px 0;
  }

  /* ASIDE */

  .boton-aside,
  .noticias-aside {
    position: fixed;
    color: var(--blanco);
    top: 50%;
    font-size: 14px;
    transition: 0.5s ease;
  }

  .boton-aside {
    border: none;
    background-color: var(--color-principal);
    padding: 5px 4px 5px 5px;
    right: 298px;
    border-radius: 100% 0 0 100%;
  }

  .noticias-aside {
    right: -600px;
    top: 60%;
    color: var(--negro-principal);
    text-transform: uppercase;
    font-weight: 900;
    transform: rotate(-90deg);
  }

  .noticias-activo {
    right: -60px;
  }

  .boton-aside:hover {
    padding-right: 10px;
    cursor: pointer;
  }

  .noticias {
    display: flex;
    flex-direction: column;
    gap: 30px;
  }

  .noticia {
    display: flex;
    flex-direction: column;
    width: 100%;
  }

  .noticia__titulo {
    font-size: 1em;
    color: var(--color-secundario);
    text-transform: uppercase;
    margin: 10px;
  }

  .noticia__imagen {
    width: 100%;
  }

  .botonera {
    display: flex;
    align-items: center;
    justify-content: space-around;
    margin: 20px;
  }

  .botonera__flecha {
    font-size: 3em;
    color: var(--color-secundario);
  }

  .botonera__pagina-actual {
    font-size: 3em;
    font-weight: 800;
    color: var(--color-principal);
  }

  .etiquetas {
    margin: 10px;
  }

  .aside-etiqueta {
    background-color: var(--color-principal);
    border-radius: 5px;
    font-weight: 800;
    color: var(--negro-complementario) !important;
    padding: 5px;
    margin-top: 10px;
    display: inline-block;
    width: fit-content;
  }

  /* CONTENIDO PRINCIPAL */
  .contenido__principal {
    display: flex;
    opacity: 0;
    transform: translateY(50px);
    transition: opacity 0.5s ease-out, transform 0.5s ease-out;
  }

  .contenido__principal-imagen {
    max-height: 400px;
    object-fit: cover;
    float: left;
    margin-right: 20px;
  }

  .contenido__principal-parrafo {
    flex: 1;
  }

  .contenido__principal-parrafo > p {
    margin: 20px 0;
  }

  .contenido__principal-parrafo a {
    color: var(--color-principal);
  }

  .contenido__principal-fecha,
  .contenido__principal-autor {
    margin: 10px 0;
  }

  .contenido__principal-contenido {
    display: block;
    position: relative;
    overflow: hidden;
  }

  .contenido__principal-autor {
    color: var(--color-principal);
  }

  .contenido__principal-enlace {
    background-color: var(--color-principal);
    padding: 20px;
    padding-bottom: 20px;
    border-radius: 20px;
    margin: 20px 0;
    color: black !important;
    display: inline-block;
  }

  .contenido__principal-enlace:hover {
    background-color: var(--color-secundario);
    cursor: pointer;
    color: white !important;
  }

  .contenido__principal-titulo,
  .contenido__principal-noticia,
  .contenido__principal-busqueda {
    color: var(--color-principal);
    text-transform: uppercase;
    margin: 0 0 10px 0;
  }

  .contenido__principal-titulo:hover {
    color: var(--color-secundario);
  }

  .contenido__principal-busqueda {
    color: var(--color-secundario);
    font-size: 2em;
  }

  .contenido__principal-etiqueta {
    background-color: var(--color-principal);
    border-radius: 5px;
    font-weight: 800;
    color: var(--negro-complementario) !important;
    padding: 5px;
    margin: 10px auto;
    display: inline-block;
  }

  .contenido__principal-texto {
    padding-right: 10px;
  }

  .contenido__principal-texto p,
  .contenido__principal-texto img,
  .contenido__principal-texto h2,
  .contenido__principal-texto h3,
  .contenido__principal-texto h4,
  .contenido__principal-texto h5,
  .contenido__principal-texto h6,
  .contenido__principal-texto ul,
  .contenido__principal-texto ol,
  .contenido__principal-texto table,
  .contenido__principal-texto blockquote,
  .contenido__principal-texto hr,
  .contenido__principal-texto iframe,
  .contenido__principal-texto li {
    padding-bottom: 20px;
  }

  .contenido__principal-texto li {
    margin-left: 40px;
    list-style: none;
  }

  .contenido__principal-texto td {
    vertical-align: middle;
  }

  .contenido__principal-texto a {
    color: var(--color-secundario);
  }

  .contenido__principal-texto a:hover {
    color: var(--negro);
  }

  .error {
    color: var(--error);
  }

  .error-titulo {
    font-size: 160px;
  }

  .error-texto {
    font-size: 60px;
    text-transform: uppercase;
  }

  .error-titulo,
  .error-texto {
    color: var(--color-secundario);
    text-align: center;
  }

  table,
  table tr td {
    border: 1px solid var(--negro-complementario);
    border-collapse: collapse;
    padding: 20px;
    margin: 20px auto;
  }

  th {
    background-color: var(--color-principal);
    color: var(--negro-principal);
    font-weight: 800;
    border: 1px solid var(--color-principal);
    border-bottom: 1px solid var(--negro-principal);
    padding: 20px;
  }

  .contenido__principal-contenido > p {
    margin: 20px;
    text-align: left;
  }

  h2 {
    margin: 20px 0;
  }

  /* CONTACTO */

  .contacto__bg {
    position: fixed;
    width: 110%;
    height: 100%;
    top: 0;
    z-index: -1;
    left: -20px;
    overflow: hidden;
    opacity: 0.3;
  }
  .wpforms-field-label {
    color: var(--color-secundario) !important;
  }

  .wpforms-field-sublabel.after {
    color: var(--negro-complementario) !important;
  }

  .contacto__formulario {
    gap: 20px;
  }

  .contactos {
    display: flex;
    justify-content: space-between;
    align-content: center;

  }

  .pagina__contacto,
  .contacto__redes {
    display: flex;
    flex-direction: column;
    justify-content: center;
    margin: auto;
    text-align: center;
    gap: 20px;
  }

  .contacto,
  .redes {
    height: auto;
    display: block;
    width: 100%;
    padding: 5px;
    background-color: var(--color-principal);
    border-radius: 20px;
    text-align: center;
    margin: auto;
  }

  .lista_redes {
    display: flex;
    padding: 0 !important;
    margin: 0;
    align-items: center;
    width: 100%;
    justify-content: space-around;	
  }
  .red{
    padding: 0 !important;
    margin: 0;
  }

  .lista_redes li {
    list-style: none;
  }

  .lista_redes li a {
    font-size: 40px;
  }

  .contacto > *,
  .redes > * {
    margin: 0px;
    padding: 5px;
  }

  .formulario {
    border: 1px solid var(--color-secundario);
    border-radius: 20px;
    padding: 0;
  }

  .formulario > * {
    gap: 10px;
    margin: 0;
    padding: 0;
  }

  .wp-block-social-link-anchor {
    background-color: var(--color-secundario) !important;
    border-radius: 100%;
    height: auto;
  }

  .wp-block-social-link-anchor svg {
    width: 30px !important;
    height: 30px !important;
  }

  div.wpforms-container-full:not(:empty) {
    margin: 0;
    padding: 0 20px;
    height: 100%;
    display: flex;
    gap: 0;
    align-items: center;
  }

  .wpforms-validate.wpforms-form.wpforms-ajax-form {
    height: 100%;
  }

  .wpforms-container-full,
  .wpforms-container-full * {
    width: 100%;
  }

  .footer__icono {
    display: flex;
    color: var(--blanco);
    background-color: var(--color-secundario);
    align-items: center;
    justify-content: center;
    font-size: 1.5em;
    padding: 10px;
    border-radius: 100%;
  }

  .Wordpress {
    text-transform: uppercase;
    margin: 10px 0;
  }

  .contacto_bg {
    position: absolute;
    width: 100%;
    z-index: -2;
    top: 0;
    mask-image: linear-gradient(90deg, transparent, 60%, #fff);
  }

  .formulario-contacto {
    background-color: var(--color-secundario);
    border-radius: 20px;
    padding: 20px;
  }

  .formulario {
    display: flex;
    flex-direction: column;
    width: 100%;
    gap: 20px;
  }

  .formulario-contacto textarea,
  .formulario-contacto input {
    resize: none;
    height: auto;
    border-radius: 10px;
    border: none;
    font-size: 15px;
    padding: 5px;
  }

  .formulario input {
    border-radius: 0;
  }

  .formulario button {
    padding: 20px;
    background-color: var(--color-principal);
    border: none;
    border-radius: 10px;
    text-transform: uppercase;
    margin-bottom: 20px;
  }

  .formulario button:hover {
    background-color: var(--color-secundario);
    border: 2px solid var(--color-principal);
    cursor: pointer;
  }

  .titulo__formulario {
    color: var(--blanco);
  }

  /* Wordpress grid */
  body .is-layout-grid {
    display: grid;
    justify-content: center;
    align-items: center;
    overflow: hidden;
  }
  .grecaptcha-logo,
  .grecaptcha-badge {
    display: none;
  }

  /* CARRUSEL */

  .carrusel__principal {
    width: 100%;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    gap: 20px;
  }

  .carrusel__titulo {
    text-transform: uppercase;
    text-align: center;
  }

  .carrusel {
    overflow: hidden;
    width: 100%;
    padding: 0 40px;
  }

  .carrusel__track {
    display: flex;
    gap: 30px;
    will-change: transform;
  }

  .carrusel__foto {
    height: 120px;
    transition: filter 0.5s;
    filter: grayscale(100%);
  }

  .carrusel__foto:hover {
    filter: grayscale(0%);
  }

  /* FOOTER */

  .menu__footer,
  .footer__nav {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    margin: 0 20px;
    text-wrap: nowrap;
    gap: 20px;
  }

  .footer__nav {
    flex-direction: column;
    gap: 5px;
    align-items: end;
  }

  #fecha_footer,
  .footer__nav li {
    font-size: 15px;
    text-align: center;
  }

  .footer__nav li,
  .footer__nav > .cabecera__enlaces a,
  #fecha_footer {
    color: var(--negro-principal);
    text-transform: uppercase;
  }

  .nav__redes,
  .footer_redes {
    display: flex;
    gap: 20px;
    align-items: center;
  }

  .footer__redes {
    display: flex;
    flex-direction: row;
    gap: 20px;
  }

  .footer__redes * {
    fill: var(--negro-complementario) !important;
  }

  /*------------------ MEDIA QUERYS -------------------*/
  /* Tabletas */
  @media (max-width: 1280px) {
    /* GRID */
    body {
      grid-template-areas:
        "cabecera"
        "slider"
        "contenido"
        "footer";
    }

    .contenedor {
      grid-template-columns: 1fr;
    }

    .subenlaces {
      position: fixed;
      display: grid;
      grid-template-rows: 100px 1fr;
      grid-auto-columns: 1fr;
      text-align: center;
      top: -120%;
      left: 0;
      height: 100%;
      width: 100%;
      border: none;
      z-index: 2;
      overflow-y: scroll;
      background: linear-gradient(
        180deg,
        var(--color-principal),
        var(--color-secundario)
      );
      gap: 20px;
      transition: all 1s;
    }

    .logo_subheader {
      display: flex;
      align-items: center;
      justify-content: space-between;
      background: var(--color-principal);
      padding: 20px;
    }

    /* CABECERA */
    .subenlace__principal {
      display: block;
    }

    .cabecera__enlaces_principales {
      display: none;
    }

    .cabecera__enlaces_principales li a {
      color: var(--negro-complementario) !important;
    }

    .subenlace__secundario {
      display: block;
      margin: auto;
      text-align: center !important;
    }

    .barras_responsive {
      display: block;
      cursor: pointer;
      transition: 0.2s ease;
      background-color: transparent;
      border: none;
    }

    .barras_responsive:hover {
      color: var(--color-principal);
    }

    .barras_responsive {
      font-size: 2.5em;
      color: var(--negro-principal);
      margin-right: 10px;
    }

    .cabecera {
      justify-content: space-between;
    }

    .cabecera__buscador,
    .cabecera__buscador input {
      width: 70%;
      margin-bottom: 5px;
    }

    .cabecera__logo img,
    .footer__logo {
      width: 200px;
    }

    .subenlaces_principales {
      display: flex !important;
    }

    .subenlace__principal,
    .subenlace__principal ul,
    .subenlace__sesion a,
    .cabecera__enlaces {
      border: none;
      margin: 20px 0;
      color: var(--blanco);
    }

    #subenlace,
    #subenlace a {
      width: 100%;
    }

    #subenlace,
    .subenlace__principal a,
    .subenlace__principal {
      color: var(--blanco) !important;
      font-size: 20px;
    }

    .enlaces {
      flex-direction: column;
      margin: 20px 0;
      border-bottom: none;
      background: transparent;
    }

    .subenlace__principal:hover > .sub-menu,
    .subenlace_activo {
      padding: 20px;
      display: block;
      position: relative;
    }

    .subenlace_principal {
      display: block;
    }

    .subenlace__principal:hover,
    .subenlace_activo {
      color: var(--negro-complementario);
    }

    .submenu_separador {
      height: 3px;
      background-color: var(--color-principal);
      border: none;
      display: block;
      margin: 10px auto;
      width: 50%;
    }

    .subenlaces .cabecera__enlaces,
    .submenu_separador,
    .subenlace_principal {
      display: block;
    }

    .cabecera__enlaces a {
      color: var(--blanco);
      font-size: 20px;
    }

    .subenlace__secundario {
      background-color: transparent;
      width: 100%;
    }

    .subenlace__sesion {
      display: block;
    }

    .subenlace__sesion .claro-oscuro {
      margin: 20px;
    }

    .idiomas-usuario {
      display: none;
    }

    #fecha_subheader {
      text-align: center;
      display: block;
      font-size: 20px;
      color: var(--blanco);
    }

    .boton_cerrar {
      font-size: 5em;
      color: var(--blanco);
      display: inline-block;
    }

    .boton_cerrar:hover {
      color: var(--color-secundario);
    }

    .extras-acceso {
      font-size: 20px;
    }

    .extras-acceso:hover {
      color: var(--blanco);
    }

    /* SLIDER */

    .slider,
    .slider__imagen {
      width: 100%;
      height: 300px;
    }
    .slider__titulo {
      transform: translateY(-57%);
    }

    /* CONTENIDO */

    .contenido__principal,
    .contenido__principal-contenido {
      flex-direction: column;
      width: 100%;
      justify-content: center;
      margin: 0;
      align-items: center;
    }

    .contenido__principal-busqueda {
      text-align: center;
    }

    .contenido__principal-imagen {
      width: 100%;
      max-width: none;
      margin-bottom: 20px;
    }

    .contenido__principal-titulo,
    .contenido__principal-noticia,
    .contenido__principal-fecha,
    .contenido__principal-autor {
      text-align: center;
    }

    .contenido__principal-texto {
      padding: 0px;
    }

    .contenido__principal-contenido p,
    .contenido__principal-etiqueta {
      margin: 10px 0;
    }

    .contenido__principal-enlace {
      margin: 20px auto;
      width: 80%;
      text-align: center;
      display: block;
    }

    .carrusel__principal {
      width: 100%;
      overflow: hidden;
      display: flex;
      flex-direction: column;
      gap: 30px;
      margin: auto;
    }

    h2,
    .contacto__ubicacion,
    .contacto__telefono,
    .Wordpress {
      text-align: center !important;
    }

    .redes__lista {
      justify-content: center;
    }

    .contacto_bg {
      display: none;
    }

    .subenlaces .idioma__elegido {
      display: block;
      margin-bottom: 20px;
    }

    .subenlaces .idioma__elegido:hover .extras__idioma,
    .subenlaces .idioma__elegido:active .extras__idioma {
      position: relative;
      display: flex;
      gap: 20px;
      justify-content: center;
      margin: 20px;
    }

    /* COMENTARIOS */
    .comentario__nombre,
    .respuesta__nombre {
      text-align: left !important;
    }

    .respuesta {
      margin: 20px;
      width: calc(100% - 20px);
    }

    /* ASIDE */
    aside {
      width: 100%;
      max-height: 100%;
      overflow: scroll;
      overflow-y: hidden;
      margin: auto;
      border: none;
    }

    .boton-aside {
      display: none;
    }

    .noticias-aside {
      display: none;
    }

    .noticias {
      width: 100%;
      flex-direction: row;
      overflow-x: scroll;
    }

    .noticia {
      gap: 20px;
      width: 95vw;
    }

    .noticia__titulo {
      font-size: 2em;
      margin: 20px;
    }

    .noticia__imagen {
      max-width: 400px;
      display: block;
      margin: auto;
    }

    .etiquetas {
      margin: auto;
      width: 100%;
      display: flex;
      justify-content: center;
      gap: 10px;
    }

    /* FOOTER */
    footer {
      display: flex;
      justify-content: space-between;
    }

    .menu__footer,
    .footer__nav {
      justify-content: space-between;
      padding: 0 5px;
    }

    .footer__nav {
      flex-wrap: wrap;
      gap: 1em;
      margin: 0;
    }

    .contactos {
      flex-direction: column;
    }

    /* CONTACTO */
  }

  /* Móviles pequeños */
  @media (max-width: 768px) {
    /* CABECERA */

    .cabecera__buscador {
      display: none;
    }

    header > .cabecera__buscador {
      display: flex;
      width: calc(100% - 40px);
      margin: auto;
    }

    /* SLIDER */

    .slider {
      margin-top: 20px;
    }

    .slider__titulo {
      position: absolute;
      padding: 30px;
      transform: translateY(-0);
      width: 100%;
      font-size: 20px;
      width: 100%;
      height: auto;
      bottom: -30px;
      top: auto;
    }

    .slider__grupo:nth-child(odd) .slider__titulo {
      background: linear-gradient(0deg, var(--color-principal), transparent);
    }

    .slider__grupo:nth-child(even) .slider__titulo {
      background: linear-gradient(0deg, var(--color-secundario), transparent);
    }

    /* CONTENIDO */
    .contenido__principal-titulo,
    .contenido__principal-noticia {
      width: 100%;
      flex-wrap: wrap;
      font-size: 25px;
    }

    /* FOOTER */

    .menu__footer,
    .footer__nav {
      text-wrap: wrap;
    }
    footer {
      margin: 0;
    }

    .footer__nav,
    .footer_redes {
      flex-direction: column;
      padding: 0;
      align-items: center;
      justify-content: center;
      text-align: center;
    }

    .footer__nav li {
      text-align: right;
      width: 100%;
      text-wrap: wrap;
    }

    #fecha_footer,
    .footer__nav li a,
    .footer__nav li {
      font-size: 15px;
      text-align: right;
    }
  }

  .nav__redes {
    flex-direction: column;
  }

  .footer__redes {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    text-wrap: nowrap;
  }

  /* COOKIES */

  .cookies,
  #cookies-eu-banner {
    flex-direction: column;
    padding: 15px;
  }
  .botones-cookies button,
  #cookies-eu-reject,
  #cookies-eu-accept,
  #cookies-eu-settings {
    font-size: 10px;
  }
}