/* ==========================================
   MUSIC PAGE
========================================== */

#music-page{
    padding:30px 0 50px;
}


/* ==========================================
   SECTION
========================================== */

.music-section{
    display:block;
    width:100%;
    clear:both;
    margin-bottom:50px;
}

.music-section:last-child{
    margin-bottom:0;
}


/* ==========================================
   TITLE
========================================== */

.music-title{
    display:block;
    width:100%;
    margin:0 0 25px;
    padding-bottom:12px;

    color:#fff;

    font-size:30px;
    font-weight:700;

    border-bottom:1px solid rgba(255,255,255,.15);
}


/* ==========================================
   GRID
========================================== */

.music-grid{
    margin-left:-15px;
    margin-right:-15px;
}


/* ==========================================
   CARD
========================================== */

.music-item{
    margin-bottom:30px;
}

.music-card{

    background:rgba(255,255,255,.04);

    padding:15px;

    border-radius:8px;

    text-align:center;

    transition:.3s;

}

.music-card:hover{

    background:rgba(255,255,255,.08);

    transform:translateY(-4px);

}


/* ==========================================
   IMAGE
========================================== */

.album-cover{

    overflow:hidden;

    border-radius:6px;

}

.album-cover img{

    display:block;

    width:100%;

    height:auto;

}


/* ==========================================
   STORE ICONS
========================================== */

.store-icons{

    display:flex;

    justify-content:center;

    align-items:center;

    gap:12px;

    margin-top:15px;

}

.store-icons a{

    display:flex;

}

.store-icons img{

    width:34px;

    height:34px;

    object-fit:contain;

    transition:.25s;

}

.store-icons img:hover{

    transform:scale(1.15);

}


/* ==========================================
   PLAYERS
========================================== */

.player-card{

    background:rgba(255,255,255,.04);

    border-radius:8px;

    padding:15px;

}

.player-card iframe{

    width:100%;

    height:400px;

    border:0;

}


/* ==========================================
   MOBILE
========================================== */

@media (max-width:767px){

    #music-page{

        padding:20px 0 40px;

    }

    .music-title{

        font-size:24px;

    }

    .music-card{

        padding:12px;

    }

    .store-icons img{

        width:30px;
        height:30px;

    }

}


/* ==========================================
   TABLET
========================================== */

@media (min-width:768px) and (max-width:991px){

    .music-card{

        padding:15px;

    }

}


/* ==========================================
   LARGE DESKTOP
========================================== */

@media (min-width:1200px){

    .music-card{

        height:100%;

    }

}