@import url(https://fonts.googleapis.com/css?family=Titillium+Web|Open+Sans:300italic,400italic,700italic,400,700,300);

* {
  box-sizing: border-box;
  -moz-box-sizing: border-box;
}
a:link, a:hover {
  color: #0d87d4;
}
a:active {
  color: #D00;
}
a:visited {
  color: #90B;
}

h1,h2 {
  font-weight: 300;
  margin-top: 18pt;
  margin-bottom:  11pt;
}
h3,h4,h5,h6 {
  margin-top: 16pt;
  margin-bottom:  11pt;
}
h1 a:link,h2 a:link,h3 a:link {
  text-decoration: none;
}
h1 a:visited, h2 a:visited {
  color: #0d87d4;
}
h1 a:hover, h2 a:hover {
  color: #1aa7ff;
}

h1.error, h2.error, h3.error, h4.error, h5.error, h6.error {
  color: #A22;
}
h1:first-child,h2:first-child,h3:first-child,h4:first-child,h5:first-child,h6:first-child {
  margin-top: 0;
}
h1 {
  font-size: 24pt;
  margin-bottom: 16pt;
}
h2 {
  font-size: 17pt;
}
h3 {
  font-size: 14pt;
}
h4{
  font-size: 13pt;
}
h5, h6 {
  font-size: 12pt;
}

p {
  margin: 11pt 0;
}

html {
  height: 100%;
  font-size: 10.5pt;
  font-weight: 400;
}

body {
  color: #333;
  font-family: 'Open Sans', 'Lucida Sans', 'Arial';
  padding-bottom: 20px;
}

#content {
  margin: 30px auto 0;
  width: 1160px;
  padding-left: 310px;
  line-height: 1.5;
}

#shoulder {
  position: fixed;
  right: 50%;
  margin-right: 290px;
  top: 30px;
  bottom: 20px;
  width: 290px;
  text-align: right;
  padding: 0 20px 0 0;
  overflow-y: auto;
}

@media (max-width: 1159px) {
  #content {
    width: 800px;
    padding-left: 280px;
  }
  #shoulder {
    position: fixed;
    right: 50%;
    margin-right: 150px;
    width: 250px;
  }
}

#logo {
  display: block;
  padding: 4%;
  color: white;
  font-family: 'Titillium Web', 'Lucida Sans', 'Arial';
  font-size: 36pt;
  background: rgb(191, 64, 0);
  margin-bottom: 20px;
  text-decoration: none;
}

#navigation {
  display: block;
  font-weight: 300;
  font-size: 15pt;
  min-width: 60%;
}
#navigation a {
  display: inline-block;
  padding: 6px 0;
  position: relative;
}
#navigation a:link, #navigation a:visited {
  color: inherit;
  text-decoration: none;
}
#navigation a:hover:before, #navigation a:active:before {
  display: block;
  position: absolute;
  font-size: 70%;
  line-height: inherit;
  left: -10pt;
  content: '■';
  vertical-align: middle;
  padding-top: 0.2em;
}
#navigation li.selected ul li {
  margin-right: 16px;
}
#navigation li.selected {
  border-right: 2px solid rgba(50, 50, 50, 0.6);
}
#navigation ul li.selected {
  border-right: 2px solid rgba(89, 31, 18, 0.6);
}
#navigation ul ul li.selected {
  border-right: 2px solid rgba(140, 61, 42, 0.6);
}
#navigation li.selected > a {
  padding: 6px;
  color: white;
  background: rgba(50, 50, 50, 0.6);
}
#navigation ul li.selected > a {
  background: rgba(89, 31, 18, 0.6);
}
#navigation ul ul li.selected > a {
  background: rgba(140, 61, 42, 0.6);
}
#navigation li > a:hover:before, #navigation li > a:active:before {
  color: rgba(50, 50, 50, 0.6);
}
#navigation ul li > a:hover:before, #navigation ul li > a:active:before {
  color: rgba(89, 31, 18, 0.6);
}
#navigation ul ul li > a:hover:before, #navigation ul ul li > a:active:before {
  color: rgba(140, 61, 42, 0.6);
}
#navigation ul {
  margin-top: 3px;
  padding: 3px 0;
  font-size: 12.5pt;
  color: rgb(89, 31, 18);
}
#navigation ul ul {
  font-size: 10.5pt;
  color: rgb(140, 61, 42);
}

#content ul {
  list-style: disc outside;
  margin: 1.2em 0 1.2em;
}
#content ul ul {
  list-style-type: circle;
  margin: 0;
}
#content ul > li {
  margin: 0.2em 0 0.2em 3em;
}

#content .notice {
  padding: 12px 24px;
  background: #A22;
  text-align: left;
  color: white;
  font-size: 10pt;
}
#content .notice a {
  color: white;
}

#disqus_thread {
  margin-top: 4em;
  border-top: #ddd 1px solid;
  padding-top: 1.45em;
}

pre, code, .code {
  font-family: Consalas, Monaco, "Courier New", "DejaVu Sans Mono", "Bitstream Vera Sans Mono", monospace;
  font-size: 12px;
  border: 1px solid #ddd;
  background: #eee;
}

pre {
  display: block;
  white-space: pre;
  padding: 1.1em 1.4em;
  margin: 1.5em 0;
  overflow-x: auto;
}
.code, code {
  display: inline;
  padding: 0 0.3em;
}
pre > code, pre > .code {
  display: inline;
  background: transparent;
  border: none;
  padding: 0;
}
.footer {
  display: block;
  margin: 2.5em 0 0;
  text-align: center;
  color: #aaa;
  font-size: 80%;
  font-weight: 300;
}
#shoulder .footer {
  text-align: right;
}