/* Thank you, Google Webfonts */

@import url(//fonts.googleapis.com/css?family=Open+Sans:300,400,400italic,600,600italic);


/* The C64 was easier to reset */

html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{border:0;font:inherit;font-size:100%;margin:0;padding:0;vertical-align:baseline;}
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block;}
body{line-height:1;}
ol,ul{list-style:none;}
blockquote,q{quotes:none;}
blockquote:before,blockquote:after,q:before,q:after{content:none;}
table{border-collapse:collapse;border-spacing:0;}
a:active{outline:none;}

sup {vertical-align: super;}
sub {vertical-align: sub;}

/* Purely structural features */

.acc { position:absolute; top:-9999px; left:-9999px; } /* Accessibility & Page Structure */

/* Basic layout */

html {
    overflow-y: scroll;
    min-height: 100%;
}

body {
    height: 100%;
    background: #272727 url(/img/bg_gradient.png) repeat-x 0 0 fixed;
    color: #bbb; -webkit-text-size-adjust:none;
}

#inside {
  width: 80%;
  min-width:65em;
  max-width:85em;
  margin:0 auto;
}

#header nav {
	float: right;
	width: 200px;
	margin:1em 0 0 0;
	text-align:right;
}

#header nav li {
	display: inline;
}

#header h1 {
	float:left;
  border-right:1px solid #808080;
  padding:0 0.5em 0.25em 0;
  margin:0 0.5em 0 0;
  font-size:2.25em;
}

#header h1 a {
	text-decoration: none; 
}

#logo-subline {
  padding:1em 0;
  margin:0;
  line-height:1em;
}

#container {
    width: 1044px; margin: 0 auto;
}

#sidebar {
    float: left;
    width: 328px; margin: 120px 0 40px;
    background: #333; box-shadow: 0 0 32px rgba(0,0,0,0.2);
}

#sidebar header, #sidebar nav {
    padding: 24px 48px 24px 24px; border-top: 1px solid #444; border-bottom: 1px solid #222;
}

#content #inside #content {
    position: relative;
/*    float: right; */
    min-height: 1000px; margin: 40px 0; padding-bottom: 40px;
    background: #444; box-shadow: 0 0 40px rgba(0,0,0,0.3);
}

article, #content aside {
    padding: 12px 24px; border-top: 1px solid #555; border-bottom: 1px solid #333;
}

article .overview1 {
	float: left;
  display: inline;
  width: 48%;
  margin: 0 0 0 2%;
}

article .overview2 {
	float: left;
  display: inline;
  width: 48%;
  margin: 0 0 0 2%;
}

.clear {
	clear: both;
}

article article {
  padding: 12px 0px;
}


/* Logo */

#sidebar #logo {
    position: relative; left: -6px;
    width: 292px; margin: 0;
}

#logo a {
    position: relative;
    width: 292px; height: 0; padding: 57px 0 0 0; border: 0;
}

#logo-subline {
    padding-left: 10px;
    font-size: 11px; line-height: 15px; font-weight: bold;
}

.post_list {
    list-style: square inside;
}
.post_list li {
    margin: 0 0 0 0; padding: 0; border: 0;
    list-style-type:none;
    margin:0;
    padding:0.5em 0;
    border-bottom:1px solid #3D3D3D;
}

.post_list ul {
    list-style-type:none;
    margin:1.5em 0 2em 0;
    border-top:1px solid #3D3D3D;
}

.post_list li:last-child {
    margin: 0 0 12px 0; padding-bottom: 12px; border-bottom: 1px solid #555;
}
.post_list a br {
    display: none;
}

.post_date {
    font-size: 11px; line-height: 16px; font-weight: bold;
    color:#858585;
    padding:0 1.5em 0 0;
    font: 12px "Consolas","Bitstream Vera Sans Mono","Courier New",Courier,monospace;
}

.post_list h2 {
    color: #ddd; font-size: 12px; line-height: 1.2;  letter-spacing: -0.04em;
    font-weight: normal;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.post_detail {
    font-size: 11px; font-weight: bold;
}

a.blocklink {
    display: block;
    border: 0;
    color: #999;
}


figure img {
    display: block;
}

a {
    padding: 0 1px;
    border-bottom: 1px solid #666; outline: 0; 
    color: #eee; text-decoration: none;
}

a:hover, a:focus, a:active {
    border-color: #ccf;
    color: #ccc; text-shadow: 0 0 10px #000;
}

strong {
    color: #ddd;
}

::-moz-selection{
    background: #666;
    color: #fff;
}

::selection {
    background: #666;
    color: #fff;
}

/* TYPOGRAPHY */


/* Fonts and sizes */

body {
    font: 15px/22px 'Open Sans',Arial,Helvetica,sans-serif;
}
h1 {
    color: #ddd; font-size: 40px; line-height: 1.2; letter-spacing: -0.04em;
    font-weight: 300;
}
h2, aside h1, .abstract h1, .main_menu {
    color: #ddd; font-size: 32px; line-height: 1.2;  letter-spacing: -0.04em;
    font-weight: 300;
}
h3, #sidebar h1 {
    color: #ddd; font-size: 22px; line-height: 1.2;  letter-spacing: -0.04em;
    font-weight: 300;
}

/* Margins */

h1 {
    margin: 0 0 36px;
}
aside h1, .abstract h1, #sidebar h1 {
    margin-bottom: 18px;
}
h2 {
    margin: 36px 0 18px;
}
h3 {
    margin: 24px 0 12px;
}
.post_metadata {
    margin: 12px 0 36px;
}
.abstract .post_metadata {
    margin-bottom: 18px;
}

p {
    margin: 12px 0;
    text-align: justify;
}
.post_list p, .post_list h2, .post_list ul {
    margin: 0 0 0 0;
    padding:0;
}

blockquote {
    margin: 12px 24px;
    font-style: italic;
}


pre {
    margin: 24px 0; padding: 12px; border-radius: 4px;
    line-height: 16px;
    background: #555; box-shadow: inside 0 2px 0 #000;
    font: 14px/18px "Consolas","Bitstream Vera Sans Mono","Courier New",Courier,monospace;
}
code {
    padding: 0 4px;
    background: #666;
    color: #ccc; font-family: 'Consolas','Bitstream Vera Sans Mono','Courier New',Courier,monospace;
}

strong {
    font-weight: bold;
}
em {
    font-style: italic;
}

ol {
    list-style: decimal outside;
}
ol li {
    margin-left: 48px;
}

ul {
    list-style: square outside;
}
ul li {
    margin-left: 48px;
}

ol, ul {
    margin: 24px 0;
}

ol li, ul li {
    margin: 6px 0 6px 48px;
}

nav ul {
    list-style: none;
}
nav li {
    margin: 0;
}

p>img, p>a>img {
    display: block;
    max-width: 100%; height: auto;
}

.image {
    display: block;
    max-width: 100%; height: auto;
}

p>object, p>a>object {
    display: block;
    width: 100%; height: auto;
}

pre>code {
    display: block;
    overflow: auto;
}

.codehilite {
    margin: 24px 0; padding: 6px 6px; border-radius: 4px;
    line-height: 16px;
    background: #555; box-shadow: inside 0 2px 0 #000;
    font: 14px/18px "Consolas","Bitstream Vera Sans Mono","Courier New",Courier,monospace;
}

.codehilite>pre {
    margin: 0;
    display: block;
    overflow: auto;
    padding: 4px 4px;
    background: #666;
    color: #ccc;
}

h1 a, h2 a, h3 a, .main_menu a {
    border: 0;
}

.main_menu {
    margin: 0;
}

div.message {
    text-align: center;
    border: 2px solid #ccc;
    padding: 4px;
    background-color: #ccc;
    border-radius: 4px;
    color: #334;
}

div.message a {
    color: #778;
    border-bottom: none;
}

div.box16by9 {
    position: relative;
    width: 100%;
    height: 0;
    padding-bottom: 56.25%;
}

div.box16by9 iframe {
    position: absolute;
    top: 0; left: 0;
    width: 100%; height: 100%;
}

div.box16by9 div {
    position: absolute;
    top: 0; left: 0;
    width: 100%; height: 100%;
}

.imgrow {
    display: flex;
}

.imgcol {
    flex: 1;
}

figure {
    display: block;
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
    font-style: italic;
    font-size: smaller;
    text-indent: 0;
  }