/* Entferne die Standard-Striche */
#et_mobile_nav_menu .mobile_menu_bar:before,
#et_mobile_nav_menu .mobile_menu_bar:after {
    content: none !important;
}

/* Setze das neue Icon als Bild ein */
#et_mobile_nav_menu .mobile_menu_bar {
    background-image: url('https://gagcat.org/wp-content/uploads/2024/12/Hamburger.png');
    background-repeat: no-repeat;
    background-position: center;
    background-size: 32px 32px; /* Passe die Größe des Icons an */
    width: 48px; /* Breite des Icons */
    height: 48px; /* Höhe des Icons */
    display: inline-block;
    background-color: transparent !important;
    border: none !important;
    line-height: normal;
    position: relative;
    top: -10px; /* Leicht anheben, um die Position zu verbessern */
    transform: none;
    margin-top: auto;
    margin-bottom: auto;
    color: #636363 !important; /* Textfarbe für mobile Menü-Icon, erzwungen */
}

/* Hover-Effekt für das Icon */
#et_mobile_nav_menu .mobile_menu_bar:hover {
    background-image: url('https://gagcat.org/wp-content/uploads/2024/12/Hamburger.png');
    filter: brightness(1.5); /* Erhöhe die Helligkeit für den Hover-Effekt */
}

/* Haupt-Header-Stile */
#main-header {
    background-color: #161616 !important; /* Hintergrundfarbe Balken im Desktop-Menü */
    box-shadow: none !important;
}

.et-fixed-header #main-header {
    background-color: #161616 !important; /* Hintergrundfarbe Balken im Desktop-Menü beim Scrollen */
}

/* Navigationselemente */
#main-header .nav li a {
    color: #636363 !important; /* Textfarbe im Desktop-Menü, erzwungen */
}

#main-header .nav li a:hover {
    color: #00ff00 !important; /* Grün bei Hover im Desktop-Menü */
}

/* Mobile Menü-Stile */
.et_mobile_menu {
    background-color: #161616 !important; /* Hintergrundfarbe Balken im mobilen Menü */
}

/* Schriftfarbe im mobilen Untermenü */
.et_mobile_menu li a {
    color: #636363 !important; /* Textfarbe im mobilen Menü, erzwungen */
    background-color: #161616 !important; /* Hintergrundfarbe für mobile Menü-Links, erzwungen */
}

/* Hover-Effekt im mobilen Untermenü */
.et_mobile_menu li a:hover {
    color: #00ff00 !important; /* Grün bei Hover */
}

/* Ränder im mobilen Untermenü entfernen */
.et_mobile_menu li {
    border: none !important;
}

/* Anpassung für das Untermenü (Dropdown) im mobilen Modus */
.et_mobile_menu ul.sub-menu {
    background-color: #161616 !important; /* Hintergrundfarbe Balken im Untermenü */
}

.et_mobile_menu ul.sub-menu li a {
    color: #636363 !important; /* Textfarbe im mobilen Untermenü */
    padding-bottom: 8px; /* Abstand hinzufügen */
}

.et_mobile_menu ul.sub-menu li a:hover {
    color: #00ff00 !important; /* Grün bei Hover im Untermenü */
}

/* Hover-Effekt für die Hauptnavigationspunkte */
#main-header .nav li:hover > a {
    color: #00ff00 !important; /* Grün bei Hover */
}

/* *** Zusätzliche CSS-Regeln für Desktop-Untermenüs *** */

/* Hintergrundfarbe für Desktop-Untermenüs */
#main-header .nav ul.sub-menu {
    background-color: #161616 !important; /* Dunkler Hintergrund */
}

/* Textfarbe für Desktop-Untermenü-Links */
#main-header .nav ul.sub-menu li a {
    color: #636363 !important; /* Dunkelgraue Textfarbe */
    background-color: #161616 !important; /* Dunkler Hintergrund */
}

/* Hover-Effekt für Desktop-Untermenü-Links */
#main-header .nav ul.sub-menu li a:hover {
    color: #00ff00 !important; /* Grün bei Hover */
}

/* Hintergrundfarbe für alle Dropdowns, falls andere verwendet werden */
#main-header .nav li ul.sub-menu,
#main-header .nav li .sub-menu {
    background-color: #161616 !important; /* Sicherstellen, dass alle Submenus dunkel sind */
}

/* Textfarbe für alle Dropdown-Links */
#main-header .nav li ul.sub-menu li a,
#main-header .nav li .sub-menu li a {
    color: #636363 !important; /* Dunkelgraue Textfarbe */
    background-color: #161616 !important; /* Dunkler Hintergrund */
}

/* Hover-Effekt für alle Dropdown-Links */
#main-header .nav li ul.sub-menu li a:hover,
#main-header .nav li .sub-menu li a:hover {
    color: #00ff00 !important; /* Grün bei Hover */
}