/**
 * Desktop primary nav: all top-level items (including Rooibos) on one row.
 */
@media screen and (min-width: 768px) {
	.storefront-primary-navigation {
		width: 100%;
	}

	.main-navigation ul.menu,
	.main-navigation ul.nav-menu {
		display: flex;
		flex-wrap: nowrap;
		align-items: center;
		justify-content: space-between;
		width: 100%;
		margin: 0;
	}

	.main-navigation ul.menu > li,
	.main-navigation ul.nav-menu > li {
		float: none;
		display: block;
		flex: 0 1 auto;
		margin: 0;
		white-space: nowrap;
	}

	.main-navigation ul.menu > li > a,
	.main-navigation ul.nav-menu > li > a {
		padding-left: 0.4em;
		padding-right: 0.4em;
		font-size: 0.92em;
		letter-spacing: -0.01em;
	}

	.main-navigation ul.menu > li:first-child > a,
	.main-navigation ul.nav-menu > li:first-child > a {
		padding-left: 0;
	}

	.main-navigation ul.menu > li:last-child > a,
	.main-navigation ul.nav-menu > li:last-child > a {
		padding-right: 0;
	}

	/* Dropdowns stay stacked, not in the flex row. */
	.main-navigation ul.menu > li > ul,
	.main-navigation ul.nav-menu > li > ul {
		white-space: normal;
	}
}

@media screen and (min-width: 768px) and (max-width: 1100px) {
	.main-navigation ul.menu > li > a,
	.main-navigation ul.nav-menu > li > a {
		font-size: 0.8em;
		padding-left: 0.28em;
		padding-right: 0.28em;
	}
}