html {
  background: url('/assets/images/bg-pattern.gif') top center repeat-x;
  background-size: 256px 10px;
  padding-top: 10px;
}
body {
  font-family: helvetica, arial, sans-serif;
  max-width: 800px;
  min-width: 414px;
  padding: 10px;
  margin: 0 auto;
  font-size: medium;
}

#heading {
  margin-top: 15px;
}

#heading:after {
  content: " ";
  clear: both;
  display: block;
  height: 0;
  visibility: hidden;
}

#primary {
  margin: 20px 0 0 0px;
  min-width: 500px;
}

.articles ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

.articles ul li {
  padding: 10px;
  margin: 0;
  border-top: 1px solid #EEE;
  clear: both;
}

.articles ul li:after {
  display: block;
  clear: both;
  visibility: hidden;
  content: "";
  height: 0;
}

.articles ul li:hover {
  background: #FFFBEF;
}

.articles ul li span.date {
  float: right;
  color: #AAA;
  text-align: right;
  text-transform: uppercase;
  font-size: 0.7em
}

.articles ul li span.title {
  float: left;
}

.articles ul li span.title a {
  display: block;
  color: #267EF2;
  text-decoration: none;
  line-height: 1.4em;
}

.articles ul li span.title a:hover {
  text-decoration: underline;
}

#profile {
  float: left;
  display: inline-block;
}

#profile img {
  width: 100px;
}

#navigation {
  float: left;
  margin-top: 33px;
  margin-left: 10px;
  padding: 5px;
  color: #FFF;
  background: #000;
}

#navigation ul {
  list-style: none;
  margin: 3px 0 0;
  padding: 0;
}

#navigation ul li {
  display: inline-block;
  padding: 5px;
  margin: 5px 5px 5px 0;
}

#navigation ul li a {
  color: #FFF;
  text-decoration: none;
  font-size: 19px;
}

#navigation ul li a:hover {
  color: #267EF2;
}

#article {
  clear: both;
  color: #555;
  line-height: 1.9rem;
  font-size: 1.4rem;
}

#article h1 {
  font-size: 2.5rem;
  line-height: 2.5rem;
  margin-bottom: 5px;
  color: #000;
}

#article h2 {
  line-height: 2.0rem;
  margin-top: 0;
  font-size: 2.0rem;
}

#article div.when {
  margin: 0;
  color: #AAA;
  font-size: 1.2em;
}

#article ul {
  list-style: square;
  padding: 0;
  margin: 0;
}

#article ul li {
  padding: 0;
  margin: 10px 1em;
}

#footer {
  clear: both;
  margin-top: 20px;
  text-align: right;
  padding: 30px 0;
  border-top: 1px solid #CCC;
}

#footer a.extra {
  display: inline-block;
  margin: 0 20px 0 0;
}

#footer a.extra:last-child {
  margin: 0;
}

a:link {
  color: #267EF2;
}

a:visited {
  color: #1C70E5;
}

a:hover {
  color: #267EF2;
  text-decoration: none;
}

a img {
  border-color: transparent;
  border-width: 0;
}

blockquote {
  margin: 0;
  padding: 0 1em;
  border-left: 2px solid #AAA;
}

.photo_album {
}

.photo {
  float: left;
  padding: 5px;
  border: 1px solid #AAA;
  width: 390px;
  box-sizing: border-box;
  margin-right: 10px;
  margin-bottom: 10px;
}

.photo:nth-child(2n) {
  margin-right: 0;
}

.photo img {
  width: 100%;
  display: block;
  margin: 0;
  padding: 0;
}

.photo_row {
  clear: both;
}

/* PYGMENTS HIGHLIGHTS
   Thanks to Ken Collins */

  /* Pygment Highlight */

  .highlight        { background: #000; font-face: "Courier New", Courier, monospace; color: #DDD; padding: 5px; overflow: auto}
  .highlight .c     { color: #999988; font-style: italic; } /* Comment */
  .highlight .err   { color: #fff; } /* Error */
  .highlight .k     { color: rgb(231,125,60); font-weight: bold; } /* Keyword */
  .highlight .o     { font-weight: bold; } /* Operator */
  .highlight .cm    { color: #999988; font-style: italic; } /* Comment.Multiline */
  .highlight .cp    { color: #999999; font-weight: bold; } /* Comment.Preproc */
  .highlight .c1    { color: rgb(192,14,209); font-style: italic; } /* Comment.Single */
  .highlight .cs    { color: #999999; font-weight: bold; font-style: italic; } /* Comment.Special */
  .highlight .gd    { color: #fff; background-color: rgb(255,52,47) } /* Generic.Deleted */
  .highlight .gd .x { color: #000000; background-color: #ffaaaa } /* Generic.Deleted.Specific */
  .highlight .ge    { font-style: italic; } /* Generic.Emph */
  .highlight .gr    { color: #aa0000 } /* Generic.Error */
  .highlight .gh    { color: #999999 } /* Generic.Heading */
  .highlight .gi    { color: #fff; background-color: rgb(36,255,106) } /* Generic.Inserted */
  .highlight .gi .x { color: #000000; background-color: #aaffaa } /* Generic.Inserted.Specific */
  .highlight .go    { color: #888888 } /* Generic.Output */
  .highlight .gp    { color: #555555 } /* Generic.Prompt */
  .highlight .gs    { font-weight: bold; } /* Generic.Strong */
  .highlight .gu    { color: #fff; background-color: rgb(50,119,226); } /* Generic.Subheading */
  .highlight .gt    { color: #aa0000 } /* Generic.Traceback */
  .highlight .kc    { font-weight: bold; } /* Keyword.Constant */
  .highlight .kd    { font-weight: bold; } /* Keyword.Declaration */
  .highlight .kp    { font-weight: bold; } /* Keyword.Pseudo */
  .highlight .kr    { font-weight: bold; } /* Keyword.Reserved */
  .highlight .kjs   { color: rgb(128,0,255); }
  .highlight .kt    { color: #445588; font-weight: bold; } /* Keyword.Type */
  .highlight .m     { color: #009999 } /* Literal.Number */
  .highlight .s     { color: rgb(0,216,60) } /* Literal.String */
  .highlight .n     { color: #fff; }
  .highlight .na    { color: #fff; } /* Name.Attribute */
  .highlight .nb    { color: rgb(231,125,60); font-weight: bold; } /* Name.Builtin */
  .highlight .nc    { color: #fff; } /* Name.Class */
  .highlight .no    { color: rbg(249,204,177) } /* Name.Constant */
  .highlight .ni    { color: #800080 } /* Name.Entity */
  .highlight .ne    { color: #990000; font-weight: bold; } /* Name.Exception */
  .highlight .nf    { color: #fff; font-weight: bold; } /* Name.Function */
  .highlight .nn    { color: #fff } /* Name.Namespace */
  .highlight .nt    { color: rgb(48,48,255) } /* Name.Tag */
  .highlight .nv    { color: rbg(249,204,177) } /* Name.Variable */
  .highlight .ow    { font-weight: bold; } /* Operator.Word */
  .highlight .w     { color: #bbbbbb } /* Text.Whitespace */
  .highlight .mf    { color: #009999 } /* Literal.Number.Float */
  .highlight .mh    { color: #009999 } /* Literal.Number.Hex */
  .highlight .mi    { color: rgb(0,136,254) } /* Literal.Number.Integer */
  .highlight .mo    { color: #009999 } /* Literal.Number.Oct */
  .highlight .sb    { color: #000; background-color: rgb(255,255,102); } /* Literal.String.Backtick */
  .highlight .sc    { color: #d14 } /* Literal.String.Char */
  .highlight .sd    { color: #d14 } /* Literal.String.Doc */
  .highlight .s2    { color: rgb(0,216,60) } /* Literal.String.Double */
  .highlight .se    { color: rgb(0,216,60)e } /* Literal.String.Escape */
  .highlight .sh    { color: #d14 } /* Literal.String.Heredoc */
  .highlight .si    { color: #fff } /* Literal.String.Interpol */
  .highlight .sx    { color: rgb(0,216,60) } /* Literal.String.Other */
  .highlight .sr    { color: rgb(255,255,102) } /* Literal.String.Regex */
  .highlight .s1    { color: rgb(0,216,60) } /* Literal.String.Single */
  .highlight .ss    { color: rgb(0,136,254) } /* Literal.String.Symbol */
  .highlight .bp    { color: #999999 } /* Name.Builtin.Pseudo */
  .highlight .vc    { color: #008080 } /* Name.Variable.Class */
  .highlight .vg    { color: rbg(249,204,177) } /* Name.Variable.Global */
  .highlight .vi    { color: rbg(249,204,177) } /* Name.Variable.Instance */
  .highlight .il    { color: #009999 } /* Literal.Number.Integer.Long */