/* BEGIN BIO-DETAIL CSS -----------------------------------------> */

#mainContent 
{
	max-width: var(--narrow-width);
	margin-left: auto;
	margin-right: auto;
}

#upperContent
{
	padding-top: 150px;
	margin-bottom: 35px; /* reduced per Leighana */
	/* margin-bottom: 65px; */
	background: var(--Navy);
	color: #ffffff;
}


#bioPhoto img 
{
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: left center;
	transform: scale(1.3);
	animation: image_scaler 1.5s forwards cubic-bezier(.075, .82, .165, 1);
	animation-delay: 500ms;
}

#bioPhoto picture
{
	display: block;
	overflow: hidden;
	width: 0%;
	height: 100%;
	animation: image_revealer 1.5s forwards cubic-bezier(.075, .82, .165, 1);
	animation-delay: 500ms;
}

@keyframes image_revealer 
{
	0% { width: 0%; }
	100% { width: 100%; }
}

@keyframes image_scaler
{
	0% { transform: scale(1.3); }
	100% { transform: scale(1); }
}

@keyframes text_revealer 
{
	0% 
	{ 
		transform: translateY(-40px); 
		opacity: 0;
	}
	100% 
	{ 
		transform: translateY(0); 
		opacity: 1;
	}
}

#bioPhoto
{
	position: relative;
	max-width: 585px;
	margin: 0 auto;
	margin-bottom: 20px;
	aspect-ratio: 419/307;
}

h1#pageTitle
{
	margin: 0 0 11px;
	color: inherit;
	--max-font-size: 54;
	line-height: 1.18;
	opacity: 0;

	animation: text_revealer .5s forwards ease-in-out;
	animation-delay: 1000ms;
}

#bioTitle 
{
	text-transform: uppercase;
	letter-spacing: 1.6px;
	color: var(--Teal);
	opacity: 0;
	animation: text_revealer .5s forwards ease-in-out;
	animation-delay: 1200ms;
}

#bioAltTitle
{
	color: var(--Teal);
	--max-font-size: 18;
	font-style: italic;
	opacity: 0;
	animation: text_revealer .5s forwards ease-in-out;
	animation-delay: 1400ms;
}


#bioOffices,
#bioOffices li,
#bioContact,
#bioContact li,
#bioAccessories,
#bioAccessories li
{
	overflow: hidden;
	margin: 0;
	list-style: none;
	/* color: var(--Pale-Gray); */
	--max-font-size: 19;
	opacity: 0;
	animation: text_revealer .5s forwards ease-in-out;
	animation-delay: 1600ms;
}

#contactperson p,
#officeAddress
{
	/* color: var(--Pale-Gray); */
	font-weight: 300;
	--max-font-size: 19;
	opacity: 0;
	animation: text_revealer .5s forwards ease-in-out;
	animation-delay: 1800ms;
}

#contactperson
{
	margin-top: 25px;
}


#bioOffices li,
#bioContact li,
#bioAccessories li
{
	float: left;
}

#bioOffices li:not(:last-child)::after,
#bioContact li:not(:last-child)::after
{
	content: '|';
	margin: 0 10px;
	color: var(--Pale-Gray);
}

#bioOffices a:not(:hover):not(:focus),
#bioContact a:not(:hover):not(:focus),
#legalAssistant a:not(:hover):not(:focus),
#contactperson p a:not(:hover):not(:focus)
{
	color: inherit;
}

#contactperson p a
{
	background: none;
	/* text-decoration: underline;
	text-underline-offset: 3px; */
}

#contactperson p a:is(:hover, :focus)
{
	color: var(--Deep-Teal);
}

#contactperson p a[href^="tel:"]
{
	white-space: nowrap;
}

#bioAccessories
{
	margin: 20px 0 !important;
}

#bioAccessories li 
{
	margin-right: 12px;
}

#bioAccessories.pageTools .svgInnards
{
	/* fill: #ffffff; */
	fill: var(--Teal);
}

#legalAssistant
{
	overflow: hidden;
}

#legalAssistant .legalassistant
{
	float: left;
	margin-right: 10px;
}

#legalAssistant .title 
{
	font-size: inherit;
}

#bioIntro 
{
	position: relative;
	z-index: 10;
	padding: 19px 0;
	margin-top: 40px;
	font-weight: 300;
}

#bioIntro p
{
	font-weight: inherit;
	--max-font-size: 19;
}


#bioIntro::before 
{
	background: var(--Reverse-Gradient);
}

#bioExtras
{
	margin: 25px 0 38px;
}

#bioExtras > *
{
	margin-top: 8px;
	--max-font-size: 19;
}

#matterSpotlight
{
	margin-bottom: 30px;
}

#matterSpotlight .results_list,
#matterSpotlight li
{
	margin: 0;
	list-style: none;
}


#matterSpotlight li > a,
#matterSpotlight li:not(:has(a))
{
	position: relative;
	display: block;
	padding: 30px;
	box-sizing: border-box;
	color: #ffffff;
	min-height: 200px;
}

#matterSpotlight .image
{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

#matterSpotlight .image::after 
{
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	display: block;
	width: 100%;
	height: 100%;
	background: rgba(0, 43, 73, 0.71);
}

#matterSpotlight .image img 
{
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

#matterSpotlight .title,
#matterSpotlight .section,
#matterSpotlight .introtitle
{
	position: relative;
	z-index: 10;
}

#matterSpotlight .title 
{
	font-weight: 300;
	--max-font-size: 22;
}

/* #matterSpotlight .section */ 
#matterSpotlight .introtitle
{
	text-transform: uppercase;
	letter-spacing: 1.44px;
	--max-font-size: 18;
	font-weight: 500;
	color: var(--Pale-Teal);
}

#bioIntro > picture > img,
#mapImage
{
	position: absolute;
	top: 0;
	left: calc(50% - 50vw);
	width: 100vw;
	height: 100%;
	object-fit: cover;
}

#mapImage img 
{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

#officeAddress
{
	margin-bottom: 0;
}

#bio_clerkships ul li,
#bio_bars ul li,
#bio_language ul li
{
	margin-left: 0;
	list-style: none;
}

#mapImage::before 
{
	position: absolute;
	top: 0;
	left: 0;
	z-index: 10;
	content: '';
	display: block;
	width: 100%;
	height: 100%;
	opacity: 0.25;
	background: linear-gradient(77deg, #10C1B3 3.73%, #214292 79.83%);
}

@media (min-width: 768px)
{

	#upperContent
	{
		margin-bottom: 65px;
	}

	#bioInfoWrapper
	{
		display: flex;
		justify-content: space-between;
		align-items: flex-start;
	}

	#bioPhoto
	{
		position: relative;
		z-index: 20;
		flex: 0 1 585px;
	}

	#bioInfo
	{
		flex: 0 1 660px;
		margin-left: 30px;
	}

	#bioIntro::before,
	#bioIntro > picture > img,
	#mapImage
	{
		width: calc(100vw + 350px);
		left: calc((50% - 50vw) - 350px);
	}

	body.contact-item #bioIntro 
	{
		padding: 0;
		height: 187px;
	}

	#bioExtras
	{
		position: relative;
		padding-right: 70px;
		box-sizing: border-box;
		min-height: 100px;
	}

	#bioIntro
	{
		min-height: 150px;
	}

	#bioAccessories
	{
		position: absolute;
		bottom: 0;
		right: 0;
		margin: 0 !important;
	}

	#bioAccessories li 
	{
		float: none;
	}

	#matterSpotlight li > a,
	#matterSpotlight li:not(:has(a))
	{
		padding: 48px 64px 32px;
	}
}

@media (min-width: 1350px)
{
	#bioAccessories
	{
		right: -50px;
	}

	#upperContent 
	{
		padding-top: 190px;
	}

	#matterSpotlight li > a,
	#matterSpotlight li:not(:has(a)) 
	{
		min-height: 310px;
	}
}


.badgeList img
{
	max-width: 200px;
	max-height: 120px;
}

.badgeList ul,
.badgeList ul li
{
	list-style: none;
	display: block;
	margin: 0;
	padding: 0;
}

.badgeList ul li
{
	display: inline-block;
	margin-right: 20px;
}

#fixedHeader
{
	visibility: hidden;
	opacity: 0;
	transition: all 250ms ease;
	display: none;
}

@media (min-height: 600px) and (min-width: 768px)
{

	#fixedHeader
	{
		display: block;
	}

	body.scrolled #fixedHeader
	{
		visibility: visible;
		opacity: 1;
	}

	#fixedHeader
	{
		position: fixed;
		z-index: 1000;
		top: 84px;
		left: 0;
		width: 100%;
		background: #ffffff;
		box-shadow: 3px 3px 5px rgba(0,0,0,0.5);
	}

	#fixedHeader .aligner
	{
		display: flex;
		padding: 20px;
		max-width: var(--standard-width);
		margin: 0 auto;
		box-sizing: border-box;
	}

	#fixedHeader img 
	{
		display: block;
		width: 150px;
		height: auto;
	}

	#fixedHeader a:not(:hover):not(:focus)
	{
		color: inherit;
	}

	#fixedHeader .content 
	{
		margin-left: 20px;
	}

	#fixedHeader .title 
	{
		font-size: 24px;
		font-weight: 600;
	}
}


/* END BIO-DETAIL CSS -------------------------------------------> */