.vjs-tubo .vjs-poster img {
  object-fit: cover;
}

.vjs-tubo .vjs-control-bar {
  background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.6) 100%);
}

.vjs-tubo .vjs-menu-button-popup .vjs-menu .vjs-menu-content {
  background: rgba(0, 0, 0, 0.5);
  backdrop-filter: blur(6px);
}

.vjs-tubo .vjs-current-time, .vjs-tubo .vjs-time-divider, .vjs-tubo .vjs-duration {
  display: block;
}

.vjs-tubo .vjs-big-play-button, .vjs-tubo.vjs-paused .vjs-big-play-button, .vjs-tubo:hover .vjs-big-play-button {
  content: '';
  background-size: 60%;
  background-position: center center;
  background-repeat: no-repeat;
  background-image: url('data:image/svg+xml;utf8,<svg fill="%23FFFFFF" height="24" viewBox="0 0 24 24" width="24" xmlns="http://www.w3.org/2000/svg"><path d="M8 5v14l11-7z"/><path d="M0 0h24v24H0z" fill="none"/></svg>');
  background-color: transparent;
  border: none;
}

.vjs-tubo .vjs-progress-control {
  position: absolute;
  width: calc(100% - 4em);
  top: -.5em;
  height: 0.5em;
  margin-left: 2em;
  margin-right: 2em;
}

.vjs-tubo .vjs-progress-control .vjs-progress-holder {
  position: relative;
  margin: 0px !important;
  top: 0;
  width: 100%;
  font-size: 13px;
  padding: 8px 0 15px 0;
  background: none;
}

.vjs-tubo .vjs-progress-control .vjs-progress-holder::before {
  content: '';
  display: block;
  width: 100%;
  height: 5px;
  background: rgba(115, 133, 159, 0.3);
  border-radius: 20px;
}

.vjs-tubo .vjs-progress-control .vjs-load-progress,
.vjs-tubo .vjs-progress-control .vjs-play-progress {
  height: 5px;
  top: 8px;
  border-radius: 20px;
}

.vjs-tubo .vjs-progress-control .vjs-load-progress > div:first-of-type {
  border-radius: 20px;
}

.vjs-tubo .vjs-progress-control .vjs-mouse-display {
  background: none;
}

.vjs-tubo .vjs-spacer {
  display: flex;
  flex: 1 1 auto;
}

.vjs-tubo .vjs-volume-bar.vjs-slider-horizontal {
  background: none;
  padding: 0px 0 15px 0;
}

.vjs-tubo .vjs-volume-bar.vjs-slider-horizontal::before {
  content: '';
  display: block;
  width: 100%;
  height: 3px;
  background: rgba(115, 133, 159, 0.3);
}

.vjs-tubo .vjs-volume-bar.vjs-slider-horizontal .vjs-volume-level {
  height: 3px;
  top: 0;
}

.vjs-tubo .vjs-volume-bar.vjs-slider-horizontal .vjs-mouse-display {
  display: none;
}

.vjs-tubo.vjs-layout-x-small .vjs-progress-control,
.vjs-tubo.vjs-layout-tiny .vjs-progress-control {
  display: block;
}

.vjs-tubo.vjs-layout-x-small .vjs-control-bar .vjs-play-control,
.vjs-tubo.vjs-layout-tiny .vjs-control-bar .vjs-play-control {
  display: none;
}

.vjs-tubo.vjs-layout-small .vjs-current-time,
.vjs-tubo.vjs-layout-small .vjs-time-divider,
.vjs-tubo.vjs-layout-small .vjs-duration,
.vjs-tubo.vjs-layout-x-small .vjs-current-time,
.vjs-tubo.vjs-layout-x-small .vjs-time-divider,
.vjs-tubo.vjs-layout-x-small .vjs-duration,
.vjs-tubo.vjs-layout-tiny .vjs-current-time,
.vjs-tubo.vjs-layout-tiny .vjs-time-divider,
.vjs-tubo.vjs-layout-tiny .vjs-duration {
  display: inline-block;
}

.vjs-tubo.vjs-layout-small .vjs-progress-control .vjs-load-progress,
.vjs-tubo.vjs-layout-small .vjs-progress-control .vjs-play-progress,
.vjs-tubo.vjs-layout-x-small .vjs-progress-control .vjs-load-progress,
.vjs-tubo.vjs-layout-x-small .vjs-progress-control .vjs-play-progress,
.vjs-tubo.vjs-layout-tiny .vjs-progress-control .vjs-load-progress
.vjs-tubo.vjs-layout-tiny .vjs-progress-control .vjs-play-progress {
  top: 0;
}

.vjs-tubo.vjs-layout-small .vjs-progress-control .vjs-progress-holder,
.vjs-tubo.vjs-layout-x-small .vjs-progress-control .vjs-progress-holder,
.vjs-tubo.vjs-layout-tiny-small .vjs-progress-control .vjs-progress-holder {
  padding: 0 0 15px 0;
}

.vjs-tubo.vjs-layout-tiny .vjs-menu-button-popup .vjs-menu .vjs-menu-content,
.vjs-tubo.vjs-layout-x-small .vjs-menu-button-popup .vjs-menu .vjs-menu-content {
  max-height: 10em;
}