Hello,

You could decrease the menu items padding/margin in General Options > Header Options > Menu Options > Menu Items padding/margin, until the menu width is smaller than the header in this width and can be contained by header. Or add this code into your custom css box:

@media (max-width: 1024px){
.mobile_small_menu {
    display: block;
    left: 85%;
}
header#header #navigation {display: none;}
}

It will display the responsive menu when that width is reached.

Best regards!

Hello,

I see the menu is showing up ok in ipad landscape, screenshot. If you are not seeing this, please clear cache and refresh page. You can decrease the space between menu items even further by adding this code into your custom css box:

@media (max-width: 1100px) and (min-width: 981px){
.header_1 nav .menu > li {
    margin-left: -5px;
    margin-right: -5px;
}}

Best regards!