/*  Google Font */
@font-face { font-family: 'Reenie Beanie'; font-style: normal; font-weight: 400; src: local('Reenie Beanie'), local('ReenieBeanie'), url(https://fonts.gstatic.com/s/reeniebeanie/v7/ljpKc6CdXusL1cnGUSamXzxObtw73-qQgbr7Be51v5c.woff2) format('woff2'),url(https://fonts.gstatic.com/s/reeniebeanie/v7/ljpKc6CdXusL1cnGUSamXybsRidxnYrfzLNRqJkHfFo.ttf) format('truetype'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215, U+E0FF, U+EFFD, U+F000; }
/* The Rest */

body {
	font-family: PT Sans, Gill Sans, Trebuchet MS, Sans Serif;
	font-size: 13pt;
	margin: 0px;
	color: black;
	background: url(/img/big-blue-bg.jpg);
	margin-bottom: 4em;
}
#whitebg,
.glyph {
	display: none;
}
h1,
h2,
h3,
h4 {
	font-family: 'Reenie Beanie', cursive;
	font-weight: 100;
	margin: 0.2em;
}
h1 a,
h2 a,
h3 a,
h4 a {
	text-decoration: none;
}
h1 a:hover,
h2 a:hover,
h3 a:hover,
h4 a:hover {
	text-decoration: underline;
	color: #ffffff;
}
h1 {
	margin-top: 0.5em;
	font-size: 330%;
}
h2 {
	font-size: 200%;
}
h3 {
	font-size: 180%;
}
h4 {
	font-size: 150%;
}
header {
	background-color: white;
	background: url(/img/white-bg.jpg) left bottom repeat;
	box-shadow: 0em 0em 1em #000;
	text-align: center;
}

header logo a:hover {
	color: #000;
}

header .parts .logo {
	vertical-align: top;
	display: table-cell;
	text-align: center;
}
header .parts .logo h1 {
	font-size: 330%;
	font-weight: thin;
	line-height: 50%;
	color: rgba(0,0,0,0.3);
}
header .parts .logo h1 .ws {
	padding-left: 0.4em;
}
header .parts nav ul {
	text-align: center;
	font-family: 'Reenie Beanie', cursive;
	font-size: 180%;
	list-style-type: none;
	display: inline-block;
	margin: 0;
	padding: 0;
}
header .parts nav li {
	display: inline-block;
	padding: 0.1em;
	border-right: 1px dashed #aaaaaa;
}
header a, header a:visited {
	color: #257;
}
header .parts nav li:last-of-type {
	border-right: none;
}
header .parts nav h2 {
	font-family: 'Reenie Beanie', cursive;
	font-size: 140%;
	text-align: left;
}
header .parts nav li:nth-child(even) {
	transform: rotate(2deg);
	-moz-transform: rotate(2deg);
}
header .parts nav li:nth-child(odd) {
	transform: rotate(-2deg);
	-moz-transform: rotate(-2deg);
}
header .parts nav li.current a {
	color: red;
	background: rgba(0,0,0,0.2);
	border-radius: 10px;
	padding: 4px;
}
header .parts a {
	text-decoration: none;
	text-shadow: white 1px 1px 1px;
	transition: color 1s, transform 0.4s;
	-webkit-transition: color 1s, -webkit-transform 0.4s;
	transform: scale(1);
	border: 1px solid rgba(0,0,0,0);
	display: block;
	outline: 0;
}
header li a:hover {
	color: #000000;
	transform: scale(1.1)translateY(0.2em)rotate(-2deg);
	-webkit-transform: scale(1.2)translateY(0.2em);
	background: #ffffff;
	box-shadow: 0px 0px 20px #ffffff;
	/*border: 1px solid red;*/
	border-radius: 10px;
	z-index: 2000;
}
header .parts a:active {
	border: none;
}
#everything {
	clear: both;
	position: relative;
	margin-top: 1em;
}
.sidebar a, .sidebar a:visited {
	color: #fff;
}

article h2, article h3, article h4 {
	color: #222;
	text-shadow: 2px 2px 2px #fff;
}

article {
	border-radius: 5px;
	padding: 1em;
	display: inline-block;
	background: rgba(200,220,250,0.9);
	position: relative;
	margin-bottom: 1em;

}

article h2 {
	font-size: 220%;
	font-style: normal;
	text-align: center;
	text-transform: lowercase;
}
article h2:nth-of-type(even) {
	-moz-transform: rotate(1deg);
}
article h2:nth-of-type(odd) {
	-moz-transform: rotate(-1deg);
}
article a {
	color: #000;
}
article img {
	padding: 4px;
	width: 100%;
	height: auto;
	background: #fff;
	box-shadow: 1px 1px 3px rgba(0,0,0,0.3);
}
article.tiles img {
	margin: auto;
}
article img.size-medium {
	max-width: 400px;
}
blockquote {
	background: #eee;
	border-radius: 1em;
	padding: 0.1em 1em;
	box-shadow: 0 0 1em #eee;
	font-family: 'Gentium', Serif;
	line-height: 1.4em;
	font-weight: 10;
	text-align: justify;
	max-width: 800px;
	margin: auto;
	background: url(/img/white-bg.jpg) left bottom repeat;
}

.blog_list {
	list-style-type: none;
}
.blog_list li {
	display: block;
	border-bottom: 1px dotted rgba(255,255,255,0.5);
}
.blog_list li h3 {
	padding: 0;
	margin: 0.4em 0 0 0;
}
.blog_list .date {
	display: block;
	font-size: 70%;
}

@media screen and (min-width:500px) {
	header {
		margin-bottom: -2px;
		box-shadow: none;
	}

	header .parts .logo {
		width: 200px;
		display: table-cell;
	}
	header .parts nav {
		display: table-cell;
		text-align: center;
	}

	#whitebg {
		display: block;
		position: absolute;
		top: 0;
		right: 0;
		background: url(/img/white-bg.jpg);
		z-index: -10;
		width: 50%;
	}
	.glyph {
		display: block;
		position: fixed;
		opacity: 0.4;
		top: 0px;
	}
	#everything {
		width: 80%;
		padding: 1%;
		margin: auto;
		display: flex;
	}
	#everything.tiles, #everything.multiple-articles {
		display: block;
	}
	article.two_thirds {
		width: 65%;
	}
	.sidebar {
		margin-left: 1em;
		display: inline-block;
		width: 30%;
		background: rgba(0,0,0,0.3);
		color: #ccc;
		font-size: 90%;
		vertical-align: top;
	}
	#tear {
		margin: 0;
		display: block;
		width: 100%;
		height: 80px;
		background: url(/img/topbar-white.png) left bottom repeat-x ;
	}

	header .parts {
		max-width: 800px;
		margin: auto;
		width: 90%;
	}

	article img {
		float: right;
		margin: 1em;
	}

	article img.alignleft {
		float: left;
	}

	article img.aligncenter {
		float: none;
		text-align: center;
		display: block;
		margin: auto;
	}
	aside.meta {
		float: right;
		position: absolute;
		top:-1em;
		right: 2em;
		padding: 1em;
	}
	.bd-date {
		position: absolute;
		top:0;
		right: 0;
		z-index: -1;
		font-size: 50px;
	}


}


.highlight {
	padding: 0.7em;
	border-radius: 0.5em;
	color: #bbb;
	position: relative;
	margin: auto;
	overflow: scroll;
}
ul.tags {
	padding: 0.5em 0;
	font-size: 80%;
	color: #000;
}
ul.tags li {
	display: inline;
	background: #ccc;
	padding: 0.2em;
	border-radius: 0.4em 0 0.4em 0;
	box-shadow: 1px 1px 1px rgba(0,0,0,0.5);
	border: 0.1px solid rgba(0,0,0,0.2);
}
ul.tags li:before {
	content: "#";
	color: #777;
}
a.section_color {
	color: #000;
	-moz-transform: rotate(-30deg);
	float: left;
	position: absolute;
	left: -3em;
	top: 0.5em;
	font-size: 80%;
	text-decoration: none;
}
.postlist li {
	position: relative;
	list-style: none;
	border-top: 1px dashed rgba(0,0,0,0.5);
}
a.section_color:before {
	content: "/";
}

footer {
	width: 80%;
	border-radius: 3px 2em;
	text-align: center;
	background: rgba(0,0,0,0.5);
	color: #fff;
	padding: 1em 0;
	margin: 1em auto;
	box-shadow: 0 0 20px rgba(0,0,0,0.5);
}
footer a, footer a:visited {
	color: #fff;
	text-decoration: none;
}
footer a:hover {
	text-decoration: underline;
}
aside.meta {
	background: #fff;
	display: block;
	box-shadow: 1px 1px 2px rgba(0,0,0,0.2);
	text-align: center;
}
.img_thumb {
	min-height: 30vw;
	background-size:contain;
}

.videobox {
	width: 90%;
	height: 0;
	padding: 67% 0 0 25px;
	overflow: hidden;
	position: relative;
	margin: auto;
}
.videobox iframe {
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	position: absolute;
}

article.tiles {
	vertical-align: top;
}

.tldr {
	display: flex;
}

.tldr .content {
	background-color: #fff;
	padding: 0.8em;
	border-radius: 1em;
}
.tldr h2.right {
	transform: rotate(90deg);
	-moz-transform: rotate(90deg);
	order: 2;
	margin: 0;
	padding: 0;

}

.cv_section {
	display: flex;
}
.cv_section h2, .cv_section h3 {
	text-shadow: none;
	width: 1.5em;
}

.cv_section .side-title {
	width: 2em;
	display: flex;
	align-items: center;
}

.side-title.right {
	order: 2;
}

.side-title.left {
	order: 0;
}

.cv_section h2.right {
	transform: rotate(90deg);
	-moz-transform: rotate(90deg);
	margin-left: -0.2em;
}

.cv_section h2.left {
	transform: rotate(-90deg);
	-moz-transform: rotate(-90deg);
	margin-left: -0.3em;
}

.cv_section .content {
	background-color: #224422;
	border-radius: 1em;
}

.cv_section .content .cv_subsection {
	display: table-row;
	padding-bottom: 1em;
}

.cv_section .content .cv_subsection h3 {
	color: #fff;
	padding: 0.1em;
	display: table-cell;
	text-align:center;
}
.cv_section .content .cv_subsection .content {
	background-color: rgba(255,255,255,0.5);
	padding: 0.4em;
	display: table-cell;
	border-radius: 0;
	border-bottom: 0.2em solid rgba(0,0,0,0.6);
}
.cv_section .content .cv_subsection:first-of-type .content {
	border-radius: 0 1em 0 0;
}

.cv_section .content .cv_subsection:last-of-type .content {
	border-radius: 0 0 1em 0;
	border-bottom: none;
}

.cv_section .content p {
	margin: 0;
}

article#pagination {
	width: 100%;
	text-align: center;
}
#pagination ul, #pagination li {
	display: inline;
}

@media screen and (min-width:1020px) {
	#everything {
		width: 1000px;
	}
	#everything article.tiles {
		width: 46%;
	}
}
