#musicplayer{
        background:#dbddcd; /* background color of player */
        border:2px solid #191919; /* border around player */
        width:200px; /* width of the player */
        font-size:12pt;
    }

    .songtitle{
        padding:5px; /* padding around song title */
        border-bottom:2px solid #191919; /* border under song title */
        display:block;
        font-size:12pt;
    }

    .controls{
        font-size:18px !important; /* size of controls */
        background-color:#40A19C; /* background color of controls */
        text-align:center;
        width:100%;
    }

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

    .seeking{
        background-color:#40A19C; /* background color of seeking bar */
        display:flex;
        justify-content: space-evenly;
        padding:5px; /* padding around seeking bar */
    }

    .current-time{
        padding-right:5px;
    }

    .total-duration{
        padding-left:5px;
    }

    i.fas:hover{
        cursor:help;
    }

    i.fas.fa-pause, i.fas.fa-play, i.fas.fa-forward, i.fas.fa-backward{
        color:#191919; /* color of controls */
    }
    
    input[type=range] {
        -webkit-appearance: none;
        width: 100%;
        background-color:#40A19C; /* background color of seeking bar - make the color same as .seeking background color */
    }
    
    input[type=range]:focus {
        outline: none;
    }
    
    /* settings for chrome browsers */
    input[type=range]::-webkit-slider-runnable-track {
        width: 100%;
        height: 2px; /* thickness of seeking track */
        cursor: help;
        background: #191919; /* color of seeking track */
    }
    
    input[type=range]::-webkit-slider-thumb {
        height: 10px; /* height of seeking square */
        width: 10px; /* width of seeking square */
        border-radius: 0px; /* change to 5px if you want a circle seeker */
        background: #191919; /* color of seeker square */
        cursor: help;
        -webkit-appearance: none;
        margin-top: -4.5px; 
    }
    
    /* settings for firefox browsers */
    input[type=range]::-moz-range-track {
        width: 100%;
        height: 2px; /* thickness of seeking track */
        cursor: help;
        background: #191919; /* color of seeking track */
    }
    
    input[type=range]::-moz-range-thumb {
        height: 10px; /* height of seeking square */
        width: 10px; /* width of seeking square */
        border-radius: 0px; /* change to 5px if you want a circle seeker */
        background: #191919; /* color of seeker square */
        cursor: help;
        border:none;
    }