body {
  font-family: 'Vinci-Sans', sans-serif;
}

h1,
.h1,
.fs-1,
h2,
.h2,
.fs-2,
h3,
.h3,
.fs-3,
h4,
.h4,
.fs-4,
h5,
.h5,
h6,
.h6 {
  font-family: "Poppins", sans-serif;
  font-weight: 600;
}

.texto-azul-osc {
  color: #052145;
}

.texto-azul-claro {
  color: #52C1DD;
}

.bg-azul-osc {
  background-color: #052145;
}

.bg-azul-claro {
  background-color: #52C1DD;
}

.bg-gris-claro {
  background-color: #F0F3F7;
}

.bg-verde {
  background-color: #369546;
}

.over-bg-azul-osc:hover,
.over-bg-gris-claro:hover {
  background-color: #52C1DD !important;
}

.over-bg-blanco:hover {
  background-color: #fff;
  color: #052145 !important;
}

.borde-azul-osc {
  border-color: #052145 !important;
}

.borde-azul-claro {
  border-color: #52C1DD !important;
}

.null-after::after {
  content: none !important;
}

.btn-50-50 {
  width: 50px;
  height: 50px;
  transition: all .5s;
}

.btn-60-60 {
  width: 60px;
  height: 60px;
}

.btn-80-80 {
  width: 80px;
  height: 80px;
}

.line-bottom {
  height: 5px;
  opacity: 1;
  border: 0;
  width: 100px;
  margin: 1rem auto;
  border-radius: 10px;
  transition: all .5s;
}

.fs-big {
  font-size: 5.5rem;
}

.fs-small {
  font-size: .9rem !important;
}

.rounded-40 {
  border-radius: 40px !important;
}

.rounded-20 {
  border-radius: 20px !important;
}

section.tabs {
  position: sticky;
  top: 0px;
  /* Ajusta según la altura del menú */
  z-index: 999;
  background-color: #fff;
  border-color: #052145 !important;
}

.menuuf {
  position: fixed !important;
  top: 0px !important;
  /* Ajusta según la altura del menú */
  width: 100%;
  z-index: 999 !important;
}

section.tabs>a:hover {
  border-color: #52C1DD !important;
}

section#ubicacin_uf>div:first-child {
  padding-top: 5.5rem;
}

.bg-degrazul {
  background: rgb(244, 245, 248);
  background: -moz-linear-gradient(0deg, rgba(244, 245, 248, 1) 0%, rgba(244, 245, 248, 1) 35%, rgba(247, 248, 250, 1) 66%, rgba(255, 255, 255, 1) 100%);
  background: -webkit-linear-gradient(0deg, rgba(244, 245, 248, 1) 0%, rgba(244, 245, 248, 1) 35%, rgba(247, 248, 250, 1) 66%, rgba(255, 255, 255, 1) 100%);
  background: linear-gradient(0deg, rgba(244, 245, 248, 1) 0%, rgba(244, 245, 248, 1) 35%, rgba(247, 248, 250, 1) 66%, rgba(255, 255, 255, 1) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#f4f5f8", endColorstr="#ffffff", GradientType=1);
}

div#glosarios-tab {
  width: 50%;
  height: 400px;
}

div#glosarios-tabContent {
  width: 50%;
  height: auto !important;
}

div#glosarios-tab button {
  width: 85%;
  background-color: transparent;
}

div#glosarios-tab button:hover,
div#glosarios-tab button.active {
  background-color: #052145;
  color: #fff;
  text-decoration: underline;
}

.pg-claro {
  --color-noactivo: #fff;
  --color-activo: #52C1DD;
}

.pg-oscuro {
  --color-noactivo: #052145;
  --color-activo: #52C1DD;
}

.swiper-pagination-bullet {
  width: 20px;
  border-radius: 20px;
  height: 5px;
  transition: all .5s;
  background-color: var(--color-noactivo);
  opacity: 1;
}

.swiper-pagination-bullet.swiper-pagination-bullet-active {
  width: 45px;
  background-color: var(--color-activo);
}

#mega-menu-wrap-main-menu {
  margin-right: 80px !important;
}

div.ufuncional>section,
div.pservicios>section {
  scroll-margin-top: 210px;
  /* Ajusta según la altura del header */
}

#obras_uf img.vmapa {
  top: 9%;
  right: -12rem;
  width: 65%;
}

#glosario_uf img.vmapa {
  top: -4%;
  right: -23%;
  width: 54%;
  transform: rotate(45deg);
}

#senalizacion_uf img.vmapa {
  width: 57%;
  top: 7%;
  left: -21%;
  transform: rotate(41deg);
}

#beneficios_uf img.vmapa {
  right: -16%;
  top: 10%;
  transform: rotate(236deg);
  width: 55%;
}

#guia_uf img.vmapa {
  top: 0;
  left: -23%;
  width: 57%;
  transform: rotate(229deg);
}

#avances_uf .swiper-pagination,
#guia_uf .swiper-pagination {
  top: 90%;
}

#lneas_emergencia .vmapa {
  width: 51%;
  top: 12%;
  left: -10%;
  max-width: 700px;
}

#lneas_emergencia .imagenes img:first-child {
  left: 20%;
}

.imagenes .imglibre {
  width: 25%;
}

#lneas_emergencia .imagenes img:nth-child(2) {
  right: 20%;
  top: 16%;
}

#lneas_emergencia .imagenes img:last-child {
  left: 28%;
  top: 40%;
}

#lneas_emergencia a>img {
  width: 3.5rem;
}

#lneas_emergencia a {
  width: 75%;
  border-radius: 1.5rem !important;
}

.carrusel4min h2:hover {
  cursor: pointer;
  background-color: #52C1DD !important;
  border-color: #52C1DD !important;
}

.carrusel4min h2 {
  transition: all .5s;
}

.carrusel4min .swiper-slide-thumb-active h2 {
  background-color: #052145 !important;
  color: #fff;
}

.carrusel4mini .swiper-button-prev {
  left: 93% !important;
}

.carrusel4mini {
  padding-right: 7rem !important;
}

#nuestros_equipos .vmapa {
  right: -20%;
  top: 20%;
  width: 60%;
}

.descrip-der {
  width: 360px;
  right: 3%;
  top: 50%;
  transform: translate(-25%, -50%);
}

.descrip-izq {
  width: 360px;
  left: 3%;
  top: 50%;
  transform: translate(25%, -50%);
}

.penlavia .video {
  height: 22rem;
}

.video strong {
  font-size: 1.5rem;
}

.video h2 {
  font-size: 6rem;
  font-weight: 800;
}

.item.bg-azul-osc h2,
.item.bg-azul-osc strong {
  color: #52C1DD;
}

.item h2 {
  font-size: 4rem;
  font-weight: 700;
  margin-bottom: .1rem;
}

.frailejon.item>div>div>h2 {
  font-size: 2.4rem;
}

.item strong {
  font-size: 1.5rem;
  line-height: 1.5rem;
}

.item img {
  width: 20%;
}

.item p {
  margin: 0;
  line-height: 1.2rem;
  margin-bottom: 1rem;
}

.unidad .numero {
  width: 3rem;
  height: 3rem;
}

.unidad:nth-child(1) .numero {
  background-color: #516680;
  color: #fff;
}

.unidad:nth-child(2) .numero {
  background-color: #E8E100;
  color: #052145;
}

.unidad:nth-child(3) .numero {
  background-color: #369546;
  color: #fff;
}

.unidad:nth-child(4) .numero {
  background-color: #E25183;
  color: #fff;
}

.unidad:nth-child(5) .numero {
  background-color: #095A9F;
  color: #fff;
}

.unidad:nth-child(6) .numero {
  background-color: #7C0E67;
  color: #fff;
}

.unidad:nth-child(7) .numero {
  background-color: #FA892A;
  color: #fff;
}

.unidad:nth-child(8) .numero {
  background-color: #52C1DD;
  color: #fff;
}

.unidad:nth-child(9) .numero {
  background-color: #052145;
  color: #fff;
}

.unidad a:hover .line-bottom {
  width: 100%;
}

#beneficios_via .swiper-slide img {
  width: 30%;
}

.bloques>div:nth-child(even) {
  flex-direction: row-reverse;
}

.bloques .texto {
  max-height: 25rem;
  overflow: scroll;
  scrollbar-width: thin;
  /* Para Firefox */
  scrollbar-color: #052145 #ffffff00;
}

.bloques .texto::-webkit-scrollbar {
  width: 8px;
  /* Ancho de la barra */
}

.bloques .texto::-webkit-scrollbar-thumb {
  background: #052145;
  /* Color de la barra de desplazamiento */
  border-radius: 4px;
}

.franja-azul h2 {
  color: #52C1DD;
  font-weight: 700;
}

.informativo p {
  margin-right: 3rem;
}

.descrip-der h2,
.descrip-izq h2 {
  font-size: 2.3rem;
  font-weight: 700;
}

.descrip-der h3,
.descrip-izq h3 {
  font-weight: 700;
}

.multimedia iframe {
  height: 300px;
}

.banner .masc,
.swiper-slide .masc {
  background: rgb(244, 245, 248);
  background: -moz-linear-gradient(180deg, rgba(244, 245, 248, 0) 0%, rgba(0, 0, 0, 0.6152836134453781) 100%);
  background: -webkit-linear-gradient(180deg, rgba(244, 245, 248, 0) 0%, rgba(0, 0, 0, 0.6152836134453781) 100%);
  background: linear-gradient(180deg, rgba(244, 245, 248, 0) 0%, rgba(0, 0, 0, 0.6152836134453781) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#f4f5f8", endColorstr="#000000", GradientType=1);
}

.banner .vmapa {
  width: 100%;
  transform: rotate(280deg);
  right: -45%;
  top: -21%;
}

.tipodesc h2 {
  font-weight: 700;
}

.bloques .texto h2 {
  font-weight: 700;
  margin-bottom: 3rem;
}

.descriptivo h2 {
  font-weight: 700;
  font-size: 3rem;
}

.numero {
  width: 7rem;
  height: 7rem;
}

#cronograma .numero h2::first-line {
  font-size: 3.5rem;
  line-height: 3rem;
}

img.v404 {
  transform: translate(20%, -15%);
  top: -6rem;
}

.ptrabaja .correo {
  width: 85%;
}

.ptrabaja .correo img {
  background-color: #52C1DD;
  border-radius: 100%;
  padding: .5rem;
}

.ptrabaja .correo>div:first-child {
  margin: 0 2rem 0 0;
}

.recuerda>div:last-child {
  padding-left: 4rem;
}

.recuerda h2 {
  font-weight: 700;
  font-size: 4rem;
}

.recuerda h3 {
  font-weight: 600;
}

.ptrabaja .accordion-body h2 {
  font-weight: 700;
}

.acordeon a {
  color: #fff;
  background-color: #052145;
  border-radius: 40px;
  font-size: 1rem;
  padding: .8rem 1rem;
  font-weight: 700;
  -webkit-box-shadow: var(--bs-box-shadow) !important;
  box-shadow: var(--bs-box-shadow) !important;
  transition: all .5s;
}

.acordeon a:hover {
  background-color: #52C1DD !important;
  padding: .8rem .8rem;
}

.redes>span {
  width: 40%;
}

.redes>div {
  width: 60%;
}

footer .vmapa {
  right: -24%;
  width: 53%;
  transform: rotate(-17deg);
}

footer .menu-footer ul li {
  margin-bottom: 1rem;
}

#presentacion .vmapa {
  top: -25%;
  left: -25%;
  width: 63%;
  transform: rotate(45deg);
}

#infraestructura .vmapa {
  bottom: -36%;
  right: -25%;
  width: 70%;
}

#impacto .vmapa {
  top: 0;
  left: -20%;
  width: 55%;
  transform: rotate(-7deg);
}

#impacto .vmapa2 {
  width: 50%;
  right: -23%;
  bottom: 0;
  transform: rotate(170deg);
}

.franja-azul .vmapa {
  top: -55%;
  width: 60%;
  left: -30%;
}

.accordion .accordion-header img {
  width: 3rem;
}

.detalles .row h2 {
  font-size: 1.5rem;
  font-weight: 700;
  color: #52C1DD;
}

li.mega-noticias a {
  flex-flow: row-reverse;
}

li.mega-noticias a::before {
  transform: rotate(-35deg);
  font-size: .8rem !important;
}

.ufuncional .swiper-button-next,
.ufuncional .swiper-button-prev {
  background-color: #fff;
}

.ufuncional .swiper-button-next {
  right: 2rem;
}

.ufuncional .swiper-button-prev {
  left: 2rem;
}

.ufuncional .carrusel2 .swiper-slide {
  height: auto;
  display: flex;
  align-items: center;
  flex-direction: column;
  justify-content: center;
}

#beneficios_via .vmapa {
  right: -22rem;
  transform: rotate(178deg);
  width: 50%;
  top: 0;
}

.swiper-slide .masc {
  width: 100%;
  height: 100%;
  position: absolute;
}

#en_imagenes .vmapa {
  top: 50%;
  left: -26rem;
  width: 55%;
  transform: rotate(182deg);
}

#avances .vmapa {
  top: 25%;
  left: -19rem;
  width: 52%;
  transform: rotate(240deg);
}

#unidades_funcionales .vmapa {
  width: 47%;
  right: -16rem;
  top: 10%;
  transform: rotate(174deg);
}

#en_imagenes .vmapa2 {
  top: -33%;
  left: -23rem;
  width: 39vw;
  max-width: 40vw;
  transform: rotate(271deg);
}

.preguntas .informativo img.vmapa {
  left: -28%;
  width: 43vw;
  top: -88%;
  transform: rotate(-24deg);
  max-width: 45vw;
}

.acordeon .vmapa {
  right: -44%;
  top: -81%;
  width: 70%;
}

.guiapp .vmapa {
  top: -50%;
  right: -49%;
  width: 69%;
  transform: rotate(72deg);
}

.redes .vmapa {
  top: -27%;
  right: -44%;
  transform: rotate(155deg);
  width: 70%;
}

.breadcrumb a {
  color: #ffff;
}

#videoContainer {
  margin-top: 20px;
  transition: opacity 0.5s ease-in-out;
}

.carrusel9Swiper .swiper-slide {
  cursor: pointer;
  display: inline-block;
}

#videoText {
  margin-top: 10px;
  font-size: 18px;
  font-weight: bold;
  transition: opacity 0.5s ease-in-out;
}

.flotante {
  z-index: 1000;
  cursor: pointer;
}

.floating-clima {
  position: fixed;
  top: 35.4%;
  z-index: 9;
  transition: .5s;
  right: -100%;
}

.floating-clima span.close {
  cursor: pointer;
}

#gobierno .vmapa {
  bottom: -20vw;
  width: 45vw;
  max-width: 50vw;
  left: 44vw;
}

#estructura .vmapa {
  left: -33vw;
  top: -4vw;
  max-width: 60vw;
  transform: rotate(45deg);
}

#informes.franja-azul .vmapa {
  top: -2vw !important;
  width: 50vw;
  left: 72%;
  max-width: 52vw;
}

#conflictos .vmapa {
  left: -15vw;
  max-width: 50vw;
  width: 50vw;
  top: 0vw;
}

#conflictos .vmapa2 {
  right: -13vw;
  bottom: 4vw;
  max-width: 50vw;
  width: 45vw;
}

#estados_financieros.franja-azul .vmapa {
  top: 29vw;
  max-width: 52vw;
  left: -18vw;
  width: 50vw;
}

#manual_sacrilaft .vmapa {
  right: -10vw;
  width: 42vw;
  max-width: 45vw;
  bottom: -18vw;
}

.descriptivo .vmapa {
  right: -450px;
  width: 700px;
  max-width: 65vw;
  top: -22px;
}

.carrusel .vmapa {
  width: 800px;
  left: -120px;
}

.doblebq .vmapa {
  left: -155px;
}

.doblebq .vmapa2 {
  right: -500px;
  top: 50%;
}

#bloque_descriptivo .vmapa2 {
  left: -300px;
  transform: rotate(305deg);
  width: 800px;
  top: 300px;
}

#cronograma .vmapa {
  right: -300px;
  width: 800px;
  transform: rotate(196deg);
  top: 7%;
}


#beneficios>div:nth-child(2) {
  padding: 0 15vw !important;
}

#beneficios .vmapa {
  top: 50px;
  left: -400px;
  width: 800px;
  transform: rotate(224deg);
}

/* Ajustes con consultas de medios para pantallas mas pequeÃƒÂ±as */
@media (max-width: 768px) {

  .fs-xs-1 {
    font-size: calc(1.375rem + 1.5vw) !important
  }

  .fs-xs-2 {
    font-size: calc(1.325rem + .9vw) !important
  }

  .fs-xs-3 {
    font-size: calc(1.3rem + .6vw) !important
  }

  .fs-xs-4 {
    font-size: calc(1.275rem + .3vw) !important
  }

  .fs-xs-5 {
    font-size: 1.25rem !important
  }

  .fs-xs-6 {
    font-size: 1rem !important
  }

  #lneas_emergencia a {
    width: 100%;
    border-radius: 1.5rem !important;
  }

  .carrusel4mini {
    padding-right: 0rem !important;
  }

  .carrusel4mini .swiper-button-prev {
    left: inherit !important;
  }

  .descrip-der,
  .descrip-izq {
    width: 100%;
    right: 0;
    top: 0;
    transform: translate(0%, 0%);
    position: relative !important;
  }

  .penlavia .video {
    height: auto;
  }

  .descrip-der h2,
  .descrip-izq h2,
  .descriptivo h2 {
    font-size: calc(1.325rem + .9vw) !important;
    font-weight: 700;
  }

  .informativo p {
    margin-right: 1rem;
  }

  #beneficios>div:nth-child(2) {
    padding: 0 .25rem !important;
  }

  .ptrabaja .correo {
    width: 100%;
  }

  .recuerda>div:last-child {
    padding-left: 0;
  }

  .recuerda h2 {
    font-size: 3rem;
  }

  .btn-30-30 {
    width: 30px;
    height: 30px;
    transition: all .5s;
  }

  .seccion-menu .logo {
    width: 70%;
  }

  header>div:first-child {
    display: none !important;
  }

  .swiperSliderM .swiper-slide>div {
    flex-direction: column-reverse;
  }

  .bannergen1 .btn-50-50 {
    z-index: 999;
    top: 44%;
    background-color: #52c1dd;
  }

  .bannergen1 .btn-50-50.swiper-button-next {
    right: 1rem;
  }

  .bannergen1 .btn-50-50.swiper-button-prev {
    left: 1rem;
  }

  .botones {
    padding: 2rem 1rem;
  }

  section.mapa>div {
    padding: 0 2rem;
  }

  section.\35 0-50 {
    padding: 0 1rem;
  }

  section.guiapp {
    padding: 0 1rem;
  }

  section.guiapp .row>div:last-child {
    padding: 2rem !important;
  }

  section.rutaturistica>div:first-child {
    padding: 2rem 1rem !important;
  }

  .rutaturistica .subtitulo>p {
    width: 100%;
    padding: 0 !important;
    font-size: 1.2rem !important;
  }

  .rutaturistica .subtitulo {
    flex-direction: column;
    align-items: flex-start !important;
    justify-content: flex-start !important;
    padding: 0 2rem;
  }

  .rutaturistica .subtitulo>a {
    font-size: 1.2rem !important;
  }

  .carrusel10 img {
    height: auto;
  }

  .rutaturistica .sliderruta {
    padding: 0 1rem !important;
  }

  .carrusel10 .textos {
    top: 80%;
  }

  .unidad .numero {
    width: auto;
    height: auto;
  }

  .unidad .numero>h2 {
    padding: 2px 10px;
  }

  .redes>div {
    padding: 0 2rem !important;
  }

  .redes>div .row>div:first-child {
    padding: 0 !important;
    margin-bottom: 2rem;
  }

  .redes .row>div:last-child {
    margin-top: 2rem;
  }

  div#glosarios-tab {
    width: 100%;
    height: auto;
  }

  div#glosarios-tabContent {
    width: 100%;
    height: auto !important;
  }

  footer>section.redes {
    padding: 2rem 1rem !important;
    flex-direction: column;
  }

  .footer .redes>span {
    width: 100%;
    padding: 0 !important;
    text-align: center;
  }

  footer .redes>div {
    width: 100%;
    padding: 1rem 0 0 !important;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
  }

  footer .redes>div img {
    width: 100%;
  }

  footer .redes>div a {
    margin-bottom: 1rem;
  }

  .carrusel10 img {
    height: auto;
  }

  .rutaturistica .sliderruta {
    padding: 0 1rem !important;
  }

  .carrusel10 .textos {
    top: 72%;
  }

  .redes>div {
    padding: 0 2rem !important;
  }

  .redes>div .row>div:first-child {
    padding: 0 !important;
    margin-bottom: 2rem;
  }

  .redes .row>div:last-child {
    margin-top: 2rem;
  }

  footer>section.redes {
    padding: 2rem 1rem !important;
    flex-direction: column;
  }

  .footer .redes>span {
    width: 100%;
    padding: 0 !important;
    text-align: center;
  }

  footer .redes>div {
    width: 100%;
    padding: 1rem 0 0 !important;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
  }

  footer .redes>div img {
    width: 100%;
  }

  footer .redes>div a {
    margin-bottom: 1rem;
  }

  footer section.copy {
    flex-direction: column;
    padding-top: 3rem !important;
  }

  footer section.copy div {
    width: 100%;
    text-align: center;
    margin-bottom: 2rem;
  }

  footer section.copy p {
    text-align: center;
  }

  footer section.copy a {
    text-align: center;
    width: 100%;
    margin: 1rem 0;
  }

  footer section.copy a u {
    font-size: 1.5rem !important;
  }

  #mega-menu-wrap-main-menu {
    margin-right: 0px !important;
  }

  #mega-menu-wrap-main-menu #mega-menu-main-menu>li.mega-menu-item>a.mega-menu-link {
    align-items: center;
    width: 100%;
  }

  #mega-menu-wrap-main-menu #mega-menu-main-menu>li.mega-menu-item {
    display: flex;
    flex-direction: column;
  }

  #mega-menu-wrap-main-menu #mega-menu-main-menu>li.mega-menu-item.mega-noticias>a.mega-menu-link {
    justify-content: flex-end;
  }
}