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

#header
{
	position: absolute;
}

body.scrolled #header
{
	box-shadow: unset;
}

#banner
{
	height: auto;
	min-height: unset;
	max-height: unset;
	padding-top: 136px;
}

#bannerImage::after
{
	background: #171717;
	opacity: .36;
}

#bannerImage
{
	position: relative;
	left: calc(50% - 50vw);
	/*aspect-ratio: 420/35;*/
	aspect-ratio: 2400/855;
	width: 100vw;
}

#bannerImage img
{
	position: relative;
	display: block;
	height: auto;
}

#bannerContent 
{
	position: absolute;
	bottom: 0;
	left: 0;
	padding-bottom: max(1px, 
	             min(30px, 1px + (30 - 1) * ((100vw - 400px) / (768 - 400))
	))
}

h1#pageTitle
{
	--min-font-size: 36;
}

#mainContent 
{
	order: 2;
}

#subContent,
#additionalSubcontent 
{
	order: 1;
	padding-top: 0;
	margin-top: 0;
}

#bioInfoWrapper
{
	display: block;
	margin: 0 0 30px 0;
}

#bioPhoto
{
	display: block;
	width: 100%;
	height: auto;
	max-width: 315px;
	max-height: 315px;
	margin: 0 auto 30px !important;
	border-radius: 50%;
	overflow: hidden;
}

#bioPhoto img 
{
	display: block;
	width: 100%;
	height: auto;
}

#bioInfo h1
{
	margin: 0 0 15px;
	--min-font-size: 28;
	--max-font-size: 36;
}


#bioTitle
{
	text-transform: uppercase;
	color: var(--blue);
	letter-spacing: 1px;
	font-weight: 500;
}

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

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


ul#bioContact li#bioEmail a:not(:hover):not(:focus)
{
	font-weight: 500;
	color: var(--brightgreen);
}

ul#bioContact,
#officeList,
#subContent .itemSection
{
	width: 100%;
	padding: 31px 0 10px 0;
	box-sizing: border-box;
	border-top: 1px solid var(--rules);
	color: #696969;
}

#subContent .itemSection h2 
{
	margin-top: 0;
}

/*#subContent .itemSection a:not(:hover):not(:focus)
{
	color: #696969;
}*/

ul#bioContact li
{
	margin: 0 0 15px;
	color: #696969;
}

ul#bioContact span.type
{
	display: inline-block;
	width: 60px;
}

ul#bioAccessories
{
	display: flex;
	margin: 25px 0 36px;
}

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

ul#bioAccessories a 
{
	display: block;
	max-width: 45px;
	transition: all 250ms ease;
}

ul#bioAccessories svg 
{
	display: block;
	width: 100%;
	height: auto;
	fill: var(--orange);
}

ul#bioAccessories a:hover,
ul#bioAccessories a:focus 
{
	transform: scale(1.08);
}

#officeList
{
	color: #696969;
}

#officeList .title
{
	margin-bottom: 10px;
	font-family: 'Calluna';
	--min-font-size: 20;
	--max-font-size: 24;
}

#officeList .title a:not(:hover):not(:focus)
{
	color: var(--black);
}

.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;
}

#bio_badge 
{
	margin-top: 60px;
}

@media (min-width: 920px)
{
	#bioPhoto
	{
		width: 100%;
		height: auto;
	}

	/*#additionalSubcontent
	{
		position: sticky;
		top: 0;
		right: 0;
		z-index: 100;
	}*/
}

@media (min-width: 920px)
{
	

	body.defaultBanner #banner
	{
		height: auto;
    	min-height: unset;
    	max-height: unset;
    	padding-top: 136px;
	}
}

@media (min-width: 1024px)
{
	#banner 
	{
		margin-bottom: 80px;
	}

	#bannerContent
	{
		display: block;
		bottom: max(50px, 
		             min(136px, 50px + (136 - 50) * ((100vw - 1024px) / (1500 - 1024))
		));
	}

	body.defaultBanner #banner 
	{
	    min-height: unset;
	    max-height: unset;
	    height: 475px;
	}
}


@media (min-width: 1200px)
{
	#additionalSubcontent
	{
		margin-top: -160px;
		z-index: 100;
	}
}

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