/*
   Taken from style block generated by pandoc (not sure what most does)
   but w/figure & figcaption blocks added, headings numbered & 
   a few settings crudely edited. I'm sure this could be improved 
   significantly.

   It would be really nice to have a <BR clear=all> included as a prefix
   to <figure> but for now a global replacement of <figure> to 
   <BR clear=all><figure> will have to be done as post-processing of the
   .html (see below)

   build commands:
     pandoc --standalone <in> -o <out> --css tutorial.css --mathjax
     sed -i '' 's/<figure>/<BR clear=all><figure>/g' <out>

*/

    figure {
       float: right;
       margin-top: 1.5em;
       margin-bottom: 1.0em;
       max-width: 400px;
    }
    figcaption {
        font-size: 0.95em;
	font-style: italic;
    }
    html {
      color: #1a1a1a;
      background-color: #fdfdfd;
    }
    body {
      margin: 0 auto;
      padding-left: 5px;
      padding-right: 5px;
      padding-top: 10px;
      padding-bottom: 10px;
      min-width: 600px;
      hyphens: auto;
      overflow-wrap: break-word;
      text-rendering: optimizeLegibility;
      font-kerning: normal;
      counter-reset: h2cnt;
    }
    header {
      display: grid;
      background-image: url('https://advancedphotonsource.github.io/GSAS-II-tutorials/_images/gsas2.png');
      background-size: 60px;
      background-position: right; /* Centers the image within the header */
      background-repeat: no-repeat; /* Prevents the image from repeating */
      height: 60px;
      margin-top: 0em;
      margin-bottom: 70px;
      text-align: center;
      counter-reset: h2cnt;
    }
    a {
      color: #ff1111;
    }
    a:visited {
      color: #ff3333;
    }
    h2:before {
	content: counter(h2cnt)") ";
	counter-increment: h2cnt;
    }
    h2 {
	counter-reset: h3cnt;
    }
    h3:before {
	content: counter(h2cnt)"." counter(h3cnt)") ";
	counter-increment: h3cnt;
    }
    h2, h4 {
      color: darkblue;
    }
    h1, h2, h3, h4, h5, h6 {
      margin-top: 1.5em;
      margin-bottom: 0.5em;
      clear: right;
    }

/* unchanged below */
    @media (max-width: 600px) {
      body {
        font-size: 0.9em;
        padding: 12px;
      }
      h1 {
        font-size: 1.8em;
      }
    }
    @media print {
      html {
        background-color: white;
      }
      body {
        background-color: transparent;
        color: black;
        font-size: 12pt;
      }
      p, h2, h3 {
        orphans: 3;
        widows: 3;
      }
      h2, h3, h4 {
        page-break-after: avoid;
      }
    }
    p {
      margin: 1em 0;
    }
    img {
      max-width: 100%;
    }
    svg {
      height: auto;
      max-width: 100%;
    }
    h5, h6 {
      font-size: 1em;
      font-style: italic;
    }
    h6 {
      font-weight: normal;
    }
    ol, ul {
      padding-left: 1.7em;
      margin-top: 1em;
    }
    li > ol, li > ul {
      margin-top: 0;
    }
    blockquote {
      margin: 1em 0 1em 1.7em;
      padding-left: 1em;
      border-left: 2px solid #e6e6e6;
      color: #606060;
    }
    code {
      font-family: Menlo, Monaco, Consolas, 'Lucida Console', monospace;
      font-size: 85%;
      margin: 0;
      hyphens: manual;
    }
    pre {
      margin: 1em 0;
      overflow: auto;
    }
    pre code {
      padding: 0;
      overflow: visible;
      overflow-wrap: normal;
    }
    .sourceCode {
     background-color: transparent;
     overflow: visible;
    }
    hr {
      background-color: #1a1a1a;
      border: none;
      height: 1px;
      margin: 1em 0;
    }
    table {
      margin: 1em 0;
      border-collapse: collapse;
      width: 100%;
      overflow-x: auto;
      display: block;
      font-variant-numeric: lining-nums tabular-nums;
    }
    table caption {
      margin-bottom: 0.75em;
    }
    tbody {
      margin-top: 0.5em;
      border-top: 1px solid #1a1a1a;
      border-bottom: 1px solid #1a1a1a;
    }
    th {
      border-top: 1px solid #1a1a1a;
      padding: 0.25em 0.5em 0.25em 0.5em;
    }
    td {
      padding: 0.125em 0.5em 0.25em 0.5em;
    }
    #TOC li {
      list-style: none;
    }
    #TOC ul {
      padding-left: 1.3em;
    }
    #TOC > ul {
      padding-left: 0;
    }
    #TOC a:not(:hover) {
      text-decoration: none;
    }
