/* BEGIN AREA-LISTING CSS ---------------------------------------> */


div#listColumnWrapper
{
	position: relative;
}

div.listColumn
{
	position: relative;
	width: 100%;
}

div.listColumn ul,
div.listColumn ul li
{
	position: relative;
	list-style: none;
	list-style-image: none;
	margin: 0;
	padding: 0;
	line-height: normal;
}

div.listColumn ul li
{
	font-weight: 300;
	font-size: 19px;
}

div.listColumn > ul > li
{
	/*padding-left: 30px;*/ /*per jessica*/
	margin-bottom: 24px;
}

div.listColumn > ul > li > a 
{
	display: block;
}

div.listColumn > ul > li > .title 
{
	cursor: pointer;
}

div.listColumn > ul > li > .title > a 
{
	color: var(--warm-gray); /* changed per jessica */
}

div.listColumn > ul > li > .title > a:is(:hover,:focus)
{
	color: var(--dark-blue); /* changed per jessica */
}

div.listColumn ul.hierList li
{
	margin: 14px 0 0 0;
}

div.listColumn li li
{
	padding-left: 1em;
}

div.listColumn.areaToggle > ul > li > ul.hierList
{
	display: none;
}

div.listColumn.areaToggle .areaExpand
{
	position: absolute;
	left: 0;
	top: -4px;
	display: inline-block;
	width: 24px;
	height: 24px;
	margin: 2px 0 0 5px;
	padding: 0px;
	border: 0px;
	background: none;
	cursor: pointer;
	text-align: center;
	vertical-align: top;
}

div.listColumn.areaToggle .areaExpand span
{
	position: relative;
	display: block;
	width: 20px;
	height: 20px;
	line-height: 1;
	font-size: 20px;
	color: var(--medium-blue);
}

div.listColumn.areaToggle .areaExpand:not(.expanded) span:last-child
{
	display: none;
}

div.listColumn.areaToggle .areaExpand.expanded span:first-child
{
	display: none;
}

li.areaOverviewLink
{
	font-weight: 700 !important;
}

#practiceSearch
{
	display: flex;
	flex-wrap: wrap;
	/*margin-bottom: 0 !important;*/
	position: relative;
}

#subContent #practiceSearch  div.search_form 
{
	margin-bottom: 0;
}

#practiceSearch form
{
	position: relative;
	flex: 1 1 800px;
}

#practiceSearch form  > div
{
	display: block;
}

#practiceSearch form > div > div
{
	width: 100%;
	position: static;
	margin-bottom: 0;
}

#practiceSearch form > div > div > label
{
	padding-top: 0;
	padding-left: 48px;
	font-family: 'DM Serif Display';
	text-transform: unset;
	color: var(--maindark);
	font-size: 20px;
}

#practiceSearch button 
{
	position: absolute;
	top: 5px;
	background: none;
	border: none;
	width: 26px;
	box-sizing: content-box;
}

#practiceSearch button svg 
{
	display: block;
	width: 100%;
	height: auto;
	fill: var(--medium-blue);
}

#practiceSearch input[type=text]
{
	padding-left: 50px;
}

#practiceSearch form > div > div.hasFocus > label
{
	font-size: 0.6rem;
}

#services h2.visibleSectionTitle
{
	display: none;
}

ul#areaFilterList,
ul#areaFilterList li
{
	list-style: none;
	margin: 0;
}

ul#areaFilterList
{
	margin-bottom: 40px;
}

ul#areaFilterList li
{
	margin-bottom: 9px;
}

#areaFilterList a 
{
	display: block;
	padding: 20px;
	background: #F4F4F4;
	line-height: 1;
	color: #726969;
	text-align: center;
	text-transform: uppercase;
	letter-spacing: 1.5px;
	font-size: 17px;
}

ul#areaFilterList li a.here,
ul#areaFilterList li a:is(:hover,:focus)
{
	color: #ffffff;
	/* background: var(--medium-blue); */
	background: #3B2B3A;
}

@media (min-width: 768px)
{
	#listColumnWrapper
	{
		display: flex;
		gap: 20px;
	}

	div.listColumn
	{
		width: 50%;
	}
}

@media (min-width: 920px)
{

	body.columnedContent #mainContentWrapper
	{
		display: flex;
		flex-direction: row-reverse;
		justify-content: space-between;
	}

	body.columnedContent #mainContent:not(:only-child)
	{
		margin-right: 0;
	}

	body.columnedContent #subContent:not(:only-child)
	{
		margin-right: 80px;
	}

}

@media (min-width: 1024px)
{
	#practiceSearch form > div > div > label
	{
		font-size: 24px;
	}

	#practiceSearch button
	{
		top: 8px;
	}
}


@media (max-width: 919px)
{
	
	#mainContentWrapper
	{
		display: flex;
		flex-direction: column-reverse;
	}
}


/* END AREA-LISTING CSS -----------------------------------------> */
