Vantage weird sticky menu behavior

Hello,

I posted this on SiteOrigin support site, but my thread is still waiting approval, so I thought I’d try my luck here ??

I customized the theme a bit, using a child theme.

I’m using an in-menu logo in the header, which I centered and positioned above the main menu (which is also centered).

The problem I’m having (OS X 10.11.3 with Safari 9.0.3) is that there is a second menu behind the sticky one when I’m at the top of the page.

As soon as I scroll the page down (even just a little bit), the second menu disappears, but the whole page (including the header) makes a few jumps before the page scrolls and the header stays sticky. After this, it all stays sticky unless I scroll to the very top of the page, in which case the above behavior returns.

On mobile (iOS 9), the sticky menu acts weird also. While I slide the page up, the header gets replaced by a white box and as soon as I release the touch screen, the header appears where it should be and remains sticky (unless I scroll to the top of the page, just like on Safari).

I tried the css code below, given in a similar thread, but that replaced the whole header with a white box.

nav:nth-of-type(1) { display: none; }

.site-navigation.sticky { width: 100% !important; }

The “jumping” of the page the worst on the home page, where there is the least content.

Here is my demo site:
wp-test.soulmode.eu

Thank you in advance for your help!