.video {
  padding-bottom: 56.25%;
  position: relative;
}

/* --- bottom (or top) padding sets aspect ratio --- */

/* --- placeholder link & <iframe> (when loaded) --- */

.video a, .video iframe {
  display: block;
  width: 100%;
  height: 100%;
  position: absolute;
}

.video iframe {
  border: 0;
}

/* --- optional custom play button --- */

.video a::before {
  height: 5rem;
  z-index: 1;
  position: absolute;
  top: 50%;
  left: 50%;
  width: 5rem;
  content: "";
  margin: -2.5rem 0px 0px -2.5rem;
  background: url('/assets/img/misc/yt_icon_rgb.png?h=83dbcbf39d5c411035f2f9578b2aa646') center / contain no-repeat;
  text-align: center;
}

/* --- placeholder/preview image --- */

.video img {
  object-fit: cover;
  height: 100%;
  width: 100%;
}