.KC-navigation {
    font-family: Arial, sans-serif;
}

/* Hauptmenü */
.main-menu {
    display: flex;
    list-style: none;
    margin: 0;
    padding: 0;
    background-color: #990024; /* Rot */
}

.main-menu > li {
    position: relative;
    margin: 0;
	display: inline-block; /* Untermenüs korrekt positionieren */
}

/* Alle Links im Menü */
.KC-navigation a {
    display: block;
    padding: 10px 20px;
    text-decoration: none;
}

/* Hauptmenü-Link normal */
.main-menu > li > a {
    color: white;
    background-color: #990024; /* Rot */
	display: block; /* Untermenüs korrekt positionieren */
    padding: 10px 15px; /* Untermenüs korrekt positionieren */
    text-decoration: none; /* Untermenüs korrekt positionieren */
}

/* Hauptmenü-Link aktiv */
.main-menu > li.active > a {
    background-color: white;
    color: #990024;
}

/* Hover-Effekt Hauptmenü */
.main-menu > li > a:hover {
    background-color: #c41a3a; /* etwas heller rot beim Hover */
    color: white;
}

/* Dropdown-Menü (Untermenü) */
.dropdown {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    background-color: white;
    list-style: none;
    min-width: 200px;
    z-index: 1000;
    padding: 0;
    margin: 0;
    border: 1px solid #ccc;
}

/* Untermenüs korrekt positionieren - Anfang */

/* Erstes Dropdown unter dem Hauptmenüpunkt */
.main-menu > li > .dropdown {
    display: none;
    position: absolute;
    top: 100%; /* unter dem Eltern-Menüpunkt */
    left: 0;
    background: #fff;
    min-width: 200px;
    z-index: 1000;
}

/* Zeige Dropdown beim Hover */
.main-menu > li:hover > .dropdown {
    display: block;
}
/* Untermenüs korrekt positionieren - Ende */


.dropdown li {
    border-top: 1px solid #ccc;
	position: relative;  /* Zweites Dropdown (nach rechts ausklappend) */
}

/* Untermenüs korrekt positionieren - Anfang */
.dropdown li > .dropdown {
    display: none;
    position: absolute;
    top: 0;
    left: 100%; /* rechts neben dem Elternmenüpunkt */
    background: #fff;
    min-width: 200px;
    z-index: 1000;
}
/* Untermenüs korrekt positionieren - Ende */

/* Untermenü-Link normal */
.dropdown a {
    color: black;
    background-color: white;
/* Untermenüs korrekt positionieren - Anfang */	
	white-space: nowrap;
    padding: 10px 15px;
/* Untermenüs korrekt positionieren - Ende */	
	
}

/* Untermenü-Link aktiv */
.dropdown li.active > a {
    background-color: #990024;
    color: white;
}

/* Hover-Effekt Untermenü */
.dropdown a:hover {
    background-color: #e5e5e5;
    color: black;
}

/* Anzeigen der Dropdowns beim Hover */
li:hover > .dropdown {
    display: block;
}

/* Untermenüs korrekt positionieren - Anfang */	
.main-menu .active > a {
    background-color: #eee;
    font-weight: bold;
}
/* Untermenüs korrekt positionieren - Ende */