Clarkson Template: Center Navigation Bar and Logo

Hello,

I am customizing the Clarkson Template and I would like to center the logo and navigation bar, positioning the navigation bar under the logo, on both mobile and desktop versions. The codes that I have found here are not working for me.

The site is not yet published so I am attaching a screenshot.

Thanks!

The Clarkson template is Squarespace 7.1, you don't need any code, just to change the desktop header layout in the header settings.

https://support.squarespace.com/hc/en-us/articles/360000667707-Building-a-site-header

Hi Ziggy, thanks for your quick response.

I used the navigation settings and it is all centered now, except the social media links, which appear to the left. Ideally, the should appear next to the last navigation item (in this case, "CONTACT US"). Please see screenshot attached. 

Thanks!

Can you add and share a site wide password and the website URL so I can provide you with some code that should help with this?

https://support.squarespace.com/hc/en-us/articles/205815528-Site-wide-passwords

Website URL= https://quillfish-nectarine-3wnc.squarespace.com/
Psw= atp2023!

Thank you!

Try this for size, it doesn't do exactly what you want, but I couldn't immediately see a way to have the navigation and social elements next to each other.

.header-display-desktop {
  flex-direction: column-reverse;
}
.header-layout-branding-center-nav-center .header-title-nav-wrapper {
  flex: 0 0 100    margin-left: 0;
  margin-left: 0;
}
.header-layout-branding-center-nav-center .header-actions--left {
    flex: 0 1 100%;
    max-width: 100%;
    margin-top: 2vw;
}

An alternative may be to add the social icons to the navigation via links, this guide should help:
https://christyprice.com/blog/how-to-add-social-media-icons-to-squarespace-navigation