/* ------------------------------------------------------------------
   Eigene Anpassungen des Child-Themes.
   Diese Datei gehoert uns und ueberlebt Updates von ns_theme_bootstrap.
   ------------------------------------------------------------------ */

/* Galerie-Grossansicht an den Viewport binden.

   Das Theme setzt auf .image-embed-item nur max-width:100%, begrenzt also
   ausschliesslich die Breite. Fancybox v4 wird hier mit Inline-Content
   aufgerufen (href="#gallery-teaser...") und nicht im Bildmodus, passt das
   Bild deshalb auch nicht selbst an den Bildschirm an. Bei hochformatigen
   oder quadratischen Bildern lief die Grossansicht senkrecht aus dem
   Viewport.

   Der Abzug von 260px ist am Livesystem ausgemessen:
     .image-content-teaser  padding-top   15px
     .fancybox__content     padding     2x16px  (unten reduziert von 36px)
     .fancybox__slide       padding     2x64px
     Thumbnail-Leiste unten              80px
   Damit passt das Bild vollstaendig ins Fenster und der Slide scrollt nicht. */
.fancybox__content {
    padding: 16px;
}

.fancybox-content .image-embed-item {
    max-height: calc(100vh - 260px);
    width: auto;
    height: auto;
    margin: 0 auto;
}

/* Auf niedrigen Fenstern wird die Thumbnail-Leiste ausgeblendet, dann steht
   mehr Hoehe zur Verfuegung. */
@media (max-height: 700px) {
    .fancybox-content .image-embed-item {
        max-height: calc(100vh - 180px);
    }
}