CSS help to centre logo and menu on mobile (brine)

Site URL: https://norman-header-test.squarespace.com/

Hi Brains!

I have hit a wall - I'm trying to mimic the desktop display on mobile:

So ideally the logo, then the hamburger, centered together. 

The problem is site styles automatically puts the menu on the left side when you center both elements. 

I also can't just force the desktop view on mobile because the menu is a folder on desktop so it creates too many extra clicks on mobile (so I'm using a normal primary nav on mobile and a secondary nav with a font awesome icon on desktop for the hamburger, and have hidden them from each other)

I feel like It's become waaaaaaay too complicated and at the end of the day I just need some CSS to switch the order on mobile of logo and menu. 

Images attached. 

pw is 'norman'

@ClaireWard The CSS below should do the trick leveraging the order CSS property. 

CSS

/* Place menu on the right of logo */
.Mobile-bar-menu {
  order: 2 !important;
}

Example 

Thank you so much! This worked perfectly 🙏🏻

I really appreciate you taking the time.