/* From http://www.informationarchitects.jp/100E2R/ and others... */

BODY {
	font: 100%/1.45 sans-serif;
	text-rendering: optimizeLegibility;
	max-width: 40em;
	margin: auto;
	padding: 0 8px;
}

/* Temporarily adjust dark mode to match iOS 13's Mail dark-HTML rendering.
   This should be unnecessary once more browsers support meta-color-scheme,
   and Safari fixes dark-mode link colors to match Mail's.
*/

@media (prefers-color-scheme: dark) {
	BODY {
		background-color: #1C1C1E;
		color: #FFFEFF;
	}
	A {
		color: #65A5DC;
	}
}

/* Multi-Column Layout, conditional on column & column-span support detected by modernizr */

/* Wide 2 column layout */
@media (min-width: 84em) {
	.csscolumns.csscolumns-span .stylobate {
		max-width: 84em;
	}
}

/* Wide Bazooka! 3 column layout! http://www.youtube.com/watch?v=z0cvDxA27e8 */
@media (min-width: 126em) {
	.csscolumns.csscolumns-span .stylobate {
		max-width: 126em;
	}
}

.csscolumns.csscolumns-span .stylobate MAIN {
	column-width: 40em;
	
	column-rule: 1px dotted #999;
	
	column-gap: 2em;
}

.csscolumns.csscolumns-span SECTION {
	break-inside: avoid;
}

.csscolumns.csscolumns-span SECTION.long {
	break-inside: auto;	
}

.csscolumns.csscolumns-span FOOTER {
	column-span: all;	
}

.csscolumns.csscolumns-span H1 {
	column-span: all;
}

/* Navigation Menu */

NAV {
	text-align: center;
}

NAV UL {
	padding: 0.3em 0 0.3em 0;
	border-color: gray;
	border-width: 0 0 2px 0;
	border-style: solid;
}

NAV LI {
	list-style: none;
	display: inline-block;
	min-width: 3.5em;
}

/* Adjust the navigation layout when the viewport is narrow */

@media (max-width: 30em) {
	NAV .collapsable { display: none; }
}

/* General Elements */

IMG {
	max-width: 100%;
}

CODE {
	white-space: pre-wrap; /* css-3 */
	word-wrap: break-word;       /* Internet Explorer 5.5+ */
}

ABBR { border-bottom: thin dotted; cursor: help; }

.screenshot {
	width: 100%;
	height: auto;
}

.fauxapplelabel {
	color: gray;
	text-align: center;
}

A[HREF^="http://web.archive.org/"], A[HREF^="https://web.archive.org/"] {
	padding-right: 20px;
	background: transparent url(web-archive.png) no-repeat center right;
}