/* colors */
$bg: #fff;
$fg: #222;
$h1: #7D9B3E;
$h2: #AAd398;
$crumb-bg: #562d6f;
$crumb-fg: #d9d9d9;
$episteme: #c4f3af;
$hover: #057dff;
$quote: #a6a542;
$pre: #fff8d9;
$warning: #d44836;

/* sizes */
$left-col: 45em;
$right-col: 25em;
$margin: 1em;

body {
  background: $bg;
  color: $fg;
  font-size: 1em;
  font-weight: normal;
  font-family: serif; 
  line-height: 1.3;
  text-align: justify;
}

div#body {
  width: $left-col;
  margin: 0 auto;
}

/* wider body with toc */
div#body-nav {
  width: $left-col + $right-col;
  margin: 0 auto;
}

div#main {
  width: $left-col;
  float: left;
  margin-bottom: 3em;
}

h1.title {
  background: $crumb-bg;
  color: $crumb-fg;
  line-height: 1.3em;
  font-size: 1.7em;
  font-weight: normal;
  margin-top: 0;
  text-align: center;
}

a:link.title, a:hover.title, a:visited.title, a:active.title {
  background: $crumb-bg;
  color: $crumb-fg;
}

/* don't underline titles */
a:link.title, a:visited.title, a:active.title {
  text-decoration: none;
}

/* episteme header */
div#episteme {
  background: $episteme;
  line-height: 2em;
}

/* disowned warning */
div#disowned {
  h1 {
    background: $warning;
  }
  
  background: $episteme;
  padding-bottom: 0.1em;
}

/* merged with another article */
div#merged {
  background: $episteme;
  line-height: 2em;
}


div#disqus {
  border-top: 10px solid $h1;
  text-align: left;
}

div#nav {
  float: left;
  width: $right-col - $margin;
  margin-left: $margin;
  text-align: left;

  h2, h3, h4, h5, h6 {
    font-weight: normal;
    margin-left: 0;
    margin-right: 0;
  }
}

/* toc */
div#toc {
  h1 {
    background: $crumb-bg;
    color: $crumb-fg;
    line-height: 1.3em;
    font-size: 1.7em;
    font-weight: normal;
    margin-top: 0;
  }
}

div#cat-nav {
  line-height: 1.5em;
}

div#crumb {
  a {
    line-height: 1.4em;
    font-size: 1.3em;
    text-decoration: none;
  }
  
  background: $crumb-bg;
  color: $crumb-fg;
  // line-height: 2em;
  text-align: center;
  position: fixed;
  bottom: 0;
  left: 0;
  width: 100%; 
  margin: 0 auto;
}

div#next_prev {
  border-top: 10px solid $h1;
}

div.footnotes {
  border-top: 10px solid $h1;
}

sup {
  margin-left: 0.2em;
  // font-size: 1em;
}

a:link.crumb, a:hover.crumb, a:visited.crumb, a:active.crumb {
  color: $crumb-fg;
  // font-size: 1.3em;
  // font-weight: bold;
}

a:hover {   
  background: $hover;
  color: #fff;
}

/* epistemic states should stand out from normal links */
a.episteme {
  color: $hover;
}

a.episteme:hover {
  background: $h1;
  color: black;
}

/* move paragraphs a bit closer to the center, with list exceptions */
p { 
  margin-left: $margin;
  margin-right: $margin;
}

ul p {
  margin-left: 0;
}

ol p {
  margin-left: 0;
}

/* category items */
.align_left {
  text-align: left;
}

.align_right {
  float: right;
  text-align: right;
}

ul.table .align_right {
  margin-right: $margin;
}

ul.table li {
  margin-left: -$margin;
}

ul.fancy {
  list-style-type: none;
  margin-left: -$margin;
  
  li {
    margin-bottom: 0.5em;
    
    #name {
      font-size: 1.3em;
    }
    #desc {
      font-size: 1.1em;
    }
    
    a {
      display: block;
      background-color: $bg;

    /* color: $crumb-fg; */
      text-decoration: none;
    }
    
    a:hover {   
      background: $hover;
      color: #fff;
    }
  }
}

/* general lists */
li {
  padding-left: 0;
}

@mixin list {
  margin-left: 2 * $margin;
  margin-top: 0;
  margin-bottom: 0;
  padding-left: $margin;
}

ol {
  @include list;
}

ul {
  list-style-type: square;
  @include list;
}

/* nested lists */
ul ul, ol ol {
  margin-left: $margin;
}

em {
  color: $crumb-bg;
  font-style: italic;
}

strong {
  color: green;
  font-weight: bold;
}

img {
  display: block;
  margin-left: auto;
  margin-right: auto;
  max-width: 100%;
}

div.figure {
  text-align: center;
}

h1 {
  background: $h2;
  color: #000;
  font-size: 1.5em;
  line-height: 1.3;
  text-align: center;

  a:link, a:visited, a:active {
    color: #000;
  }
}

@mixin header2 {
  background: $h2;
  color: #000;
  font-weight:normal;
  margin-left: 0.2em;
  margin-right: 0.2em;
  padding-left: 0.5em;
}

h2 {
  @include header2;
  font-size: 1.3em;
  line-height: 1.3;
}                

h3, h4, h5, h6 {
  @include header2;
}

blockquote {
  border-left: 10px solid $quote;
  border-right: 10px solid $quote;
  margin-left: $margin;
  margin-right: $margin;
  padding-left: 0;
}

/* fix indentation if blockquote is already indented */
li blockquote {
  padding-left: $margin;
  margin-right: 2 * $margin;
}

pre { 
  background: $pre;
  border: 1px dashed green; 
  font-family: monospace !important;
  line-height: 1.3em;
  overflow: auto;
  padding: $margin/2 $margin; 
}

span.interpolation {
  font-style: italic;
  border-bottom: thin dashed;
}

/* tables */
table {
  margin-left: auto;
  margin-right: auto;
  border-collapse: collapse;
}

td, th {
  border: 1px solid $h1;
  text-align: center;
  vertical-align: middle;
  padding: 0.5em;
}

/* horizontal line */
hr {
  background: url(/styles/butterfly.png) no-repeat scroll center;
  border: 0;
  height: 25px;
}


/* pygments code highlighting */
pre span.hll { background-color: $bg }
pre span.c { color: #408080; font-style: italic } /* Comment */
pre span.err { border: 1px solid #FF0000 } /* Error */
pre span.k { color: #008000; font-weight: bold } /* Keyword */
pre span.o { color: #666666 } /* Operator */
pre span.cm { color: #408080; font-style: italic } /* Comment.Multiline */
pre span.cp { color: #BC7A00 } /* Comment.Preproc */
pre span.c1 { color: #408080; font-style: italic } /* Comment.Single */
pre span.cs { color: #408080; font-style: italic } /* Comment.Special */
pre span.gd { color: #A00000 } /* Generic.Deleted */
pre span.ge { font-style: italic } /* Generic.Emph */
pre span.gr { color: #FF0000 } /* Generic.Error */
pre span.gh { color: #000080; font-weight: bold } /* Generic.Heading */
pre span.gi { color: #00A000 } /* Generic.Inserted */
pre span.go { color: #808080 } /* Generic.Output */
pre span.gp { color: #000080; font-weight: bold } /* Generic.Prompt */
pre span.gs { font-weight: bold } /* Generic.Strong */
pre span.gu { color: #800080; font-weight: bold } /* Generic.Subheading */
pre span.gt { color: #0040D0 } /* Generic.Traceback */
pre span.kc { color: #008000; font-weight: bold } /* Keyword.Constant */
pre span.kd { color: #008000; font-weight: bold } /* Keyword.Declaration */
pre span.kn { color: #008000; font-weight: bold } /* Keyword.Namespace */
pre span.kp { color: #008000 } /* Keyword.Pseudo */
pre span.kr { color: #008000; font-weight: bold } /* Keyword.Reserved */
pre span.kt { color: #B00040 } /* Keyword.Type */
pre span.m { color: #666666 } /* Literal.Number */
pre span.s { color: #BA2121 } /* Literal.String */
pre span.na { color: #7D9029 } /* Name.Attribute */
pre span.nb { color: #008000 } /* Name.Builtin */
pre span.nc { color: #0000FF; font-weight: bold } /* Name.Class */
pre span.no { color: #880000 } /* Name.Constant */
pre span.nd { color: #AA22FF } /* Name.Decorator */
pre span.ni { color: #999999; font-weight: bold } /* Name.Entity */
pre span.ne { color: #D2413A; font-weight: bold } /* Name.Exception */
pre span.nf { color: #0000FF } /* Name.Function */
pre span.nl { color: #A0A000 } /* Name.Label */
pre span.nn { color: #0000FF; font-weight: bold } /* Name.Namespace */
pre span.nt { color: #008000; font-weight: bold } /* Name.Tag */
pre span.nv { color: #19177C } /* Name.Variable */
pre span.ow { color: #AA22FF; font-weight: bold } /* Operator.Word */
pre span.w { color: #bbbbbb } /* Text.Whitespace */
pre span.mf { color: #666666 } /* Literal.Number.Float */
pre span.mh { color: #666666 } /* Literal.Number.Hex */
pre span.mi { color: #666666 } /* Literal.Number.Integer */
pre span.mo { color: #666666 } /* Literal.Number.Oct */
pre span.sb { color: #BA2121 } /* Literal.String.Backtick */
pre span.sc { color: #BA2121 } /* Literal.String.Char */
pre span.sd { color: #BA2121; font-style: italic } /* Literal.String.Doc */
pre span.s2 { color: #BA2121 } /* Literal.String.Double */
pre span.se { color: #BB6622; font-weight: bold } /* Literal.String.Escape */
pre span.sh { color: #BA2121 } /* Literal.String.Heredoc */
pre span.si { color: #BB6688; font-weight: bold } /* Literal.String.Interpol */
pre span.sx { color: #008000 } /* Literal.String.Other */
pre span.sr { color: #BB6688 } /* Literal.String.Regex */
pre span.s1 { color: #BA2121 } /* Literal.String.Single */
pre span.ss { color: #19177C } /* Literal.String.Symbol */
pre span.bp { color: #008000 } /* Name.Builtin.Pseudo */
pre span.vc { color: #19177C } /* Name.Variable.Class */
pre span.vg { color: #19177C } /* Name.Variable.Global */
pre span.vi { color: #19177C } /* Name.Variable.Instance */
pre span.il { color: #666666 } /* Literal.Number.Integer.Long */