Expand width of primary navigation in Brine template

Hello! I hate that this centered navigation overlaps on smaller screens (such as my laptop). I searched for solutions but nothing worked.

Using the Brine template here. Primary Nav position is Top Center.

gregghill.com

Thank you!

12 hours ago, Ziggy said:

The problem you've got is that this header layout, is that it puts the header into 3 even columns which on a smaller screen constrains the navigation to one third.

 

 

We can tweak that with Custom CSS, this may not be perfect, but worth a shot!

.Header-nav {
    position: absolute;
    margin-top: clamp(120px, 18vw, 250px);
}

 

Brilliant! Thank you! I knew the header was split into thirds, but didn't know how to adjust that.