.title {
    text-indent : 3.2em hanging;
    text-align: left;
}


:root {
    --table_head_color: #BBB;
    --table_even_color: #DDD;
    --table_odd_color: #FEFEFE;
    --table_head_fontcolor: #000;
    --table_even_fontcolor: #000;
    --table_odd_fontcolor: #000;
    --white: #ffffff;
    --fig-caption-bg-color: #355681;
    --fig-caption-color: white;
    --h1-color: #355681;
    --h2-color: white;
    --h2-bg-color1: rgba(53,86,129, 1.0);
    --h2-bg-color2: rgba(61, 92, 133, 0.95);
    --h2-bg-color-print: rgba(53,86,129,0.2);
    --h3-color: #355681;
    --h4-color: #788699;
    --h5-color: #355681;
    --h6-color: #355681;
  }


/*org content*/
#content {max-width:800px}

.section-footnotes {
    background:#ffffe0;
    margin-left:auto;
    margin-top:0pt;
    padding-top:-20pt;
    padding-bottom:0pt;
    padding-left:0pt;
    padding-right:0pt;
    margin-right:0;
    max-width:400px;
    font-size:8pt;
    border-radius: 15px 0px 0 0; /* Rounded top corners */
    border: 1px solid #ccc; /* Optional: border for visibility */

    .org-ul{
        
    }
}
.footnote {color:tan; a:link{color:tan}}

.example {
    border-left: 5px solid darkgray;
}

.src {
    border-left: 5px solid royalblue;
    :hover{background:white;};
    ::selection {background: yellow;};
    .org-string{color:seagreen;};
    .org-variable-name{color:royalblue;};
    .org-comment{color: darkgreen;font-weight:bolder;font-style:italic; };
    .org-type{color:darkred;};
    .org-keyword{color:dodgerblue;};
    .org-highlight-numbers-number{color:red;font-variant-numeric:slashed-zero;};
    .org-function-name{color:darkmagenta;};
    .org-rainbow-delimiters-depth-2{color: magenta;font-weight:bolder;};
    .org-rainbow-delimiters-depth-3{color: darkgreen;font-weight:bolder;};
    .org-rainbow-delimiters-depth-1{color: darkblue;font-weight:bolder;};
    .org-comment-delimiter {color: darkgreen;}
}


blockquote {
    border-left: 5px solid gray;
    background: lightgrey;
}




.warning{
    border-left: 5px solid maroon;
    /*background:linear-gradient(to right,#B99,#B99 80%,#BAA);*/
    background:#B99;
    border-radius: 10px 10px 10px 10px;
    box-shadow: 3px 3px 6px rgb(0,0,0,0.2);
    padding-right:0px;
    padding-bottom:1px;
    h3 {
        background: #A88;
        border-radius: 10px 10px 0px 0px;
        :before{content: X;}
    }
}


.good{
    border-left: 5px solid green;
    background:#9B9;
    border-radius: 10px 10px 10px 10px;
    box-shadow: 3px 3px 6px rgb(0,0,0,0.2);
    padding-right:0px;
    padding-bottom:1px;
    h3 {
        background: #8A8;
        border-radius: 10px 10px 0px 0px;
        :before{content: X;}
    }
}





.box-warning{
    background:#B99;
    border-radius: 10px 10px 10px 10px;
    box-shadow: 3px 3px 6px rgb(0,0,0,0.2);
    padding-right:0px;

    h3 {
        background: #A88;
        border-radius: 10px 10px 0px 0px;
        :before{content: X;}
    }

}


.box-warning-title{
    color:#e0dbd1;
}

.box-warning-top{
    background-image: linear-gradient(to right, #52796f , #84a98c);
    border-radius: 10px 10px 0px 0px;
    padding-left: 20px;
    margin-bottom: 0px;
    bottom:0px;
    margin:0px;
}

.box-warning-bottom{
    background:#cad2c5;
    border-radius: 0px 0px 10px 10px;
    padding-left: 20px;
    padding-right: 20px;
    margin-top:0px;
    bottom:0px;
    margin-top:-18px
}


/*peek
example
document
note
pin
careful
overview

goal::danger
left::right
code::notes*/


/* .torn-paper{
  width: 400px;
  background: tomato;
  -webkit-clip-path: polygon(0% 0%, 0% 97%, 2% 95%, 6% 99%, 12% 88%, 18% 92%, 27% 90%, 31% 97%, 39% 91%, 47% 95%, 60% 83%, 62% 81%, 69% 93%, 72% 96%, 79% 87%, 100% 99%, 100% 0%);
  clip-path: polygon(0% 0%, 0% 99%, 2% 98%, 6% 99%, 12% 98%, 18% 100%, 27% 99%, 31% 98%, 39% 99%, 47% 98%, 60% 99%, 62% 98%, 69% 99%, 72% 98%, 79% 97%,82% 99%, 89% 97%,94% 99%,99% 98%, 100% 99%, 100% 0%);  
} */

.torn-paper{
  background: tomato;
  -webkit-clip-path: polygon(0 0,
0pt 99%,8pt 98%,16pt 98%,24pt 100%,32pt 98%,40pt 97%,48pt 97%,56pt 97%,64pt 97%,72pt 100%,80pt 100%,88pt 100%,96pt 99%,104pt 99%,112pt 99%,120pt 100%,128pt 98%,136pt 98%,144pt 98%,152pt 98%,160pt 100%,168pt 97%,176pt 100%,184pt 97%,192pt 99%,200pt 99%,208pt 100%,216pt 98%,224pt 99%,232pt 100%,240pt 98%,248pt 98%,256pt 100%,264pt 98%,272pt 98%,280pt 97%,288pt 97%,296pt 99%,304pt 100%,312pt 100%,320pt 98%,328pt 99%,336pt 97%,344pt 98%,352pt 99%,360pt 97%,368pt 98%,376pt 98%,384pt 97%,392pt 99%,400pt 97%,408pt 98%,416pt 99%,424pt 100%,432pt 98%,440pt 99%,448pt 100%,456pt 97%,464pt 98%,472pt 98%,480pt 100%,488pt 98%,496pt 99%,504pt 99%,512pt 99%,520pt 99%,528pt 97%,536pt 97%,544pt 99%,552pt 97%,560pt 100%,568pt 100%,576pt 97%,584pt 99%,592pt 98%,600pt 97%,608pt 100%,616pt 98%,624pt 98%,632pt 100%,640pt 97%,648pt 97%,656pt 98%,664pt 98%,672pt 99%,680pt 99%,688pt 99%,696pt 97%,704pt 98%,712pt 98%,720pt 97%,728pt 100%,736pt 98%,744pt 97%,752pt 97%,760pt 99%,768pt 99%,776pt 100%,784pt 100%,792pt 100%,800pt 97%,
800pt 1%,792pt 1%,784pt 2%,776pt 0%,768pt 0%,760pt 0%,752pt 0%,744pt 2%,736pt 2%,728pt 2%,720pt 0%,712pt 0%,704pt 2%,696pt 2%,688pt 1%,680pt 3%,672pt 2%,664pt 0%,656pt 1%,648pt 2%,640pt 0%,632pt 0%,624pt 1%,616pt 1%,608pt 0%,600pt 3%,592pt 3%,584pt 0%,576pt 0%,568pt 0%,560pt 1%,552pt 3%,544pt 1%,536pt 0%,528pt 1%,520pt 0%,512pt 1%,504pt 1%,496pt 1%,488pt 1%,480pt 3%,472pt 0%,464pt 3%,456pt 0%,448pt 0%,440pt 1%,432pt 0%,424pt 1%,416pt 2%,408pt 2%,400pt 1%,392pt 0%,384pt 3%,376pt 2%,368pt 2%,360pt 1%,352pt 2%,344pt 2%,336pt 0%,328pt 0%,320pt 1%,312pt 1%,304pt 0%,296pt 2%,288pt 2%,280pt 1%,272pt 2%,264pt 1%,256pt 2%,248pt 0%,240pt 0%,232pt 2%,224pt 0%,216pt 2%,208pt 3%,200pt 0%,192pt 3%,184pt 2%,176pt 2%,168pt 0%,160pt 2%,152pt 1%,144pt 2%,136pt 0%,128pt 3%,120pt 0%,112pt 1%,104pt 0%,96pt 1%,88pt 2%,80pt 1%,72pt 0%,64pt 3%,56pt 0%,48pt 0%,40pt 2%,32pt 1%,24pt 2%,16pt 0%,8pt 1%);
}



.torn-paper-t{
  background: tomato;
  -webkit-clip-path: polygon(0 0,
0pt 100%,800pt 100%,
800pt 1%,792pt 1%,784pt 2%,776pt 0%,768pt 0%,760pt 0%,752pt 0%,744pt 2%,736pt 2%,728pt 2%,720pt 0%,712pt 0%,704pt 2%,696pt 2%,688pt 1%,680pt 3%,672pt 2%,664pt 0%,656pt 1%,648pt 2%,640pt 0%,632pt 0%,624pt 1%,616pt 1%,608pt 0%,600pt 3%,592pt 3%,584pt 0%,576pt 0%,568pt 0%,560pt 1%,552pt 3%,544pt 1%,536pt 0%,528pt 1%,520pt 0%,512pt 1%,504pt 1%,496pt 1%,488pt 1%,480pt 3%,472pt 0%,464pt 3%,456pt 0%,448pt 0%,440pt 1%,432pt 0%,424pt 1%,416pt 2%,408pt 2%,400pt 1%,392pt 0%,384pt 3%,376pt 2%,368pt 2%,360pt 1%,352pt 2%,344pt 2%,336pt 0%,328pt 0%,320pt 1%,312pt 1%,304pt 0%,296pt 2%,288pt 2%,280pt 1%,272pt 2%,264pt 1%,256pt 2%,248pt 0%,240pt 0%,232pt 2%,224pt 0%,216pt 2%,208pt 3%,200pt 0%,192pt 3%,184pt 2%,176pt 2%,168pt 0%,160pt 2%,152pt 1%,144pt 2%,136pt 0%,128pt 3%,120pt 0%,112pt 1%,104pt 0%,96pt 1%,88pt 2%,80pt 1%,72pt 0%,64pt 3%,56pt 0%,48pt 0%,40pt 2%,32pt 1%,24pt 2%,16pt 0%,8pt 1%);
}



.torn-paper-b{
  background: tomato;
  -webkit-clip-path: polygon(0 0,
0pt 99%,8pt 98%,16pt 98%,24pt 100%,32pt 98%,40pt 97%,48pt 97%,56pt 97%,64pt 97%,72pt 100%,80pt 100%,88pt 100%,96pt 99%,104pt 99%,112pt 99%,120pt 100%,128pt 98%,136pt 98%,144pt 98%,152pt 98%,160pt 100%,168pt 97%,176pt 100%,184pt 97%,192pt 99%,200pt 99%,208pt 100%,216pt 98%,224pt 99%,232pt 100%,240pt 98%,248pt 98%,256pt 100%,264pt 98%,272pt 98%,280pt 97%,288pt 97%,296pt 99%,304pt 100%,312pt 100%,320pt 98%,328pt 99%,336pt 97%,344pt 98%,352pt 99%,360pt 97%,368pt 98%,376pt 98%,384pt 97%,392pt 99%,400pt 97%,408pt 98%,416pt 99%,424pt 100%,432pt 98%,440pt 99%,448pt 100%,456pt 97%,464pt 98%,472pt 98%,480pt 100%,488pt 98%,496pt 99%,504pt 99%,512pt 99%,520pt 99%,528pt 97%,536pt 97%,544pt 99%,552pt 97%,560pt 100%,568pt 100%,576pt 97%,584pt 99%,592pt 98%,600pt 97%,608pt 100%,616pt 98%,624pt 98%,632pt 100%,640pt 97%,648pt 97%,656pt 98%,664pt 98%,672pt 99%,680pt 99%,688pt 99%,696pt 97%,704pt 98%,712pt 98%,720pt 97%,728pt 100%,736pt 98%,744pt 97%,752pt 97%,760pt 99%,768pt 99%,776pt 100%,784pt 100%,792pt 100%,800pt 97%,
800pt 0%);
}








.torn-paper-1{
  background: tomato;
  -webkit-clip-path: polygon(0 0,
0pt 95%,8pt 98%,16pt 96%,24pt 95%,32pt 100%,40pt 95%,48pt 92%,56pt 91%,64pt 92%,72pt 90%,80pt 93%,88pt 98%,96pt 98%,104pt 94%,112pt 93%,120pt 93%,128pt 100%,136pt 90%,144pt 92%,152pt 94%,160pt 91%,168pt 94%,176pt 95%,184pt 100%,192pt 100%,200pt 99%,208pt 98%,216pt 93%,224pt 93%,232pt 91%,240pt 91%,248pt 91%,256pt 100%,264pt 93%,272pt 97%,280pt 94%,288pt 95%,296pt 100%,304pt 90%,312pt 96%,320pt 92%,328pt 99%,336pt 97%,344pt 95%,352pt 99%,360pt 100%,368pt 97%,376pt 93%,384pt 95%,392pt 98%,400pt 92%,408pt 99%,416pt 100%,424pt 91%,432pt 94%,440pt 97%,448pt 95%,456pt 95%,464pt 96%,472pt 93%,480pt 96%,488pt 93%,496pt 92%,504pt 91%,512pt 95%,520pt 90%,528pt 97%,536pt 93%,544pt 97%,552pt 100%,560pt 99%,568pt 97%,576pt 98%,584pt 99%,592pt 97%,600pt 95%,608pt 97%,616pt 97%,624pt 91%,632pt 95%,640pt 97%,648pt 93%,656pt 91%,664pt 91%,672pt 100%,680pt 95%,688pt 90%,696pt 92%,704pt 100%,712pt 91%,720pt 100%,728pt 98%,736pt 98%,744pt 94%,752pt 92%,760pt 95%,768pt 90%,776pt 100%,784pt 94%,792pt 91%,800pt 90%,
800pt 9%,792pt 8%,784pt 10%,776pt 3%,768pt 8%,760pt 2%,752pt 7%,744pt 5%,736pt 9%,728pt 10%,720pt 4%,712pt 2%,704pt 5%,696pt 10%,688pt 4%,680pt 5%,672pt 9%,664pt 3%,656pt 7%,648pt 7%,640pt 4%,632pt 0%,624pt 2%,616pt 6%,608pt 9%,600pt 7%,592pt 6%,584pt 6%,576pt 4%,568pt 3%,560pt 9%,552pt 6%,544pt 5%,536pt 6%,528pt 6%,520pt 2%,512pt 5%,504pt 9%,496pt 8%,488pt 4%,480pt 0%,472pt 9%,464pt 9%,456pt 0%,448pt 4%,440pt 0%,432pt 9%,424pt 1%,416pt 3%,408pt 3%,400pt 1%,392pt 0%,384pt 0%,376pt 9%,368pt 10%,360pt 10%,352pt 1%,344pt 5%,336pt 6%,328pt 6%,320pt 3%,312pt 7%,304pt 1%,296pt 2%,288pt 10%,280pt 8%,272pt 8%,264pt 10%,256pt 1%,248pt 9%,240pt 5%,232pt 5%,224pt 10%,216pt 0%,208pt 1%,200pt 4%,192pt 4%,184pt 10%,176pt 10%,168pt 0%,160pt 7%,152pt 6%,144pt 9%,136pt 10%,128pt 3%,120pt 7%,112pt 5%,104pt 7%,96pt 5%,88pt 5%,80pt 5%,72pt 7%,64pt 1%,56pt 0%,48pt 7%,40pt 9%,32pt 8%,24pt 7%,16pt 10%,8pt 8%);
}


.torn-paper-t-1{
  background: tomato;
  -webkit-clip-path: polygon(0 0,
0pt 100%,800pt 100%,
800pt 9%,792pt 8%,784pt 10%,776pt 3%,768pt 8%,760pt 2%,752pt 7%,744pt 5%,736pt 9%,728pt 10%,720pt 4%,712pt 2%,704pt 5%,696pt 10%,688pt 4%,680pt 5%,672pt 9%,664pt 3%,656pt 7%,648pt 7%,640pt 4%,632pt 0%,624pt 2%,616pt 6%,608pt 9%,600pt 7%,592pt 6%,584pt 6%,576pt 4%,568pt 3%,560pt 9%,552pt 6%,544pt 5%,536pt 6%,528pt 6%,520pt 2%,512pt 5%,504pt 9%,496pt 8%,488pt 4%,480pt 0%,472pt 9%,464pt 9%,456pt 0%,448pt 4%,440pt 0%,432pt 9%,424pt 1%,416pt 3%,408pt 3%,400pt 1%,392pt 0%,384pt 0%,376pt 9%,368pt 10%,360pt 10%,352pt 1%,344pt 5%,336pt 6%,328pt 6%,320pt 3%,312pt 7%,304pt 1%,296pt 2%,288pt 10%,280pt 8%,272pt 8%,264pt 10%,256pt 1%,248pt 9%,240pt 5%,232pt 5%,224pt 10%,216pt 0%,208pt 1%,200pt 4%,192pt 4%,184pt 10%,176pt 10%,168pt 0%,160pt 7%,152pt 6%,144pt 9%,136pt 10%,128pt 3%,120pt 7%,112pt 5%,104pt 7%,96pt 5%,88pt 5%,80pt 5%,72pt 7%,64pt 1%,56pt 0%,48pt 7%,40pt 9%,32pt 8%,24pt 7%,16pt 10%,8pt 8%);
}

.torn-paper-b-1{
  background: tomato;
  -webkit-clip-path: polygon(0 0,
0pt 95%,8pt 98%,16pt 96%,24pt 95%,32pt 100%,40pt 95%,48pt 92%,56pt 91%,64pt 92%,72pt 90%,80pt 93%,88pt 98%,96pt 98%,104pt 94%,112pt 93%,120pt 93%,128pt 100%,136pt 90%,144pt 92%,152pt 94%,160pt 91%,168pt 94%,176pt 95%,184pt 100%,192pt 100%,200pt 99%,208pt 98%,216pt 93%,224pt 93%,232pt 91%,240pt 91%,248pt 91%,256pt 100%,264pt 93%,272pt 97%,280pt 94%,288pt 95%,296pt 100%,304pt 90%,312pt 96%,320pt 92%,328pt 99%,336pt 97%,344pt 95%,352pt 99%,360pt 100%,368pt 97%,376pt 93%,384pt 95%,392pt 98%,400pt 92%,408pt 99%,416pt 100%,424pt 91%,432pt 94%,440pt 97%,448pt 95%,456pt 95%,464pt 96%,472pt 93%,480pt 96%,488pt 93%,496pt 92%,504pt 91%,512pt 95%,520pt 90%,528pt 97%,536pt 93%,544pt 97%,552pt 100%,560pt 99%,568pt 97%,576pt 98%,584pt 99%,592pt 97%,600pt 95%,608pt 97%,616pt 97%,624pt 91%,632pt 95%,640pt 97%,648pt 93%,656pt 91%,664pt 91%,672pt 100%,680pt 95%,688pt 90%,696pt 92%,704pt 100%,712pt 91%,720pt 100%,728pt 98%,736pt 98%,744pt 94%,752pt 92%,760pt 95%,768pt 90%,776pt 100%,784pt 94%,792pt 91%,800pt 90%,
800pt 0%);
}

  .collapsible {
    cursor: pointer;
    /*
    background-color: #777;
    color: white;
    padding: 18px;
    width: 100%;
    border: none;
    text-align: left;
    outline: none;
    font-size: 15px;
    */
  }
  
  .active .collapsible:hover {
    background-color: #555;
  }
  
  .collapsible:after {
    content: attr(data-after); /*content: "\2212";*/
    /*color: white;
    font-weight: bold;*/
    float: right;
    margin-left: 5px;
  }
  
  .active .collapsible:after {
    content: '\002B';
  }
  
  .content {
    padding: 0 18px;
    max-height: unset;
    overflow: hidden;
    transition: max-height 0.2s ease-in-out;
    /*background-color: #f1f1f1;*/
  }


.md-sidebar-toc >ul>li>ul {
    margin-left: -1.0em;
}
.md-sidebar-toc >ul>li>ul>li ul {
    margin-left: -0.5em;
}

.md-sidebar-toc {
    counter-reset: h1counter h2counter h3counter h4counter h5counter h6counter;
  }

.md-sidebar-toc>ul>li {
    counter-reset: h2counter;
}


 .md-sidebar-toc>ul>li>ul>li {
    counter-reset: h3counter;
  }

 .md-sidebar-toc>ul>li>ul>li>ul>li {
    counter-reset: h4counter;
  }

 .md-sidebar-toc>ul>li>ul>li>ul>li>ul>li {
    counter-reset: h5counter;
  }

 .md-sidebar-toc>ul>li>ul>li>ul>li>ul>li>ul>li {
    counter-reset: h6counter;
  }

.md-sidebar-toc>ul>li>ul>li>a:before {
    content: counter(h2counter, upper-roman) ".\0000a0";
    counter-increment: h2counter;
  }
 
.md-sidebar-toc>ul>li>ul>li>ul>li>a:before {
    content: counter(h3counter, upper-alpha) ".\0000a0";
    counter-increment: h3counter;
}

.md-sidebar-toc>ul>li>ul>li>ul>li>ul>li>a:before {
    content: counter(h4counter) ")\0000a0";
    counter-increment: h4counter;
}

.md-sidebar-toc>ul>li>ul>li>ul>li>ul>li>ul>li>a:before {
    content: counter(h5counter,lower-roman) ".\0000a0";
    counter-increment: h5counter;
}

.md-sidebar-toc>ul>li>ul>li>ul>li>ul>li>ul>li>ul>li>a:before {
    content: counter(h6counter) ".\0000a0";
    counter-increment: h6counter;
}

.md-sidebar-toc a {
      transition: all 100ms ease-in-out; /* 💡 This small transition makes setting of the active state smooth */
  }
  
.md-sidebar-toc li > a {
    color: #BBB;
    font-family:Verdana;
    font-weight: normal;
  }
  
.md-sidebar-toc li.active > a {
    color: #555;
    font-family:Verdana;
    text-shadow:0px 0px 1.5px black;
  }
  
  
.md-sidebar-toc li:hover > a {
    color: #59F;
    font-family:Verdana;
    font-weight: 200;
  }








  
  table th .katex { font-weight:bold;color: var(--table_even_fontcolor)} /*avoid 1.21 oversized katex font and make bold to match header rows*/
  table th {background: var(--table_head_color);border-style: hidden;font-weight: bold;} /* font-family: TimesNewRoman, Times New Roman, Times;}*/
  table tr:nth-child(even) {background: var(--table_even_color);color: var(--table_even_fontcolor)}
  table tr:nth-child(odd) {background: var(--table_odd_color);color: var(--table_odd_fontcolor)}
  
  table td + td { border-left:1px solid gray; }

  /*this changes tables following a special_table div*/
  /*<div class="table_next_"></div>*/
  div.style-following-table-column  + table tr td:first-child     {background: var(--table_head_color);font-weight: bold;}
  div.style-following-table-column + table tr td:first-child .katex { font-size: 1.0em; font-weight: bold;} 
  div.style-following-table-column2 + table tr td:nth-child(-n+2) {background: var(--table_head_color);font-weight: bold;}
  div.style-following-table-column2 + table tr td:nth-child(-n+2) .katex { font-size: 1.0em; font-weight: bold;} 
  
  
  div.style-following-table + table th .katex { font-size: 1.0em;font-weight:bold;color: var(--table_even_fontcolor);}
  div.style-following-table + table td .katex { font-size: 1.0em;}
  div.style-following-table + table th, tr:first-child {padding-top:0;padding-bottom:0;}
  div.style-following-table + table tr td {padding-top:0;padding-bottom:0;}
  div.style-following-table + table th {background: var(--table_head_color);
                                            font-weight: bold;
                                            font-family: TimesNewRoman, Times New Roman, Times;
                                           }
  div.style-following-table + table tr {
                                            font-family: TimesNewRoman, Times New Roman, Times;
                                           }

  div.style-following-table-diagonal  + table th:first-child 
                                            {
                                            //display: grid;
                                            width: max-content;
                                            justify-content: space-between;
                                            //grid-template-columns: repeat(2, 1fr);
                                            //grid-auto-rows: 1fr;
                                            //text-align: right;
                                            //text-align-last: left;
                                            line-height: 0.75em;
                                            //border: 1px solid rgb(87, 22, 22);
                                            background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' version='1.1' preserveAspectRatio='none' viewBox='0 0 100 100'><polygon points='0,0 100,100 100,0' fill='rgb(200, 200, 200)' stroke='none'/><line x1='0' y1='0' x2='100' y2='100' stroke='gray' vector-effect='non-scaling-stroke'/></svg>");
                                            background-size: 100% 100%;
                                            //margin-bottom: 1rem;
                                          }

    div.style-following-table-diagonal  + table tr td:first-child     {font-weight: bold;}
    div.style-following-table-diagonal + table tr td:first-child .katex { font-size: 1.0em; font-weight: bold;} 
                                          
                                          
  
  /*this changes tables following a special_table div*/
  /*<div class="table_next_"></div>*/
  div.style-following-table2 + table tr:nth-child(odd) {background: var(--table_odd_color)}
  div.style-following-table2 + table tr:first-child {background: var(--table_head_color);
                                            border-style: hidden;
                                            font-weight: bold;
                                            font-family: TimesNewRoman, Times New Roman, Times;
                                           }
                             /*avoid 1.21 oversized katex font and make bold to match header rows*/
  div.style-following-table2 + table tr:nth-child(2n+2) {background: var(--table_odd_color) ;color: var(--table_even_fontcolor)}
  div.style-following-table2 + table tr:nth-child(2n+3) {background: var(--table_even_color);color: var(--table_odd_fontcolor)}
  div.style-following-table2 + table tr:nth-child(1) {border-bottom: 1pt white;}
  div.style-following-table2 + table th, tr:first-child {padding-top:0;padding-bottom:0;}
  div.style-following-table2 + table tr td {padding-top:0;padding-bottom:0;}
  div.style-following-table2 + table tr:nth-child(1) .katex { font-size: 1.0em; font-weight: bold;} 
  div.style-following-table2 + table tr:nth-child(n+2) .katex { font-size: 1.0em; } /*avoid 1.21 oversized katex font*/
  div.style-following-table2 + table tr {
                                            font-family: TimesNewRoman, Times New Roman, Times;
                                           }
                                           
  
  /*this changes tables following a special_table2 div*/
  /*<div class="special_table2"></div>*/
  div.style-following-table3 + table tr:first-child {background: var(--table_head_color);border-style: hidden;font-weight: bold;	font-family: TimesNewRoman, Times New Roman, Times;}
  div.style-following-table3 + table tr:nth-child(2) {background: var(--table_head_color);border-style: hidden;font-weight: bold;	font-family: TimesNewRoman, Times New Roman, Times;}
  div.style-following-table3 + table tr:nth-child(2) {border-bottom: 1pt solid white;}
  div.style-following-table3 + table th, tr:first-child {padding-top:0;padding-bottom:0;}
  div.style-following-table3 + table tr td {padding-top:0;padding-bottom:0;}
  div.style-following-table3 + table tr:nth-child(2n+3) {background: var(--table_odd_color);color: var(--table_odd_fontcolor)}
  div.style-following-table3 + table tr:nth-child(2n+4) {background: var(--table_even_color);color: var(--table_even_fontcolor)}
  div.style-following-table3 + table tr:nth-child(1) .katex { font-size: 1.0em; font-weight: bold;} /*avoid 1.21 oversized katex font and make bold to match header rows*/
  div.style-following-table3 + table tr:nth-child(2) .katex { font-size: 1.0em; font-weight: bold;} 
  div.style-following-table3 + table tr {font-family: TimesNewRoman, Times New Roman, Times;}
  div.style-following-table3 + table td .katex { font-size: 1.0em;}
  
  //limit width to 800px
  //the document content div has no class iteself
  div.markdown-preview + div{
    max-width: 1800px;
  }  

// make code comments green
.token.comment, .token.blockquote {
  color: #7b7;
  font-style: bold;
  font-weight: 2;
}


//Need to match this to code styles, line-height
.code-notes {
    color: #7b7;
    font-weight: bold;
    font-family: inherit;
    text-align:left;
    line-height: 1.4;
    left: 1px;
    border-radius: 0px;
}

pre.code-notes-colorful {
    background-color: #f3ec78;
    background-image: linear-gradient(180deg, #ff0400, #4263af,#42ffaf);
    background-size: 100%;
    -webkit-background-clip: text;
    -moz-background-clip: text;
    -webkit-text-fill-color: transparent; 
    -moz-text-fill-color: transparent;
    font-weight: bold;
    font-family: inherit;
    text-align:left;
    //line-height: 1.4; //matching language- in final browser view
    //line-height: 12pt;
    //font-size: .85em !important;
    left: 1px;
    border-radius: 0px;
}


// div.code-notes-colorful {
//     background-color: #f3ec78;
//     background-image: linear-gradient(180deg, #ff0400, #4263af,#42ffaf);
//     background-size: 100%;
//     -webkit-background-clip: text;
//     -moz-background-clip: text;
//     -webkit-text-fill-color: transparent; 
//     -moz-text-fill-color: transparent;
//     font-weight: bold;
//     font-family: inherit;
//     text-align:left;
//     line-height: 19px; //matching language- in final browser view
//     //line-height: 12pt;
//     //font-size: .85em !important;
//     left: 1px;
//     // position: relative;
//     border-radius: 0px;
//     padding-top:12px
// }

div.code-notes-colorful {
    background-color: #f3ec78;
    background-image: linear-gradient(180deg, #ff0400, #4263af,#42ffaf);
    background-size: 100%;
    -webkit-background-clip: text;
    -moz-background-clip: text;
    -webkit-text-fill-color: transparent; 
    -moz-text-fill-color: transparent;
    font-weight: bold;
    font-family: inherit;
    text-align:left;
    //line-height: 19px; //matching language- in final browser view
    line-height: 1.4; //matching language- in final browser view
    //line-height: 12pt;
    //font-size: .85em !important;
    left: 1px;
    // position: relative;
    border-radius: 0px;
    padding-top:18px;
}

div.code-notes-colorful-before {
    background-color: #f3ec78;
    background-image: linear-gradient(180deg, #ff0400, #4263af,#42ffaf);
    background-size: 100%;
    -webkit-background-clip: text;
    -moz-background-clip: text;
    -webkit-text-fill-color: transparent; 
    -moz-text-fill-color: transparent;
    font-weight: bold;
    font-family: inherit;
    text-align:left;
    line-height: 1.4; //matching language- in final browser view
    //line-height: 12pt;
    //font-size: .85em !important;
    left: 1px;
    // position: relative;
    border-radius: 0px;
    padding-top:12px;
    padding-right:3px;
    text-align: right;
}



.language-code-notes-colorful {
    background-color: #f3ec78;
    background-image: linear-gradient(180deg, #ff0400, #4263af,#42ffaf);
    background-size: 100%;
    -webkit-background-clip: text;
    -moz-background-clip: text;
    -webkit-text-fill-color: transparent; 
    -moz-text-fill-color: transparent;
    font-weight: bold;
    font-family: inherit;
    text-align:left;
    line-height: 1.4; //matching language- in final browser view
    //line-height: 12pt;
    //font-size: .85em !important;
    left: 1px;
    border-radius: 0px;
}


//this fix applies a correction in the preview to match the final browser view
*[class^='language-'] {
    line-height: 1.4;
}

/*.markdown-preview {*/

//max-width: 800px;

    
    //corrections/override for preview
    //.code-notes-colorful {
    //     line-height: 1.4;
    //     padding-top: 13pt;
    //     font-family: Consolas, "Liberation Mono", Menlo, Courier, monospace;
    //}

    // .language-c {
    //     line-height: 1.4;
    //     // padding-top: 13pt;
    //     // font-family: Consolas, "Liberation Mono", Menlo, Courier, monospace;
    // }


    pre.code {
        background: repeating-linear-gradient(
        to bottom,
        red,
        red 14pt,
        black 18pt
      );
      }


    h1 {
        text-shadow: 1px 1px 1px #fff;        
        margin: 1em 0 0.5em 0;
	      font-weight: 600;
	      font-family: 'Titillium Web', sans-serif;
        font-variant:small-caps;
	      position: relative;  
	      font-size: 36px;
	      line-height: 40px;
	      padding: 15px 15px 15px 15%;
	      color: var(--h1-color);
	      box-shadow: 
	          inset 0 0 0 1px rgba(53,86,129, 0.4), 
	          inset 0 0 5px rgba(53,86,129, 0.5);
        
        border-radius: 0 10px 0 10px;
        background-image: linear-gradient(to right, rgba(250,250,250,255), rgba(240,240,240,255));
        counter-reset: h2counter;
        // text-indent: 3em hanging each-line;
        // margin-left: 3em;
        // text-indent: -2em;
        
    }
    
    h5 {
        color: var(--h5-color);
        
    }
    h6 {
        color: var(--h6-color);
    }
    
   
    h2{
        text-shadow: 1px 1px #636466;
        margin: 1em 0 0.5em 0;
	      font-weight: normal;
	      position: relative;
	      text-shadow: 0 -1px rgba(0,0,0,0.6);
	      font-size: 28px;
	      line-height: 40px;
        /*background-image: linear-gradient(to right, rgba(61, 92, 133, 0.8), rgba(53,86,129, 0.8));*/
        background-image: linear-gradient(to right,var(--h2-bg-color1), var(--h2-bg-color2));
	      border: 1px solid #fff;
	      padding: 5px 15px;
	      color: var(--h2-color);
	      border-radius: 0 10px 0 10px;
	      box-shadow: inset 0 0 5px rgba(53,86,129, 0.5);
        font-family: 'Muli', sans-serif;
        clear:both;
        counter-increment: h2counter; 
        counter-reset: h3counter;
        //max-width: 800px;

    }     
    
    h2:before {
        /*content: counter(h2counter, upper-roman) ".\00202F";*/
    }
    
    h3:before {
        content: counter(h3counter,upper-alpha) ".\00202F\00202F";
    }

    h4:before {
        content: counter(h4counter) ")\00202F";
    }

    h5:before {
        content: counter(h5counter, lower-roman) ".\00202F";
    }

    h6:before {
        content: counter(h6counter) ".\00202F";
    }


    h3 {
	margin: 1em 0 0.5em 0;
	font-weight: 600;
	font-family: 'Titillium Web', sans-serif;
	position: relative;
	text-shadow: 0 -1px 1px rgba(0,0,0,0.4);
	font-size: 22px;
	line-height: 40px;
	color: var(--h3-color);
	text-transform: uppercase;
	border-bottom: 1px solid rgba(53,86,129, 0.3);
    clear:both;
    counter-increment: h3counter;
    counter-reset: h4counter;
    }
    
    
    h4 {
	margin: 1em 0 0.5em 0;
	font-weight: 600;
	font-family: 'Titillium Web', sans-serif;
	position: relative;
	font-size: 18px;
	line-height: 20px;
	color: var(--h4-color);
	font-family: 'Muli', sans-serif;
    counter-increment: h4counter;
    counter-reset: h5counter;
    }
    
    h5 {
        counter-increment: h5counter;
        counter-reset: h6counter;
        }
    h6 {
        counter-increment: h6counter;
    }
        
    p { 
	color: #000;
	text-shadow: none;
    }
    
    .slide-instructions {
        display:none;
    }

    .author {
	font-weight: 600;
        font-size:22px;
    }

    .grid {
        display: flex;        
        flex-wrap: wrap;
        max-width:800px;
        //debug background-color: #f5f5f5;
        h3 {width:100%;}
    }

    .grid-center {
        display: flex;        
        justify-content: center;
        flex-wrap: wrap;
        max-width:800px;
        //debug background-color: #f5f5f5;
        h3 {width:100%;}
    }

    .grid-vert {
        display: flex;        
        justify-content: space between;
        flex-wrap: wrap;
        max-width:800px;
        //debug background-color: #f5f5f5;
        h3 {width:100%;}
        align-items: center; /* Center vertically */
    }
    .org-center{
text-align: center;
    }

    .left {
        text-align: left;
    }
    .left-zoom50 {
        text-align: left;
        zoom:50%;
    }
    .left2 {
        text-align: left;
        max-width: 400px;
        border: 0px solid #f00;
    }
    .zoom50 {
        border: 0px solid #f00;
    }

    .left2z50 {
        text-align: left;
        width: 400px;
        border: 0px solid #f00;
        /*transform: scale(0.50);*/
        zoom:50%;
        transform-origin: top left;
    }

    .left2_2 {
        left:-8.33%;
        text-align: left;
        width:50%;
    }

    .left3 {
        text-align: left;
        float: left;
        width:266px;
    }

    .left3_2 {
        left:-8.33%;
        text-align: left;
        float: left;
        width:66%;
    }
        
    .left4 {
        text-align: left;
        float: left;
        width:200px;
    }

    .right {
        left:50%;
        top: 75px;
        float: right;
        text-align: right;
        width:50%;
    }

    .right3 {
        left:66.7%;
        top: 75px;
        float: right;
        text-align: right;
        width:33%;
    }

    .right4 {
        left:75%;
        top: 75px;
        float: right;
        text-align: right;
        width:20%;
    }

    .zoom33 {
        transform: scale(0.3333);
        transform-origin: top left;
    }
    
    .zoom90 {
        transform: scale(0.90);
        transform-origin: top left;
    }
    .zoom95 {
        transform: scale(0.95);
        transform-origin: top left;
    }
    
    .zoom80 {
        transform: scale(0.80);
        transform-origin: top left;
    }

    .zoom70 {
        transform: scale(0.70);
        transform-origin: top left;
    }

    .zoom75 {
        transform: scale(0.75);
        transform-origin: top left;
    }

    .zoom60 {
        transform: scale(0.60);
        transform-origin: top left;
    }
        
    .zoom50 {
        transform: scale(0.50);
        transform-origin: top left;
    }
    
    figure {
        margin: auto;
        margin-bottom: +12px;
        border: 1px #cccccc solid;
        padding: 4px;
        display: table;
        min-width: 400px;
      }

     
    figure figcaption {
        background-color: var(--fig-caption-bg-color);
        color: var(--fig-caption-color);
        font-style: italic;
        padding: 2px;
        text-align: center;
        display: table-caption; 
    }

    /* Figure Tables */
    figure:not(.table) {
        counter-increment: figure;
        border-radius: 8px 8px 0px 0px;
    }
        
    figure figcaption {
        border-radius: 0px 0px 8px 8px;
        display: table-caption; caption-side: bottom ;
    }
        
    figcaption:not(.table):before {
        content: 'Figure ' counter(figure) ': ';
    }

    figure img{
        display: block;
        margin-left: auto;
        margin-right: auto;
    }  

    /* Hover Zoom Effect for an image in a figure */
    figure img:hover {
        -ms-transform: scale(1.5); /* IE 9 */
        -webkit-transform: scale(1.5); /* Safari 3-8 */
        transform: scale(1.5); 
        background:white;
        /*border: 5px solid #555;*/
        /* box-shadow: 10px 10px 5px grey;*/
        box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
        position: relative;
          z-index: 1;
    }

    /* Figure Class Table */
    figure.table {
        counter-increment: tableCounter;
        border-radius: 0px 0px 8px 8px;
    }

    figure.table figcaption {
        caption-side: top ;
        border-radius: 8px 8px 0px 0px;
    }
      
    figure.table figcaption:before {
        content: 'Table ' counter(tableCounter) ': ';
    }
      


      
    /* Caption for Non-Figure Tables
      caption {
        background-color: black;
        color: white;
        font-style: italic;
        padding: 2px;
        text-align: center;
        display: table-caption; caption-side: bottom ; 
          counter-increment: figure;
      
      }
      */

  
    ul > li > ul > li {
        color: #4263af;
    }
    ul > li > ul > li > ul > li {
        color: #272;
    }

    ul > li > ul > li > ol > li {
        color: #722;
    }

    ul > li > ol > li {
        color: #722;
    }

    // ul li::before {
    //     content: "\2022";  /* Add content: \2022 is the CSS Code/unicode for a bullet */
    //     color: red; /* Change the color */
    //     font-weight: bold; /* If you want it to be bold */
    //     display: inline-block; /* Needed to add space between the bullet and the text */
    //     width: 1em; /* Also needed for space (tweak if needed) */
    //     margin-left: -10pt; /* Also needed for space (tweak if needed) */
    //   }


    /* Container holding the image and the text */
    .borrowed {
        color: #fa6;
        //border: 2px solid red;
        //overflow: hidden;
      }
    
      .borrowed img {
        border: 2px solid rgb(146, 121, 89);
        padding: 0px;
        border-radius: 5px;
        //width: 100%;
        //opacity: 0.95;
        filter: sepia(25%);
      }
    
      /* Bottom left text */
      .bottom-left {
        position: absolute;
        bottom: 8px;
        left: 16px;
      }
      
      /* Top left text */
      .top-left {
        position: absolute;
        top: 8px;
        left: 16px;
      }
      
      /* Top right text */
      .top-right {
        position: absolute;
        top: 8px;
        right: 16px;
      }
      
    
      
       .borrowed .bottom-right {
        position: relative;
        bottom: 12px;
        right: 4px;
        text-align: right;
        font-size: 6px;
        color:rgb(146, 121, 89);
        line-height: 0;
        padding: 0;
      }
      
      
      /* Bottom right text */
      .bottom-right-book {
        position: absolute;
        bottom: 4px;
        right: 4px;
        font-size: 6px;
      }
    
      .bottom-right-book::before {
        content: "\2020Schaumont";
        color: rgb(146, 121, 89);
        font-weight: bold;
      }
    
      /* Bottom right text */
      .bottom-right-book {
          position: absolute;
          bottom: 4px;
          right: 4px;
          font-size: 6px;
        }
        
      
      /* Centered text */
      .centered {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        border: 1px solid #0f0;
      } 

      
/*}*/



@media print{

    figure {
        page-break-inside : avoid;
    }
    .markdown-preview {
    h2{
        color: black;
        background-image: none; 
        background-color:  var(--h2-bg-color-print);
        text-shadow: none;
        }   
    }

    form.no-print
    {
        display: none !important;
        height: 0;
        color:red;
    }
    .no-print, .no-print *{
        display: none !important;
        height: 0;
        color:red;
    }
    span.no-print{
        display: none !important;
        height: 0;
        color:red;
        visibility: hidden;
    }
 




}


div{
    -webkit-transition:1.8s;
    transition:0.8s;
}


//didn't work: https://codepen.io/bbodine1/pen/yyjYEL



// //works
//  /* fade all div under lecture-id on hover */
//  #lecture-id:hover > div{
//     opacity:.3;
//     background: blue;
//  }

// /* fade in on div when hover */
//   #lecture-id > div:hover{
//     opacity:1;
//     background: red;
//  }






//   /* fade ONE in on hover */
//   #lecture-id > div> div{
//     background: #0f0;
//  }

//  /* fade TWO in on hover */
//  #lecture-id:hover > div> div{
//     opacity:.3;
//     background: blue;
//  }
//  /* fade TWO in on hover */
//  #lecture-id > div> div:hover{
//     background: blue;
//     opacity:1;
//  }

 div.h2 {
    max-width: 1800px;
 }
