header {
    padding-bottom: 12px;
    padding-top: 12px;
    position: relative;
    min-height: 100px
}

header .client-logo,
header .subforce-logo {
    height: 70px;
    width: auto
}

header .client-logo.logo-large,
header .subforce-logo.logo-large {
    height: 100px
}

header .navbar {
    text-transform: uppercase
}

header .navbar-collapse {
    padding: 0 2rem
}

@media screen and (min-width:1100px) {
    header .navbar-collapse {
        padding: 0 3rem
    }
}

@media screen and (min-width:1200px) {
    header .navbar-collapse {
        padding: 0 5rem
    }
}

@media screen and (min-width:1400px) {
    header .navbar-collapse {
        padding: 0 7rem
    }
}

header .nav-item:first-child {
    margin-right: 20px
}

@media screen and (min-width:1100px) {
    header .nav-item:first-child {
        margin-right: 20px
    }
}

@media screen and (min-width:1200px) {
    header .nav-item:first-child {
        margin-right: 50px
    }
}

@media screen and (min-width:1400px) {
    header .nav-item:first-child {
        margin-right: 70px
    }
}

header .nav-item .nav-link {
    font-weight: 700
}

header .nav-item .nav-link.active {
    color: #fff
}

header .navbar-toggler {
    border-width: 0;
    position: absolute;
    right: 0;
    top: 34px
}

header .navbar-toggler .fa-xmark {
    display: none
}

header .navbar-toggler[aria-expanded=true] .fa-bars {
    display: none
}

header .navbar-toggler[aria-expanded=true] .fa-xmark {
    display: block
}

header .navbar-toggler:hover i::before {
    color: #f2f2f2
}

header .navbar-toggler i {
    font-family: "Font Awesome 6 Pro";
    font-size: 30px;
    height: 30px;
    width: 30px
}

header .navbar-toggler i::before {
    color: #fff
}

.header-slim {
    padding: 3rem
}