@font-face {
    font-family: 'openDyslexic';
    src: url('https://sh-harm-reduction.neocities.org/fonts/openDyslexic/opendyslexic-regular-webfont.woff2') format('woff2'),
         url('https://sh-harm-reduction.neocities.org/fonts/openDyslexic/opendyslexic-regular-webfont.woff') format('woff');
    font-weight:normal;
    font-style:normal;
}
@font-face {
    font-family: 'openDyslexic';
    src: url('https://sh-harm-reduction.neocities.org/fonts/openDyslexic/opendyslexic-italic-webfont.woff2') format('woff2'),
         url('https://sh-harm-reduction.neocities.org/fonts/openDyslexic/opendyslexic-italic-webfont.woff') format('woff');
    font-weight:normal;
    font-style:italic;
}
@font-face {
    font-family: 'openDyslexic';
    src: url('https://sh-harm-reduction.neocities.org/fonts/openDyslexic/opendyslexic-bold-webfont.woff2') format('woff2'),
         url('https://sh-harm-reduction.neocities.org/fonts/openDyslexic/opendyslexic-bold-webfont.woff') format('woff');
    font-weight:bold;
    font-style:normal;
}
@font-face {
    font-family: 'openDyslexic';
    src: url('https://sh-harm-reduction.neocities.org/fonts/openDyslexic/opendyslexic-bolditalic-webfont.woff2') format('woff2'),
         url('https://sh-harm-reduction.neocities.org/fonts/openDyslexic/opendyslexic-bolditalic-webfont.woff') format('woff');
    font-weight:bold;
    font-style:italic;
}

body {
  background-color: #c8c2e5;
  color: #6F587A;
  font-family: 'Verdana', Helvetica, Arial;
  font-size: medium;
}

a {
  text-decoration: underline;
  color: #634d6d;
}

a:hover {
  font-style: italic;
}

ul {
  display: block;
  list-style-type: disc;
  margin: 1em 0;
  padding-left: 2.25rem;
}

li ul {
  margin: 0;
}

img {
  width:50%;
  height:auto;
}

.centre {
  display:block;
  Margin-left:auto;
  margin-right:auto;
}

figcaption {
  font-style: italic;
  font-size: 1rem;
  text-align: center;
}

#navbar ul {
  list-style-type: none;
  margin: 0px;
  padding: 0 .5rem;
  overflow: hidden;
  background-color: #6F587A;
}

.navli {
  display: inline-block;
}

li.navli a, .dropdowna {
  display: inline-block;
  color: #f2efff;
  font-weight: bold;
  text-align: center;
  padding: .75rem 0.6rem;
  text-decoration: none;
}

li.navli a:hover, .dropdownli:hover .dropdowna {
  background-color: #634d6d;
  text-decoration: underline;
  text-decoration-style: dashed;
}

li.dropdownli {
  display: inline-block;
}

.dropdown-content {
  display: none;
  position: absolute;
  background-color: #f2efff;
  min-width: 10rem;
  box-shadow: 0 .5rem 1rem 0 rgba(0,0,0,0.2);
  z-index: 1;
}

.dropdown-content a {
  color: #634d6d;
  padding: .75rem 1rem;
  text-decoration: none;
  display: block;
  text-align: left;
}

.dropdownli:hover .dropdown-content {
  display: block;
}
/* update when navbar expanded */
@media (min-width: 460px) {
.navliright {float: right;}
}

#accessibility-buttons {
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
  gap: .33rem;
  width: calc(100% - 2rem);
  margin: .25rem 0;
  padding: 0 1rem;
  position: fixed;
  bottom: 0;
  left: 50%;
  transform: translate(-50%);
}

#accessibility-buttons button {
  margin: 0;
  background: #6F587A;
  border: solid medium #634d6d;
  border-radius: .5rem;
  color: #f2efff;
  font-size: .85rem;
}

#accessibility-buttons button:hover {
  background: #634d6d;
  font-style: italic;
}

#accessibility-buttons a {
  text-decoration: none;
  color: #f2efff;
}

#quickEsc {
  font-weight: bold;
}

main {
  margin: 0 auto;
  margin-top: .5rem;
  margin-bottom: .5rem;
  border: solid medium #6F587A;
  padding: 1.25rem;
  background-color: #f2efff;
}

header p {
  margin: 0;
}

#jump-to {
   border-color: #6F587A;
   border-left-style: solid;
   list-style-type: none;
   padding-left: 0.33rem;
   font-size: 1.15rem;
}

#jump-to h2 {
  font-size: 1.17em;
  margin-top: 1em;
  margin-bottom: 1em;
}

#jump-to ul {
  list-style-type: none;
  padding-left: 0.75rem;
}

#table-scroll {
  overflow-x: auto;
  width:auto;
}

table {
  width: 100%;
  padding: .5em;
}

table, td, th {
  border-style: solid;
  border-color: #6F587;
  border-width: .15rem;
  border-collapse: collapse;
}

.td-content {
  max-height: 15rem;
  overflow-y: auto;
  padding: .5em;
}

td ul {
  margin: 0;
  padding-left: 1.25rem;
}

footer {
  margin: 0 auto;
  border: solid medium #6F587A;
  padding: 1rem;
  background-color: #f2efff;
}

footer p {
  margin: .75em;
  margin-left: 0;
  margin-right: 0;
  font-size: .75em;
}

#alternatives details {
  border-color: #634d6d;
  border-style: solid;
  border-radius: 1rem;
  background-color: #6f587a;
  color: #f2efff;
  padding: .5rem;
  margin: .5rem 0 .5rem 0;
}

#alternatives summary {
  font-size: larger;
  font-weight: bold;
}

#alternatives details a {
  color: #f2efff;
}

#alternatives details h3 {
  font-size: larger;
  font-weight: bold;
}