body {  }
	.title 
		{ width: var(--slim); }
	.title h2, .title h3 
		{ margin-bottom: 1.6rem; }
	.content 
		{ width: var(--wide); }
	.content h4 
		{ text-transform: uppercase; margin-bottom: .5rem; }
header {  }
	header .title { display: flex; flex-direction: column-reverse; justify-content: space-between; }
	header .title img { border-radius: 1.6rem; padding: 1.6rem; background: var(--fground); width: 12rem; height: 12rem; align-self: end; }
	header .content { padding: 0; }
	header figure { display: block; position: relative; }
	header figure img { width: 100%; height: 100%; object-fit: cover; aspect-ratio: 2 / 1; }
	header figure figcaption { position: absolute; bottom: 0; right: 0; font-size: 1.2rem; padding: .5rem 1.6rem; background: var(--bground-alt); color: var(--fground); border-radius: 1.6rem 0 0 0; }

section {  }
	.about {  }
		.about .content {  }
		.about .content strong { display: block; font-family: var(--title); font-size: 2.4rem; margin-bottom: 1.6rem; font-weight: normal; }
		.about .content p:first-of-type { font-size: 2rem; } 
		.about .content .no-content { display: block; text-align: center; font-style: italic; padding-bottom: 1.6rem; }
			
	.contact {  }
		.contact .title { flex-direction: column; justify-content: space-between; }
		.contact address { display: flex; flex-direction: column; justify-content: space-between; font-style: normal; }
		.contact address p { }
		.contact-links { display: flex; flex-direction: row; gap: .5rem; justify-content: flex-end; align-items: center; flex-wrap: wrap; margin-top: 1.6rem; }
		.contact-links a { display: block; line-height: 0; }
		.contact-links a img, .contact-links a svg { width: 3rem; height: 3rem; }
		.contact-links a svg .fill { fill: var(--brand); }
		.contact .content { padding: 0; }
		#map { font-size: 1.4rem; font-family: var(--content); aspect-ratio: 2 / 1; }
		.leaflet-popup-content-wrapper, .leaflet-popup-tip {  background: var(--bground); color: var(--fground); }
		.map-markers { display: flex; flex-direction: row; gap: .4rem; justify-content: center; align-items: center; margin: 1rem 0; padding: 0;}
		.map-markers li { margin: 0; padding: 0; }
		.map-markers li a { display: block; line-height: 0; }
		.map-markers li img, .map-markers li svg { width: 3.2rem; height: 3.2rem; }
		.map-markers li svg .fill { fill: var(--brand); }
		.leaflet-popup-content-wrapper { text-align: center; }
		.leaflet-popup-content-wrapper small { display: block; font-size: 1rem; text-transform: uppercase; }
		.leaflet-container .leaflet-control-attribution { background-color: var(--bground-alt); color: var(--fground); padding: .4rem 1.6rem; font-size: 1.2rem; border-radius: 1.6rem 0 0 0; }
		.leaflet-container a { color: var(--brand); }
		.leaflet-control-attribution a:hover, .leaflet-control-attribution a:focus { text-decoration: none; }
		
	.affiliations {  }
		.affiliations .content ul {  }
		.affiliations .content li { font-size: 1.6rem; margin-bottom: 1.6rem; }
		.affiliations .content li:last-of-type { margin-bottom: 0; }
		.affiliations .content li a { display: flex; flex-direction: row; gap: .8rem; align-items: center; }
		.affiliations .content li img { width: 4rem; height: 4rem; padding: .4rem; }
	
	.aliases {  }
		.aliases ul { list-style: none; margin-bottom: 1.6rem; line-height: 1.5; }
		.aliases li { display: flex; flex-direction: row; align-items: center; gap: .4rem; }
		.aliases li img	{ width: 2.4rem; height: 2.4rem; padding: .2rem; }
		.aliases h4:first-of-type { margin-top: .4rem; }
		.aliases ul:last-of-type { margin-bottom: 0; }
		.aliases .alt-name li { display: inline; position: relative; font-size: 1.4rem; }
		.aliases .alt-name li::after { content: "•"; padding: 0 1.6rem; font-size: 2rem; line-height: 0; }
		.aliases .alt-name li:first-of-type { padding-left: 0; }
		.aliases .alt-name li:last-of-type::after { content: ""; padding: 0; }
			
@media only screen and (max-width: 960px) {
	header, section { flex-direction: column; }
	.title, .content { width: var(--full); text-align: center; }
	.title h2 { margin-bottom: 0; }
	header .title img { align-self: center; margin-bottom: .8rem; }
	.about .content p { text-align: left;  }
	.contact-links { justify-content: center; }
	.breaker { display: none; }
}

@media only screen and (max-width: 640px) {
	h1 { font-size: 2.4rem; }
	header .title img { width: 8rem; height: 8rem; padding: .8rem; border-radius: .8rem; }
	.title, .content { padding: 1.6rem; }
	#map { aspect-ratio: 1 / 1; }
	.title h2, .title h3 { margin-bottom: 0; }
	.about .content strong { margin-bottom: .8rem; font-size: 2rem; }
	.about .content p:first-of-type  { font-size: 1.6rem; }
}