.cssrev::after {
    content: " 2025-07-15, 155";
}

:root {
    --base: hsl(208, 83%, 36%);

    --black: hsl(0, 0%, 0%);

    --colText: hsl(0, 0%, 0%);
    --colBorders: hsl(209, 94%, 35%);
    --colLinks: hsl(209, 94%, 35%);
    --colNavLinkHover: hsl(209, 40%, 75%);
    --colBkg: hsl(209, 40%, 85%);
    --colTable: hsl(209, 60%, 95%);
    --colTxtBkg: hsl(0, 0%, 100%);
    --white: hsl(0, 0%, 100%);

    font-family: Helvetica, sans-serif;
    font-size: 16px;
    line-height: 1.5;

    --a0: hsl(0, 0%, 0%);
    --a1: hsl(0, 0%, 100%);
    --a2: hsl(209, 94%, 35%);
    --a3: hsl(209, 40%, 75%);
    --a4: hsl(209, 40%, 85%);
    --a5: hsl(209, 60%, 95%);
    --a6: hsl(0, 0%, 100%);
    --a7: hsl(209, 94%, 35%);
    --a8: hsl(209, 94%, 35%);
    --a9: hsl(209, 94%, 35%);
    --a10: hsl(209, 94%, 35%);


}

/*
    https://www.bairesdev.com/tools/color-palette-app/editor/


  --black: #000000;
  --white: #FFFFFF;
  --colLight: #AFCDE9;
  --colMed: #69A2D3;
  --colMedDark: #2F7BBD;
  --colDark: #0059A7;

    */

/* by hand
    --kortrightblue: #1062a9;
    --colDark: #196bb3;
    --colMed: #d9e6f2;
    --colLight: hsl(209, 41%, 95%); 
    */

/* paletton.com   3e7db5, 1b68ae, 095293, 064277, 04325b */

/* box-sizing: content-box; */

/* not inherited; default is content-box for most elements; this line is a reminder 
    width: 100px = 100px width of content, not including border or padding
    border-box: 100px = content, padding and border together */

/* https://developer.mozilla.org/en-US/docs/Web/CSS/box-sizing
    Note: It is often useful to set box-sizing to border-box to lay out elements. 
    This makes dealing with the sizes of elements much easier, and generally 
    eliminates a number of pitfalls you can stumble on while laying out your content. 
    On the other hand, when using position: relative or position: absolute, use of 
    box-sizing: content-box allows the positioning values to be relative to the 
    content, and independent of changes to border and padding sizes, which is 
    sometimes desirable. */




/* background-color: --var(--colMed); */


html {
    background-color: var(--colBkg);
}

body {

    margin: auto;
    padding: 2rex;
    max-width: 800px;
    background-color: var(--white);
}

/* header {
    border: thick solid var(--colBorders);
    color: ;
    text-align: center;
    background-color: var(--colMed);
    padding-left: 2rem;
    padding-right: 2rem;
    padding-bottom: 1rem;

} */

/* header p {
    margin-bottom: 0
} */

nav {

    font-size: 1 rem;
    font-weight: bold;
    text-align: left;
    color: var(--colLinks);

    border: thick solid var(--colBorders);
    background-color: var(--colBkg);
    padding-left: 2rem;
    padding-right: 2rem;
    padding-top: .5rem;
    padding-bottom: 0;

}

.sitename {
    font-size: 1.75rem;
    font-weight: bold;
    padding-bottom: 0rex;
    margin-bottom: 1rex;
}

main {
    background-color: var(--colTxtBkg);
    text-align: left;
    border-left: thick solid var(--colBorders);
    border-right: thick solid var(--colBorders);
    padding: 2ex;
}

footer {
    border: thick solid var(--colBorders);
    background-color: white;
    padding: 0 2ex 0 2ex;
}







a {
    color: var(--colLinks);
    text-decoration: underline;
    /* font-weight: bold; */
    overflow-wrap: break-word;
}

h1 a,
h2 a,
h3 a,
h4 a,
h5 a,
h6 a,
.toc-list a,
#markdown-toc a {
    text-decoration: none;
}

header a {
    text-decoration: none;
}


nav a {
    text-decoration: none;
    margin-right: 1rex;
}


nav a:hover {
    background-color: var(--colNavLinkHover);
    text-decoration: underline solid;
    /* color:var(--colText) */

}

a:hover {
    border-bottom-width: 0.15em;
    border-bottom-style: solid;
    /* background-color: var(--colBkg); */
}

hr {
    height: 2px;
    color: var(--colBorders)
}


.box {
    border: medium solid var(--colBorders);
    background-color: var(--colBkg);
    color: var(--colLinks);
    font-size: 150%;
    text-align: center;
    font-weight: bold;
    font-style: italic;
    padding: 0 1ex;
}

.subtitle {
    font-size: 1rem;
    font-weight: bold;
    color: var(--colLinks);
    font-style: italic;
    text-align: center;
    margin: 1rem 0 0 0;
    border-bottom: medium solid var(--colBorders);
    padding-bottom: 0.5rem;
}

/* 
article {
padding: 2rex;
    border-width: 1rex;
    border-style: solid;
    border-color: var(--colDark); 


}
 */




h1,
h2,
h3,
h4,
h5,
h6 {
    color: var(--colLinks);
    font-weight: bold;
    margin: 1rem 0 0 0;
    padding: 0;
}

/* h2::after,
h3::after,
h4::after,
h5::after,
h6::after {
    content: "<a href='test'>testing</a>"
} */

/* Only One h1 Per Page! */
h1 {
    font-size: 2.5rem;
    text-align: center;
    margin: 0;
    border-bottom: solid thick var(--colBorders)
}

h2 {
    text-align: center;
    font-size: 2rem;
}

h3 {
    font-size: 1.5rem;
}

h4 {
    font-size: 1.25rem;
}

h5 {
    font-size: 1.15rem;
}

h6 {
    font-size: 1rem;
}

/* p {
    margin-top: 0.5em;
} */



caption {
    caption-side: top;
    text-align: left;
}




table {
    border: light solid var(--colBorders);
    border-collapse: collapse;
    overflow: auto
}

th,
td {
    padding: 1ex;
    border: 1px solid var(--colBorders);
    border-collapse: collapse;
    vertical-align: top;

}

th {
    background-color: var(--colTable)
}

tr:nth-child(even) {
    background-color: var(--colTable)
}

.fw::after {
    content: "FW";
}

.fw::abbrev {
    content: "AB";
}

.fw::reporting {
    content: "RP";
}


img {
    max-width: min(50rem, 100%);
    margin-top: 2ex;
    margin-bottom: 0;
    /* overflow: scroll; */
    border-top: 10px solid red;
}


img.def {
    border-top: none
}

.man {
    border: 4px solid var(--colBorders);
}

img.man {
    max-width: min(30rem, 100%);
    padding: 0.2em;
}

img.man1row {
    height: 2.3em;
    border-top: 4px solid var(--colBorders);
}

.sup {
    border: 4px dashed var(--colBorders);
}

img.sup {
    max-width: min(45rem, 100%);
}

img.sup1row {
    height: 2.4em;
    /* 2.2 too small  */
    border-top: 4px dashed var(--colBorders);
}


.teach1 {
    border: 7px double var(--colBorders);
}

img.teach1 {
    max-width: min(45rem, 100%);
    padding-top: 0.5ex;
}

img.teach1-1row {
    height: 2.2em;
    border-top: 7px double var(--colBorders);
    padding-top: 0.5ex;
}

.rev {
    border: 5px dotted var(--colBorders);
}

img.rev {
    max-width: min(35rem, 100%);
}

img.rev1row {
    height: 2.5em;
    border-top: 5px dotted var(--colBorders);
}

pre,
code,
.code1 {
    /* font-family: "Courier New", monospace; */
    /* font-weight: 500; */
    margin: auto;
    max-width: 100%;
    overflow: scroll;
    font-size: 100%;
    background-color: var(--colTable);
}

.serif {
    font-family: serif;
}

blockquote {
    margin-left: 2ex;
    border-left: 1px solid var(--colBorders);
    padding-left: 2ex
}


.aside {
    font-size: 80%;
}




/* Reminders

HTML details hides content until asked for
https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Elements/details 

*/