/* General */
 body, html {
    margin: 0;
    padding: 0;
    width: 100%;
    height: 100%;
    overflow: hidden; /* Desactivamos el scroll en la página */
    cursor: default; /* Mantener el cursor normal */
    font-family: 'MiFuente', serif;
  }

  @font-face {
    font-family: 'MiFuente'; /* Nombre personalizado para la fuente */
    src: url('ChamberiText-Regular.woff') format('truetype'); /* Ruta relativa al archivo de la fuente */
    font-weight: normal; /* Opcional: define el peso de la fuente */
    font-style: normal; /* Opcional: define el estilo de la fuente */
}
  
  /* Contenedor para la imagen */
  .scroll-wrapper {
    position: relative;
    width: 100%;
    height: 100%;
    overflow: hidden; /* Desactivar el scroll en el contenedor */
    display: flex;
    justify-content: center;
    align-items: center;
  }
  
  /* Imagen más grande y desplazamiento suave */
  .infinite-scroll-image {
    position: absolute;
    width: 2500px; /* Tamaño ajustado de la imagen (ancho) */
    height: 3500px; /* Tamaño ajustado de la imagen (alto) */
    top: 0;
    left: 0;
    transition: transform 2s ease-out; /* Desplazamiento suave más fluido */
  }
  
  /* Estilo del reproductor de música centrado y fijo */
  .music-player {
    position: fixed;
    top: 50%; /* Centrar verticalmente */
    left: 50%; /* Centrar horizontalmente */
    transform: translate(-50%, -50%); /* Ajustar el centro exacto */
    z-index: 10; /* Asegurarnos de que esté por encima de la imagen */
  }
  
  /* Fondo detrás del reproductor */
  .player-background {
    padding: 15px;
    border-radius: 10px;
    display: inline-block; /* Mantener el fondo alrededor del iframe */
  }
  
  iframe {
    border-radius: 8px;
    width: 100%; /* Hace que el iframe se adapte al tamaño del contenedor */
    height: 100%;
  }
  
  /* Estilos Responsivos */
  @media (max-width: 768px) {
    /* Para pantallas de dispositivos pequeños como tabletas y móviles */
    .infinite-scroll-image {
      width: 2000px;  /* Ajusta el tamaño de la imagen */
      height: 3000px; /* Ajusta el tamaño de la imagen */
    }
  
    .music-player {
      top: 80%; /* Ajusta la posición en pantallas más pequeñas */
      width: 80%;  /* Hacer el reproductor más pequeño y adaptarlo */
      height: auto;
      transform: translate(-50%, -80%);
    }
  
    .player-background {
      padding: 10px;
    }
  
    iframe {
      width: 100%; /* Asegura que el iframe de Spotify se adapte */
      height: 100px; /* Ajusta la altura del reproductor */
    }
  }
  
  /* Estilo adicional para pantallas muy pequeñas (móviles) */
  @media (max-width: 480px) {
    .music-player {
      width: 90%;  /* El reproductor toma todo el ancho de la pantalla */
      height: auto;
      top: 50%;  /* Coloca el reproductor aún más abajo */
      transform: translate(-50%, -50%);
    }
  
    .player-background {
      padding: 8px;
    }
  
    iframe {
      width: 100%;  /* El reproductor de Spotify es más grande */
      height: 80px; /* Ajuste para dispositivos más pequeños */
    }
  }
  .go-to-another-page {
    position: fixed;
    top: 15px;  /* Posiciona el enlace cerca de la parte superior */
    left: 15px;  /* Posiciona el enlace cerca del borde izquierdo */
    color: black;
    text-decoration: none;
    border-radius: 5px;
  }

  .go-to-another-page-2 {
    position: fixed;
    top: 15px;  /* Posiciona el enlace cerca de la parte superior */
    left: 120px;  /* Posiciona el enlace cerca del borde izquierdo */
    color: black;
    text-decoration: none;
    border-radius: 5px;
  }

.footer {
padding-top: 10%;
  left: 15px;
  color: black; /* Color del texto */
  font-size: 16px; /* Tamaño del texto */
  position: fixed; /* Para mantenerlo siempre visible */
  bottom: 0; /* Posición al final de la pantalla */
  width: 100%; /* Ocupa todo el ancho */
}

.logo-container {
  display: flex;
  justify-content: left;
  gap: 8px; /* Espaciado entre los logos */
}

.logo {
  height: 20px; /* Ajusta el tamaño de los logos */
  width: auto; /* Mantén la proporción de los logos */
}