Moving navigation bar under title (when both logo and title are displayed)

Site URL: https://www.ellievsbear.com/

Hello, I would like to use custom CSS to display both my logo and title on the left of the header. 
I managed to do that before, but when both the logo and title are displayed it moves the navigation bar to the side of the title.

If possible, I would like to know how to place the navigation under the title as shown in the image here, please.

The website is on Squarespace 7.0 - Brine

Any help would be greatly appreciated!

Add to Design > Custom CSS

nav.Header-nav.Header-nav--primary:before {
    content: "Squarespace";
    color: brown;
    position: relative;
    display: block;
    top: -20px;
    font-size: 30px;
}

6 hours ago, tuanphan said:

Add to Design > Custom CSS

nav.Header-nav.Header-nav--primary:before {
    content: "Squarespace";
    color: brown;
    position: relative;
    display: block;
    top: -20px;
    font-size: 30px;
}

 

It worked like a charm, thank you so much!

Is there any way to keep the title showing next to the logo on mobile view?

5 minutes ago, ellievsbear said:

It worked like a charm, thank you so much!

Is there any way to keep the title showing next to the logo on mobile view?

Use this code for mobile

a.Mobile-bar-branding:after {
    content: "Squarespace";
    color: brown;
    position: relative;
    display: block;
    font-size: 24px;
    margin-left: 20px;
}
a.Mobile-bar-branding {
    display: flex;
    align-items: center;
}

You're amazing!
Thanks for your quick help