/*************************************************************
 Styling for two select boxes associated with a list of items:

 1) The first has possible sort orders for the list.
 2) The second has a list of items. When an item is selected,
    the page scrolls to that item.

	<div class="list-nav">
		<select class="list-nav-sorting">
			<option value="">...</option>
			<option value="">...</option>
			...
		</select>
		<select class="list-nav-jump-to">
			<option value="">...</option>
			<option value="">...</option>
			<option value="">...</option>
			...
		</select>
	</div>
*************************************************************/

.list-nav {
	width: 100%;
	display:flex;
	flex-wrap: nowrap;
	justify-content: flex-start;
	align-items: center;
	margin: 40px 0px 0px 0px;
}

h1 + .list-nav + * {
	margin-top: 40px;
}

.list-nav-sorting {
	width: 27%;
	margin-right: 10px;
}

.list-nav-jump-to {
	width: 70%;
	max-width: 70%;
}