body {
    background-color: #e28cde;
    max-width: 650px;
    margin: auto;
    padding: 25px 25px;
}

*{
    font-family: Arial, Helvetica, sans-serif;
}

a {
    color: #61135ecf;
    font-weight: bold;
    font-style: italic;
}

a:visited {
    color: #61135ecf;
    font-weight: bold;
    font-style: italic;
}

p {
    color: #3b0b37;
    font-size: 0.8rem;
}

.updateNotifier {
    font-size: 0.7rem;
}

.bottom {
    padding-top: 25px;
    image-rendering: pixelated;
    display: block;
    min-height: 15px;
    max-height: 35px;
}

.navbar {
    padding: 15px;
    background-color: #ffdafda1;
    border: 1px solid #70416d62;
}

.container {
    padding: 10px 15px;
    margin-top: 15px;
    background-color: #ffdafda1;
    border: 1px solid #70416d62;
}

.scrollThing {
    background-color: rgba(255, 255, 255, 0.42);
    border: 1px solid #70416d62;
    padding: .5rem;
    display: grid;
    column-gap: .5rem;
    grid-template-columns: 7rem;
    overflow: auto;
}

.showOff {
    grid-row: 1;
    width: 7rem;
    border: 1px solid #70416d62;
    background-color: #e28cde;
}
h3 {
    font-size: 1.1rem;
    font-weight: 900;
}

.showOff h4 {
    margin: 2px;
    text-align: center;
}

.showOff p {
    margin: 2px;
    height: 4rem;
    white-space: normal;
    overflow: auto;
    text-align: center;
    font-size: 0.9rem;
}

.showOff a {
    display: block;
    background-color: rgba(255, 255, 255, 0.881);
    padding: 5px;
    width: 80%;
    text-align: center;
    margin: 7px auto 4px
}

.fullImage {
    width: 75%;
}

::-webkit-scrollbar {
  -webkit-appearance: none;
  width: 5px;
}

::-webkit-scrollbar-thumb {
  border-radius: 4px;
  background-color: rgba(0, 0, 0, .5);
  box-shadow: 0 0 1px rgba(255, 255, 255, .5);
}

@media only screen and (max-width: 1000px) and (pointer:coarse) {
  h2 {
        font-size: 3.2rem;
  }
  h4 {
    font-size: 2.5rem;
  }
  p {
    font-size: 2.5rem;
  }
  a {
    font-size: 1.8rem;
  }
  .showOff p {
    font-size: 2.2rem;
    height: 14rem;
  }
  .showOff {
    width: 20rem;
  }
  .scrollThing {
    grid-template-columns: 20rem;
    height: 22rem;
  }
  body {
    padding: 15px 15px;
    max-width: none;
  }
  #bottomBar a {
    padding-right: 10px;
  }
  
  .navbar a {
    padding-right: 30px;
  }
  .bottom {
    height: 70px
  }
  .updateNotifier {
    font-size: 1.2rem;
  }
  h3 {
    font-size: 2.7rem;
  }
}