.albums {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    grid-gap: 30px;
}

.album {
    border-radius: 20px;
    background-color: #ffffff;
    height: min-content;
}

.album-cover img {
    border-radius: 20px;
    width: 100%;
    height: 100%;
    object-fit: cover;
    aspect-ratio: 3 / 2
}

.album-title {
    display: grid;
    grid-template-columns: 1fr 2em;
    grid-gap: 0.5em;
    padding: 1em 10px;
    font-size: 0.8em;
}

@media (max-width: 1023px) {
    .albums {
        grid-template-columns: 1fr 1fr 1fr;
        grid-gap: 25px;
    }
}

@media (max-width: 679px) {
    .albums {
        grid-template-columns: 1fr 1fr;
        grid-gap: 16px;
    }
}

@media (max-width: 359px) {
    .albums {
        grid-template-columns: 1fr;
        grid-gap: 10px;
    }
}