body {
    padding: 0;
    margin: 0;    
    background: rgb(51,43,55);
    background: radial-gradient(circle, rgba(51,43,55,1) 0%, rgba(51,43,55,1) 100%);
    display: flex;
    flex-direction: column;
    align-items: center;
    color:#fff;
    font-family: 'MedievalSharp', cursive;
    user-select: none;
}

button {
    margin-top: .5rem;
    font-family: 'MedievalSharp', cursive;
    background-color: #fcc02a;
    border: 2px solid #963404;
    outline: none;
    padding: 0 1.8rem;
    margin: 2.5rem 0 0 0;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 1.5rem;
    border-radius: 6px;
    cursor: pointer;
    color:#963404;
    height:4rem;
    box-shadow: 0px 6px 10px -4px rgba(0,0,0,0.4);
}


button:active {
    background-color: #c2b28c;
    box-shadow: 0 5px #666;
    transform: translateY(4px);
}


.container {
    display: absolute;
    width: 40rem;
    height: 30rem;
    padding: 0;
    text-align: center;
    margin: 3.3rem auto;
    background: rgb(23, 12, 29, 0.7);
    padding: 8em 10em 4em 10em;
    border-radius: 20px;
}

.logo {
    width: 45.5rem;
    margin: -6rem 0 1.5rem -3rem;
}

p {
    font-size: 25px;
    width: 100%;
}

h1{
    font-size: 45px;
}

#music-btn {
    position: absolute;
    padding: .6rem;
    border-radius: 100%;
    margin: 0;
    width: 4rem;
    margin: -7.3rem 0 0 45rem;
    height: 4rem;
}

#music-btn > img {
    width: 40px;
    padding: 0;
    margin: 0;
}

/* Starting page for small screens */



@media(max-width:950px) {
    
    #music-btn {
        border-radius: 100%;
        margin: -7.3rem 0 0 30rem;
    }

    .container {
        width: 25rem;
        height: 26rem;
        margin: 2rem 0;
    }

    .container > p {
        font-size: 24px;
        width: 30rem;
        margin-left: -2rem;
    }
    
    .logo {
        width: 30rem;
        margin-bottom: 0rem ;
    }

}

@media(max-width: 680px){

    #music-btn {
        margin: -7.8rem 0 0 19rem;
    }

    .container {
        width: 15rem;
        margin: 2rem 0;
        height: 30rem;
    }

    .container > p {
        font-size: 23px;
        width: 23rem;
        margin-left: -4rem;
    }

    .logo {
        width: 30rem;
        margin: -6rem 0 0 -7rem;
    }

}

