.navbar-light .navbar-toggler-icon {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(255,255,255, 1)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 8h24M4 16h24M4 24h24'/%3E%3C/svg%3E");
}

#primary-navbar .navbar-toggler {
    display: none;
}

#primary-navbar {
    background-color: transparent !important;
    background: url(/images/navbar/navbar-blue.svg) no-repeat 100% 50%;
    background-size: cover;
    z-index: 1141;
    width: 201px;
    height: 80px;
}

#secondary-navbar {
    background-color: var(--background-color-navbar) !important;
    background: url(/images/navbar/navbar-background-mobile-blue.svg) no-repeat -0px 100%;
    box-shadow: var(--shadow-color-navbar);
    min-height: 80px;
    width: 100vw;
}

#primary-navbar .nav-link {
    color: var(--primary-navbar-text-color);
    padding-right: 25px;
    padding-left: 25px;
}

#primary-navbar .nav-link:hover {
    text-decoration: underline;
    -webkit-text-decoration-color: #ff8a00;
    text-decoration-color: hsl(32deg 100% 50%);
    text-underline-offset: 10px;
    text-decoration-thickness: 3px;
}

.bg-light .navbar-brand span {
    color: var(--primary-text-color);
    font-weight: 900;
    line-height: 49.9px;
    font-size: 24px;
    padding-left: 195px;
    font-family: "Merriweather", serif;
}

.nav-item {
    font-size: 16px;
    font-weight: 700;
    line-height: 29.94px;
    letter-spacing: 2px;
}

#secondary-navbar .nav-link {
    color: var(--text-color-navbar);
    border-bottom: 3px solid transparent;
    padding: 26px 20px;
}

#secondary-navbar .nav-link:hover {
    border-bottom: 3px solid var(--hover-color-navbar);
}

.active {
    border-bottom: 3px solid var(--active-color-navbar) !important;
}

.dropdown-toggle img {
    width: 43px;
    height: 27px;
    padding-right: 4px;
}

.dropdown-menu {
    min-width: 0;
    width: max-content;
}
/*
#secondary-navbar .dropdown-item {
    width: 90px;
} */

.navbar-toggler span {
    display: block;
    background-color: #4f4f4f;
    height: 3px;
    width: 25px;
    margin-top: 5px;
    margin-bottom: 5px;
    position: relative;
    left: 0;
    opacity: 1;
    transition: all 0.35s ease-out;
    transform-origin: center left;
}

.navbar-toggler:focus {
    box-shadow: none;
}

#secondary-navbar .navbar-toggler {
    padding: 16px 12px 16px;
}

/* top line needs a little padding */
.navbar-toggler span:nth-child(1) {
    margin-top: 0.3em;
}

/**
      * Animate collapse into X.
      */

/* top line rotates 45 degrees clockwise and moves up and in a bit to close the center of the X in the center of the button */
.navbar-toggler:not(.collapsed) span:nth-child(1) {
    transform: translate(15%, -33%) rotate(45deg);
}
/* center line goes transparent */
.navbar-toggler:not(.collapsed) span:nth-child(2) {
    opacity: 0;
}
/* bottom line rotates 45 degrees counter clockwise, in, and down a bit to close the center of the X in the center of the button  */
.navbar-toggler:not(.collapsed) span:nth-child(3) {
    transform: translate(15%, 33%) rotate(-45deg);
}

/**
      * Animate collapse open into hamburger menu
      */

/* top line moves back to initial position and rotates back to 0 degrees */
.navbar-toggler span:nth-child(1) {
    transform: translate(0%, 0%) rotate(0deg);
}
/* middle line goes back to regular color and opacity */
.navbar-toggler span:nth-child(2) {
    opacity: 1;
}
/* bottom line goes back to initial position and rotates back to 0 degrees */
.navbar-toggler span:nth-child(3) {
    transform: translate(0%, 0%) rotate(0deg);
}

.navbar-light .navbar-toggler {
    border-color: transparent;
}

@media screen and (max-width: 1480px) {
    .navbar-brand span {
        display: none;
    }
}

@media screen and (max-width: 1024px) {
    .nav-item {
        font-size: 0.5em;
    }

    #secondary-navbar .nav-link {
        padding: 27px 6px;
    }
}

@media screen and (max-width: 991px) {
    #secondary-navbar .nav-link {
        padding: 8px 0px;
        max-width: fit-content;
        max-width: -moz-fit-content;
    }

    #primary-navbar .nav-link {
        max-width: fit-content;
        max-width: -moz-fit-content;
        padding-left: 0px;
    }

    #secondary-navbar #navbar-nav-secondary {
        padding: 16px 0 150px 195px;
    }

    #primary-navbar #navbar-nav-secondary {
        padding: 18px 16px;
    }

    .nav-link {
        max-width: fit-content;
        max-width: -moz-fit-content;
    }

    .nav-item {
        font-size: 0.9rem;
    }

    .navbar-nav .dropdown-menu {
        position: absolute;
        left: -18px;
    }
}

@media screen and (max-width: 540px) {
    #secondary-navbar .nav-link {
        padding: 8px 0px;
        font-size: 14.4px;
    }

    .bg-light .navbar-brand {
        font-size: 1em;
    }
}

@media screen and (min-width: 998px) {
    .navbar-light {
        height: 80px;
        padding: 0 16px;
    }
}