.highlight-links input:focus {
    background-color: yellow; }
  
  input {
    margin-bottom: 0.25em;
    font-size: 1em; }
  
  .protanopia {
    filter: url("Filters.svg#protanopia"); }
  
  .deuteranopia {
    filter: url("Filters.svg#deuteranopia"); }
  
  .tritanopia {
    filter: url("Filters.svg#tritanopia"); }
  
  .achromatopsia {
    filter: url("Filters.svg#achromatopsia"); }
  
  .blur1 {
    filter: url("Filters.svg#blur1"); }
  
  .blur2 {
    filter: url("Filters.svg#blur2"); }
  
  .blur3 {
    filter: url("Filters.svg#blur3"); }
  
  .blur4 {
    filter: url("Filters.svg#blur4"); }
  
  .blur5 {
    filter: url("Filters.svg#blur5"); }
  
  .blur6 {
    filter: url("Filters.svg#blur6"); }
  
  .blur7 {
    filter: url("Filters.svg#blur7"); }
  
  .dyslexia:hover {
    transition: background-color 0.5s;
    background-color: rgba(200, 200, 255, 0.2); }
  
  .nav .button {
    display: inline-block;
    background-color: #5f399e;
    transition: background-color 0.25s;
    text-decoration: none;
    padding: 0.5em 0.75em;
    font-size: 1.75rem;
    margin-right: 0.2em;
    color: white; }
    .nav .button.green {
      background-color: green; }
    .nav .button.blue {
      background-color: blue; }
    .nav .button.red {
      background-color: red; }
  
  .nav .button:hover, .nav .button:focus {
    background-color: black; }
  
  .hide-overflow {
    overflow: hidden; }
  
  .twitch {
    display: inline-block;
    position: relative;
    transition: top 0.1s, left 0.1s; }
  
  .slight {
    opacity: 0.7; }
    .slight:hover {
      background-color: pink;
      opacity: 1; }
  