@import url("./sopp/camao/main-styles.css");
@import url("./sopp/vars.css");
@import url("./sopp/container.css");
@import url("./sopp/dialog.css");
@import url("./sopp/product-image-dialog.css");
@import url("./sopp/header.css");
@import url("./sopp/search.css");
@import url("./sopp/header-cart.css");
@import url("./sopp/language.css");
@import url("./sopp/user.css");
@import url("./sopp/content-head.css");
@import url("./sopp/best-selling-info.css");
@import url("./sopp/products-filter.css");
@import url("./sopp/products-list.css");
@import url("./sopp/products-pagination.css");
@import url("./sopp/product-item.css");
@import url("./sopp/cross-selling.css");
@import url("./sopp/farbwelten.css");
@import url("./sopp/wertigkeit.css");
@import url("./sopp/produktvielfalt.css");
@import url("./sopp/product-item-no-btn.css");
@import url("./sopp/knowhow.css");
@import url("./sopp/wirkung.css");
@import url("./sopp/branche-list.css");
@import url("./sopp/branche-item.css");
@import url("./sopp/footer.css");
@import url("./sopp/right-sidebar-nav.css");
@import url("./sopp/product.css");
@import url("./sopp/product-warengruppe.css");
@import url("./sopp/product-selection-color.css");
@import url("./sopp/product-info-price.css");
@import url("./sopp/product-beschreibung.css");
@import url("./sopp/company-specials.css");
@import url("./sopp/navigation-subpages.css");
@import url("./sopp/zitat-mit-bild.css");
@import url("./sopp/cart.css");
@import url("./sopp/checkout-steps.css");
@import url("./sopp/checkout-address.css");
@import url("./sopp/profile-nav.css");
@import url("./sopp/orders.css");
@import url("./sopp/checkout-payment.css");
@import url("./sopp/checkout-summary.css");
@import url("./sopp/checkout-login.css");
@import url("./sopp/form-error.css");
@import url("./sopp/formular-muster.css");
@import url("./sopp/content-info-card.css");
@import url("./sopp/catchphrase-list.css");
@import url("./sopp/linklist-simple.css");
@import url("./sopp/info-studie.css");
@import url("./sopp/list-card-button-link.css");
@import url("./sopp/card-buttonlink.css");
@import url("./sopp/content-info-mit-video.css");
@import url("./sopp/content-text-mit-bild.css");
@import url("./sopp/card-kontakt.css");
@import url("./sopp/content-kontakte.css");
@import url("./sopp/products-list-inline.css");
@import url("./sopp/info-zeitaufwand.css");
@import url("./sopp/content-facts.css");
@import url("./sopp/fact.css");
@import url("./sopp/content-info-bestellzeitpunkt.css");
@import url("./sopp/list-download.css");
@import url("./sopp/card-download.css");
@import url("./sopp/content-list-card-big-picture.css");
@import url("./sopp/card-big-picture.css");
@import url("./sopp/mitarbeiter-list.css");
@import url("./sopp/mitarbeiter-card.css");
@import url("./sopp/content-highlight.css");

html {
  display: flex;
  justify-content: center;
}

body {
  display: flex;
  flex-direction: column;
  background-color: var(--color-background);
  width: 100%;
  min-height: 100vh;
  min-height: 100dvh;
  margin: 0 auto;
}

/* Sticky Footer: #lrn-main fuellt bei kurzem Inhalt (z. B. Warenkorb) die
   Resthoehe, damit der Footer am unteren Rand sitzt. Der Footer liegt dafuer
   in sopp26.htm ausserhalb von #lrn-pagecontent - dort koennte man ihn nur
   per Flex/Grid nach unten druecken, was das Margin-Collapsing zwischen den
   Inhaltsbloecken abschalten wuerde. 100dvh beruecksichtigt mobile
   Browserleisten, 100vh bleibt als Fallback. */
#lrn-main {
  flex: 1 0 auto;
}