/*
   From https://www.aleksandrhovhannisyan.com/blog/fluid-type-scale-with-css-clamp/
   Generates the css clamp function.
   Focused on font-size, but may be used for margins and padding

   Usage:
      clamped(min-size-px, max-size-px, min-browser-width-px, max-browser-width-px)
      font-size: clamped(26px, 36px, 600px, 1200px);
      font-size: clamped(26px, 36px);      //using width default values

*/
/* convenience mixin for bottom-only spacing */
.video-block {
  display: flex;
  flex-direction: row;
  text-align: center;
  gap: min(2em, 3vw);
  justify-content: center;
  align-items: center;
  max-width: 1600px;
}

.video {
  width: 45%;
}

.video-block-vertical {
  gap: min(6em, 10vw);
}

.video-vertical {
  width: 25%;
  max-width: clamp(12.5rem, 11.11vw + 9.03rem, 18.75rem);
}

.video-single {
  width: 70%;
}

.video-square {
  max-width: 500px;
}

.video-review-person {
  font-weight: 500;
  color: #A0C16D;
}

@media only screen and (max-width: 800px) {
  .video-block {
    flex-direction: column;
  }
  .video {
    width: 95%;
  }
  .video-single {
    width: 95%;
  }
  .video-vertical {
    width: 95%;
    max-width: 95%;
  }
}
video {
  height: auto;
  width: 100%;
  object-fit: contain;
  object-position: center;
}

p.extra-large {
  font-size: 1.5rem;
  line-height: 1.3;
}

.text--dark {
  color: #111;
}

/*# sourceMappingURL=video.css.map */