@font-face {
    font-family: 'open_sans';
    src: local('Open Sans'),
         url('/skin/opensans_regular_macroman/OpenSans-Regular-webfont.woff') format('woff'),
         url('/skin/opensans_regular_macroman/OpenSans-Regular-webfont.ttf') format('truetype'),
         url('/skin/opensans_regular_macroman/OpenSans-Regular-webfont.svg#open_sansregular') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'open_sans';
    src: local('Open Sans Bold'),
         url('/skin/opensans_bold_macroman/OpenSans-Bold-webfont.woff') format('woff'),
         url('/skin/opensans_bold_macroman/OpenSans-Bold-webfont.ttf') format('truetype'),
         url('/skin/opensans_bold_macroman/OpenSans-Bold-webfont.svg#open_sansbold') format('svg');
    font-weight: bold;
    font-style: normal;
}

body {
	padding: 0px;
	margin: 0px;
	background-color: #fff;
	background: repeating-linear-gradient(transparent, transparent 24px, #9198e5 24px, #9198e5 25px), url("/images/background-dice-binary.png") no-repeat fixed center -152px #fff;
	background: url("/images/background-dice-binary.png") no-repeat fixed center -152px #fff;
	color: #222;
	font-family: "open_sans", "Liberation Sans", Helvetica, Arial, sans-serif;
	font-size: 11pt;
	line-height: 25px;
}

a, .action {
	text-decoration: underline;
	cursor: pointer;
	color: #00B;
}
a:visited {
	color: #551A8B;
}
a:hover {	color: #77B;
}

a img{border-width:0}
p, li {
    background-color: rgba(255,255,255,0.3);
}
p img{vertical-align:middle}
ol, ul {
	margin: 0 0 25px;
	padding: 0;
}
li {
	padding: 0 0 0 0.2em;
	margin: 0 0 12.5px 1.2em;
}
ol > li > ol, ol > li > ul, ul > li > ol, ul > li > ul {
	margin-bottom: 0;
}
ol > li > ol, ul > li > ol {
	list-style: lower-alpha
}
h1, h2, h3, h4 { margin: 0; color: #333; font-weight: bold }
h1 { margin: 0; line-height: 1.3em }
h1 a:link, h1 a:visited, h1 a:hover, h1 a:active { color: #333; text-decoration: none }
h2 { font-size: 2.59em; margin: 15px 0 20px; line-height: 40px }
h3 { font-size: 1.61em; margin: 35px 0 15px; }
h4 { font-size: 1em; }
q { quotes: none; }
q:before, q:after { content: ""; }
table, td, th {
        border: solid 1px #ccc;
	border-collapse: collapse;
	padding: 0.5em;
	vertical-align: top;
}
th { background-color: #e6e6e6; }
table.invisible
{
	margin: 1ex;
	border-collapse: collapse
}
table.invisible td
{
	padding: 0ex 1ex;
}
td.right
{
	text-align: right;
}
#pageFooter {
	font-size: 8pt;
	clear: both;
	padding: 25px 0 25px 0;
	text-align: center;
	color: #999;
}
hr {
	height: 0;
	border: 0;
	border-top: 1px solid #999;
	margin: 25px 0 24px;
}

#pageTitle, .pageSubTitle, #pageFooter, .content {
	width: 960px;
	margin: 0 auto;
	padding-left: 10px;
	padding-right: 10px;
}
.content {
	display: grid;
	-ms-grid-columns: 1fr 1fr 1fr 1fr;
	grid-template-columns: repeat(4, 1fr);
}
div.pageHeader {
	margin: 0 0 1em;
	background: url("/images/header-dice-wide.jpg") no-repeat fixed top center #D8E2EC;
	height:135px;
	box-shadow: 0 0 10px 0 #444;
}

h1#pageTitle {
	color: #333;
	font-size: 4.17em;
	font-weight: bold;
	padding: 0
}

ul#bloglist {
	background-color: #fff;
	border-bottom: 1px solid #000;
	margin: 0 1px;
	padding: 0;
	list-style-type:none;
	padding: .5ex 0;
}
ul#bloglist li {
	border-right: 1px solid #000;
	display: inline;
	padding: .5ex 1em;
}

a.BlogButton,
a.BlogButtonCurr {
	font-weight: bold;
	text-decoration: none;
}
a.BlogButton {
	color: #000;
}
a.BlogButton:hover {
	text-decoration: underline;
	color: #9ae;
}
a.BlogButtonCurr,
a.BlogButtonCurr:visited {
	color: #78a;
}
a.BlogButtonCurr:hover {
	text-decoration: underline;
	color: #9ae;
}


.pageSubTitle {
	color: #333;
	letter-spacing: 2px;
	font-size: 109%;

}
div.stats{
	float: right;
	padding-right: 1px;
	padding-top: 1px;
	padding-bottom: 1px;
	padding-left: 0px;
}

/* Styles for posts */
.bPosts {
	-ms-grid-column: 1;
	-ms-grid-column-span: 3;
	grid-column-start: 1;
	grid-column-end: 4;
	max-width: 100%;
}
.bPost, .bPostpublished
{
	clear: both;
	margin: 0 15px 10px 10px;
}

.bSmallHead {
	font-size: 80%;
	margin: 2ex 0 1ex 0;
}

.bSmallPrint
{
	clear: both;
	color: #778;
	font-size: 80%;
	margin: 1ex 15px 2ex 0;
}

.bComment {
    margin: 1.5em 0;
    border-bottom: 1px solid #ccc;
    padding: 0 0 1.5em;
}

input[type="number"] { width: 3em }

input.bComment,
textarea.bComment
{
	background-color: #eee;
	border: 1px solid #ccc;
	width: 97%;
	padding: 2px;
	margin: 0ex;
}
select.bComment		/* Used by the profile form */
{
	background-color: #eee;
	border: 1px solid #ccc;
	padding: 1px;
	margin: 0ex;
}


/* Styles for stats */
div.statbloc
{
	float: left;
	width: 44%;
	margin: 0 0 2ex 1.5ex;
	border: 1px solid #78a;
}
div.statbloc h3
{
	margin-top: 0px;
	margin-left: 0px;
	margin-right: 0px;
	color: #FFFFFF;
	text-align: center;
	background: #78a;
	padding: 1ex;
}

input.submit,
input.reset {
	background-color: #e0e0e0;
	color: #333;
	border: 1px solid #bbb;
	font-weight: bold;
	padding: 1px;
}

input.submit:hover {
	color: #000;
	text-decoration: underline;
}

/* Styles for sidebar (right) */
.bSideBar {
	margin: 50px 0 0 30px;
	grid-column-start: 4;
	-ms-grid-column: 4;
}
.bSideItem h3 { margin: 0 }
.bSideItem p { margin:0 10px 0 3px }
.bSideItem ul {
	list-style-type: square;
	font-size: 0.9em;
	line-height:20px
}
.bSideItem ul ul{
	margin-bottom: 0px;
}
.bSideItem li {
	margin-bottom: 0;
}
.bSideItem li li {
    list-style-type: circle;
}

#links ul {
	margin-left: 0.4em;
	padding:0;
	list-style-type:none;
}

#links ul li{
	padding:2px 0;
	margin: 0;
	text-align:justify
}
.bSideItem form {
	margin: 0px 10px;
}
.bSideItem h4{margin:0.5em 0.7em 0}
.bSideItem form ul {margin:0 5px;}
.bSideItem form p{margin:5px 0}
.dimmed
{
	color: #aaa;
	font-size: 84%;
}
input.SearchField
{
	background-color: #eee;
	border: 1px solid #ccc;
	padding: 0.5ex;
	margin: 0;
width:170px;
}

/* Calendar: */
caption.bCalendarCaption {
	border: 1px solid #ccc;
	background-color: #eee;
	border-bottom: 0;
}
table.bCalendarTable {
	border: solid 1px #ccc;
	border-collapse: separate;
}
table.bCalendarTable tfoot td {
	background-color: #eee;
	border-top: 1px solid #ccc;
}
table.bCalendarTable tfoot a {
	text-decoration: none;
}
table.bCalendarTable tfoot a:hover {
	background-color: #78a;
	color: #fff;
}
th.bCalendarHeaderCell {
	color: #abc;
}
#bCalendarToday {
	background-color: #bce;
}

#pageFooter p {text-align:center}
#pageFooter ul, #pageFooter li {display:inline; margin:0;padding:0}
#pageFooter ul {margin-left:0.4em}
#pageFooter li:before{content:"\b7\20"}
#pageFooter li:first-child:before{content:""}
p > code, li > code {
	border: 1px solid #ccc;
	background-color: #eee;
	padding: 0.2em 0.3em;
}
div.codeblock,pre,.bPost > code{
	width:98%;
	max-width: 670px;
	display:block;
	overflow:auto;
	background-color:#e0e0e0;
	border:1px solid #aaa;
	padding: 0.8em;
	margin: 0 0 1.6em;
	white-space: pre;
	line-height: 1.3em;
}

.footer p{margin: 0}

ins {
    color: #363;
    text-decoration: none;
    border-bottom: 1px dotted #464;
}
p {
	text-align:justify;
	margin: 0 0 25px;
}
label, .textarea, .textbox, .lrgtextarea, .lrgtextbox {
	margin: 6px 4px;
	display: block;
	width: 150px;
	float: left;
}

.textarea {
	width: 250px;
	height: 100px;
}

.lrgtextarea {
	width: 400px;
	height: 200px;
}

.tickbox {margin: 10px}

label {
	text-align: right;
	width: 100px;
}

form br { clear:both}

ul.gallery { margin: 0 -15px 0 -10px; padding: 0; list-style: none; width: 500px }
ul.gallery:after { clear: both; display: block; content: " "; }
ul.gallery li { float: left; display: block; margin: 3px; padding: 0; list-style: none }

.flt { float: right; margin: 0.25em 0 0.25em 1em }
.semantic { display: none }
.section { font-style: italic }
dl { margin: 0 0 1.6em }
dt { font-weight: bold; }
dt:after { content: ":" }
blockquote {
	background-color: #EBF1F6;
	margin: 0 3em 1.1em;
	padding: 0 1em 0.5em;
	border: 1px solid #ddd;
	border-left: 3px solid #8CA7C2;
}
blockquote p {
	background: none;
}
blockquote p:last-child {
	margin-bottom: 0;
}
.unem {
	font-style: italic;
	color: #555;
	font-size: 90%;
}
.footnote {
	font-size: 80%;
	margin: 2em 10% 1em;
	padding: 0.5em 0 0.5em 3em;
	text-indent: -3em;
	border-top: 1px solid #333
}
.footnote ~ .footnote {
	margin-top:1em;
	border: none;
}
acronym, abbrev { cursor: help }

.info-hover {
    position: relative;
    color: #999;
    text-decoration: none;
    border-bottom: 1px dotted #999;
    cursor: help;
}
a.info-hover::before {
    content: "(?)";
}
a.info-hover span {
    position: absolute;
    top: -0.75em;
    display: inline-block;
    padding: 0 0.2em;
    background: #fff;
    border: 1px solid #ccc;
    display: none;
    color: #000;
}
a.info-hover:hover span, a.info-hover:focus span {
    display: inline-block;
}

@media (max-width:979px){
	#pageTitle, .pageSubTitle, #pageFooter, .content { width: auto }
	.bPosts, .bSideBar {
		-ms-grid-column: 1;
		-ms-grid-column-span: 4;
		grid-column-start: 1;
		grid-column-end: 5;
	}
	.bSideBar {
		display: grid;
		margin: 0;
		-ms-grid-columns: 1fr 1fr 1fr 1fr;
		grid-template-columns: 1fr 1fr 1fr 1fr;
	}
	.bSideItem {
		margin: 0 1em 0 0;
		-ms-grid-column: 1;
		grid-column-start:1;
	}
	.bSideItem + .bSideItem {
		-ms-grid-column: 2;
		-ms-grid-column-span: 3;
		grid-column-start: 2;
		grid-column-end: 5;
	}
	div.pageHeader { background-position: right top; }
	body { background-position: right -152px; }
	div.codeblock,pre,.bPost > code{
		max-width: 98%
	}
}
@media (max-width:776px){
	.bSideBar {
		-ms-grid-columns: 1fr 1fr 1fr;
		grid-template-columns: 1fr 1fr 1fr;
	}
	.bSideItem + .bSideItem {
		-ms-grid-column-span: 2;
		grid-column-end: 4;
	}
	div.pageHeader { background-position: -200px top; }
	body { background-position: -200px -152px }
}
@media (max-width:640px){
	.bSideBar {
		display: block;
	}
}

.tsInput {width: 49.5%; float: left; margin-bottom: 1.5em}
.tsInput label { width: 80px}
#results { clear: left }

.error {
	border: 1px solid #d00;
	padding: 0.5em;
	background: #fee;
}

.semantic-backlink {
	display: none;
}