/* Image galleries only. Leave laptop, phone and movie sizing unchanged.
   80px outside each edge; image bounds also reserve the frame and caption. */
@media screen and (min-width: 1200px) and (min-height: 1000px) {
  .cf-cinema .cf-cinema-stage,
  .cf-cinema .cf-cinema-frame {
    max-width: calc(100vw - 160px);
  }
  .cf-cinema:not(.cf-shared-gallery) .cf-cinema-stage img {
    width: auto;
    height: auto;
    min-height: min(810px, calc(100vh - 262px));
    max-width: calc(100vw - 204px);
    max-height: calc(100vh - 262px);
  }
  .cf-cinema.cf-shared-gallery .cf-cinema-stage img {
    max-width: calc(100vw - 204px);
    max-height: calc(100vh - 218px - var(--cf-caption-height, 40px));
  }
  .cf-media-viewer--gallery .cf-media-stage {
    max-width: calc(100vw - 160px);
  }
  .cf-media-viewer--gallery .cf-media-frame {
    display: block;
  }
  .cf-media-viewer--gallery .cf-media-image {
    max-width: calc(100vw - 160px - var(--cf-media-border) - var(--cf-media-border));
    max-height: calc(100vh - 160px - var(--cf-media-border) - var(--cf-media-caption-space));
  }
}

/* Invisible gallery navigation remains invisible when hovered, pressed or focused.
   Scope this to image-navigation hotspots; other controls keep their focus styles. */
html body .cf-cinema .cf-cinema-hit,
html body .cf-cinema .cf-cinema-nav,
html body .cf-media-viewer--gallery .cf-media-hotspot {
  outline: none !important;
  border: 0 !important;
  box-shadow: none !important;
  -webkit-tap-highlight-color: transparent;
}
