{{{appCSS}}}


html, body, div, section, span, h1, h2, h3, h4, h5, h6, p, a, ul, ol, li {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  position: relative;
  font: inherit;
  vertical-align: baseline;
}

body {
  font: 400 20px / 26px serif;
  text-rendering: optimizeLegibility;
  font-variant-ligatures: common-ligatures;
  font-feature-settings:"liga"
  -webkit-font-feature-settings:"liga";
  color: #000;
 }

img {max-width: 100%;height: auto;vertical-align: middle;}

.clear {clear:both;width: 100%}
.hide {display: none!important;}
.halfWidth {width: 50%}

.right {float: right;}
.left {float: left;}
.center {float: none;margin: 0 auto}

.red {color: red}

hr {
  clear: both;
  margin: 51px auto;
  width: 18rem;
  border: 1px solid rgba(0,0,0,0.075);
}

hr.full {
  width: 100%;
  border: 1px solid rgba(0,0,0,0.15);
  margin-bottom: 52px;
  border-bottom: none;
}

.small {font-size: 0.8em;color: #aaa}

/* Text */

h1, h2, h3, .h4, h4, h5, h6, ul, ol, code, p, blockquote {margin-bottom: 26px}

h1, h2, h3, h4, .h4, h5, h6 {font-family: sans-serif;}

h1 {font-size: 36px;line-height: 39px;margin-bottom: 26px}

h2 {font-size: 26px;line-height: 39px;margin: 42px 0 23px}

h3,
.entry h4,
.entry h5,
.entry h6 {
  font-size: 15px;
  line-height: 26px;
  margin: 39px 0 13px;
  text-transform: uppercase;
  letter-spacing: 0.888px;
  color: #000
}

h4, h5, h6,
.h4 {
  color: #898989;
  font-size: 0.77em;
  margin-bottom: 1.33em;
}

.h4 {display: inline-block;}

a {text-decoration: none;color: inherit;}

li a,
blockquote a,
p a {
  color: #02569B;
  text-shadow: .03em 0 #fff, -.03em 0 #fff, 0 .03em #fff, 0 -.03em #fff, .06em 0 #fff, -.06em 0 #fff, .09em 0 #fff, -.09em 0 #fff, .12em 0 #fff, -.12em 0 #fff; /*, .15em 0 #fff, -.15em 0 #fff*/
  background-image: linear-gradient(#fff, #fff), linear-gradient(#fff, #fff), linear-gradient(#1B6AAB, #1B6AAB);
  background-size: 0 0,0 0,1px 1px;
  background-repeat: no-repeat, no-repeat, repeat-x;
  background-position: 0% 90%, 100% 90%, 0% 90%;
}

li a:hover,
blockquote a:hover,
p a:hover {
  color: #468CC7;
  background-image: linear-gradient(#fff, #fff), linear-gradient(#fff, #fff), linear-gradient(#5599D2, #5599D2);
}

p a:visited {
}

p a:before,
p a:after {
  text-shadow: none;
}

li a::selection,
blockquote a::selection,
p a::selection {
  background: #b3d4fd;
  text-shadow: .03em 0 #b3d4fd, -.03em 0 #b3d4fd, 0 .03em #b3d4fd, 0 -.03em #b3d4fd, .06em 0 #b3d4fd, -.06em 0 #b3d4fd, .09em 0 #b3d4fd, -.09em 0 #b3d4fd, .12em 0 #b3d4fd, -.12em 0 #b3d4fd;
}

li a::selection,
blockquote a::selection,
p a::-moz-selection {
  background: #b3d4fd;
  text-shadow: .03em 0 #b3d4fd, -.03em 0 #b3d4fd, 0 .03em #b3d4fd, 0 -.03em #b3d4fd, .06em 0 #b3d4fd, -.06em 0 #b3d4fd, .09em 0 #b3d4fd, -.09em 0 #b3d4fd, .12em 0 #b3d4fd, -.12em 0 #b3d4fd;
}

blockquote {
  padding: 0 0 0 13px;
  margin: 0 0 0 -14px;
  border-left: 1px solid #B1B1B1;
  color: #6B6B6B;
}

/* Using emoji from https://github.com/twitter/twemoji */

/* Tables */

table {margin-bottom: 1.33em}

td, th {padding: 0.66em 0.66em 0.33em 0}

/* Lists */

ol, ul {margin: 26px 0}

ol ul, ol ol, ul ol, ul ul {margin:13px 26px}

ol li:before, ul li:before {position: absolute;left: -1em}

ol li:before {
  content: counter(li) '.';
  counter-increment: li;
  text-align: right;
  min-width: 3em;
  left: -3.33em;
}

ul li:before {content: "-";}

li {list-style: none;}

ol {counter-reset: li;}

ol li {margin-bottom: 13px}

li h1,
li h2,
li h3 {font-weight: bold;font-family: 'inherit';font-size: 1em;line-height: 1.33em;margin-bottom: 0}

/* Code block */

pre {
  display: block;
  background: rgba(0,0,0,.02);
  box-shadow: inset 0 0 1px rgba(0,0,0,.25);
  border-radius: 0.33em;
  padding: 13px 16px;
  font-size: 16px;
  margin: 0 0 26px -16px;
  line-height: 26px;
  position: relative;
  overflow-x: scroll;
}

p code {
  padding: 0;
  padding-top: 0.2em;
  padding-bottom: 0.2em;
  margin: 0;
  font-size: 85%;
  background-color: rgba(0,0,0,0.04);
  border-radius: 3px;
  word-wrap: break-word;
  font-family: Consolas, "Liberation Mono", Menlo, Courier, monospace;
}

p code:before,
p code:after {
  letter-spacing: -0.2em;
  content: "\00a0";
}
/* STYLE */

header,
.container {
  max-width: 1000px;
  margin: 0 auto;
  padding: 0 60px
}

.main {
  margin-left: 15em;
  padding-bottom: 10em
}

.sidebar {
   position: absolute;
   width: 11em;
}

  .sidebar a {
    display: block;
    font-family: sans-serif;
    margin-bottom: 2.21em;
    font-size: 0.75em;
    position: relative;
    line-height: 1.33em;
  }

  .sidebar a:before {
    content: "";
    width: 1em;
    height: 1px;
    position: absolute;
    top: 0.25em;
    left: -1.4em;
    background: #c4c4c4;
    margin: 0.33em 0.66em;
    margin-left: 0
  }

  .sidebar a.external {
    margin-bottom: 1.5em
  }

  .sidebar a.external em {
    font-size: 1em;
    letter-spacing: 0;
    margin: 0;
  }



header {margin: 4em auto;padding-bottom: 0.175em}

header a {
  font-family: sans-serif;
  font-size: 0.88em;
  line-height:3em;
  color: #888;
}

#logo {
  color: #000;
  display: block;
  float: left;
  position: relative;
  line-height: 1.333em;
  width: 25%;
  padding-top: 0.333em;
}

#logo em {font-style: normal;color: #888}

#logo img {width: 2em;height: 2em;position: absolute;left: -2.66em;top: 0}

nav {margin-left: 15em}

nav a {
  margin-right: 1em;
  font-size: 0.66em;
  border-bottom: 1px solid #ccc
}

.entry {margin: 3em 0 156px}

.adjacent .halfWidth {
  text-decoration: none;
  font-size: 0.88em;
  line-height: 1.33em;
  width: 48%;
  margin: -25px 0 6em 2%;
  color: #000
}

.adjacent .halfWidth:first-child {margin: -25px 2% 6em 0;}

.adjacent .halfWidth h5 {margin-bottom: -1px;color: #000}
.adjacent .halfWidth .summary {color: #6B6B6B;font-size: 17px;line-height: 26px;}

.adjacent .halfWidth .title {
  display: block;
  font-size: 1.156em;
  font-family: sans-serif;
  line-height: 26px;
  margin-bottom: 3px
}

.entry img {margin-top: 5px}

.entry iframe {border: none;width: 100%;margin-top: 5px;margin-bottom: 26px}

.entry .twitter-tweet {margin-left:-14px!important}

/* Date */
.entry .h4:first-child {margin-bottom: 13px;text-transform: none;letter-spacing: normal;color: #898989}
.entry .h4:first-child:hover:before {content:"→";width: 18px;margin-left: -18px;display: inline-block;}
.sidebar h4:first-child {margin-bottom: 30px}

.archives a {display: block;margin-bottom: 26px}
.archives a .date {font-style:italic;display: block;}
.archives a .summary {display: none;}


footer {
  border-top: 1px solid rgba(0,0,0,0.15);
  padding: 2em 0 6em;
  margin: 6em auto 5%;
  font-size: 0.77em;
  font-family: sans-serif;

}

footer a {color: #aaa}
footer a em {text-decoration: none;font-style: normal;border-bottom: 1px solid #ccc;}

footer a:hover {color: #f9951d}
footer a:hover em {border-bottom-color: #f9951d;}


/* Media queries for responsive layout */
@media screen and (max-width: 800px) {

  #logo {width: 100%}

  pre {
    border-radius: 0;
    border-right: none;
    border-left: none;
    width: 100%
  }

  header {
    margin: 0;
    padding: 1.5em 3em;
    margin: 0 0 3em;
    border-bottom: 1px solid rgba(0,0,0,0.1)
  }

  .container {padding: 0 1.5em}

  .main {margin-left: 0}

  nav {margin-left: 0}

  .sidebar {display: none;visibility: hidden}
}


{{#plugins.codeHighlighting.enabled}}
/* The theme used by the syntax highlighting app */
.hljs {display: block;overflow-x: auto;}
.hljs-comment, .hljs-quote, .hljs-variable {color: #008000;}
.hljs-keyword, .hljs-selector-tag, .hljs-built_in, .hljs-name, .hljs-tag {color: #00f;}
.hljs-string, .hljs-title, .hljs-section, .hljs-attribute, .hljs-literal, .hljs-template-tag, .hljs-template-variable, .hljs-type, .hljs-addition {color: #a31515;}
.hljs-deletion, .hljs-selector-attr, .hljs-selector-pseudo, .hljs-meta {color: #2b91af;}
.hljs-doctag {color: #808080;}
.hljs-attr {color: #f00;}
.hljs-symbol, .hljs-bullet, .hljs-link {color: #00b0e8;}
.hljs-emphasis {font-style: italic;}
.hljs-strong {font-weight: bold;}
{{/plugins.codeHighlighting.enabled}}