Hi there,

You can change the order of the menu (and submenu) items under Appearance -> Menus by selecting the "Main Navigation" from the dropdown menu.

Then you can change the order by dragging the menu item to another position. Make sure to save the settings at the bottom of the page after making any change.

I see, thank you for adding the screenshot.

This is possible with a bit of custom CSS code. Please add the following CSS to Appearance -> Customize -> Additional CSS:

/* Change header navigation height */
@media (min-width: 992px) {
    .header .header-wrapper .header-logo,
    .header .header-wrapper .header-logo img {
        height: 100px;
    }
    .main-navigation > li > a {
        padding-top: 35px;
        padding-bottom: 35px;
    }
    .main-navigation .sub-menu {
        top: 64%;
    } 
}

I've already decreased the height a bit in the above code but if you would like to decrease it further you can change the 100px and both 35px values more.

Also the position of the submenu is already adjusted but you can change the 64% value to your own needs.

Hope this helps.

You're welcome!