:root {
  --font-primary: Roboto, sans-serif;
  --font-secondary: Raleway, sans-serif;
  --color-primary: #94cd4b;
  --color-secundary: #062204;
  --color-selection: #eb9820;
  --color-texts: #1f1f1f;
  --color-title-bg: #444;
  --border: 1px solid #d5d5d5;
  --io-border-radius: 3px;
  --io-border-radius-5: 5px;
  --io-border-radius-2: 2px;
  --col-gap: 2%;
  --col-gap-2: 1.5%;
  --row-gap: 25px;
  --row-gap-2: 15px;
  --grid1: 100%;
  --grid2: calc((100% - (var(--col-gap) * 1)) / 2);
  --grid3: calc((100% - (var(--col-gap) * 2)) / 3);
  --grid4: calc((100% - (var(--col-gap) * 3)) / 4);
  --grid5: calc((100% - (var(--col-gap) * 4)) / 5);
  --grid6: calc((100% - (var(--col-gap) * 5)) / 6);
  --grid7: calc((100% - (var(--col-gap) * 6)) / 7);
}
.full-heigth {
  height: 100% !important;
}

/* TIPO HERO. */
.io-full-width {
  overflow: hidden;
  position: relative;
  margin-left: calc(50% - 50vw) !important;
  margin-right: calc(50% - 50vw) !important;
}

.field.field--name-field-imagen.field--type-image.field--label-hidden.field__item {
  max-height: fit-content;
}
.shadow-full-width {
  box-shadow: 0 0 0 100vmax #f9f9f9;
  clip-path: inset(0 -100vmax);
  background: #f9f9f9;
  border-top: 55px solid #f9f9f9;
  border-bottom: 50px solid #f9f9f9;
}
/********************* CAZ CUSTOM *********************/
.radius-custom1 {
  border-radius: var(--io-border-radius) 0px var(--io-border-radius) 0px;
}

/********************* CONTAINERS *********************/
.views-infinite-scroll-content-wrapper,
.bodygrid,
.gridwrapped > div .bodygrid,
.gridwrapped > div .bodygrid,
.gridwrapped > div .view-content,
.vista .view-content {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-content: center;
  column-gap: var(--col-gap);
  row-gap: var(--col-gap);
  justify-content: flex-start;
  align-items: stretch;
}

/********************* CONTAINERS SIZE *********************/
/* CHILDRENS */
.g1.bodygrid > .field__item,
.g1 .bodygrid > .field__item,
.g1 .bodygrid > div,
.g1 > .view-content .views-row,
.g1 > div .view-content .views-row {
  flex-basis: var(--grid1);
}

.g2.bodygrid > .field__item,
.g2 .bodygrid > .field__item,
.g2 .bodygrid > div,
.g2 > .view-content .views-row,
.g2 > div .view-content .views-row {
  flex-basis: var(--grid2);
}

.g3.bodygrid > .field__item,
.g3 .bodygrid > .field__item,
.g3 .bodygrid > div,
.g3 > .view-content .views-row,
.g3 > div .view-content .views-row {
  flex-basis: var(--grid3);
}

.g4.bodygrid > .field__item,
.g4 .bodygrid > .field__item,
.g4 .bodygrid > div,
.g4 > .view-content .views-row,
.g4 > div .view-content .views-row {
  flex-basis: var(--grid4);
}
.g5.bodygrid > .field__item,
.g5 .bodygrid > .field__item,
.g5 .bodygrid > div,
.g5 > .view-content .views-row,
.g5 > div .view-content .views-row {
  flex-basis: var(--grid5);
}

.g6.bodygrid > .field__item,
.g6 .bodygrid > .field__item,
.g6 .bodygrid > div,
.g6 > .view-content .views-row,
.g7 > div .view-content .views-row {
  flex-basis: var(--grid6);
}
.g7.bodygrid > .field__item,
.g7 .bodygrid > .field__item,
.g7 .bodygrid > div,
.g7 > .view-content .views-row,
.g7 > div .view-content .views-row {
  flex-basis: var(--grid7);
}

/********************* MAIN NAVBAR  *********************/
.container.d-flex {
  max-width: 1310px;
}

.gin--horizontal-toolbar.user-logged-in .navbar {
  top: 53px;
}

.navbar-toggler {
  color: var(--color-primary);
  border: none;
}
.navbar-toggler-icon {
  background-image: url("/themes/custom/io_theme/images/icons/btn-toggle-green.svg");
  width: 2em;
  height: 2em;
}
nav.navbar.navbar-expand-lg {
  box-shadow: 0px 6px 5px -2px rgb(0 0 0 / 18%);
  background: #ffffffe3;
}

a.nav-link,
span.nav-link.dropdown-toggle {
  color: #94cd4b !important;
  font-weight: bold;
}

body .navbar {
  position: fixed;
  left: 0;
  right: 0;
  top: 0px;
  background: #ffffff;
  backdrop-filter: blur(10px);
  z-index: 99;
  padding: 0 !important;
}

.iomenu span,
.navbar-brand a.site-title,
.iomenu a {
  color: var(--color-texts);
}

.site-logo img {
  height: 60px;
  margin: 0 0.7rem 0 0;
}

.navbar-brand .site-title {
  display: block;
  font-size: 18px;
  text-transform: none;
  font-weight: 400;
  line-height: normal;
  width: 200px;
  letter-spacing: normal;
}

header .navbar > .container-fluid {
  width: 1260px;
  max-width: 100vw;
  margin: 0 auto !important;
}
/*
ul.dropdown-menu {
  background: var(--color-primary);
  border-color: transparent;
}
*/

ul.dropdown-menu {
  background: white;
  border-color: transparent;
  color: var(--color-primary);
}

.dropdown-item:hover,
.dropdown-item:focus {
  color: var(--gin-color-primary-active);
  background: var(--gin-bg-item-hover);
  box-shadow:
    0 0 0 1px var(--gin-color-focus-border),
    0 0 0 4px var(--gin-color-focus);
}
/*
.dropdown-item:hover,
.dropdown-item:focus {
  background-color: var(--color-secundary) !important;
}
*/
.dropdown-item.is-active {
  background-color: transparent !important;
}
/********************* GENERAL  *********************/

html {
  scroll-padding-top: 80px;
  text-rendering: optimizeLegibility;
  word-break: break-word;

  scrollbar-color: var(--color-primary) #ffffff;
  scrollbar-width: thin;
}

div {
  scroll-margin-top: 80px;
}

::-webkit-scrollbar {
  width: 6px;
}

::selection {
  background: var(--color-selection) !important;
  color: white;
}

::marker {
  color: var(--color-primary);
}

body {
  font-family: Roboto, sans-serif;
  color: var(--color-texts);
  background-color: #ffffff;
  text-align: left;
  word-wrap: break-word;
  overflow-wrap: break-word;
}

h1,
h2,
h3 {
  color: var(--color-primary);
}

h1 {
  font-size: 44px;
  font-weight: bold;
}
h2 {
  font-size: 35px;
  font-weight: bold;
  margin-block: 0px 10px;
}
h3 {
  font-size: 28px;
  font-weight: 300;
}

/********************* IMG  *********************/
img.img-fluid {
  width: 100%;
  height: auto;
  border-radius: var(--io-border-radius);
}

/********************* ANCOR  *********************/
a[target="download"]:hover {
  background: var(--color-selection) !important;
}

a {
  color: var(--color-primary);
  text-decoration: none !important;
  -webkit-transition: ease all 0.5s;
  -o-transition: ease all 0.5s;
  transition: ease all 0.5s;
}

a:target {
  color: #99cc33 !important;
  font-weight: bold;
}

a[target="download"] {
  position: relative;
  display: inline-block;
  align-items: flex-end;
  flex-wrap: nowrap;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  gap: 5px;
  width: fit-content;
  max-width: 100%;
  background-color: #7b7b7b;
  border: 0 solid #e2e8f0;
  border-radius: var(--io-border-radius);
  box-sizing: border-box;
  color: #ffffff;
  cursor: pointer;
  font-size: 17px;
  font-weight: 500;
  text-transform: uppercase;
  line-height: 1;
  padding: 10px 20px 10px 30px;
  text-transform: none;
  text-decoration: none #0d172a solid;
  text-decoration-thickness: auto;
  box-shadow: 0px 1px 2px rgba(166, 175, 195, 0.25);
  user-select: none;
  touch-action: manipulation;
  transition: ease 0.75s all;
}

a[target="download"] {
  margin: 0;
  background: var(--color-title-bg);
  text-align: center;
  width: auto;
}

a[target="download"]:hover {
  color: white;
  background: var(--color-primary);
}

a[target="download"]:before {
  content: "";
  display: inline-block;
  position: absolute;
  left: 8px;
  top: 52%;
  transform: translateY(-50%);
  width: 20px;
  height: 20px;
  filter: invert();
  background-image: url("/themes/custom/io_theme/images/icons/download.png");
  background-repeat: no-repeat;
  background-size: contain;
}

/***************************** SITE ****************************************/
/* REGIONES */
.dialog-off-canvas-main-canvas {
  width: 1330px;
  margin: 0 auto;
  margin-top: 30px;
  max-width: 100%;
}

/**********************  REGIONS AND DIV ****************************/
.region.region-header > div,
.region.region-content > div {
  margin: 75px auto;
}

/**********************  ALL BLOCKS ****************************/
div#block-iotheme-miembros > h2,
div#block-iotheme-views-block-publicaciones-block-1 > h2,
div#block-iotheme-views-block-actividades-academicas-block-1 > h2 {
  font-size: 35px;
}

/**********************  BIENVENIDOS BLOCK *********************/
#block-io-theme-bienvenidosalaucth {
  text-align: center;
  width: 100%;
  margin-block: 100px;
  margin-top: -75px;
}

#block-io-theme-bienvenidosalaucth.shadow-full-width {
  border-top: 120px solid #f9f9f9;
  border-bottom: 100px solid #f9f9f9;
}

#block-io-theme-bienvenidosalaucth h1 {
  margin-top: 60px;
}
#block-io-theme-bienvenidosalaucth h3 {
  border-radius: var(--io-border-radius);
  font-weight: bolder;
  margin: 0 auto;
  max-width: 100%;
  padding: 3px 15px;
  width: max-content;
}

/********************* UCTH DESCRIPTION BLOCK *********************/
.ucth-description {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  column-gap: 10px;
  align-items: center;
}

.ucth-description img {
  width: 400px;
  max-width: 100%;
  height: auto;
  border-radius: var(--io-border-radius);
}

.ucth-description h2 {
  flex-basis: 100%;
}

.ucth-description p {
  flex: 1;
  font-size: 20px;
}

/********************* ACTIVIDAD ACADÉMICA BLOCK *********************/
#actividad-academica {
  box-shadow: 0 0 0 100vmax #f9f9f9;
  clip-path: inset(0 -100vmax);
  background: #f9f9f9;
  border-top: 45px solid #f9f9f9;
  border-bottom: 65px solid #f9f9f9;
}

.view-actividades-academicas .novedadwrapped h2 {
  font-size: 24px;
  /*margin-top: 10px;*/
}
.field.field--name-node-link.field--type-ds.field--label-hidden.field__item {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: flex-end;
}

.view-actividades-academicas .field--name-node-link.field__item a {
  background: var(--color-title-bg);
  padding: 8px 15px;
  border-radius: var(--io-border-radius);
  color: white;
  text-transform: uppercase;
}

.view-actividades-academicas .novedadwrapped {
  display: flex;
  flex-flow: column nowrap;
  gap: 10px;
  width: 100%;
  max-width: 100%;
  background: #ffffff;
  box-shadow: 0 12px 32px rgba(38, 39, 39, 0.12);
  border-radius: var(--io-border-radius);
  position: relative;
}
.view-actividades-academicas .novedadwrapped img {
  border-bottom-right-radius: 0;
  border-bottom-left-radius: 0;
}

.view-actividades-academicas .col2 {
  display: flex;
  flex-flow: row wrap;
  align-items: stretch;
  gap: 10px;
  padding: 0px 10px 10px;
  height: 100%;
}
.view-actividades-academicas .field--name-node-link.field__item a:hover {
  color: white;
  border-bottom: none;
  background: #eb9820;
}
.texts .field--name-field-cuerpo {
  display: box;
  display: -webkit-box;
  line-clamp: 10; /* Change this integer to your desired line count */
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 10; /* Change this integer to your desired line count */
  overflow: hidden;
}
/********************* NOVEDADES NODE *********************/
.node--type-actividad-academica.node--view-mode-full .novedadwrapped {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: 15px;
}

.node--type-actividad-academica.node--view-mode-full
  .novedadwrapped
  .field--name-field-cuerpo {
  flex-basis: 100%;
}
.node--type-actividad-academica.node--view-mode-full
  .novedadwrapped
  .gp-date-and-share {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: flex-start;
  flex: 6;
}
.node--type-actividad-academica.node--view-mode-full .novedadwrapped .col2 {
  flex: 4;
}
.node--type-actividad-academica.node--view-mode-full
  .novedadwrapped
  .field--name-node-title {
  margin-top: 20px;
}

.node--type-actividad-academica.node--view-mode-full .novedadwrapped h1 {
  font-size: 60px;
  margin-left: -3px;
}
.social-sharing-buttons {
  margin: 10px 0 0 -10px;
}

/********************* PROTOCOLOS BLOCK *********************/
.views-view-responsive-grid.views-view-responsive-grid--horizontal {
  row-gap: 35px;
}
table {
  border-collapse: separate;
  border-spacing: 0;
  border-radius: var(--io-border-radius);
  overflow: hidden;
  border: 1px solid #ccc;
}

tr:first-child th:first-child {
  border-top-left-radius: var(--io-border-radius);
}
tr:first-child th:last-child {
  border-top-right-radius: var(--io-border-radius);
}

tr:last-child td:first-child {
  border-bottom-left-radius: var(--io-border-radius);
}
tr:last-child td:last-child {
  border-bottom-right-radius: var(--io-border-radius);
}

td.views-field.views-field-title:before {
  min-width: 45px;
}

td.views-field.views-field-title {
  display: flex;
  align-items: center;
  min-width: 200px;
}
tr {
  display: flex;
  flex-wrap: wrap;
  min-width: 300px;
}

td {
  flex: 1;
}

td.views-field.views-field-field-file-protocol {
  display: flex;
  flex-direction: column;
  justify-content: center;
  flex: 0.2;
  min-width: 220px;
  align-items: flex-end;
}

.view-protocolos td.views-field.views-field-title:before {
  content: "";
  display: inline-block;
  position: relative;
  margin-right: 7px;
  width: 30px;
  height: 30px;
  background-image: url("/themes/custom/io_theme/images/icons/icon-pdf.svg");
  background-repeat: no-repeat;
  background-size: contain;
  filter: invert(67%) sepia(76%) saturate(400%) hue-rotate(35deg)
    brightness(95%) contrast(92%);
}

.bs_grid.ck-widget .col-12.col-lg-8 {
  flex: 0.8;
}

.bs_grid.ck-widget .col-12.col-lg-4 {
  flex: 0;
}

/********************* MIEMBROS BLOCK *********************/
#miembros {
  margin-top: 45px;
}
/*
#miembros .shadow-full-width {
  border-top: 120px solid #f9f9f9;
  border-bottom: 100px solid #f9f9f9;
}
*/
#miembros img {
  border-radius: var(--io-border-radius);
  height: auto;
  max-width: 190px;
  width: 100%;
}
#miembros .colorizer-tag {
  border-radius: var(--io-border-radius);
  background: #94cd4b;
  padding: 0 10px;
  color: #ffffff;
}

.block-inner-miembros {
  display: flex;
  flex-direction: column;
  gap: 60px;
}

.principales.g5.g2-m.bodygrid {
  margin-bottom: -30px;
}
/**************FOOTER BLOCK*********************/

.region.region-footer {
  box-shadow: 0 0 0 100vmax #f9f9f9;
  clip-path: inset(0 -100vmax);
  background: #f9f9f9;
  border-top: 55px solid #f9f9f9;
  border-bottom: 40px solid #f9f9f9;
  margin-bottom: -40px;
}
.total-footer {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: 20px;
  justify-content: space-between;
}

.total-footer img {
  max-width: 160px;
  height: auto;
  filter: brightness(1.01);
  max-height: 70px;
  width: auto;
  flex: 1;
}

.first-footer svg {
  min-width: 20px;
}

.second-footer {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  gap: 15px;
  justify-content: flex-end;
}
.second-footer > p {
  flex-basis: 15%;
}

.total-footer a {
  color: var(--color-texts);
}
.total-footer a:hover {
  color: var(--color-primary);
}
/**************************** GESTIÓN *********************************/
/***************************** Splide ***********************************/

#io-theme-slider-mobile-hero {
  display: none;
}
#io-theme-slider-desktop-hero {
  position: relative;
}
button.splide__toggle.is-active {
  display: none;
}

#io-theme-slider-desktop-hero .splide__pagination li,
#io-theme-slider-mobile-hero .splide__pagination li {
  margin: 8px;
}

#io-theme-slider-desktop-hero .splide__pagination,
#io-theme-slider-mobile-hero .splide__pagination {
  bottom: 10px;
  display: flex;
  justify-content: end;
  left: auto;
  margin: 0;
  padding: 0;
  position: absolute;
  right: 1%;
  transform: translateX(-1%);
  width: max-content;
  z-index: 10;
}

#io-theme-slider-desktop-hero .splide__pagination__page,
#io-theme-slider-mobile-hero .splide__pagination__page {
  width: 12px;
  height: 12px;
  border: 0;
  background: color-mix(in srgb, var(--color-primary) 35%, transparent);
  opacity: 1;
}

#io-theme-slider-desktop-hero .splide__pagination__page.is-active,
#io-theme-slider-mobile-hero .splide__pagination__page.is-active {
  width: 15px;
  height: 15px;
  background: var(--color-primary);
}
