.main {
	/*width: 100%; /* make sure to also change this in the media query */
	/*margin: 0 auto;*/
	margin-top: 70pt;
	margin-bottom: 10pt;
	box-sizing: border-box;
	box-shadow: None;
}

@media only screen and (orientation: portrait) {
	.body-content :not(figure) img,
	.body-content figure img {
		/* need to target both so that they're more specific */
		max-height: 100vw;
	}
}

@media only screen and (orientation: portrait) {
	.header {
		top: 0;
		position: sticky;
		position: -webkit-sticky; /* needed for iOS */
		box-shadow: None;
	}

	.body-content :target::before {
		/* When linking to tags with 'id's (example:
		   'website.com/post/#heading'), make them
		   appear lower down the page so that they
		   don't appear under the sticky header set
		   above.
		   See: https://stackoverflow.com/a/24298427
		   Note that this causes the cursor text
		   selection of the target to behave
		   undesirably.
		*/
		content: '';
		display: block;
		height: 3em;
		margin-top: -3em;
		visibility: hidden;
		pointer-events: none;
	}
}

body {
	font-size: 13pt;
	/*font-family: Lora, Arial, Helvetica, "Liberation Sans", sans-serif;*/
	font-family: 'Lora', 'Times New Roman', serif;
	line-height: 1.45;
	margin: 0;
	background: #ffffff;
	color: #404040;
}

body a {
	color: #5E81AC;
}

h1,h2,h3,h4,h5,h6 {
  font-family: 'Open Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;
  font-weight: 800;
}

.header {
	/*background-color: #f5f5f5; /* still want a background color before the image loads */
	/*background-color: lightgray; /* still want a background color before the image loads */
	width: 100%;
	height: 34pt;
	/* header must be above the overlay */
	/* this also prevents images with css filters from appearing above the header when in portrait mode */
	z-index: 3;
	/* z-index doesn't apply to the default 'static' position */
	position: absolute;
	top: 0;
	left: 0;
	background-image: None;
	background: #F5F5F5;
	border-bottom: 1px solid #EAEAEA;
}

.header-content {
/*	padding: var(--document-margin);*/
	/*position: relative; /* so that "position: absolute" works for the menu label */
	font-family: 'Open Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;
	font-weight: 800;
	font-size: 12px;
	letter-spacing: 1px;
	/*float: right;*/
}

.links {
	font-size: 100%;
	list-style-type: none;
	line-height: 1;
	padding: 20;
	margin: 0;
	margin-top: -3pt;
	display: flex;
	flex-direction: row;
	/* Not sure what we can do other than continue the links on the next line.
	 * It's ugly, but probably better than hiding them altogether. */
	flex-wrap: wrap;
	row-gap: 0.3em;
	gap: 10pt;
	float: right;
}

.title {
	font-weight: bold;
	font-size: 140%;
	line-height: 1em;
}
@media only screen and (max-width: 500pt) {
	:root {
		--document-margin: 10pt;
	}

	.header-right {
		top: 0;
		height: 100%;
		align-items: center;
	}

	.clickable-header-label {
		display: inline-flex;
	}

	.clickable-header-label * {
		vertical-align: middle;
	}

	#show-hide-menu-label {
		display: inherit;
	}

	.show-hide-menu-input:checked ~ .main .links {
		display: inherit;
	}

	.show-hide-menu-input:checked ~ .main #show-hide-menu-label > img {
		transform: rotate(90deg);
	}

	.show-hide-menu-input:checked ~ .overlay {
		visibility: visible;
		opacity: 1;
	}

	/* prevent scrolling the main body; must be on html element and not body for iOS */
	html:has(.show-hide-menu-input:checked) {
		overflow: hidden;
		height: 100%;
		/* prevent scrolling (of everything) on iOS */
		/* any element with 'overflow-y: scroll' will allow the body to scroll for some reason */
		/* use 'pan-zoom' to allow users to zoom if they need to, even though it makes scrolling weird */
		touch-action: pan-zoom;
	}

	.links {
		/* vertical padding between list items */
		--entry-padding: 9pt;

		display: none;
		position: absolute;
		left: 0;
		right: 0;
		padding-left: var(--document-margin);
		padding-right: var(--document-margin);
		padding-top: calc(var(--document-margin) - var(--entry-padding));
		padding-bottom: calc(var(--document-margin) - var(--entry-padding));

		font-size: 100%;
		background-color: rgb(247, 247, 247);
		border-top: solid 1px;
		border-bottom: solid 1px;
	}

	.links li {
		border-bottom: solid 1px;
		/* override all previously set margins */
		margin: 0;
	}

	.links li:last-child {
		border-bottom: none;
	}

	.links li > * {
		/* make the links easily clickable */
		width: 100%;
		padding-top: var(--entry-padding);
		padding-bottom: var(--entry-padding);
	}
}


/* --- Fonts --- */

/* lora-regular - latin */
@font-face {
    font-family: 'Lora';
    font-style: normal;
    font-weight: 400;
    src: url('../fonts/lora/lora-v12-latin-regular.eot'); /* IE9 Compat Modes */
    src: local('Lora Regular'), local('Lora-Regular'),
        url('../fonts/lora/lora-v12-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
        url('../fonts/lora/lora-v12-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
        url('../fonts/lora/lora-v12-latin-regular.woff') format('woff'), /* Modern Browsers */
        url('../fonts/lora/lora-v12-latin-regular.ttf') format('truetype') /* Safari, Android, iOS */
}

/* lora-700 - latin */
@font-face {
    font-family: 'Lora';
    font-style: normal;
    font-weight: 700;
    src: url('../fonts/lora/lora-v12-latin-700.eot'); /* IE9 Compat Modes */
    src: local('Lora Bold'), local('Lora-Bold'),
        url('../fonts/lora/lora-v12-latin-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
        url('../fonts/lora/lora-v12-latin-700.woff2') format('woff2'), /* Super Modern Browsers */
        url('../fonts/lora/lora-v12-latin-700.woff') format('woff'), /* Modern Browsers */
        url('../fonts/lora/lora-v12-latin-700.ttf') format('truetype') /* Safari, Android, iOS */
}

/* lora-italic - latin */
@font-face {
    font-family: 'Lora';
    font-style: italic;
    font-weight: 400;
    src: url('../fonts/lora/lora-v12-latin-italic.eot'); /* IE9 Compat Modes */
    src: local('Lora Italic'), local('Lora-Italic'),
        url('../fonts/lora/lora-v12-latin-italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
        url('../fonts/lora/lora-v12-latin-italic.woff2') format('woff2'), /* Super Modern Browsers */
        url('../fonts/lora/lora-v12-latin-italic.woff') format('woff'), /* Modern Browsers */
        url('../fonts/lora/lora-v12-latin-italic.ttf') format('truetype') /* Safari, Android, iOS */
}

/* lora-700italic - latin */
@font-face {
    font-family: 'Lora';
    font-style: italic;
    font-weight: 700;
    src: url('../fonts/lora/lora-v12-latin-700italic.eot'); /* IE9 Compat Modes */
    src: local('Lora Bold Italic'), local('Lora-BoldItalic'),
        url('../fonts/lora/lora-v12-latin-700italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
        url('../fonts/lora/lora-v12-latin-700italic.woff2') format('woff2'), /* Super Modern Browsers */
        url('../fonts/lora/lora-v12-latin-700italic.woff') format('woff'), /* Modern Browsers */
        url('../fonts/lora/lora-v12-latin-700italic.ttf') format('truetype') /* Safari, Android, iOS */
}

/* open-sans-300 - latin */
@font-face {
    font-family: 'Open Sans';
    font-style: normal;
    font-weight: 300;
    src: url('../fonts/open-sans/open-sans-v15-latin-300.eot'); /* IE9 Compat Modes */
    src: local('Open Sans Light'), local('OpenSans-Light'),
        url('../fonts/open-sans/open-sans-v15-latin-300.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
        url('../fonts/open-sans/open-sans-v15-latin-300.woff2') format('woff2'), /* Super Modern Browsers */
        url('../fonts/open-sans/open-sans-v15-latin-300.woff') format('woff'), /* Modern Browsers */
        url('../fonts/open-sans/open-sans-v15-latin-300.ttf') format('truetype') /* Safari, Android, iOS */
}

/* open-sans-300italic - latin */
@font-face {
    font-family: 'Open Sans';
    font-style: italic;
    font-weight: 300;
    src: url('../fonts/open-sans/open-sans-v15-latin-300italic.eot'); /* IE9 Compat Modes */
    src: local('Open Sans Light Italic'), local('OpenSans-LightItalic'),
        url('../fonts/open-sans/open-sans-v15-latin-300italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
        url('../fonts/open-sans/open-sans-v15-latin-300italic.woff2') format('woff2'), /* Super Modern Browsers */
        url('../fonts/open-sans/open-sans-v15-latin-300italic.woff') format('woff'), /* Modern Browsers */
        url('../fonts/open-sans/open-sans-v15-latin-300italic.ttf') format('truetype') /* Safari, Android, iOS */
}

/* open-sans-regular - latin */
@font-face {
    font-family: 'Open Sans';
    font-style: normal;
    font-weight: 400;
    src: url('../fonts/open-sans/open-sans-v15-latin-regular.eot'); /* IE9 Compat Modes */
    src: local('Open Sans Regular'), local('OpenSans-Regular'),
        url('../fonts/open-sans/open-sans-v15-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
        url('../fonts/open-sans/open-sans-v15-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
        url('../fonts/open-sans/open-sans-v15-latin-regular.woff') format('woff'), /* Modern Browsers */
        url('../fonts/open-sans/open-sans-v15-latin-regular.ttf') format('truetype') /* Safari, Android, iOS */
}

/* open-sans-italic - latin */
@font-face {
    font-family: 'Open Sans';
    font-style: italic;
    font-weight: 400;
    src: url('../fonts/open-sans/open-sans-v15-latin-italic.eot'); /* IE9 Compat Modes */
    src: local('Open Sans Italic'), local('OpenSans-Italic'),
        url('../fonts/open-sans/open-sans-v15-latin-italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
        url('../fonts/open-sans/open-sans-v15-latin-italic.woff2') format('woff2'), /* Super Modern Browsers */
        url('../fonts/open-sans/open-sans-v15-latin-italic.woff') format('woff'), /* Modern Browsers */
        url('../fonts/open-sans/open-sans-v15-latin-italic.ttf') format('truetype') /* Safari, Android, iOS */
}

/* open-sans-600 - latin */
@font-face {
    font-family: 'Open Sans';
    font-style: normal;
    font-weight: 600;
    src: url('../fonts/open-sans/open-sans-v15-latin-600.eot'); /* IE9 Compat Modes */
    src: local('Open Sans SemiBold'), local('OpenSans-SemiBold'),
        url('../fonts/open-sans/open-sans-v15-latin-600.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
        url('../fonts/open-sans/open-sans-v15-latin-600.woff2') format('woff2'), /* Super Modern Browsers */
        url('../fonts/open-sans/open-sans-v15-latin-600.woff') format('woff'), /* Modern Browsers */
        url('../fonts/open-sans/open-sans-v15-latin-600.ttf') format('truetype') /* Safari, Android, iOS */
}

/* open-sans-600italic - latin */
@font-face {
    font-family: 'Open Sans';
    font-style: italic;
    font-weight: 600;
    src: url('../fonts/open-sans/open-sans-v15-latin-600italic.eot'); /* IE9 Compat Modes */
    src: local('Open Sans SemiBold Italic'), local('OpenSans-SemiBoldItalic'),
        url('../fonts/open-sans/open-sans-v15-latin-600italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
        url('../fonts/open-sans/open-sans-v15-latin-600italic.woff2') format('woff2'), /* Super Modern Browsers */
        url('../fonts/open-sans/open-sans-v15-latin-600italic.woff') format('woff'), /* Modern Browsers */
        url('../fonts/open-sans/open-sans-v15-latin-600italic.ttf') format('truetype') /* Safari, Android, iOS */
}

/* open-sans-700 - latin */
@font-face {
    font-family: 'Open Sans';
    font-style: normal;
    font-weight: 700;
    src: url('../fonts/open-sans/open-sans-v15-latin-700.eot'); /* IE9 Compat Modes */
    src: local('Open Sans Bold'), local('OpenSans-Bold'),
        url('../fonts/open-sans/open-sans-v15-latin-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
        url('../fonts/open-sans/open-sans-v15-latin-700.woff2') format('woff2'), /* Super Modern Browsers */
        url('../fonts/open-sans/open-sans-v15-latin-700.woff') format('woff'), /* Modern Browsers */
        url('../fonts/open-sans/open-sans-v15-latin-700.ttf') format('truetype') /* Safari, Android, iOS */
}

/* open-sans-800 - latin */
@font-face {
    font-family: 'Open Sans';
    font-style: normal;
    font-weight: 800;
    src: url('../fonts/open-sans/open-sans-v15-latin-800.eot'); /* IE9 Compat Modes */
    src: local('Open Sans ExtraBold'), local('OpenSans-ExtraBold'),
        url('../fonts/open-sans/open-sans-v15-latin-800.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
        url('../fonts/open-sans/open-sans-v15-latin-800.woff2') format('woff2'), /* Super Modern Browsers */
        url('../fonts/open-sans/open-sans-v15-latin-800.woff') format('woff'), /* Modern Browsers */
        url('../fonts/open-sans/open-sans-v15-latin-800.ttf') format('truetype') /* Safari, Android, iOS */
}

/* open-sans-700italic - latin */
@font-face {
    font-family: 'Open Sans';
    font-style: italic;
    font-weight: 700;
    src: url('../fonts/open-sans/open-sans-v15-latin-700italic.eot'); /* IE9 Compat Modes */
    src: local('Open Sans Bold Italic'), local('OpenSans-BoldItalic'),
        url('../fonts/open-sans/open-sans-v15-latin-700italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
        url('../fonts/open-sans/open-sans-v15-latin-700italic.woff2') format('woff2'), /* Super Modern Browsers */
        url('../fonts/open-sans/open-sans-v15-latin-700italic.woff') format('woff'), /* Modern Browsers */
        url('../fonts/open-sans/open-sans-v15-latin-700italic.ttf') format('truetype') /* Safari, Android, iOS */
}

/* open-sans-800italic - latin */
@font-face {
    font-family: 'Open Sans';
    font-style: italic;
    font-weight: 800;
    src: url('../fonts/open-sans/open-sans-v15-latin-800italic.eot'); /* IE9 Compat Modes */
    src: local('Open Sans ExtraBold Italic'), local('OpenSans-ExtraBoldItalic'),
        url('../fonts/open-sans/open-sans-v15-latin-800italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
        url('../fonts/open-sans/open-sans-v15-latin-800italic.woff2') format('woff2'), /* Super Modern Browsers */
        url('../fonts/open-sans/open-sans-v15-latin-800italic.woff') format('woff'), /* Modern Browsers */
        url('../fonts/open-sans/open-sans-v15-latin-800italic.ttf') format('truetype') /* Safari, Android, iOS */
}