/**
 * @author jevgeni dot virves at gmail dot com
 * @since 2024-07-13
 */

.vk_mejs_audio {
  background-color: #eff8f8;
  border-radius: 10px;
  display: block;
  overflow: hidden;
  padding: 10px 20px;
  white-space: nowrap;
}

.vk_mejs_audio.vk_mejs_audio_page_teekonnad {
  display: inline-block;
  padding: 10px 5px 10px 20px;
  transform: translate(180px, -100%);
}

@media only screen and (max-width: 991px) {
  .vk_mejs_audio.vk_mejs_audio_page_teekonnad {
    display: block;
    margin-top: 20px;
    padding: 14px 0 14px 20px;
    transform: translate(0px, 0px);
    width: 100%;
  }
}


.vk_mejs_audio.vk_mejs_audio_page_teekond,
.vk_mejs_audio.vk_mejs_audio_page_objekt {
  display: block;
  padding: 10px 0 10px 20px;
  width: 100%;
}

.vk_mejs_audio_label {
  box-sizing: border-box;
  color: var(--blueAccent);
  display: inline-block;
  filter: brightness(85%);
  font-size: 15px;
  font-weight: 600;
}

.vk_mejs_audio.vk_mejs_audio_page_teekond .vk_mejs_audio_label,
.vk_mejs_audio.vk_mejs_audio_page_objekt .vk_mejs_audio_label {
  width: 100px;
}

.vk_mejs_audio .mejs-container {
  background: none;
  display: inline-block;
  height: 40px;
  margin: -10px 0;
  max-width: 350px;
  min-width: 350px;
  width: 350px;
}

.vk_mejs_audio.vk_mejs_audio_page_teekonnad .mejs-container {
  max-width: 350px;
  width: 350px;
}

@media only screen and (max-width: 991px) {
  .vk_mejs_audio.vk_mejs_audio_page_teekonnad .mejs-container {
    max-width: calc( 100% - 80px );
    min-width: calc( 100% - 80px );
    width: calc( 100% - 80px );
  }
}

.vk_mejs_audio.vk_mejs_audio_page_teekond .mejs-container,
.vk_mejs_audio.vk_mejs_audio_page_objekt .mejs-container {
  max-width: calc( 100% - 110px );
  min-width: calc( 100% - 110px );
  width: calc( 100% - 110px );
}

.vk_mejs_audio .mejs-container .mejs-inner {
  transform: translateY(2px);
}

.vk_mejs_audio .mejs-container .mejs-controls {
  background-color: #eff8f8;
  border-radius: 10px;
  height: 100%;
  width: 100%;
}

.vk_mejs_audio .mejs-container .mejs-controls .mejs-horizontal-volume-slider .mejs-horizontal-volume-total,
.vk_mejs_audio .mejs-container .mejs-controls .mejs-time-rail .mejs-time-total {
  background: rgba(255, 255, 255, 1);
}

.vk_mejs_audio .mejs-container .mejs-controls .mejs-playpause-button button,
.vk_mejs_audio .mejs-container .mejs-controls .mejs-volume-button button {
  filter: invert(46%) sepia(7%) saturate(2656%) hue-rotate(134deg) brightness(91%) contrast(92%);
}

.vk_mejs_audio .mejs-container .mejs-controls .mejs-currenttime-container,
.vk_mejs_audio .mejs-container .mejs-controls .mejs-duration-container {
  height: 40px;
  padding: 0 6px;
  width: 40px;
}

.vk_mejs_audio .mejs-container .mejs-controls .mejs-currenttime,
.vk_mejs_audio .mejs-container .mejs-controls .mejs-duration {
  color: #3b7c7f;
  display: inline-block;
  font-family: Raleway, sans-serif;
  font-size: 14px;
  font-weight: 500;
  height: 40px;
  line-height: 40px;
  text-align: left;
  user-select: none;
}

.vk_mejs_audio .mejs-container .mejs-controls .mejs-time-rail .mejs-time-current,
.vk_mejs_audio .mejs-container .mejs-controls .mejs-horizontal-volume-current {
  background-color: #3b7c7f;
}

.vk_mejs_audio .mejs-container .mejs-controls .mejs-time-rail .mejs-time-hovered,
.vk_mejs_audio .mejs-container .mejs-controls .mejs-time-rail .mejs-time-handle,
.vk_mejs_audio .mejs-container .mejs-controls .mejs-time-rail .mejs-time-float {
  display: none;
  pointer-events: none;
  visibility: hidden;
}