Sticky Nav issues on Logo Centered Header/Navigation

Hi there,

I am trying to add a sticky header to the site attached below.
But I cannot seem to add it without the menu items switching back to being left side of the logo.
There also seems to be issues with the width of the logo - it appears to be very narrow.

I am not sure why this is happening as I have used the same method on a previous site,.
But I have tried so many combinations I cannot see what is wrong now.

I have sent an admin login to your support email so you can login and see.: wordpress@generatepress.com

the css I am using is:

.navigation-branding, .site-logo, .sticky-navigation-logo {
    position: absolute;
    top: 10px;
    left: 50%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    z-index: 200;
}

Any input you have to help me fix this would be great!
Cheers
John