@-webkit-keyframes circling-shadow {
  0% {
    -webkit-filter: drop-shadow(-10px -10px 0 var(--accent-color2))
      drop-shadow(10px 10px 0 var(--accent-color));
    filter: drop-shadow(-10px -10px 0 var(--accent-color2))
      drop-shadow(10px 10px 0 var(--accent-color));
  }
  25% {
    -webkit-filter: drop-shadow(-10px 10px 0 var(--accent-color2))
      drop-shadow(10px -10px 0 var(--accent-color));
    filter: drop-shadow(-10px 10px 0 var(--accent-color2))
      drop-shadow(10px -10px 0 var(--accent-color));
  }
  50% {
    -webkit-filter: drop-shadow(10px 10px 0 var(--accent-color))
      drop-shadow(-10px -10px 0 var(--accent-color2));
    filter: drop-shadow(10px 10px 0 var(--accent-color))
      drop-shadow(-10px -10px 0 var(--accent-color2));
  }
  75% {
    -webkit-filter: drop-shadow(10px -10px 0 var(--accent-color))
      drop-shadow(-10px 10px 0 var(--accent-color2));
    filter: drop-shadow(10px -10px 0 var(--accent-color))
      drop-shadow(-10px 10px 0 var(--accent-color2));
  }
  to {
    -webkit-filter: drop-shadow(-10px -10px 0 var(--accent-color2))
      drop-shadow(10px 10px 0 var(--accent-color));
    filter: drop-shadow(-10px -10px 0 var(--accent-color2))
      drop-shadow(10px 10px 0 var(--accent-color));
  }
}
@keyframes circling-shadow {
  0% {
    -webkit-filter: drop-shadow(-10px -10px 0 var(--accent-color2))
      drop-shadow(10px 10px 0 var(--accent-color));
    filter: drop-shadow(-10px -10px 0 var(--accent-color2))
      drop-shadow(10px 10px 0 var(--accent-color));
  }
  25% {
    -webkit-filter: drop-shadow(-10px 10px 0 var(--accent-color2))
      drop-shadow(10px -10px 0 var(--accent-color));
    filter: drop-shadow(-10px 10px 0 var(--accent-color2))
      drop-shadow(10px -10px 0 var(--accent-color));
  }
  50% {
    -webkit-filter: drop-shadow(10px 10px 0 var(--accent-color))
      drop-shadow(-10px -10px 0 var(--accent-color2));
    filter: drop-shadow(10px 10px 0 var(--accent-color))
      drop-shadow(-10px -10px 0 var(--accent-color2));
  }
  75% {
    -webkit-filter: drop-shadow(10px -10px 0 var(--accent-color))
      drop-shadow(-10px 10px 0 var(--accent-color2));
    filter: drop-shadow(10px -10px 0 var(--accent-color))
      drop-shadow(-10px 10px 0 var(--accent-color2));
  }
  to {
    -webkit-filter: drop-shadow(-10px -10px 0 var(--accent-color2))
      drop-shadow(10px 10px 0 var(--accent-color));
    filter: drop-shadow(-10px -10px 0 var(--accent-color2))
      drop-shadow(10px 10px 0 var(--accent-color));
  }
}
@-webkit-keyframes circling-shadow-small {
  0% {
    -webkit-filter: drop-shadow(-5px -5px 0 var(--accent-color2))
      drop-shadow(5px 5px 0 var(--accent-color));
    filter: drop-shadow(-5px -5px 0 var(--accent-color2))
      drop-shadow(5px 5px 0 var(--accent-color));
  }
  25% {
    -webkit-filter: drop-shadow(-5px 5px 0 var(--accent-color2))
      drop-shadow(5px -5px 0 var(--accent-color));
    filter: drop-shadow(-5px 5px 0 var(--accent-color2))
      drop-shadow(5px -5px 0 var(--accent-color));
  }
  50% {
    -webkit-filter: drop-shadow(5px 5px 0 var(--accent-color))
      drop-shadow(-5px -5px 0 var(--accent-color2));
    filter: drop-shadow(5px 5px 0 var(--accent-color))
      drop-shadow(-5px -5px 0 var(--accent-color2));
  }
  75% {
    -webkit-filter: drop-shadow(5px -5px 0 var(--accent-color))
      drop-shadow(-5px 5px 0 var(--accent-color2));
    filter: drop-shadow(5px -5px 0 var(--accent-color))
      drop-shadow(-5px 5px 0 var(--accent-color2));
  }
  to {
    -webkit-filter: drop-shadow(-5px -5px 0 var(--accent-color2))
      drop-shadow(5px 5px 0 var(--accent-color));
    filter: drop-shadow(-5px -5px 0 var(--accent-color2))
      drop-shadow(5px 5px 0 var(--accent-color));
  }
}
@keyframes circling-shadow-small {
  0% {
    -webkit-filter: drop-shadow(-5px -5px 0 var(--accent-color2))
      drop-shadow(5px 5px 0 var(--accent-color));
    filter: drop-shadow(-5px -5px 0 var(--accent-color2))
      drop-shadow(5px 5px 0 var(--accent-color));
  }
  25% {
    -webkit-filter: drop-shadow(-5px 5px 0 var(--accent-color2))
      drop-shadow(5px -5px 0 var(--accent-color));
    filter: drop-shadow(-5px 5px 0 var(--accent-color2))
      drop-shadow(5px -5px 0 var(--accent-color));
  }
  50% {
    -webkit-filter: drop-shadow(5px 5px 0 var(--accent-color))
      drop-shadow(-5px -5px 0 var(--accent-color2));
    filter: drop-shadow(5px 5px 0 var(--accent-color))
      drop-shadow(-5px -5px 0 var(--accent-color2));
  }
  75% {
    -webkit-filter: drop-shadow(5px -5px 0 var(--accent-color))
      drop-shadow(-5px 5px 0 var(--accent-color2));
    filter: drop-shadow(5px -5px 0 var(--accent-color))
      drop-shadow(-5px 5px 0 var(--accent-color2));
  }
  to {
    -webkit-filter: drop-shadow(-5px -5px 0 var(--accent-color2))
      drop-shadow(5px 5px 0 var(--accent-color));
    filter: drop-shadow(-5px -5px 0 var(--accent-color2))
      drop-shadow(5px 5px 0 var(--accent-color));
  }
}
@-webkit-keyframes text-flicker {
  0% {
    text-shadow: 1px 0 0 var(--accent-color), -2px 0 0 var(--accent-color2);
  }
  to {
    text-shadow: 2px 0.5px 2px var(--accent-color),
      -1px -0.5px 2px var(--accent-color2);
  }
}
@keyframes text-flicker {
  0% {
    text-shadow: 1px 0 0 var(--accent-color), -2px 0 0 var(--accent-color2);
  }
  to {
    text-shadow: 2px 0.5px 2px var(--accent-color),
      -1px -0.5px 2px var(--accent-color2);
  }
}
@-webkit-keyframes box-flicker {
  0% {
    -webkit-filter: drop-shadow(1px 0 0 var(--accent-color))
      drop-shadow(-2px 0 0 var(--accent-color2));
    filter: drop-shadow(1px 0 0 var(--accent-color))
      drop-shadow(-2px 0 0 var(--accent-color2));
  }
  to {
    -webkit-filter: drop-shadow(2px 0.5px 2px var(--accent-color))
      drop-shadow(-1px -0.5px 2px var(--accent-color2));
    filter: drop-shadow(2px 0.5px 2px var(--accent-color))
      drop-shadow(-1px -0.5px 2px var(--accent-color2));
  }
}
@keyframes box-flicker {
  0% {
    -webkit-filter: drop-shadow(1px 0 0 var(--accent-color))
      drop-shadow(-2px 0 0 var(--accent-color2));
    filter: drop-shadow(1px 0 0 var(--accent-color))
      drop-shadow(-2px 0 0 var(--accent-color2));
  }
  to {
    -webkit-filter: drop-shadow(2px 0.5px 2px var(--accent-color))
      drop-shadow(-1px -0.5px 2px var(--accent-color2));
    filter: drop-shadow(2px 0.5px 2px var(--accent-color))
      drop-shadow(-1px -0.5px 2px var(--accent-color2));
  }
}
@-webkit-keyframes accordion-hover {
  0% {
    clip: rect(9px, 9999px, 99px, 0);
  }
  to {
    clip: rect(9px, 9999px, 99px, 0);
  }
}
@keyframes accordion-hover {
  0% {
    clip: rect(9px, 9999px, 99px, 0);
  }
  to {
    clip: rect(9px, 9999px, 99px, 0);
  }
}
body {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
@font-face {
  font-family: Fira Code;
  font-style: normal;
  font-weight: 300;
  src: local("Fira Code"), url(../media/FiraCode-Light.e37fbea8ec98ce1ed3c5.woff) format("woff");
}
@font-face {
  font-family: Fira Code;
  font-style: normal;
  font-weight: 500;
  src: local("Fira Code"), url(../media/FiraCode-Regular.19a2738eed5f65644ea5.woff) format("woff");
}
body * {
  font-family: Fira Code;
  font-weight: 300;
}
.css-ild12z {
  display: none !important;
}

#root,
body,
html {
  height: 100%;
  width: 100%;
  background-color: #1b1b1b;
}
body {
  background-color: var(--bg-color);
  color: var(--default-color);
  overflow: hidden;
}
body,
p {
  margin: 0;
}
a,
a:active,
a:visited {
  color: var(--default-color);
  text-decoration: none;
}

/* don't mind the jankiness */
h1, h2 {
  margin-top: -0.75%;
  margin-bottom: -0.75%;
}
h3 {
  margin-top: .7%;
}
#hi {
  text-align: center;
  margin-top: 30px;
  position: relative;
}
#startmessage {
  text-align: center;
  margin-top: 10px;
  margin-bottom: 5px;
  /* display: inline; */
  color: #e6e6e6;
}
#astronomymessage {
  position: absolute;
  top: 0;
  margin-top: 12px;
  margin-left: 20px;
}
#bottommessage {
  text-align: center;
  margin-bottom: 7.5%; /* 140px; */
  bottom: 0;
  left: 50%;
  transform: translate(-50%, 0);
  position: fixed;
}

/* so the search bar will actually show up on screen */
.css-1y2d90k {
  margin-bottom: 195px;
}
.css-tycpmi, .css-9tkfhg {
  transform: translate(0, -155px);
}


::-webkit-scrollbar {
  width: 10px;
}
::-webkit-scrollbar-thumb,
::-webkit-scrollbar-thumb:hover {
  background: var(--default-color);
}
::-webkit-scrollbar-track-piece {
  background: transparent;
}
:root {
  --bg-color: #1b1b1b;
  --default-color: #e6e6e6;
  --accent-color: #ffb4e6;
  --accent-color2: #b4ffe6;
  --border-radius: 5px;
  --settings-window-gap: 50px;
  --text-shadow-downwards: 1px 0px 0 var(--accent-color),
    -1px 0px 0 var(--accent-color), 0px -1px 0 var(--accent-color),
    0px 1px 0 var(--accent-color), 0px 2px 0 var(--accent-color),
    0px 3px 0 var(--accent-color), 0px 4px 0 var(--accent-color);
}