@font-face {
  font-family: 'special_eliteregular';
  src: url('..fonts/specialelite_regular_macroman/SpecialElite-webfont.eot'); /* IE9 Compat Modes */
  src: url('../fonts/specialelite_regular_macroman/SpecialElite-webfont.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/specialelite_regular_macroman/SpecialElite-webfont.woff') format('woff'), /* Pretty Modern Browsers */
       url('../fonts/specialelite_regular_macroman/SpecialElite-webfont.ttf')  format('truetype'), /* Safari, Android, iOS */
       url('../fonts/specialelite_regular_macroman/SpecialElite-webfont.svg#special_eliteregular') format('svg'); /* Legacy iOS */
  font-weight: normal;
  font-style: normal;
}

@font-face {
    font-family: 'jrhandregular';
    src: url('../fonts/jr!hand_regular_macroman/jr!ha___-webfont.eot');
    src: url('../fonts/jr!hand_regular_macroman/jr!ha___-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/jr!hand_regular_macroman/jr!ha___-webfont.woff2') format('woff2'),
         url('../fonts/jr!hand_regular_macroman/jr!ha___-webfont.woff') format('woff'),
         url('../fonts/jr!hand_regular_macroman/jr!ha___-webfont.ttf') format('truetype'),
         url('../fonts/jr!hand_regular_macroman/jr!ha___-webfont.svg#jrhandregular') format('svg');
    font-weight: normal;
    font-style: normal;
}

/* Taken from: https://www.w3schools.com/howto/tryit.asp?filename=tryhow_css_three_columns_responsive */

.col30 {
    float: left;
    width: 30%;
}

.col20 {
    float: left;
    width: 20%;
}

.col25 {
    float: left;
    width: 25%;
}

.col40 {
    float: left;
    width: 40%;
    background-color: #fefefe;
}

.col1of3 {
    float: left;
    width: 33.33%
}

.row:after {
    content: "";
    display: table;
    clear: both;
}

@media (max-width: 600px) {
    .col20 {
        width: 100%;
    }
    .col30 {
        background-color: #fefefe;
        width: 100%;
    }
    .col40 {
        background-color: #fefefe;
        width: 100%;
    }
}

/* Thanks to jsFiddle on Stackoverflow */

.twocolumns {
    margin: 0 auto;
    padding: 1.5em;
    width: 90%;
    -moz-column-count: 2;
    -moz-column-gap: 10px;
    -webkit-coloumn-count: 2;
    -webkit-coloumn-gap: 10px;
    column-count: 2;
    column-gap: 10px;
}

div.photo-drk {
    float: left;
    background-color: #2d2e30;
    padding: 1em;
    max-width: 33.33%;
}

div.photo-drk-left {
    float: left;
    background-color: #2d2e30;
    padding: 1em;
    max-width: 33.33%;
    margin: 1.75em;
}

div.photo-drk-left-50 {
    float: left;
    background-color: #2d2e30;
    padding: 1em;
    max-width: 50%;
    margin: 1.75em;
}

div.photo-drk-right {
    float: right;
    background-color: #2d2e30;
    padding: 1em;
    max-width: 33.33%;
    margin: 1.75em;
}

div.photo-green-50 {
    float: left;
    background-color: #003300;
    padding: 1em;
    max-width: 50%;
}

html {
    background-color: black;
}

body {
    margin-top: 1.5em;
    margin-bottom: 2em;
    font-size: 120%;
    color: black;
    background-color: #fefefe;
    margin-left: 5%;
    margin-right: 5%;
}

#index {
    background: white;
}

h1.marker {
    padding: 0.3em;
    font-family: 'jrhandregular';
    font-size: 3em;
    color: black;
    text-decoration: none;
    text-transform: none;
    text-align: center;
}

h1.marker-blu {
    padding: 0.3em;
    font-family: 'jrhandregular';
    font-size: 2.3em;
    color: #000080;
    text-decoration: none;
    text-transform: none;
    text-align: center;
}

h1.marker-white {
    padding: 0.3em;
    font-family: 'jrhandregular';
    font-size: 2.3em;
    color: #eeeeee;
    text-decoration: none;
    text-transform: none;
    text-align: center;
}

h2.marker {
    padding: 0.2em;
    font-family: 'jrhandregular';
    font-size: 2em;
    color: black;
    text-decoration: none;
    text-transform: none;
    text-align: center;
}

h2.marker-blu {
    font-family: 'jrhandregular';
    padding: 0.2em;
    font-size: 2em;
    color: #000080;
    text-decoration: none;
    text-transform: none;
    text-align: center;
}

h2.marker-white {
    padding: 0.2em;
    font-family: 'jrhandregular';
    font-size: 2em;
    color: #eeeeee;
    text-decoration: none;
    text-transform: none;
    text-align: center;
}


h3.marker {
    font-family: 'jrhandregular';
    padding: 0.2em;
    font-size: 1.6em;
    color: black;
    text-decoration: none;
    text-transform: none;
    text-align: center;
}

h3.marker-blu {
    font-family: 'jrhandregular';
    padding: 0.2em;
    font-size: 1.6em;
    color: #000080;
    text-decoration: none;
    text-transform: none;
    text-align: center;
}

h3.marker-white {
    font-family: 'jrhandregular';
    padding: 0.2em;
    font-size: 1.6em;
    color: #eeeeee;
    text-decoration: none;
    text-transform: none;
    border: none;
    padding: none;
    text-align: center;
}

h3 > h1 {
    padding: 0;
}

h4.marker {
    padding: 0.1em;
    font-family: 'jrhandregular';
    font-size: 1.4em;
    color: black;
    text-decoration: none;
    text-transform: none;
    text-align: center;
}

h4.marker-blu {
    padding: 0.1em;
    font-family: 'jrhandregular';
    font-size: 1.4em;
    color: #000080;
    text-decoration: none;
    text-transform: none;
    text-align: center;
}

h4.marker-white {
    padding: 0.1em;
    font-family: 'jrhandregular';
    font-size: 1.4em;
    color: #eeeeee;
    text-decoration: none;
    text-transform: none;
    border: none;
    padding: none;
    text-align: center;
}

h5.marker {
    padding: 0.1em;
    font-family: 'jrhandregular';
    font-size: 1.2em;
    color: black;
    text-decoration: none;
    text-transform: none;
    text-align: center;
}

h5.marker-blu {
    padding: 0.1em;
    font-family: 'jrhandregular';
    font-size: 1.2em;
    color: #000080;
    text-decoration: none;
    text-transform: none;
    text-align: center;
}

h5.marker-white {
    font-family: 'jrhandregular';
    font-size: 1.2em;
    color: #eeeeee;
    text-decoration: none;
    text-transform: none;
    border: none;
    padding: none;
    text-align: center;
}


h1 {
    font-family: 'special_eliteregular', Lucida Sans Typewriter,Lucida Console,monaco,Bitstream Vera Sans Mono,monospace;
    padding: 0.3em;
    text-align: center;
    font-size: 1em;
    text-transform: uppercase;
    font-weight: normal;
    color: black;
    text-decoration: underline;
    text-align: center;
}

h2 {
    font-family: 'special_eliteregular', Lucida Sans Typewriter,Lucida Console,monaco,Bitstream Vera Sans Mono,monospace;
    text-align: center;
    font-size: 1em;
    text-transform: uppercase;
    font-weight: normal;
    text-decoration: underline;
}

h3 {
    font-family: 'special_eliteregular', Lucida Sans Typewriter,Lucida Console,monaco,Bitstream Vera Sans Mono,monospace;
    text-align: center;
    font-size: 1em;
    text-transform: uppercase;
    font-weight: normal;
    text-decoration: underline;
    text-decoration-color: black;
}

h4 {
    font-family: 'special_eliteregular', Lucida Sans Typewriter,Lucida Console,monaco,Bitstream Vera Sans Mono,monospace;
    text-align: center;
    font-size: 1em;
    text-transform: uppercase;
    font-weight: normal;
}

em {
/*    color: red; */
    font-style: normal;
    font-weight: normal;
    text-decoration: underline;
}

dl.snug {
    font-family: 'special_eliteregular', Lucida Sans Typewriter,Lucida Console,monaco,Bitstream Vera Sans Mono,monospace;
    margin-left: 11%;
    margin-right: 11%;
    padding: 0;
    line-height: 150%;
}

dl {
    font-family: 'special_eliteregular', Lucida Sans Typewriter,Lucida Console,monaco,Bitstream Vera Sans Mono,monospace;
    margin-left: 11%;
    margin-right: 11%;
    padding: 1em;
    line-height: 150%;
}

dd {
    font-family: 'special_eliteregular', Lucida Sans Typewriter,Lucida Console,monaco,Bitstream Vera Sans Mono,monospace;
    line-height: 125%;
    text-indent: 1em;
    margin-bottom: 0.5em;
}

dd::first-of-type {
    font-family: 'special_eliteregular', Lucida Sans Typewriter,Lucida Console,monaco,Bitstream Vera Sans Mono,monospace;
    line-height: 150%;
    text-indent: none;
}

dd strong {
    text-transform: uppercase;
    font-weight: normal;
}

dt {
    text-transform: uppercase;
    font-family: 'special_eliteregular', Lucida Sans Typewriter,Lucida Console,monaco,Bitstream Vera Sans Mono,monospace;
    line-height: 150%;
}

dt.std {
    font-family: 'special_eliteregular', Lucida Sans Typewriter,Lucida Console,monaco,Bitstream Vera Sans Mono,monospace;
    line-height: 150%;
}

pre {
    font-family: 'special_eliteregular', Lucida Sans Typewriter,Lucida Console,monaco,Bitstream Vera Sans Mono,monospace;
    font-size: 1em;
    line-height: 100%;
    margin-top: 0;
    margin-bottom: 0;
    margin-left: 13%;
    margin-right: 13%;
    text-indent: none;
    padding: 0;
}

.gunk1 {
     color: #2E2E2E;
     text-shadow: 1px 1px 2px #343434, -1px -1px 1px #404040;
}

.gunk2 {
    color: #252525;
    text-shadow: 1px 0px 1px #303030, 0px -1px 1px #404040;
}

p {
    font-family: 'special_eliteregular', Lucida Sans Typewriter,Lucida Console,monaco,Bitstream Vera Sans Mono,monospace;
    font-size: 1em;
    line-height: 220%;
    margin-top: 0;
    margin-bottom: 0;
    margin-left: 9%;
    margin-right: 9%;
    text-indent: 2em;
    padding: 0;
}

p:first-of-type {
    text-indent: 0;
}

header p {
    font-family: 'special_eliteregular', Lucida Sans Typewriter,Lucida Console,monaco,Bitstream Vera Sans Mono,monospace;
    line-height: 100%;
    text-indent: 0;
    margin-left: 5%;
    margin-right: 5%;
}

header {
    font-family: 'special_eliteregular', Lucida Sans Typewriter,Lucida Console,monaco,Bitstream Vera Sans Mono,monospace;
    line-height: 100%;
    text-indent: 0;
    margin-left: 0;
    margin-right: 0;
}

footer {
    font-family: 'special_eliteregular', Lucida Sans Typewriter,Lucida Console,monaco,Bitstream Vera Sans Mono,monospace;
    line-height: 100%;
    text-indent: 0;
    margin-left: 0;
    margin-right: 0;
}

footer p {
    font-family: 'special_eliteregular', Lucida Sans Typewriter,Lucida Console,monaco,Bitstream Vera Sans Mono,monospace;
    line-height: 100%;
    text-indent: 0;
    margin-left: 0;
    margin-right: 0;
}

footer a {
    font-family: 'special_eliteregular', Lucida Sans Typewriter,Lucida Console,monaco,Bitstream Vera Sans Mono,monospace;
    color: #000000;
    background-color: white;
    line-height: 100%;
    text-indent: 0;
    margin-left: 0;
    margin-right: 0;
    text-decoration: underline;
    text-decoration-color: #666666;
}

p.quote {
    font-family: 'special_eliteregular', Lucida Sans Typewriter,Lucida Console,monaco,Bitstream Vera Sans Mono,monospace;
    padding: 1.5em;
    margin-left: 11%;
    margin-right: 11%;
    text-indent: 0;
    line-height: 120%;
}

p.poem {
    padding: 1.5em;
    margin-left: 40%;
    margin-right: 20%;
    text-indent: 0;
    line-height: 150%;
}

pre.poem {
    font-family: 'special_eliteregular', Lucida Sans Typewriter,Lucida Console,monaco,Bitstream Vera Sans Mono,monospace;
    padding: 1.5em;
    margin-left: 10%;
    margin-right: 20%;
    text-indent: 0;
    line-height: 150%;
}

pre.poem0 {
    font-family: 'special_eliteregular', Lucida Sans Typewriter,Lucida Console,monaco,Bitstream Vera Sans Mono,monospace;
    padding: 1.5em;
    margin-left: none;
    margin-right: none;
    text-indent: 0;
    line-height: 150%;
}

p.in1 {
    font-family: 'special_eliteregular', Lucida Sans Typewriter,Lucida Console,monaco,Bitstream Vera Sans Mono,monospace;
    font-size: 1em;
    line-height: 220%;
    margin-top: 0;
    margin-bottom: 0;
    margin-left: 12%;
    margin-right: 9%;
    text-indent: 0;
    padding: 0;
}

p.in2 {
    font-family: 'special_eliteregular', Lucida Sans Typewriter,Lucida Console,monaco,Bitstream Vera Sans Mono,monospace;
    font-size: 1em;
    line-height: 220%;
    margin-top: 0;
    margin-bottom: 0;
    margin-left: 14%;
    margin-right: 9%;
    text-indent: 0;
    padding: 0;
}

p.in3 {
    font-family: 'special_eliteregular', Lucida Sans Typewriter,Lucida Console,monaco,Bitstream Vera Sans Mono,monospace;
    font-size: 1em;
    line-height: 220%;
    margin-top: 0;
    margin-bottom: 0;
    margin-left: 16%;
    margin-right: 9%;
    text-indent: 0;
    padding: 0;
}

p.in4 {
    font-family: 'special_eliteregular', Lucida Sans Typewriter,Lucida Console,monaco,Bitstream Vera Sans Mono,monospace;
    font-size: 1em;
    line-height: 220%;
    margin-top: 0;
    margin-bottom: 0;
    margin-left: 19%;
    margin-right: 9%;
    text-indent: 0;
    padding: 0;
}

p.flush {
    font-family: 'special_eliteregular', Lucida Sans Typewriter,Lucida Console,monaco,Bitstream Vera Sans Mono,monospace;
    font-size: 1em;
    line-height: 220%;
    margin-top: 0;
    margin-bottom: 0;
    margin-left: 9%;
    margin-right: 9%;
    text-indent: 0;
    padding: 0;
}

p.split {
    text-align: center;
    font-family: 'special_eliteregular', Lucida Sans Typewriter,Lucida Console,monaco,Bitstream Vera Sans Mono,monospace;
    font-size: 1em;
    line-height: 220%;
    margin-top: 0;
    margin-bottom: 0;
    margin-left: 2em;
    margin-right: 2em;
    text-indent: 3em;
    padding: 0;
}

p strong {
    text-transform: uppercase;
    font-family: 'special_eliteregular', Lucida Sans Typewriter,Lucida Console,monaco,Bitstream Vera Sans Mono,monospace;
    font-size: 1em;
    font-weight: normal;
}

a {
    background-color: #ffff33;
    text-decoration: none;
    color: inherit;
}

a:visited {
    background-color: #ffffb3;
    text-decoration: none;
    color: inherit;
}

a.null {
    background-color: #ffffff;
    color: #353535;
    text-decoration: underline;
    text-decoration-color: #dddddd;
}


a.null:visited {
    background-color: #ffffff;
    color: #454545;
    text-decoration: underline;
    text-decoration-color: #eeeeee;
}

a.null:hover {
    background-color: #ffffff;
    color: #000000;
    text-decoration: underline;
    text-decoration-color: #bbbbbb;
}


/* I may try to rework this and the footnotes to look like biro
   or pencil - that will take another webfont
   but I will, I think, move away from using jrhand which the designer
   says was one of her early designs.

   It could even be that on some pages there will be biro, some pencil,
   and that any scripts will choose one or the other randomly and consistently
   within a single page.

   The typewriter concept is limiting when it comes to footnotes because the size
   may not be changed and though the font may be superscript (you can manually turn
   the carriage up towards the row above, it may not be smaller).

 */

sup a.null {
    background-color: #ffffff;
    color: #000000;
    text-decoration: none;
}

sup a.null:visited {
    background-color: #ffffff;
    color: #000000;
    text-decoration: none;
}

sup a.null:hover {
    background-color: #ffffff;
    color: #000000;
    text-decoration: none;
}

/*
   The following was added for the ^ links to return the reader
   to the text from footnotes.
*/

p a.null {
    background-color: #ffffff;
    color: #000000;
    text-decoration: none;
}

p a.null:visited {
    background-color: #ffffff;
    color: #000000;
    text-decoration: none;
}

p a.null:hover {
    background-color: #ffffff;
    color: #000000;
    text-decoration: none;
}

a.faded-yellow {
    background-color: #fffc98;
    text-decoration: none;
}

a.faded-yellow:visited {
    background-color: #fefdd3;
    text-decoration: none;
}

.biro {
    background-color: white;
    /*
    text-decoration: underline;
    text-decoration-color: #dddddd;
    */
/*    text-shadow: 1px 1px 0 #fff, -1px 1px 0 #fff, 2px 0 0 #fff, -2px 0 0 #fff; */
    box-shadow: inset 0 -1px 0 0 #fff, inset 0 -3px 0 0 #4576B5;
}

a.biro:visited {
    background-color: white;
    /*
    text-decoration: underline;
    text-decoration-color: #dddddd;
    */
/*    text-shadow: 1px 1px 0 #fff, -1px 1px 0 #fff, 2px 0 0 #fff, -2px 0 0 #fff; */
    box-shadow: inset 0 -1px 0 0 #fff, inset 0 -3px 0 0 #4576B5;
}

a.pink {
    background-color: white;
/*    text-shadow: 1px 1px 0 #fff, -1px 1px 0 #fff, 2px 0 0 #fff, -2px 0 0 #fff; */
    box-shadow: inset 0 -1px 0 0 #fff, inset 0 -4px 0 0 #ffccff;
}

a:visited.pink {
    background-color: white;
/*    text-shadow: 1px 1px 0 #fff, -1px 1px 0 #fff, 2px 0 0 #fff, -2px 0 0 #fff; */
    box-shadow: inset 0 -1px 0 0 #fff, inset 0 -4px 0 0 #ffddff;
}

a.blue {
    background-color: white;
/*    text-shadow: 1px 1px 0 #fff, -1px 1px 0 #fff, 2px 0 0 #fff, -2px 0 0 #fff; */
    box-shadow: inset 0 -1px 0 0 #fff, inset 0 -4px 0 0 #ddddff;
}

a:visited.blue {
    background-color: white;
/*    text-shadow: 1px 1px 0 #fff, -1px 1px 0 #fff, 2px 0 0 #fff, -2px 0 0 #fff; */
    box-shadow: inset 0 -1px 0 0 #fff, inset 0 -4px 0 0 #ddddff;
}

a.orange {
    background-color: white;
/*    text-shadow: 1px 1px 0 #fff, -1px 1px 0 #fff, 2px 0 0 #fff, -2px 0 0 #fff; */
    box-shadow: inset 0 -1px 0 0 #fff, inset 0 -4px 0 0 #ff9900;
}

a:visited.orange {
    background-color: white;
/*    text-shadow: 1px 1px 0 #fff, -1px 1px 0 #fff, 2px 0 0 #fff, -2px 0 0 #fff; */
    box-shadow: inset 0 -1px 0 0 #fff, inset 0 -4px 0 0 #ffb84d;
}

a.green {
    background-color: white;
/*    text-shadow: 1px 1px 0 #fff, -1px 1px 0 #fff, 2px 0 0 #fff, -2px 0 0 #fff; */
    box-shadow: inset 0 -1px 0 0 #fff, inset 0 -4px 0 0 #65f76a;
}

a:visited.green {
    background-color: white;
/*    text-shadow: 1px 1px 0 #fff, -1px 1px 0 #fff, 2px 0 0 #fff, -2px 0 0 #fff; */
    box-shadow: inset 0 -1px 0 0 #fff, inset 0 -4px 0 0 #86f98a;
}

.center {
    text-align: center;
    text-indent: 0;
}

.left {
    text-align: left;
}

.right {
    text-align: right;
}

.right-marg {
    text-align: right;
    padding: 1em;
    margin-right: 12em;
    margin-left: 45%;
}

.strk {
    text-decoration: line-through;
}

.footnote {
    font-size: 1em;
    text-indent: 0px;
    margin-left: 11%;
    margin-right: 11%;
    margin-top: 1em;
    line-height: 120%;
}

.footnoteblockquote {
    font-size: 1em;
    text-indent: 0.3px;
    margin-left: 12.5%;
    margin-right: 12.5%;
    margin-top: 1em;
    line-height: 100%;
}

img.drk {
    float: left;
    box-shadow: 15px 15px 0 #2d2e30,
    -15px 15px 0 #2d2e30,
    -15px -15px 0 #2d2e30,
    15px -15px 0 #2d2e30;
    padding: 0;
    margin-left: 1.5em;
    margin-right: 1.5em;
    margin-top: 0.5em;
    margin-bottom: 0.5em;
    max-width: 30%;
    max-height: none;
    object-fit: contain;
}

img.drk-right {
    float: right;
    box-shadow: 15px 15px 0 #2d2e30,
    -15px 15px 0 #2d2e30,
    -15px -15px 0 #2d2e30,
    15px -15px 0 #2d2e30;
    padding: 0;
    margin-left: 1.5em;
    margin-right: 1.5em;
    margin-top: 0.5em;
    margin-bottom: 0.5em;
    max-width: 30%;
    max-height: none;
    object-fit: contain;
}

img.grn {
    float: left;
    box-shadow: 15px 15px 0 #003300,
    -15px 15px 0 #003300,
    -15px -15px 0 #003300,
    15px -15px 0 #003300;
    padding: 0;
    margin-left: 0;
    margin-right: 1.5em;
    margin-top: 0.5em;
    margin-bottom: 0.5em;
    max-width: 30%;
    max-height: none;
    object-fit: contain;
}

img.grn-right {
    float: right;
    box-shadow: 15px 15px 0 #003300,
    -15px 15px 0 #003300,
    -15px -15px 0 #003300,
    15px -15px 0 #003300;
    padding: 0;
    margin-left: 1.5em;
    margin-right: 0;
    margin-top: 0.5em;
    margin-bottom: 0.5em;
    max-width: 30%;
    max-height: none;
    object-fit: contain;
}

img {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
    display: block;
    margin: 0 auto;
}

sup {
    font-family: 'special_eliteregular', Lucida Sans Typewriter,Lucida Console,monaco,Bitstream Vera Sans Mono,monospace;
    font-size: 1em;
    text-decoration: none;
}

hr {
    background-color: #ffffff;
    border-top: 2px dashed #000000;
    width: 80%;
    size: 8;
}