.zoomsounds-external-scrubbar, .audioplayer {
  width: 100%;


  .scrubbar {


    width: 100%;
    height: 10px;
    cursor: pointer;
    position: relative;

    .scrub-bg .wave-separator {
      position: absolute;
      bottom: 0;
      left: 0;
      width: 100%;
      height: 1px;
      background: rgba(0, 0, 0, 0.1);
    }


    $transition-property: width;
    $transition-duration: 0.3s;
    $transition-timing: ease-out;

    .scrub-prog {
      position: absolute;
      top: 0;
      left: 0;
      width: 0%;
      height: 100%;

    }
  }
}


.audioplayer .ap-controls .scrubbar .scrub-bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}



$transition-property: opacity, visibility, left;
$transition-duration: 0.1s;
$transition-timing: ease-out;
.audioplayer .ap-controls .scrubbar .scrubBox-hover {
  position: absolute;
  top: 0;
  left: 0;
  width: 1px;
  visibility: hidden;
  opacity: 0;
  pointer-events: none;
  height: 100%;
  background: $color_highlight;


  $transition-property: opacity, visibility;
  $transition-duration: 0.3s;
  $transition-timing: ease-out;

  @include apply_transition($transition-property, $transition-duration, $transition-timing);
}

.audioplayer.dzsap-loaded .ap-controls .scrubbar:hover .scrubBox-hover {
  visibility: visible;
  opacity: 1;
}

.audioplayer{

  &.is-radio-type {
    .scrubbar {
      opacity: 0;
      pointer-events: none;
      display: none;
    }
  }
}