// This is Less, check it out at http://lesscss.org/

// Some definitions.
@highlight-bg: #009EFC;
@base-bg: #0189DB;
@base-fg: #FFFFFF;

.innerbox (@radius: 3em) {
  border: 1px solid lighten(@highlight-bg, 20%);
  box-shadow: inset 0 0 @radius @highlight-bg;
}

// And now the classes.

body {
  background-color: #ffffff;
  color: #000000;
  padding: 10px;
}

a:link {
  color: @highlight-bg;
}

a:visited {
  color: @base-bg;
}

a:active {
  color: #bb0004;
}

div.codehilite {
  overflow: auto;
}

code {
  font-size: 90%;
  color: #444444;
}

img {
  border-style: none;
  padding: 4px;
}

.f1 img {
  padding: 0px;
}

div.title {
  text-align: right;
  margin-left: 10%;
  width: 65%;
  font-size: 150%;
  font-weight: bold;
}

div.description {
  margin-top: .5em;
  font-weight: normal;
  font-size: 75%;
}

div.breadcrumbs {
  margin-top: .5em;
  font-weight: lighter;
  font-size: 60%;
}

div.media {
  font-size: 75%;
  text-align: right;
}

div.blosxomDate {
  text-align: right;
  position: relative;
  padding: 2px;
  padding-right: 10px;
  background-color: @base-bg;
  color: @base-fg;
  font-weight: bolder;
  font-size: 110%;
}

div.content {
  position: absolute;
  top: 15%;
  left: 10%;
  width: 65%;
}

div#disqus_thread {
  padding: 1em 2em;
  .innerbox(1em);
}



li.dsq-comment {
  margin: 5px;
  padding: 10px 5px;
}

div.dsq-comment-header > a,
div.dsq-comment-header {
  color: @highlight-bg;
}

div.dsq-comment-header > a {
  text-decoration: underline
}

div.storyTitle {
  font-size: 125%;
  text-align: right;
}
div.storyCategory {
  font-size: 80%;
}
div.storyBody {
  text-align: left;
  line-height: 130%;
}
div.storyFoot {
  text-align: right;
  font-size: 80%;
  // padding-bottom: 10px;
}




div.story {
  margin-bottom: 15px;
  .innerbox;
  padding: 1em 2em;
}

div.footBox {
  text-align: left;
  margin-bottom: 15px;
}

div.footTitle {
  display: inline;
  position: relative;
  padding-left: 3%;
  padding-right: 0.5em;
  box-shadow: 0 0 1em @highlight-bg;
  background-color: @base-bg;
  color: @base-fg;
  font-weight: normal;
  font-size: 110%;
  text-transform: uppercase;
}

div.footer {
  position: absolute;
  .innerbox(1em);
  font-size: 70%;
  top: 15%;
  right: 1%;
  width: 19%;
  padding: 5px;
  text-align: left;
}

ul.sidebar {
  padding-top: 0;
  padding-bottom: 1em;
  margin-top: 0;
  margin-bottom: 1em;
  padding-left: 1em;
  margin-left: 1em;
}

ul.collapsable {
  margin-left: 0;
  padding-left: 0;
  display: inline;
  border: none;
}


ul.collapsable li {
  margin-left: 0;
  padding-left: 2px;
  border: none;
  list-style: none;
  cursor: pointer;
}

ul.collapsable li.expanded:before {
  content: "-";
}

ul.collapsable li.collapsed:before {
  content: "+";
}
li.expand ul {
  display: none;
}

hr {
  width: 40%;
}

a.smallestTag { font-size: 10px; }
a.smallTag    { font-size: 12px; }
a.mediumTag   { font-size: 14px; }
a.bigTag      { font-size: 16px; }
a.biggestTag  { font-size: 18px; }
a.hugeTag     { font-size: 20px; }
a.hugestTag   { font-size: 22px; }
a.mostHugeTag { font-size: 24px; }