@import url(https://fonts.googleapis.com/css?family=PT+Sans:400,400italic,700,700italic);
@import url(https://fonts.googleapis.com/css?family=PT+Serif:400,400italic,700,700italic);
@import url(https://fonts.googleapis.com/css?family=Istok+Web:400,400italic,700,700italic);

@media (prefers-color-scheme: light)
{
  :root {
    --page-bg: white;
    --alt-bg:#f0f0f0;
    --page-fg: black;
    --related-bg: #eeeed2;
    --page-blue: blue;
    --color-visited: #0af;
    --color-purple-dark:#53004b;
    --color-purple:#580da6;
  }
}
@media (prefers-color-scheme: dark)
{
  :root {
    --page-bg: #111;
    --alt-bg:#222;
    --page-fg: #eee;
    --related-bg: #cccca2;
    --page-blue: #08f;
    --color-visited: #0af;
    --color-purple-dark:#b340ab;
    --color-purple:#c2aed4;

  }
}

body
{ 
  max-width:700pt;
  margin:18pt;
  font-family: 'PT Serif', serif;
  font-size:12pt;
  background-color:var(--page-bg);
  color:var(--page-fg);
}

 h1 {font-family: 'PT Sans', sans-serif; font-weight: bold;}
 h2 {font-family: 'PT Sans', sans-serif; }
 h3 {font-family: 'PT Sans', sans-serif; }
 h4 {color: var(--page-bg); font-family: 'PT Sans', sans-serif; }

a:link {text-decoration:none; color:var(--page-blue);}
a:link:hover {  text-decoration:underline;  color:#f80da6;  }
a:visited { text-decoration:none; color:var(--color-visited); }
a:visited:hover {  text-decoration:underline;  color:#f80da6;  }

 p.not-too-wide { max-width:40em; }
 div.not-too-wide p { max-width:40em; }
 div.narrow p { margin-right: 40%; margin-left:10%;}

table.whatsnew { border:dotted thin; background:var(--alt-bg); }
table.whatsnew td { padding:10pt; background:var(--alt-bg); }

div.whats-new
{
  font-size:14pt;
  font-family:'PT Sans', sans-serif;
  margin-bottom:6pt;
}
div.whats-new img
{
  margin-right:0pt;
  border-style:none;
}



span.readybb
{
  color:red;
  font-family:'PT Sans', sans-serif;
  font-weight:bold;
  text-decoration:blink;
  font-size:35pt;
}

span.readyb
{
  color:red;
  font-family:'PT Sans', sans-serif;
  font-weight:bold;
  text-decoration:blink;
  font-size:25pt;
}

span.ready
{
  color:red;
  font-family:'PT Sans', sans-serif;
  font-weight:bold;
  font-size:20pt;
}

/* Grade Table */

.img-grades
{
  width:100%;
}

@media (prefers-color-scheme: dark)
{
  .img-grades
  {
    background:#444;
  }
}

span.h:hover
{ 
  background:var(--alt-bg);
}

span.h b
{
  padding-left:5pt;
  padding-right:5pt;
}
span.h:hover b
{
  color:var(--page-blue);
}

  span.hf, span.hh {
   font-weight:bold;
  }
  span.ht
  {
   padding-left:6pt;
   padding-right:6pt;
   padding-bottom:2pt;
   border-bottom:thin var(--page-fg) solid;
  }
  span.hb
  {
   padding-left:6pt;
   padding-right:6pt;
   padding-bottom:2pt;
   border-top:thin var(--page-fg) solid;
  }
  span.h
  {
   padding-left:6pt;
   padding-right:6pt;
   padding-bottom:2pt;
  }
  span.hh
  {
   padding-left:6pt;
   padding-right:6pt;
   padding-bottom:2pt;
  }

@media (prefers-color-scheme: light)
{
  span.h:nth-child(4n), span.h:nth-child(4n+1)
  {
    background:#ddd;
  }
}
@media (prefers-color-scheme: dark)
{
  span.h:nth-child(4n), span.h:nth-child(4n+1)
  {
    background:#333;
  }
}


 /* References */

body.refs
{
 font-family:"Istok Web", sans-serif;
}

table.refs-table
{
  background:var(--alt-bg);
}

td.refs-nav-col
{
  width:20em;
  vertical-align:top;
}

td.refs-nav-col > div
{
  width:20em;
  padding-bottom: 12pt;
  margin-right:12pt;
  vertical-align:top;
  position:fixed;
}

td.refs-content-col
{
  padding-left:12pt;
  padding-right:12pt;
  background:var(--page-bg);
  font-family:"Istok Web";
}

div.refs-nav-link
{
  padding-left:12pt;
  padding-right:12pt;
  padding-top:12pt;
  font-size:14pt;
  font-family:"Istok Web", sans-serif;
}

div.refs-nav-link a
{
  color:var(--color-purple-dark);
}

 h2.refs-cat
 {
   font-size:16pt;
   font-family:"Istok Web", sans-serif;
   font-weight:normal;
   color:var(--color-purple-dark);
 }

 h3.refs-subcat
 {
   margin-left:0pt;
   margin-top:18pt;
   margin-bottom:12pt;
   font-size:12pt;
   font-family:"Istok Web", sans-serif;
   font-weight:normal;
   color:var(--color-purple-dark);
 }

 div.ritem
 {
   padding-left:6pt;
   margin-bottom:18pt;
   width:40em;
 }

 div.rtitle
 {
   font-size:12pt;
   font-family:"Istok Web", sans-serif;
   /* font-weight:bold; */
   color:var(--color-purple);
   margin-bottom:5pt;
 }
 div.rdesc
 {
   margin-bottom:5pt;
 }
 div.rlink
 {
   font-size:10pt;
 }


div.zoom-item
{
}

span.zoom-descr
{
  margin-left:6pt;
  font-style:italic;
}