/* Global Styles */
body {
    margin: 0;
    font-family: Arial, Helvetica, sans-serif;
    background-color: #f4f4f4;
}



/* Seiteninhalt */
.container {
    margin: 20px auto; /* Abstand oben/unten */
    padding: 20px;
    max-width: 1600px;
    background-color: #ffffff; /* Weißer Hintergrund */
    border-radius: 5px; /* Abgerundete Ecken */
    box-shadow: 0px 2px 10px rgba(0, 0, 0, 0.1); /* Leichter Schatten */
}


/* Tabellenstil */
table {
    width: 100%;
    border-collapse: collapse;
    margin-top: 20px;
}

table thead {
    background-color: #333; /* Dunkelgrauer Kopf */
    color: #fff; /* Weiße Schrift im Kopf */
}

table th,
table td {
    padding: 10px;
    text-align: left;
    border: 1px solid #ddd; /* Hellgraue Ränder */
}

table tbody tr:nth-child(even) {
    background-color: #f9f9f9; /* Hellgrauer Hintergrund für jede 2. Zeile */
}

table tbody tr:hover {
    background-color: #f1f1f1; /* Leicht dunkleres Grau beim Hover */
}

button {
    background-color: #333;
    color: #fff;
    border: none;
    padding: 10px 20px;
    border-radius: 3px;
    cursor: pointer;
    font-size: 16px;
    transition: background-color 0.3s;
}

.button.neues.event {
    background-color: #ffd000;
    color: #333;
    border: none;
    padding: 10px 20px;
    border-radius: 3px;
    cursor: pointer;
    font-size: 16px;
    transition: background-color 0.3s;
}


.button.neues.event:hover {
    background-color: #c4a725;
}



button:hover {
    background-color: #575757; /* Mittelgrau beim Hover */
}







/* F A Q */

.faq-section {
    margin-top: 20px;
}

.faq-item {
    margin-bottom: 15px;
    padding: 10px;
    border: 1px solid #ddd;
    border-radius: 5px;
    background-color: #f9f9f9;
}

.faq-question {
    font-weight: bold;
    cursor: pointer;
    margin-bottom: 5px;
}

.faq-answer {
    display: none;
    margin-top: 5px;
    padding: 10px;
    background-color: #fff;
    border-top: 1px solid #ddd;
}

.faq-frage {
    font-weight: bold;
    cursor: pointer;
    margin-bottom: 5px;
}

.faq-antwort {
    display: none;
    margin-top: 5px;
    padding: 10px;
    background-color: #fff;
    border-top: 1px solid #ddd;
}








.button {
    display: inline-block;
    background-color: #333;
    color: white;
    padding: 10px 20px;
    text-decoration: none;
    border-radius: 3px;
    transition: background-color 0.3s;
}

.button:hover {
    background-color: #575757;
}






@media (max-width: 768px) {
    .topnav a {
        padding: 10px 12px; /* Kleineren Abstand hinzufügen */
        font-size: 14px; /* Schriftgröße für mobile Geräte anpassen */
    }


    .container {
        background: none; /* Entfernt den Hintergrund vollständig */
        margin: 0; /* Entfernt den Abstand */
        padding: 0; /* Entfernt das Padding */
        border-radius: 0; /* Entfernt die abgerundeten Ecken */
        box-shadow: none; /* Entfernt den Schatten */
    }



    table {
        background-color: transparent; /* Falls du auch bei Tabellen den Hintergrund entfernen möchtest */
    }



}




/* Menüleiste */
.topnav {
    background-color: #333; /* Dunkelgrau */
    position: sticky;
    top: 0;
    z-index: 1000;
    box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.3); /* Schatten für Menü */
    display: flex; /* Flexbox für konsistente Anordnung */
    align-items: center;


	flex-wrap: wrap; /* Fügt einen Zeilenumbruch hinzu, wenn der Raum nicht ausreicht */
	height: auto; /* Höhe automatisch anpassen */
    min-height: 50px; /* Minimale Höhe angeben */
}

/* Allgemeine Links */
.topnav a {
    color: #f2f2f2; /* Helles Grau */
    text-align: center;
    padding: 14px 16px;
    text-decoration: none;
    font-size: 17px;
    transition: background-color 0.3s, color 0.3s;
}

.topnav a:hover {
    background-color: #575757; /* Mittelgrau beim Hover */
    color: white;
}

.topnav a.active {
    background-color: #ffd000; /* Gelb für aktive Seite */
    color: #333; /* Dunklere Schrift */
}

/* Dropdown-Container */
.topnav .dropdown {
    position: relative; /* Bezugspunkt für das Dropdown-Menü */
}

.topnav .dropdown .dropdown-toggle {
    cursor: pointer;
    color: #f2f2f2;
    text-align: center;
    padding: 14px 16px;
    text-decoration: none;
    font-size: 17px;
    transition: background-color 0.3s, color 0.3s;
}

.topnav .dropdown .dropdown-toggle:hover {
    background-color: #575757; /* Gleicher Hover-Effekt wie normale Links */
    color: white;
}

/* Dropdown-Menü */
.topnav .dropdown .dropdown-menu {
    display: none; /* Standardmäßig ausgeblendet */
    position: absolute; /* Relativ zu .dropdown */
    left: 0; /* Am linken Rand des Dropdown-Toggles */
    top: 100%; /* Direkt unterhalb des Dropdown-Toggles */
    background-color: #333; /* Gleiche Hintergrundfarbe wie die Navigationsleiste */
    min-width: 160px; /* Mindestbreite des Dropdowns */
    z-index: 1100; /* Sicherstellen, dass es über anderen Elementen liegt */
    box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.3); /* Schatten für Dropdown */
}

.topnav .dropdown .dropdown-menu a {
    float: none;
    color: #f2f2f2;
    padding: 12px 16px;
    text-decoration: none;
    display: block;
    text-align: left;
    transition: background-color 0.3s, color 0.3s;
}

.topnav .dropdown .dropdown-menu a:hover {
    background-color: #575757;
    color: white;
}

/* Dropdown-Menü anzeigen bei Hover */
.topnav .dropdown:hover .dropdown-menu {
    display: block;
}
























.tablesilent {
	width: 40%;
    border-collapse: collapse;
    margin: 0;
    padding: 0;
    text-align: left;	
}


.tablesilent tr {
    border: none;
    padding: 0;
    margin: 0;
    text-align: left;	
}


.tablesilent td {
    border: none;
    padding: 0;
    margin: 0;
    text-align: left;	
}


.tablesilent tbody tr:hover {
    background-color: transparent;
}