.navigation {
    background-color: white;
}

.navigation a {
    font-weight: bold;
    font-size: 13px;
}

nav {
    border-bottom: 0.5px solid #00000080;
}

nav a {
    color: var(--bs-dark);
}

nav a:hover {
    color: var(--bs-primary) !important;
}

.navbar-brand {
    width: 100%;
    max-width: 450px;
}

.home-search-bar {
    color: var(--bs-dark);
    border: none;
    background: transparent;
    padding-right: 2.5rem;
}

.home-search-bar:focus {
    background: transparent;
    box-shadow: none;
}

.home-search-bar::placeholder {
    opacity: .5;
    color: var(--bs-dark) !important;
    font-weight: 300;
}

.bi-search {
    top: 50%;
    right: 10px;
    transform: translateY(-50%);
    color: var(--bs-dark);
    pointer-events: none;
}

/* Remove Bootstrap's default dropdown arrow */
nav .dropdown-toggle::after {
    content: none !important; /* Prevents the default arrow from rendering */
}

.nav-link:focus, .nav-link:hover {
    color: #105B32;
}


.nav-link {
    font-weight: 600;
    /*color: var(--bs-primary) !important;*/
    color: #105B32;
}

nav .dropdown-menu {
    border-radius: 0;
    background-color: #EBEBEB;
    border: none;
    font-weight: normal !important;
    padding-top: 0;
    padding-bottom: 0;
}

nav .dropdown-menu .nav-item:not(:first-child) {
    border-top: 1px solid var(--bs-dark);
}

nav .dropdown-menu .nav-item {
    text-align: center;
}

nav .dropdown-menu .nav-item:hover {
    background-color: var(--bs-secondary);
    color: var(--bs-dark) !important;
}


@media (max-width: 767.98px) {
    .navbar-brand {
        max-width: 300px;
    }
}

@media (max-width: 400px) {
    .navbar-brand {
        max-width: 250px;
    }
}