@font-face {
  font-family: Skopera;
  src: url("../assets/fonts/skopera.otf");
}

@keyframes fade-in {
  from {
    opacity: 0;
    transform: translateY(-15px) scale(0.1);
  }
  to {
    opacity: 1;
    transform: translateY(0px) scale(1);
  }
}

#text {
  animation-name: fade-in;
  animation-duration: 1s;
  color: white;
  padding-top: 10%;
  padding-left: 10%;
  padding-bottom: 3%;
}
#text-line01 {
  padding-left: 5%;
  padding-right: 20%;
}
#text-line02 {
  padding-left: 10%;
  padding-right: 20%;
}
#text-line03 {
  padding-left: 15%;
  padding-right: 20%;
}
#text-line04 {
  padding-left: 20%;
  padding-right: 20%;
}
#text-line05 {
  padding-left: 25%;
  padding-right: 20%;
}
#text-line06 {
  padding-left: 30%;
  padding-right: 20%;
}
.highlight {
  color: violet;
  font-family: "Skopera";
  font-size: 20px;
}
.highlight-special-character {
  color: violet;
  font-size: 20px;
  font-style: bold;
}
iframe {
  margin: auto;
  position: absolute;
  left: 0;
  right: 0;
  width: 60%;
  height: 360px;
}