/* auto-generated by admin settings */
@media (min-width: 769px) { header .header-inner { max-width: min(1780px, calc(100vw - 72px)) !important; display: grid !important; grid-template-columns: clamp(220px, 17vw, 340px) minmax(0, 1fr) 1px !important; column-gap: clamp(34px, 5vw, 128px) !important; align-items: center !important; justify-content: stretch !important; position: relative !important; padding: clamp(20px, 2.2vw, 38px) clamp(28px, 4vw, 72px) clamp(22px, 2.7vw, 48px) !important; } header .logo { margin: 0 !important; max-width: 160px !important; width: 160px !important; display: block !important; flex: 0 0 auto !important; align-self: center !important; justify-self: start !important; } header .nav-wrapper { width: auto !important; margin: 0 !important; position: absolute !important; left: 50% !important; top: 50% !important; transform: translate(-50%, -50%) !important; justify-self: auto !important; align-self: auto !important; z-index: 4 !important; } header nav.nav { width: auto !important; padding: 0 !important; background: transparent !important; } header .nav .container { width: auto !important; max-width: none !important; justify-content: center !important; padding: 0 !important; } header .nav .menu { width: auto !important; margin: 0 !important; justify-content: center !important; gap: clamp(34px, 2.6vw, 50px) !important; } header .nav a { padding: 10px 0 !important; font-family: "Arial Narrow", Arial, sans-serif !important; font-size: 23.5px !important; line-height: 1.1 !important; } header .nav .dropdown::after { content: "" !important; position: absolute !important; left: -24px !important; right: -24px !important; top: 100% !important; height: 16px !important; z-index: 99 !important; } header .nav .dropdown-menu { top: calc(100% + 2px) !important; left: 50% !important; transform: translateX(-50%) !important; min-width: 230px !important; width: max-content !important; padding: 12px 0 !important; border: 1px solid rgba(18, 31, 72, 0.08) !important; border-radius: 10px !important; box-shadow: 0 16px 32px rgba(18, 31, 72, 0.16), 0 4px 10px rgba(18, 31, 72, 0.08) !important; overflow: hidden !important; } header .nav .dropdown-menu li { width: 100% !important; } header .nav .dropdown-menu li a { padding: 10px 18px !important; color: #000 !important; font-size: 19.5px !important; line-height: 1.15 !important; text-align: left !important; white-space: nowrap !important; } header .nav .dropdown-menu li a:hover { background: #f7f8fc !important; } header .contact { max-width: none !important; width: 1px !important; padding: 0 !important; justify-self: end !important; } }
header .logo > a { display: block !important; line-height: 0 !important; }
header .logo > a > img.logo { width: 100% !important; max-width: 100% !important; height: auto !important; margin: 0 !important; object-fit: contain !important; }
.contact { display: flex !important; align-items: center !important; justify-content: flex-end !important; gap: 12px !important; position: relative !important; flex-wrap: wrap !important; max-width: 54% !important; padding-top: 16px !important; box-sizing: border-box !important; }
.contact > a { display: inline-flex !important; align-items: center !important; gap: 8px !important; font-size: 18px !important; line-height: 1.3 !important; font-weight: 500 !important; white-space: nowrap !important; }
.contact > a img { width: 22px !important; height: 22px !important; display: block !important; }
.contact > b { color: #dd3333 !important; font-size: 20px !important; line-height: 1 !important; font-weight: 400 !important; padding-top: 1px !important; }
nav.nav .menu { margin: 0 !important; align-items: center !important; }
@media (max-width: 768px) { .nav .menu li a { font-size: 22.5px !important; } .dropdown-menu li a { font-size: 19.5px !important; } }
@media (max-width: 768px) { header .header-inner { padding: 8px 12px 6px !important; display: flex !important; flex-direction: row !important; align-items: center !important; justify-content: flex-start !important; gap: 10px !important; min-height: 0 !important; position: relative !important; } header .logo { margin: 0 !important; margin-left: 0 !important; width: 110px !important; max-width: 110px !important; flex: 0 0 110px !important; align-self: center !important; } header .logo > a > img.logo { width: 100% !important; max-width: 100% !important; height: auto !important; } .contact { flex: 1 1 auto !important; min-width: 0 !important; max-width: none !important; width: auto !important; display: flex !important; flex-direction: column !important; align-items: flex-start !important; justify-content: center !important; gap: 4px !important; padding: 0 42px 0 0 !important; flex-wrap: nowrap !important; } .contact > a { display: flex !important; max-width: 100% !important; min-width: 0 !important; overflow: hidden !important; text-overflow: ellipsis !important; font-size: clamp(12px, 3.35vw, 14px) !important; line-height: 1.12 !important; gap: 6px !important; white-space: nowrap !important; } .contact > a img { width: 16px !important; height: 16px !important; flex: 0 0 16px !important; } .contact > b { display: none !important; } .contact .mobile-nav-toggle { display: block !important; position: absolute !important; top: 50% !important; right: 2px !important; transform: translateY(-50%) !important; z-index: 1001 !important; font-size: 26px !important; line-height: 1 !important; padding: 6px !important; color: #1a1e35 !important; } }
@media (max-width: 380px) { header .logo { width: 100px !important; max-width: 100px !important; flex-basis: 100px !important; } .contact { gap: 3px !important; padding-right: 38px !important; } .contact > a { font-size: 11px !important; gap: 5px !important; } .contact > a img { width: 14px !important; height: 14px !important; flex-basis: 14px !important; } .contact .mobile-nav-toggle { font-size: 24px !important; right: 0 !important; } }
.nav-wrapper, .nav { background-color: #ffffff !important; }
.nav a, .nav .menu > li > a { color: #000000 !important; }
.nav .dropdown-menu a { color: #000000 !important; }
header .contact > .kontakt-email, header .contact > .kontakt-telefon, header .contact > b { display: none !important; }
#banner { background-color: #feffff !important; background-image: url("/images/admin-uploads/banner-background.png?v=1784812319563") !important; background-size: 100% auto !important; background-position: center top !important; background-repeat: no-repeat !important; }
#banner:has(.slideshow-container) { overflow: hidden !important; min-height: max(420px, calc(100svh - var(--ozana-banner-offset, 190px))) !important; box-sizing: border-box !important; display: flex !important; flex-direction: column !important; align-items: center !important; justify-content: center !important; gap: clamp(24px, 4vh, 46px) !important; padding: clamp(36px, 6vw, 104px) 20px clamp(44px, 6vw, 96px) !important; }
#banner:has(.slideshow-container) .slideshow-container { width: min(1100px, calc(100vw - clamp(24px, 6vw, 80px))) !important; max-width: 1100px !important; max-height: none !important; height: auto !important; aspect-ratio: 11 / 3 !important; margin: 0 auto !important; }
#banner:has(.slideshow-container) .scroll-btn { margin: 0 !important; align-self: center !important; }
.slideshow-container a, .slideshow-container picture { display: block !important; width: 100% !important; height: 100% !important; }
.slide img { width: 100% !important; height: 100% !important; object-fit: contain !important; object-position: center center !important; -webkit-mask-image: linear-gradient(to bottom, transparent 0, #000 22px, #000 calc(100% - 22px), transparent 100%) !important; mask-image: linear-gradient(to bottom, transparent 0, #000 22px, #000 calc(100% - 22px), transparent 100%) !important; }
@media (max-width: 768px) { #banner:has(.slideshow-container) { min-height: max(560px, calc(100svh - var(--ozana-banner-offset, 130px))) !important; box-sizing: border-box !important; display: flex !important; flex-direction: column !important; align-items: center !important; justify-content: center !important; gap: clamp(20px, 5vh, 42px) !important; padding: clamp(24px, 6vh, 62px) 12px clamp(34px, 7vh, 74px) !important; } #banner:has(.slideshow-container) .slideshow-container { width: min(100%, calc(100vw - 24px)) !important; margin: 0 auto !important; } #banner:has(.slideshow-container) .scroll-btn { margin: 0 !important; align-self: center !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; min-width: 170px !important; } }
.scroll-btn, #scrollToTopBtn { background-color: #dd3333 !important; }
.line, nav.nav a::after, .kontakt-email::after, .kontakt-telefon::after { background-color: #dd3333 !important; }
.slideshow-container { border: 0 !important; border-radius: 0 !important; box-sizing: border-box; isolation: isolate; box-shadow: none !important; }
.slideshow-container::after { content: none !important; }
.services .card { background-color: #f8faff !important; border-color: #dbe1ff !important; }
.services .card:hover { background-color: #eef3ff !important; border-color: #dd3333 !important; }
.services .card button:hover { background-color: #dd3333 !important; border-color: #dd3333 !important; }