HTML, BODY, HEADER, MAIN, H1, H2, H3, H4, P, UL, OL, LI, TABLE, TR, TH, TD, FIGURE, FIGCAPTION, IMG {
	margin: 0;
	padding: 0;
	}
HTML, BODY {
	height: 100%;
	}
BODY {
	display: flex;
	flex-direction: column;
	background-color: white;
	color: black;
	font-size: 12pt;
	}
DIV.scroller {
	flex: 1 1 auto;
	height: 100px;
	overflow-y: auto;
	}
MAIN {
	margin: 1em .5em;
	}
HEADER, FOOTER {
	font-family: sans-serif;
	color: white;
	background-color: #c88200;		/* different on different sites */
	box-shadow: 0px 1px 2px 0px rgba(0,0,0,0.40);
	}
DIV.breadcrumbs {
	padding: 0 .7em .3em .7em;
	}
DIV.breadcrumbs A {
	color: inherit;
	}
H1 {
	font-size: 150%;
	padding: .4em;
	}
H1 A, FOOTER A {
	text-decoration: inherit;
	color: inherit;
	}
FOOTER {
	display: flex;
	justify-content: space-between;
	padding: .5em;
	}

/* Tiled table of contents */
UL.tiles {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	align-items: stretch;
	margin: -.5em;
	padding: 0;
	}
UL.tiles LI {
	display: block;
	flex-grow: 1;
	margin: .5em;
	padding: .5em;
	width: 20em;
	border: 1px solid grey;
	border-radius: 7px;
	box-shadow: 1px 1px 2px 0px rgba(0,0,0,0.40);
	}

/* Illustration at the top of each page */
DIV.article_image {
	background-color: #606060;
	padding: 5px;
	box-shadow: 0px 1px 2px 0px rgba(0,0,0,0.40);
	}
DIV.article_image DIV {
	width: calc(100% - 10px);
	max-width: 100vh;
	margin: 0 auto;
	}
DIV.article_image DIV DIV {
	position: relative;
	padding-top: 41.67%;
	}
DIV.article_image DIV DIV IMG {
	position: absolute;
	display: block;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	}
DIV.article_image DIV DIV SPAN {		/* caption */
	position: absolute;
	display: block;
	right: .2em;
	bottom: .2em;
	padding: .2em;
	background-color: #00000040;
	color: white;
	font-family: sans-serif;
	font-size: 70%;
	}

/* Content */
H1, H2, H3, H4 {
	font-weight: bold;
	}
H2, H3 {
	font-family: sans-serif;
	}
H2 {		/* article title */
	font-size: 120%;
	margin-bottom: .2em;
	}
H3 {		/* article subheading */
	font-size: 100%;
	margin: .4em 0 .2em 0;
	}
H4 {		/* list item */
	font-size: 100%;
	display: inline;
	}

P {
	margin-bottom: .5em;
	}
UL, OL {
	padding-left: 1.2em;
	margin-bottom: .5em;
	}
UL UL, OL OL {
	margin-top: .5em;
	}
LI {
	margin: 0 0 .4em 0;
	}

/* Blog posting */
ARTICLE {
	border: thin solid black;
	padding: 0.5em;
	}
ARTICLE H1 {
	font-size: 120%;
	padding: 0;
	margin-bottom: .2em;
	}
ARTICLE H2 {
	font-size: 110%;
	margin-bottom: .2em;
	}


FIGURE.float-right {
	float: right;
	clear: both;
	width: 15%;
	max-width: 200px;
	margin: .5em 0 .5em .5em;
	padding: 5px;
	border: 1px solid black;
	box-shadow: 0px 1px 2px 0px rgba(0,0,0,0.40);
	}
FIGURE A, FIGURE IMG {
	display: block;
	width: 100%;
	}

TABLE {
	border-collapse: collapse;
	box-shadow: 0px 1px 2px 0px rgba(0,0,0,0.40);
	}
TH, TD {
	border: thin solid black;
	padding: .5em;
	}

DIV.author_box {
	display: flex;
	flex-direction: row;
	align-items: start;
	max-width: 600px;
	margin: .5em;
	border: thin solid black;
	box-shadow: 1px 1px 2px 0px rgba(0,0,0,0.40);
	}
DIV.author_box IMG {
	display: block;
	width: 17%;
	max-width: 48px;
	}
DIV.author_byline {
	font-weight: bold;
	margin: .4em;
	font-size: 80%;
	}
DIV.author_blurb {
	margin: .4em;
	font-size: 80%;
	}

DIV.google_ads_container {
	clear: both;
	max-width: 600px;
	margin: .5em;
	border: thin solid #808080;
	box-shadow: 1px 1px 2px 0px rgba(0,0,0,0.40);
	}
.adsbygoogle {
	display: block;
	height: 25%;
	}

/* Syntax highlighting */
PRE {
	display: inline-block;		/* shrink to width, prevents overlap with floats */
	padding: .5em;
	background-color: white;
	border: 1px solid black;
	color: black;
	margin: 0 .5em .5em .5em;
	box-shadow: 0px 1px 2px 0px rgba(0,0,0,0.40);
	}
.nt {		/* tag */
	color: blue;
	}
.na {		/* attribute */
	color: red;
	}
.ns {		/* string */
	color: green;
    }