Snippet: Evenly Spaced out Menu items for Centered Logo Header Style Five

/* Turn menu into a flex element */
.navbar-style-five .dropdown-menu { display: flex; width: 100%; align-items: center; }

.header-five #site-navigation .dropdown-menu > li.menu-item,
.header-five #site-navigation .dropdown-menu > li.menu-item-logo { display: inline-flex; flex-grow: 1; -ms-flex-preferred-size: 0; flex-basis: 0; }

/* Make sure any very long links inside the menu break onto a new line */
.navbar-style-five .dropdown-menu > li.menu-item > a > span { word-wrap: break-word; white-space: normal; }

/* This is used to center the logo */
#site-logo.header-five-logo.display { display: inline-flex !important; }