typeandcolour

Thank you! I ended up tweaking a bit, but it worked!

@media screen and (max-width: 1200px) {
    [data-nc-base="mobile-bar"] {
        display: block !important;
    }
.Header-nav--primary {
    display: none !important;
  }
  .Header--top {
    display: none !important;
  }
}

Hi there! Apologies if this question has been asked before, I couldn't seem to find the answer to my question.

I have my primary navigation position at bottom centre, so it sits on top of the banner images on the website. I have the link spacing at about 2.0em as I want them spaced out.

However, the weird little breakpoint between phone and desktop, which I believe to be tablet sizing (?), makes the navigation items stacked, and it looks awful. What I would like to do is to force it to switch to the mobile view/hamburger menu.

I know that there is a lot of CSS out there to force a hamburger menu globally, but I would just like it for mobile, tablet portrait and landscape.

I'm using Brine.

Thank you so much!