/**
 * Shared: Header
 * Use .body-us .selector {...} to target US site
 * Use .body-intl .selector {...} to target Intl site
 * Theme colors: US #213b60 / Intl #3fc380
 */

 .site-header {
    position: static;
    top: auto;
    z-index: auto;
    width: auto;
    background-color: transparent;
    transition: none;
}

.header-secondary {
    color: #fff;
}

.body-us .header-secondary {
    background-color: #213b60;
}

.body-intl .header-secondary {
    background-color: #3fc380;
}

.header-container {
    position: relative;
    max-width: 1200px;
    width: 100%;
    margin: 0 auto;
    padding-left: 1.25rem;
    padding-right: 1.25rem;
}

.header-secondary .header-container {
    display: flex;
    align-items: center;
    padding-top: .5625rem;
    padding-bottom: .5625rem;
}

.header-secondary .dropdown-menu {
    left: auto;
    right: -.625rem;
}

.header-secondary a {
    color: inherit;
    text-decoration: none;
}

.header-phone {
    display: flex;
    align-items: center;
    font-size: .875rem;
    letter-spacing: .5px;
    margin-right: auto;
}

.header-phone:before {
    content: "";
    width: 1.25rem;
    height: 1.25rem;
    margin-right: .375rem;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 18 18'%3E%3Cpath d='M1.4 14.4h.8C2 17.2 5 17.8 7.4 17.7c.1.2.3.3.5.3h2.4c.3 0 .6-.3.6-.6v-.5c0-.3-.3-.6-.6-.6H7.9c-.3 0-.5.2-.6.5-1.9.1-4.4-.2-4.3-2.5h1c.3 0 .5-.2.5-.5V8.3c0-.3-.2-.5-.5-.5H2.6c.2-3.4 3-6.3 6.4-6.3 3.4 0 6.2 2.8 6.4 6.3h-1.5c-.3 0-.5.2-.5.5v5.6c0 .3.2.5.5.5h2.7c.3 0 .5-.2.5-.5V8.3c0-.1 0-.2-.1-.3-.1-4.4-3.7-8-8-8-4.2 0-7.8 3.6-7.9 7.9-.1.1-.2.2-.2.4v5.6c0 .2.2.5.5.5z' fill='%23fff'/%3E%3C/svg%3E%0A") left center / 1.25rem 1.25rem no-repeat;
}

.header-links {
    display: none;
}

.header-links ul {
    list-style: none;
    display: flex;
    align-items: center;
    padding: 0;
    margin: 0;
}

.header-links li {
    margin-right: .5rem;
}

.header-links .icon {
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    display: block;
    width: 18px;
    height: 18px;
}

.header-links .facebook {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 18 18'%3E%3Cg%3E%3Cpath d='M10.9 9.3H6.8V7.4h4.4z' fill='%23fff'/%3E%3Cpath d='M7.7 6.2v7.5h1.9V6.5c0-.2.1-.3.3-.3h1.3V4.3H9.7c-2 0-2 1.6-2 1.9z' fill='%23fff'/%3E%3C/g%3E%3Cpath d='M4.6 18C2.1 18 0 15.9 0 13.3V4.7C0 2.1 2.1 0 4.6 0h8.8C15.9 0 18 2.1 18 4.7v8.6c0 2.6-2.1 4.7-4.6 4.7H4.6zm.2-16.9c-2 0-3.7 1.7-3.7 3.7v8.3c0 2.1 1.6 3.7 3.7 3.7h8.5c2 0 3.7-1.7 3.7-3.7V4.8c0-2.1-1.6-3.7-3.7-3.7H4.8z' fill='%23fff'/%3E%3C/svg%3E%0A");
}

.header-links .twitter {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 18 18'%3E%3Cpath d='M14.4 4.3c-.5.3-.9.5-1.5.6-.4-.5-1-.8-1.7-.8-1.3 0-2.3 1.1-2.3 2.4 0 .2 0 .4.1.5-2-.1-3.7-1-4.9-2.5-.2.4-.3.8-.3 1.2 0 .8.4 1.6 1 2-.4 0-.7-.1-1.1-.3 0 1.2.8 2.1 1.9 2.3-.1.1-.4.2-.6.2h-.4c.3.9 1.2 1.6 2.2 1.7-.8.6-1.8 1-2.9 1h-.6c1 .7 2.3 1.1 3.6 1.1 4.3 0 6.6-3.6 6.6-6.8v-.3c.5-.3.9-.8 1.2-1.2-.4.2-.9.3-1.3.4.4-.5.8-1 1-1.5z' fill='%23fff'/%3E%3Cpath d='M4.6 18C2.1 18 0 15.9 0 13.3V4.7C0 2.1 2.1 0 4.6 0h8.8C15.9 0 18 2.1 18 4.7v8.6c0 2.6-2.1 4.7-4.6 4.7H4.6zm.2-16.9c-2 0-3.7 1.7-3.7 3.7v8.3c0 2.1 1.6 3.7 3.7 3.7h8.5c2 0 3.7-1.7 3.7-3.7V4.8c0-2.1-1.6-3.7-3.7-3.7H4.8z' fill='%23fff'/%3E%3C/svg%3E%0A");
}

.header-links .instagram {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 18 18'%3E%3Ccircle cx='14.3' cy='5.1' r='.9' fill='%23fff'/%3E%3Cpath d='M9 13.5c-2.4 0-4.4-2-4.4-4.5s2-4.5 4.4-4.5c2.4 0 4.4 2 4.4 4.5s-2 4.5-4.4 4.5zm0-7.8C7.2 5.7 5.7 7.2 5.7 9s1.5 3.3 3.3 3.3 3.3-1.5 3.3-3.3S10.8 5.7 9 5.7z' fill='%23fff'/%3E%3Cpath d='M4.6 18C2.1 18 0 15.9 0 13.3V4.7C0 2.1 2.1 0 4.6 0h8.8C15.9 0 18 2.1 18 4.7v8.6c0 2.6-2.1 4.7-4.6 4.7H4.6zm.2-16.9c-2 0-3.7 1.7-3.7 3.7v8.3c0 2.1 1.6 3.7 3.7 3.7h8.5c2 0 3.7-1.7 3.7-3.7V4.8c0-2.1-1.6-3.7-3.7-3.7H4.8z' fill='%23fff'/%3E%3C/svg%3E%0A");
}

.header-links .blogger {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 18 18'%3E%3Cpath d='M10 6.4c2 0 3.6 1.6 3.6 3.6S12 13.6 10 13.6H8c-2 0-3.6-1.6-3.6-3.6V5.2c0-.5.4-.8.8-.8.5 0 .8.3.8.8V10c0 1.1.9 2 2 2h2c1.1 0 1.9-.9 1.9-1.9.1-1.1-.8-2-1.9-2H7.8c-.4 0-.8-.4-.8-.9s.4-.8.8-.8H10z' fill='%23fff'/%3E%3Cpath d='M4.6 18C2.1 18 0 15.9 0 13.3V4.7C0 2.1 2.1 0 4.6 0h8.8C15.9 0 18 2.1 18 4.7v8.6c0 2.6-2.1 4.7-4.6 4.7H4.6zm.2-16.9c-2 0-3.7 1.7-3.7 3.7v8.3c0 2.1 1.6 3.7 3.7 3.7h8.5c2 0 3.7-1.7 3.7-3.7V4.8c0-2.1-1.6-3.7-3.7-3.7H4.8z' fill='%23fff'/%3E%3C/svg%3E%0A");
}

.header-links .youtube {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 18 18'%3E%3Cpath d='M13 8.1c.7.4.7 1.3 0 1.7l-3 1.7-2.9 1.7c-.7.4-1.5-.1-1.5-.9V5.6c0-.8.8-1.2 1.5-.9L10 6.5l3 1.6z' fill='%23fff'/%3E%3Cpath d='M4.6 18C2.1 18 0 15.9 0 13.3V4.7C0 2.1 2.1 0 4.6 0h8.8C15.9 0 18 2.1 18 4.7v8.6c0 2.6-2.1 4.7-4.6 4.7H4.6zm.2-16.9c-2 0-3.7 1.7-3.7 3.7v8.3c0 2.1 1.6 3.7 3.7 3.7h8.5c2 0 3.7-1.7 3.7-3.7V4.8c0-2.1-1.6-3.7-3.7-3.7H4.8z' fill='%23fff'/%3E%3C/svg%3E%0A");
}

.header-links .linkedin {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 18 18'%3E%3Cpath d='M4 7.3h2.1v6.5H4zM9.7 9.7c.2-.4.5-.8 1.1-.8.8 0 1.2.6 1.2 1.5v3.4h2.3v-3.6c0-2-1.1-3-2.6-3-1.2 0-1.9.6-2.1 1.1v-1H7.3v6.5h2.3v-3.5c0-.2 0-.4.1-.6M5 4.2c-.8 0-1.3.5-1.3 1.1 0 .6.5 1.1 1.2 1.1.8 0 1.3-.5 1.3-1.1 0-.6-.5-1.1-1.2-1.1z' fill='%23fff'/%3E%3Cpath d='M4.6 18C2.1 18 0 15.9 0 13.3V4.7C0 2.1 2.1 0 4.6 0h8.8C15.9 0 18 2.1 18 4.7v8.6c0 2.6-2.1 4.7-4.6 4.7H4.6zm.2-16.9c-2 0-3.7 1.7-3.7 3.7v8.3c0 2.1 1.6 3.7 3.7 3.7h8.5c2 0 3.7-1.7 3.7-3.7V4.8c0-2.1-1.6-3.7-3.7-3.7H4.8z' fill='%23fff'/%3E%3C/svg%3E");
}

.header-links .text {
    font-size: .75rem;
    font-weight: 600;
    letter-spacing: .5px;
    text-transform: uppercase;
}

.header-links a {
    display: block;
}

.header-switch {
    font-size: .875rem;
}

.header-links a:hover,
.header-switch a:hover,
.header-switch .open a {
    opacity: .8;
}

.header-primary .header-container {
    padding-top: 1.125rem;
    padding-bottom: 1.125rem;
}

.header-branding {
    padding-bottom: 1.25rem;
}

.header-branding a {
    position: relative;
    display: block;
    width: 8.125rem;
}

.header-branding img {
    width: 100%;
    height: auto;
}

.header-account .sign-up-in {
    font-size: .8125rem;
    font-weight: 700;
    letter-spacing: .5px;
    text-align: center;
    text-transform: uppercase;
    white-space: nowrap;
}

.header-account .sign-up-in ul {
    list-style: none;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0;
    margin: 0;
}

.header-account .sign-up-in li:not(:last-child) {
    margin-right: .375rem;
}

.header-account .sign-up-in a {
    display: block;
    width: 8.875rem;
    height: 2.5rem;
    padding: 0 .625rem;
    line-height: 2.375rem;
    text-decoration: none;
}

.header-account .sign-up-in .sign-up {
    border: 1px solid #3fc380;
    border-radius: .3125rem;
    background-color: #3fc380;
    color: #fff;
    transition: background-color .2s;
}

.header-account .sign-up-in .sign-in {
    border: 1px solid #3fc380;
    border-radius: .3125rem;
    color: #3fc380;
}

.header-account .sign-up-in a:hover {
    background-color: #39b073;
    border-color: #39b073;
    color: #fff;
}

.header-account .signed-in {
    text-align: center;
    white-space: nowrap;
}

.header-account [data-toggle="dropdown"] {
    font-size: .9375rem;
    text-decoration: none;
    color: inherit;
}

.header-account [data-toggle="dropdown"]:hover {
    opacity: .8;
}

.header-hamburger {
    position: absolute;
    right: 1.25rem;
    top: 1.9375rem;
    width: 2rem;
    height: 2rem;
    cursor: pointer;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 60 60'%3E%3Crect x='3' y='12' width='54' height='5' rx='2.5'/%3E%3Crect x='3' y='28' width='54' height='5' rx='2.5' fill='%2342c482'/%3E%3Crect x='3' y='43' width='54' height='5' rx='2.5'/%3E%3C/svg%3E%0A") center / contain no-repeat;
}

.header-hamburger.active {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 60 60'%3E%3Cpath d='M47.27 16.27l-31 31c-.98.98-2.56.98-3.54 0s-.98-2.56 0-3.54l31-31c.98-.98 2.56-.98 3.54 0 .97.98.97 2.56 0 3.54z'/%3E%3Cpath d='M43.73 47.27l-31-31c-.98-.98-.98-2.56 0-3.54s2.56-.98 3.54 0l31 31c.98.98.98 2.56 0 3.54-.98.97-2.56.97-3.54 0z'/%3E%3C/svg%3E");
}

.header-navbar {
    font-size: .875rem;
    text-transform: uppercase;
    padding: 0;
    margin: 1.5rem 0;
    border-top: 1px solid #eee;
    display: none;
}

.header-navbar.active {
    display: block;
}

.header-navbar ul {
    padding: 0;
    margin: 0;
}

.header-navbar li {
    list-style: none;
    display: block;
    padding: 0;
    margin: 0;
    border-bottom: 1px solid #eee;
}

.header-navbar li li:last-of-type {
    border-bottom-width: 0;
}

.header-navbar li a {
    display: block;
    text-align: center;
    padding: .75rem 0;
    text-decoration: none;
    color: inherit;
    transition: color .1s;
}

.header-navbar li a:hover {
    text-decoration: none;
}

.header-navbar li a:hover,
.header-navbar .active a {
    color: #3fc380;
}

.header-navbar li .has-submenu {
    display: none;
}

.header-container .has-arrow:after {
    content: "";
    display: inline-block;
    vertical-align: middle;
    width: .875rem;
    height: .875rem;
    position: relative;
}

.header-switch .has-arrow:after {
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") center / contain no-repeat;
}

.header-navbar .has-arrow:after {
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23aaa' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") center / contain no-repeat;
}

.header-account .has-arrow:after {
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23aaa' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") center / contain no-repeat;
}

.header-account .has-avatar {
    position: relative;
}

.header-account .has-avatar:before {
    content: "";
    display: inline-block;
    vertical-align: middle;
    width: 1.5rem;
    height: 1.5rem;
    position: absolute;
    top: -.125rem;
    left: -1.75rem;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23333' stroke-width='1' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2'%3E%3C/path%3E%3Ccircle cx='12' cy='7' r='4'%3E%3C/circle%3E%3C/svg%3E") center / contain no-repeat;
}

@media (min-width: 768px) {

    .header-links {
        display: block;
    }

    .header-primary .header-container {
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
        align-items: center;
    }

    .body-us .header-account .sign-up-in a {
        width: auto;
    }

    .header-branding {
        padding-bottom: 0;
    }

    .header-branding a {
        width: 10rem;
    }

    .header-hamburger {
        display: none;
    }

    .header-navbar {
        flex: 0 0 100%;
        padding: .5rem 0 0;
        margin: 0;
        border: 0;
        font-size: .9rem;
        font-weight: 500;
        white-space: nowrap;
        display: block;
    }

    .header-navbar > ul {
        display: flex;
        justify-content: center;
        padding: 0;
        margin: 0;
    }

    .header-navbar > ul > li {
        position: relative;
        padding: 0;
        margin: 0 .625rem;
        border: 0;
    }

    .header-navbar > ul > li > div {
        position: absolute;
        z-index: 1000;
        left: 50%;
        transform: translateX(-50%);
        background-color: #fff;
        display: none;
    }

    .header-navbar > ul > li:hover > div {
        display: block;
    }

    .header-navbar > ul > li > div > ul {
        position: relative;
        padding: .5rem 2rem .5rem .75rem;
    }

    .header-navbar > ul > li > div > ul:before {
        content: "";
        position: absolute;
        top: 0;
        left: 50%;
        transform: translate(-50%, -100%);
        width: 0;
        height: 0;
        border-left: 5px solid transparent;
        border-right: 5px solid transparent;
        border-bottom: 5px solid #fff;
    }

    .header-navbar > ul > li > div > ul,
    .header-navbar > ul > li > div > ul:before {
        box-shadow: 0 0 1rem rgba(63,195,128,.3);
    }

    .header-navbar > ul > li:hover > a {
        color: #3fc380;
    }

    .header-navbar li li {
        font-size: .75rem;
        border: 0;
    }

    .header-navbar li a {
        text-align: left;
    }

    .header-navbar li .has-submenu {
        display: flex;
        align-items: center;
    }

    .header-navbar li li a {
        position: relative;
        padding: .125rem 0;
    }

    .header-navbar li li a:hover:before {
        content: "";
        position: absolute;
        left: -.75rem;
        top: 50%;
        transform: translateY(-50%);
        height: .875rem;
        width: 2px;
    }

    .header-navbar li li a:hover:before {
        background-color: #3fc380;
    }

    .header-navbar .mobile {
        display: none;
    }

}

@media (min-width: 1200px) {

    .header-primary .header-container {
        flex-wrap: nowrap;
    }

    .header-account {
        order: 1;
    }

    .header-navbar {
        flex: 0 0 auto;
        padding: 0;
        margin: auto;
    }

    .header-navbar > ul {
        justify-content: space-between;
    }

}
