/* VARIABLES */
/* TYPOGRAPHY */
/* Google Fonts */
:root {
  --media-video-player-icon-size: 4.5rem;
  --media-video-player-icon: url("../../images/play.svg");
}

.ratio {
  position: relative;
  inline-size: 100%;
}

.video-player-icon {
  position: relative;
}
.video-player-icon.js-video-player-icon {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  margin: 0;
  cursor: pointer;
  z-index: 3;
}
.video-player-icon:after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background: var(--media-video-player-icon) no-repeat center center;
  height: var(--media-video-player-icon-size);
  width: var(--media-video-player-icon-size);
  max-height: 55%;
  font-size: 15%;
  cursor: pointer;
}
.video-player-icon:hover:after {
  opacity: 0.75;
}

.media--type-video-embed,
.media--type-remote-video,
.media--type-video {
  position: relative;
}