:root {
  --color-white: white;
  --color-black: black;
  /* --color-blue: #038; */
  --color-red: #800;
  --color-grey: grey;
  --color-athens-grey: #f2f4f7;
  --color-light-grey: #ccc;
  --color-yellow: #fffbdd;
  --color-obs: #006951;
  --color-bg: #fff5d1;
  --color-low: #162dab;
  --color-high: #d11305;
}

header {
  max-width: 770px;
  margin: 0 auto;
  padding: 0em 2em;
}

main, .content {
  word-break: break-word;
  margin-bottom: 5%;
  padding: 2em;
}

body {
  margin: 40px auto;
  max-width: 770px;
  line-height: 1.4;
  color: var(--color-black);
  padding: 0 1em;
  font-size: 1.1em;
}

/* --- Code blocks --- */
code, pre {
  font-family: "Roboto Mono", monospace;
  font-weight: 300;
  line-height: 1.35em;
}

/* Inline code */
code {
  background-color: #f9f9f9;
  font-weight: 400; /* keep inline code slightly bolder */
  padding: 0.1em 0.25em;
  border-radius: 3px;
}

/* Pre blocks */
pre {
  position: relative;
  background-color: #fbfbfb;
  color: #00008b;
  overflow: auto;
  margin: 0;
  padding: 0.25em 0.5em;
  border-left: 2px dotted #00008b;
}

/* Language labels */
pre::before {
  color: #cccccc;
  float: left;
  text-align: right;
  font-weight: 300;
  width: 3em;
  margin-left: -4.25em;
  font-variant: small-caps;
  content: "";
}
pre.src-lisp::before  { content: "lisp"; }
pre.src-org::before   { content: "org"; }
pre.src-cpp::before   { content: "c++"; }
pre.src-c::before     { content: "c"; }
pre.src-rust::before  { content: "rust"; }

/* Optional: specific class for pre.src to allow folding or extra styling */
pre.src {
  overflow: visible;
}

/* --- Code folding --- */
details {
  color: rgba(48,63,159, 1.00);
  background: #fbfbfb;
  border: 1px solid rgba(48,63,159, 1.00);
  border-radius: 3px;
  padding:  0.25em;
  margin-bottom: 1.0em;
}
details pre {
  border: 0;
}
details pre.src-lisp::before { content: ""; }
summary {
  outline: 0;
  color: rgba(48,63,159, 1.00);
}
summary::after {
  font-size: 0.85em;
  color: rgba(48,63,159, 0.25);
  display: inline-block;
  float: right;
  content: "Click to fold/unfold";
  padding-right:  0.5em;
}

/* --- Table --- */
table { min-width: 100%; }
table, tbody, td, tr, th, colgroup, thead {
  border: 0;
  /*    padding: 0;*/
}
table {
  margin-top: 1em;
}
thead {
  border-bottom: 1px dashed black;
}
th {
  text-align: left;
  font-weight: 400;
  padding: 0;
  margin-bottom: 0.25em;
  padding-bottom: 0.25em;
}
td { padding: 0; }

tr:nth-child(even) {background: #f9f9f9;}
tr:nth-child(odd) {background: #ffffff;}
tbody {
  /* border-bottom: 1px solid black; */
}

/* dd { */
/*   margin-top: 0.25em; */
/*   margin-bottom: 0.50em; */
/* } */

/*
 * Really skinny views
 */
  @media only screen and (max-width: 600px) { .content { padding: 2em 1em; } }
  @media only screen and (max-width: 400px) { body { padding: 0; } }
