Within WordPress Beaver builder plugin I have a menu with:

• 4 menu items that are customized to display as buttons with css class
  in appearance>customize>additional CSS (these buttons are events
  that will be removed/added based on event times)

• 6 menu items that are the main navigation

All items are in the same menu structure and collapse into a hamburger icon and have a custom breaking point.

Currently both the 4 button menu items and the 6 menu items sit on the same line with half of the 6 menu items falling into a second line.

Is it possible to set all 6 menu items in a row below the 4 buttons and triggering the hamburger icon when they fall into a 3rd line?
example of what I’m trying to create