/*-----Information-Banner-----*/

#Information_Banner {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 50px;
    background-color: RGB(125,0,0);
    margin: auto;
}

#Banner_Text {
    font-family: 'Source Sans Pro', sans-serif;
    font-size: 18px;
    color: RGB(255,255,255);
    margin: 0;
}

.Hide_Banner {
    display: none !important;
    visibility: hidden !important;
}

/*-----Navbar-----*/

@media screen and (max-width: 500px) {

    .navbar-brand {
        margin: 0 !important;
        padding: 0 !important;
    }

    #brand-img {
        margin: 0 !important;
        padding: 0 !important;
    }
}

#Navbar {
    background-color: var(--p-bg-color);
    z-index: 1021;
    width: 100%;
    border-bottom: 3px solid var(--nav-border);
    margin: 0;
    padding: 0;
}

#NBC {
    padding-left: 0;
    margin-left: 0;
}

#NC {
    margin: auto;
}

#NavItem {
    font-family: 'Source Sans Pro', sans-serif;
    font-size: 30px;
    color: var(--font-color);
    text-align: center;
}

#NavItem:hover {
    background-color: var(--nav-hover);
    color: var(--font-color-hover);
}

#NavItem-dd {
    font-family: 'Source Sans Pro', sans-serif;
    font-size: 20px;
    color: RGB(0,0,0);
    text-align: center;
    border: none;
}

#NavItem-dd:hover {
    background-color: RGB(0,0,0);
    color: RGB(255,255,255);
    border: none;
    border-radius: 10px 10px 0 0;
    .dropdown-toggle::after {
        color: var(--font-color-hover);
    }
}

#NavItem:hover.dropdown-toggle::after {
    color: var(--font-color-hover);
}

.dropdown-toggle::after {
    color: var(--font-color);
    font-size: 20px;
    vertical-align: middle;
}

#NavDropdown {
    background-color: RGB(255,255,255);
    outline: 3px solid RGB(0,0,0);
    color: RGB(0,0,0);
    padding: 0;
    border-radius: 10px;
    border: none;
}

#NavDropdownDivider {
    background-color: RGB(0,0,0);
    width: 50%;
    height: 3px;
    margin: auto;
}

#nav-icon {
    font-size: 25px;
    vertical-align: middle;
}

#icon {
    font-size: 18px;
    color: RGB(0,116,209);
}

#toggler-button {
    outline: 3px solid RGBA(0,0,0,0.3);
}

#toggler-button:focus {
    background-color: RGBA(0,0,0,0.3);
    box-shadow: 0 0 0 3px RGBA(0,0,0,0.3);
}

#navbar-collapse-icon {
    color: var(--font-color);
    font-size: 30px;
}

#label, #label-home, #label_spare_parts {
    font-size: 20px;
}

@media screen and (max-width: 910px) {
    #label-home, #label_spare_parts {
        display: none;
        visibility: hidden;
    }
}

/*-----Placeholder-----*/

#NavItem-dd-Upper, #NavItem-dd-Mid, #NavItem-dd-Lower, #NavItem-dd-single {
    font-family: 'Source Sans Pro', sans-serif;
    font-size: 20px;
    color: RGB(0,0,0);
    text-align: center;
    border: none;
}

#NavItem-dd-single:hover {
    background-color: RGB(0,0,0);
    color: RGB(255,255,255);
    border: none;
    border-radius: 10px;
    .dropdown-toggle::after {
        color: var(--font-color-hover);
    }
}

#NavItem-dd-Upper:hover {
    background-color: RGB(0,0,0);
    color: RGB(255,255,255);
    border: none;
    border-radius: 10px 10px 0 0;
    .dropdown-toggle::after {
        color: var(--font-color-hover);
    }
}

#NavItem-dd-Mid:hover {
    background-color: RGB(0,0,0);
    color: RGB(255,255,255);
    border: none;
    border-radius: 0 0 0 0;
    .dropdown-toggle::after {
        color: var(--font-color-hover);
    }
}

#NavItem-dd-Lower:hover {
    background-color: RGB(0,0,0);
    color: RGB(255,255,255);
    border: none;
    border-radius: 0 0 10px 10px;
    .dropdown-toggle::after {
        color: var(--font-color-hover);
    }
}

/*-----Placeholder-----*/
/*-----Placeholder-----*/
/*-----Placeholder-----*/
/*-----Placeholder-----*/
/*-----Placeholder-----*/

/*-----Collapseable-Navbar-----*/

.NBCollapse {
    display: none;
    visibility: hidden;
}

.hidden-nav {
    display: none !important;
    visibility: hidden !important;
}

#NC-NoCollapse-Container {
    height: 60px;
    margin: auto;
    flex-direction: row !important;
}

#NC-NoCollapse {
    height: 60px;
    margin: auto;
    flex-direction: row !important;
}

@media screen and (max-width: 1560px) {
    .NBCollapse {
        display: block;
        visibility: visible;
    }

    .nav-padding {
        padding-right: 5px !important;
        padding-left: 5px !important;
    }

    #SearchBox {
        width: fit-content;
        margin-top: 0.75em;
        margin-bottom: 0.75em;
        margin-left: auto;
        margin-right: auto;
    }
}

@media screen and (max-width: 650px) {
    #Search-Hide {
        display: none;
        visibility: hidden;
    }
}