/* 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;
	padding: 0;
	margin: 0;
	line-height: 1.25;
}

div.listColumn ul li a:not(:hover):not(:focus)
{
	color: inherit;
}

div.listColumn > ul > li > a:not(:hover):not(:focus)
{
	color: var(--darkblue);
}

div.listColumn > ul > li > a
{
	font-weight: 600;	
}

div.listColumn > ul > li
{
	padding-left: 33px;
	margin-bottom: 25px;
	font-size: 21px;
}

div.listColumn ul.hierList li
{
	margin: 0.75em 0 0 0;
	font-weight: normal;
}

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;
	top: 0;
	display: block;
	padding: 0px;
	border: 0px;
	cursor: pointer;
	background: none;
	text-align: center;
	font-size: 26px;
	font-weight: 600;
	/*color: var(--cyan);*/ /*failed ada*/
	color: var(--teal);
}

div.listColumn.areaToggle .areaExpand span
{
	position: relative;
	display: block;
	width: 20px;
	height: 20px;
	line-height: 1;
}

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

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


#practiceSearch
{
	max-width: 547px;
	margin-bottom: 50px;
	position: relative;
}


#practiceSearch form  > div
{
	display: block;
}

#practiceSearch form > div > div
{
	width: 100%;
	position: static;
}

#practiceSearch button
{
	position: absolute;
	top: 8px;
	right: 0px;
	border: none;
	background: none;
}

#practiceSearch button svg
{
	fill: var(--darkcyan);
}

#practiceSearch input[type=text]
{
	padding-left: 10px;
	padding-right: 40px;
	border: none;
	border-bottom: 1px solid var(--darkcyan);
}

#practiceSearch form > div > div:not(.hasFocus) label
{
	padding-left: 0;
	text-transform: uppercase;
	color: var(--darkblue);
	font-size: 20px;
	letter-spacing: 1.5px;
}


#tabLinks a
{
	padding: 14px 32px;
	border: 1px solid var(--teal);
	color: var(--darkblue);
	font-weight: 400;
	line-height: 1;
}

#tabLinks a.current
{
	border: 1px solid var(--teal);
}

#tabLinks a:is(:hover, :focus)
{
	color: #ffffff;
	background: var(--teal);
}





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

	div.listColumn
	{
		width: calc(50% - 60px);
	}

	#searchResults div.listColumn
	{
		width: 100%;
	}


	/*div.listColumn:first-child,
	div.listColumn:nth-child(2)
	{
		width: calc(28% - 60px);
	}*/
}

@media (min-width: 1024px)
{

	#tabLinks
	{
		margin-bottom: 50px;
	}

	#tabLinks a:not(:last-child)
	{
		margin-right: 24px;
	}


}

@media (min-width: 1280px)
{
	div.listColumn
	{
		width: calc(28% - 60px);
	}

	#listColumnWrapper
	{
		gap: 120px;
	}
}

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