@charset "utf-8";
@import url(https://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,600italic,700italic,800italic,400,300,600,700,800&subset=latin,greek);

*
{
	overflow: visible;
	tab-size: 4; /* seriously, who uses 8 and why? */
}

html
{
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	min-width: 100%;
	min-height: 100%;
	margin: 0;
	padding: 0;
	padding-top: 8px;
	padding-bottom: 24px;
	background-color: #EEEEEE;
	color: #113311;
	font-family: "Open Sans", sans-serif;
	font-size: 0.85em;
	font-weight: 400;
}
body
{
	width: 80%;
	margin: auto;
	padding-left: 7px;
	padding-right: 0px;
	padding-top: 0px;
	padding-bottom: 2px;
	background-color: #F7F7F7;
}

/* headers */
h1, h2, h3, h4, h5, h6
{
	color: darkgreen;
	margin-top: 0.8em;
	margin-bottom: 0px;
	font-weight: 100;
}
h1 { font-size: 2.25em; margin-top: 0px; }
h2 { font-size: 2.00em; border-bottom: 1px dashed rgba(0,0,0, 0.25); }
h3 { font-size: 1.80em; }
h4 { font-size: 1.60em; }
h5 { font-size: 1.40em; }
h6 { font-size: 1.20em; }
h1+*, h2+*, h3+*, h4+*, h5+*, h6+*
{
	margin-top: 4px;
}

/* links */
a
{
	color: #007700;
}
a:link
{
	font-weight: bold;
	text-decoration: none;
}
a:visited
{
	font-weight: bold;
	text-decoration: none;
}
a:hover
{
	font-weight: bold;
	text-decoration: underline;
}
a:active
{
	color: orange;
	font-weight: bold;
	text-decoration: underline;
}

/* There's got to be a better way to do this */
h1 a, h2 a, h3 a, h4 a, h5 a, h6 a,
h1 a:link, h2 a:link, h3 a:link, h4 a:link, h5 a:link, h6 a:link,
h1 a:visited, h2 a:visited, h3 a:visited, h4 a:visited, h5 a:visited, h6 a:visited,
h1 a:hover, h2 a:hover, h3 a:hover, h4 a:hover, h5 a:hover, h6 a:hover,
h1 a:active, h2 a:active, h3 a:active, h4 a:active, h5 a:active, h6 a:active
{
	font-weight: 400;
}

/* tables */
table
{
	border-collapse: collapse;
	border: none;
	border-left: none;
	border-right: none;
	border-top: none;
	border-bottom: none;
	empty-cells: show;
}
table, tr, th, td
{
	text-align: center;
	vertical-align: middle;
	padding-left: 4px;
	padding-right: 4px;
}
th, td
{
	border-left: 1px solid black;
	border-right: 1px solid black;
}
th
{
	border-bottom: 1px solid black;
}
tr:nth-child(even)
{
	background: rgba(0, 0, 0, 0.1);
}
th, tr:nth-child(odd)
{
	background: rgba(255, 255, 255, 0.1);
}
th, tr:first-child
{
	border-top: 1px solid black;
}
tr:last-child
{
	border-bottom: 1px solid black;
}
.borderless
{
	border: 1px solid transparent;
	border-left: 1px solid transparent;
	border-right: 1px solid transparent;
	border-top: 1px solid transparent;
	border-bottom: 1px solid transparent;
	padding: 0px;
	padding-left: 0px;
	padding-right: 0px;
	padding-top: 0px;
	padding-bottom: 0px;
}
.rightedgecell
{
	background: #F7F7F7;
	text-align: left;
	border: none;
	border-top: 1px solid transparent;
	border-bottom: 1px solid transparent;
}

/* special things */
#logo
{
	display: block;
	padding-top: 7px;
	padding-bottom: 7px;
	width: 100%;
	height: auto;
	max-width: 305px;
	max-height: 43px;
}
#face
{
	float: right;
	position: relative;
	top: 0px;
	display: inline-block;
	width: 120px;
	height: 120px;
	background-image: url("/LB.png");
	background-size: 120px 120px;
	background-repeat: no-repeat;
	transition-property: background-image;
	transition-delay: 0s;
	transition-duration: 1s;
}
#face:hover
{
	background-image: url("/face.jpg");
}
.g-plusone
{
	height: 24px;
	display: inline-block;
}
div + h2
{
	padding-top: 0px;
	margin-top: 0px;
}

/*
@-webkit-keyframes download
{
	0%   { opacity: 0.0; transform: scaleX(0.1); }
	100% { opacity: 1.0; transform: scaleX(1.0); }
}
body
{
	-webkit-animation-name: download;
	-webkit-animation-duration: 1s;
	-webkit-animation-timing-function: ease-out;
	-webkit-animation-fill-mode: both;
}
*/ /* ^ it doesn't play nicely with the +1 buttons' hover cards */

/* monospace things */
pre, code, kbd, samp, tt, .monofont
{
	font-family: monospace, "Courier New", "Courier";
	white-space: pre;
}

/* forms */
fieldset, fieldset > legend
{
	border-radius: 1em;
	border: 1px solid gray;
}
fieldset
{
	border-left: none;
	border-right: none;
}
fieldset > legend
{
	border-top: none;
	border-bottom: none;
}
fieldset.split
{
	border-radius: 0px;
	border: none;
	border-top: 1px dashed gray;
	margin-top: 0.5em;
	margin-bottom: -1em;
}
fieldset.split > legend
{
	border: none;
	text-align: center;
	font-weight: 100;
}

/* cryptocurrencies */
.cryptocurrencies code
{
	display: inline-block;
	width: 0px;
	overflow: hidden;
	transition-property: width;
	transition-delay: 0s;
	transition-duration: 1s;
}
.cryptocurrencies > span:hover code
{
	width: 35ch;
}
.cryptocurrencies > span:nth-child(n)::after
{
	content: ',';
}
.cryptocurrencies > span:last-child::after
{
	content: '';
}

/* codeblock */
.codeblock, .codeblock tr, .codeblock td
{
	text-align: left;
	border-collapse: collapse;
	border: none;
	margin: 0px;
	padding: 0px;
	background: none;
}
.codeblock, .codeblock kbd
{
	font-family: monospace, sans-serif;
	font-size: 14px;
	margin: 0px;
}
.codeblock
{
	display: inline-block;
	border: 3px solid #EFEFEF;
	padding: 0px;
	border-radius: 10px;
	counter-reset: linenumbers;
	background-color: white;
}
.codeblock tr td:last-child
{
	white-space: pre;
	display: block;
	margin: 0px;
	padding: 0px;
	color: black;
}
.codeblock tr td:last-child:empty::after
{
	content: "\A";
}
.codeblock tr td:first-child
{
	text-align: right;
	background-color: #EFEFEF;
}
.codeblock tr td:first-child::before
{
	user-select: none;
	display: inline-block;
	counter-increment: linenumbers;
	content: counter(linenumbers);
	text-align: right;
	color: #555555;
	padding: 0px;
	padding-right: 2px;
	margin: 0px;
	max-width: none;
}
.codeblock tr:hover td:last-child
{
	background-color: rgba(0,0,0, 0.05);
	border-radius: 1em;
	border-top-left-radius: 0;
	border-bottom-left-radius: 0;
}
.codeblock a
{
	background-color: rgba(0,0,255, 0.05);
	color: inherit;
}
.codeblock a:link
{
	color: inherit;
	font-weight: normal;
	text-decoration: none;
}
.codeblock a:visited
{
	color: inherit;
	font-weight: normal;
	text-decoration: none;
}
.codeblock a:hover
{
	color: inherit;
	background-color: rgba(0,0,255, 0.25);
	font-weight: normal;
	text-decoration: underline;
}
.codeblock a:active
{
	color: inherit;
	font-weight: normal;
	text-decoration: underline;
}
.codeblock kbd
{
	color: blue;
}
.codeblock .preproc
{
	color: darkblue;
}
.codeblock .header
{
	color: purple;
}
.codeblock .comment
{
	color: green;
}
.codeblock .string
{
	color: darkorange;
}
.codeblock .number
{
	color: red;
}

/* blockquotes */
blockquote
{
	margin-left: 1px;
	margin-right: 1px;
	margin-top: 5px;
	margin-bottom: 1px;
	padding: 0;
	border-top: 1px solid rgba(0,0,0, 0.75);
	border-bottom: 1px solid rgba(0,0,0, 0.75);
	border-radius: 10px;
	background-color: rgba(0,0,0, 0.05);
}
blockquote > p
{
	margin: 3px 5px;
	padding: 0;
}
blockquote + p
{
	margin-top: 0;
}
blockquote::after
{
	display: block;
	content: attr(cite);
	font-size: 0.75em;
	text-align: right;
	margin-right: 10px;
	color: rgba(0,0,0, 0.75);
}

/* totally not an advertisement for my blog *//*
head, head::after
{
	display: block;
}
head::after
{
	content: "LB-Stuff.com is not my blog, and doesn't contain blog posts. However, TotallyNotA.Ninja is and does. Ninjas know how to type that URL in to their address bar, but you totally aren't a ninja so I guess you'll never see it.";
	font-style: italic;
}*/

@media all and (max-width: 640px)
{
	html
	{
		padding-left: 8px;
		padding-right: 8px;
	}
	body
	{
		padding-right: 7px;
	}
	#face
	{
		float: none;
		position: relative;
		display: none;
		width: 0px;
		height: 0px;
	}
}

/* input placeholders should not be affected by font of the actual input */
::-webkit-input-plceholder { font-family: "Open Sans", sans-serif; }
::-moz-plceholder { font-family: "Open Sans", sans-serif; }
:-ms-inout-plceholder { font-family: "Open Sans", sans-serif; }
::input-plceholder { font-family: "Open Sans", sans-serif; }