.elementor-99 .elementor-element.elementor-element-fc4f2bf{--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-between;--align-items:center;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--padding-top:20px;--padding-bottom:20px;--padding-left:64px;--padding-right:64px;--z-index:999;}.elementor-99 .elementor-element.elementor-element-fc4f2bf:not(.elementor-motion-effects-element-type-background), .elementor-99 .elementor-element.elementor-element-fc4f2bf > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#FFFFFF;}.elementor-99 .elementor-element.elementor-element-5f0084a.elementor-element{--flex-grow:0;--flex-shrink:0;}.elementor-99 .elementor-element.elementor-element-5f0084a img{width:244px;}.elementor-99 .elementor-element.elementor-element-82a7651{--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:36px 36px;--row-gap:36px;--column-gap:36px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-99 .elementor-element.elementor-element-82a7651.e-con{--flex-grow:0;--flex-shrink:1;}.elementor-99 .elementor-element.elementor-element-8c9d67f .elementor-menu-toggle{margin-left:auto;background-color:#FFFFFF00;}.elementor-99 .elementor-element.elementor-element-8c9d67f .elementor-nav-menu .elementor-item{font-family:"Kind Sans", Sans-serif;font-size:16px;line-height:150%;}.elementor-99 .elementor-element.elementor-element-8c9d67f .elementor-nav-menu--main .elementor-item{color:var( --e-global-color-accent );fill:var( --e-global-color-accent );}.elementor-99 .elementor-element.elementor-element-8c9d67f .e--pointer-framed .elementor-item:before{border-width:0px;}.elementor-99 .elementor-element.elementor-element-8c9d67f .e--pointer-framed.e--animation-draw .elementor-item:before{border-width:0 0 0px 0px;}.elementor-99 .elementor-element.elementor-element-8c9d67f .e--pointer-framed.e--animation-draw .elementor-item:after{border-width:0px 0px 0 0;}.elementor-99 .elementor-element.elementor-element-8c9d67f .e--pointer-framed.e--animation-corners .elementor-item:before{border-width:0px 0 0 0px;}.elementor-99 .elementor-element.elementor-element-8c9d67f .e--pointer-framed.e--animation-corners .elementor-item:after{border-width:0 0px 0px 0;}.elementor-99 .elementor-element.elementor-element-8c9d67f .e--pointer-underline .elementor-item:after, .elementor-99 .elementor-element.elementor-element-8c9d67f .e--pointer-overline .elementor-item:before, .elementor-99 .elementor-element.elementor-element-8c9d67f .e--pointer-double-line .elementor-item:before, .elementor-99 .elementor-element.elementor-element-8c9d67f .e--pointer-double-line .elementor-item:after{height:0px;}.elementor-99 .elementor-element.elementor-element-8c9d67f .elementor-nav-menu--dropdown a, .elementor-99 .elementor-element.elementor-element-8c9d67f .elementor-menu-toggle{color:var( --e-global-color-8363cf5 );fill:var( --e-global-color-8363cf5 );}.elementor-99 .elementor-element.elementor-element-8c9d67f .elementor-nav-menu--dropdown{background-color:var( --e-global-color-primary );}.elementor-99 .elementor-element.elementor-element-8c9d67f .elementor-nav-menu--dropdown a:hover, .elementor-99 .elementor-element.elementor-element-8c9d67f .elementor-nav-menu--dropdown a:focus, .elementor-99 .elementor-element.elementor-element-8c9d67f .elementor-nav-menu--dropdown a.elementor-item-active, .elementor-99 .elementor-element.elementor-element-8c9d67f .elementor-nav-menu--dropdown a.highlighted{background-color:var( --e-global-color-secondary );}.elementor-99 .elementor-element.elementor-element-8c9d67f .elementor-nav-menu--dropdown a.elementor-item-active{background-color:var( --e-global-color-secondary );}.elementor-99 .elementor-element.elementor-element-8c9d67f div.elementor-menu-toggle{color:var( --e-global-color-text );}.elementor-99 .elementor-element.elementor-element-8c9d67f div.elementor-menu-toggle svg{fill:var( --e-global-color-text );}.elementor-99 .elementor-element.elementor-element-c27add7{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--gap:4px 4px;--row-gap:4px;--column-gap:4px;border-style:solid;--border-style:solid;border-width:1px 1px 1px 1px;--border-top-width:1px;--border-right-width:1px;--border-bottom-width:1px;--border-left-width:1px;border-color:#E7E7E8;--border-color:#E7E7E8;--border-radius:112px 112px 112px 112px;--padding-top:4px;--padding-bottom:4px;--padding-left:4px;--padding-right:4px;}.elementor-99 .elementor-element.elementor-element-c27add7:not(.elementor-motion-effects-element-type-background), .elementor-99 .elementor-element.elementor-element-c27add7 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:var( --e-global-color-850781e );}.elementor-99 .elementor-element.elementor-element-c27add7.e-con{--flex-grow:0;--flex-shrink:1;}.elementor-99 .elementor-element.elementor-element-14e3bdf .elementor-button{background-color:#FFFFFF00;font-family:"Kind Sans", Sans-serif;font-size:16px;font-weight:400;line-height:1.5em;fill:var( --e-global-color-ab83b80 );color:var( --e-global-color-ab83b80 );padding:4px 10px 4px 10px;}.elementor-99 .elementor-element.elementor-element-14e3bdf .elementor-button:hover, .elementor-99 .elementor-element.elementor-element-14e3bdf .elementor-button:focus{background-color:var( --e-global-color-8363cf5 );color:var( --e-global-color-text );}.elementor-99 .elementor-element.elementor-element-14e3bdf .elementor-button:hover svg, .elementor-99 .elementor-element.elementor-element-14e3bdf .elementor-button:focus svg{fill:var( --e-global-color-text );}.elementor-99 .elementor-element.elementor-element-65653a7 .elementor-button{background-color:var( --e-global-color-8363cf5 );font-family:"Kind Sans", Sans-serif;font-size:16px;font-weight:400;line-height:1.5em;fill:var( --e-global-color-text );color:var( --e-global-color-text );padding:4px 10px 4px 10px;}.elementor-99 .elementor-element.elementor-element-65653a7 .elementor-button:hover, .elementor-99 .elementor-element.elementor-element-65653a7 .elementor-button:focus{background-color:var( --e-global-color-8363cf5 );color:var( --e-global-color-text );}.elementor-99 .elementor-element.elementor-element-65653a7 .elementor-button:hover svg, .elementor-99 .elementor-element.elementor-element-65653a7 .elementor-button:focus svg{fill:var( --e-global-color-text );}.elementor-99 .elementor-element.elementor-element-75f0084 .elementor-button{background-color:#FFFFFF00;font-family:"Kind Sans", Sans-serif;font-size:16px;font-weight:400;line-height:1.5em;fill:var( --e-global-color-ab83b80 );color:var( --e-global-color-ab83b80 );padding:4px 10px 4px 10px;}.elementor-99 .elementor-element.elementor-element-75f0084 .elementor-button:hover, .elementor-99 .elementor-element.elementor-element-75f0084 .elementor-button:focus{background-color:var( --e-global-color-8363cf5 );color:var( --e-global-color-text );}.elementor-99 .elementor-element.elementor-element-75f0084 .elementor-button:hover svg, .elementor-99 .elementor-element.elementor-element-75f0084 .elementor-button:focus svg{fill:var( --e-global-color-text );}.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-99 .elementor-element.elementor-element-82a7651{--width:auto;}.elementor-99 .elementor-element.elementor-element-c27add7{--width:auto;}}@media(max-width:1366px){.elementor-99 .elementor-element.elementor-element-fc4f2bf{--padding-top:10px;--padding-bottom:10px;--padding-left:20px;--padding-right:20px;}}@media(max-width:1200px){.elementor-99 .elementor-element.elementor-element-fc4f2bf{--justify-content:space-between;--align-items:center;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--z-index:999;}.elementor-99 .elementor-element.elementor-element-5f0084a{z-index:999;}.elementor-99 .elementor-element.elementor-element-8c9d67f{z-index:99;--nav-menu-icon-size:24px;}}@media(max-width:1024px){.elementor-99 .elementor-element.elementor-element-5f0084a.elementor-element{--flex-grow:0;}.elementor-99 .elementor-element.elementor-element-82a7651{--flex-direction:row-reverse;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap-reverse;--gap:24px 24px;--row-gap:24px;--column-gap:24px;}}@media(max-width:767px){.elementor-99 .elementor-element.elementor-element-fc4f2bf{--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;}.elementor-99 .elementor-element.elementor-element-5f0084a img{width:200px;}.elementor-99 .elementor-element.elementor-element-82a7651{--width:auto;--justify-content:space-between;--gap:10px 10px;--row-gap:10px;--column-gap:10px;}.elementor-99 .elementor-element.elementor-element-8c9d67f .elementor-nav-menu--dropdown a{padding-left:0px;padding-right:0px;padding-top:0px;padding-bottom:0px;}.elementor-99 .elementor-element.elementor-element-c27add7{--width:auto;--border-radius:16px 16px 16px 16px;}}/* Start custom CSS for nav-menu, class: .elementor-element-8c9d67f */@media only screen and (min-width:1200px) { .elementor-99 .elementor-element.elementor-element-8c9d67f li:hover { transform:scale(1.05); } .elementor-99 .elementor-element.elementor-element-8c9d67f li { transition:all 0.1s; } } .elementor-nav-menu--dropdown { left: calc(56px - 100vw)!important; } .elementor-nav-menu--dropdown ul { padding: 10px 20px; } .elementor-nav-menu--dropdown ul li { padding: 10px 0; }/* End custom CSS */ /* Start custom CSS for button, class: .elementor-element-65653a7 */.elementor-99 .elementor-element.elementor-element-65653a7 { pointer-events: none; }/* End custom CSS */ /* --------------------------------------------------------------------------- Woran man sieht, auf welcher Seite man ist. Gemessen auf der ausgelieferten Seite, /en/product/ bzw. /produkt/: Schreibtisch, 1440px aktiver Eintrag Farbe rgb(67,68,83) Gewicht 400 Hintergrund keiner andere Eintraege Farbe rgb(67,68,83) Gewicht 400 Hintergrund keiner Unterstrich height:0px, auch beim aktiven Eintrag -> kein Unterschied. Man sah nicht, wo man ist. Telefon, 390px, Klappmenue offen Klappflaeche rgb(1,76,177) aktiver Eintrag rgb(3,120,184), 350px breit, 24px hoch, Polster 0, Radius 0 -> ein flacher Balken von Rand zu Rand, genau so hoch wie die Zeile. Das sah aus wie eine Textmarkierung, nicht wie Gestaltung. Der Unterstrich stand auf height:0px, weil er in den Elementor-Einstellungen abgeschaltet wurde - siehe die Regel .e--pointer-underline .elementor-item:after weiter oben in dieser Datei. Sie bleibt stehen; nur der aktive Eintrag bekommt seinen Strich zurueck, und zwar den blauen Verlauf, den die Ueberschriften der Seite ohnehin verwenden (.gradient-underline, 049BEE nach 014CB1). Auf dem Telefon wird aus dem Balken eine gerundete Flaeche mit Polster. Nebenbei loest das ein zweites Problem: das Ziel zum Antippen war 24px hoch, empfohlen sind mindestens 44. Mit 11px Polster oben und unten sind es 46px. --------------------------------------------------------------------------- */ /* Schreibtisch: blaue Schrift und der Verlaufsstrich der Ueberschriften. */ .elementor-99 .elementor-element.elementor-element-8c9d67f .elementor-nav-menu--main .elementor-item.elementor-item-active{color:#014CB1;font-weight:500;} .elementor-99 .elementor-element.elementor-element-8c9d67f .e--pointer-underline .elementor-item.elementor-item-active:after{height:2px;border-radius:2px;background:linear-gradient(90deg, #049BEE 30%, #014CB1 100%);} /* Telefon: gerundete Flaeche statt Balken, dazu ein groesseres Antippziel. */ .elementor-99 .elementor-element.elementor-element-8c9d67f .elementor-nav-menu--dropdown ul.elementor-nav-menu{padding-left:10px;padding-right:10px;} .elementor-99 .elementor-element.elementor-element-8c9d67f .elementor-nav-menu--dropdown li{padding-top:3px;padding-bottom:3px;} .elementor-99 .elementor-element.elementor-element-8c9d67f .elementor-nav-menu--dropdown a.elementor-item{padding:11px 16px;border-radius:12px;transition:background-color .2s ease;} .elementor-99 .elementor-element.elementor-element-8c9d67f .elementor-nav-menu--dropdown a.elementor-item.elementor-item-active{background-color:#0378B8;font-weight:600;} .elementor-99 .elementor-element.elementor-element-8c9d67f .elementor-nav-menu--dropdown a.elementor-item:not(.elementor-item-active):hover, .elementor-99 .elementor-element.elementor-element-8c9d67f .elementor-nav-menu--dropdown a.elementor-item:not(.elementor-item-active):focus{background-color:rgba(255,255,255,0.12);} /* --------------------------------------------------------------------------- Die CTA-Knoepfe stachen durch das offene Klappmenue. Gemessen auf der ausgelieferten Seite, 390px, Menue offen, der Knopf genau im Bereich der Klappflaeche: /en/use-cases/ Knopf y=300 (z-index 999), Klappflaeche 69..349 elementFromPoint in der Mitte des Knopfes -> SPAN "Free Initial Consultation", nicht im Menue / dasselbe mit "Kostenloses Erstgespraech" /en/ dasselbe Die Kette der z-Werte erklaert es: Klappflaeche z-index 9997 Menue-Baustein 8c9d67f z-index 99 Behaelter darum z-index 999 Kopfzeile fc4f2bf position fixed, z-index 999 <- Kontext Die feste Kopfzeile eroeffnet einen Stapelkontext. Alles darin, auch die 9997 der Klappflaeche, bleibt darin eingesperrt - nach aussen zaehlt nur die 999 der Kopfzeile. Die Knoepfe der Seite tragen ebenfalls 999, stehen aber spaeter im Dokument. Bei gleichem Wert gewinnt der spaetere. Also lagen sie oben. Eine feste Kopfzeile gehoert ueber den Seiteninhalt, offen oder nicht - darum bekommt sie 9998. Unter der Einwilligungsabfrage von Borlabs (999998) bleibt sie damit weiterhin. --------------------------------------------------------------------------- */ .elementor-99 .elementor-element.elementor-element-fc4f2bf{--z-index:9998;}