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


#content
{
	margin: 0;
}

#bioPhoto
{
	position: relative;
	width: 100vw;
	left: calc(50% - 50vw);
}

#bioPhoto img
{
	position: relative;
	left: -75%;
	display: block;
	width: 175%;
	height: auto;
}

#bioPhoto.officePhoto
{
	height: 340px;
}

#bioPhoto.officePhoto img
{
	height: 100%;
	object-fit: cover;
}

body:not(.people-item) #bioPhoto::after
{
	content: '';
    position: absolute;
    z-index: 2;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #000000;
    opacity: .35;
}

.newsList .title,
.newsList .role,
.newsList .titleInfo
{
	--max-font-size: unset;
}


#bioInfo
{
	position: relative;
	padding: 40px;
	margin-bottom: 40px;
	background: rgba(223,228,237, 1);
	box-sizing: border-box;
}

#bioInfo p
{
	--max-font-size: 24;
	font-weight: 500;
}

#altAddress p
{
	--max-font-size: unset;
	font-weight: unset;
}

h1#pageTitle
{
	margin-top: 0;
	color: var(--darkblue);
}

#pageTitle > span:last-child
{
	font-weight: 700;
}

#bioTitleWrapper
{
	overflow: hidden;
	margin-top: 20px;
}

#bioTitleWrapper > div
{
	float: left;
}

#bioTitle
{
	--min-font-size: 18;
	--max-font-size: 22;
	margin-right: 37px;
	text-transform: uppercase;
	color: var(--coral);
	letter-spacing: 1px;
	line-height: 1;
}

#bioTitleWrapper .admissioninfo
{
	font-style: italic;
	--min-font-size: 18;
	--max-font-size: 21;
	/*line-height: 1;*/ /*this cuts of letter*/
}

#bioAccessories
{
	position: static;
	overflow: hidden;
}

#bioAccessories ul
{
	display: block;
}

#bioAccessories li
{
	float: left;
}

#bioAccessories li:not(:last-child)
{
	margin-right: 19px;
	margin-bottom: 19px;
}

#bioAccessories a
{
	width: max(36px,
	             min(52px, 36px + (52 - 36) * ((100vw - 600px) / (1400 - 600))
	));
}


#bioContact,
#bioContact li,
#bioAccessories,
#bioAccessories li
{
	list-style: none;
	margin: 0;
	padding: 0;
}

#bioOffice,
#bioOffice li
{
	margin: 0;
	list-style: none;
	overflow: hidden;
}

#bioOffice,
#officeAddressPhone
{
	margin: 30px 0;
}

#bioOffice li
{
	float: left;
	/*max-width: 190px;*/
}

#bioOffice li:not(:last-child)
{
	margin-right: 45px;
	margin-bottom: 10px;
}

#bioOffice .title
{
	color: var(--darkblue);
	--min-font-size: 19;
	--max-font-size: 22;
	margin: 0;
}

#bioOffice .title a:not(:hover):not(:focus)
{
	color: inherit;
}

#bioOffice .phone
{
	--min-font-size: 19;
	--max-font-size: 22;
	letter-spacing: 1px;
	margin: 0;
}

#mainContentWrapper
{
	margin-bottom: 50px;
}

#subContent .admissioninfo
{
	margin-bottom: 15px;
}

#subContent .admissioninfo strong
{
	color: var(--darkblue);
}

#subContent .admissioninfo p
{
	--max-font-size: 19;
}


#bioArea
{
	margin-top: 50px;
}

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

#bioArea li
{
	margin: 0 0 20px;
	--min-font-size: 18;
	--max-font-size: 21;
	line-height: 1.25;
}

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

button.toggleExpand.expanded
{
	margin-top: 40px;
}

body.services h1#pageTitle,
body.contact-item h1#pageTitle
{
	--max-font-size: 48;
}

.itemSection ul.results_list li
{
	margin-left: 0;
	list-style: none;
}

body.contact-item #bioInfo a[href^="tel:"]:not(:hover):not(:focus)
{
	color: var(--darkblue) !important;
}

/* Had to do this because the rtrim won't work if the title is wrapped in <strong> */
#office_bio.bioXref h2
{
	font-weight: 700;
}

@media (min-width: 600px)
{

	#bioArea ul.results_list
	{
		columns: 2;
	}

	#bioArea ul.results_list li
	{
		display: inline-block;
		width: 100%;
	}
}

@media (min-width: 768px)
{

	#bioPhoto
	{
		position: absolute;
		top: 0;
	}

	#bioPhoto img
	{
		width: 100%;
		left: 0;
	}

	#bioInfoWrapper
	{
		margin-left: var(--random-left-margin);
		padding-top: max(50px,
		             min(90px, 50px + (90 - 50) * ((100vw - 768px) / (1400 - 768))
		));
	}

	#bioInfo
	{
		position: relative;
		z-index: 10;
		width: 55%;
		min-height: 27vw;
		max-width: 717px;
		padding:

		max(40px,
		             min(60px, 40px + (60 - 40) * ((100vw - 768px) / (1400 - 768))
		))

		max(40px,
		             min(75px, 40px + (75 - 40) * ((100vw - 768px) / (1400 - 768))
		));
		background: rgba(223,228,237, .75);


	}

	#bioInfo::before
	{
		display: none;
	}


	body.people-item #bioPhoto::after
	{
		content: '';
	    position: absolute;
	    z-index: 2;
	    top: 0;
	    left: 0;
	    width: 100%;
	    height: 100%;
	    background: linear-gradient(to right, rgba(0,0,0,.45) 0, rgba(0,0,0,0) 50%);
	}


	h1#pageTitle
	{
		--min-font-size: 30;
		--fluid-start: 1024;
		--fluid-end: inherit;
	}
}

@media (min-width: 1024px)
{


	#bioPhoto.officePhoto
	{
		height: auto;
	}

	#bioArea
	{
		margin-left: var(--random-left-margin);
	}

	#bioArea ul.results_list
	{
		columns: 3;
	}


}

@media (min-width: 1400px)
{


	/*#bioInfo
	{
		min-height: 60vw;
	}*/

	#bioOffice
	{
		margin-top: 50px;
	}

	#bioAccessories
	{
		margin-top: 60px;
	}
}

@media (min-width: 1750px)
{
	#bioPhoto img
	{
		width: 100%;
		left: 0;
	}
}

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