.album-container {
    width: 93%;
    margin: 0 auto;
    margin-bottom: 3.12em;

}

.album-container-last {
    margin-bottom: 10.6em;
}

.album-container-box {
    display: flex;
    justify-content: flex-start;
    margin-bottom: 3.12em;

}

.album-cover img{
    max-width: 50vw;
}

.album-info {
    display: flex;
    width: 100%;
    flex-direction: column;
    justify-content: space-between;
    margin-left: 3.12rem;
    color: var(--clr-primary-100);
    font-family: var(--ff-body);
}

.album-name {
    font-weight: var(--fw-bold);
    font-size: var(--fs-600);
    text-transform: uppercase;
}

.album-band {
    font-weight: var(--fw-bold);
    font-size: var(--fs-500);
    margin-bottom: 1.7rem;
    text-transform: capitalize;
    color: var(--clr-accent-300);
}

.album-format,
.album-date {
    padding: 0.31rem;
    font-weight: var(--fw-regular);
    font-size: var(--fs-300);
}

.hr {
    display: flex;
    flex-direction: column;
    border: none;
    border-bottom: 1px solid var(--clr-primary-100) ;
}

@media (max-width: 1200px) {
    .button {
        font-size: var(--fs-400);
        width: 15rem;
        height: 3.3125rem;
    }

    .album-name {
        font-size: var(--fs-500);
    }
    
    .album-band {
        font-size: var(--fs-400);
    }

    .album-format,
    .album-date {
        font-size: var(--fs-200);
    }

}

@media (max-width: 850px) {
    .button {
        font-size: var(--fs-200);
        width: 8rem;
        height: 3rem;
    }

    .album-name {
        font-size: var(--fs-300);
    }
    
    .album-band {
        font-size: var(--fs-200);
    }

    .album-format,
    .album-date {
        font-size: var(--fs-100);
    }

    .album-info {
        margin-left: 1.5rem;
    }
}