/*-----------------------
  Main Navigation Bar
 -----------------------*/
:root {
    --mainBlack: #000000;
    --mainWhite: white;
    --primeColor: #6ba66b; /*Green*/
    --secondColor: #add468; /*Lime Green*/
    --outlineColor: #dddddd;
}
.navbar{
    border-bottom: 3px solid var(--secondColor);
}
.navbar-brand {
    margin-left: 1rem;
}
.navbar-brand img {
    max-height: 120px;
    height: auto;
    width: auto;
}
.navbar-toggler .fa-bars {
    color: var(--primeColor);
    font-size: 2rem;
}

.navbar-nav {
    margin-right: 2rem;
}
.navbar-nav .nav-link {
    position: relative;
    font-weight: 600;
    font-size: 1.5rem;
    padding: 0.5rem 1.25rem;
    margin: 0 0.5rem 0 0.5rem;
    color: var(--primeColor);
    transition: all 0.2s ease-in-out;
    cursor: pointer;
}
    .navbar-nav .nav-link::after {
        content: "";
        position: absolute;
        left: 0;
        bottom: -3px;
        width: 0%;
        height: 3px;
        background-color: var(--secondColor);
        transition: width 0.3s ease;
    }
    .navbar-nav .nav-link:hover,
    .navbar-nav .nav-link:focus {
        color: var(--secondColor);
    }
        .navbar-nav .nav-link:hover::after,
        .navbar-nav .nav-link:focus::after,
        .navbar-nav .nav-link.active::after {
            width: 100%;
        }