/* Main Layout */ /* Sticky Footer Layout nur im Frontend-Theme Struktur (Frontend, ohne Builder-Wrapper um die Widgets): */ html, body { height: 100%; } .sticky-footer-wrapper { min-height: 100vh; display: flex; flex-direction: column; } .sticky-footer-wrapper > main.flex-fill { flex: 1 1 auto; display: flex; flex-direction: column; } .sticky-footer-wrapper > main.flex-fill > .container { flex: 1 1 auto; display: flex; flex-direction: column; } .sticky-footer-wrapper [data-nx-zone="content"] { flex: 1 1 auto; display: flex; flex-direction: column; } /* Falls ein Page-/Content-Builder-Footer (class="nx-footer") als Block in der Content-Zone liegt, wird er an das untere Ende des Viewports geschoben. */ .sticky-footer-wrapper [data-nx-zone="content"] > .nx-footer { margin-top: auto; } /* Hero-Sections aus dem Builder (core_hero) */ .nx-hero { min-height: 100vh; display: flex; align-items: center; position: relative; } .nx-hero > .container { position: relative; z-index: 1; } /* Stärkeres Overlay für Hero mit Hintergrundbild */ .nx-hero .position-absolute.bg-dark.opacity-50 { background-color: rgba(0, 0, 0, 0.7) !important; opacity: 1 !important; } /* Linker Content-Block ähnlich "col-md-6" */ .nx-hero .text-start { max-width: 560px; } @media (max-width: 767.98px) { .nx-hero { min-height: 80vh; } .nx-hero .text-start { max-width: 100%; } } /* Split-Hero (core_hero_split) */ .nx-hero-split { height: 100vh; min-height: 100vh; display: flex; align-items: stretch; width: 100%; margin: 0; padding: 0; } .nx-hero-split .nx-hero-split-text { max-width: 480px; } .nx-hero-split .nx-hero-split-image { min-height: 100vh; background-size: cover; background-position: center; } @media (min-width: 768px) { .nx-hero-split .nx-hero-split-image { clip-path: polygon(10% 0, 100% 0, 100% 100%, 0 100%); } } @media (max-width: 767.98px) { .nx-hero-split { min-height: 100vh; } .nx-hero-split .nx-hero-split-text { max-width: 100%; text-align: center; } } /* Dezenter Hover-Effekt für Navbar-Links + Abstand */ .navbar-nav .nav-link { position: relative; transition: background-color 0.35s ease, color 0.35s ease; } /* Animierte Unterstreichung von links nach rechts */ .navbar-nav .nav-link::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 2px; background-color: currentColor; /* nutzt die aktuelle Textfarbe */ transform: scaleX(0); transform-origin: left center; transition: transform 0.25s ease-out; } .navbar-nav .nav-link:hover::after, .navbar-nav .nav-link:focus::after { transform: scaleX(1); } .navbar-light .navbar-nav .nav-link:hover, .navbar-light .navbar-nav .nav-link:focus { background-color: rgba(15, 23, 42, 0.04); } .navbar-dark .navbar-nav .nav-link:hover, .navbar-dark .navbar-nav .nav-link:focus { background-color: rgba(255, 255, 255, 0.06); } /* Navbar-Brand: kein vertikales Padding, Höhe soll über Logo + Link-Padding kommen */ .navbar-brand { padding-top: 0 !important; padding-bottom: 0 !important; }