@import url('https://fonts.googleapis.com/css2?family=PT+Sans&family=PT+Serif&family=Roboto&family=Source+Code+Pro&display=swap');

html { }
body { font-family: 'PT Serif', serif; margin: 0; }
table { border-collapse: collapse; }
article { margin: 1rem 4% 1rem 4%; }
p { margin-top: 0.4em; margin-bottom: 0.4em; }
figure { margin-left: 2rem; }
figcaption { font-family: sans-serif; font-size: 80%; color: darkslategray; margin: 0.5rem auto auto 1rem; }
code { font-family: monospace; color: darkblue; padding: 0 0.2rem; font-size: 115%; background-color: #f0f0f0; }

/********************** HEADER **********************/

.NavTab { width: 100%; background-color: whitesmoke; }
  .NavTab tr:nth-child(1) td:nth-child(1) { background-color: SlateGrey; color: white; font-size: 175%; font-weight: bold; font-family: Calibri, sans-serif; }
    .NavTab tr:nth-child(1) td:nth-child(1) span:nth-child(1) { color: gainsboro; }
    .NavTab tr:nth-child(1) td:nth-child(1) span:nth-child(2) { color: lightyellow; }
  .NavTab tr:nth-child(1) td:nth-child(2) { background-color: SlateGrey; color: lightyellow; text-align: right; font-size: 125%; font-family: Courier New, Courier, monospace; }
  .NavTab tr:nth-child(1) td:nth-child(3) { background-color: SlateGrey; width: 70px; }
  .NavTab tr:nth-child(2) td:nth-child(1) { background-color: #f0f0f0; font-size: 80%; font-family: Calibri, sans-serif; }
  .NavTab tr:nth-child(2) td:nth-child(2) { background-color: #f0f0f0; font-size: 80%; text-align: right; white-space: nowrap; }
  .NavTab td { padding: 0 0.5em; }
  .NavTab tr:nth-child(2) { border-bottom: 1px solid SlateGrey; }

/********************** COMMON **********************/

a:link, a:visited { text-decoration: none; color: #3333CC; }
a:hover { text-decoration: underline; color: firebrick; }

a[target="_blank"] { color: darkred; }
  a[target="_blank"]:hover { background-color: mistyrose; text-decoration: none; }

.sampdiv { background: #f8f8f8; border: 1px solid silver; padding: 0px 8px; }

.alertdiv { background-color: LavenderBlush; border: 1px solid slategray; }
  .alertdiv p:nth-child(1)::before { content: url('https://orthoprog.blob.core.windows.net/reference/blog-img/exclaim-sign24.png'); margin: 0 0.5em 0 0; float: left; }

.infodiv { background-color: aliceblue; border: 1px solid slategray; }
  .infodiv p:nth-child(1)::before { content: url('https://orthoprog.blob.core.windows.net/reference/blog-img/info24.png'); margin: 0 0.5em 0 0; float: left; }

.alertdiv, .infodiv { padding: 0 1em; margin: 1em auto 1em auto; border-radius: 0.6rem; box-shadow: 4px 4px 10px slategray; }

.msdndoc { font-family: 'Segoe UI','Segoe UI Variable Text',BlinkMacSystemFont,'Helvetica Neue',Helvetica,Arial,sans-serif; font-size: 90%; }

.piccaption { font-size: 70%; font-family: Verdana, Geneva, Tahoma, sans-serif; }
.qt1 { font-size: 150%; color: darkslategray; font-weight: bold; }
.backto { font-size: 90%; font-family: Calibri,sans-serif; }
.DonateMedia { margin-left: 0.6em; background-color: LightSeaGreen; color: white; font-size: 80%; padding: 0 3px 1px 3px; border-radius: 4px; }
.UnknownMedia { margin-left: 0.6em; background-color: DarkGoldenrod; color: white; font-size: 80%; padding: 0 3px 1px 3px; border-radius: 4px; }
.PicDiscard { background-color: orangered; color: white; }
.PicHidden { background-color: black; color: white; }
.PicUnknown { background-color: olive; color: white; }
.PicDonated { background-color: lightseagreen; color: white; }
.bookquote { padding: 0.5em; margin: 1em 3em; border: 1px black dotted; background: #f8f8f8; font-style: italic; }
.deaddiv { width: 80%; background-color: LavenderBlush; margin: 1em auto 2em auto; padding: 0.5em 1em; border: 1px solid pink; border-radius: 12px; }
.fossil { width: 26em; margin: 1em auto 1em auto; background-color: crimson; color: white; padding: 1em 1.4em; border-radius: 8px; font-size: 120%; }

.hashdiv1 { width: 54em; border: 1px solid gray; margin: 1em auto auto auto; }
.hashhead { background-color: steelblue; color: white; padding: 0.2em 0.4em 0.3em 0.4em; font-size: 140%; }
.hashbody { padding: 0.6em 1em; background-color: ghostwhite; }
  .hashbody table { margin: 1em auto 0.5em auto; }
  .hashbody p { margin: 0em auto 0.6em auto; }
  .hashbody blockquote { margin: 0em auto 0.6em 1em; }
  .hashbody pre { border: 1px dotted slategray; padding: 0.5em 1em; background-color: white; }

/********************** photogen utility **********************/

.photoH1 { font-weight: bold; font-size: 140%; color: white; background: steelblue; text-align: center; padding: 0.4em; font-family: monospace; }
.photoT1 { text-align: center; background: WhiteSmoke; margin-bottom: 0.5em; margin-left: auto; margin-right: auto; font-family: Calibri,sans-serif; }
table.photoT1 td { border: 0px solid lightslategrey; padding: 0.25em; text-align: center; width: 184px; font-size: 75%; }
.photoHash { font-size: 70%; font-family: Verdana,sans-serif; color: gray; text-align: center; }

/********************** directory lists **********************/

.dirlist { }
.dirfoot { margin-left: 1em; color: darkslategrey; font-size: 85%; font-family: Verdana,sans-serif; }

/********************** FOOTER **********************/

footer { border-top: 1px SlateGray solid; padding-top: 6px; font-size: 70%; color: SlateGray; margin: 1em 0.5em 2em 0.5em; font-family: Verdana,sans-serif; text-align: center; }
A.flnk:link, A.flnk:visited { text-decoration: none; }
A.flnk:hover { color: firebrick; }