:root {
  --white-smoke: #f5f5f5;
  --paynes-gray: #40404f;
  --lavender-grey: #c4c3d0;
}

@font-face {
  font-family: "Pixeloid";
  src: url("/static/pixeloid-sans-bold.ttf");
  font-weight: 700;
}
h1 {
  letter-spacing: "1.5rem";
  font-family: "Pixeloid";
  font-weight: 700;
}
html {
  min-height: 100%;
}

body {
  background: linear-gradient(
    56deg,
    rgba(25, 16, 47, 1) 6%,
    rgba(5, 5, 21, 1) 49%,
    rgba(10, 16, 49, 1) 87%
  );
  font-family: monospace;
}

.space-intro::part(base) {
  background: var(--paynes-gray);
  color: white;
  border: 0;
}

.space-card {
  border-radius: 0;
}
.space-card::part(header) {
  background: var(--white-smoke);
  font-family: monospace;
  border-radius: 0;
}
.space-card::part(footer) {
  background: var(--white-smoke);
}

@media (max-width: 800px) {
  .to-column {
    flex-direction: column-reverse;
  }
  h1 {
    font-size: 2rem;
    text-align: center;
  }
}

.space {
  z-index: -1;
  position: fixed;
  top: 50%;
  left: 50%;
  height: 1px;
  width: 1px;
  background: linear-gradient(
    56deg,
    rgba(25, 16, 47, 1) 6%,
    rgba(5, 5, 21, 1) 49%,
    rgba(10, 16, 49, 1) 87%
  );
  box-shadow:
    49vw -5vh 2px 2px #fff,
    -19vw -18vh 1px 0px #fff,
    36vw 2vh 0px 1px #fff,
    -28vw 13vh 3px 2px #fff,
    35vw 37vh 2px 1px #fff,
    10vw -17vh 3px 0px #fff,
    -42vw -37vh 1px 3px #fff,
    -10vw -24vh 0px 3px #fff,
    -22vw -7vh 2px 1px #fff,
    30vw 8vh 2px 2px #fff,
    24vw 9vh 1px 3px #fff,
    28vw -43vh 3px 2px #fff,
    28vw 5vh 2px 0px #fff,
    38vw 19vh 0px 1px #fff,
    19vw -9vh 2px 3px #fff,
    37vw 48vh 2px 0px #fff,
    -23vw -10vh 0px 3px #fff,
    37vw -40vh 1px 2px #fff,
    -43vw -43vh 3px 2px #fff,
    -26vw -50vh 0px 0px #fff,
    -40vw -2vh 0px 3px #fff,
    1vw -34vh 2px 0px #fff,
    -45vw -19vh 3px 1px #fff,
    31vw 33vh 2px 3px #fff,
    32vw 12vh 2px 0px #fff,
    43vw 31vh 1px 2px #fff,
    29vw 33vh 3px 0px #fff,
    -11vw 26vh 0px 3px #fff,
    -40vw 24vh 1px 3px #fff,
    21vw 20vh 2px 1px #fff,
    -18vw 6vh 1px 1px #fff,
    -27vw 18vh 1px 0px #fff,
    30vw -12vh 2px 1px #fff,
    -50vw -16vh 2px 0px #fff,
    -9vw 37vh 0px 0px #fff,
    -29vw -11vh 1px 3px #fff,
    26vw -44vh 3px 3px #fff,
    -3vw 18vh 3px 1px #fff,
    -37vw -13vh 2px 2px #fff,
    26vw 49vh 0px 3px #fff,
    32vw 23vh 3px 3px #fff,
    -38vw -25vh 0px 2px #fff,
    -28vw -4vh 3px 0px #fff,
    14vw 12vh 0px 0px #fff,
    12vw -28vh 3px 1px #fff,
    -8vw 9vh 2px 1px #fff,
    -5vw -21vh 3px 1px #fff,
    6vw -16vh 3px 3px #fff,
    -45vw -3vh 3px 3px #fff,
    -46vw 28vh 1px 1px #fff,
    18vw 34vh 0px 3px #fff,
    38vw 0vh 1px 0px #fff,
    35vw 8vh 0px 3px #fff,
    -21vw 49vh 2px 2px #fff,
    -45vw 33vh 0px 3px #fff,
    -32vw -3vh 0px 3px #fff,
    10vw -49vh 3px 1px #fff,
    37vw 21vh 2px 0px #fff,
    37vw 41vh 3px 2px #fff,
    23vw -17vh 3px 0px #fff,
    -45vw -8vh 0px 1px #fff,
    17vw 32vh 0px 1px #fff,
    -6vw -27vh 0px 3px #fff,
    -40vw 49vh 0px 0px #fff,
    47vw 3vh 1px 2px #fff,
    13vw 27vh 2px 2px #fff,
    -43vw 8vh 0px 0px #fff,
    11vw -31vh 0px 0px #fff,
    -23vw 36vh 3px 2px #fff,
    36vw 28vh 2px 2px #fff,
    10vw 27vh 0px 1px #fff,
    -7vw -4vh 2px 1px #fff,
    -33vw 31vh 2px 2px #fff,
    -15vw -46vh 0px 3px #fff,
    49vw 33vh 0px 2px #fff,
    -12vw 5vh 0px 1px #fff,
    50vw -41vh 1px 3px #fff,
    -4vw -39vh 2px 0px #fff,
    -26vw -35vh 3px 1px #fff,
    -10vw 6vh 1px 0px #fff,
    22vw 0vh 2px 0px #fff,
    -12vw -42vh 1px 1px #fff,
    -31vw 42vh 3px 0px #fff,
    7vw 29vh 1px 1px #fff,
    18vw 16vh 3px 0px #fff,
    -7vw 16vh 2px 0px #fff,
    -35vw -47vh 1px 2px #fff,
    -16vw -20vh 2px 2px #fff,
    35vw -9vh 3px 2px #fff,
    2vw -31vh 3px 0px #fff,
    7vw -27vh 0px 2px #fff,
    -16vw -42vh 1px 3px #fff,
    -8vw 26vh 3px 2px #fff,
    50vw 16vh 3px 0px #fff,
    50vw 10vh 2px 3px #fff,
    24vw 21vh 2px 2px #fff,
    40vw -27vh 1px 2px #fff,
    25vw 35vh 2px 0px #fff,
    -30vw -29vh 2px 1px #fff,
    7vw 29vh 0px 2px #fff;
  animation: zoom 40s alternate infinite;
}

@keyframes zoom {
  0% {
    transform: scale(1);
  }
  100% {
    transform: scale(1.5);
  }
}
.mention {
  display: none;
}