html,
body {
  position: relative;
  width: 100%;
  min-height: 100%;
  --font-color: #333;
  --font-shadow: #eee;
}

body {
  color: var(--font-color);
  text-shadow: 0.075rem 0.075rem 0.075rem var(--font-shadow),
    -0.075rem 0.075rem 0.075rem var(--font-shadow),
    0.075rem -0.075rem 0.075rem var(--font-shadow),
    -0.075rem -0.075rem 0.075rem var(--font-shadow);
  margin: 0;
  padding: 1em;
  box-sizing: border-box;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
    Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
  background: linear-gradient(
    36deg,
    rgba(180, 58, 58, 0.5) 0%,
    rgba(158, 132, 82, 0.5) 17%,
    rgba(184, 182, 110, 0.5) 33%,
    rgba(120, 205, 112, 0.5) 50%,
    rgba(83, 235, 236, 0.5) 67%,
    rgba(125, 125, 220, 0.5) 84%,
    rgba(174, 145, 176, 0.5) 100%
  );
}

body.modal-open {
  overflow: hidden;
}