body {
	font-size: 24px;
	--image-width: 22vw;
	--image-height: calc(var(--image-width) / 1.7777);
	--text-width: 42rem;
	font-family: "EB Garamond";
	background: #eeeeee;
	color: black;
}

h1 {
	text-align: center;
}

a {
	color: #005;
}

header {
	text-align: center;
}

iframe {
	margin: auto;
}

a:hover, a:focus {
	color: #007;
}

a:visited {
	color: #002;
}

header p {
	text-align: left;
	font-style: italic;
}

p, ul {
	position: relative;
	line-height: 135%;
}

blockquote p {
	width: calc(0.8 * var(--text-width));
	line-height: 135%;
}

@media screen and (max-width: 375px) {
	img {
		width: 100%;
	}
}

@media screen and (min-width: 750px) {
	header, article {
		margin: auto;
		width: var(--text-width);
	}

	p, ul {
		width: var(--text-width);
	}
}

@media screen and (max-width: 1549px) {
	a.slide {
		margin: 0.2em 0;
		display: block;
		text-align: center;
		background: #000;
		line-height: 0;
		padding: 0;
	}
}

@media screen and (min-width: 1550px) {
	p, blockquote {
		text-align: justify;
	}

	a.slide img {
		display: block;
		border: solid #ccc 1px;
	}

	a.slide {
		position: absolute;
		width: var(--image-width);
		left: calc(-1.1 * var(--image-width));
	}

	a.slide + a.slide {
		left: calc(1.1 * var(--text-width));
	}

	a.slide + a.slide + a.slide {
		left: calc(-1.1 * var(--image-width));
	}

	a.slide + a.slide + a.slide + a.slide {
		left: calc(1.1 * var(--text-width));
	}
}

blockquote {
	font-style: italic;
}

/* from pandoc */
code{white-space: pre-wrap;}
span.smallcaps{font-variant: small-caps;}
span.underline{text-decoration: underline;}
div.column{display: inline-block; vertical-align: top; width: 50%;}