.mod_navigation.dropdown {
overflow: visible;
}
.mod_navigation li.mm_container > a, .mod_navigation li.mm_container > span, .mod_navigation li.mm_container > strong {
position: relative;
}
.mod_navigation li.mm_container:not(.mm_container_onClickOnly):hover > a:after, .mod_navigation li.mm_container:not(.mm_container_onClickOnly):hover > strong:after, .mod_navigation li.mm_container.mm_container_onClickOnly.mm_isActive > a:after, .mod_navigation li.mm_container.mm_container_onClickOnly.mm_isActive > strong:after {
/* hide (overlay)border bottom of main menu */
content: "";
position: absolute;
left: 0;
right: 0;
bottom: -3px;
height: 3px;
background-color: #F4F2F0;
z-index: 110;
}
.mod_navigation li.mm_container .mm_dropdown {
display: none;
position: absolute;
left: 0;
right: 0;
z-index: 100;
}
.mod_navigation li.mm_container .mm_dropdown > .inner {
padding: 1rem 2rem;
border: 1px solid #E5DFDC;
background-color: rgba(244, 242, 240, 0.95);
overflow: hidden;
}
.mod_navigation li.mm_container:not(.mm_container_onClickOnly):hover .mm_dropdown, .mod_navigation li.mm_container.mm_container_onClickOnly .mm_isActive ~ .mm_dropdown {
display: block;
}
@charset "UTF-8";/*!
* mmenu.js
* mmenujs.com
*
* Copyright (c) Fred Heusschen
* frebsite.nl
*
* License: CC-BY-NC-4.0
* http://creativecommons.org/licenses/by-nc/4.0/
*/:root{--mm-lineheight:22px}.mm-hidden{display:none!important}.mm-wrapper{overflow-x:hidden;position:relative}.mm-menu,.mm-menu *,.mm-menu :after,.mm-menu :before{-webkit-transition-property:none;-o-transition-property:none;transition-property:none;-webkit-transition-duration:.4s;-o-transition-duration:.4s;transition-duration:.4s;-webkit-transition-timing-function:ease;-o-transition-timing-function:ease;transition-timing-function:ease}:root{--mm-blocker-visibility-delay:0.4s;--mm-blocker-opacity-delay:0s}.mm-blocker{display:block;position:absolute;bottom:100%;top:0;right:0;left:0;z-index:3;opacity:0;background:var(--mm-color-background);-webkit-transition:bottom 0s ease var(--mm-blocker-visibility-delay),width .4s ease,opacity .4s ease var(--mm-blocker-opacity-delay),-webkit-transform .4s ease;transition:bottom 0s ease var(--mm-blocker-visibility-delay),width .4s ease,opacity .4s ease var(--mm-blocker-opacity-delay),-webkit-transform .4s ease;-o-transition:bottom 0s ease var(--mm-blocker-visibility-delay),width .4s ease,opacity .4s ease var(--mm-blocker-opacity-delay),transform .4s ease;transition:bottom 0s ease var(--mm-blocker-visibility-delay),width .4s ease,opacity .4s ease var(--mm-blocker-opacity-delay),transform .4s ease;transition:bottom 0s ease var(--mm-blocker-visibility-delay),width .4s ease,opacity .4s ease var(--mm-blocker-opacity-delay),transform .4s ease,-webkit-transform .4s ease}.mm-blocker:focus-visible{opacity:.75}.mm-btn{-webkit-box-flex:0;-ms-flex-positive:0;flex-grow:0;-ms-flex-negative:0;flex-shrink:0;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;position:relative;width:50px;padding:0}.mm-btn--next,[dir=rtl] .mm-btn--prev{--mm-btn-rotate:135deg}.mm-btn--prev,[dir=rtl] .mm-btn--next{--mm-btn-rotate:-45deg}.mm-btn--next:after,.mm-btn--prev:before{content:"";display:block;position:absolute;top:0;bottom:0;width:8px;height:8px;margin:auto;-webkit-box-sizing:border-box;box-sizing:border-box;border:2px solid var(--mm-color-icon);border-bottom:none;border-right:none;-webkit-transform:rotate(var(--mm-btn-rotate));-ms-transform:rotate(var(--mm-btn-rotate));transform:rotate(var(--mm-btn-rotate))}.mm-btn--prev:before{inset-inline-start:23px}.mm-btn--next:after{inset-inline-end:23px}.mm-btn--close:before{content:"×";font-size:150%}.mm-btnreset{padding:0;background:0 0;border:none;cursor:pointer}.mm-divider{-o-text-overflow:ellipsis;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;position:-webkit-sticky;position:sticky;z-index:2;top:0;min-height:var(--mm-lineheight);padding:calc((var(--mm-listitem-size) * .65 - var(--mm-lineheight)) * .5) 20px;font-size:75%;text-transform:uppercase;background:var(--mm-color-background);background-image:-webkit-gradient(linear,left top,left bottom,from(var(--mm-color-background-highlight)),to(var(--mm-color-background-highlight)));background-image:-o-linear-gradient(var(--mm-color-background-highlight),var(--mm-color-background-highlight));background-image:linear-gradient(var(--mm-color-background-highlight),var(--mm-color-background-highlight));opacity:1;-webkit-transition-property:opacity;-o-transition-property:opacity;transition-property:opacity}.mm-navbar:not(.mm-hidden)~.mm-listview .mm-divider{top:var(--mm-navbar-size)}:root{--mm-listitem-size:50px}.mm-listitem{display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;position:relative;padding:0;margin:0;color:var(--mm-color-text);border-color:var(--mm-color-border)}.mm-listitem:after{content:"";border-color:inherit;border-bottom-width:1px;border-bottom-style:solid;display:block;position:absolute;inset-inline-start:20px;inset-inline-end:0;bottom:0}.mm-listitem__btn,.mm-listitem__text{padding:calc((var(--mm-listitem-size) - var(--mm-lineheight))/ 2) 0}.mm-listitem__text{-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;-ms-flex-preferred-size:10%;flex-basis:10%;display:block;padding-left:20px;padding-right:20px;-o-text-overflow:ellipsis;text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.mm-listitem__btn{display:block;position:relative;width:auto;-webkit-padding-end:50px;padding-inline-end:50px;border-color:inherit;background:rgba(3,2,1,0)}.mm-listitem__btn:not(.mm-listitem__text){border-left-width:1px;border-left-style:solid}.mm-listitem--selected>.mm-listitem__text{background:var(--mm-color-background-emphasis)}.mm-listitem--opened>.mm-listitem__btn,.mm-listitem--opened>.mm-panel{background:var(--mm-color-background-highlight)}.mm-listview{list-style:none;display:block;padding:0;margin:0}.mm-menu{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;padding:0;margin:0;position:absolute;top:0;right:0;bottom:0;left:0;z-index:0;-ms-scroll-chaining:none;overscroll-behavior:none;background:var(--mm-color-background);border-color:var(--mm-color-border);color:var(--mm-color-text);line-height:var(--mm-lineheight);-webkit-tap-highlight-color:var(--mm-color-background-emphasis);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.mm-menu ::-webkit-input-placeholder{color:var(--mm-color-text-dimmed)}.mm-menu ::-moz-placeholder{color:var(--mm-color-text-dimmed)}.mm-menu :-ms-input-placeholder{color:var(--mm-color-text-dimmed)}.mm-menu ::-ms-input-placeholder{color:var(--mm-color-text-dimmed)}.mm-menu ::placeholder{color:var(--mm-color-text-dimmed)}.mm-menu,.mm-menu *{-webkit-box-sizing:border-box;box-sizing:border-box}.mm-menu :focus,.mm-menu :focus-visible,.mm-menu:focus,.mm-menu:focus-visible{outline:0}.mm-menu a,.mm-menu button,.mm-menu label{color:inherit}.mm-menu a:focus,.mm-menu button:focus,.mm-menu label:focus{outline:0}.mm-menu a:focus-visible,.mm-menu button:focus-visible,.mm-menu label:focus-visible{outline:2px solid var(--mm-color-focusring);outline-offset:-5px}.mm-menu input:focus,.mm-menu input:focus-visible,.mm-menu select:focus,.mm-menu select:focus-visible,.mm-menu textarea:focus,.mm-menu textarea:focus-visible{outline:2px solid var(--mm-color-focusring);outline-offset:2px}.mm-menu a,.mm-menu a:active,.mm-menu a:hover,.mm-menu a:link,.mm-menu a:visited{text-decoration:none;color:inherit}:root{--mm-navbar-size:50px}.mm-navbar{display:-webkit-box;display:-ms-flexbox;display:flex;position:-webkit-sticky;position:sticky;top:0;z-index:2;min-height:var(--mm-navbar-size);padding-top:env(safe-area-inset-top);color:var(--mm-color-text-dimmed);text-align:center;opacity:1;background:var(--mm-color-background);border-bottom:1px solid var(--mm-color-border);-webkit-transition-property:opacity;-o-transition-property:opacity;transition-property:opacity}.mm-navbar>*{-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-sizing:border-box;box-sizing:border-box}.mm-navbar__btn{-webkit-box-flex:0;-ms-flex-positive:0;flex-grow:0}.mm-navbar__title{-webkit-box-flex:1;-ms-flex:1 1 50%;flex:1 1 50%;display:-webkit-box;display:-ms-flexbox;display:flex;padding:0 20px;overflow:hidden}.mm-navbar__title[href="#"]{pointer-events:none}.mm-navbar__title>span{-o-text-overflow:ellipsis;text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.mm-btn.mm-hidden+.mm-navbar__title:not(:last-child){-webkit-padding-start:60px;padding-inline-start:60px;-webkit-padding-end:10px;padding-inline-end:10px}.mm-btn:not(.mm-hidden)+.mm-navbar__title:last-child{-webkit-padding-start:10px;padding-inline-start:10px;-webkit-padding-end:60px;padding-inline-end:60px}.mm-panel{--mm-panel-child-offset:100%;--mm-panel-parent-offset:-30%;position:absolute;left:0;right:0;top:0;bottom:0;z-index:1;-webkit-overflow-scrolling:touch;overflow:hidden;overflow-y:auto;-ms-scroll-chaining:none;overscroll-behavior:contain;color:var(--mm-color-text);border-color:var(--mm-color-border);background:var(--mm-color-background);-webkit-transform:translate3d(var(--mm-panel-child-offset),0,0);transform:translate3d(var(--mm-panel-child-offset),0,0);-webkit-transition-property:inset-inline-start,-webkit-transform;transition-property:inset-inline-start,-webkit-transform;-o-transition-property:transform,inset-inline-start;transition-property:transform,inset-inline-start;transition-property:transform,inset-inline-start,-webkit-transform}[dir=rtl] .mm-panel{--mm-panel-child-offset:-100%;--mm-panel-parent-offset:30%}.mm-panel:after{content:"";display:block;height:var(--mm-listitem-size)}.mm-panel:focus{outline:0}.mm-panel--opened{z-index:2;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0);-webkit-transition-delay:0s;-o-transition-delay:0s;transition-delay:0s}.mm-panel--parent{-webkit-transform:translate3d(var(--mm-panel-parent-offset),0,0);transform:translate3d(var(--mm-panel-parent-offset),0,0);z-index:0}.mm-panel--highest{z-index:3}.mm-menu--opened .mm-panel--noanimation{-webkit-transition:none!important;-o-transition:none!important;transition:none!important;-webkit-transition-duration:0s!important;-o-transition-duration:0s!important;transition-duration:0s!important}.mm-panel__content{padding:20px}.mm-panels{-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;position:relative;height:100%;overflow:hidden;background:var(--mm-color-background);border-color:var(--mm-color-border);color:var(--mm-color-text)}.mm-panels:focus{outline:0}:root{--mm-toggle-size:34px}.mm-toggle{display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-item-align:center;align-self:center;-webkit-box-flex:calc(var(--mm-toggle-size) * 1.75);-ms-flex:calc(var(--mm-toggle-size) * 1.75) 0 0px;flex:calc(var(--mm-toggle-size) * 1.75) 0 0;height:var(--mm-toggle-size);-webkit-margin-end:10px;margin-inline-end:10px;-webkit-appearance:none!important;-moz-appearance:none!important;appearance:none!important;border:none!important;border-radius:var(--mm-toggle-size);border:var(--mm-color-border);background:var(--mm-color-border);cursor:pointer;-webkit-transition-property:background-color;-o-transition-property:background-color;transition-property:background-color}.mm-toggle:before{content:"";aspect-ratio:1;margin:2px;border-radius:100%;background:var(--mm-color-background);-webkit-transition-property:-webkit-transform;transition-property:-webkit-transform;-o-transition-property:transform;transition-property:transform;transition-property:transform,-webkit-transform}.mm-toggle:checked{background:#4bd963}.mm-toggle:checked:before{-webkit-transform:translateX(calc(var(--mm-toggle-size) * .75));-ms-transform:translateX(calc(var(--mm-toggle-size) * .75));transform:translateX(calc(var(--mm-toggle-size) * .75))}[dir=rtl] .mm-toggle:checked:before{-webkit-transform:translateX(calc(var(--mm-toggle-size) * -.75));-ms-transform:translateX(calc(var(--mm-toggle-size) * -.75));transform:translateX(calc(var(--mm-toggle-size) * -.75))}.mm-listitem--vertical>.mm-panel{position:static;width:100%;padding:10px 0 10px 20px;-webkit-transform:none!important;-ms-transform:none!important;transform:none!important;-webkit-transition:none!important;-o-transition:none!important;transition:none!important}.mm-listitem--vertical>.mm-panel:after{content:none;display:none}.mm-listitem--vertical:not(.mm-listitem--opened)>.mm-panel{display:none}.mm-listitem--vertical>.mm-listitem__btn{height:var(--mm-listitem-size);bottom:auto}.mm-listitem--vertical .mm-listitem:last-child:after{border-color:transparent}.mm-listitem--opened>.mm-listitem__btn:after{-webkit-transform:rotate(225deg);-ms-transform:rotate(225deg);transform:rotate(225deg);right:19px}:root{--mm-size:80%;--mm-min-size:240px;--mm-max-size:440px}.mm-menu--offcanvas{position:fixed;z-index:0}.mm-page{-webkit-box-sizing:border-box;box-sizing:border-box;min-height:100vh;background:inherit}:where(.mm-slideout){position:relative;z-index:1;width:100%;-webkit-transition-duration:.4s;-o-transition-duration:.4s;transition-duration:.4s;-webkit-transition-timing-function:ease;-o-transition-timing-function:ease;transition-timing-function:ease;-webkit-transition-property:width,-webkit-transform;transition-property:width,-webkit-transform;-o-transition-property:width,transform;transition-property:width,transform;transition-property:width,transform,-webkit-transform}.mm-wrapper--opened,.mm-wrapper--opened body{overflow:hidden}.mm-wrapper__blocker{background:rgba(0,0,0,.4)}.mm-wrapper--opened .mm-wrapper__blocker{--mm-blocker-visibility-delay:0s;--mm-blocker-opacity-delay:0.4s;bottom:0;opacity:.5}.mm-menu{--mm-translate-horizontal:0;--mm-translate-vertical:0}.mm-menu--position-left,.mm-menu--position-left-front{right:auto}.mm-menu--position-right,.mm-menu--position-right-front{left:auto}.mm-menu--position-left,.mm-menu--position-left-front,.mm-menu--position-right,.mm-menu--position-right-front{width:clamp(var(--mm-min-size),var(--mm-size),var(--mm-max-size))}.mm-menu--position-left-front{--mm-translate-horizontal:-100%}.mm-menu--position-right-front{--mm-translate-horizontal:100%}.mm-menu--position-top{bottom:auto}.mm-menu--position-bottom{top:auto}.mm-menu--position-bottom,.mm-menu--position-top{width:100%;height:clamp(var(--mm-min-size),var(--mm-size),var(--mm-max-size))}.mm-menu--position-top{--mm-translate-vertical:-100%}.mm-menu--position-bottom{--mm-translate-vertical:100%}.mm-menu--position-bottom,.mm-menu--position-left-front,.mm-menu--position-right-front,.mm-menu--position-top{z-index:2;-webkit-transform:translate3d(var(--mm-translate-horizontal),var(--mm-translate-vertical),0);transform:translate3d(var(--mm-translate-horizontal),var(--mm-translate-vertical),0);-webkit-transition-property:-webkit-transform;transition-property:-webkit-transform;-o-transition-property:transform;transition-property:transform;transition-property:transform,-webkit-transform}.mm-menu--position-bottom.mm-menu--opened,.mm-menu--position-left-front.mm-menu--opened,.mm-menu--position-right-front.mm-menu--opened,.mm-menu--position-top.mm-menu--opened{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}.mm-wrapper--position-left{--mm-translate-horizontal:clamp(
var(--mm-min-size),
var(--mm-size),
var(--mm-max-size)
)}.mm-wrapper--position-right{--mm-translate-horizontal:clamp(
calc(-1 * var(--mm-max-size)),
calc(-1 * var(--mm-size)),
calc(-1 * var(--mm-min-size))
)}.mm-wrapper--position-left .mm-slideout,.mm-wrapper--position-right .mm-slideout{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}.mm-wrapper--position-left.mm-wrapper--opened .mm-slideout,.mm-wrapper--position-right.mm-wrapper--opened .mm-slideout{-webkit-transform:translate3d(var(--mm-translate-horizontal),0,0);transform:translate3d(var(--mm-translate-horizontal),0,0)}.mm-wrapper--position-bottom .mm-wrapper__blocker,.mm-wrapper--position-left-front .mm-wrapper__blocker,.mm-wrapper--position-right-front .mm-wrapper__blocker,.mm-wrapper--position-top .mm-wrapper__blocker{z-index:1}.mm-menu--theme-light{--mm-color-background:#f3f3f3;--mm-color-border:rgb(0 0 0 / 0.15);--mm-color-icon:rgb(0 0 0 / 0.4);--mm-color-text:rgb(0 0 0 / 0.8);--mm-color-text-dimmed:rgb(0 0 0 / 0.4);--mm-color-background-highlight:rgb(0 0 0 / 0.05);--mm-color-background-emphasis:rgb(255 255 255 / 0.75);--mm-color-focusring:#06c}.mm-menu--theme-light-contrast{--mm-color-background:#f3f3f3;--mm-color-border:rgb(0 0 0 / 0.5);--mm-color-icon:rgb(0 0 0 / 0.5);--mm-color-text:#000;--mm-color-text-dimmed:rgb(0 0 0 / 0.7);--mm-color-background-highlight:rgb(0 0 0 / 0.05);--mm-color-background-emphasis:rgb(255 255 255 / 0.9);--mm-color-focusring:#06c}.mm-menu--theme-dark{--mm-color-background:#333;--mm-color-border:rgb(0, 0, 0, 0.4);--mm-color-icon:rgb(255, 255, 255, 0.4);--mm-color-text:rgb(255, 255, 255, 0.8);--mm-color-text-dimmed:rgb(255, 255, 255, 0.4);--mm-color-background-highlight:rgb(255, 255, 255, 0.08);--mm-color-background-emphasis:rgb(0, 0, 0, 0.1);--mm-color-focusring:#06c}.mm-menu--theme-dark-contrast{--mm-color-background:#333;--mm-color-border:rgb(255 255 255 / 0.5);--mm-color-icon:rgb(255 255 255 / 0.5);--mm-color-text:#fff;--mm-color-text-dimmed:rgb(255 255 255 / 0.7);--mm-color-background-highlight:rgb(255 255 255 / 0.1);--mm-color-background-emphasis:rgb(0 0 0 / 0.3);--mm-color-focusring:#06c}.mm-menu--theme-white{--mm-color-background:#fff;--mm-color-border:rgb(0 0 0 / 0.15);--mm-color-icon:rgb(0 0 0 / 0.3);--mm-color-text:rgb(0 0 0 / 0.8);--mm-color-text-dimmed:rgb(0 0 0 / 0.3);--mm-color-background-highlight:rgb(0 0 0 / 0.06);--mm-color-background-emphasis:rgb(0 0 0 / 0.03);--mm-color-focusring:#06c}.mm-menu--theme-white-contrast{--mm-color-background:#fff;--mm-color-border:rgb(0 0 0 / 0.5);--mm-color-icon:rgb(0 0 0 / 0.5);--mm-color-text:#000;--mm-color-text-dimmed:rgb(0 0 0 / 0.7);--mm-color-background-highlight:rgb(0 0 0 / 0.07);--mm-color-background-emphasis:rgb(0 0 0 / 0.035);--mm-color-focusring:#06c}.mm-menu--theme-black{--mm-color-background:#000;--mm-color-border:rgb(255 255 255 / 0.2);--mm-color-icon:rgb(255 255 255 / 0.4);--mm-color-text:rgb(255 255 255 / 0.7);--mm-color-text-dimmed:rgb(255 255 255 / 0.4);--mm-color-background-highlight:rgb(255 255 255 / 0.1);--mm-color-background-emphasis:rgb(255 255 255 / 0.06);--mm-color-focusring:#06c}.mm-menu--theme-black-contrast{--mm-color-background:#000;--mm-color-border:rgb(255 255 255 / 0.5);--mm-color-icon:rgb(255 255 255 / 0.5);--mm-color-text:#fff;--mm-color-text-dimmed:rgb(255 255 255 / 0.6);--mm-color-background-highlight:rgb(255 255 255 / 0.125);--mm-color-background-emphasis:rgb(255 255 255 / 0.1);--mm-color-focusring:#06c}.mm-counter{display:block;-webkit-padding-start:20px;padding-inline-start:20px;float:right;color:var(--mm-color-text-dimmed)}[dir=rtl] .mm-counter{float:left}:root{--mm-iconbar-size:50px}.mm-menu--iconbar-left .mm-navbars,.mm-menu--iconbar-left .mm-panels{margin-left:var(--mm-iconbar-size)}.mm-menu--iconbar-right .mm-navbars,.mm-menu--iconbar-right .mm-panels{margin-right:var(--mm-iconbar-size)}.mm-iconbar{display:none;position:absolute;top:0;bottom:0;z-index:2;width:var(--mm-iconbar-size);overflow:hidden;-webkit-box-sizing:border-box;box-sizing:border-box;border:0 solid;border-color:var(--mm-color-border);background:var(--mm-color-background);color:var(--mm-color-text-dimmed);text-align:center}.mm-menu--iconbar-left .mm-iconbar,.mm-menu--iconbar-right .mm-iconbar{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between}.mm-menu--iconbar-left .mm-iconbar{border-right-width:1px;left:0}.mm-menu--iconbar-right .mm-iconbar{border-left-width:1px;right:0}.mm-iconbar__bottom,.mm-iconbar__top{width:100%;-webkit-overflow-scrolling:touch;overflow:hidden;overflow-y:auto;-ms-scroll-chaining:none;overscroll-behavior:contain}.mm-iconbar__bottom>*,.mm-iconbar__top>*{-webkit-box-sizing:border-box;box-sizing:border-box;display:block;padding:calc((var(--mm-iconbar-size) - var(--mm-lineheight))/ 2) 0}.mm-iconbar__bottom a,.mm-iconbar__bottom a:hover,.mm-iconbar__top a,.mm-iconbar__top a:hover{text-decoration:none}.mm-iconbar__tab--selected{background:var(--mm-color-background-emphasis)}:root{--mm-iconpanel-size:50px}.mm-panel--iconpanel-0{inset-inline-start:calc(0 * var(--mm-iconpanel-size))}.mm-panel--iconpanel-1{inset-inline-start:calc(1 * var(--mm-iconpanel-size))}.mm-panel--iconpanel-2{inset-inline-start:calc(2 * var(--mm-iconpanel-size))}.mm-panel--iconpanel-3{inset-inline-start:calc(3 * var(--mm-iconpanel-size))}.mm-panel--iconpanel-4{inset-inline-start:calc(4 * var(--mm-iconpanel-size))}.mm-panel--iconpanel-first~.mm-panel{inset-inline-start:var(--mm-iconpanel-size)}.mm-menu--iconpanel .mm-panel--parent .mm-divider,.mm-menu--iconpanel .mm-panel--parent .mm-navbar{opacity:0}.mm-menu--iconpanel .mm-panels>.mm-panel--parent{overflow-y:hidden;-webkit-transform:unset;-ms-transform:unset;transform:unset}.mm-menu--iconpanel .mm-panels>.mm-panel:not(.mm-panel--iconpanel-first):not(.mm-panel--iconpanel-0){border-inline-start-width:1px;border-inline-start-style:solid}.mm-navbars{-ms-flex-negative:0;flex-shrink:0}.mm-navbars .mm-navbar{position:relative;padding-top:0;border-bottom:none}.mm-navbars--top{border-bottom:1px solid var(--mm-color-border)}.mm-navbars--top .mm-navbar:first-child{padding-top:env(safe-area-inset-top)}.mm-navbars--bottom{border-top:1px solid var(--mm-color-border)}.mm-navbars--bottom .mm-navbar:last-child{padding-bottom:env(safe-area-inset-bottom)}.mm-navbar__breadcrumbs{-o-text-overflow:ellipsis;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;-webkit-box-flex:1;-ms-flex:1 1 50%;flex:1 1 50%;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start;padding:0 20px;overflow-x:auto;-webkit-overflow-scrolling:touch}.mm-navbar__breadcrumbs>*{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-padding-end:6px;padding-inline-end:6px}.mm-navbar__breadcrumbs>a{text-decoration:underline}.mm-navbar__breadcrumbs:not(:last-child){-webkit-padding-end:0;padding-inline-end:0}.mm-btn:not(.mm-hidden)+.mm-navbar__breadcrumbs{-webkit-padding-start:0;padding-inline-start:0}.mm-navbar__tab{padding:0 10px;border:1px solid transparent}.mm-navbar__tab--selected{background:var(--mm-color-background)}.mm-navbar__tab--selected:not(:first-child){border-inline-start-color:var(--mm-color-border)}.mm-navbar__tab--selected:not(:last-child){border-inline-end-color:var(--mm-color-border)}.mm-navbars--top.mm-navbars--has-tabs{border-bottom:none}.mm-navbars--top.mm-navbars--has-tabs .mm-navbar{background:var(--mm-color-background-emphasis)}.mm-navbars--top.mm-navbars--has-tabs .mm-navbar--tabs~.mm-navbar{background:var(--mm-color-background)}.mm-navbars--top.mm-navbars--has-tabs .mm-navbar:not(.mm-navbar--tabs):last-child{border-bottom:1px solid var(--mm-color-border)}.mm-navbars--top .mm-navbar__tab{border-bottom-color:var(--mm-color-border)}.mm-navbars--top .mm-navbar__tab--selected{border-top-color:var(--mm-color-border);border-bottom-color:transparent}.mm-navbars--bottom.mm-navbar--has-tabs{border-top:none}.mm-navbars--bottom.mm-navbar--has-tabs .mm-navbar{background:var(--mm-color-background)}.mm-navbars--bottom.mm-navbar--has-tabs .mm-navbar--tabs,.mm-navbars--bottom.mm-navbar--has-tabs .mm-navbar--tabs~.mm-navbar{background:var(--mm-color-background-emphasis)}.mm-navbars--bottom .mm-navbar__tab{border-top-color:var(--mm-color-border)}.mm-navbars--bottom .mm-navbar__tab--selected{border-bottom-color:var(--mm-color-border);border-top-color:transparent}.mm-searchfield{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;height:var(--mm-navbar-size);padding:0;overflow:hidden}.mm-searchfield__input{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-flex:1;-ms-flex:1;flex:1;-webkit-box-align:center;-ms-flex-align:center;align-items:center;position:relative;width:100%;max-width:100%;padding:0 10px;-webkit-box-sizing:border-box;box-sizing:border-box}.mm-searchfield__input input{display:block;width:100%;max-width:100%;height:calc(var(--mm-navbar-size) * .7);min-height:auto;max-height:auto;margin:0;padding:0 10px;-webkit-box-sizing:border-box;box-sizing:border-box;border:none;border-radius:4px;line-height:calc(var(--mm-navbar-size) * .7);font:inherit;font-size:inherit}.mm-searchfield__input input,.mm-searchfield__input input:focus,.mm-searchfield__input input:hover{background:var(--mm-color-background-highlight);color:var(--mm-color-text)}.mm-menu[class*=-contrast] .mm-searchfield__input input{border:1px solid var(--mm-color-border)}.mm-searchfield__input input::-ms-clear{display:none}.mm-searchfield__btn{display:none;position:absolute;inset-inline-end:0;top:0;bottom:0}.mm-searchfield--searching .mm-searchfield__btn{display:block}.mm-searchfield__cancel{display:block;position:relative;-webkit-margin-end:-100px;margin-inline-end:-100px;-webkit-padding-start:5px;padding-inline-start:5px;-webkit-padding-end:20px;padding-inline-end:20px;visibility:hidden;line-height:var(--mm-navbar-size);text-decoration:none;-webkit-transition-property:visibility,margin;-o-transition-property:visibility,margin;transition-property:visibility,margin}.mm-searchfield--cancelable .mm-searchfield__cancel{visibility:visible;-webkit-margin-end:0;margin-inline-end:0}.mm-panel--search{left:0!important;right:0!important;width:100%!important;border:none!important}.mm-panel__splash{padding:20px}.mm-panel--searching .mm-panel__splash{display:none}.mm-panel__noresults{display:none;padding:40px 20px;color:var(--mm-color-text-dimmed);text-align:center;font-size:150%;line-height:1.4}.mm-panel--noresults .mm-panel__noresults{display:block}:root{--mm-sectionindexer-size:20px}.mm-sectionindexer{background:inherit;text-align:center;font-size:12px;-webkit-box-sizing:border-box;box-sizing:border-box;width:var(--mm-sectionindexer-size);position:absolute;top:0;bottom:0;inset-inline-end:calc(-1 * var(--mm-sectionindexer-size));z-index:5;-webkit-transition-property:inset-inline-end;-o-transition-property:inset-inline-end;transition-property:inset-inline-end;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-pack:space-evenly;-ms-flex-pack:space-evenly;justify-content:space-evenly}.mm-sectionindexer a{color:var(--mm-color-text-dimmed);line-height:1;text-decoration:none;display:block}.mm-sectionindexer~.mm-panel{-webkit-padding-end:0;padding-inline-end:0}.mm-sectionindexer--active{right:0}.mm-sectionindexer--active~.mm-panel{-webkit-padding-end:var(--mm-sectionindexer-size);padding-inline-end:var(--mm-sectionindexer-size)}.mm-menu--selected-hover .mm-listitem__btn,.mm-menu--selected-hover .mm-listitem__text,.mm-menu--selected-parent .mm-listitem__btn,.mm-menu--selected-parent .mm-listitem__text{-webkit-transition-property:background-color;-o-transition-property:background-color;transition-property:background-color}@media (hover:hover){.mm-menu--selected-hover .mm-listview:hover>.mm-listitem--selected:not(:hover)>.mm-listitem__text{background:0 0}.mm-menu--selected-hover .mm-listitem__btn:hover,.mm-menu--selected-hover .mm-listitem__text:hover{background:var(--mm-color-background-emphasis)}}.mm-menu--selected-parent .mm-listitem__btn,.mm-menu--selected-parent .mm-listitem__text{-webkit-transition-delay:.2s;-o-transition-delay:.2s;transition-delay:.2s}@media (hover:hover){.mm-menu--selected-parent .mm-listitem__btn:hover,.mm-menu--selected-parent .mm-listitem__text:hover{-webkit-transition-delay:0s;-o-transition-delay:0s;transition-delay:0s}}.mm-menu--selected-parent .mm-panel--parent .mm-listitem:not(.mm-listitem--selected-parent)>.mm-listitem__text{background:0 0}.mm-menu--selected-parent .mm-listitem--selected-parent>.mm-listitem__btn,.mm-menu--selected-parent .mm-listitem--selected-parent>.mm-listitem__text{background:var(--mm-color-background-emphasis)}:root{--mm-sidebar-collapsed-size:50px;--mm-sidebar-expanded-size:var(--mm-max-size)}.mm-wrapper--sidebar-collapsed .mm-slideout{width:calc(100% - var(--mm-sidebar-collapsed-size));-webkit-transform:translate3d(var(--mm-sidebar-collapsed-size),0,0);transform:translate3d(var(--mm-sidebar-collapsed-size),0,0)}[dir=rtl] .mm-wrapper--sidebar-collapsed .mm-slideout{-webkit-transform:none;-ms-transform:none;transform:none}.mm-wrapper--sidebar-collapsed:not(.mm-wrapper--opened) .mm-menu--sidebar-collapsed .mm-divider,.mm-wrapper--sidebar-collapsed:not(.mm-wrapper--opened) .mm-menu--sidebar-collapsed .mm-navbar{opacity:0}.mm-wrapper--sidebar-expanded .mm-menu--sidebar-expanded{width:var(--mm-sidebar-expanded-size);border-right-width:1px;border-right-style:solid}.mm-wrapper--sidebar-expanded.mm-wrapper--opened{overflow:auto}.mm-wrapper--sidebar-expanded.mm-wrapper--opened .mm-wrapper__blocker{display:none}.mm-wrapper--sidebar-expanded.mm-wrapper--opened .mm-slideout{width:calc(100% - var(--mm-sidebar-expanded-size));-webkit-transform:translate3d(var(--mm-sidebar-expanded-size),0,0);transform:translate3d(var(--mm-sidebar-expanded-size),0,0)}[dir=rtl] .mm-wrapper--sidebar-expanded.mm-wrapper--opened .mm-slideout{-webkit-transform:none;-ms-transform:none;transform:none}
.content-slider{overflow:hidden;visibility:hidden;position:relative}.slider-wrapper{overflow:hidden;position:relative}.slider-wrapper>*{float:left;width:100%;position:relative}.slider-control{height:30px;position:relative}.slider-control a,.slider-control .slider-menu{position:absolute;top:9px;display:inline-block}.slider-control .slider-prev{left:0}.slider-control .slider-next{right:0}.slider-control .slider-menu{top:0;width:50%;left:50%;margin-left:-25%;font-size:27px;text-align:center}.slider-control .slider-menu b{color:#bbb;cursor:pointer}.slider-control .slider-menu b.active{color:#666}
html {
overflow-y: scroll;
scroll-behavior: smooth;
height: 100%;
font-size: 18px;
line-height: 24px;
letter-spacing: 0.05em; /* 5% von 18px, relativ zur Schriftgröße */
-webkit-text-size-adjust: 100%;
-ms-text-size-adjust: 100%;
}
html[lang="ko"] {
font-size: 20px;
line-height: 30px;
}
/** WebFonts **/
@font-face {
font-family: 'Satoshi';
src: url('../../files/theme/fonts/Satoshi-Variable.woff2') format('woff2'), /* Modern */
url('../../files/theme/fonts/Satoshi-Variable.woff') format('woff'), /* Fallback */
url('../../files/theme/fonts/Satoshi-Variable.ttf') format('truetype'); /* Ältester Fallback */
font-weight: 300 900; /* Variabler Bereich von 300 bis 900 */
font-style: normal;
font-display: swap; /* Schnelles Rendering */
}
@font-face {
font-family: 'Satoshi';
src: url('../../files/theme/fonts/Satoshi-VariableItalic.woff2') format('woff2'),
url('../../files/theme/fonts/Satoshi-VariableItalic.woff') format('woff'),
url('../../files/theme/fonts/Satoshi-VariableItalic.ttf') format('truetype');
font-weight: 300 900;
font-style: italic;
font-display: swap;
}
@font-face {
font-family: 'Noto Sans KR';
src: url('../../files/theme/fonts/NotoSansKR-VariableFont_wght.ttf') format('truetype');
font-weight: 100 900; /* oder 300 700, je nach unterstütztem Bereich */
font-style: normal;
font-display: swap;
}
[lang="ko"] {
font-family: 'Noto Sans KR', sans-serif;
}
/* Markierter Text*/
::-moz-selection { background: #AD122A; color: #fff; }
::selection { background: #AD122A; color: #fff; }
mark { background: #AD122A; color: #fff; }
/* Anpassen Boxmodel */
* {
-webkit-box-sizing:border-box;
-moz-box-sizing:border-box;
box-sizing:border-box;
}
*:before,
*:after{
-webkit-box-sizing:border-box;
-moz-box-sizing:border-box;
box-sizing:border-box;
}
a {
color: #AD122A;
}
.sr-only {
position: absolute;
width: 1px;
height: 1px;
margin: -1px;
padding: 0;
border: 0;
clip: rect(0, 0, 0, 0);
overflow: hidden;
}
#top {
margin: 0;
}
/* Text */
body {
font-family: 'Satoshi', sans-serif;
font-weight: 300;
font-style: light;
color: #040711;
font-feature-settings: 'ss01' 1,'ss03' 1;
margin: 0;
}
[lang="ko"] body {
font-family: 'Noto Sans KR', sans-serif;
font-weight: 400; /* Regular, kannst aber auch 300 nehmen, falls gewünscht */
}
p {
margin: 0;
font-weight: 350;
margin-bottom: 32px;
}
/*p + p {
margin-top: 16px;
}*/
.text--white {
color: #f0f0f2;
margin: 0;
font-weight: 350;
/*padding: calc(clamp(1.778rem, 2.143vw + 1.397rem, 3.111rem)) calc(clamp(0.889rem, 7.143vw - 0.381rem, 5.333rem));*/
}
/* Überschriften */
h1,
.h1 {
font-family: 'Satoshi', sans-serif;
}
h1.display-1 {
font-weight: 700; /* Fett */
font-style: normal;
/*font-size: clamp(35px, calc(2.1875rem + ((1vw - 0.01px) * 2.5712)), 72px); /* Dynamische Schriftgröße */
font-size: clamp(35px, calc(2.1875rem + ((1vw - 3.2px) * 3.3036)), 72px);
line-height: calc(clamp(2.333rem, 4.107vw + 1.603rem, 4.889rem));
margin-top: 0;
margin-bottom: 8px;
min-height: 0vw; /* Min Höhe für den Viewport */
color: #000000;
}
.display-2 {
font-size: calc(clamp(1.556rem, 2.143vw + 1.175rem, 2.889rem));
line-height: calc(clamp(2.222rem, 2.5vw + 1.778rem, 3.778rem));
font-weight: 500;
letter-spacing: 0.01em;
margin-top: 0;
/*margin-bottom: 8px;*/
}
h2 {
font-size: calc(clamp(1.556rem, 1.818vw + 1.232rem, 2.444rem));
font-weight: 500;
line-height: calc(clamp(2.222rem, 2.727vw + 1.737rem, 3.556rem));
letter-spacing: 0.02em;
margin-top: 0;
}
h3 {
font-size: calc(clamp(1.278rem, 1.364vw + 1.035rem, 1.944rem));
line-height: calc(clamp(1.778rem, 1.818vw + 1.455rem, 2.667rem));
font-weight: 500;
color: #AD122A;
margin: 0;
}
.text--large.content-text h3 {
margin-bottom: 36px;
}
.text--large.content-text h3 + .rte p {
margin-bottom: 36px;
}
.text--large.content-text p + h3 {
margin-top: 36px;
margin-bottom: 12px;
}
.m-b-12 {
margin-bottom: 12px !important;
}
.m-b-16 {
margin-bottom: 16px;
}
.m-t-16 {
margin-top: 16px;
}
.m-t-32 {
margin-top: 32px;
}
.text--large {
font-size: calc(clamp(1rem, 2.344vw + 0.583rem, 1.333rem));
line-height: calc(clamp(1.333rem, 4.688vw + 0.5rem, 2rem));
font-weight: 350;
}
.text--large_medium {
font-size: calc(clamp(1rem, 2.344vw + 0.583rem, 1.333rem));
line-height: calc(clamp(1.333rem, 4.688vw + 0.5rem, 2rem));
font-weight: 500;
}
.text--light {
}
/* Kursiver Text */
em {
font-family: 'Satoshi', sans-serif;
font-weight: 500;
font-style: italic;
}
.margin-block {
margin-block: 64px;
}
img {
width: 100%;
height: auto;
}
/* Für Container mit voller Breite */
.full-width > .inside {
max-width: 100% !important;
padding: 0 !important;
}
/* HERO-/Fullwidth-Bild Container */
.full-image {
width: 100vw; /* volle Fensterbreite */
position: relative;
overflow: hidden;
margin: 0 auto;
display: block;
background: #eee; /* Fallback-Hintergrund */
}
/* Bild IMMER auf Containergröße und schön beschnitten */
.full-image img,
.full-image__dark-highlight img {
width: 100%;
height: 100%;
object-fit: cover;
object-position: center; /* für Focusbereich, wenn in Contao definiert */
display: block;
}
/* Weißes Overlay auf dem Hero-Bild */
.full-image figure,
.white-overlay figure {
position: relative;
}
.full-image figure::after,
.white-overlay figure::after {
content: '';
position: absolute;
top: 0; left: 0;
width: 100%; height: 100%;
background-color: rgba(255, 255, 255, 0.5); /* Weiß mit 50% Deckkraft */
pointer-events: none;
}
#header {
border-bottom: 1px solid #3037462e;
}
#main .inside,
#header .inside,
#teaser > .inside,
.footer-bar__legal-inner,
.mod_breadcrumb {
max-width: clamp(320px, calc(100vw - 32px), 1440px);
margin: auto;
padding-left: clamp(0.889rem, calc(0.889rem + ((1vw - 0.2rem) * 3.81)), 3.556rem);
padding-right: clamp(0.889rem, calc(0.889rem + ((1vw - 0.2rem) * 3.81)), 3.556rem);
min-height: 0vw;
padding-block: 16px;
}
.footer-bar__content {
max-width: clamp(320px, calc(100vw - 32px), 1440px);
margin: auto;
padding-left: clamp(0.889rem, calc(0.889rem + ((1vw - 0.2rem) * 3.81)), 3.556rem);
padding-right: clamp(0.889rem, calc(0.889rem + ((1vw - 0.2rem) * 3.81)), 3.556rem);
min-height: 0vw;
padding-block: calc(clamp(0.889rem, 7.407vw - 0.428rem, 5.333rem));
}
.header-top-bar {
display: none;
}
.logo {
display: flex;
gap: 8px;
}
/* Initiales großes Logo */
.logo svg {
width: auto;
height: 120px;
transition:
all 0.3s ease;
position: absolute;
top: -56px;
left: auto;
z-index: 10;
}
/* Bei Scroll verkleinern */
.header--scrolled .logo svg {
width: 60px;
height: 60px;
top: 0;
}
/*.logo svg {
fill: #AD122A;
width: 32px;
height: 32px;
}*/
a.logo {
text-decoration: none;
}
.logo span {
font-size: 12px;
line-height: 16px;
color: #040711;
text-decoration: none;
padding-left: 164px;
}
.logo span strong {
font-weight: 700; /* Oder der gewünschte Wert */
}
/* MObile Navigation */
.navigation-bar-bottom {
position: fixed;
bottom: 0;
width: 100%;
background-color: #ffffff;
display: flex;
justify-content: space-around;
align-items: center;
padding: 16px 0px 24px;
z-index: 1000;
border-top: 1px solid #3037462e;
}
.menu-item {
display: flex;
flex-direction: column;
text-decoration: none;
color: #040711; /* Standardfarbe für Text und Icons */
font-size: 12px;
line-height: 16px;
border: none;
width: 55px;
height: 55px;
align-items: center;
justify-content: center;
font-weight: 300;
background-color: #ffffff;
cursor: pointer;
}
.menu-item svg {
width: 24px;
height: 24px;
stroke: #040711; /* Standardfarbe für Icons */
stroke-width: 1.5;
margin-bottom: 4px;
}
.menu-item:hover {
color: #AD122A; /* Hoverfarbe für Text */
}
.menu-item:hover svg {
stroke: #AD122A; /* Hoverfarbe für Icons */
}
.menu-label {
font-size: 12px;
line-height: 1.2;
text-align: center;
font-weight: 400;
}
/* Sprachwechler mobile */
#language-menu {
position: fixed;
bottom: 0px; /* Positioniert das Menü direkt unter der 96px hohen Navigationsleiste */
left: 0;
width: 100%;
background-color: white;
box-shadow: 0 -2px 5px rgba(0,0,0,0.1);
z-index: 999;
transform: translateY(100%); /* Startet das Menü außerhalb des sichtbaren Bereichs direkt unter der Leiste */
transition: transform 0.5s ease-in-out; /* Weiche Animation für das Ein- und Ausblenden */
}
#language-menu.visible {
transform: translateY(-96px); /* Bewegt das Menü in den sichtbaren Bereich, wenn es aktiv ist */
}
#language-menu span {
display: block;
text-align: center;
padding: 10px 0;
font-size: 18px; /* Größere Schrift für bessere Lesbarkeit */
color: #333; /* Dunkelgraue Schriftfarbe für Kontrast */
background-color: #f8f8f8; /* Leicht grauer Hintergrund für visuelle Abhebung */
border-bottom: 1px solid #ccc; /* Eine Linie unter dem Text, um das Design zu segmentieren */
width: 100%; /* Stellt sicher, dass das Span-Element die volle Breite einnimmt */
}
/* Anpassungen für das Dropdown-Menü */
#language-menu .select-wrapper {
position: relative;
width: 90%;
margin: 10px auto;
}
#language-menu .select-wrapper select {
width: 100%;
padding: 16px 32px; /* Rechts Padding erhöht, um Platz für den Pfeil zu schaffen */
font-size: 18px;
color: #333;
background-color: #fff;
border: 1px solid #ccc;
border-radius: 2px;
cursor: pointer;
}
/* Stil für den Fokus-Zustand des Dropdowns */
#language-menu select:focus {
border-color: #AD122A;
outline: none;
}
/* Anpassung für Optionen im Dropdown */
#language-menu option {
padding: 10px; /* Bietet mehr Platz innerhalb der Optionen */
background-color: white; /* Stellt sicher, dass die Optionen weiß bleiben */
}
#language-menu option:hover {
background-color: #f0f0f2;
}
.hero--home,
.article__highlight {
background-color: #F0F0F2;
/*padding: 32px 16px;*/
}
.article__highlight--dark {
background-color: #303746;
color: #F0F0F2;
}
.article__highlight--dark h3 {
color: white;
}
.hero__header {
margin-bottom: calc(clamp(0.889rem, 6.25vw - 0.222rem, 1.778rem));
}
figure {
margin:0;
/* margin-bottom: -5px;*/
}
.hero__image {
/* height: 531px; /* oder deine gewünschte Höhe */
overflow: hidden;
position: relative;
}
.hero__image img {
width: 100%;
height: 100%;
object-fit: cover; /* Bild füllt Container, wird ggf. beschnitten */
object-position: center;
display: block;
}
/*
.hero__image figure img {
max-width: 100%;
height: auto;
display: block;
margin-top: 5px;
}*/
h1.hero__text-title {
font-weight: 500; /* Fett */
font-style: normal;
font-size: calc(clamp(1.944rem, 2.313vw + 1.533rem, 4rem));
line-height: calc(clamp(2.333rem, 4.107vw + 1.603rem, 4.889rem));
margin-top: 0;
margin-bottom: 8px;
min-height: 0vw; /* Min Höhe für den Viewport */
color: #AD122A;
}
.hero__text-description {
/* margin-bottom: 16px;*/
hyphens: auto;
hyphenate-limit-chars: auto 4;
hyphenate-limit-lines: 4;
}
/* ---------------------------------------------
Hero Highlight Boxes – Grundstyling
--------------------------------------------- */
.hero__highlight-boxes {
margin-top: auto;
}
.hero__highlight-box {
display: flex;
align-items: center;
gap: 8px;
padding: 16px;
border-radius: 2px;
box-sizing: border-box;
margin: 0;
transition: transform 0.2s ease, background-color 0.2s ease;
}
/* Icons */
.hero__highlight-box .icon {
width: calc(clamp(1.333rem, 3.571vw + 0.698rem, 3.556rem));
height: calc(clamp(1.333rem, 3.571vw + 0.698rem, 3.556rem));
stroke: #AD122A;
stroke-width: 3%;
fill: none;
}
.hero__highlight-box .icon--arrow-right {
stroke: #fff;
stroke-width: 1.5;
}
/* Farbvarianten */
.hero__highlight-box--grey {
background-color: #fff;
}
.hero__highlight-box--red {
background-color: #AD122A;
color: #fff;
}
/* Text */
.hero__highlight-box-text .rte p {
font-size: calc(clamp(0.667rem, 1.339vw + 0.429rem, 1rem));
line-height: calc(clamp(0.889rem, 3.571vw + 0.254rem, 1.778rem));
font-weight: 500;
margin: 16px 0;
}
/* ---------------------------------------------
Hover-Effekt nur für die Kontaktbox
--------------------------------------------- */
.highlight-contact a {
text-decoration: none;
display: block;
}
/* Zielgenauer Hover nur auf der roten Box */
.highlight-contact a:hover .hero__highlight-box--red {
transform: translateY(-2px);
background-color: #8A0D22; /* leicht dunkleres Rot als Hover */
cursor: pointer;
}
/* Breadcrumb */
#sub-header {
background-color: #f0f0f2;
}
.mod_breadcrumb {
font-size: calc(clamp(0.667rem, 0.341vw + 0.606rem, 0.833rem));
line-height: 24px;
}
.mod_breadcrumb ul {
list-style: none; /* Entfernt die Aufzählungszeichen */
padding: 0;
margin: 0;
display: flex;
flex-wrap: wrap; /* Zeilenumbruch bei kleineren Bildschirmen */
align-items: center; /* Vertikale Zentrierung */
}
.mod_breadcrumb li {
display: flex; /* Chevron und Text nebeneinander */
align-items: center; /* Vertikale Zentrierung */
}
.mod_breadcrumb li::after {
content: "›"; /* Chevron als Trenner */
color: #303746; /* Chevron-Farbe */
margin: 0 8px; /* Abstand zum Text */
}
.mod_breadcrumb li:last-child::after {
content: ""; /* Entfernt Chevron für die letzte Seite */
}
.mod_breadcrumb li a {
color: #303746; /* Linkfarbe */
text-decoration: none; /* Entfernt Unterstreichung */
transition: color 0.3s ease; /* Hover-Effekt */
}
.mod_breadcrumb li a:hover {
color: #981211; /* Hover-Farbe */
}
.mod_breadcrumb .active {
color: #AD122A;
}
.mod_article {
/* padding: 32px 16px;*/
padding-block: clamp(32px, calc(2rem + ((1vw - 3.2px) * 5.7143)), 96px) clamp(16px, calc(1rem + ((1vw - 3.2px) * 4.2857)), 64px);
}
.mod_article.full-width {
padding: 0 !important;
}
.article__header {
color: #000;
margin-bottom: calc(clamp(1.778rem, 7.143vw + 0.508rem, 3.556rem));
}
.article__header-content {
margin-bottom: 96px;
}
.service-cards {
display: grid;
gap: calc(clamp(0.444rem, 2.143vw + 0.063rem, 1.778rem));
}
/**.service-card__desktop {
display: none;
}*/
.service-card {
background-color: #F0F0F2;
border-radius: 2px;
hyphens: auto;
hyphenate-limit-chars: auto 3;
hyphenate-limit-lines: 4;
margin-bottom: 16px;
}
.service-card h3 {
font-size: calc(clamp(1rem, 1.42vw + 0.747rem, 1.556rem));
line-height: calc(clamp(1.333rem, 2.273vw + 0.929rem, 2.222rem));
margin:0;
font-weight: 500;
letter-spacing: 0.05em;
color: #000;
display: flex;
align-items: flex-start;
}
.service-card h3 svg {
width: calc(clamp(1.333rem, 2.143vw + 0.952rem, 2.667rem));
height: calc(clamp(1.333rem, 2.143vw + 0.952rem, 2.667rem));
margin-right: 8px;
stroke: #AD122A;
stroke-width: 3%;
flex-shrink: 0;
}
.service-card__text {
margin-bottom: 24px;
color: #000;
font-weight: 400;
}
@media screen and (min-width: 1200px) {
.service-card__text {
font-weight: 300;
}
}
.service-card__link a {
font-weight: 500;
}
/* Akkordion Dienstleistungen */
.ui-accordion-header, .service-card__header {
position:relative;
transition:color ease-in-out 0.2s;
padding: calc(clamp(0.889rem, 2.857vw + 0.381rem, 2.667rem)) calc(clamp(0.889rem, 2.857vw + 0.381rem, 2.667rem)) 8px calc(clamp(0.889rem, 2.857vw + 0.381rem, 2.667rem));
}
.ui-accordion-header:hover {
cursor:pointer
}
.ui-accordion-header:hover,
.ui-accordion-header:focus {
}
.ui-accordion-header:after,
.ui-accordion-header:before {
transition:opacity ease-in-out 0.2s;
position:absolute;
top: 16px;
right: 16px;
z-index: 5;
width: 24px;
height: 24px;
background:transparent url("../../files/theme/img/chevron-down.svg") center center no-repeat;
content:""
}
.ui-accordion-header:before {
opacity:1
}
.ui-accordion-header:after {
opacity:0;
background:transparent url("../../files/theme/img/chevron-up.svg") center center no-repeat
}
.ui-accordion-header-active:before {
opacity:0
}
.ui-accordion-header-active:after {
opacity:1
}
.ui-accordion-header-icon {
display:none
}
.ui-accordion-content, .service-card__body {
font-size: 15px;
line-height:24px;
padding: 0 calc(clamp(0.889rem, 2.857vw + 0.381rem, 2.667rem)) calc(clamp(0.889rem, 2.857vw + 0.381rem, 2.667rem)) calc(clamp(0.889rem, 2.857vw + 0.381rem, 2.667rem));
background:#F0F0F2;
color:#000;
}
/* Klassisches Akkordion */
.handorgel__header__button {
position: relative;
color: inherit; /* Textfarbe bleibt unverändert */
}
.handorgel__header__button::after {
content: "";
width: 24px;
height: 24px;
display: inline-block;
position: absolute;
right: 10px;
top: 50%;
transform: translateY(-50%);
background: #AD122A; /* Die Farbe für das Icon */
-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none' stroke='currentColor' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' class='feather feather-plus'%3E%3Cpath d='M12 5v14M5 12h14'/%3E%3C/svg%3E") center/contain no-repeat;
mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none' stroke='currentColor' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' class='feather feather-plus'%3E%3Cpath d='M12 5v14M5 12h14'/%3E%3C/svg%3E") center/contain no-repeat;
transition: background 0.3s ease;
}
.handorgel__header__button[aria-expanded="true"]::after {
background: #AD122A; /* Die Farbe für das Minus-Icon */
-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none' stroke='currentColor' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' class='feather feather-minus'%3E%3Cpath d='M5 12h14'/%3E%3C/svg%3E") center/contain no-repeat;
mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none' stroke='currentColor' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' class='feather feather-minus'%3E%3Cpath d='M5 12h14'/%3E%3C/svg%3E") center/contain no-repeat;
}
.accordion-handorgel {
margin-top: -18px;
margin-bottom: 18px;
}
.handorgel__header {
display:block;
margin:0;
background-color: #F0F0F2;
border-bottom: 1px solid #303746;
}
.handorgel__header--open {
border: 0;
}
.handorgel__header__button {
display:block;
width:100%;
padding:24px 16px;
margin:0;
border:0;
background-color:#F0F0F2;
border-radius:0;
color:#000000;
cursor:pointer;
font-size:18px;
line-height: 32px;
font-weight: 500;
text-align:left;
transition:background-color .2s ease;
user-select:none
}
.handorgel__header__button::-moz-focus-inner {
border:0
}
.handorgel__content {
display:none;
overflow:hidden;
height:0;
border-bottom: 1px solid #303746;
background-color:#F0F0F2;
transition:height .1s ease .1s
}
.handorgel__content--open {
display:block;
transition:height .2s ease
}
.handorgel__content--opened {
overflow:visible
}
.handorgel__content__inner {
padding: 0px 16px 32px;
opacity:0;
transition:opacity .1s ease;
hyphens: auto;
hyphenate-limit-before: 3;
hyphenate-limit-after: 2;
}
.handorgel__content__inner h3 {
font-size: calc(clamp(1rem, 1.42vw + 0.747rem, 1.556rem));
line-height: calc(clamp(1.333rem, 2.273vw + 0.929rem, 2.222rem));
margin: 0;
font-weight: 500;
letter-spacing: 0.05em;
}
.handorgel__content--opened .handorgel__content__inner {
opacity:1;
transition:opacity .3s ease
}
.handorgel .accordion {
display:none;
overflow:hidden;
height:0;
transition:height .2s ease
}
.handorgel .accordion.open {
display:block;
transition:height .2s ease
}
.handorgel .accordion.active {
overflow:visible
}
.article__header-link {
font-size: 15px;
line-height: 24px;
font-weight: 300;
letter-spacing: 0.05em;
display: flex;
align-items: center;
justify-content: right;
margin-bottom: 16px;
}
.article__header-link .content-text.ivp {
display: flex;
align-items: center;
}
.article__header-link .rte {
display: flex;
align-items: center;
margin: 0; /* verhindert unnötigen Abstand */
}
.article__header-link .rte p {
margin: 0;
display: flex;
align-items: center;
}
.article__header-link-text {
padding-right: 8px;
}
.article__header-link a {
color: #040711;
text-decoration: none;
}
.article__header-link a:hover {
color: #AD122A;
text-decoration: underline;
}
.article__header-description {
margin-bottom: 72px;
}
.button-icon a.article__header-link-icon {
width: 32px;
height: 32px;
background-color: transparent;
border: 2px solid #F0F0F2;
border-radius: 50%;
display: flex;
justify-content: center;
align-items: center;
transition: all 0.3s ease;
}
.button-icon a.article__header-link-icon:hover {
width: 40px;
height: 40px;
background-color: #AD122A;
border-color: #AD122A;
stroke: #ffffff;
}
.icon--arrow-right {
width: 20px;
height: 20px;
stroke-width: 1.5;
stroke: #AD122A; /* Pfeil initial rot */
fill: none;
transition: stroke 0.3s ease; /* Weiche Animation für den Pfeil */
}
.button-icon a.article__header-link-icon:hover .icon--arrow-right {
stroke: #FFFFFF; /* Pfeil wird beim Hover weiß */
}
/* Rechtsanwälte */
/* Vollständig aus dem Grid entfernen */
.lawyer-cards.lawyer-cards__desktop {
display: none !important;
}
.lawyer-cards.lawyer-cards__mobile {
display: block;
}
.lawyer-card {
background-color: transparent;
padding-bottom: 24px;
}
h3.lawyer-card__name {
font-size: 21px;
line-height: 24px;
letter-spacing: 0.02em;
font-weight: 700;
margin: 16px 0 8px 0;
}
.lawyer-card__description,
.lawyer-card__link a {
font-size: 15px;
line-height: 24px;
font-weight: 300;
letter-spacing: 0.05em;
color: #040711;
hyphens: auto;
}
.lawyer-card__description {
margin-bottom: 24px;
}
.content-image {
max-width: 100%;
height: auto;
}
/* Slider */
.swiper-container {
position: relative;
overflow: visible; /* Stellen Sie sicher, dass nichts abgeschnitten wird */
}
.swiper-button-prev, .swiper-button-next {
position: absolute;
top: -28px; /* Oberhalb des Inhalts */
width: 32px; /* Startgröße */
height: 32px;
color: #AD122A;
border: 2px solid #F0F0F2; /* Randfarbe */
border-radius: 50%; /* Runde Buttons */
}
.swiper-button-prev {
left: 20%;
}
.swiper-button-next {
right: 20%;
}
.swiper-button-next::after, .swiper-button-prev::after {
font-size: 14px;
font-weight: bold;
}
.swiper-button-prev:hover, .swiper-button-next:hover {
background: #AD122A; /* Innerer Kreis rot */
color: #fff; /* Pfeilfarbe weiß */
border-color: #AD122A; /* Randfarbe rot */
}
.swiper-pagination {
top: -50px; /* Platzierung oberhalb des Inhalts */
}
.swiper-pagination-bullet-active {
background-color: #AD122A; /* Aktive Farbe */
}
.desktop {
display: none !important;
}
/* Mobile Navigation */
#nav-main,
.nav-megamenu {
display: none;
}
/* Spezifisch für das neue Menü-Element */
.nav-toggle a,
.content-toplink a {
display: flex;
flex-direction: column;
align-items: center;
text-decoration: none;
color: inherit; /* Erbt die Farbe */
}
.nav-toggle a svg,
.content-toplink a svg {
width: 24px;
height: 24px;
stroke: #040711;
stroke-width: 1.5;
margin-bottom: 4px;
}
.nav-toggle a:hover svg,
.content-toplink a:hover svg {
stroke: #AD122A;
}
.nav-toggle a span {
font-size: 12px;
color: inherit;
line-height: 1.2;
text-align: center;
}
/* Aufzählung */
/* Pfeil rechts */
.arrow--right ul {
list-style: none; /* Entfernt Standard-Aufzählungspunkte */
padding: 0;
padding-bottom: 32px;
margin: 0;
}
.arrow--right ul li {
position: relative;
padding-left: 32px; /* Platz für das Icon */
margin-bottom: 8px; /* Abstand zwischen den Elementen */
/* font-size: 1rem; /* Schriftgröße */
}
/* Maskiertes Icon */
.arrow--right ul li::before {
content: "";
position: absolute;
top: calc(clamp(0.722rem, 2.024vw + 0.362rem, 1rem));
left: 0;
transform: translateY(-50%);
width: 20px;
height: 20px;
background: #AD122A;
-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='3' stroke-linecap='round' stroke-linejoin='round' class='feather feather-arrow-right'%3E%3Cline x1='5' y1='12' x2='19' y2='12'%3E%3C/line%3E%3Cpolyline points='12 5 19 12 12 19'%3E%3C/polyline%3E%3C/svg%3E") center/contain no-repeat;
mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='3' stroke-linecap='round' stroke-linejoin='round' class='feather feather-arrow-right'%3E%3Cline x1='5' y1='12' x2='19' y2='12'%3E%3C/line%3E%3Cpolyline points='12 5 19 12 12 19'%3E%3C/polyline%3E%3C/svg%3E") center/contain no-repeat;
transition: background 0.3s ease;
}
/* Hover-Effekt */
.arrow--right ul li:hover::before {
background: var(--icon-hover-color, #981211); /* Hoverfarbe */
}
/* Klienten */
/* Klienten */
.clients {
margin: 3rem auto;
}
.card-client {
background: #fff;
border: 1px solid #e8e8e8;
border-radius: 2px;
box-shadow: 0px 8px 8px rgba(0, 0, 0, 0.16);
padding: 1.5rem;
height: 100%;
}
.card-client > div {
height: 100%;
}
.card-client > div > div {
display: flex;
flex-flow: row wrap;
height: 100%;
}
.card-client-text > p {
margin-bottom: 1rem;
font-weight: 300;
color: #040711;
}
.info {
display: flex;
flex-flow: column;
align-self: flex-end;
}
.card-client-rating {
color: #AD122A;
font-size: 1.5em;
}
.star.active {
margin-right: -9px;
}
.card-client-name {
font-weight: 700;
font-size: 16px;
color: #040711;
margin-top: 8px;
}
.quote {
font-size: calc(clamp(1rem, 1.071vw + 0.81rem, 1.667rem));
line-height: calc(clamp(1.778rem, 1.429vw + 1.524rem, 2.667rem));
font-weight: 400;
padding: calc(clamp(1.778rem, 2.143vw + 1.397rem, 3.111rem)) calc(clamp(0.889rem, 7.143vw - 0.381rem, 5.333rem));
color: #040711;
}
.quote svg {
width: calc(clamp(1.333rem, 2.143vw + 0.952rem, 2.667rem));
height: calc(clamp(1.333rem, 2.143vw + 0.952rem, 2.667rem));
margin-right: 8px;
fill: #ffffff;
stroke-width: 3%;
}
.blockquote {
font-size: calc(clamp(1rem, 1.964vw + 0.651rem, 2.222rem));
font-style: italic;
margin: 0 0 24px 0;
font-feature-settings: 'ss01' 0,'ss03' 0;
}
.text--highlight_dark {
color: #E61747;
}
blockquote {
font-style: italic;
font-size: smaller;
background: #F0F0F2;
padding: 1rem;
margin: 1rem 0;
color: #000000;
}
.quote-content {
margin: 32px 0;
padding: 16px 24px;
background-color: #f8f8f8;
border-left: 4px solid #666;
font-style: italic;
color: #333;
font-size: 1rem;
line-height: 1.6;
}
@media (max-width: 768px) {
.quote-content {
padding: 16px;
font-size: 0.95rem;
}
}
.article__highlight--dark {
margin-bottom: 72px;
}
/* Aufzählung */
/* Grundlayout für die horizontale Liste mit Rand */
/* Container für die horizontale Liste */
.horizontal-list-border {
display: block; /* Block-Layout statt Flexbox */
padding: 0;
margin: 0;
list-style: none; /* Entfernt Standardnummerierung */
counter-reset: list-counter; /* Zähler zurücksetzen */
}
/* Styling für jedes Listenelement */
.horizontal-list-border .list-item {
position: relative;
counter-increment: list-counter; /* Zählt die Listenelemente */
padding: 54px;
border: 1px solid #000;
break-inside: avoid; /* Verhindert, dass Listenelemente mitten in der Spalte brechen */
margin-bottom: 48px; /* Abstand zwischen den Listenelementen */
}
/* Styling für die Zahl (zählt die Listenelemente) */
.horizontal-list-border .list-item::before {
content: counter(list-counter); /* Fügt die Zahlen hinzu */
display: block;
font-weight: 500; /* Fett */
font-style: normal;
font-size: calc(clamp(1.944rem, 4.205vw + 1.197rem, 4rem));
line-height: calc(clamp(2.333rem, 4.107vw + 1.603rem, 4.889rem));
margin-top: 0;
margin-bottom: 8px;
min-height: 0vw; /* Min Höhe für den Viewport */
color: #AD122A; /* Farbe der Zahl */
}
/* Styling für die Überschrift (strong) */
.horizontal-list-border .list-item strong {
font-size: 18px;
line-height: 32px;
font-weight: 700;
letter-spacing: 0.02;
color: #040711;
display: block;
margin-bottom: 8px;
}
/* Styling für den Inhalt der Listenelemente */
.horizontal-list-border .list-item .content p {
font-size: 15px;
line-height: 24px;
letter-spacing: 0.05em;
font-weight: 400;
color: #040711;
}
/* Styling für die Unterliste (subpoints) */
.horizontal-list-border .sub-list {
padding-left: 20px; /* Einrückung der Unterpunkte */
margin-top: 12px;
}
/* Styling für jedes Listenelement in der Unterliste */
.horizontal-list-border .sub-list-item {
font-size: 15px;
line-height: 24px;
letter-spacing: 0.05em;
font-weight: 400;
margin-bottom: 8px; /* Abstand zwischen den Unterpunkten */
padding-left: 10px;
position: relative;
}
/* Optional: Punkt vor jedem Unterpunkt */
.horizontal-list-border .sub-list-item::before {
content: "•";
position: absolute;
left: 0;
font-size: 15px;
color: #040711;
}
/* Optional: Hover-Effekt für Listenelemente */
.horizontal-list-border .list-item:hover {
background-color: #f0f0f2;
transition: background-color 0.3s;
}
.horizontal-list-border .sub-list-item:hover {
color: #AD122A;
transition: color 0.3s;
}
.horizontal-list-border {
column-count: 1; /* Alle Listenelemente untereinander */
}
.horizontal-list-border .list-item {
margin-bottom: 32px; /* Etwas weniger Abstand zwischen den Listenelementen */
}
/* Hauptaufzählung (ol) */
.horizontal-list ol {
display: flex;
flex-wrap: wrap;
gap: 48px; /* Abstand zwischen den Listenelementen */
padding: 0;
margin: 0;
list-style: none; /* Entfernt Standardnummerierung */
}
.horizontal-list ol li {
counter-increment: list-counter; /* Zählt die Listenelemente */
position: relative;
flex: 1 1 100%; /* Elemente standardmäßig untereinander */
}
.horizontal-list ol li::before {
content: counter(list-counter); /* Fügt die Zahlen hinzu */
display: block;
font-weight: 500; /* Fett */
font-style: normal;
font-size: calc(clamp(1.944rem, 4.205vw + 1.197rem, 4rem));
line-height: calc(clamp(2.333rem, 4.107vw + 1.603rem, 4.889rem));
margin-top: 0;
margin-bottom: 8px;
min-height: 0vw; /* Min Höhe für den Viewport */
color: #AD122A; /* Farbe der Zahl */
}
/* FAQ *//* FAQ Akkordeon - Kopf */
.faq-accordion .faq-header {
position: relative;
padding: 16px 0;
color: #000;
cursor: pointer;
border-bottom: 1px solid #303746;
font-weight: 500;
transition: color 0.3s ease;
}
.faq-accordion .faq-header:hover,
.faq-accordion .faq-header.active {
color: #AD122A;
}
.faq-accordion .faq-header.active {
border: none;
}
/* FAQ Akkordeon - Inhalt */
.faq-accordion .faq-content {
display: none;
padding: 0 0 16px;
background-color: #fff;
border-bottom: 1px solid #303746;
font-size: 0.875rem;
color: #000;
}
/* Geöffnetes Akkordeon */
.faq-accordion .faq-header.active + .faq-content {
display: block;
border-top: none;
}
/* Pfeilsymbol */
.faq-accordion .faq-header::after {
content: "";
position: absolute;
right: 16px;
top: 50%;
width: 24px;
height: 24px;
background: url("../../files/theme/img/chevron-down.svg") no-repeat center;
transform: translateY(-50%) rotate(0deg);
transition: transform 0.3s ease;
}
.faq-accordion .faq-header.active::after {
background: url("../../files/theme/img/chevron-up.svg") no-repeat center;
transform: translateY(-50%) rotate(0deg);
}
/* TABS */
/* Grundlegende Stildefinitionen */
.ce_tabs-nav {
display: flex;
justify-content: center;
list-style: none;
padding: 0;
margin: 0;
position: relative;
}
.ce_tabs-nav .nav-item {
margin: 0;
display: flex;
/*align-items: center; /* Zentriert Icons und Text vertikal */
}
.ce_tabs-nav .nav-item svg {
width: 24px;
height: 24px;
margin-right: 8px;
stroke: #AD122A;
stroke-width: 1.5;
}
.ce_tabs-nav .tab-link {
display: flex;
align-items: center;
padding: 18px 32px;
text-decoration: none;
color: #303746;
font-weight: 700;
border: 1px solid #3037462e;
background-color: #fff;
transition: background-color 0.3s, color 0.3s, border 0.3s;
z-index: 1; /* Standard-Ebene für inaktive Tabs */
margin-left: -1px; /* Versteckt linken Rand */
}
.ce_tabs-nav .tab-link:hover,
.ce_tabs-nav .active-tab-nav {
background-color: #AD122A;
color: #ffffff;
border-bottom: none; /* Kein unterer Rand für aktive Tabs */
}
.ce_tabs-nav .tab-link:hover svg,
.ce_tabs-nav .active-tab-nav svg {
stroke: #ffffff;
}
/* Inhalt */
.tab-content {
background-color: #fff;
border: 1px solid #3037462e;
border-radius: 2px;
padding: 64px;
position: relative;
z-index: 5;
margin-top: -2px; /* Lässt den Rahmen oben nahtlos erscheinen */
}
.tab-pane {
display: none;
}
.tab-pane.active-tab {
display: block;
}
.ce_tabs h2 {
margin-bottom: 16px;
}
/* Media Query für mobile Ansicht */
@media (max-width: 1200px) {
.ce_tabs-nav {
flex-direction: column;
}
.nav-item {
width: 100%; /* Lässt jedes Tab-Element die volle Breite einnehmen */
}
.tab-link {
justify-content: center; /* Zentriert den Inhalt jedes Tabs */
padding: 12px 20px; /* Angepasstes Padding für kleinere Bildschirme */
}
.tab-content {
padding: 20px; /* Weniger Padding im Inhaltsbereich */
}
.ce_tabs-nav .tab-link {
width: 100%;
}
}
/* Wrapper sorgt für horizontales Scrollen */
.table {
width: 100%;
overflow-x: auto;
-webkit-overflow-scrolling: touch;
}
/* Tabelle selbst */
.table table {
width: 100%;
border-collapse: collapse;
min-width: 600px; /* wichtig für Scroll – hier kannst du breiter gehen */
font-size: 1rem;
line-height: 1.5;
}
/* Tabellenkopf */
.table thead {
background-color: #F0F0F2;
}
.table thead th {
text-align: left;
padding: 12px 16px;
font-weight: 600;
border-bottom: 1px solid #303746;
font-size: 1rem;
}
/* Tabellenzellen */
.table tbody td,
.table tbody th {
padding: 12px 16px;
border-bottom: 1px solid #3037462e;
vertical-align: top;
text-align: left;
}
/* Letzte Zeile ohne Border kannst du bei Bedarf ergänzen */
.table tbody tr:last-child td {
border-bottom: none;
}
/* Responsive Schriftgröße */
@media (max-width: 768px) {
.table table {
font-size: 0.95rem;
}
}
/* Footer */
.footer-bar {
background-color: #303746;
color: #F0F0F2;
margin-bottom: 84px;
}
.footer-bar__content {
padding-block: calc(clamp(1.778rem, 4vw + 1.067rem, 5.333rem));
}
.footer-bar__logo {
margin-bottom: 32px;
}
.footer-bar__info {
margin-bottom: 32px;
}
.footer-bar__info h6 {
margin: 0;
font-size: 18px;
line-height: 24px;
margin-bottom: 4px;
display: flex;
align-items: center;
}
.footer-bar__info p {
font-size:15px;
line-height: 24px;
}
.footer-bar__info a {
color: #fff;
}
h6 svg {
width: 20px;
height: 20px;
stroke: #fff;
stroke-width: 1.5;
margin-right: 8px;
}
.footer-bar__legal {
border-top:1px solid #F0F0F2;
}
.footer-bar__legal-links {
display: grid;
align-items: center;
gap: 16px;
margin:16px 0 8px;
}
.footer-bar__legal-links a {
color: #F0F0F2;
text-decoration: none;
font-size:15px;
line-height: 24px;
}
.footer-bar__legal-copyright {
font-size: 12px;
line-height: 16px;
display: grid;
justify-content: start;
align-items: center;
margin:16px 0 8px;
}
.footer-logo {
width: 20vw;
}
.kontakt-footer {
display: none;
}
/* Profilseiten */
/* Profilseiten */
/* Bild */
.hero__profil-image figure img {
display: block;
height: auto;
width: auto;
}
/* Profil-Container */
.hero__profil-content {
display: flex;
flex-direction: column;
gap: 24px; /* Abstand zwischen den Hauptbereichen (Titel, Untertitel, Icons, Buttons) */
}
/* Titel */
.hero__profil-title {
margin: 0;
font-size: 32px;
line-height: 1.4;
color: #040711;
}
/* Untertitel */
.hero__profil-subtitles {
margin: 0;
}
.hero__profil-subtitles .rte p {
margin-bottom: 12px; /* Abstand zwischen den einzelnen Untertiteln */
}
/* Icons */
.hero__profil-icons {
display: flex;
flex-direction: column;
gap: 16px; /* Abstand zwischen den einzelnen Icon-Elementen */
color: #040711;
}
/* Icon-Stile */
.hero__profil-icons svg {
width: 24px;
height: 24px;
margin-right: 8px;
stroke: #040711;
stroke-width: 1.5;
vertical-align: middle;
fill: none;
}
.icon-mail .email,
.icon-phone .phone,
.icon-fax .fax {
text-decoration: none; /* Keine Unterstreichung */
color: #040711; /* Schwarzer Text */
}
.icon-mail .email:hover,
.icon-phone .phone:hover,
.icon-fax .fax:hover {
text-decoration: underline; /* Unterstreichung beim Hover */
color: #AD122A; /* Primärfarbe beim Hover */
transition: color 0.3s ease-in-out, text-decoration 0.3s ease-in-out;
}
/* Buttons */
.hero__profil-buttons {
display: flex;
gap: 16px; /* Abstand zwischen den Buttons */
}
/* Button-Stile (falls spezifisch benötigt) */
.hero__profil-buttons .button {
flex: 1; /* Buttons gleich breit machen */
}
/* Responsives Verhalten */
@media (max-width: 768px) {
.hero__profil-content {
gap: 16px; /* Reduzierter Abstand zwischen Hauptbereichen */
}
.hero__profil-icons {
gap: 12px;
}
.hero__profil-buttons {
flex-direction: column; /* Buttons untereinander anordnen */
gap: 12px; /* Weniger Abstand im mobilen Layout */
}
}
/*Buttons */
.buttons {
padding-block: 32px;
}
.button a {
display: inline-flex;
align-items: center;
justify-content: center;
padding: 18px 32px;
font-size: 18px;
text-decoration: none;
border-radius: 2px;
transition: background-color 0.3s ease, color 0.3s ease;
gap: 8px; /* Abstand zwischen Text und Icon */
cursor: pointer;
}
/* Icon-Stil für alle Buttons */
.button a::after {
content: "";
display: inline-block;
width: 24px;
height: 24px;
background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23FFF' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='5' y1='12' x2='19' y2='12'%3E%3C/line%3E%3Cpolyline points='12 5 19 12 12 19'%3E%3C/polyline%3E%3C/svg%3E") no-repeat center;
background-size: contain;
}
/* Stile für den roten Button */
.button-red a {
background-color: #ad122a;
color: #fff;
}
.button-red a:hover {
background-color: #981211;
}
/* Stile für den grauen Button */
.button-gray a {
background-color: #f0f0f2;
color: #000000;
}
.button-gray a::after {
background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='5' y1='12' x2='19' y2='12'%3E%3C/line%3E%3Cpolyline points='12 5 19 12 12 19'%3E%3C/polyline%3E%3C/svg%3E") no-repeat center;
}
.button-gray a:hover {
background-color: #303746;
color: #fff;
}
.button-gray a:hover::after {
background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23FFF' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='5' y1='12' x2='19' y2='12'%3E%3C/line%3E%3Cpolyline points='12 5 19 12 12 19'%3E%3C/polyline%3E%3C/svg%3E") no-repeat center;
}
/*Timeline*/
.event__date {
color: #AD122A !important;
}
.timeline-vita {
margin-bottom: 72px;
}
.roadmap.roadmap--orientation-auto .roadmap__events {
width: 100%;
max-width: none;
min-height: 400px;
}
/* Allgemeine Stile für das Formular */
.ce_form.kontakt-seite {
display: block;
padding: 32px;
margin-top: 64px;
background: #fff;
border: 1px solid #e8e8e8;
border-radius: 4px;
box-shadow: 0px 8px 8px rgba(0, 0, 0, 0.16);
}
/* Widgets */
.kontakt-seite .widget-text,
.kontakt-seite .widget-textarea {
margin-bottom: 16px;
color: #040711; /* Dunkle Schrift auf hellem Hintergrund */
}
.kontakt-seite .widget-checkbox {
margin-bottom: 8px;
}
/* Labels */
.kontakt-seite label {
display: block;
color: #040711; /* Dunkle Schrift für bessere Lesbarkeit */
margin-bottom: 4px;
font-family: 'Satoshi', sans-serif;
font-size: 15px;
line-height: 24px;
font-weight: 500;
}
/* Eingabefelder */
.kontakt-seite input,
.kontakt-seite textarea {
width: 100%;
padding: 12px;
border: 1px solid #3037462e; /* Helles Grau für die Grenze */
border-radius: 2px;
font-family: 'Satoshi', sans-serif;
font-size: 15px;
background-color: #ffffff; /* Weißer Hintergrund für Eingabefelder */
}
.kontakt-seite input:focus,
.kontakt-seite textarea:focus {
border-color: #981211; /* Blaue Border beim Fokussieren */
outline: none;
}
/* Checkboxen */
.ce_form.kontakt-seite .widget-checkbox span {
display: flex;
align-items: top;
gap: 8px;
}
.ce_form.kontakt-seite .widget-checkbox input[type="checkbox"] {
appearance: none;
width: 10px;
height: 10px;
border: 1px solid #3037462e;
border-radius: 2px;
background-color: #ffffff;
cursor: pointer;
margin-left: 0;
padding: 7px;
}
.ce_form.kontakt-seite .widget-checkbox input[type="checkbox"]:checked {
background-color: #981211; /* Blauer Hintergrund für gecheckte Boxen */
border-color: #981211;
}
/* Submit-Button */
.kontakt-seite button.submit {
background-color: #ad122a;
color: #fff;
border: none;
padding: 12px 24px;
border-radius: 2px;
font-size: 15px;
cursor: pointer;
position: relative;
line-height: 24px;
font-weight: 700;
display: inline-flex;
align-items: center;
justify-content: center;
gap: 8px; /* Abstand zwischen Text und Icon */
width:100%;
}
.kontakt-seite button.submit:hover {
transition: background-color 0.3s ease;
background-color: #981211;
}
.kontakt-seite button.submit::after {
content: "";
display: inline-block;
width: 24px;
height: 24px;
background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23FFF' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='5' y1='12' x2='19' y2='12'%3E%3C/line%3E%3Cpolyline points='12 5 19 12 12 19'%3E%3C/polyline%3E%3C/svg%3E") no-repeat center;
background-size: contain;
}
/* Erklärungstext */
.kontakt-seite .explanation {
font-size: 12px;
color: #6c757d; /* Dunkelgrau für Erklärungstext */
margin-top: 16px;
}
/* Pflichtfeld-Markierung */
.kontakt-seite .mandatory {
color: #040711; /* Rote Markierung für Pflichtfelder */
font-weight: 500;
}
/* Email-Link */
.kontakt-seite .email {
color: #040711; /* Blau für Links */
text-decoration: underline;
}
.kontakt-seite .email:hover {
color: #00376b; /* Dunkelblau beim Hover */
}
/* ERROR */
/* Fehler-Wrapper */
.widget.error {
margin-bottom: 1.5rem;
}
/* Fehler-Label (Feldname) */
.widget.error > label.error {
color: #b42318; /* seriöses Rot */
font-weight: 600;
display: block;
margin-bottom: 0.25rem;
}
/* Fehlermeldung */
.widget.error > p.error {
color: #b42318;
font-size: 0.875rem;
margin: 0 0 0.5rem 0;
line-height: 1.4;
}
/* Eingabefeld im Fehlerzustand */
.widget.error input.error {
border: 2px solid #b42318;
background-color: #fffafa;
outline: none;
}
/* Fokus trotz Fehler */
.widget.error input.error:focus {
border-color: #8a1c12;
box-shadow: 0 0 0 2px rgba(180, 35, 24, 0.15);
}
.checkbox_container {
border: 0;
margin: 0;
padding: 0;
}
@media (max-width: 767px) {
.logo__lawyer-names {
display: none;
}
}
@media (min-width: 768px) {
.ui-state-default {
pointer-events: none;
}
.ui-accordion-header:after,
.ui-accordion-header:before {
display: none;
}
}
.horizontal-list ol li {
flex: 1 1 calc(50% - 16px); /* Zwei Spalten auf größeren Bildschirmen */
}
.service-card {
margin-bottom: 32px;
}
/* Allgemeine Stile für das Formular-Footer */
.ce_form.kontakt-footer {
display: block;
background-color: transparent;
border-radius: 8px;
}
/* Widgets */
.kontakt-footer__content .widget-text,
.kontakt-footer__content .widget-textarea {
margin-bottom: 16px;
}
.kontakt-footer__content .widget-checkbox {
margin-bottom: 8px;
}
/* Labels */
.kontakt-footer__content label {
display: block;
color: #fff;
margin-bottom: 8px;
font-family: 'Satoshi';
font-size: 15px;
line-height: 24px;
font-weight: 300;
hyphens: auto;
}
/* Eingabefelder */
.kontakt-footer__content input,
.kontakt-footer__content textarea {
width: 100%;
padding: 12px;
border: 1px solid #FFFFFF32;
border-radius: 2px;
font-family: 'Satoshi';
font-size: 15px;
background-color: #ffffff16;
margin-top: 4px;
}
.kontakt-footer__content input:focus,
.kontakt-footer__content textarea:focus {
border-color: #ffffff;
outline: none;
}
.footer-bar__legal-copyright {
justify-content: end;
}
/* Checkboxen */
.ce_form.kontakt-footer .widget-checkbox span {
display: flex;
align-items: top;
gap: 8px;
}
.ce_form.kontakt-footer .widget-checkbox input[type="checkbox"] {
appearance: none;
width: 10px;
height: 10px;
border: 1px solid #ffffff32;
border-radius: 2px;
background-color: #ffffff16;
cursor: pointer;
margin-left: 0;
padding: 7px;
}
.ce_form.kontakt-footer .widget-checkbox input[type="checkbox"]:checked {
background-color: #ad122a;
border-color: #ad122a;
}
/* Submit-Button */
.kontakt-footer__content button.submit {
background-color: #ad122a;
color: #fff;
border: none;
padding: 12px 24px;
border-radius: 2px;
font-size: 15px;
cursor: pointer;
position: relative;
line-height: 24px;
font-weight: 700;
display: inline-flex;
align-items: center;
justify-content: center;
gap: 8px; /* Abstand zwischen Text und Icon */
}
.kontakt-footer__content button.submit:hover {
transition: background-color 0.3s ease;
background-color: #981211;
}
.kontakt-footer__content button.submit::after {
content: "";
display: inline-block;
width: 24px;
height: 24px;
background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23FFF' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='5' y1='12' x2='19' y2='12'%3E%3C/line%3E%3Cpolyline points='12 5 19 12 12 19'%3E%3C/polyline%3E%3C/svg%3E") no-repeat center;
background-size: contain;
}
/* Erklärungstext */
.kontakt-footer__content .explanation {
font-size: 12px;
line-height: 15px;
font-weight: 300;
color: #F0F0F2;
margin-top: 16px;
margin-bottom: 32px;
}
/* Pflichtfeld-Markierung */
.kontakt-footer__content .mandatory {
color: #fff;
}
/* Versteckte Labels (außer für Checkboxen) */
.ce_form.kontakt-footer .widget:not(.widget-checkbox) label {
position: absolute;
width: 1px;
height: 1px;
padding: 0;
margin: -1px;
overflow: hidden;
clip: rect(0, 0, 0, 0);
white-space: nowrap;
border: 0;
}
.kontakt-footer__content .email {
color: #fff; /* Weiße Schriftfarbe */
text-decoration: none; /* Unterstreichung entfernen */
}
.kontakt-footer__content .email:hover {
text-decoration: underline; /* Unterstreichung beim Hover */
}
}
.pattern {
background-color: #ffffff;
opacity: 0.8;
background-image: radial-gradient(#981211 0.5px, transparent 0.5px), radial-gradient(#981211 0.5px, #fff 0.5px);
background-size: 20px 20px;
background-position: 0 0,10px 10px;
}
@media (min-width: 1024px) {
.navigation-bar-bottom,
.mobile {
display: none;
}
.desktop {
display: block !important;
}
/* Mega-Menü */
.nav-megamenu {
display: block;
}
.mod_navigation li.mm_container .mm_dropdown > .inner {
padding: 1rem 2rem;
border: 1px solid #E5DFDC;
background-color: #F0F0F2;
opacity: 0.98;
}
.mod_customnav.nav-megamenu {
display: flex;
flex-wrap: wrap;
background-color: #F0F0F2;
padding: 24px;
gap: 16px;
}
.mod_customnav.nav-megamenu h2 {
font-size: 1.5rem;
margin-bottom: 16px;
color: #AD122A;
font-weight: bold;
}
.mod_customnav.nav-megamenu ul {
list-style: none;
padding: 0;
margin: 0;
}
.mod_customnav.nav-megamenu li {
margin-bottom: 8px;
}
.mod_customnav.nav-megamenu a {
display: block;
text-decoration: none;
color: #303746;
border-bottom: 1px solid transparent;
transition: color 0.3s, border-bottom 0.3s;
}
.mod_customnav.nav-megamenu a:hover {
color: #AD122A;
border-bottom: 1px solid #AD122A;
}
.mod_customnav.nav-megamenu a:focus {
outline: 1px solid #981211;
outline-offset: 1px;
}
/* Untermenüs sichtbar bei Hover oder Fokus */
/*.mod_customnav.submenu {
display: none;
position: absolute;
background-color: #F0F0F2;
padding: 16px;
border-radius: 8px;
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
min-width: 200px;
}*/
.mod_customnav.submenu ul {
margin-top: 0;
display: block;
margin-bottom:36px;
}
.mod_customnav.nav-megamenu li:hover .submenu,
.mod_customnav.nav-megamenu li:focus-within .submenu {
display: block; /* Untermenü wird angezeigt */
}
/* Stil für das Untermenü, das in einem Mega-Menü angezeigt wird */
.mod_customnav.submenu h2 {
font-size: 1.25rem;
color: #AD122A;
font-weight: 400;
margin-bottom: 4px;
line-height: 2;
display: flex;
align-items: center;
text-decoration: underline;
text-underline-offset: 8px;
}
/*.mod_customnav.submenu h2 svg {
width: 24px;
height: 24px;
margin-right: 4px;
stroke: #AD122A;
stroke-width: 1.5;
}*/
/* Styling für die Links im Untermenü */
.mod_customnav.submenu a {
color: #303746;
padding: 4px 0;
font-size: 13px;
line-height: 19px;
}
.mod_customnav.submenu a:hover {
color: #AD122A;
text-decoration: underline;
}
.mod_customnav.submenu a:hover::before {
content: "";
position: absolute;
top: calc(clamp(0.722rem, 2.024vw + 0.362rem, 1rem));
left: -25px;
transform: translateY(-50%);
width: 20px;
height: 20px;
background: #AD122A;
-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' class='feather feather-arrow-right'%3E%3Cline x1='5' y1='12' x2='19' y2='12'%3E%3C/line%3E%3Cpolyline points='12 5 19 12 12 19'%3E%3C/polyline%3E%3C/svg%3E") center/contain no-repeat;
mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' class='feather feather-arrow-right'%3E%3Cline x1='5' y1='12' x2='19' y2='12'%3E%3C/line%3E%3Cpolyline points='12 5 19 12 12 19'%3E%3C/polyline%3E%3C/svg%3E") center/contain no-repeat;
transition: background 0.3s ease;
}
.mod_customnav.submenu a:focus {
outline: 1px solid #981211;
outline-offset: 1px;
}
/* Megamenü*/
.nav-megamenu a,
.nav-megamenu strong {
font-size: 18px;
line-height: 32px;
font-weight: 400;
position: relative;
display: block;
transition: color 0.2s ease-in-out, text-decoration 0.2s ease-in-out;
color: #040711;
text-decoration: none;
padding: 8px 4px;
}
/*.nav-megamenu a::after {
content: "";
position: absolute;
right: -16px;
top: 30%;
width: 24px;
height: 24px;
background: url("../../files/theme/img/chevron-down.svg") no-repeat center;
}*/
.nav-megamenu a:hover,
.nav-megamenu a:focus {
color: #AD122A;
}
.nav-megamenu a.trail,
.nav-megamenu strong {
color: #040711;
}
nav ul {
list-style: none;
margin: 0;
padding: 0;
}
.nav-megamenu ul {
gap: 1rem;
justify-content: flex-end;
align-items: center;
display: flex;
flex-wrap: wrap;
}
.submenu__text {
text-transform: uppercase;
font-weight: bold;
display: inline-block;
border-bottom: 1px solid #040711;
padding-bottom: 2px;
font-size: 0.75rem;
font-weight: 600;
}
.invisible {
border: 0;
clip: rect(0 0 0 0);
height: 1px;
margin: -1px;
overflow: hidden;
padding: 0;
position: absolute;
width: 1px;
float: left;
}
#header .inside {
display: flex;
justify-content: space-between;
width: 100%;
align-items: center;
}
.header-top-bar {
display:block;
grid-area:metabar;
background-color:#303746;
color: #F0F0F2;
font-size: 15px;
line-height: 16px;
}
.header-top-bar .inner {
display:flex;
gap:1rem 2rem;
flex-wrap:wrap;
justify-content:flex-end;
align-items:center;
display: flex;
gap: 1rem 2rem;
flex-wrap: wrap;
justify-content: flex-end;
align-items: center;
padding-left: clamp(0.889rem, calc(0.889rem + ((1vw - 0.2rem) * 3.81)), 3.556rem);
padding-right: clamp(0.889rem, calc(0.889rem + ((1vw - 0.2rem) * 3.81)), 3.556rem);
margin: auto;
max-width: clamp(320px, calc(100vw - 32px), 1440px);
}
.logo {
grid-area:logo;
display:flex;
align-items: end;
}
.logo svg {
top: -40px;
}
.header-top-bar svg {
width: 18px;
height: 18px;
stroke: #fff;
stroke-width: 1.5;
margin-right: 2px;
position: relative;
top: 3px;
}
/* Links anpassen */
#top-bar a {
color: inherit;
text-decoration: none;
}
#top-bar a:hover {
text-decoration: underline;
}
/* Sprachenwechsler */
nav.mod_changelanguage {
position: relative;
display: inline-block;
max-width: 128px;
}
/* Basis-Styles für das Select-Tag */
nav.mod_changelanguage .level_1 {
width: 100%;
padding: 8px 32px 8px 36px; /* Platz für Icons */
font-size: 16px;
font-family: Satoshi, sans-serif;
color: #f0f0f2; /* Schriftfarbe im normalen Zustand */
border: 0; /* Heller Rand im normalen Zustand */
background-color: transparent; /* Hintergrundfarbe im normalen Zustand */
appearance: none; /* Entfernt das Standard-Dropdown-Design */
background-image: url('data:image/svg+xml;charset=UTF-8,');
background-repeat: no-repeat;
background-position: right 8px center;
background-size: 12px;
transition: background-color 0.3s ease, color 0.3s ease; /* Sanfte Übergänge für Hintergrund und Textfarbe */
}
/* Hover-Zustand */
nav.mod_changelanguage .level_1:hover {
background-color: #f0f0f2; /* Hintergrundfarbe im Hover-Zustand */
color: #303746; /* Schriftfarbe im Hover-Zustand */
border-color: #AD122A; /* Randfarbe im Hover-Zustand */
background-image: url('data:image/svg+xml;charset=UTF-8,'); /* Hintergrundfarbe des SVG ändern */
}
/* Globe-Icon vor dem Select-Tag als Inline-SVG */
nav.mod_changelanguage::before {
content: '';
position: absolute;
top: 50%;
left: 10px;
transform: translateY(-50%);
width: 16px;
height: 16px;
background-image: url('data:image/svg+xml;charset=UTF-8,');
background-repeat: no-repeat;
background-size: contain;
stroke: currentColor; /* Setzt die Farbe des Icons basierend auf der Textfarbe */
}
/* Hover-Zustand für das Globe-Icon */
nav.mod_changelanguage:hover::before {
background-image: url('data:image/svg+xml;charset=UTF-8,');
}
/* Option-Elemente im Select */
nav.mod_changelanguage .level_1 option {
font-size: 16px;
font-family: Satoshi, sans-serif;
color: #f0f0f2; /* Schriftfarbe der Optionen im normalen Zustand */
background-color: transparent; /* Hintergrundfarbe der Optionen im normalen Zustand */
border: 1px solid #F0F0F2; /* Randfarbe der Optionen im normalen Zustand */
}
/* Hover-Zustand für die Option-Elemente */
nav.mod_changelanguage .level_1 option:hover {
background-color: #f0f0f2; /* Hintergrundfarbe im Hover-Zustand */
color: #303746; /* Schriftfarbe im Hover-Zustand */
}
.horizontal-list ol li {
flex: 1 1 calc(25% - 16px); /* Vier Spalten auf noch größeren Bildschirmen */
}
.horizontal-list-border ol {
display: grid;
grid-template-columns: repeat(2, 1fr); /* Zwei Spalten */
gap: 16px; /* Abstand zwischen den Listenelementen */
}
.horizontal-list-border {
column-count: 2; /* Zwei Spalten */
column-gap: 48px; /* Abstand zwischen den Spalten */
}
/* Auf größeren Geräten etwas mehr Abstand zwischen den Listenelementen */
.horizontal-list-border .list-item {
margin-bottom: 48px;
}
.footer-bar {
margin-bottom: 0px;
}
/** .service-card__desktop {
display: block;
}
.service-card__mobile {
display:none;
}*/
.lawyer-cards.lawyer-cards__desktop {
display: grid !important;
}
.lawyer-cards.lawyer-cards__mobile {
display: none !important;
}
.service-card h3 {
align-items: start;
flex-direction: column;
font-weight: 400;
}
}
@media (min-width: 1200px) {
.hero__highlight-box {
flex-direction: column;
justify-content: center;
aspect-ratio: 1 / 1;
/*margin: auto;*/
}
.hero__highlight-boxes {
margin-top: 0 !important;
}
.hero__highlight-box-text {
text-align: center;
padding: 0 32px;
}
.service-card h3 svg {
margin-left: -4px;
margin-bottom: 16px;
}
.service-card__link a {
font-weight: 400;
}
.horizontal-list ol {
flex-wrap: nowrap;
}
.mod_faqpage {
padding: 0 15%;
}
.nav-megamenu ul {
gap:2rem;
}
.footer-logo {
width: 12vw;
}
}
@media (max-width: 1199px) {
.hero__profil-image figure img {
width: 100%;
}
}
/**
* CLICKPRESS CSS-Grid
* @author: Stefan Schulz-Lauterbach
*
* thanks to Dinko Skopljak for co-working
*/
.justify-items-start {
justify-items: start;
}
.justify-items-center {
justify-items: center;
}
.justify-items-end {
justify-items: end;
}
.justify-items-stretch {
justify-items: stretch;
}
.content-start {
align-content: start;
}
.content-center {
align-content: center;
}
.content-end {
align-content: end;
}
.items-start {
align-items: start;
}
.items-center {
align-items: center;
}
.items-end {
align-items: end;
}
.items-stretch {
align-items: stretch;
}
.items-baseline {
align-items: baseline;
}
[class*=grid_] {
display: grid !important;
grid-gap: 1rem;
}
[class*=grid_] > .block {
margin-bottom: 0;
}
@media (max-width: 767px) {
.grid_mobile_100 {
grid-template-columns: 1fr;
}
.grid_mobile_50_50 {
grid-template-columns: repeat(2, 1fr);
}
.grid_mobile_33_33_33 {
grid-template-columns: repeat(3, 1fr);
}
.grid_mobile_25_25_25_25 {
grid-template-columns: repeat(4, 1fr);
}
.grid_mobile_75_25 {
grid-template-columns: 3fr 1fr;
}
.grid_mobile_25_75 {
grid-template-columns: 1fr 3fr;
}
.grid_mobile_66_33 {
grid-template-columns: 2fr 1fr;
}
.grid_mobile_33_66 {
grid-template-columns: 1fr 2fr;
}
.grid_mobile_60_40 {
grid-template-columns: 3fr 2fr;
}
.grid_mobile_40_60 {
grid-template-columns: 2fr 3fr;
}
.grid_mobile_50_25_25 {
grid-template-columns: 3fr 1fr 1fr;
}
.grid_mobile_25_50_25 {
grid-template-columns: 1fr 2fr 1fr;
}
.grid_mobile_25_25_50 {
grid-template-columns: 1fr 1fr 2fr;
}
.grid_mobile_40_30_30 {
grid-template-columns: 4fr 3fr 3fr;
}
.grid_mobile_30_40_30 {
grid-template-columns: 3fr 4fr 3fr;
}
.grid_mobile_30_30_40 {
grid-template-columns: 3fr 3fr 4fr;
}
.gap_mobile_0 {
grid-gap: 0;
}
.gap_mobile_1 {
grid-gap: 1rem;
}
.gap_mobile_2 {
grid-gap: 2rem;
}
.gap_mobile_3 {
grid-gap: 3rem;
}
.gap_mobile_4 {
grid-gap: 4rem;
}
.gap_mobile_5 {
grid-gap: 5rem;
}
.gap_mobile_6 {
grid-gap: 6rem;
}
.gap_mobile_7 {
grid-gap: 7rem;
}
.gap_mobile_8 {
grid-gap: 8rem;
}
.gap_mobile_9 {
grid-gap: 9rem;
}
.gap_mobile_10 {
grid-gap: 10rem;
}
.gap_mobile_11 {
grid-gap: 11rem;
}
.gap_mobile_12 {
grid-gap: 12rem;
}
}
@media (min-width: 768px) {
.grid_tablet_100 {
grid-template-columns: 1fr;
}
.grid_tablet_50_50 {
grid-template-columns: repeat(2, 1fr);
}
.grid_tablet_33_33_33 {
grid-template-columns: repeat(3, 1fr);
}
.grid_tablet_25_25_25_25 {
grid-template-columns: repeat(4, 1fr);
}
.grid_tablet_75_25 {
grid-template-columns: 3fr 1fr;
}
.grid_tablet_25_75 {
grid-template-columns: 1fr 3fr;
}
.grid_tablet_66_33 {
grid-template-columns: 2fr 1fr;
}
.grid_tablet_33_66 {
grid-template-columns: 1fr 2fr;
}
.grid_tablet_60_40 {
grid-template-columns: 3fr 2fr;
}
.grid_tablet_40_60 {
grid-template-columns: 2fr 3fr;
}
.grid_tablet_50_25_25 {
grid-template-columns: 2fr 1fr 1fr;
}
.grid_tablet_25_50_25 {
grid-template-columns: 1fr 2fr 1fr;
}
.grid_tablet_25_25_50 {
grid-template-columns: 1fr 1fr 2fr;
}
.grid_tablet_40_30_30 {
grid-template-columns: 4fr 3fr 3fr;
}
.grid_tablet_30_40_30 {
grid-template-columns: 3fr 4fr 3fr;
}
.grid_tablet_30_30_40 {
grid-template-columns: 3fr 3fr 4fr;
}
.grid_tablet_20_40_40 {
grid-template-columns: 1fr 2fr 2fr;
}
.grid_tablet_40_20_40 {
grid-template-columns: 2fr 1fr 2fr;
}
.grid_tablet_40_40_20 {
grid-template-columns: 2fr 2fr 1fr;
}
.gap_tablet_0 {
grid-gap: 0;
}
.gap_tablet_1 {
grid-gap: 1rem;
}
.gap_tablet_2 {
grid-gap: 2rem;
}
.gap_tablet_3 {
grid-gap: 3rem;
}
.gap_tablet_4 {
grid-gap: 4rem;
}
.gap_tablet_5 {
grid-gap: 5rem;
}
.gap_tablet_6 {
grid-gap: 6rem;
}
.gap_tablet_7 {
grid-gap: 7rem;
}
.gap_tablet_8 {
grid-gap: 8rem;
}
.gap_tablet_9 {
grid-gap: 9rem;
}
.gap_tablet_10 {
grid-gap: 10rem;
}
.gap_tablet_11 {
grid-gap: 11rem;
}
.gap_tablet_12 {
grid-gap: 12rem;
}
}
@media (min-width: 1200px) {
.grid_desktop_100 {
grid-template-columns: 1fr;
}
.grid_desktop_50_50 {
grid-template-columns: repeat(2, 1fr);
}
.grid_desktop_50_25_25 {
grid-template-columns: 2fr 1fr 1fr;
}
.grid_desktop_33_33_33 {
grid-template-columns: repeat(3, 1fr);
}
.grid_desktop_75_25 {
grid-template-columns: 3fr 1fr;
}
.grid_desktop_25_75 {
grid-template-columns: 1fr 3fr;
}
.grid_desktop_66_33 {
grid-template-columns: 2fr 1fr;
}
.grid_desktop_60_40 {
grid-template-columns: 3fr 2fr;
}
.grid_desktop_40_60 {
grid-template-columns: 2fr 3fr;
}
.grid_desktop_33_66 {
grid-template-columns: 1fr 2fr;
}
.grid_desktop_50_25_25 {
grid-template-columns: 2fr 1fr 1fr;
}
.grid_desktop_40_30_30 {
grid-template-columns: 4fr 3fr 3fr;
}
/** Achtung für die Startseite von 2fr auf 3fr geändert */
.grid_desktop_50_25_25 {
grid-template-columns: 3fr 1fr 1fr;
}
.grid_desktop_25_50_25 {
grid-template-columns: 1fr 2fr 1fr;
}
.grid_desktop_25_25_50 {
grid-template-columns: 1fr 1fr 2fr;
}
.grid_desktop_40_30_30 {
grid-template-columns: 4fr 3fr 3fr;
}
.grid_desktop_30_40_30 {
grid-template-columns: 3fr 4fr 3fr;
}
.grid_desktop_30_30_40 {
grid-template-columns: 3fr 3fr 4fr;
}
.grid_desktop_20_40_40 {
grid-template-columns: 1fr 2fr 2fr;
}
.grid_desktop_40_20_40 {
grid-template-columns: 2fr 1fr 2fr;
}
.grid_desktop_40_40_20 {
grid-template-columns: 2fr 2fr 1fr;
}
.grid_desktop_25_25_25_25 {
grid-template-columns: repeat(4, 1fr);
}
.grid_desktop_40_20_20_20 {
grid-template-columns: 2fr 1fr 1fr 1fr;
}
.grid_desktop_20_40_20_20 {
grid-template-columns: 1fr 2fr 1fr 1fr;
}
.grid_desktop_20_20_40_20 {
grid-template-columns: 1fr 1fr 2fr 1fr;
}
.grid_desktop_20_20_20_40 {
grid-template-columns: 1fr 1fr 1fr 2fr;
}
.grid_desktop_20_20_20_20_20 {
grid-template-columns: repeat(5, 1fr);
}
.grid_desktop_16_16_16_16_16_16 {
grid-template-columns: repeat(6, 1fr);
}
.gap_desktop_0 {
grid-gap: 0;
}
.gap_desktop_1 {
grid-gap: 1rem;
}
.gap_desktop_2 {
grid-gap: 2rem;
}
.gap_desktop_3 {
grid-gap: 3rem;
}
.gap_desktop_4 {
grid-gap: 4rem;
}
.gap_desktop_5 {
grid-gap: 5rem;
}
.gap_desktop_6 {
grid-gap: 6rem;
}
.gap_desktop_7 {
grid-gap: 7rem;
}
.gap_desktop_8 {
grid-gap: 8rem;
}
.gap_desktop_9 {
grid-gap: 9rem;
}
.gap_desktop_10 {
grid-gap: 10rem;
}
.gap_desktop_11 {
grid-gap: 11rem;
}
.gap_desktop_12 {
grid-gap: 12rem;
}
}/*# sourceMappingURL=clickpress-grid.css.map */