.side_bar .primary-nav {
    border: 1px solid var(--primary-color-2);
    margin: .5em;
    padding: .8em;
}

.side_bar .primary-nav li {
    border-bottom: 1px solid var(--primary-color-01);
    white-space: nowrap;
    width: 100%;
}

.menu-item--active-trail {}

.menu .is-active {
    border-bottom: 2px solid var(--accent-color-01);
    color: #FFF !important;
    font-weight: 600;
}

footer .menu .is-active {
    display: block;
    color: var(--primary-01) !important;
    font-weight: 600;
    border: none !important;
}



.region-primary-menu .menu {
    width: inherit !important;
    padding: 0;
    margin: 0;
    list-style: none;
    position: relative;
    font-size: 1.1em;
}

.region-primary-menu .menu-item {
    display: inline-block;
    text-align: left;
}


.region-primary-menu .menu ul li {
    min-width: 200px;
    float: none;
    display: list-item;
    position: relative;
    list-style: none;
    padding: 0;
    margin: 0;
}


@media (max-width: 768px) {

    #menu-bar {
        width: 45px;
        height: 40px;
        cursor: pointer;
        z-index: 9999999;
        right: 2em;
        top: 4em;
        position: fixed;
    }

    .region-primary-menu nav {
        background-color: var(--primary-01);
        overflow: hidden;
        height: 0;
        white-space: nowrap;
        position: fixed !important;
        z-index: 99999 !important;
        left: 0;
        width: 100%;
        overflow: hidden;
        transition: height 0.5s ease-in;
    }

    .region-primary-menu .menu {
        position: relative !important;
        float: none !important;

    }

    .region-primary-menu>nav>.menu {
        padding: 2em !important;
    }

    .region-primary-menu .menu-item {
        display: table;
        line-height: 3em !important;
        width: 80%;
        border-bottom: 1px solid #FFF;
    }

    .region-primary-menu .menu-item .menu {
        border-top: 1px solid #FFF !important;
        width: 95% !important;
    }

    .region-primary-menu .menu-item .menu-item:last-child {
        border-bottom: none !important;
    }

    .region-primary-menu .menu-item a {
        display: block;
        color: #FFF !important;

    }

    .region-primary-menu .menu-item {}

    .region-primary-menu .menu li ul {
        padding: 0 0 0 var(--grid-gap);
    }

    .region-primary-menu .menu-item ul .menu-item {
        width: 90%;
    }

    .bar {
        height: 5px;
        width: 100%;
        background-color: #FFF;
        display: block;
        border-radius: 5px;
        transition: 0.3s ease;
    }

    #bar1 {
        transform: translateY(-4px);
    }

    #bar3 {
        transform: translateY(4px);
    }

    .change {
        display: block;
    }

    .change .bar {
        background-color: #FFF;
    }

    .change #bar1 {
        transform: translateY(4px) rotateZ(-45deg);
    }

    .change #bar2 {
        opacity: 0;
    }

    .change #bar3 {
        transform: translateY(-6px) rotateZ(45deg);
    }

    .change-bg {
        width: 100%;
        height: 88vh !important;
    }

}

@media (min-width: 770px) {
    .region-primary-menu .navigation2 {
        position: absolute;
        top: 2em;
        right: 1em;
        width: 100%;
        z-index: 999999;
    }

    .region-primary-menu .menu a {
        display: block;
        padding: 0 var(--grid-gap);
        color: var(--neutral-color-01);
        line-height: 50px;
        text-decoration: none;
    }

    .menu a:hover {
        font-weight: 400;
    }

    .region-primary-menu .menu ul {
        border: 1px solid var(--primary-color-01);
        box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
        background-color: var(--primary-color-01);
    }


    .region-primary-menu .menu ul ul li {
        position: relative;
        top: -60px;
        left: 170px;
    }

    .region-primary-menu .menu ul {
        display: none;
        position: absolute;
        z-index: 999;
        top: 50px;
    }

    .region-primary-menu .menu-item:hover>ul {
        display: inherit;
    }

    .region-primary-menu .menu-item>a:after {
        content: ' + ';
    }

    .region-primary-menu .menu-item>a:only-child:after {
        content: ' ';
    }

}

header section div {
    padding: 0 !important;
}