@font-face 
{ 
	font-family: 'Kelly-Slap'; 
	src: url('font/KellySlab-Regular.ttf') format('truetype'); 
}
html, body {
    height: 100%;
}

body {
    display: flex;
    flex-direction: column;
}

footer {
    flex-shrink: 0;
}

/* Allgemeine Stile für die <li>-Elemente */
.navbar-nav > li {
    list-style: none; /* Entfernt die Standard-Aufzählungspunkte */
    margin-right: 15px; /* Abstand zwischen den Menüpunkten */
    display: inline-block; /* Horizontale Ausrichtung */
}

/* Links innerhalb der <li>-Elemente */
.navbar-nav > li > a {
    text-decoration: none; /* Entfernt Unterstreichung */
    color: #333; /* Standardfarbe */
    font-weight: 500; /* Mittlere Schriftstärke */
    padding: 10px 15px; /* Innenabstand */
    display: inline-block; /* Klickbare Fläche */
    transition: color 0.3s ease, background-color 0.3s ease; /* Weicher Hover-Effekt */
}

/* Hover-Effekt für Links */
.navbar-nav > li > a:hover {
    color: #007bff; /* Textfarbe beim Hover */
    background-color: rgba(0, 123, 255, 0.1); /* Heller Hintergrund */
    border-radius: 5px; /* Abgerundete Ecken */
}

/* Aktive Links */
.navbar-nav > li.active > a {
    color: #007bff; /* Aktive Textfarbe */
    font-weight: bold; /* Stärkere Schrift */
    border-bottom: 2px solid #007bff; /* Unterstrich */
}

/* Dropdown-Menüs */
.navbar-nav .dropdown-menu {
    background-color: #ffffff; /* Weißer Hintergrund */
    border: 1px solid #ddd; /* Leichte Umrandung */
    border-radius: 5px; /* Abgerundete Kanten */
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); /* Leichter Schatten */
    padding: 0; /* Entfernt Innenabstand */
    margin-top: 5px; /* Abstand zum Hauptmenüpunkt */
}

/* <li>-Elemente innerhalb von Dropdowns */
.navbar-nav .dropdown-menu > li {
    list-style: none; /* Keine Punkte in der Liste */
}

/* Links in Dropdown-Menüs */
.navbar-nav .dropdown-menu > li > a {
    color: #333; /* Standardfarbe */
    padding: 10px 15px; /* Innenabstand */
    font-size: 14px; /* Kleinere Schriftgröße */
    display: block; /* Ganze Zeile klickbar */
    transition: color 0.3s ease, background-color 0.3s ease; /* Weicher Hover */
}

/* Hover-Effekt für Dropdown-Links */
.navbar-nav .dropdown-menu > li > a:hover {
    color: #ffffff; /* Weiße Textfarbe */
    background-color: #007bff; /* Blaue Hintergrundfarbe */
    border-radius: 3px; /* Abgerundete Kanten */
}

/* Mobile Anpassungen */
@media (max-width: 991.98px) {
    .navbar-nav > li {
        display: block; /* Vertikale Ausrichtung */
        margin-right: 0; /* Kein horizontaler Abstand */
    }

    .navbar-nav .dropdown-menu {
        position: static; /* Keine absolute Positionierung */
        margin: 0; /* Kein zusätzlicher Abstand */
        border: none; /* Keine Umrandung */
        box-shadow: none; /* Kein Schatten */
    }
}
.text-inset {
    color: white; /* Weißer Text */
    text-shadow:
        1px 1px 2px rgba(0, 0, 0, 0.6), /* Weicher Außen-Schatten */
       -1px -1px 2px rgba(0, 0, 0, 0.6); /* Umkehrter Schatten */
}
.text-engraved-sm {
    color: white;
    text-shadow: 
        0.5px 0.5px 1px rgba(0, 0, 0, 0.5), 
       -0.5px -0.5px 1px rgba(255, 255, 255, 0.5);
}
.text-shadow-lg {
    text-shadow: 
        1px 1px 1px rgba(255, 255, 255, 0.8), 
       -1px -1px 1px rgba(255, 255, 255, 0.8);
}
.text-shadow-sm {
    text-shadow: 
        0.5px 0.5px 1px rgba(255, 255, 255, 0.7), 
       -0.5px -0.5px 1px rgba(255, 255, 255, 0.7);
}


/* 
FOOTER

*/
/* Navigation im Footer */
.footer-nav {
    list-style: none; /* Keine Aufzählungszeichen */
    padding: 0;
    margin: 0;
}

.footer-nav li {
    margin-bottom: 0.5rem; /* Vertikaler Abstand zwischen Links */
}

.footer-nav li a {
    color: #d4e3ff; /* Dezentes Blau für Links */
    text-decoration: none; /* Keine Unterstreichung */
    font-size: 0.95rem;
    transition: color 0.3s ease; /* Glatter Übergang bei Hover */
}

.footer-nav li a:hover {
    color: #a0c4ff; /* Helleres Blau beim Hover */
}

.footer-nav li.active a {
    color: #82b4ff; /* Markiertes Blau für aktive Links */
    font-weight: bold; /* Aktiver Link fettgedruckt */
}

/* Dropdown-Menüs im Footer */
.footer-nav .dropdown-menu {
    background-color: #222; /* Dunkleres Grau für Dropdown */
    border: 1px solid #333; /* Subtile Umrandung */
    border-radius: 0.25rem; /* Abgerundete Ecken */
}

.footer-nav .dropdown-item {
    color: #d4e3ff; /* Dezentes Blau */
    font-size: 0.9rem; /* Leicht kleinere Schriftgröße */
    transition: background-color 0.3s ease, color 0.3s ease;
}

.footer-nav .dropdown-item:hover {
    background-color: #333; /* Etwas dunkleres Grau beim Hover */
    color: #a0c4ff; /* Helleres Blau beim Hover */
}

/* Responsives Design */
@media (max-width: 768px) {
    .footer-nav li {
        margin-bottom: 0.3rem; /* Weniger Abstand auf kleinen Geräten */
    }
    .footer-nav li a {
        font-size: 0.85rem; /* Kleinere Schriftgröße */
    }
}