.elementor-57813 .elementor-element.elementor-element-73b9c869{--display:flex;--flex-direction:row;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--align-items:center;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--margin-top:0%;--margin-bottom:0%;--margin-left:0%;--margin-right:0%;--padding-top:0%;--padding-bottom:0%;--padding-left:0%;--padding-right:8%;--z-index:95;}.elementor-57813 .elementor-element.elementor-element-73b9c869:not(.elementor-motion-effects-element-type-background), .elementor-57813 .elementor-element.elementor-element-73b9c869 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#DB003100;}.elementor-57813 .elementor-element.elementor-element-15f9483c{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--justify-content:center;--gap:20px 20px;--row-gap:20px;--column-gap:20px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-57813 .elementor-element.elementor-element-15f9483c:not(.elementor-motion-effects-element-type-background), .elementor-57813 .elementor-element.elementor-element-15f9483c > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#DB003100;background-image:url("https://joka.variaplus.de/wp-content/uploads/2025/10/markgraf-schraege-weiss-nav.svg");background-position:center left;background-repeat:no-repeat;background-size:contain;}.elementor-57813 .elementor-element.elementor-element-9b93ce0{padding:15px 15px 15px 15px;text-align:left;}.elementor-57813 .elementor-element.elementor-element-9b93ce0 img{width:100%;max-width:100%;}.elementor-57813 .elementor-element.elementor-element-675982d2{--display:flex;--flex-direction:row;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--justify-content:space-evenly;--align-items:center;--gap:31px 31px;--row-gap:31px;--column-gap:31px;--padding-top:0%;--padding-bottom:0%;--padding-left:0%;--padding-right:0%;}.elementor-57813 .elementor-element.elementor-element-3191cc77 .elementor-menu-toggle{margin-left:auto;background-color:var( --e-global-color-background );}.elementor-57813 .elementor-element.elementor-element-3191cc77 .elementor-nav-menu .elementor-item{font-family:"Akzidenz Grotesk Pro", Sans-serif;font-size:14px;font-weight:300;text-transform:uppercase;line-height:1.5em;}.elementor-57813 .elementor-element.elementor-element-3191cc77 .elementor-nav-menu--main .elementor-item{color:var( --e-global-color-background );fill:var( --e-global-color-background );padding-left:15px;padding-right:15px;padding-top:5px;padding-bottom:5px;}.elementor-57813 .elementor-element.elementor-element-3191cc77 .elementor-nav-menu--main .elementor-item:hover, .elementor-57813 .elementor-element.elementor-element-3191cc77 .elementor-nav-menu--main .elementor-item.elementor-item-active, .elementor-57813 .elementor-element.elementor-element-3191cc77 .elementor-nav-menu--main .elementor-item.highlighted, .elementor-57813 .elementor-element.elementor-element-3191cc77 .elementor-nav-menu--main .elementor-item:focus{color:var( --e-global-color-primary );fill:var( --e-global-color-primary );}.elementor-57813 .elementor-element.elementor-element-3191cc77 .elementor-nav-menu--main:not(.e--pointer-framed) .elementor-item:before, .elementor-57813 .elementor-element.elementor-element-3191cc77 .elementor-nav-menu--main:not(.e--pointer-framed) .elementor-item:after{background-color:var( --e-global-color-primary );}.elementor-57813 .elementor-element.elementor-element-3191cc77 .e--pointer-framed .elementor-item:before, .elementor-57813 .elementor-element.elementor-element-3191cc77 .e--pointer-framed .elementor-item:after{border-color:var( --e-global-color-primary );}.elementor-57813 .elementor-element.elementor-element-3191cc77 .elementor-nav-menu--main .elementor-item.elementor-item-active{color:var( --e-global-color-primary );}.elementor-57813 .elementor-element.elementor-element-3191cc77 .elementor-nav-menu--main:not(.e--pointer-framed) .elementor-item.elementor-item-active:before, .elementor-57813 .elementor-element.elementor-element-3191cc77 .elementor-nav-menu--main:not(.e--pointer-framed) .elementor-item.elementor-item-active:after{background-color:var( --e-global-color-primary );}.elementor-57813 .elementor-element.elementor-element-3191cc77 .e--pointer-framed .elementor-item.elementor-item-active:before, .elementor-57813 .elementor-element.elementor-element-3191cc77 .e--pointer-framed .elementor-item.elementor-item-active:after{border-color:var( --e-global-color-primary );}.elementor-57813 .elementor-element.elementor-element-3191cc77 .e--pointer-framed .elementor-item:before{border-width:1px;}.elementor-57813 .elementor-element.elementor-element-3191cc77 .e--pointer-framed.e--animation-draw .elementor-item:before{border-width:0 0 1px 1px;}.elementor-57813 .elementor-element.elementor-element-3191cc77 .e--pointer-framed.e--animation-draw .elementor-item:after{border-width:1px 1px 0 0;}.elementor-57813 .elementor-element.elementor-element-3191cc77 .e--pointer-framed.e--animation-corners .elementor-item:before{border-width:1px 0 0 1px;}.elementor-57813 .elementor-element.elementor-element-3191cc77 .e--pointer-framed.e--animation-corners .elementor-item:after{border-width:0 1px 1px 0;}.elementor-57813 .elementor-element.elementor-element-3191cc77 .e--pointer-underline .elementor-item:after, .elementor-57813 .elementor-element.elementor-element-3191cc77 .e--pointer-overline .elementor-item:before, .elementor-57813 .elementor-element.elementor-element-3191cc77 .e--pointer-double-line .elementor-item:before, .elementor-57813 .elementor-element.elementor-element-3191cc77 .e--pointer-double-line .elementor-item:after{height:1px;}.elementor-57813 .elementor-element.elementor-element-3191cc77{--e-nav-menu-horizontal-menu-item-margin:calc( 30px / 2 );}.elementor-57813 .elementor-element.elementor-element-3191cc77 .elementor-nav-menu--main:not(.elementor-nav-menu--layout-horizontal) .elementor-nav-menu > li:not(:last-child){margin-bottom:30px;}.elementor-57813 .elementor-element.elementor-element-3191cc77 .elementor-nav-menu--dropdown a, .elementor-57813 .elementor-element.elementor-element-3191cc77 .elementor-menu-toggle{color:var( --e-global-color-primary );fill:var( --e-global-color-primary );}.elementor-57813 .elementor-element.elementor-element-3191cc77 .elementor-nav-menu--dropdown{background-color:#F3F5F8;}.elementor-57813 .elementor-element.elementor-element-3191cc77 .elementor-nav-menu--dropdown a:hover, .elementor-57813 .elementor-element.elementor-element-3191cc77 .elementor-nav-menu--dropdown a:focus, .elementor-57813 .elementor-element.elementor-element-3191cc77 .elementor-nav-menu--dropdown a.elementor-item-active, .elementor-57813 .elementor-element.elementor-element-3191cc77 .elementor-nav-menu--dropdown a.highlighted{background-color:#F9FAFD;}.elementor-57813 .elementor-element.elementor-element-3191cc77 .elementor-nav-menu--dropdown a.elementor-item-active{color:var( --e-global-color-primary );background-color:#F9FAFD;}.elementor-57813 .elementor-element.elementor-element-3191cc77 .elementor-nav-menu--dropdown .elementor-item, .elementor-57813 .elementor-element.elementor-element-3191cc77 .elementor-nav-menu--dropdown .elementor-sub-item{font-family:"Poppins", Sans-serif;font-size:16px;font-weight:400;text-transform:capitalize;font-style:normal;text-decoration:none;letter-spacing:0px;word-spacing:0em;}.elementor-57813 .elementor-element.elementor-element-3191cc77 div.elementor-menu-toggle{color:var( --e-global-color-primary );}.elementor-57813 .elementor-element.elementor-element-3191cc77 div.elementor-menu-toggle svg{fill:var( --e-global-color-primary );}.elementor-theme-builder-content-area{height:400px;}.elementor-location-header:before, .elementor-location-footer:before{content:"";display:table;clear:both;}@media(min-width:768px){.elementor-57813 .elementor-element.elementor-element-15f9483c{--width:20%;}.elementor-57813 .elementor-element.elementor-element-675982d2{--width:80%;}}@media(max-width:1025px) and (min-width:768px){.elementor-57813 .elementor-element.elementor-element-15f9483c{--width:15%;}.elementor-57813 .elementor-element.elementor-element-675982d2{--width:85%;}}@media(max-width:1025px){.elementor-57813 .elementor-element.elementor-element-73b9c869{--min-height:85px;--padding-top:0%;--padding-bottom:0%;--padding-left:5%;--padding-right:5%;}.elementor-57813 .elementor-element.elementor-element-9b93ce0 img{height:27px;}.elementor-57813 .elementor-element.elementor-element-3191cc77 .elementor-nav-menu--dropdown .elementor-item, .elementor-57813 .elementor-element.elementor-element-3191cc77 .elementor-nav-menu--dropdown .elementor-sub-item{font-size:14px;}}@media(max-width:767px){.elementor-57813 .elementor-element.elementor-element-15f9483c{--width:50%;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-57813 .elementor-element.elementor-element-9b93ce0.elementor-element{--flex-grow:1;--flex-shrink:0;}.elementor-57813 .elementor-element.elementor-element-9b93ce0 img{height:1px;}.elementor-57813 .elementor-element.elementor-element-675982d2{--width:50%;}.elementor-57813 .elementor-element.elementor-element-3191cc77.elementor-element{--flex-grow:1;--flex-shrink:0;}.elementor-57813 .elementor-element.elementor-element-3191cc77 .elementor-nav-menu--dropdown a{padding-top:14px;padding-bottom:14px;}.elementor-57813 .elementor-element.elementor-element-3191cc77 .elementor-nav-menu--main > .elementor-nav-menu > li > .elementor-nav-menu--dropdown, .elementor-57813 .elementor-element.elementor-element-3191cc77 .elementor-nav-menu__container.elementor-nav-menu--dropdown{margin-top:15px !important;}.elementor-57813 .elementor-element.elementor-element-3191cc77{--nav-menu-icon-size:20px;}}/* Start custom CSS *//*** * Shrinking Sticky header, no container edition * class: .sticky-header * Uses the built-in .elementor-container class for shrinking the header in non-container installs */ header.sticky-header { --header-height: 110px; /* Set your own header height */ --shrink-header-to: 0.5; /* Shrinks to 60%, values: 0.1 to 1 */ --transition-timing: .45s cubic-bezier(.4, 0, .2, 1); /* values: .1s to 0.5s (or more), replace "cubic-bezier(.4, 0, .2, 1)" with "ease" if you need a simpler transition */ background-color: rgba(244, 245, 248, 1); /* Set your own background color */ transition: background-color var(--transition-timing), backdrop-filter var(--transition-timing), box-shadow var(--transition-timing); } .sticky-header.elementor-sticky--effects { background-color: rgba(244, 245, 248, .3) !important; /* Set your own background color on scroll */ box-shadow: 0px 4px 13px 1px rgba(0, 0, 0, .10); z-index:9; /* Delete this line if you don't want shadow on scroll */ -webkit-backdrop-filter: saturate(100%) blur(20px); /* Delete this line if you don't use transparency on scroll */ backdrop-filter: saturate(100%) blur(20px); /* Delete this line if you don't use transparency on scroll */ } .sticky-header > .elementor-container { min-height: var(--header-height); transition: min-height var(--transition-timing); } .sticky-header.elementor-sticky--effects > .elementor-container { min-height: calc( var(--header-height) * var(--shrink-header-to) ); } /*** * Shrinking Sticky header, Elementor Container edition * class: .sticky-header * This will only work with the Elementor container section * the header uses additional 3 classes to gain higher CSS specificity and to avoid adding !important */ .sticky-header.e-container.elementor-element { --header-height: 90px; /* Set your own header height */ --shrink-header-to: 0.6; /* Shrinks to 60%, values: 0.1 to 1 */ --transition-timing: .45s cubic-bezier(.4, 0, .2, 1); /* values: .1s to 0.5s (or more), replace "cubic-bezier(.4, 0, .2, 1)" with "ease" if you need a simpler transition */ background-color: rgba(244, 245, 248, 1); /* Set your own background color */ --min-height: var(--header-height); --transition: background-color var(--transition-timing), backdrop-filter var(--transition-timing), box-shadow var(--transition-timing), min-height var(--transition-timing); } .sticky-header.e-container.elementor-element.elementor-sticky--effects { background-color: rgba(244, 245, 248, .8); /* Set your own background color on scroll */ box-shadow: 0px 4px 33px 1px rgba(0, 0, 0, .07); /* Delete this line if you don't want shadow on scroll */ -webkit-backdrop-filter: saturate(180%) blur(20px); /* Delete this line if you don't use transparency on scroll */ backdrop-filter: saturate(180%) blur(20px); /* Delete this line if you don't use transparency on scroll */ --min-height: calc( var(--header-height) * var(--shrink-header-to) ); } /*** * class: .logo * Add the class "logo" to your logo to scale your logo to 80% on scroll */ header.sticky-header .logo img, header.sticky-header .logo.elementor-widget-theme-site-logo img, header.sticky-header .logo .elementor-icon svg { --logo-height: 65px; /* This should be the original logo height _before_ being shrunk */ --logo-shrink-to: 0.75; /* Shrinks logo to 80%, values: 0.10 to 1.00, where 1.00, as in 100%, won't shrink the logo */ height: var(--logo-height); transition: height var(--transition-timing); } header.sticky-header.elementor-sticky--effects .logo img, header.sticky-header.elementor-sticky--effects .logo.elementor-widget-theme-site-logo img, header.sticky-header.elementor-sticky--effects .logo .elementor-icon svg { height: calc(var(--logo-height) * var(--logo-shrink-to)); } header.sticky-header .logo .elementor-icon svg { width: auto; } /*** * Optional: Shorter header on mobile */ @media only screen and (max-width: 767px) { header.sticky-header, header.sticky-header.e-container.elementor-element { --header-height: 70px; } } /*** * Optional: Change nav menu text color on scroll */ header.sticky-header.elementor-sticky--effects .elementor-item { color: black !important; /* Set your own nav menu font color on scroll */ } header.sticky-header.elementor-sticky--effects .elementor-item:active { color: #db0031 !important; /* This will be the mouse hover color for the menu on scroll */ } header.sticky-header.elementor-sticky--effects .elementor-item:hover { color: #db0031 !important; /* This will be the mouse hover color for the menu on scroll */ }/* End custom CSS */