.audio-player {
  max-width: 560px;
  margin-left: auto;
  margin-right: auto;
}
.audio-player i {
  font-size: 24vw;
}
#next-button {
    font-size: 18vw;
}
.audio-player {
    max-width: 560px;
    margin-left: auto;
    margin-right: auto;
    clear: both;
    border-top: 1px solid #dad8d8;
}
    .audio-player .card {
        position: relative;
        background: #eee;
    }
    .audio-player .card-body {
        -ms-flex: 1 1 auto;
        flex: 1 1 auto;
        padding: 1.25rem;
        background-image: linear-gradient(#d9e25b, #eeeeee);
    }
    .audio-player .row {
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        padding-left: 30px;
    }
.audio-player .ml-auto, .audio-player .mx-auto {
    margin-left: auto !important;
}
.audio-player .p-1 {
    padding: .25rem !important;
}
.audio-player .rounded-circle {
    border-radius: 50% !important;
    text-align: center;
}
/*.audio-player .border-primary {
    border-color: #007bff !important;
}
.audio-player .border {
    border: 1px solid #e9ecef !important;
}*/
.audio-player .col {
    -ms-flex-preferred-size: 0;
    flex-basis: 0;
    -ms-flex-positive: 1;
    flex-grow: 1;
    max-width: 100%;
}
.audio-player .rounded-circle {
    border-radius: 50% !important;
}
.audio-player .img-fluid {
    width: 120px;
    height: 120px;
}
.audio-player .d-none {
    display: none !important;
}
.audio-player .progress-bar {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: center;
    justify-content: center;
    color: #fff;
    background-color: #007bff;
}
.audio-player .list-group {
    display: -ms-flexbox;
    display: block;
    -ms-flex-direction: column;
    flex-direction: column;
    padding-left: 0;
    margin-top: 30px;
}
    .audio-player .col-12 {
        -ms-flex: 0 0 100%;
        flex: 0 0 100%;
        max-width: 100%;
        width: 100%;
        margin-top: 15px;
    }
    .audio-player .lead {
        margin-bottom: 0;
    }
@media screen and (min-width:560px) {
    .audio-player i {
        font-size: 64px;
        padding-top: 30px;
        cursor:pointer;
    }
  #next-button {
    font-size: 60px;
  }
}

#now-playing {
  display: none;
}

.audio-player .progress {
    overflow: visible;
    position: relative;
}
/*.video-player li h4:before,
.audio-player li.active:before {
    font-family: "Material Icons";
    content: "\e037";
    display: inline-block;
    padding-right: 3px;
    vertical-align: middle;
    font-size: 1.5rem;
}*/
.audio-player .ui-slider {
    position: relative;
    text-align: left;
}
    .audio-player .ui-slider .ui-slider-handle {
        position: absolute;
        z-index: 2;
        width: 1.2em;
        height: 1.2em;
        cursor: default;
        -ms-touch-action: none;
        touch-action: none;
        border-radius: 50%;
    }
/*.ui-slider-handle {
  border-radius: 50%;
}*/
.audio-player .ui-slider-horizontal {
    height: .8em;
}
.video-player li {
    padding: 5px;
    cursor: pointer;
    border-top: 1px solid #dad8d8;
}
    .video-player li h4{
        line-height:24px;
    }
    .video-player li.active h4 {
        color: #428bca;
    }
    .video-player li.active {
        background: #eee;
    }
.video-player{
    margin-bottom:10px;
}