@font-face {
  font-family: "Koz";
  src: url("../fonts/cmunbi.ttf") format("truetype");
  font-weight: normal;
  font-style: normal;
}
.mission-frame {
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 50vw;
  height: 80vh;
  font-family: "Koz", serif;
  background-color: var(--text-color2);
  overflow: hidden;
}

#container {
  position: fixed;
  top: 0%;
  left: 50%;
  transform: translateX(-50%);
  width: 47vw;
  height: 69vh;
  overflow: hidden;
  padding-top: 9vh;
}

#phrase-container {
  position: relative;
  height: 75vh;
  transform: translate(-50%, -50%);
  top: 50%;
  left: 50%;
}

.glow {
  text-shadow: 0 0 10px rgba(215, 230, 248, 0.3);
  /* font-size: 3vw; */
}

.phrase {
  position: absolute;
  transform: translate(-50%, -50%);
  top: 50%;
  left: 50%;
  white-space: nowrap;
  opacity: 0;
  width: fit-content;
  transition: opacity 1.5s;
  color: var(--text-color);
  /* margin: 10px; */
}