/* #top5  {
    font-family: Arial, sans-serif;
    background-color: #f0f0f0;
    color: #333;
} */

.top-5-container {
    font-family: Arial, sans-serif;
    background-color: #f0f0f0;
    color: #333;
    width: 90%;
    max-width: 800px;
    margin: 50px auto;
    background-color: #fff;
    padding: 20px;
    border-radius: 10px;
    box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.1);
}

.title {
    text-align: center;
    font-size: 2em;
    margin-bottom: 20px;
    color: #333;
}

.song-item {
    display: flex;
    align-items: center;
    padding: 15px 10px;
    border-bottom: 1px solid #ddd;
    transition: background-color 0.3s;
}

.song-item:last-child {
    border-bottom: none;
}

.song-item:hover {
    background-color: #f9f9f9;
}

.song-item img {
    width: 80px; /* Se incrementa el tamaño para una mejor visualización */
    height: 80px;
    border-radius: 8px;
    object-fit: cover;
    margin-right: 20px; /* Espacio suficiente entre la imagen y el texto */
}

.song-info {
    display: flex;
    flex-direction: column;
    justify-content: center;
    max-width: 60%;  /* Ajusta este valor según el diseño */

}

.song-title {
    font-weight: bold;
    font-size: 1.2em;
    margin: 0;
    white-space: nowrap;        /* Evita el salto de línea */
    overflow: hidden;           /* Oculta el texto que se desborda */
    text-overflow: ellipsis;    /* Agrega "..." al final del texto que se desborda */
    max-width: 100%;   
}

.song-artist {
    color: #666;
    margin-top: 5px; /* Espacio ligero entre el título y el artista */
    white-space: nowrap;        /* Evita el salto de línea */
    overflow: hidden;           /* Oculta el texto que se desborda */
    text-overflow: ellipsis;    /* Agrega "..." al final del texto que se desborda */
    max-width: 100%;   
}



@media (max-width: 768px) {
    .member-mobile {
        margin-right: -15px;

    }
  }