excellent, thank you!

works like a charm! thank you

Thanks Elliott,

I really appreciate the efforts but it simply doesn’t work…
Working with 1280px displays crops the logo. An all other large desktop displays the logo aligns left out of the page borders and on mobile phone displays the logo is too small and aligns too high. I have deleted all the code except this:
#mobile-advanced li > a:before, .html_header_mobile_behavior #mobile-advanced span > a:before, #mobile-advanced .mega_menu_title:before {
margin-right: -10px;
transform: rotate(180deg);
-moz-transform: rotate(180deg);
-webkit-transform: rotate(180deg);
}
Maybe it would be easier just to go with Yigit’s suggestion and align logo to right and menu to left?

Yaron

Thanks Yigit,

Tried it but the logo is still cropped….
The added code causes the logo to lose alignment and go up a couple of pixels.
I am using a custom header of 80px with a 340x80px logo. I have also edited the avia.js to get a more controlled header (https://kriesi.at/support/topic/controling-the-size-of-shrinking-header/). I tried resetting all the values to see if this is the reason but still no luck
You can see the result here
Thanks,
Yaron

Thanks Yigit!

The code fixes half of the issue. The menu arrow icons are now aligned but the logo still over laps with the menu icon
I would like to align the logo left and live the menu icon on the right side (in mobile)
By the way, is there any way to disable the arrow icons on the mobile menu completely?
Mary Christmas!

Yaron