/* BEGIN BIO-LISTING CSS ----------------------------------------> */

#content
{
	max-width: 1605px;
}

h3
{
	margin-top: 3em;
	margin-bottom: 0em;
	border-top: 1px solid #D1D1D1;
	font-weight: 400;
	font-style: italic;
	text-align: center;
}

#bioSearch
{
	display: flex;
	justify-content: space-between;
	align-items: flex-start; /* flex-end; */
	flex-wrap: wrap;
	margin-bottom: 4em;
}

#bioSearch > div:first-child
{
	order: 1;
	width: 100%;
}

#bioSearch > div:last-child
{
	order: 2;
	width: 100%;
}

.letterLinks
{
	display: flex;
	justify-content: center;
	align-items: center;
	flex-wrap: wrap;
	column-gap: 10px;
	row-gap: 20px;
	margin-bottom: 2em;
	padding: 10px 0px;
	box-sizing: border-box;
	color: #999;
	line-height: 1;
}

.letterLinks a,
.letterLinks span
{
	display: inline-flex;
	justify-content: center;
	align-items: center;
	width: 46px;
	height: 46px;
	background: var(--extra-light-blue);
	border-radius: 46px;
	font-weight: 700;
	text-align: center;
	line-height: 1;
}

.letterLinks a:is(:hover,:focus)
{
	background: var(--dark-blue);
	color: #fff;
}

h2.itemMatches
{
	border-bottom: 1px solid #D1D1D1;
}

@media (min-width: 1070px)
{
	.letterLinks
	{
		margin-bottom: 0;
		padding: 10px max(3.5vw, 20px);
	}
	
	#bioSearch > div:first-child
	{
		order: 2;
		width: 33.33%;
	}
	
	#bioSearch > div:last-child
	{
		order: 1;
		width: 66.66%;
	}
}

@media (max-width: 1649px)
{
	form > div > div.submit_wrapper
	{
		grid-column: 1 / -1; 
	}
}

.ajaxBioList
{
	display: none;
}

/* END BIO-LISTING CSS ------------------------------------------> */