NavBar and Header Push Up

I have a design and i am having issues with webflow trying to get this feature working.

Here is the link to the design

What i want to happen is when you start to scroll down the page the top orange bar will push up and the main navbar will also push up.

I can sort of get it working but the issue is i cant get it to work so that if you scroll say only 50px down the page the function will work.

THe reason i want it to happen when you scroll only 50px down the page is that on the inner pages eg click on the contact link in the nav there isnt much content and i want this function to be the same on all pages in the site.

But i dont want it to happen on mobile devices only desktop because on mobile devices the orange bar is set not to display and the main nav is ok on mobile devices.

I hope someone can help me urgently.