/* Grundstil für das horizontale Menü */
.hauptmenu {
    text-align: right; /* Rechtsbündig */
    margin-top: 26px;
}

.hauptmenu ul {
    list-style: none;
    margin: 0;
    padding: 0;
    display: inline-flex;
    background: none; /* Kein Hintergrund */
}

.hauptmenu ul li {
    position: relative;
    border-right: 1px solid #cccccc;
}

.hauptmenu ul li:last-child {
    border-right: none;
}

.hauptmenu ul li a {
    display: block;
    padding: 10px 20px;
    text-decoration: none;
    color: #333333; /* Dunkelgraue Schrift */
    text-transform: none; /* Keine Großbuchstaben */
    font-weight: normal;
    font-size: 1.4rem;
}

.hauptmenu ul li a:hover {
    background-color: #e0e0e0; /* Leichtes Grau bei Hover */
}

/* Dropdown-Stil */
.hauptmenu ul li ul {
    display: none;
    position: absolute;
    top: 100%;
    left: 50%; /* Startpunkt: zentriert am übergeordneten Menüpunkt */
    transform: translateX(-50%); /* Korrektur, um mittig zu bleiben */
    min-width: 200px;
    width: max-content;
    padding: 0;
    background-color: #f0f0f0; /* Hellgrauer Hintergrund */
    border: 1px solid #ccc;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
    z-index: 1000;
    text-align: center; /* Inhalte zentriert */
}

.hauptmenu ul li:hover > ul {
    display: block;
}

.hauptmenu ul li ul li {
    border-bottom: 1px solid #cccccc;
    padding: 0;
}

.hauptmenu ul li ul li:last-child {
    border-bottom: none; 
}

.hauptmenu ul li ul li a {
    color: #333333; /* Dunkelgraue Schrift auch im Dropdown */
    text-transform: none;
    font-size: 1rem;
    padding: 10px 15px;
    display: block;
}

.hauptmenu ul li ul li a:hover {
    background-color: #d8d8d8; /* Etwas dunkleres Grau beim Hover */
}

/* Pfeil bei vorhandenem Untermenü */
.hauptmenu ul li ul li.has-submenu > a::before,
.hauptmenu ul li ul li.has-subsubmenu > a::before {
    content: '>'; 
    display: inline-block;
    margin-right: 10px;
    font-size: 1em;
}

/* Verschachtelte Dropdowns (2. Ebene) */
.hauptmenu ul li ul li {
    position: relative;
}

.hauptmenu ul li ul li ul {
    top: 0;
    left: 100%;
    transform: none; /* Kein zentrieren bei 2. Ebene */
    text-align: left; /* Standard bei Sub-Sub-Menüs */
}




#topmenu {
  text-align: right; /* rechtsbündig */
}

#topmenu .top-menu {
  list-style: none;
  margin: 0;
  padding: 0;
  display: inline-flex;
  gap: 0; /* kein Abstand – Trennstriche übernehmen die Trennung */
}

#topmenu .top-menu li {
  font-size: 1rem; /* Schriftgröße */
  color: white; /* Schriftfarbe */
  border-left: 1px solid white; /* Trennstrich */
  padding: 0 1rem;
}

#topmenu .top-menu li:first-child {
  border-left: none; /* Kein Strich beim ersten Menüpunkt */
}

#topmenu .top-menu li a {
  color: white;
  text-decoration: none;
  display: block;
  padding: 0.5rem 10px;
}

#topmenu .top-menu li a:hover {
  background-color: #444; /* Dunkelgrauer Hintergrund beim Hover */
}


.extramenu {
  text-align: right; /* rechtsbündig */
}

.extramenu .extra-menu {
  list-style: none;
  margin: 0;
  padding: 0;
  display: inline-flex;
  gap: 0; /* kein Abstand – Trennstriche übernehmen die Trennung */
}

.extramenu .extra-menu li {
  font-size: 1rem; /* Schriftgröße */
  color: white; /* Schriftfarbe */
  border-left: 1px solid white; /* Trennstrich */
  padding: 0 1rem;
}

.extramenu .extra-menu li:first-child {
  border-left: none; /* Kein Strich beim ersten Menüpunkt */
}

.extramenu .extra-menu li a {
  color: white;
  text-decoration: none;
  display: block;
  padding: 0.5rem 10px;
}

.extramenu .extra-menu li a:hover {
  background-color: #444; /* Dunkelgrauer Hintergrund beim Hover */
}


/* Mobiles Menü - inspiriert von mmenu.js */


#hamburger {

    opacity: .95;
    display: block;
    width: auto;
    height: 45px;
    position: absolute;
    top: -4px;
    left: 0;
    z-index: 15;
}


.mburger:hover {color:#454545 !important;}
.mburger {
 --mb-button-size:60px;
 --mb-bar-width:0.6;
 --mb-bar-height:4px;
 --mb-bar-spacing:10px;
 --mb-cross-timeout:0.4s;
 background:0 0;
 border:none;
 border-radius:0;
 color:inherit;
 display:inline-block;
 position:relative;
 box-sizing:border-box;
 height:var(--mb-button-size);
 padding:0 0 0 var(--mb-button-size);
 margin:0;
 line-height:var(--mb-button-size);
 vertical-align:middle;
 appearance:none;
 outline:0;
 cursor:pointer;
	}
.mburger b {
 display:block;
 position:absolute;
 left:calc(var(--mb-button-size) * ((1 - var(--mb-bar-width))/ 2));
 width:calc(var(--mb-button-size) * var(--mb-bar-width));
 height:var(--mb-bar-height);
 border-radius:calc(var(--mb-bar-height)/ 2);
 background:currentColor;
 color:inherit;
 opacity:1
}
.mburger b:nth-of-type(1) {
 bottom:calc(50% + var(--mb-bar-spacing));
 transition:bottom .2s ease,transform .2s ease
}
.mburger b:nth-of-type(2) {
 top:calc(50% - (var(--mb-bar-height)/ 2));
 transition:opacity .2s ease
}
.mburger b:nth-of-type(3) {
 top:calc(50% + var(--mb-bar-spacing));
 transition:top .2s ease,transform .2s ease
}
.mburger span:not(:empty) {
 padding-right:calc(var(--mb-button-size) * ((1 - var(--mb-bar-width))/ 2))
}
.mm-wrapper_opened .mburger b:nth-of-type(1) {
 bottom:calc(50% - (var(--mb-bar-height)/ 2));
 transform:rotate(45deg)
}
.mm-wrapper_opened .mburger b:nth-of-type(2) {
 opacity:0
}
.mm-wrapper_opened .mburger b:nth-of-type(3) {
 top:calc(50% - (var(--mb-bar-height)/ 2));
 transform:rotate(-45deg)
}
.mburger--collapse b:nth-of-type(1) {
 transition:bottom .2s ease,margin .2s ease,transform .2s ease;
 transition-delay:.2s,0s,0s
}
.mburger--collapse b:nth-of-type(2) {
 transition:top .2s ease,opacity 0s ease;
 transition-delay:.3s,.3s
}
.mburger--collapse b:nth-of-type(3) {
 transition:top .2s ease,transform .2s ease
}
.mm-wrapper_opened .mburger--collapse b:nth-of-type(1) {
 bottom:calc(50% - var(--mb-bar-spacing) - var(--mb-bar-height));
 margin-bottom:calc(var(--mb-bar-spacing) + (var(--mb-bar-height)/ 2));
 transform:rotate(45deg);
 transition-delay:calc(var(--mb-cross-timeout) + .1s),calc(var(--mb-cross-timeout) + .3s),calc(var(--mb-cross-timeout) + .3s)
}
.mm-wrapper_opened .mburger--collapse b:nth-of-type(2) {
 top:calc(50% + var(--mb-bar-spacing));
 opacity:0;
 transition-delay:calc(var(--mb-cross-timeout) + 0s),calc(var(--mb-cross-timeout) + .2s)
}
.mm-wrapper_opened .mburger--collapse b:nth-of-type(3) {
 top:calc(50% - (var(--mb-bar-height)/ 2));
 transform:rotate(-45deg);
 transition-delay:calc(var(--mb-cross-timeout) + .3s),calc(var(--mb-cross-timeout) + .3s)
}
.mburger--spin b:nth-of-type(1) {
 transition-delay:.2s,0s
}
.mburger--spin b:nth-of-type(2) {
 transition-duration:0s;
 transition-delay:.2s
}
.mburger--spin b:nth-of-type(3) {
 transition-delay:.2s,0s
}
.mm-wrapper_opened .mburger--spin b:nth-of-type(1) {
 transform:rotate(135deg);
 transition-delay:calc(var(--mb-cross-timeout) + 0s),calc(var(--mb-cross-timeout) + .2s)
}
.mm-wrapper_opened .mburger--spin b:nth-of-type(2) {
 transition-delay:calc(var(--mb-cross-timeout) + 0s)
}
.mm-wrapper_opened .mburger--spin b:nth-of-type(3) {
 transform:rotate(225deg);
 transition-delay:calc(var(--mb-cross-timeout) + 0s),calc(var(--mb-cross-timeout) + .2s)
}
.mburger--squeeze b:nth-of-type(1) {
 transition-delay:.1s,0s
}
.mburger--squeeze b:nth-of-type(2) {
 transition-delay:.1s
}
.mburger--squeeze b:nth-of-type(3) {
 transition-delay:.1s,0s
}
.mm-wrapper_opened .mburger--squeeze b:nth-of-type(1) {
 transition-delay:calc(var(--mb-cross-timeout) + 0s),calc(var(--mb-cross-timeout) + .1s)
}
.mm-wrapper_opened .mburger--squeeze b:nth-of-type(2) {
 transition-delay:calc(var(--mb-cross-timeout) + 0s)
}
.mm-wrapper_opened .mburger--squeeze b:nth-of-type(3) {
 transition-delay:calc(var(--mb-cross-timeout) + 0s),calc(var(--mb-cross-timeout) + .1s)
}
.mburger--tornado b:nth-of-type(1) {
 transition:bottom .2s ease,transform .2s ease;
 transition-delay:.2s
}
.mburger--tornado b:nth-of-type(2) {
 transition:opacity 0s ease,transform .2s ease;
 transition-delay:.1s,.1s
}
.mburger--tornado b:nth-of-type(3) {
 transition:top .2s ease,transform .2s ease;
 transition-delay:0s
}
.mm-wrapper_opened .mburger--tornado b:nth-of-type(1) {
 transform:rotate(-135deg);
 transition-delay:calc(var(--mb-cross-timeout) + 0s)
}
.mm-wrapper_opened .mburger--tornado b:nth-of-type(2) {
 opacity:0;
 transform:rotate(-135deg);
 transition-delay:calc(var(--mb-cross-timeout) + .4s),calc(var(--mb-cross-timeout) + .1s)
}
.mm-wrapper_opened .mburger--tornado b:nth-of-type(3) {
 transform:rotate(-225deg);
 transition-delay:calc(var(--mb-cross-timeout) + .2s)
}