body {
  flex-wrap: wrap;
  overflow: auto;
  width: 100%;
}

ul {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0 2ch;
}

span {
  font-size: 0.75rem;
  font-weight: bold;
  color: #e3c9ff;
}

nav span, .menu {
  margin-block: 4px;
  font-family: "Wallpoet";
}

time, #my-sites span {
  display: block;
  width: 100%;
  text-align: center;
}

time {
  border-block: 2px dotted silver;
}

img + p, img + audio, audio + p {
  margin-bottom: 0;
}

video {
  display: block;
  width: 80%;
  margin: 0 auto;
}

main a {
  font-style: italic;
}

ul a {
  color: #CBA6F7;
}

button:hover {
  text-shadow: 0 0 0.25rem white;
}

main {
  order: 2;
  width: 64%;
  visibility: visible;
  text-align: justify;
}

main, aside {
  height: 1200px;
}

aside {
  order: 3;
  gap: 20px;
  overflow-y: hidden;
  width: 16%;
  padding: 0;
}

article img {
  width: 100%
}

nav {
  gap: 0;
}

.menu {
  gap: 2px;
  font-size: 1rem;
}

.vhs-gallery {
  flex: 0 0 100%;
  margin: 40px;
}

.vhs-gallery:nth-of-type(1) {
  order: 1;
}

.vhs-gallery:nth-of-type(2) {
  order: 4;
}

#my-sites {
  order: 5;
}

.picture-gallery {
  display: flex;
  flex-wrap: wrap;
}

.picture-gallery img, .picture-text-block img {
  display: block;
  flex-shrink: 0;
  width: 50%;
}

.picture-text-block {
  display: flex;
  align-items: center;
  gap: 10px;
}

#signature {
  margin-left: auto;
}

.notes-extra, .notes-caption {
  margin-top: 2lh;
}

.paw-test {
  margin: 0.5lh;
  padding: 0.5lh;
  border: 2px outset goldenrod;
  border-radius: 10px;
  color: silver;
  background: darkgreen;
}

@media (min-width: 1800px) {

  aside, main {
    max-height: 1200px !important;
  }
}