/*
? Fondos de color 
*/
::-webkit-scrollbar-track {
  background: var(--background);
}

::-webkit-scrollbar-thumb {
  background: var(--first);
  border-radius: 5px;
}

::-webkit-scrollbar-thumb:hover {
  background: var(--active);
}

body,
.section-contacts,
.portal-comunications,
.card-body,
.day-main,
.day-footer,
.container-modal {
  background-color: var(--white);
  transition: background-color 0.3s;
}

nav,
.navbar-container,
.section-sites,
.pleca,
.btn-return {
  background-color: var(--first);
  transition: background-color 0.3s;
}
.navbar-item:hover,
.navbar-container .navbar-link.select {
  background: #9b2247;
  transition: background-color 0.2s;
  color: #fff;
}
.materials-container {
  background-color: var(--background);
  transition: background-color 0.3s;
}

.materials-container {
  background-color: var(--backgroundlight);
}
.materials-triangle {
  border-bottom: 30px solid var(--backgroundlight);
}
.btn-portal,
.page-link:hover,
.page-link.active {
  background-color: var(--titles);
  transition: background-color 0.3s;
}
.loading {
  /* background: linear-gradient(to top, #b6d9d2, #f3f9f8); */
  background: #fff;
}
.container-information {
  background-color: var(--backgroundlight);
  transition: background-color 0.3s;
}
.page-link {
  background-color: transparent;
  transition: background-color 0.3s;
}
/*
? Fondo de Tarjetas
*/
.card-body:hover .link-minisite .card-footer {
  background: linear-gradient(to right, var(--backitem), #68a881);
}
/* Color de la flecha */
.card-body:hover .card-footer .footer-arrow,
.day:hover .day-footer .footer-arrow {
  filter: brightness(0) saturate(100%) invert(99%) sepia(1%) saturate(17%)
    hue-rotate(338deg) brightness(105%) contrast(100%);
}
.card-body .link-minisite .footer-arrow {
  filter: brightness(0) saturate(100%) invert(50%) sepia(33%) saturate(739%)
    hue-rotate(118deg) brightness(97%) contrast(77%);
}
.link-procedures .card-icon,
.link-info .card-icon {
  filter: brightness(0) saturate(100%) invert(11%) sepia(30%) saturate(5138%)
    hue-rotate(313deg) brightness(95%) contrast(98%);
}
/*
? Color en los textos
*/
.navbar-link-gob {
  color: var(--first);
  transition: color 0.2s;
}
.navbar-container .navbar-link.select {
  color: #fff;
  transition: color 0.2s;
}

.navbar-item .navbar-link {
  color: #fff;
}

.navbar-item-gob:hover .navbar-link-gob {
  color: #9b2247;
  transition: color 0.2s;
  /* #161a1d */
}
.number,
.day .day-main.event .day-number {
  color: var(--gold);
  transition: color 0.3s;
}
.navbar-link {
  color: var(--background);
  transition: color 0.2s;
}

.navbar-link-gob {
  color: #161a1d;
  transition: color 0.2s;
}
.footer-link,
.btn-return,
.btn-portal,
.btn-portal.active .number,
.btn-portal:hover .number,
.title,
.page-link:hover,
.page-link.active {
  color: var(--white);
  transition: color 0.3s;
}
.title-home-portal,
.title-portal,
.numbers,
.numbers,
.title-procedure,
.accordion-text,
.portal-text span,
.portal-text strong,
.text-materials,
.ask-portal,
.text-documents,
.text-contents,
.text-tutorships {
  color: var(--titles);
  transition: color 0.3s;
}
.contact-title,
.contact-title a {
  color: #9b2247;
  transition: color 0.3s;
}

.portal-text a,
.title-info,
.info-text,
.info-text span,
.opt-pac {
  color: var(--third);
  transition: color 0.3s;
}
.contact-text,
.text-link {
  color: var(--titles);
  transition: color 0.3s;
}
.answer,
.pac-text {
  color: var(--black);
  transition: color 0.3s;
}
.page-link {
  color: var(--second);
  transition: color 0.3s;
}
.day .day-number {
  color: var(--card-text);
  transition: color 0.3s;
}
/*
? Lineas del Footer
*/
.seccion-line {
  border-right: 0.2em var(--first) solid;
}

.btn-materials.active,
.btn-materials:hover {
  border: var(--titles) 2px solid !important;
}

.page-link,
.page-link.active {
  border: 2px solid var(--titles);
}
.portal-text tr:nth-child(even) {
  background-color: #f2f2f2;
}
.title-container-first {
  color: #808080;
}
.card:hover {
  background: #9b2247;
}
.title-container {
  color: #808080;
}
.gob-footer-container {
  background-color: var(--first);
  transition: background-color 0.3s;
}
.gob-footer-title {
  color: #fff;
  transition: color 0.3s;
}
