code, pre {
  font-family: 'Fira Mono', monospace;
  font-size: 90%;
  line-height: 140%; /* inter-line spacing */
  /*color: #0E2F70;*/
}

/* NB We use page_header, not header, because header is used by Pandoc when
 * generating table headers */
.page_header {
  font-size: 50px;
  text-transform: uppercase;
  text-align: center;
  padding: 60px 0;
  font-family: "Droid Serif", serif;
  font-weight: 400;
  line-height: 1.1;
}
h1, h2, h3 {
  font-family: "Signika", sans-serif;
  font-weight: 400;
  line-height: 1.1;
}

.page_header a:link, 
.page_header a:visited, 
.page_header a:hover, 
.page_header a:active,
.footer a:link, 
.footer a:visited, 
.footer a:hover, 
.footer a:active,
h1 a:link, 
h1 a:visited, 
h1 a:hover, 
h1 a:active
{
  text-decoration: none;
  color: inherit;
}

a:link, 
a:visited, 
a:hover, 
a:active
{
  color: blue;
}

html, body {
  /* for sticky footer */
  height: 100%;
}

body {
  font-family: "Lato", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 17px;
  line-height: 160%; /* inter-line spacing */
  color: #222;
  margin: 0;
  padding: 0;
  word-spacing: 0.7px;
  background-color: #F5F6F8;
  background-image: none;
}


/* the purpose of this container is to limit the width of the content */
.container2 {
  margin-right: auto;
  margin-left: auto;
  max-width: 1080px;
  width: 75%;
}

.whitebox {
  background-color: #FEFEFE;
  overflow: auto;
}

.postbox {
  padding: 30px;
  margin: 30px 0;
}

h1, h2, h3 {
  margin-top: 20px;
  margin-bottom: 10px;
}

div.container > p {
  margin-left: 20px;
}

pre {
  margin-left: 30px;
}

a:link {
  text-decoration: none;
}
a:visited {
  text-decoration: none;
}
a:hover {
  text-decoration: underline;
}
a:active {
  text-decoration: underline;
}
figure {
  margin: inherit;
  text-align: center;
}
@media (max-width: 800px) {
  .container2 {
    width: 100%;
  }
  .postbox {
    padding: 5px;
  }
}
@media (max-width: 500px) {
  .pic {
    width: 150px;
  }
}
@media (max-width: 300px) {
  .pic {
    width: 100px;
  }
}

/* do not let images outsize their containers */
img { max-width: 100%; }

/* Adapted from http://css-tricks.com/examples/hrs/
 */
hr {
    border: 0;
    height: 1px;
    background-image: -webkit-linear-gradient(left, rgba(150,150,150,0), rgba(150,150,150,0.75), rgba(150,150,150,0));
    background-image:    -moz-linear-gradient(left, rgba(150,150,150,0), rgba(150,150,150,0.75), rgba(150,150,150,0)); 
    background-image:     -ms-linear-gradient(left, rgba(150,150,150,0), rgba(150,150,150,0.75), rgba(150,150,150,0)); 
    background-image:      -o-linear-gradient(left, rgba(150,150,150,0), rgba(150,150,150,0.75), rgba(150,150,150,0)); 
}

/*********************************************************************
                              Fonts
*********************************************************************/
/* Headers */
@font-face {
  font-family: 'Signika';
  font-style: normal;
  font-weight: 400;
  src: local('Signika'), local('Signika-Regular'), url(//fonts.gstatic.com/s/signika/v6/ejLRhBEorqjLDaF8s-xuTQ.ttf) format('truetype');
}
/* Body */
@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-weight: 400;
  src: local('Lato Regular'), local('Lato-Regular'), url(//fonts.gstatic.com/s/lato/v11/v0SdcGFAl2aezM9Vq_aFTQ.ttf) format('truetype');
}
/* Title header */
@font-face {
  font-family: 'Droid Serif';
  font-style: normal;
  font-weight: 400;
  src: local('Droid Serif'), local('DroidSerif'), url(https://fonts.gstatic.com/s/droidserif/v6/0AKsP294HTD-nvJgucYTaI4P5ICox8Kq3LLUNMylGO4.woff2) format('woff2'), url(https://fonts.gstatic.com/s/droidserif/v6/0AKsP294HTD-nvJgucYTaIbN6UDyHWBl620a-IRfuBk.woff) format('woff');
}
/* Code */
@font-face {
  font-family: 'Fira Mono';
  font-style: normal;
  font-weight: 400;
  src: local('Fira Mono'), local('FiraMono'), url(//fonts.gstatic.com/s/firamono/v3/SlRWfq1zeqXiYWAN-lnG-qCWcynf_cDxXwCLxiixG1c.ttf) format('truetype');
}
@font-face {
  font-family: 'Fira Mono';
  font-style: normal;
  font-weight: 700;
  src: local('Fira Mono Bold'), local('FiraMono-Bold'), url(//fonts.gstatic.com/s/firamono/v3/l24Wph3FsyKAbJ8dfExTZ4nF5uFdDttMLvmWuJdhhgs.ttf) format('truetype');
}

/*********************************************************************
                        Syntax highlighting 
*********************************************************************/
table.sourceCode, tr.sourceCode, td.lineNumbers, td.sourceCode, table.sourceCode pre 
   { margin: 0; padding: 0; border: 0; vertical-align: baseline; border: none; }
td.lineNumbers { border-right: 1px solid #AAAAAA; text-align: right; color: #AAAAAA; padding-right: 5px; padding-left: 5px; }
td.sourceCode { padding-left: 5px; }
code.sourceCode span.kw { color: #007020; font-weight: bold; } 
code.sourceCode span.dt { color: #624F03; }
code.sourceCode span.dv { color: #40a070; }
code.sourceCode span.bn { color: #40a070; }
code.sourceCode span.fl { color: #40a070; }
code.sourceCode span.ch { color: #4070a0; }
code.sourceCode span.st { color: #4070a0; }
code.sourceCode span.co { color: #60a0b0; font-style: italic; }
code.sourceCode span.ot { color: #007020; }
code.sourceCode span.al { color: red; font-weight: bold; }
code.sourceCode span.fu { color: #06287e; }
code.sourceCode span.re { }
code.sourceCode span.er { color: red; font-weight: bold; }