@font-face {
	font-family: appleGaramond;
	src: url(assets/fonts/AppleGaramond.ttf);
	font-weight: normal;
}

@font-face {
	font-family: appleGaramond;
	src: url(assets/fonts/AppleGaramond-Bold.ttf);
	font-weight: bold;
}

@font-face {
	font-family: computerModern;
	src: url(assets/fonts/cmunrm.ttf);
	font-weight: normal;
}

@font-face {
	font-family: computerModern;
	src: url(assets/fonts/cmunbx.ttf);
	font-weight: bold;
}

body {
	margin-left: auto;
	margin-right: auto;

	padding: 20px;

	max-width: 800px;

	font-family: computerModern, serif;

	background-color: white;
	color: black;
}

.nav {
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.nav h1 {
	display: inline-block;
	margin: 0px;
}

.nav ul {
	list-style-type: none;
	margin-bottom: 0px;
	padding: 0px;
}

.nav li {
	display: inline-block;
	font-size: 1.5em;
	padding-left: 12px;
	padding-right: 12px;
}

#nav1 {color: #4FB32F;}
#nav2 {color: #FDAC01;}
#nav3 {color: #F36D00;}
#nav4 {color: #D9212B;}
#nav5 {color: #802084;}
#nav6 {color: #0488D7;}

.current {
	font-weight: bold;
}

#pagetitle {
	font-family: appleGaramond, serif;
	font-size: 3.5em;
	font-weight: normal;
	text-decoration-line: none;
}

h1 {
	font-family: appleGaramond, serif;
	font-size: 2.5em;
	text-decoration-line: underline;
	margin: 0px;
}

h2 {
	font-family: appleGaramond, serif;
	font-size: 1.8em;
	margin-top: 10px;
	margin-bottom: 10px;
}

a {
	color: coral;
}

/* Picture on the left, text to the right of it (or below if on mobile) */
.profile {
	/* display: flex; */
}

img {
	display: block;
	margin: auto;
	padding: 20px;
	width: 70%;
}

footer {
	text-align: center;
}

.webring {
	text-align: center;
}

.copyright {
	text-align: center;
}

/* Make the mobile layout Not shi- subpar. */
@media screen and (max-width: 850px) {
	body {
			width: 95%;
	}
}

@media (prefers-color-scheme: dark) {
	a {
		color: coral;
	}

	body {
/*		background-color: #191723; */
		background-color: #1c1b23;
		color: #ecedda;
	}
}