.page-wrapper{
	min-height: calc(100vh - 330px);
}
#contenedorEnlacesDeInteres {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  height: 100%;  
}

#fondoEnlacesDeInteres {
  position: relative;
  width: 73rem; 
}

main{
  min-height: 67vh;
}

.fondo-posicionable {
  position: absolute;
  top: 0; /* Posición inicial, puedes ajustar según necesites */
  left: 0;
  right: 0;
  bottom: 0;
  background: url(../img/PTE_v12_.svg) no-repeat;
  background-size: 50%; /* Ajusta el tamaño de la imagen */
  background-position: right top; /* Posición inicial */
  opacity: 0.1;
  z-index: 0;
  transform: translate(0px, 100px); /* Ajusta el desplazamiento según necesites */
}

#fondoEnlacesDeInteres > * {
  position: relative;
  z-index: 1;
}

@media (max-width: 1024px) {
  #fondoEnlacesDeInteres {
    width: 100%;
  }
  .fondo-posicionable {
    background-size: 80%; /* Ajustar tamaño en móviles */
  }
}

#logoImg {
  width: 100%; /* Ajustar para ocupar todo el ancho del contenedor */
  height: 100%;
  object-fit: contain; /* Mantener proporción del logo */
}

.custom-layout {
  flex-direction: row; /* Icono al lado del texto por defecto */
  list-style-type:square;
}
.custom-layout {
	display: flex;
	align-items: center;
	gap: 8px; 
  }
.custom-layout::before {
  content: "■"; /* Alternativa al marcador */
  color: #114da6; /* Color azul */
  margin-right: 2px;
  font-size: 0.8em;
}

@media (max-width: 767px) {
  .custom-layout {
    flex-direction: column; /* Icono encima del texto en pantallas pequeñas */
    align-items: center; /* Opcional para centrar el icono y texto */
    text-align: center; /* Opcional para centrar el texto */
  }

  /* Opcional: Espacio entre el icono y el texto en pantallas pequeñas */
  #icono {
    margin-bottom: 0.5rem;
  }
}


#divLogo {
  width: 18rem; /* Tamaño fijo para todos los contenedores de logos */
  height: 6rem;
  padding: 0.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
  /* border: 0.5px solid #E8EFFA; */
  /* max-width: 360px;
  max-height: 130px; */
}

@media (max-width: 767px) {
  #divLogo {
    max-width: 100%;
    max-height: 115px;
    margin-top: 0.4rem;
  }

  #logoImg {
    height: 100px;
  }
}


/* Centrado para pantallas pequeñas */
#contenedorInfo {
  width: 45%;
  display: flex;
  /* align-items: start; */
  justify-content: center; /* Centra para pantallas pequeñas */
}

/* Ajustar para pantallas grandes (a partir de 1024px) */
@media (min-width: 1024px) {
  /* #contenedorInfo {
    justify-content: flex-start; 
  } */

  #contenedorInfo > .flex {
    justify-content: flex-start; /* Alinear el contenido interno al inicio */
  }

  #icon {
    margin-right: 0.5rem; /* Espacio entre el icono y el texto */
  }

  #textoWeb {
    text-align: left; /* Alinear el texto a la izquierda en pantallas grandes */
  }

}

@media (max-width: 767px) {
  #contenedorInfo {
    align-items: center; 
    width: 100%;
  }
}
#backToTop {
  position: fixed; /* Para que la flecha esté fija mientras se desplaza */
  bottom: 20px; /* Espacio desde la parte inferior de la ventana */
  right: 20px; /* Espacio desde el lado derecho de la ventana */
  z-index: 100; /* Asegúrate de que esté por encima de otros elementos */
}

#scrollToTop {
  width: 50px; /* Tamaño de la flecha */
  height: 50px;
  transition: opacity 0.3s ease; /* Transición suave para la visibilidad */
}

#scrollToTop:hover {
  opacity: 0.8; /* Efecto hover */
}

.item-trigger {
  transition: transform 0.5s ease; /* Transición suave */
}

.item-trigger.rotate-up {
  transform: rotate(-180deg)  /* Rotar 180 grados y mover hacia abajo */
}

.item-trigger.rotate-down {
  transform: rotate(0deg); /* Flecha mirando hacia abajo (posición original) */
}


.item-big {
  transition: transform 0.5s ease; /* Transición suave para la rotación */
}

.rotate-up {
  transform: rotate(-180deg) translateY(-5px) ;
}

.rotate-upTodo {
  transform: rotate(-180deg); 
}

.rotate-down {
  transform: rotate(0deg); /* Volver a la posición original (mirando hacia abajo) */
}


#desplegarTodoIcon {
  transition: transform 0.5s ease; /* Animación suave para la rotación */
}

#desplegarTodoIcon.rotate-up {
  transform: rotate(-180deg)/* Rotar 180 grados hacia arriba */
}

#desplegarTodoIcon.rotate-down {
  transform: rotate(0deg); /* Volver a la posición original (hacia abajo) */
}

.colorSubcontenido{
  color: #114DA6;
  font-size: 16px;
  font-weight: bold;
}

.desplegarTodoIcon,
.item-big,
.item-trigger,
#imgIconoDesplegar {
  transition: transform 0.5s ease; /* Animación suave para rotación */
}


#buttonDesplegarTodo{
  background-color: #D7E2F5 ;
  cursor: pointer;
}

#imgIconoDesplegar{
  width: 24px;
  margin-right: 0.75rem;
}

#iconContent{
  cursor: pointer;
}

/* #iconoNotasMetodologicas{
  width: 25px;
} */

.fontNotasMetodologicas{
  font-size: 17px;
}