/*
    @font-face styling for fira borrowed from: http://www.carrois.com/en/fira-3-1/
*/
nav {
  background-color: #f9f9f9;
  border-top: 1px solid #e9e9e9;
  border-left: 1px solid #e9e9e9;
  border-right: 1px solid #e9e9e9;
  box-shadow: 0 0 1px rgba(0, 0, 0, 0.07);
  overflow: auto;
  -webkit-overflow-scrolling: touch;
  position: fixed;
  top: 70px;
  width: 230px; }
  nav ul#nav-parts {
    color: gray;
    font-weight: 100;
    line-height: 140%;
    list-style-type: none;
    margin: 0;
    -webkit-padding-start: 0;
    padding-left: 0px; }
    nav ul#nav-parts li.group {
      border-bottom: 1px solid #e9e9e9;
      font-family: 'fira';
      font-size: 1.2em;
      line-height: 150%;
      list-style-type: none;
      margin: 0;
      padding: 10px 30px 10px 20px;
      cursor: pointer;
      color: #333;
      overflow: hidden;
      max-height: 42px;
      transition: all 0.3s; }
      nav ul#nav-parts li.group .groupTitle {
        cursor: pointer; }
      nav ul#nav-parts li.group.selected {
        background-color: white;
        max-height: 800px;
        cursor: default; }
      nav ul#nav-parts li.group ul {
        padding: 0px; }
        nav ul#nav-parts li.group ul li.chapter {
          display: block;
          line-height: 13px;
          margin: 9px 0px; }
          nav ul#nav-parts li.group ul li.chapter a {
            font-size: 13px;
            color: gray; }
          nav ul#nav-parts li.group ul li.chapter li.section {
            display: none;
            font-weight: normal;
            margin: 5px 0px; }
            nav ul#nav-parts li.group ul li.chapter li.section a {
              color: #B8B8B8;
              transition: all 0.2s; }
            nav ul#nav-parts li.group ul li.chapter li.section.selected a {
              color: #EC6A88; }
          nav ul#nav-parts li.group ul li.chapter.selected li.section {
            display: block; }

li.chapter.selected {
  background-color: fff; }

.chapterContents.selected {
  padding-left: 10px;
  border-left: 3px solid #eee; }

.chapterTitle.selected {
  background-color: #f9f9f9;
  padding: 5px;
  margin-bottom: 7px; }

nav ul.chapter.selected {
  background-color: #ccc; }

@font-face {
  font-family: 'firaMono';
  src: url("fonts/eot/FiraMono-Regular.eot");
  /* IE9 Compat Modes */
  src: url("fonts/eot/FiraMono-Regular.eot?") format("embedded-opentype"), url("fonts/woff/FiraMono-Regular.woff") format("woff"), url("fonts/ttf/FiraMono-Regular.ttf") format("truetype");
  /* Safari, Android, iOS */
  font-weight: normal;
  font-style: normal; }

@font-face {
  font-family: 'firaMono';
  src: url("fonts/eot/FiraMono-Bold.eot");
  /* IE9 Compat Modes */
  src: url("fonts/eot/FiraMono-Bold.eot?") format("embedded-opentype"), url("fonts/woff/FiraMono-Bold.woff") format("woff"), url("fonts/ttf/FiraMono-Bold.ttf") format("truetype");
  /* Safari, Android, iOS */
  font-weight: bold;
  font-style: normal; }

@font-face {
  font-family: 'fira';
  src: url("fonts/eot/FiraSans-Light.eot");
  /* IE9 Compat Modes */
  src: url("fonts/eot/FiraSans-Light.eot?") format("embedded-opentype"), url("fonts/woff/FiraSans-Light.woff") format("woff"), url("fonts/ttf/FiraSans-Light.ttf") format("truetype");
  /* Safari, Android, iOS */
  font-weight: normal;
  font-style: normal; }

@font-face {
  font-family: 'fira';
  src: url("fonts/eot/FiraSans-LightItalic.eot");
  /* IE9 Compat Modes */
  src: url("fonts/eot/FiraSans-LightItalic.eot?") format("embedded-opentype"), url("fonts/woff/FiraSans-LightItalic.woff") format("woff"), url("fonts/ttf/FiraSans-LightItalic.ttf") format("truetype");
  /* Safari, Android, iOS */
  font-weight: normal;
  font-style: italic; }

@font-face {
  font-family: 'fira';
  src: url("fonts/eot/FiraSans-Bold.eot");
  /* IE9 Compat Modes */
  src: url("fonts/eot/FiraSans-Bold.eot?") format("embedded-opentype"), url("fonts/woff/FiraSans-Bold.woff") format("woff"), url("fonts/ttf/FiraSans-Bold.ttf") format("truetype");
  /* Safari, Android, iOS */
  font-weight: bold;
  font-style: normal; }

@font-face {
  font-family: 'fira';
  src: url("fonts/eot/FiraSans-BoldItalic.eot");
  /* IE9 Compat Modes */
  src: url("fonts/eot/FiraSans-BoldItalic.eot?") format("embedded-opentype"), url("fonts/woff/FiraSans-BoldItalic.woff") format("woff"), url("fonts/ttf/FiraSans-BoldItalic.ttf") format("truetype");
  /* Safari, Android, iOS */
  font-weight: bold;
  font-style: italic; }

@font-face {
  font-family: 'firaRegular';
  src: url("fonts/eot/FiraSans-Regular.eot");
  /* IE9 Compat Modes */
  src: url("fonts/eot/FiraSans-Regular.eot?") format("embedded-opentype"), url("fonts/woff/FiraSans-Regular.woff") format("woff"), url("fonts/ttf/FiraSans-Regular.ttf") format("truetype");
  /* Safari, Android, iOS */
  font-weight: normal;
  font-style: normal; }

@font-face {
  font-family: 'firaRegular';
  src: url("fonts/eot/FiraSans-RegularItalic.eot");
  /* IE9 Compat Modes */
  src: url("fonts/eot/FiraSans-RegularItalic.eot?") format("embedded-opentype"), url("fonts/woff/FiraSans-RegularItalic.woff") format("woff"), url("fonts/ttf/FiraSans-RegularItalic.ttf") format("truetype");
  /* Safari, Android, iOS */
  font-weight: normal;
  font-style: italic; }

@font-face {
  font-family: 'firaMedium';
  src: url("fonts/eot/FiraSans-Medium.eot");
  /* IE9 Compat Modes */
  src: url("fonts/eot/FiraSans-Medium.eot?") format("embedded-opentype"), url("fonts/woff/FiraSans-Medium.woff") format("woff"), url("fonts/ttf/FiraSans-Medium.ttf") format("truetype");
  /* Safari, Android, iOS */
  font-weight: normal;
  font-style: normal; }

@font-face {
  font-family: 'firaMedium';
  src: url("fonts/eot/FiraSans-MediumItalic.eot");
  /* IE9 Compat Modes */
  src: url("fonts/eot/FiraSans-MediumItalic.eot?") format("embedded-opentype"), url("fonts/woff/FiraSans-MediumItalic.woff") format("woff"), url("fonts/ttf/FiraSans-MediumItalic.ttf") format("truetype");
  /* Safari, Android, iOS */
  font-weight: normal;
  font-style: italic; }

body {
  background-color: #e3e3e3; }

a:link {
  color: #d14;
  text-decoration: none; }

a:visited {
  color: #d14;
  text-decoration: none; }

a:hover {
  color: #d14;
  text-decoration: underline; }

a:active {
  color: #d14;
  text-decoration: none; }

.content-wrapper {
  margin: 0 auto;
  width: 980px; }

.MathJax_Display {
  padding-top: 2em;
  padding-bottom: 2em; }

/*
.of-logo {
  background-image: url('http://openframeworks.cc/images/of-logo.svg');
  background-repeat: no-repeat;
  width:100px;
  height: 100px;
  position:fixed;
  top: 8px;
}*/
.banner {
  position: fixed;
  background-color: rgba(200, 120, 120, 0.9);
  width: 100%;
  left: 0px;
  top: 0px;
  z-index: 200;
  color: white;
  padding: 8px 0px;
  font-size: 16px;
  font-family: 'fira';
  -webkit-box-shadow: 1px 3px 13px rgba(100, 100, 100, 0.6) ;
  -moz-box-shadow: 1px 3px 13px rgba(100, 100, 100, 0.6) ;
  box-shadow: 1px 3px 13px rgba(100, 100, 100, 0.6) ; }
  .banner b {
    font-family: 'firaMedium'; }
  .banner a {
    color: white;
    text-decoration: underline; }

#chapters {
  display: none; }

.chapter-content, .toc {
  width: 734px;
  margin-top: 70px;
  background-color: white;
  display: block;
  margin-left: 246px;
  padding: 15px 25px 30px;
  text-rendering: optimizeLegibility;
  /* a code {
     color:black;
   }*/
  /*
      Fenced off code block look like this: <pre><code></code></pre>
      Fenced code inherits styling from code styling above, as well as
      from pre styling (both below and in bootstrap).
  */ }
  .chapter-content p, .toc p {
    font-family: 'fira';
    font-style: normal;
    font-weight: normal;
    font-size: 15px;
    letter-spacing: 0.02em;
    line-height: 1.6em; }
  .chapter-content ul, .chapter-content li, .toc ul, .toc li {
    font-family: 'fira';
    font-style: normal;
    font-weight: normal;
    font-size: 14px;
    letter-spacing: 0.02em;
    line-height: 1.5em;
    padding-bottom: 5px; }
  .chapter-content h1, .chapter-content h2, .chapter-content h3, .chapter-content h4, .toc h1, .toc h2, .toc h3, .toc h4 {
    font-family: 'firaMedium';
    font-style: normal;
    font-weight: normal; }
  .chapter-content h1, .toc h1 {
    font-weight: 300;
    font-size: 50px;
    margin-top: 1.5em;
    margin-bottom: 1.9em; }
  .chapter-content h2, .toc h2 {
    font-style: italic;
    font-size: 32px;
    margin-top: 2.6em;
    margin-bottom: 0.7em;
    border-color: #cccccc; }
  .chapter-content h2 + h3, .toc h2 + h3 {
    margin-top: -20px; }
  .chapter-content h3, .toc h3 {
    font-size: 20px;
    margin-top: 2em;
    margin-bottom: 0px;
    letter-spacing: 0.025em; }
  .chapter-content h4, .toc h4 {
    font-family: 'fira';
    font-style: italic;
    font-size: 20px;
    margin-top: 2.8em; }
  .chapter-content h1 + p, .toc h1 + p {
    margin-top: -38px; }
  .chapter-content h2 + blockquote, .toc h2 + blockquote {
    margin-top: -26px; }
  .chapter-content code, .toc code {
    border: none;
    color: #EC6A88;
    font-family: 'firaMono';
    font-size: 12px;
    font-style: normal;
    line-height: inherit;
    padding: 3px 5px 3px 5px;
    margin-right: 2px;
    margin-left: 1px;
    text-rendering: normal;
    white-space: nowrap;
    border-radius: 3px;
    background-color: rgba(0, 0, 0, 0.06); }
  .chapter-content pre, .toc pre {
    /*font-family: Menlo, Consolas, "Courier New", Monaco, monospace;
    font-size: 13px;*/
    tab-size: 4;
    border: none !important;
    border-radius: 0px !important;
    white-space: pre-wrap;
    margin-top: -10px;
    padding: 13px 0;
    font-size: 11px; }
    .chapter-content pre code, .toc pre code {
      border-left: 6px solid rgba(197, 213, 229, 0.65);
      position: relative;
      background-color: rgba(0, 0, 0, 0.03);
      width: 650px;
      left: 0px;
      padding: 6px 20px !important;
      color: inherit;
      display: inherit;
      /* required so that pad effects all of the block */
      line-height: inherit;
      text-rendering: normal;
      white-space: inherit; }
  .chapter-content blockquote, .toc blockquote {
    text-align: left;
    margin: 50px;
    background-color: rgba(0, 0, 0, 0.03);
    padding: 10px 10px 10px 20px;
    border-radius: 3px; }
  .chapter-content .figure, .toc .figure {
    padding: 13px 0;
    text-align: center;
    width: 100%; }
    .chapter-content .figure .inner, .toc .figure .inner {
      padding-bottom: 1em;
      padding-top: 1em;
      display: inline-block;
      max-width: 100%; }
  .chapter-content .figure img, .toc .figure img {
    max-width: 100%;
    max-height: 100%;
    -webkit-box-shadow: 1px 3px 13px rgba(100, 100, 100, 0.6) ;
    -moz-box-shadow: 1px 3px 13px rgba(100, 100, 100, 0.6) ;
    box-shadow: 1px 3px 13px rgba(100, 100, 100, 0.6) ; }
  .chapter-content .caption, .toc .caption {
    color: #CCCCCC;
    font-family: "fira";
    font-size: 12px;
    font-style: italic;
    line-height: 2em;
    text-align: center;
    float: right;
    /*float:right;
    padding-right:10px;*/
    padding-top: 8px; }
  .chapter-content .footer, .toc .footer {
    font-family: "fira";
    margin-top: 50px;
    padding: 15px 0px; }
    .chapter-content .footer #prev_chapter, .toc .footer #prev_chapter {
      float: left; }
    .chapter-content .footer #next_chapter, .toc .footer #next_chapter {
      float: right; }

.toc {
  width: 980;
  margin-left: 0px; }
  .toc .toc-wrapper {
    -webkit-column-count: 2;
    /* Chrome, Safari, Opera */
    -moz-column-count: 2;
    /* Firefox */
    column-count: 2; }
    .toc .toc-wrapper h3 {
      margin-top: 0; }
    .toc .toc-wrapper ul {
      list-style-type: none; }
    .toc .toc-wrapper .tocSection {
      margin: 0;
      -webkit-column-break-inside: avoid;
      /* Chrome, Safari */
      page-break-inside: avoid;
      /* Theoretically FF 20+ */
      break-inside: avoid-column;
      /* IE 11 */
      display: table;
      /* Actually FF 20+ */ }

#help {
  font-family: 'fira';
  color: #FFF;
  background-color: rgba(120, 120, 120, 0.4);
  margin-top: 50px;
  padding: 10px; }

code span.dv {
  color: #3A00DC; }

code span.kw {
  color: #C800A4;
  font-weight: normal; }

code span.dt {
  color: #C800A4; }

code span.co {
  color: #008E00; }

code span.ot {
  color: #902000; }

code span.st {
  color: #DF0002; }

/* Styling for bash fenced code blocks */
code.sourceCode.bash span.kw {
  color: inherit;
  font-weight: normal; }

code.sourceCode.bash span.co {
  font-style: normal; }