.elementor-136 .elementor-element.elementor-element-4e07b47{--display:flex;--min-height:100px;--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-around;--align-items:center;--gap:10px 10px;--row-gap:10px;--column-gap:10px;}.elementor-136 .elementor-element.elementor-element-4e07b47:not(.elementor-motion-effects-element-type-background), .elementor-136 .elementor-element.elementor-element-4e07b47 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:var( --e-global-color-972419d );}.elementor-136 .elementor-element.elementor-element-f40472c{--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;--justify-content:space-between;}.elementor-136 .elementor-element.elementor-element-b431ab8 img{width:202px;}.elementor-136 .elementor-element.elementor-element-c3d62c2 .elementor-menu-toggle{margin:0 auto;background-color:#99916200;}.elementor-136 .elementor-element.elementor-element-c3d62c2 .elementor-nav-menu .elementor-item{font-size:var( --e-global-typography-secondary-font-size );font-weight:var( --e-global-typography-secondary-font-weight );text-transform:var( --e-global-typography-secondary-text-transform );letter-spacing:var( --e-global-typography-secondary-letter-spacing );}.elementor-136 .elementor-element.elementor-element-c3d62c2 .elementor-nav-menu--main .elementor-item{color:var( --e-global-color-secondary );fill:var( --e-global-color-secondary );}.elementor-136 .elementor-element.elementor-element-c3d62c2 .elementor-nav-menu--main .elementor-item:hover,
					.elementor-136 .elementor-element.elementor-element-c3d62c2 .elementor-nav-menu--main .elementor-item.elementor-item-active,
					.elementor-136 .elementor-element.elementor-element-c3d62c2 .elementor-nav-menu--main .elementor-item.highlighted,
					.elementor-136 .elementor-element.elementor-element-c3d62c2 .elementor-nav-menu--main .elementor-item:focus{color:var( --e-global-color-861847b );fill:var( --e-global-color-861847b );}.elementor-136 .elementor-element.elementor-element-c3d62c2 .elementor-nav-menu--main:not(.e--pointer-framed) .elementor-item:before,
					.elementor-136 .elementor-element.elementor-element-c3d62c2 .elementor-nav-menu--main:not(.e--pointer-framed) .elementor-item:after{background-color:var( --e-global-color-861847b );}.elementor-136 .elementor-element.elementor-element-c3d62c2 .e--pointer-framed .elementor-item:before,
					.elementor-136 .elementor-element.elementor-element-c3d62c2 .e--pointer-framed .elementor-item:after{border-color:var( --e-global-color-861847b );}.elementor-136 .elementor-element.elementor-element-c3d62c2 .elementor-nav-menu--dropdown li:not(:last-child){border-style:solid;border-color:#99916259;border-bottom-width:1px;}.elementor-136 .elementor-element.elementor-element-c3d62c2 div.elementor-menu-toggle{color:var( --e-global-color-secondary );}.elementor-136 .elementor-element.elementor-element-c3d62c2 div.elementor-menu-toggle svg{fill:var( --e-global-color-secondary );}.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-136 .elementor-element.elementor-element-4e07b47{--width:100%;}.elementor-136 .elementor-element.elementor-element-f40472c{--width:1140px;}}@media(max-width:1024px){.elementor-136 .elementor-element.elementor-element-4e07b47{--justify-content:space-between;}.elementor-136 .elementor-element.elementor-element-f40472c{--justify-content:space-between;}.elementor-136 .elementor-element.elementor-element-c3d62c2 .elementor-nav-menu .elementor-item{font-size:var( --e-global-typography-secondary-font-size );letter-spacing:var( --e-global-typography-secondary-letter-spacing );}}@media(max-width:767px){.elementor-136 .elementor-element.elementor-element-4e07b47{--align-items:center;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--margin-top:-100px;--margin-bottom:-100px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-136 .elementor-element.elementor-element-b431ab8 img{width:202px;}.elementor-136 .elementor-element.elementor-element-c3d62c2{width:var( --container-widget-width, 79px );max-width:79px;--container-widget-width:79px;--container-widget-flex-grow:0;}.elementor-136 .elementor-element.elementor-element-c3d62c2.elementor-element{--align-self:center;}.elementor-136 .elementor-element.elementor-element-c3d62c2 .elementor-nav-menu .elementor-item{font-size:var( --e-global-typography-secondary-font-size );letter-spacing:var( --e-global-typography-secondary-letter-spacing );}.elementor-136 .elementor-element.elementor-element-c3d62c2 .elementor-nav-menu--dropdown a{padding-left:21px;padding-right:21px;padding-top:15px;padding-bottom:15px;}.elementor-136 .elementor-element.elementor-element-c3d62c2 .elementor-nav-menu--main > .elementor-nav-menu > li > .elementor-nav-menu--dropdown, .elementor-136 .elementor-element.elementor-element-c3d62c2 .elementor-nav-menu__container.elementor-nav-menu--dropdown{margin-top:24px !important;}}/* Start custom CSS for nav-menu, class: .elementor-element-c3d62c2 *//* Basisstile für das Hamburger-Menü (wenn 3 Striche) */
.elementor-menu-toggle {
    display: flex; /* Stellt sicher, dass die Linien flexibel angeordnet werden können */
    flex-direction: column; /* Stapelt die Linien vertikal */
    justify-content: space-between; /* Verteilt die Linien gleichmässig */
    width: 30px; /* Breite des Hamburger-Symbols */
    height: 20px; /* Höhe des Hamburger-Symbols */
    cursor: pointer;
    position: relative; /* Wichtig für die Positionierung der Linien */
    z-index: 100; /* Stellt sicher, dass es über anderen Elementen liegt */
}

.elementor-menu-toggle span {
    display: block;
    width: 100%;
    height: 3px; /* Dicke der einzelnen Linien */
    background-color: #333; /* Farbe der Linien (anpassen!) */
    border-radius: 3px;
    transition: all 0.3s ease-in-out; /* Sanfte Übergänge für alle Transformationen */
    position: absolute; /* Ermöglicht präzise Positionierung */
    left: 0;
}

/* Positionierung der einzelnen Linien im Standardzustand */
.elementor-menu-toggle span:nth-child(1) {
    top: 0; /* Obere Linie */
}

.elementor-menu-toggle span:nth-child(2) {
    top: 50%; /* Mittlere Linie */
    transform: translateY(-50%); /* Zentriert die mittlere Linie vertikal */
}

.elementor-menu-toggle span:nth-child(3) {
    bottom: 0; /* Untere Linie */
}

/* --- Animation beim Öffnen des Menüs (wenn .elementor-active Klasse vorhanden ist) --- */

/* Annahme: Elementor fügt `.elementor-active` zum `body` hinzu, wenn das Menü geöffnet ist. */
body.elementor-active .elementor-menu-toggle span:nth-child(1) {
    transform: translateY(8.5px) rotate(45deg); /* Bewegt obere Linie nach unten und dreht sie */
    top: 50%; /* Positioniert sie in der Mitte */
    background-color: #333; /* Kann auch hier die Farbe ändern für den aktiven Zustand */
}

body.elementor-active .elementor-menu-toggle span:nth-child(2) {
    opacity: 0; /* Lässt die mittlere Linie verschwinden */
}

body.elementor-active .elementor-menu-toggle span:nth-child(3) {
    transform: translateY(-8.5px) rotate(-45deg); /* Bewegt untere Linie nach oben und dreht sie */
    bottom: 50%; /* Positioniert sie in der Mitte */
    background-color: #333; /* Kann auch hier die Farbe ändern für den aktiven Zustand */
}

/* Alternative, falls Elementor die Klasse `.elementor-active` direkt zum Toggle hinzufügt: */
/*
.elementor-menu-toggle.elementor-active span:nth-child(1) {
    transform: translateY(8.5px) rotate(45deg);
    top: 50%;
}

.elementor-menu-toggle.elementor-active span:nth-child(2) {
    opacity: 0;
}

.elementor-menu-toggle.elementor-active span:nth-child(3) {
    transform: translateY(-8.5px) rotate(-45deg);
    bottom: 50%;
}
*/

.elementor-136 .elementor-element.elementor-element-c3d62c2 {
    --gap: 0.3em;
    --weight: 0.15em;
    --width: 1em;
}
.elementor-136 .elementor-element.elementor-element-c3d62c2 .elementor-menu-toggle{
    position: relative;
}
.elementor-136 .elementor-element.elementor-element-c3d62c2 .elementor-menu-toggle:before,
.elementor-136 .elementor-element.elementor-element-c3d62c2 .elementor-menu-toggle:after,
.elementor-136 .elementor-element.elementor-element-c3d62c2 .elementor-menu-toggle i:after{
    content: "";
    height: var(--weight);
    width: var(--width);
    position: absolute;
    background: currentColor;
    top: 50%;
    left: 50%;
    transform: translate(-50%,calc(-50% + var(--gap)));
    transition: all 0.3s ease-in-out;
}
.elementor-136 .elementor-element.elementor-element-c3d62c2 .elementor-menu-toggle.elementor-active:before{
    transform: translate(-50%,-50%) rotate(-45deg);
}
.elementor-136 .elementor-element.elementor-element-c3d62c2 .elementor-menu-toggle:after{
    transform: translate(-50%,calc(-50% - var(--gap)));
}
.elementor-136 .elementor-element.elementor-element-c3d62c2 .elementor-menu-toggle.elementor-active:after{
    transform: translate(-50%,-50%) rotate(45deg);
}
.elementor-136 .elementor-element.elementor-element-c3d62c2 .elementor-menu-toggle i:after{
    transform: translate(-50%,-50%);
}
.elementor-136 .elementor-element.elementor-element-c3d62c2 .elementor-menu-toggle i:before,
.elementor-136 .elementor-element.elementor-element-c3d62c2 .elementor-menu-toggle.elementor-active i:after{
    opacity: 0;
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-4e07b47 *//* Standardzustand des Headers */
#headercontainer {
    background-color: transparent;
    transition: background-color 0.3s ease-in-out;
    backdrop-filter: none; /* Stellt sicher, dass kein Blur im Ausgangszustand ist */
    -webkit-backdrop-filter: none; /* Für Webkit-Browser */
}

/* Standardzustand des Logos */
#logoheader {
    width: 205px;
    height: auto; /* Behält das Seitenverhältnis bei */
    transition: width 0.3s ease-in-out;
}

/* Zustand des Headers beim Scrollen */
#headercontainer.scrolled {
    background-color: rgba(153, 145, 98, 0.6); /* Beispiel: leicht weisser, transparenter Hintergrund */
    backdrop-filter: blur(10px); /* Blur-Effekt */
    -webkit-backdrop-filter: blur(10px); /* Für Webkit-Browser */
}

/* Zustand des Logos beim Scrollen */
#logoheader.scrolled {
    width: 150px;
}/* End custom CSS */