Need Help! Navigation code

I'm using the Sophia Rey template and need to change nav menu from horizontal layout to vertical/stacked. Does anyone have code for this? See how current layout collides with logo.

Any info/comments are welcome! Thank you. 

Can you share link to your site? I tried check template demo but they uses a different nav structure

https://sofia-demo.squarespace.com/

Hi Tuan, 

Thanks for taking a look! Domain is https://elizabethkosichstyling.com/. Note mobile navigation is how I need desktop nav menu to function, screen shot of mobile attached and see desktop view above with original post.  Any help is greatly appreciated!

LMK?
Thanks!
Elizabeth

Hi Elizabeth, Please  use this code to Website > Website Tools > Custom CSS

.Header-nav {
    display: inline-block;
}
[data-nc-container="bottom-center"] {
    width: 100%;
}
[data-nc-container="bottom-left"] {
    text-align: center !important;
    display: block !important;
    position: absolute;
    margin-top: 140px;
    z-index: 999;
}

 

Hello Sam,

Thanks for this Sam, but it doesn't work! The code you provided changes nav menu to horizontal format that's centered across top of page, with logo changing to left justified. I'm attaching 2 screen shots so you can see this code's changes.

I'm looking for code that will 1.) keep logo centered and 2.) change nav menu from horizontal to vertical/stacked like how it currently functions on mobile (see my post to Tuan for screen shot of mobile view with nav menu stacked). Any chance you have code for these changes?

Thanks so much for jumping in here and helping!