:root {
    --navbar-nav-down-background: rgba(255, 255, 255, 0.4);
    --navbar-brand-color: #000000;

    --navbar-responsive-bg-color: rgba(255, 255, 255, 1);
    --navbar-responsive-color: #000000;
}

[data-bs-theme="dark"] {
    --navbar-nav-down-background: rgba(0, 0, 0, 0.4);
    --navbar-brand-color: #FFFFFF;

    --navbar-responsive-bg-color: rgba(0, 0, 0, 1);
    --navbar-responsive-color: #FFFFFF;
}

/* ------------ Toggler BTN */
.navbar.navbar-transparent .navbar-toggler {
    border:none;
}
.navbar.navbar-transparent .navbar-toggler-icon {
    color: var(--navbar-responsive-color);
}
.navbar.navbar-transparent .navbar-toggler .navbar-toggler-icon .navbar-toggler-bar {
    background: #000000;
}
/* ------------ Set Toggler to FA */

.navbar-toggler-icon {
    background-image: none;
}

.navbar-toggler .navbar-toggler-icon::before,
.navbar-toggler.collapsed .navbar-toggler-icon::before {
    font-family: FontAwesome;

}
.navbar-toggler .navbar-toggler-icon::before {
    content: "\e59b"; /* fa-xmark */
    font-size: 30px;
    color: var(--navbar-responsive-color);
}
.navbar-toggler.collapsed .navbar-toggler-icon::before {
    content: "\f0c9"; /* fa-bars */
}

.navbar-transparent .navbar-toggler.collapsed .navbar-toggler-icon::before {
    color: #FFF !important;
}
.nav-down .navbar-toggler.collapsed .navbar-toggler-icon::before {
    color: #000;
}

/* ------------ Toggler BTN */
.navbar.navbar-transparent .navbar-toggler.collapsed .navbar-toggler-icon .navbar-toggler-bar {
    background: #fff;
}

/* ------------ COLLAPSE */

.navbar.navbar-transparent .navbar-collapse {
    border-radius: 0;
}

/* ----------- Responsive */
@media (max-width: 992px) {

    .navbar-collapse.show .nav-link,
    .navbar-collapse.show .nav-link i {
        color: var(--navbar-responsive-color) !important;
    }

    .navbar-collapse.show .nav-item.border-start {
        border-left: none !important;
    }

}

/* ---- Naviagtion Links */

.navbar.navbar-transparent .nav-link,
.navbar.navbar-transparent .nav-link i {
    color: #fff;
}
/* ------------ Navbar */
.navbar {
    height: 110px;
    transition-delay: 100ms;
    transition-duration: 200ms;
    transition-timing-function: ease-in-out;
    box-shadow: unset;
    padding-left: 0px !important;
    padding-right:0px !important;
}
.navbar .container {
    padding-left: 1.9rem !important;
    padding-right: 1.9rem !important;
}

/* HIDE on Scroll */
.nav-up {
    top: -110px;
}
.nav-down {
    top: 0;
    -webkit-backdrop-filter: blur(30px);
    backdrop-filter: blur(30px);
    background: var(--navbar-nav-down-background);
}
/* ------------ Navbar */

.navbar-transparent.nav-down {
    background-color: unset;
    box-shadow: none;
    -webkit-backdrop-filter: unset;
    backdrop-filter: unset;
}
.navbar .nav-item.active a {
    text-decoration: underline;
}
.navbar .nav-item:hover .nav-link,
.navbar .nav-item:hover .nav-link i {
    color: var(--navbar-link-hover-color);
}

.navbar .active.nav-item:hover .nav-link {
    color: var(--navbar-link-color);
}
.navbar-transparent .active.nav-item:hover .nav-link {
    color: var(--navbar-transparent-link-color);
}

/* ------------ Brand */
.navbar .navbar-brand {
    color: var(--navbar-brand-color);
}
.navbar.navbar-transparent .navbar-brand {
    height:72px !important;
    padding:0px !important;
    color:white !important;
}

/* --------------- Navigation nav-link */
.navbar .nav-link,
.navbar .nav-link i {
    font-size:1.4rem !important
}


.navbar-icon-link:hover {
    cursor: pointer
}








/* ----------- Responsive */
/* ----------- Screen | Mobile */
@media (max-width: 992px) {
    .navbar-brand .w-16{
        height: 3rem;
        width:auto !important;
    }

    .navbar .navbar-brand {
        height:31px !important;
    }

    /* --------------- Navigation */
    .navbar {
        height:85px !important;
        padding-bottom:0px !important;
    }

    .nav-open .navbar.navbar-transparent {
        color: #000 !important;
    }

    .nav-open .navbar-toggler-icon.d-none {
        display: block !important;
    }
    .navbar {
        box-shadow: none !important;
        padding-bottom:25px;
    }
    .nav-open .navbar-collapse {
        width: 80%;
    }
    /* BEGIN Site Search */
    .collapse.show .search {
        position:absolute;
        right:20px;
        bottom:20px;
    }
    .collapse.show .search .nav-link {
        padding:0px;
    }
    .collapse.show .search .nav-link i {
        padding:10px;
        border:1px solid #000;
        border-radius: 50%;
        color:white !important;
        background-color:black;
    }
    /* END Site Search */

    .collapse.show .navbar-nav {
        margin-left: 25px !important;
        margin-right: 25px !important;
    }
    .navbar-collapse .navbar-nav {
        margin-top:140px;

    }

    .nav-open .dropdown.active .dropdown-menu {
        display: block !important;
    }
    .navbar .dropdown .dropdown-menu, .navbar .dropdown.show .dropdown-menu {

        height: auto;
    }

    .navbar-toggler {

    }
    .navbar-toggler.toggled .navbar-toggler-icon {
        background-color:black !important;

    }
    .navbar-toggler.toggled {
        position: absolute;
        z-index: 3000;
        right:0px;
        top:5px;
    }
    .nav-open .navbar-translate {
        transform: none;
    }

    /* --------------- Navbar Mobile */
    .navbar-toggler {
        right:30px;
        top:30px;
        padding:0px;
        position: absolute;
        z-index: 1001;
    }
    .navbar-toggler.collapsed {
        position: absolute;
        right:30px;
        top:30px;
        z-index: 1001;
        margin:0px;
        border:none;
    }


    /* --------------- Navbar Mobile */
    .nav-sub {
        padding-right:0px;
        pading-left:0px;
    }
    /* --------------- Navbar Animation */
    .collapsing {
        height: 100%;
        width:0 !important;
        overflow: hidden;
        transition: width 0.35s linear;
    }
    /* --------------- Navbar Animation */
    .navbar-collapse {
        background-color: var(--navbar-responsive-bg-color);
        width:100%;
        height:100vh;
        position:fixed;
        top:0px;
        left:0px;
        z-index: 1000;
    }
    .navbar-collapse .navbar-nav {
        height:calc(100% - 80px);
    }

    .navbar-collapse .nav-link {
        font-size: 2.4rem !important;
        font-weight:bold;
        padding-top:20px;
        padding-bottom:20px;
    }

}











































/* ------------ Sub Nav change FA */
.fa-show-on-active .fa-hide {
    display:none;
}

.fa-show-on-active .active .fa-hide {
    display:inline-block;
}
.fa-show-on-active .active .fa-show {
    display:none;
}

.nav-sub .active {
    text-decoration:none !important;
}
