/*
Theme Name: Jeremy 8
Theme Author: Jeremy Visser
Copyright: Copyright Ⓒ 2015 by Jeremy Visser. All rights reserved.
*/

body {
	font: 10pt Verdana, sans-serif;

	background: url(background.png) top center no-repeat #204a87;

	color: #ffffff;

	margin: 0;
	padding: 0;

	position: relative;
	z-index: -10; /* if we don't do this, the sidebar (-1) is unclickable */
}

a {
	color: #204a87;
	text-decoration: none;
	outline: none;
}

a:hover {
	text-decoration: underline;
}

a:focus {
	outline: 1px solid #babdb6;
	background: #eeeeec;
}

code, pre {
	font-family: "DejaVu Mono", "Bitstream Vera Mono", monospace;
	font-size: normal;
}

h1, h2, h3 {
	font-family: "Trebuchet MS", Helvetica, sans-serif;
	font-weight: normal;
	letter-spacing: -1px;
	text-shadow: #babdb6 1px 1px 1px;
}

h1 {
	font-size: 28pt;
	text-shadow: #000000 0 0 4px;
}

h2 {
	font-size: 18pt;
}

h3 {
	font-size: 14pt;
}

blockquote {
	border-left: 1em solid #eeeeec;
	margin: 0;
	padding: 0 0 0 1em;
	overflow: auto;
}

pre {
	margin: 0.5em 0;
	padding: 0;
}

#header-outer, #content-outer, #sidebar-outer, #footer-outer {
	max-width: 800px;
	margin: 0 auto;
	overflow: hidden;
}

#header-outer, #content-outer {
	padding: 2em;
}

#header-outer {
	padding-bottom: 0;
	margin: 1em auto 0;
}

#content-outer {
	padding-top: 0;
}

#header-inner, #content, #sidebar {
	box-shadow: #000 0 0 2em;
}

#header-inner {
	border-top-left-radius: 1em;
	border-top-right-radius: 1em;
}
#content {
	padding-top: 1em;
	margin-top: -1em;
	border-bottom-left-radius: 1em;
	border-bottom-right-radius: 1em;
}
#sidebar {
	border-bottom-left-radius: 1em;
	border-bottom-right-radius: 1em;
}

#header hr {
	display: none;
}

#header {
	position: relative; /* allow nav menu to stay within header */
	color: #ffffff;
}

#header-inner {
	background: #72d115;
	background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzcyZDExNSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiM1M2EyMDgiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
	background: -moz-linear-gradient(top,  #72d115 0%, #53a208 100%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#72d115), color-stop(100%,#53a208));
	background: -webkit-linear-gradient(top,  #72d115 0%,#53a208 100%);
	background: -o-linear-gradient(top,  #72d115 0%,#53a208 100%);
	background: -ms-linear-gradient(top,  #72d115 0%,#53a208 100%);
	background: linear-gradient(to bottom,  #72d115 0%,#53a208 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#72d115', endColorstr='#53a208',GradientType=0 );
	padding-bottom: 1em;
	margin-bottom: -1em;
}

#header h1 {
	font: bold 26pt Helvetica, Arial, sans-serif;
	-webkit-font-smoothing: antialiased;
	letter-spacing: -1px;
	margin: 0;
	padding: 0.51em 0.75em; /* 0.51 is a HACK due to box shadow pixel boundary rounding weirdness */
	border-bottom: 1px solid rgba(0,0,0,0.75);
}

#header h1 a {
	color: #ffffff;
	text-shadow: rgba(0,0,0,0.75) 0 0 3pt;
	text-decoration: none;
}
#header h1 a:hover {
	text-shadow: rgba(0,0,0,0.75) 0 0 3pt, rgb(255,255,255) 0 0 6pt;
}

#header .menu {
	display: block;
	position: absolute;
	right: 0;
	bottom: 1em;
	margin: 0;
	padding: 0;
	list-style: none;
}

#header .menu li {
	display: block;
	float: left;
	margin: 0 1em;
	line-height: 45px;
}

#header .menu li a {
	display: block;
	height: 100%;
	padding: 0 1em;
	margin-bottom: 1px;

	color: #ffffff;
	/* If you don't see any background, get a better browser. */
	background: rgba(255, 255, 255, 0.2);

	border-top-left-radius: 10px;
	border-top-right-radius: 10px;
}

#header .menu li.current_page_item a {
	color: #000000;
	background: #ffffff;
	text-decoration: none;
	margin-bottom: 0;
	padding-bottom: 1px;
}

#sidebar-outer {
	position: relative;
	z-index: -1;
	margin-top: -4em;
}

#sidebar {
	padding-top: 2em;
	margin: 0 2em 1em 2em;
	color: #000000;
	background: #eeeeec;
	overflow: auto; /* clear child floats */
}

#sidebar > ul {
	padding: 0;
	list-style: none;

	width: 33%;
	float: left;
}

#sidebar > ul:first-child {
	width: 34%; /* 33% times 3 is 99%, with 1% left over, made up for here */
}

#sidebar ul ul {
	padding: 0;
	list-style: none;
}

#sidebar > ul > li {
	padding: 0 1em 0 0;
}

#sidebar > ul:first-child > li {
	padding-left: 1em;
}

#sidebar ul ul li:first-child {
	border-top: 1px solid #d3d7cf;
}

#sidebar ul ul li {
	border-bottom: 1px solid #d3d7cf;
}

#sidebar h2 {
	font-size: 12pt;
}

#sidebar ul ul li a {
	display: block;
	padding: 0.2em 0;
}

#sidebar ul ul li p a {
	display: inline;
	padding: 0;
}

#footer {
	margin: 0 2em 2.5em;
	font-size: smaller;
}

#footer a {
	color: inherit;
}

#footer p.icon {
	float: right;
	clear: right;
	margin: 0 0 0 1em;
}
#footer p.icon a, #footer p.icon a img {
	border: 0;
}

#content {
	background: #ffffff;
	color: #000000;
	padding-left: 2em;
	padding-right: 2em;
	padding-bottom: 1em;
}

#content .hentry {
	margin: 1em 0;
}

#content .hentry + .hentry {
	border-top: 1px solid #babdb6;
}

#content .hentry > h2 {
	margin: 0.8em 0 0;
}

#content .hentry .postmetadata a[rel=tag], .tag-cloud a {
	color: #4E9A06;
}

#content p {
	line-height: 1.4em;
}

#content .hentry .entry a {
	text-decoration: underline;
}

#content .hentry li {
	margin: 0.5em 0;
}

#content .entry .alignleft {
	float: left;
	clear: left;
	margin-right: 1em;
	margin-bottom: 1em;
}
#content .entry .alignright {
	float: right;
	clear: right;
	margin-left: 1em;
	margin-bottom: 1em;
}
#content .entry .aligncenter {
	display: block;
	margin: auto;
	text-align: center;
}

#content .entry abbr, #content .entry acronym {
	border-bottom: 1px dashed #888a85;
}

#content .hentry .more-link, .navigation a {
	display: block;
	margin: 1em 0;
	padding: 0.5em 1em;
	width: 8em;

	box-shadow: #babdb6 1px 1px 1px;
	text-shadow: #babdb6 1px 1px 1px;
	border: 1px solid #204a87;
	border-radius: 5px;
}
#content .hentry.attachment .navigation a {
	width: auto;
}

#content .hentry .more-link {
	margin: 1em 0;
}

#content .hentry.attachment .entry .attachment {
	text-align: center;
}

.navigation {
	overflow: auto;
}

.navigation .alignleft {
	text-align: right;
	float: left;
}
.navigation .alignright {
	text-align: left;
	float: right;
}

.navigation .alignleft a {
	padding-left: 32px;
	background: url('go-previous.png') 8px center no-repeat;
}
#content .hentry .more-link, .navigation .alignright a {
	padding-right: 32px;
	/* CSS2 doesn't let us specify background-position from the right,
	   thus the 95%! AAAAAAARGH! */
	background: url('go-next.png') 95% center no-repeat;
}

#content .archives {
	column-count: 4;
	-moz-column-count: 4;
	-webkit-column-count: 4;

	padding: 0;
	list-style: none;
}

#comments {
	border-top: 1px solid #babdb6;
}

.commentlist, .comment .children {
	padding: 0;
	list-style: none;
}

.comment {
	position: relative;
	padding: 1px 0 1px 64px;
	border-top: 1px solid #babdb6;
}
.comment:last-child {	
	border-bottom: 1px solid #babdb6;
}

.comment .comment-meta {
	margin: 1.5em 0;
	font-size: smaller;
}

.comment .avatar {
	position: absolute;
	top: 1em;
	left: 0;
	border-radius: 4px;
}

.comment .children {
	background: rgba(0,0,0,0.05);
}
.comment .children .comment {
	padding-left: 70px;
}
.comment .children .comment .avatar {
	left: 8px;
}
.comment .children .comment:last-child {
	border-bottom: none;
}

.comment .comment-author cite {
	display: block;
	margin: 0.75em 0;
	font-family: "Trebuchet MS", Helvetica, sans-serif;
	letter-spacing: -1px;
	text-shadow: #babdb6 1px 1px 1px; 
	font-weight: normal;
	font-style: normal;
	font-size: larger;
}
.comment .comment-author .says {
	display: none;
}

.comment .comment-body {
	margin-right: 4em;
}
.comment .comment-body p {
	margin-top: 0;
}

.comment .reply a {
	position: absolute;
	bottom: 16px;
	right: 16px;

	height: 16px;
	line-height: 16px;

	padding-right: 24px;
	background: url('reply.png') no-repeat center right;

	z-index: 1;
}

#comments #respond {
	clear: both;
}

.talks-gallery a {
	display: block;
	position: relative;
	float: left;
	margin: 1em 1em 1em 0;
	width: 250px;
	height: 188px;
	border: 4px solid #babdb6;
	border-radius: 5px;
	color: #fff;
	text-shadow: 2px 2px 2px #000;
	background: #000;
}

.talks-gallery a:hover {
	border: 4px solid #204a87;
	box-shadow: 0 2px 2px #000;
	text-decoration: none;
}

.talks-gallery img {
	display: block;
	margin: 0; padding: 0;
	border: 0;
}

.talks-gallery span {
	display: block; /* crazy, I know, but wpautop() borks on <div>'s and inserts erroneous <p>'s */
	position: absolute;
	bottom: 0; left: 0; right: 0;
	background: rgba(0,0,0,0.5);
	border-top: 1px solid rgba(0,0,0,0.7);
	padding-left: 4px;
}

/* Mobile styles */

.mobile-only {
	display: none;
}

@media only screen and (max-device-width: 480px) {

	.mobile-only {
		display: block;
	}

	.skip-navigation {
		position: absolute;
		top: 0;
		right: 0;
		margin: 2em 1em;
	}

	.skip-navigation a {
		display: block;
		color: white;
		border: 1px solid white;
		padding: 0.2em;
		border-radius: 0.5em;
	}

	body {
		background-image: none;
	}

	#header h1 {
		padding-left: 0.4em;
	}

	#header .menu {
		display: none;
	}

	#header-outer, #content-outer {
		padding: 0;
		margin: 0;
	}

	#header-outer, #content-outer, #sidebar-outer, #footer-outer {
		width: auto;
	}

	#header-inner {
		border-radius: 0;
	}

	#content {
		padding-left: 1em;
		padding-right: 1em;
	}

	#header-inner, #content, #sidebar {
		box-shadow: none;
	}

	.comment {
		padding-left: 0;
	}

	.comment .avatar {
		position: static;
		float: right;
	}

	.comment .comment-body {
		margin-right: 1em;
	}

	.comment .children {
		margin-left: 2em;
	}

	.comment .children .comment {
		padding-left: 1em;
	}

	#sidebar-outer {
		margin-top: -2em;
	}

	#sidebar {
		margin: 0;
	}

	#sidebar > ul:first-child, #sidebar > ul {
		width: auto;
		float: none;
	}

	#sidebar > ul > li {
		padding: 0 1em;
	}

}

/* Styles for the WP-Syntax plugin: */

.wp_syntax {
	color           : #100;
	background-color: #f9f9f9;
	border          : 1px solid silver;
	margin          : 0 0 1.5em 0;
	overflow        : auto;
}

/* IE FIX */
.wp_syntax {
	overflow-x    : auto;
	overflow-y    : hidden;
	padding-bottom: expression(this.scrollWidth > this.offsetWidth ? 15 : 0);
	width         : 99%;
}

.wp_syntax table {
	border         : none !important;
	border-collapse: collapse !important;
	margin         : 0 !important;
	padding        : 0 !important;
	width          : 100% !important
}

.wp_syntax caption {
	margin          : 0 !important;
	padding         : 2px !important;
	width           : 100% !important;
	background-color: #def !important;
	text-align      : left !important;
	font-family     : monospace !important;
	font-size       : 12px !important;
	line-height     : 1.2em !important;
}

.wp_syntax caption a {
	color          : #1982d1 !important;
	text-align     : left !important;
	font-family    : monospace !important;
	font-size      : 12px !important;
	line-height    : 16px !important;
	text-decoration: none !important;
}

.wp_syntax caption a:hover {
	color          : #1982d1 !important;
	text-decoration: underline !important;
}

.wp_syntax div, .wp_syntax td {
	border        : none !important;
	text-align    : left !important;
	padding       : 0 !important;
	vertical-align: top !important;
}

.wp_syntax td.code{
	background-color: #EEE;
	background-image: -webkit-linear-gradient( transparent 50%, rgba(255, 255, 255, .9) 50% );
	background-image: -moz-linear-gradient( transparent 50%, rgba(255, 255, 255, .9) 50% );
	background-image: -ms-linear-gradient( transparent 50%, rgba(255, 255, 255, .9) 50% );
	background-image: -o-linear-gradient( transparent 50%, rgba(255, 255, 255, .9) 50% );
	background-image: linear-gradient( transparent 50%, rgba(255, 255, 255, .9) 50% );
	background-size : 1px 32px;
	line-height     : normal !important;
	white-space     : normal !important;
	width           : 100% !important;
}

/* potential overrides for other styles */
.wp_syntax pre {
	background           : transparent !important;
	border               : none !important;
	margin               : 0 !important;
	padding              : 0 !important;
	width                : auto !important;
	float                : none !important;
	clear                : none !important;
	overflow             : visible !important;
	font-family          : monospace !important;
	font-size            : 12px !important;
	line-height          : 16px !important;
	padding              : 0 4px !important;
	white-space          : pre !important;
	box-shadow           : 0px 0px 0px rgba(0, 0, 0, 0) !important; /* Opera 10.5, IE 9.0 */
	border-radius        : 0 !important;
}

.wp_syntax td.line_numbers pre {
	background-color: #def !important;
	color           : gray !important;
	text-align      : right !important;
	width           : 16px !important;
}

/*	If you go down in the woods today
		You're sure of a big surprise.
	If you go down in the woods today
		You'd better go in disguise.

	For ev'ry bear that ever there was
		Will gather there for certain, because
	Today's the day the teddy bears have their picnic. */

