---
---

$main-font: sans-serif
$page-background: #333333
$content-background: #ffffff
$content-text: #000000
$header-background: #4d4d4d
$header-text: #ffffff
$menu-background: #f18137
$menu-text: #ffffff
$footer-text: #7f7f7f

body
  font: 100% $main-font
  background-color: $page-background
  margin: 0

  #content-wrapper
    background-color: $content-background
    width: 960px
    margin: 0 auto 0 auto
    padding-top: 14px

  #header
    height: 190px
    width: 960px
    background-color: $header-background
    color: $header-text
    position: absolute

    #picture
      background-color: $content-background
      position: relative
      width: 170px
      height: 170px
      display: inline
      float: left
      top: 40px
      left: 20px

      img
        margin: 10px

    h1
      text-align: right
      margin: 40px 10px 0 0
      font-size: 41px
      font-weight: bold
      padding-top: 45px

      a
        color: $header-text
        text-decoration: none

    h2
      text-align: right
      margin: 0 10px 0 0
      font-size: 12px
      font-weight: normal
      padding-top: 5px

  #contact-list
    position: absolute
    right: -22px
    width: 20px

    a
      display: block

  #menu
    background-color: $menu-background
    height: 39px
    margin-top: 15px

    ul
      margin: 8px
      padding: 0
      list-style-type: none
      float: right

      li
        float: right
        margin: 1px 0 10px 1em
        height: 30px

        a
          color: $menu-text
          font-weight: bold
          font-size: 12px
          text-decoration: none

      li.active
        background-image: url('../images/arrow-up.png')
        background-repeat: no-repeat
        background-position: center bottom

  #tagcloud-button
    float: left
    padding: 2px 0 0 6px
    cursor: pointer

  #content
    clear: both
    padding: 8px

    h3
      margin: .5em 0 .2em 0

    p
      margin: .6em 0
      text-indent: 1.5em
      text-align: justify
      font-size: 80%

    a
      color: $content-text
      text-decoration: underline

  #content-padding
    height: 200px

  dt
    font-weight: normal
    text-decoration: underline

  dd
    p
      text-indent: 0 !important
      margin-top: .5em !important

  #page-disclaimer
    margin-top: 2em
    text-align: right
    font-size: 80%
    color: $footer-text

    a
      color: $footer-text
      text-decoration: underline

  #bottombar-wrapper
    display: block

  #bottombar-padding
    clear: both
    height: 35px

  #bottombar
    position: fixed
    background-color: #4d4d4d
    bottom: 0
    left: 0
    margin: 0
    z-index: 70000
    width: 100%
    padding: 1em
    text-align: center
    vertical-align: center
    color: #b3b3b3
    font-size: 10px
    border-top: 1px solid black

    a
      color: #b3b3b3
      text-decoration: underline

    img
      vertical-align: middle

  #more-posts
    margin-top: 1em
    text-align: right

  #tag-cloud
    position: absolute
    width: 600px
    padding: 8px
    border: 1px solid black
    background-color: #303030
    margin-left: 5px
    margin-top: 2px
    display: none

    a
      color: #b3b3b3
      text-decoration: none
      padding: 8px

    .size0
      font-size: 80%

    .size1
      font-size: 90%

    .size2
      font-size: 100%

    .size3
      font-size: 110%

    .size4
      font-size: 130%

    .size5
      font-size: 150%

  .clear
    clear: both

  pre
    font-family: monospace

  code
    font-family: monospace
    background-color: #ddd

  .highlight
    background-color: #b5b5b5
    padding: 10px

    .code-title
      text-indent: 0 !important
      font-size: 120%
      font-weight: bold

    .code-description
      border: 1px solid #333
      background-color: #d9d9d9
      padding: 3px
      text-indent: 0 !important
      margin: .5em 0 0 0 !important
      font-size: 75%
      color: #444

    pre
      font-family: monospace
      background-color: #002b36
      padding: 5px
      height: 300px
      overflow: auto
      color: #586e75

      *
        font-family: monospace
        background-color: #002b36
        color: #586e75

      code
        .k
          color: #b58900

  #keywords-button
    font-size: 50%
    color: #7f7f7f
    font-weight: normal

  #keywords-button:hover
    background-color: #4d4d4d
    color: #ffffff
    cursor: pointer

  #keywords
    position: absolute
    top: 100px
    left: 100px
    font-size: 75%
    background-color: #4d4d4d
    color: #ffffff
    text-align: justify
    width: 50%
    padding: .5em
    border: 1px solid #f18137
    z-index: 200
    display: none

  .keyword-first-letter
    font-weight: bold
    color: #f18137

  #keywords-close
    width: 24px
    height: 24px
    background-image: url('../images/close.png')
    z-index: 210
    position: absolute
    display: block
    top: -13px
    right: -13px

  .i
    font-style: italic

  .b
    font-weight: bold

  .post
    margin-bottom: 2em

  p.article-date
    text-indent: 0
    font-size: 80%
    color: #7f7f7f

  .paginator
    margin: .5em 0

  .plusone-container
    margin-left: 1em
    display: inline