/*
 * A port of the live PaulKroon.com WordPress theme: "Unnamed Lite 1.0" by Xu
 * Yiyang (http://xuyiyang.com/wordpress-themes/unnamed/), released under the
 * GPL. Three sources are folded into this one file:
 *
 *   1. themes/unnamed-lite/style.css      — the theme itself
 *   2. themes/unnamed-lite/two_column.css — the two-column width overrides
 *   3. the theme-options <style> block WordPress printed inline, which is where
 *      the site's actual colours live: #ebebeb page, #333 text, #5d8bb3 links,
 *      white-on-dark header, white #content
 *
 * Overrides are applied in place rather than appended, so every selector
 * appears once carrying its final value. Rules for markup this rebuild does not
 * have are dropped: comment forms and comment lists, the #shelf/#toggle widget
 * row, the sidebar search box, and the #nav dropdown submenus. See README for
 * why comments and search are gone.
 *
 * Theme images sit in css/images/ so the relative url() paths below are
 * byte-identical to the originals.
 *
 * Two deliberate departures from the live stylesheet, both marked DEVIATION
 * below: `pre` scrolls instead of being clipped, and there is a narrow-screen
 * block at the end. Neither changes anything the live theme renders at desktop
 * width.
 */

/* ---------- general ---------- */

*, html {
	margin:0;
	padding:0;
}
body {
	font:62.5% "Lucida Grande", Segoe UI, Verdana, Arial, sans-serif;
	text-align:center;
	color:#333;
	background:#ebebeb;
}
fieldset, select, img {
	border:0;
}
hr {
	display:none;
}
a, a:link, a:active, a:visited {
	color:#5d8bb3;
	text-decoration:none;
}
a:hover {
	color:#3465a4;
	text-decoration:underline;
}
p {
	margin:0 0 10px;
}
ol li {
	list-style:decimal outside;
}
acronym, abbr, span.caps {
	cursor:help;
}
acronym, abbr {
	border-bottom:1px dashed #fc0;
}
blockquote {
	border-left:3px solid #ccc;
	margin:20px;
	padding-left:10px;
}
cite, ins {
	text-decoration:none;
}
code, pre, kbd {
	font:1em 'Courier New', Courier, sans-serif;
}
/* DEVIATION: #primary-content is overflow:hidden, so on the live site a code
 * line wider than the column is silently cut off. Scrolling it instead costs
 * nothing visually and keeps the code readable. */
pre {
	overflow:auto;
}
small {
	font:.8em Arial, Helvetica, sans-serif;
	color:#777;
}
strike, del {
	color:#777;
	text-decoration:line-through;
}
label {
	cursor:pointer;
}
h1, h2, h3, h4 {
	font-family:Georgia, "Times New Roman", Times, serif;
	color:#333;
}
h1 {
	font-size:1.8em;
	text-align:left;
	padding:21px 0 5px 20px;
}
h2 {
	margin:5px 0;
	font-size:1.6em;
}
h3, h4 {
	margin:15px 0 0;
	font-size:1.2em;
}
.skip-link {
	position:absolute;
	left:-9999px;
}
.skip-link:focus {
	left:2px;
	top:2px;
	z-index:900;
	padding:4px 8px;
	background:#fff;
	border:1px solid #fc0;
}

/* ---------- container ---------- */

#container {
	position:relative;
	margin:0 auto;
	font-size:1.2em;
	width:798px;
	background:url(images/2col/bg_content.png) repeat-y center top;
}
#content {
	width:790px;
	margin:0 auto;
	background:#fff;
}

/* ---------- header and navigation ---------- */

#header {
	margin:0 auto;
	line-height:1.2em;
	width:790px;
	height:78px;
	background:url(images/bg_header.png) transparent repeat top center;
}
#header h1 a, .description {
	color:#fff;
}
.description {
	text-align:left;
	padding:0 0 5px 20px;
	font:1em Georgia, "Times New Roman", Times, serif;
}
#nav {
	display:block;
	height:32px;
	margin:0 auto;
	padding:0;
	text-align:left;
	letter-spacing:0.15em;
	text-transform:uppercase;
	width:790px;
	background:url(images/bg_nav.png) repeat-x left top transparent;
	list-style:none;
	z-index:8;
}
#nav li {
	float:left;
	padding:0;
	margin:0;
}
#nav li a {
	display:block;
	line-height:32px;
	padding:0 10px;
	color:#fff;
	text-decoration:none;
}
#nav li a:hover {
	color:#fff;
	background:#333;
}
#nav li:hover, #nav li.current_page_item {
	color:#fff;
	background:#333;
	cursor:pointer;
	z-index:100;
}

/* ---------- primary content and entries ---------- */

#primary-content {
	float:left;
	text-align:left;
	line-height:1.6em;
	margin:0 1.5%;
	width:500px;
	display:inline;
	overflow:hidden;
}
.pagetitle {
	margin-top:15px;
	text-align:center;
}
.entry {
	text-align:left;
	padding:10px 8px;
}
.entry ul, .entry ol {
	margin:0 0 0 40px;
}
.entry li {
	padding-bottom:8px;
}
.entry-header {
	font-size:1.6em;
	font-weight:400;
	margin:0;
	padding:3px 0;
}
.entry-date {
	text-align:right;
	font-size:.9em;
	color:#777;
	background:url(images/bg_meta.png) no-repeat top center;
}
.entry-footer {
	color:#ccc;
	font-size:0.9em;
	text-align:right;
	margin:0 0 20px;
	line-height:1.2em;
	padding:4px 0;
	background:url(images/bg_meta.png) no-repeat top center;
}

/* ---------- sidebar ---------- */

#sidebar {
	float:left;
	line-height:1.2em;
	margin:13px 1.5%;
	width:235px;
	text-align:left;
	font-size:1em;
}
#sidebar h2 {
	font-size:1.2em;
	font-weight:400;
	margin:10px 2px 0 7px;
	padding:2px 0;
}
#sidebar ul {
	color:#777;
	list-style:none;
}
#sidebar li {
	width:100%;
}
#sidebar ul ul {
	margin:0;
	padding:0 0 10px;
}
#sidebar ul ul li {
	width:100%;
	margin:0 5px;
	padding:2px;
}
#sidebar ul ul li a, #sidebar ul ul li a:link, #sidebar ul ul li a:visited {
	padding:2px 4px;
}
.left-sidecolumn, .right-sidecolumn {
	clear:left;
	float:left;
	width:90%;
	padding:0 5px;
}

/* ---------- footer ---------- */

#footer {
	clear:both;
	height:62px;
	margin:0 auto;
	width:798px;
	background:url(images/2col/bg_footer.png) repeat-y center top;
}
#footer p {
	color:#fff;
	text-align:center;
	font-size:.9em;
	line-height:1.5em;
	padding:12px 0 0;
}

/* ---------- images and float ---------- */

img {
	border:0;
}
p img {
	border:0;
	max-width:100%;
	padding:2px;
}
.aligncenter, div.aligncenter {
	display:block;
	margin-left:auto;
	margin-right:auto;
}
.alignleft {
	float:left;
}
.alignright {
	float:right;
}
.wp-caption {
	border:1px solid #ddd;
	text-align:center;
	background-color:#f3f3f3;
	padding-top:4px;
	border-radius:3px;
	margin:10px;
}
.wp-caption img {
	border:0 none;
	margin:0;
	padding:0;
}
.wp-caption p.wp-caption-text {
	font-size:11px;
	line-height:17px;
	margin:0;
	padding:0 4px 5px;
}
.feedlink img {
	display:inline;
	float:left;
	margin:0;
	padding:0;
}

/* ---------- text align ---------- */

.center {
	text-align:center;
}
.item {
	text-align:right;
}

/* ---------- float ---------- */

.floatright {
	float:right;
}
.floatleft {
	float:left;
}

/* ---------- miscellaneous ---------- */

.content-top {
	font-size:.9em;
	text-align:right;
	width:788px;
	background:url(images/bg_content_top.png) transparent repeat-x top center;
	margin:0 1px;
	height:15px;
}
.content-top a {
	margin:0 15px 0;
}
.content-bottom {
	background:url(images/bg_content_bottom.png) repeat-x bottom left;
	height:6px;
	margin:0 1px;
	width:788px;
}
.navigation {
	display:block;
	font-size:.9em;
	text-align:center;
	padding:10px 0;
}
.alert {
	color:#f00;
	background:#ff9;
	border:1px solid #fc0;
	text-align:center;
	margin:10px auto;
	padding:5px;
}
.metacat {
	background:url(images/tag1.png) left center no-repeat;
	padding:2px 0 2px 16px;
}
.metatag {
	color:#ccc;
	background:url(images/tag2.png) left center no-repeat;
	padding:0 0 0 16px;
}
.clear {
	clear:both;
}

/* ---------- pages the WordPress theme never had ---------- */

/* /archive/ and /topics/ have no counterpart on the live site — WordPress only
 * ever rendered dated and taxonomy archives, which are the .entry lists above.
 * These borrow the theme's own metrics so they read as part of the same site. */

.year-group {
	margin:0 0 18px;
}
.year-group h2 {
	font-size:1.3em;
	margin:0 0 4px;
	padding:0 0 3px;
	background:url(images/bg_meta.png) no-repeat bottom center;
}
/* Both live inside .entry, so they have to out-specify `.entry ul` (which
 * indents by 40px) and `.entry li` (which pads 8px between items). */
.entry .year-list, .entry .taxonomy {
	list-style:none;
	margin:0;
}
.entry .year-list li, .entry .taxonomy li {
	padding:2px 0;
	line-height:1.4em;
}
/* Flex row, not an inline-block date, so a title long enough to wrap keeps its
 * hanging indent instead of running back under the date column. */
.entry .year-list li {
	display:flex;
	gap:0 8px;
}
.year-list time {
	/* Wide enough for the longest month name plus a two-digit day. */
	flex:0 0 9.5em;
	color:#777;
	font-size:.9em;
}
.count {
	color:#777;
	font-size:.9em;
}
.count::before {
	content:"— ";
}
.lede, .empty {
	color:#777;
}

/* DEVIATION: the live theme is fixed-width and predates phones entirely, so
 * below its 798px it just overflows. Everything here is scoped under a
 * max-width so the desktop rendering above is untouched. */
@media (max-width:820px) {
	#container, #content, #header, #nav, #footer {
		width:auto;
		max-width:100%;
	}
	.content-top, .content-bottom {
		width:auto;
	}
	#container {
		background:#fff;
	}
	#primary-content, #sidebar {
		float:none;
		width:auto;
		margin:0;
		overflow:visible;
	}
	#sidebar {
		padding:8px 0 16px;
		background:url(images/bg_meta.png) no-repeat top center;
	}
	.left-sidecolumn, .right-sidecolumn {
		float:none;
		width:auto;
	}
	#footer {
		height:auto;
		padding:10px 0 14px;
		/* The mid-tone of bg_footer.png, which is too narrow to tile here. */
		background:#252424;
	}
	#footer p {
		padding:0;
	}
	.year-list time {
		display:block;
		width:auto;
	}
}