#main-nav {
    background-color: #736259;
}

.menu-col.col-menu-1 {
    --menu-width: 39%;
    background-color: var(--ast-global-color-1);

}

.menu-hauptmenu-container {
    height: 100%;
    width: var(--menu-width);
}

@media (min-width: 1025px) {

    #menu-hauptmenue-en>.menu-item,
    #menu-hauptmenue>.menu-item {
        max-height: 100vh;
        display: flex;
        justify-content: flex-end;
        padding-right: max(min(106px, 9vw), 40px);
    }

    #menu-wrapper ul:not(.sub-menu)>.menu-item.current_page_item {
        color: #fff;
    }

    #menu-wrapper ul.sub-menu {
        max-height: 0;
        transition: all .6s ease-in-out 0s;
        overflow: hidden;
        transition-delay: .5s, .5s;
        transition-property: transform, max-height;
        position: absolute;
        right: 0;
        transform: translateX(100%) translateY(-50%);
        top: 50%;
    }

    #menu-wrapper .imp-sub-active ul.sub-menu {
        max-height: 100%;
        transition-property: transform, max-height;
    }
}

@media (max-width: 1024px) {

    #nav-wrapper {
        bottom: 0;
        top: 0;
        background-color: var(--color-2);
    }

    #main-nav {
        height: 100dvh;
    }

    .menu-col.col-menu-1 {
        --menu-width: 100%;
    }

    .menu-col.col-menu-1 {
        flex-direction: column;
    }

    #menu-hauptmenue-en,
    #menu-hauptmenue {
        height: 100%;
        display: flex;
        flex-direction: column;
    }

    .menu-hauptmenu-container {
        height: auto;
    }

    #menu-wrapper .menu-item .imp-nav-target {
        padding-left: 5vw;
    }

    #menu-wrapper ul:not(.sub-menu)>.menu-item>a .imp-nav-target {
        font-size: 27px;
        line-height: 3.15;
    }

    #menu-wrapper ul.sub-menu #menu-wrapper ul.sub-menu {
        max-height: 0;
    }

    .sub-menu>.menu-item:first-child {
        padding-top: 1.7em;
    }

    .sub-menu .imp-nav-target {
        font-size: 16px;
    }

    #menu-wrapper ul.sub-menu {
        max-height: 0;
    }

    #menu-hauptmenue-en.menu-child-sub-active>.menu-item:not(.imp-sub-active),
    #menu-hauptmenue.menu-child-sub-active>.menu-item:not(.imp-sub-active) {
        max-height: 0;
        transform: translateX(-100%);
        transition-delay: 0s;
    }

    #menu-hauptmenue-en>.menu-item,
    #menu-hauptmenue>.menu-item {
        max-height: 100vw;
        transition: all .5s cubic-bezier(.46, .03, .52, .96) 0s;
        transition-delay: .6s;
        overflow: hidden;
        border-bottom: 1px solid #7a7a5b;
    }

    #menu-wrapper .imp-sub-active .sub-menu {
        max-height: 100vh;
        transition-delay: 0.6s;
        overflow: hidden;
    }

    #menu-hauptmenue-en>.menu-item.menu-item-has-children>a::after,
    #menu-hauptmenue>.menu-item.menu-item-has-children>a::after {
        transition: all .5s ease 0s;
    }

    #menu-hauptmenue-en>.menu-item.menu-item-has-children.imp-sub-active>a::after,
    #menu-hauptmenue>.menu-item.menu-item-has-children.imp-sub-active>a::after {
        rotate: 90deg;
    }

    #menu-hauptmenue-en.menu-child-sub-active>.menu-item:not(.imp-sub-active),
    #menu-hauptmenue.menu-child-sub-active>.menu-item:not(.imp-sub-active) {
        max-height: 0;
    }

    #menu-wrapper ul.sub-menu {
        position: absolute;
        width: 100%;
        transition: all .5s cubic-bezier(.46, .03, .52, .96);
        height: 100%;
        justify-content: flex-start;
        padding-left: 0;
        padding-right: 0;
    }

    .menu-col.col-menu-1 {
        flex-direction: column;
        justify-content: flex-start;
        padding-top: calc(var(--nav-icon-padding-Y) + var(--nav-icon-height) + 10vh);
    }



}

@media (max-width: 576px) {
    #menu-wrapper ul:not(.sub-menu)>.menu-item>a .imp-nav-target {
        font-size: 20px;
    }

    .sub-menu .imp-nav-target {
        font-size: 14px;
    }

    #menu-wrapper .menu-item .imp-nav-target {
        padding-left: 8vw;
    }


}