/* src https://www.youtube.com/watch?v=5apeHpZtDH4 -- Mr. Web Designer */
/* * {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
} */

/* html {
    font-size: 62.5%;
} */

/* .container > div {
    background: #222;
    padding: 0;
} */



.container .heading {
    /* font-size: 3rem; */
    padding: 0 0 0 0;
    /* text-align: center; */
    /* font-family:'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif; --- change */
    /* text-shadow: 0 .5rem 1rem #000; */
    color: #000;
}

.container .music-container{
    display: flex; 
    align-items: center;
    flex-flow: column;

    /* padding: 0; */
}

.container .music-container .box {
    /* original
    height: 16rem; */
    height: 50%;
    width: 100%;
    display: flex;
    align-items: center;
    /* background: #000; */
    /* original 
    background: #f9f9f9; */
    /* border-radius: 1rem; */
    /* box-shadow: 0 .5rem 1rem #000; */
    /* overflow: hidden; */
    margin-bottom: 2rem;
 
}

.container .music-container .box .image{
    /* original */
    /* height: 100%;
    width: 25%; */
    /* -------- */
    height: 100%;
    width: 50%;
}

.container .music-container .box .image img {
    /* original */
    /* height: 100%;
    width: 100%; */
    /* ------- */
    height: 100%;
    width: 90%;
    object-fit: cover;
}

.container .music-container .box .music{
    /* original */
    /* width: 100%; */
    width: 75%;
    /* padding: 0; */
}

.container .music-container .box .music audio{
    /* original
    width: 100%; */
    width: 90%;
    outline: none; 
}

.container .music-container .box .music audio::webkit-media-controls-enclosure{
    background: none;

}

/* originally max-width */
@media (min-width:600px) { 
    .container .music-container .box {
        height:27rem;
        width:100%;
        flex-flow: column;
        
    }

    .container .music-container .box .image {
        height:80%;
        width:100%;
    }

    .container .music-container .box .music {
        height:20%;
        width:100%;
    }
}