body {
	padding: 0;
	margin: 0;
	background-color: #FEFEFE;
	color: #222;
}

a {
	/*color: #6cbe7a;*/
	/*color: #4848e4;*/
	/*color: #ee5850;*/
	/*color: #278fd7;*/
	/*color: #6c6eda;*/
	/*color: #d65038;*/
	/*color: #3a9e90;*/
	color: #3f79c0;
	text-decoration: none;
}
a:hover {
	text-decoration: underline;
}
a:active {
	color: #4848e4;
}

header {
	display: flex;
	align-items: baseline;
	margin-bottom: 2rem;
}

header h1 {
	margin: 0;
	font-size: 1.45rem;
	line-height: 1.9rem;
	font-weight: normal;
	flex: 1;
}

ul#nav {
	display: flex;
	flex-direction: row;
	padding: 0;
	margin: 0;
	gap: 0.6rem;
}
ul#nav li {
	font-size: 1.2rem;
	line-height: 1.3rem;
	margin: 0;
}
ul#nav li:not(:last-child)::after {
	content: "\00B7";
	color: #999;
	margin-left: 0.6rem;
}
ul#nav li.after-line::after {
	display: inline-block;
	content: "";
	width: 2px;
	height: 100%;
	margin-left: 2rem;
	margin-right: 1.5rem;
	vertical-align: top;
	border-radius: 1px;
	background-color: #dfdfdf;
}

main {
	max-width: 52rem;
	/*margin: 3.5rem auto;*/
	margin: 2.7rem auto 1.5rem auto;
	padding: 0 3.5rem;

	color: #333;
}

h2 {
	margin: 1.8rem 0 1rem 0;
	font-family: "Garamond", serif;
	font-size: 1.2rem;
	color: #444;
}

h2 a {
	float: right;
	font-style: italic;
	font-weight: normal;
}

h3 {
	color: #555;
	font-style: italic;
	font-size: 1.1rem;
}

p, li {
	font-family: "Garamond", serif;
	font-size: 1.2rem;
	/*font-size: 1.1rem;*/
}

p {
	line-height: 1.3em;
}
p span {
	/*color: #ff494d;*/
	color: #f63752;
}

ul {
	padding: 0;
}
li {
	margin: 1.3rem 0;
	/*list-style: none;*/
}
ul li {
	list-style: none;
}
.projects li.with-logo {
	display: flex;
	gap: 8px;
}
.projects li p {
	margin: 0.2rem 0 0 0;
	font-size: 1.1rem;
	color: #666;
	/*font-style: italic;*/
}
.projects li p a.subtle-link {
	color: #666;
	text-decoration: underline;
}
.projects li p a.subtle-link:active {
	color: #333;
	text-decoration: underline;
}
.projects li p em {
	font-style: italic;
}
.projects li p strong {
	white-space: nowrap;  /* ensure name in pub authors stays on one line */
}
.projects li.with-logo img {
	float: right;
	height: 70px;
	width: auto;
}

figure {
	margin: 0;
}
figure#main-photo img {
	max-width: 100%;
	height: auto;
	/*margin-top: 1rem;*/
	margin-top: 0.5rem;
}
figcaption {
	color: #666;
	font-style: italic;
	font-size: 12px;
}

@media screen and (max-width: 820px) {
	main {
		margin: 2rem auto;
		padding: 0 2rem;
	}

	header {
		flex-direction: column;
		gap: 0.5rem;
	}
}

@media screen and (max-width: 640px) {
	#pfp {
		display: none;
	}

	ul#nav {
		flex-direction: column;
	}
	ul#nav li:not(:last-child)::after {
		content: none;
	}
	ul#nav li.after-line::after {
		display: inline-block;
		content: "";
		width: 100%;
		height: 2px;
		margin: 0.8rem 0 0.15rem;
		vertical-align: top;
		border-radius: 1px;
		background-color: #efefef;
	}
}
