.cm--b1-image-with-right-text.video-orientation--portrait .imgwrap img,
.cm--b1-image-with-right-text.video-orientation--portrait .video-area__preview img,
.cm--b2-image-with-left-text.video-orientation--portrait .imgwrap img,
.cm--b2-image-with-left-text.video-orientation--portrait .video-area__preview img {
  aspect-ratio: 9 / 16;
  object-fit: cover;
  width: 100%;
}

@media all and (min-width: 1024px) {
  .cm--b1-image-with-right-text.video-orientation--portrait .imgwrap.video-orientation--portrait,
  .cm--b2-image-with-left-text.video-orientation--portrait .imgwrap.video-orientation--portrait {
    flex: 0 0 38%;
    max-width: 420px;
    min-width: 0 !important;
  }

  .cm--b1-image-with-right-text.video-orientation--portrait .textwrap,
  .cm--b2-image-with-left-text.video-orientation--portrait .textwrap {
    max-width: none;
    min-width: 0;
    flex: 1 1 auto;
  }
}

.cm--f1-double-images-with-text .imgwrap.video-orientation--portrait {
  max-width: 360px;
  margin-left: auto;
  margin-right: auto;
}

.cm--f1-double-images-with-text .imgwrap.video-orientation--portrait video,
.cm--f1-double-images-with-text .imgwrap.video-orientation--portrait img {
  aspect-ratio: 9 / 16;
  object-fit: cover;
}

.video-grid__videos__video.video-orientation--portrait {
  flex: 0 0 calc(22% - 18px);
  max-width: calc(22% - 24px);
}

@media screen and (max-width: 1200px) {
  .video-grid__videos__video.video-orientation--portrait {
    flex: 0 0 calc(30% - 24px);
    max-width: calc(30% - 24px);
  }
}

@media screen and (max-width: 1024px) {
  .video-grid__videos__video.video-orientation--portrait {
    flex: 0 0 calc(45% - 24px);
    max-width: calc(45% - 24px);
  }
}

/* Portrait video lightbox (B1, B2, Video Grid)
   mainClass is on .mfp-wrap; type holder class is on .mfp-container child */
.mfp-wrap.mfp-video-portrait .mfp-iframe-holder .mfp-content {
  width: min(360px, 78vw, calc(72vh * 9 / 16));
  max-width: min(360px, 78vw, calc(72vh * 9 / 16));
  margin-left: auto;
  margin-right: auto;
}

.mfp-wrap.mfp-video-portrait .mfp-iframe-scaler {
  width: 100%;
  height: auto;
  padding-top: 0 !important;
  aspect-ratio: 9 / 16;
  overflow: hidden;
}

.mfp-wrap.mfp-video-portrait .mfp-iframe-scaler iframe {
  background: #000;
}

.mfp-wrap.mfp-video-landscape .mfp-iframe-holder .mfp-content {
  max-width: min(1100px, 92vw);
}

.cm--f1-double-images-with-text .imgwrap video {
  width: 100%;
  height: auto;
  display: block;
  vertical-align: top;
}