// Staff Credit
.staff-credit {
  // attached !important for updating from .modal-dialog class style
  width: 80vw !important;
  max-width: unset !important;
  height: 80vh !important;
  max-height: unset !important;
  margin: 10vh 10vw !important;

  // see https://css-tricks.com/old-timey-terminal-styling/
  :global(.credit-curtain) {
    padding-top: 80vh;
    text-shadow: 0 0 10px #c8c8c8;
    background-color: black;
    background-image: radial-gradient(rgba(50, 100, 100, 75%), black 120%);
  }

  :global(.background) {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    background: repeating-linear-gradient(0deg, rgba(black, 0.15), rgba(black, 0.15) 2px, transparent 2px, transparent 4px);
  }

  :global(h1),
  :global(h2),
  :global(h3),
  :global(h4),
  :global(h5),
  :global(h6),
  :global(.dev-position),
  :global(.dev-name) {
    color: white;
  }

  $credit-length: -240em;

  :global(h1) {
    font-size: 3em;
  }

  :global(h2) {
    font-size: 2.2em;
  }

  :global(.dev-position) {
    font-size: 1em;
  }

  :global(.dev-name) {
    font-size: 1.8em;
  }

  :global(.staff-credit-mt-10rem) {
    margin-top: 10rem;
  }

  :global(.staff-credit-mb-6rem) {
    margin-bottom: 6rem;
  }

  :global(.staff-credit-content) {
    padding-bottom: 40vh;
  }
}