#musicplayer{
    padding: 10px;
    color: #000;
    text-align: center;
    width: 150px;
}

.now-playing{
    font-family: petiote;
    font-size: medium;
    background-color: #fff;
    padding: 5px;
}
 
.songtitle{
    padding: 5px;
    text-align: center;
}
 
.controls{
    font-size: 18px !important;
    text-align: center;
    width: 100%;
    margin-top:-4px;
    margin-bottom:-4px
}

.controls td{
    padding: 8px 5px 0px 5px;
}

.volume{
    display:flex;
    justify-content: space-evenly;
    padding:10px 10px 10px 10px;
    color: #fff;
    font-family:petiote;
    font-size:medium;
}
 
i.fa-pause,i.fa-play,i.fa-forward,i.fa-backward{
    color: #fff;
}

i.fa-play, i.fa-pause{
    font-size:30px !important;
}

input[type=range] {
    -webkit-appearance: none;
    width: 100%;
}

input[type=range]:focus {
    outline: none;
}

input[type=range]::-webkit-slider-runnable-track {
    width: 100%;
    height: 2px;
    animate: 0.2s;
    background: #000;
    border-radius: 1px;
}

input[type=range]::-webkit-slider-thumb {
    height: 10px;
    width: 10px;
    border-radius: 0px;
    background: #000;
    -webkit-appearance: none;
    margin-top: -4px;
}