@charset "UTF-8";
/* derived from */
/* http://meyerweb.com/eric/tools/css/reset/ */
/* v1.0 | 20080212 */
@import url(https://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,300,400,700,800);
@import url(https://fonts.googleapis.com/css?family=Inconsolata);
html, body, div, span, applet, object, iframe,
h1,
#content p.subtitle, h2, #content div.frontMatter div.contents h3, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: transparent; }

body {
  line-height: 1; }

ol, ul {
  list-style: none; }

blockquote, q {
  quotes: none; }

blockquote:before, blockquote:after,
q:before, q:after {
  content: '';
  content: none; }

/* remember to define focus styles! */
:focus {
  outline: 0; }

/* remember to highlight inserts somehow! */
ins {
  text-decoration: none; }

del {
  text-decoration: line-through; }

/* tables still need 'cellspacing="0"' in the markup */
table {
  border-collapse: collapse;
  border-spacing: 0; }

div.clear {
  clear: both; }

@font-face {
  font-family: 'Marydale';
  src: url("/fonts/marydale/marydale-webfont.eot");
  src: url("/fonts/marydale/marydale-webfont.eot?#iefix") format("embedded-opentype"), url("/fonts/marydale/marydale-webfont.woff") format("woff"), url("/fonts/marydale/marydale-webfont.ttf") format("truetype"), url("/fonts/marydale/marydale-webfont.svg#marydaleregular") format("svg");
  font-weight: normal;
  font-style: normal; }
/*
tw-grey is hsl(145, 5%, 52%)
*/
@font-face {
  font-family: 'FontAwesome';
  src: url("https://netdna.bootstrapcdn.com/font-awesome/4.0.0/fonts/fontawesome-webfont.eot");
  src: url("https://netdna.bootstrapcdn.com/font-awesome/4.0.0/fonts/fontawesome-webfont.eot?#iefix") format("embedded-opentype"), url("https://netdna.bootstrapcdn.com/font-awesome/4.0.0/fonts/fontawesome-webfont.woff") format("woff"), url("https://netdna.bootstrapcdn.com/font-awesome/4.0.0/fonts/fontawesome-webfont.ttf") format("truetype"), url("https://netdna.bootstrapcdn.com/font-awesome/4.0.0/fonts/fontawesome-webfont.svgfontawesomeregular") format("svg");
  font-weight: normal;
  font-style: normal; }
html {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box; }

*, *:before, *:after {
  -webkit-box-sizing: inherit;
  -moz-box-sizing: inherit;
  box-sizing: inherit; }

@font-face {
  font-family: 'FontAwesome';
  src: url("https://netdna.bootstrapcdn.com/font-awesome/4.0.0/fonts/fontawesome-webfont.eot");
  src: url("https://netdna.bootstrapcdn.com/font-awesome/4.0.0/fonts/fontawesome-webfont.eot?#iefix") format("embedded-opentype"), url("https://netdna.bootstrapcdn.com/font-awesome/4.0.0/fonts/fontawesome-webfont.woff") format("woff"), url("https://netdna.bootstrapcdn.com/font-awesome/4.0.0/fonts/fontawesome-webfont.ttf") format("truetype"), url("https://netdna.bootstrapcdn.com/font-awesome/4.0.0/fonts/fontawesome-webfont.svgfontawesomeregular") format("svg");
  font-weight: normal;
  font-style: normal; }
.icon-twitter:before {
  content: "";
  font-family: FontAwesome;
  font-weight: normal;
  font-style: normal;
  text-decoration: inherit;
  -webkit-font-smoothing: antialiased;
  *margin-right: .3em; }

.icon-rss:before {
  content: "";
  font-family: FontAwesome;
  font-weight: normal;
  font-style: normal;
  text-decoration: inherit;
  -webkit-font-smoothing: antialiased;
  *margin-right: .3em; }

.icon-bars:before {
  content: "";
  font-family: FontAwesome;
  font-weight: normal;
  font-style: normal;
  text-decoration: inherit;
  -webkit-font-smoothing: antialiased;
  *margin-right: .3em; }

.icon-close:before, .navmenu .close:before {
  content: "";
  font-family: FontAwesome;
  font-weight: normal;
  font-style: normal;
  text-decoration: inherit;
  -webkit-font-smoothing: antialiased;
  *margin-right: .3em; }

.help-icon:before {
  content: "";
  font-family: FontAwesome;
  font-weight: normal;
  font-style: normal;
  text-decoration: inherit;
  -webkit-font-smoothing: antialiased;
  *margin-right: .3em; }

.icon-close:before, .navmenu .close:before {
  content: "";
  font-family: FontAwesome;
  font-weight: normal;
  font-style: normal;
  text-decoration: inherit;
  -webkit-font-smoothing: antialiased;
  *margin-right: .3em; }

/* ==== banner ================ */
div#banner {
  background-color: black;
  height: 100px;
  font-family: OpenSans, sans-serif;
  color: white;
  position: relative;
  top: 0; }
  div#banner img.name-logo, div#banner img.ie6-name-logo {
    position: absolute;
    top: 0;
    left: 10px; }
  div#banner img.photo, div#banner #content img.figure, #content div#banner img.figure, div#banner #content img.photo-right, #content div#banner img.photo-right {
    position: absolute; }
  div#banner ul {
    list-style-image: none;
    list-style-position: outside;
    list-style-type: none;
    margin: 0;
    padding: 0; }
  div#banner ul li {
    float: left;
    padding-right: 10px;
    font-family: OpenSans, sans-serif;
    font-size: 14px; }
  div#banner img {
    border: 0; }
  div#banner a {
    color: white;
    text-decoration: none; }
  div#banner .menu-button {
    display: block;
    position: absolute;
    right: 20px;
    top: 5px;
    font-size: 200%; }
  div#banner div.main-navigation, div#banner div.search {
    display: none; }
  @media screen and (min-width: 950px) {
    div#banner div.main-navigation {
      position: absolute;
      bottom: 10px;
      left: 10px;
      display: block; }
      div#banner div.main-navigation p {
        margin: 0;
        padding: 0; }
      div#banner div.main-navigation a:hover {
        color: #ef5ba1;
        text-decoration: underline; }
      div#banner div.main-navigation a.tw {
        color: #b5b935; } }
  @media screen and (min-width: 450px) {
    div#banner div.search {
      display: block;
      position: absolute;
      right: 80px;
      top: 5px;
      background-color: transparent;
      height: 40px;
      width: 173px; }
    div#banner div.search input, div#banner div.search button {
      margin: 10px 0 0 0;
      padding: 0;
      border: 0; }
    div#banner div.search input.field {
      margin: 3px 3px 3px 4px;
      width: 142px; }
    div#banner div.search .button {
      cursor: pointer;
      color: white;
      width: 18px;
      background-color: transparent;
      font-size: 100%; }
      div#banner div.search .button:before {
        content: "";
        font-family: FontAwesome;
        font-weight: normal;
        font-style: normal;
        text-decoration: inherit;
        -webkit-font-smoothing: antialiased;
        *margin-right: .3em; } }

/* ................................................................ */
/* ==== footer ================ */
#footer {
  position: relative;
  background-color: black;
  color: white;
  min-height: 80px; }
  #footer a {
    color: white;
    text-decoration: none; }
  #footer div.copyright {
    display: block;
    font-size: 80%;
    position: absolute;
    bottom: 5px;
    left: 5px; }
    #footer div.copyright a:hover {
      padding-top: 5px;
      color: #ef5ba1;
      text-decoration: underline; }
  @media screen and (min-width: 600px) {
    #footer {
      min-height: 40px; }
      #footer div.copyright {
        left: auto;
        right: 60px; } }
  #footer .tw-logo {
    position: absolute;
    left: 5px;
    top: 5px; }
    #footer .tw-logo img {
      width: 200px; }
  #footer .menu-button {
    position: absolute;
    right: 10px;
    top: 5px;
    font-size: 200%; }

/* ................................................................ */
.navmenu {
  line-height: 2.5em; }
  .navmenu .group {
    display: block;
    background-color: #f0ba95;
    border-top: thin solid white; }
    .navmenu .group::after {
      clear: both;
      content: "";
      display: table; }
  .navmenu .group-label {
    float: left;
    display: block;
    margin-right: 2.3576515979%;
    width: 14.7019570017%;
    padding-left: 5px;
    font-weight: bold; }
    .navmenu .group-label:last-child {
      margin-right: 0; }
  .navmenu .group-contents {
    float: left;
    display: block;
    margin-right: 2.3576515979%;
    width: 82.9403914003%;
    background-color: #fee0c9; }
    .navmenu .group-contents:last-child {
      margin-right: 0; }
  .navmenu .top-line {
    background-color: #fee0c9;
    display: block; }
    .navmenu .top-line::after {
      clear: both;
      content: "";
      display: table; }
  .navmenu .link-home {
    float: left;
    display: block;
    margin-right: 2.3576515979%;
    width: 6.1721527019%;
    display: block;
    padding-left: 5px; }
    .navmenu .link-home:last-child {
      margin-right: 0; }
  .navmenu .search {
    float: left;
    display: block;
    margin-right: 2.3576515979%;
    width: 82.9403914003%;
    display: block; }
    .navmenu .search:last-child {
      margin-right: 0; }
    .navmenu .search .button {
      background-color: transparent;
      border: none;
      cursor: pointer; }
    .navmenu .search .button:before {
      content: "";
      font-family: FontAwesome;
      font-weight: normal;
      font-style: normal;
      text-decoration: inherit;
      -webkit-font-smoothing: antialiased;
      *margin-right: .3em;
      font-size: 150%;
      color: white; }
  @media screen and (max-width: 750px) {
    .navmenu .link-home {
      float: left;
      display: block;
      margin-right: 7.4229703521%;
      width: 19.432772236%; }
      .navmenu .link-home:last-child {
        margin-right: 0; }
    .navmenu .search {
      float: left;
      display: block;
      margin-right: 7.4229703521%;
      width: 46.288514824%; }
      .navmenu .search:last-child {
        margin-right: 0; } }
  .navmenu .close {
    float: left;
    display: block;
    margin-right: 2.3576515979%;
    width: 6.1721527019%;
    color: white;
    cursor: pointer;
    padding-right: 0.5em; }
    .navmenu .close:last-child {
      margin-right: 0; }
  .navmenu .icon-close, .navmenu .close {
    font-size: 200%; }
  @media screen and (max-width: 750px) {
    .navmenu .group-label, .navmenu .group-contents {
      width: 100%; } }
  .navmenu .item {
    display: inline;
    padding: 0 1em 0 1em; }
  .navmenu a {
    color: black;
    text-decoration: none; }
  .navmenu a:hover {
    text-decoration: underline; }

/* ==== framing ================ */
body {
  font-size: 16px; }

#content, #banner, #footer, .navmenu {
  max-width: 960px;
  margin-left: auto;
  margin-right: auto;
  margin-left: 5px;
  margin-right: 0; }
  #content::after, #banner::after, #footer::after, .navmenu::after {
    clear: both;
    content: "";
    display: table; }
  @media screen and (min-width: 750px) {
    #content, #banner, #footer, .navmenu {
      margin-left: 20px; } }

#top-navmenu {
  display: none; }

#bottom-navmenu {
  display: block; }

.navmenu-button {
  cursor: pointer; }

/* ................................................................ */
/* 

==== global ================

  need to refactor this as global is really just for articles etc 
  in particular refactor this so the guide pages can use a useful common
  subset of styles
*/
body {
  font-size: 16px;
  font-family: OpenSans, sans-serif;
  line-height: 1.2;
  color: #303633; }

#content {
  background-color: white;
  min-height: 500px;
  margin-left: 5px;
  margin-right: 0; }
  #content h1, #content p.subtitle, #content h2, #content div.frontMatter div.contents h3, #content h3, #content h4, #content h5 {
    color: #5b2858;
    font-weight: bold; }
    #content h1 a:link, #content p.subtitle a:link, #content h1 a:visited, #content p.subtitle a:visited, #content h2 a:link, #content div.frontMatter div.contents h3 a:link, #content h2 a:visited, #content div.frontMatter div.contents h3 a:visited, #content h3 a:link, #content h3 a:visited, #content h4 a:link, #content h4 a:visited, #content h5 a:link, #content h5 a:visited {
      color: #5b2858; }
  #content h1, #content p.subtitle {
    font-size: 200%; }
  #content h2, #content div.frontMatter div.contents h3 {
    font-size: 150%; }
  #content h3 {
    font-size: 120%; }
  #content p, #content h1, #content p.subtitle, #content h2, #content div.frontMatter div.contents h3, #content h3, #content h4, #content h5 ul {
    margin: 1em 0; }
  #content dd {
    margin-left: 2em; }
  #content a:link, #content a:visited {
    color: #94388e;
    text-decoration: none; }
  #content a:hover {
    text-decoration: underline; }
  #content ul {
    list-style: square;
    margin-left: 1.5em; }
  #content ol {
    list-style: decimal;
    margin-left: 1.5em; }
  #content pre {
    font-size: 90%;
    font-family: Inconsolata, monospace; }
  #content code {
    font-family: Inconsolata, monospace; }
  #content span.credit {
    color: #808080;
    font-size: 80%; }
  #content hr {
    border-style: dotted none none none;
    border-top-width: thin;
    margin: 10px 15px; }
  #content blockquote {
    /* margin-left: 3em; */
    border-left: 2px solid grey;
    padding-left: 1em;
    font-style: italic;
    color: #5b2858; }
  #content .shares .label {
    margin-right: 1em;
    color: #11aa58; }
  #content .shares .icons {
    float: left;
    width: 40%; }
  #content .shares .comment {
    font-size: 80%;
    color: #11aa58;
    float: left;
    width: 60%;
    margin-top: 0; }
  #content .shares img {
    height: 16px;
    margin-right: 10px; }
  @media screen and (min-width: 750px) {
    #content {
      margin-left: 20px; } }

.error {
  background-color: rgba(253, 147, 151, 0.34); }

.todo {
  background-color: rgba(255, 255, 0, 0.3); }

.draft-notice {
  border: thin solid red;
  font-family: sans-serif;
  margin: 1em 10%;
  padding: 0.5em;
  text-align: center; }
  .draft-notice h1, .draft-notice #content p.subtitle, #content .draft-notice p.subtitle {
    font-size: 120%;
    color: black; }
  .draft-notice p {
    color: red; }

.clickable {
  text-decoration: underline;
  cursor: pointer; }

/* ................................................................ */
#content .photo, #content div.fullPhoto, #content .figure, #content .photo-right {
  font-size: 80%;
  font-style: italic;
  font-family: OpenSans, sans-serif;
  max-width: 100%; }
  #content .photo p.credit, #content div.fullPhoto p.credit, #content .figure p.credit, #content .photo-right p.credit {
    color: #808080;
    font-size: 80%;
    text-align: right;
    float: right; }
  #content .photo p.photoCaption, #content div.fullPhoto p.photoCaption, #content .figure p.photoCaption, #content .photo-right p.photoCaption {
    min-height: 1em; }
#content div.fullPhoto, #content .figure {
  float: none;
  margin: 1em 0; }
#content .photo-right {
  float: right;
  margin: 1em -250px 1em 1em; }
#content img {
  max-width: 100%; }
#content img.full-size {
  max-width: none; }

body {
  overflow-x: hidden !important;
  font-size: 16px;
  font-family: OpenSans, sans-serif; }

#content {
  width: 40em;
  padding: 0 5px; }
  #content p.subtitle {
    font-size: 120%; }
  #content hr.topSection {
    border-top: thick solid #5b2858;
    margin: 3em 50% 0px 0px; }
  #content .paperBody h2, #content .paperBody div.frontMatter div.contents h3, #content div.frontMatter div.contents .paperBody h3 {
    margin: 0 0 1em 0; }
  #content div#topImage {
    float: right;
    margin: 0 0 1em 20px;
    clear: both;
    width: 220px;
    font-size: 80%;
    font-style: italic;
    font-family: OpenSans, sans-serif; }
    #content div#topImage img {
      width: 220px; }
  #content p.abstract {
    line-height: 1.4;
    font-style: italic; }
  #content div.frontMatter {
    padding: 1em 2em;
    border-style: solid none;
    border-width: thin 0;
    clear: both;
    overflow: hidden;
    border-color: #5b2858;
    font-family: OpenSans, sans-serif;
    padding: 1em 0;
    font-size: 90%; }
    #content div.frontMatter p, #content div.frontMatter div.translations, #content div.frontMatter div.tags {
      margin: 0.3em; }
    #content div.frontMatter div.topBox {
      margin: 2em 0;
      font-size: 90%; }
    #content div.frontMatter div.frontLeft {
      width: 40%;
      float: left; }
    #content div.frontMatter div.frontRight {
      width: 55%;
      float: right;
      padding-right: 0; }
    #content div.frontMatter div.author {
      margin: 1em 0 0 0.3em; }
      #content div.frontMatter div.author img {
        max-width: 80px;
        float: left;
        margin: 0 1em 1em 0; }
      #content div.frontMatter div.author p {
        margin-left: 0;
        font-size: 90%; }
      #content div.frontMatter div.author p.name {
        font-weight: bold;
        font-size: 100%;
        margin: 1em 0; }
      #content div.frontMatter div.author a:link, #content div.frontMatter div.author a:visited, #content div.frontMatter div.author a:hover {
        color: #94388e; }
    #content div.frontMatter div.contents {
    /* puts contents to fixed right, useful when fiddling
  position: fixed;
  width: 15em;
  top: 20em;
  right: 3px;
   */
      /* to add bullet points to contents entries remove the `ul ul` margin
       rule, remove `list-style-type none` from li (will pick up square
       from global) and add `margin-left: 1.5em;` to li */ }
      #content div.frontMatter div.contents a:link, #content div.frontMatter div.contents a:visited, #content div.frontMatter div.contents a:hover {
        color: #5b2858; }
      #content div.frontMatter div.contents ul {
        margin: 0;
        -webkit-padding-start: 0; }
      #content div.frontMatter div.contents ul ul {
        margin: 0 1.2em; }
      #content div.frontMatter div.contents li {
        list-style-type: none; }
      #content div.frontMatter div.contents h2, #content div.frontMatter div.contents h3 {
        font-size: 100%;
        color: #5b2858;
        font-weight: bold;
        margin: 0.5em 0; }
      #content div.frontMatter div.contents h3 {
        margin: 0.5em 0; }
      #content div.frontMatter div.contents .contents-expand {
        color: #505853;
        font-family: OpenSans, sans-serif;
        font-style: normal;
        font-weight: bold;
        font-size: 14px;
        padding: 5px;
        border-radius: 5px;
        margin: 2px;
        white-space: nowrap;
        background: linear-gradient(#eceeed, #9ca5a0);
        cursor: pointer;
        border: thin solid black;
        float: right;
        margin: 0 100px 0 0; }
        #content div.frontMatter div.contents .contents-expand:hover {
          background: #eceeed; }
  #content div.paperBody {
    clear: both;
    line-height: 1.4; }
  #content hr.bodySep {
    margin: 5em 10% 2em;
    border-top: thin solid #5b2858;
    clear: both; }
  #content pre {
    font-size: 90%; }
    #content pre span.highlight {
      color: #ef5ba1; }
    #content pre span.deleted, #content pre pre.deleted {
      color: #ef5ba1;
      text-decoration: line-through; }
    #content pre span.suffix {
      font-style: italic; }
    #content pre span.lnum {
      color: #f0ba95; }
  #content p.code-label {
    margin-bottom: 0;
    font-style: italic;
    font-size: 90%; }
  #content div.appendix {
    font-size: 80%;
    font-family: OpenSans, sans-serif;
    line-height: 1.2; }
  #content div.appendix hr.topSection {
    border: none; }
  #content div.sidebar, #content div.soundbite {
    float: right;
    margin-right: -250px;
    width: 20em;
    margin: 1em -250px 1em 2em;
    font-size: 80%;
    font-family: OpenSans, sans-serif;
    background-color: rgba(254, 224, 201, 0.5);
    line-height: 1.2;
    padding: 1em; }
    #content div.sidebar h2, #content div.soundbite h2, #content div.sidebar div.frontMatter div.contents h3, #content div.frontMatter div.contents div.sidebar h3, #content div.soundbite div.frontMatter div.contents h3, #content div.frontMatter div.contents div.soundbite h3, #content div.sidebar h3, #content div.soundbite h3 {
      font-size: 120%; }
    #content div.sidebar .credit, #content div.soundbite .credit {
      font-style: italic;
      text-align: right; }
  #content div.soundbite {
    color: #11aa58;
    font-size: 110%;
    font-style: italic;
    width: 20em; }
    #content div.soundbite p {
      margin: 0; }
    #content div.soundbite i {
      font-weight: bold; }
  #content div.book-sidebar {
    float: right;
    margin-right: -250px;
    width: 220px;
    background-color: rgba(254, 224, 201, 0.5);
    font-size: 80%;
    padding: 10px;
    border: thin solid #fee0c9; }
    #content div.book-sidebar img.cover {
      width: 130px;
      margin-left: 35px; }
    #content div.book-sidebar.no-text {
      background-color: transparent;
      border-color: transparent; }
  #content .tweet-sidebar {
    float: right;
    margin-right: -250px;
    width: 20em;
    margin: 1em -250px 1em 2em; }
  #content blockquote.aside {
    float: right;
    margin-right: -250px;
    width: 20em;
    margin: 1em -250px 1em 2em; }
  #content div.footnote-list h3, #content div.footnote-list span.num {
    color: #5b2858;
    font-weight: bold;
    font-size: 100%; }
  #content .paperBody .end-box, #content .end-box {
    padding: 10px 20px;
    background-color: #fee0c9;
    margin: 2em -20% 5em 40%; }
    #content .paperBody .end-box h2, #content .paperBody .end-box div.frontMatter div.contents h3, #content div.frontMatter div.contents .paperBody .end-box h3, #content .end-box h2, #content .end-box div.frontMatter div.contents h3, #content div.frontMatter div.contents .end-box h3 {
      font-style: italic;
      font-weight: normal;
      margin-bottom: 0;
      color: #11aa58; }
    #content .paperBody .end-box p, #content .end-box p {
      margin: 0.5em 0 1em 2em; }
    #content .paperBody .end-box .tags, #content .end-box .tags {
      line-height: 3; }
      #content .paperBody .end-box .tags a, #content .end-box .tags a {
        background: #11aa58;
        color: white;
        font-family: OpenSans, sans-serif;
        font-style: normal;
        font-weight: bold;
        font-size: 14px;
        padding: 5px;
        border-radius: 5px;
        margin: 2px;
        white-space: nowrap; }
        #content .paperBody .end-box .tags a:hover, #content .end-box .tags a:hover {
          background: #89b77f; }
    #content .paperBody .end-box span.tags, #content .end-box span.tags {
      margin-left: 2em; }
    #content .paperBody .end-box .shares, #content .end-box .shares {
      margin: 0 0 5em 0; }
  #content .next-installment, #content .installment-target {
    background-color: rgba(254, 224, 201, 0.5);
    color: #11aa58;
    padding: 10px;
    font-style: italic;
    font-size: 110%; }
    #content .next-installment a:link, #content .next-installment a:visited, #content .installment-target a:link, #content .installment-target a:visited {
      color: #b5b935; }
  #content .code-remark {
    color: #9e785f;
    font-size: 80%;
    margin-left: 3em;
    font-style: italic; }
  #content .code-href a {
    color: #80c9cf;
    font-size: 80%; }
  #content .p-sub {
    margin-left: 2em;
    font-size: 80%; }
  #content .short-front {
    width: 400px;
    float: left;
    margin-bottom: 3em; }
    #content .short-front p {
      font-size: 90%;
      margin: 0.5em 0; }
    #content .short-front .author .photo, #content .short-front .author div.fullPhoto, #content .short-front .author .figure, #content .short-front .author .photo-right {
      float: left;
      margin-right: 10px;
      width: 60px; }
      #content .short-front .author .photo img, #content .short-front .author div.fullPhoto img, #content .short-front .author .figure img, #content .short-front .author .photo-right img {
        width: 60px; }
    #content .short-front p.date {
      font-weight: bold; }

img {
  height: auto; }

#footer {
  margin-top: 2em; }

body .contents.dropdown-container {
  display: none; }
@media screen and (max-width: 864px) {
  body .contents.dropdown-container {
    display: inherit;
    width: 100%;
    height: 2em;
    margin: 0; }
    body .contents.dropdown-container button {
      width: 100%;
      height: 100%; }
      body .contents.dropdown-container button h2, body .contents.dropdown-container button #content div.frontMatter div.contents h3, #content div.frontMatter div.contents body .contents.dropdown-container button h3 {
        height: 1em;
        margin: auto; }
  body .fixed-container {
    position: fixed;
    top: 0; }
  body button.dropdown-button {
    background-color: #f9f9f9;
    background-color: rgba(249, 249, 249, 0.8);
    border: none; }
  body .hidden {
    display: none; }
  body .dropdown-links {
    display: block;
    visibility: visible;
    position: absolute;
    background-color: #f9f9f9;
    width: 100%;
    box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
    z-index: 3;
    height: 75vh;
    overflow-y: auto;
    padding-bottom: 1.5em; }
    body .dropdown-links a {
      color: black;
      padding: 12px 16px;
      text-decoration: none;
      display: block; }
      body .dropdown-links a :hover {
        background-color: #f1f1f1; }
    body .dropdown-links ul {
      padding-left: 1.5em; }
    body .dropdown-links h3 {
      padding-left: 12px; }
      body .dropdown-links h3 a {
        padding: 0;
        color: #303633; } }

@media screen and (max-width: 864px) {
  body {
    font-size: 19px; }

  .no-scroll {
    overflow-y: hidden; }

  #banner, #footer, .navmenu {
    margin: 0px; }

  #content {
    max-width: 100%;
    overflow-x: hidden !important;
    margin: auto;
    padding: 0 10px; }
    #content div.frontMatter div.frontRight {
      display: none; }
    #content div.frontMatter div.frontLeft {
      float: none;
      width: 100%; }
    #content blockquote.aside {
      clear: both;
      float: none; }
    #content .photo, #content div.fullPhoto, #content .figure, #content .photo-right {
      float: none;
      margin: auto; }
    #content pre {
      overflow-x: auto;
      padding-bottom: 1.5em; }
    #content table {
      display: block;
      overflow-x: auto;
      padding-bottom: 0.5em;
      border: none; }
    #content .paperBody .end-box, #content .end-box {
      margin: auto; }
    #content div.sidebar, #content div.soundbite {
      float: none;
      margin: 1em 2em 1em 2em;
      width: inherit; }
      #content div.sidebar p, #content div.soundbite p {
        width: 99%; }
    #content div.book-sidebar {
      float: none;
      margin: auto; }
    #content img.full-size {
      max-width: 100%; }
    #content .tweet-sidebar {
      float: none;
      margin: 1em 2em 1em 2em;
      width: inherit; }
      #content .tweet-sidebar p {
        width: 99%; } }
/* http://jmblog.github.com/color-themes-for-google-code-highlightjs */
/* Tomorrow Comment */
.hljs-comment,
.hljs-quote {
  color: #8e908c; }

/* Tomorrow Red */
.hljs-variable,
.hljs-template-variable,
.hljs-tag,
.hljs-name,
.hljs-selector-id,
.hljs-selector-class,
.hljs-regexp,
.hljs-deletion {
  color: #c82829; }

/* Tomorrow Orange */
.hljs-number,
.hljs-built_in,
.hljs-builtin-name,
.hljs-literal,
.hljs-type,
.hljs-params,
.hljs-meta,
.hljs-link {
  color: #f5871f; }

/* Tomorrow Yellow */
.hljs-attribute {
  color: #eab700; }

/* Tomorrow Green */
.hljs-string,
.hljs-symbol,
.hljs-bullet,
.hljs-addition {
  color: #718c00; }

/* Tomorrow Blue */
.hljs-title,
.hljs-section {
  color: #4271ae; }

/* Tomorrow Purple */
.hljs-keyword,
.hljs-selector-tag {
  color: #8959a8; }

.hljs {
  display: block;
  overflow-x: auto;
  background: white;
  color: #4d4d4c;
  padding: 0.5em; }

.hljs-emphasis {
  font-style: italic; }

.hljs-strong {
  font-weight: bold; }

.contents-expand {
  color: #505853;
  font-family: OpenSans, sans-serif;
  font-style: normal;
  font-weight: bold;
  font-size: 14px;
  padding: 5px;
  border-radius: 5px;
  margin: 2px;
  white-space: nowrap;
  background: linear-gradient(#eceeed, #9ca5a0);
  cursor: pointer;
  border: thin solid black;
  float: right;
  margin: 0 100px 0 0; }
  .contents-expand:hover {
    background: #eceeed; }

div.frontMatter.tweak-while-sliding {
  border-style: solid none none none; }

.abstract {
  margin-top: 3em; }