/* Songs menu stylesheet */
.songs-menu {
    display: block;
    padding: 10px;
    background-image: url('../img/window.png');
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    aspect-ratio: 519 / 571;
    width: 500px;
    margin: auto;
    color: black;
}

.song-item {
    display: flex;
    margin-bottom: 12px;
}

.song-item * {
    margin-right: 10px;
}
h1 {
    font-size: 25px;
}

.song-list {
    margin: 70px;
    margin-left: 50px;
}

.song-header {
    color: black;
    margin-top: 16px;
}

.play-button {
    max-width: 40px;
    margin: 10px;
}

/* songlist headers ------------------------------------------------- */
#songlist-header-container {
    margin: auto;
}
#songlist-header {
    color: black;
    margin: auto;
    margin-top: 18px;
    font-family: "Inter", sans-serif;
    font-optical-sizing: auto;
    font-size: 17px;
    font-style: normal;
}

audio {
    max-width: 220px;
    margin-left: auto;
}

@media (max-width: 400px) {
    .songs-menu {
        display: flex;
        background-color: rgba(255, 207, 219);
        background-image: none;
        display: block;
        padding: 0px;
        margin: 0px;
        width: auto;
    }
    #songlist-header-container, #songlist-header {
        margin-left: auto;
        margin-right: 5px;
    }
    .songs-menu {
        padding: 5px;
    }


    .song-item {
        display: block;
        margin: auto;
        margin-bottom: 20px;
    }
    .song-item * {
        margin: auto;
    }
    .song-list {
        margin: 0px;
    }
    .song-title {
        margin-bottom: 20px;
    }
    .play-button {display: none;}
}


/* ------------ Footer ------------------- */
footer {
    padding-top: 20px;
    margin: 20px;
}

/* links */
a {
    color: pink;
}