.video-wrapper.js-video-controls {
  position: relative;
  isolation: isolate;
  cursor: pointer;
}
.video-wrapper.js-video-controls video {
  z-index: -1;
  position: relative;
  -o-object-fit: cover;
     object-fit: cover;
}
.video-wrapper.js-video-controls svg.play-icon,
.video-wrapper.js-video-controls img.play-icon,
.video-wrapper.js-video-controls img.pause-icon,
.video-wrapper.js-video-controls svg.pause-icon {
  z-index: 10;
  position: absolute;
  translate: -50% -50%;
  inset: 50% auto auto 50%;
  pointer-events: none;
  width: 72px;
  height: 72px;
  -o-object-fit: contain;
     object-fit: contain;
  color: #ffffff;
  filter: drop-shadow(0px 8px 10px rgba(0, 0, 0, 0.7529411765));
  scale: 1;
  opacity: 0;
  transition: opacity 0.2s ease-in-out, scale 0.2s ease-in;
}
.video-wrapper.js-video-controls svg.play-icon.play-icon,
.video-wrapper.js-video-controls img.play-icon.play-icon,
.video-wrapper.js-video-controls img.pause-icon.play-icon,
.video-wrapper.js-video-controls svg.pause-icon.play-icon {
  visibility: visible;
}
.video-wrapper.js-video-controls svg.play-icon.pause-icon,
.video-wrapper.js-video-controls img.play-icon.pause-icon,
.video-wrapper.js-video-controls img.pause-icon.pause-icon,
.video-wrapper.js-video-controls svg.pause-icon.pause-icon {
  visibility: hidden;
}
.video-wrapper.js-video-controls.video-playing svg.play-icon,
.video-wrapper.js-video-controls.video-playing img.play-icon {
  visibility: hidden;
}
.video-wrapper.js-video-controls.video-playing svg.pause-icon,
.video-wrapper.js-video-controls.video-playing img.pause-icon {
  visibility: visible;
}
@media only screen and (min-width: 768px) {
  .video-wrapper.js-video-controls:hover svg.play-icon,
  .video-wrapper.js-video-controls:hover img.play-icon,
  .video-wrapper.js-video-controls:hover svg.pause-icon,
  .video-wrapper.js-video-controls:hover img.pause-icon {
    opacity: 1;
    scale: 1.1;
  }
}
.video-wrapper.js-video-controls.video-paused svg.play-icon,
.video-wrapper.js-video-controls.video-paused img.play-icon,
.video-wrapper.js-video-controls.video-paused svg.pause-icon,
.video-wrapper.js-video-controls.video-paused img.pause-icon, .video-wrapper.js-video-controls.video-manual-pause svg.play-icon,
.video-wrapper.js-video-controls.video-manual-pause img.play-icon,
.video-wrapper.js-video-controls.video-manual-pause svg.pause-icon,
.video-wrapper.js-video-controls.video-manual-pause img.pause-icon {
  opacity: 1;
  scale: 1.1;
}
