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



.letterLinks
{
	position: relative;
	/*margin: 10px 0 18px -9px;*/
	padding: 20px 0;
	margin: 0 0 0 -9px;
	/*color: #ffffff;*/
	font-weight: 500;
	font-size: 24px;
	background: var(--slateblue);
	color: #ffffff;
}

.letterLinks::before 
{
	width: 102vw;
}

.letterLinks::after
{
	/* make div stretch to height of content */
	content: '';
	display: block;
	clear: both;
}

.letterLinks a,
.letterLinks span
{
	display: inline-block;
	float: left;
	width: calc(100% / 15);
	text-align: center;
	color: inherit;
}

.letterLinks span
{
	color: #cecece;
}

.letterLinks a:is(:hover,:focus)
{
	color: var(--burntorange);
	border: none;
}

.letterLinks a.viewAll 
{
	outline: none !important;
}

.letterLinks > *:nth-child(12),
.letterLinks > *:last-child
{
	width: calc(100% / 13 - 1px);
}

#sortOptions
{
	letter-spacing: 1px;
	font-weight: 500;
	font-size: 18px;
	padding-right: 0;
}

#sortOptions button 
{
	padding: 0;
	margin-left: 10px;
	border: none;
	background: none;
	cursor: pointer;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 1px;
	color: var(--logogray);
}

#sortOptions button.toggled 
{
	border-bottom: 2px solid var(--burntorange);
}

.standardSearchForm + #sortOptions
{
	display: flex;
	justify-content: flex-end;
}

@media (min-width: 1024px)
{

	.letterLinks
	{
		position: absolute;
		top: -80px;
		width: 100%;
		z-index: 20;
		background: none;
		color: inherit;
	}

	body:not(.blackBannerItems) .letterLinks 
	{
		color: #ffffff;
	}

	.letterLinks a,
	.letterLinks span
	{
		width: calc(100% / 29);
	}

	.letterLinks a:hover,
	.letterLinks a:focus 
	{
		border: none;
	}

	.letterLinks > *:nth-child(12),
	.letterLinks > *:last-child
	{
		width: calc(100% / 26 - 1px);
	}

	/*.letterLinks a:is(:hover,:focus)
	{
		outline: 1px solid currentColor;
		border-radius: 50%;
	}*/

	.letterLinks span
	{
		color: #656565;
	}
}




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