body {
  display: flex;
  height: 100%;
  width: 100%;
  margin: 0;
  padding: 0;
  background-color: black;
  overflow: hidden;
}

a {
  text-decoration: none;
  color: white;
}

h1, p {
  margin: 0;
}

@keyframes btn_noise {
  0% {
    clip: rect(16rem, 50rem, 6rem, -25rem);
    box-shadow: 0 0 30px rgba(255, 255, 255, 0);
  }
  2.5% {
    clip: rect(10rem, 50rem, 12rem, -25rem);
    box-shadow: 0 0 30px rgba(255, 255, 255, 0.025);
  }
  5% {
    clip: rect(22rem, 50rem, 1rem, -25rem);
    box-shadow: 0 0 30px rgba(255, 255, 255, 0.05);
  }
  7.5% {
    clip: rect(4rem, 50rem, 19rem, -25rem);
    box-shadow: 0 0 30px rgba(255, 255, 255, 0.075);
  }
  10% {
    clip: rect(8rem, 50rem, 5rem, -25rem);
    box-shadow: 0 0 30px rgba(255, 255, 255, 0.1);
  }
  12.5% {
    clip: rect(22rem, 50rem, 3rem, -25rem);
    box-shadow: 0 0 30px rgba(255, 255, 255, 0.125);
  }
  15% {
    clip: rect(16rem, 50rem, 13rem, -25rem);
    box-shadow: 0 0 30px rgba(255, 255, 255, 0.15);
  }
  17.5% {
    clip: rect(19rem, 50rem, 3rem, -25rem);
    box-shadow: 0 0 30px rgba(255, 255, 255, 0.175);
  }
  20% {
    clip: rect(3rem, 50rem, 14rem, -25rem);
    box-shadow: 0 0 30px rgba(255, 255, 255, 0.2);
  }
  22.5% {
    clip: rect(17rem, 50rem, 20rem, -25rem);
    box-shadow: 0 0 30px rgba(255, 255, 255, 0.225);
  }
  25% {
    clip: rect(17rem, 50rem, 17rem, -25rem);
    box-shadow: 0 0 30px rgba(255, 255, 255, 0.25);
  }
  27.5% {
    clip: rect(6rem, 50rem, 12rem, -25rem);
    box-shadow: 0 0 30px rgba(255, 255, 255, 0.275);
  }
  30% {
    clip: rect(21rem, 50rem, 6rem, -25rem);
    box-shadow: 0 0 30px rgba(255, 255, 255, 0.3);
  }
  32.5% {
    clip: rect(9rem, 50rem, 21rem, -25rem);
    box-shadow: 0 0 30px rgba(255, 255, 255, 0.325);
  }
  35% {
    clip: rect(8rem, 50rem, 19rem, -25rem);
    box-shadow: 0 0 30px rgba(255, 255, 255, 0.35);
  }
  37.5% {
    clip: rect(9rem, 50rem, 25rem, -25rem);
    box-shadow: 0 0 30px rgba(255, 255, 255, 0.375);
  }
  40% {
    clip: rect(25rem, 50rem, 12rem, -25rem);
    box-shadow: 0 0 30px rgba(255, 255, 255, 0.4);
  }
  42.5% {
    clip: rect(22rem, 50rem, 19rem, -25rem);
    box-shadow: 0 0 30px rgba(255, 255, 255, 0.425);
  }
  45% {
    clip: rect(8rem, 50rem, 10rem, -25rem);
    box-shadow: 0 0 30px rgba(255, 255, 255, 0.45);
  }
  47.5% {
    clip: rect(4rem, 50rem, 1rem, -25rem);
    box-shadow: 0 0 30px rgba(255, 255, 255, 0.475);
  }
  50% {
    clip: rect(1rem, 50rem, 7rem, -25rem);
    box-shadow: 0 0 30px rgba(255, 255, 255, 0.5);
  }
  52.5% {
    clip: rect(2rem, 50rem, 4rem, -25rem);
    box-shadow: 0 0 30px rgba(255, 255, 255, 0.525);
  }
  55% {
    clip: rect(5rem, 50rem, 17rem, -25rem);
    box-shadow: 0 0 30px rgba(255, 255, 255, 0.55);
  }
  57.5% {
    clip: rect(11rem, 50rem, 23rem, -25rem);
    box-shadow: 0 0 30px rgba(255, 255, 255, 0.575);
  }
  60% {
    clip: rect(3rem, 50rem, 2rem, -25rem);
    box-shadow: 0 0 30px rgba(255, 255, 255, 0.6);
  }
  62.5% {
    clip: rect(15rem, 50rem, 23rem, -25rem);
    box-shadow: 0 0 30px rgba(255, 255, 255, 0.625);
  }
  65% {
    clip: rect(8rem, 50rem, 25rem, -25rem);
    box-shadow: 0 0 30px rgba(255, 255, 255, 0.65);
  }
  67.5% {
    clip: rect(1rem, 50rem, 4rem, -25rem);
    box-shadow: 0 0 30px rgba(255, 255, 255, 0.675);
  }
  70% {
    clip: rect(2rem, 50rem, 5rem, -25rem);
    box-shadow: 0 0 30px rgba(255, 255, 255, 0.7);
  }
  72.5% {
    clip: rect(8rem, 50rem, 15rem, -25rem);
    box-shadow: 0 0 30px rgba(255, 255, 255, 0.725);
  }
  75% {
    clip: rect(19rem, 50rem, 1rem, -25rem);
    box-shadow: 0 0 30px rgba(255, 255, 255, 0.75);
  }
  77.5% {
    clip: rect(12rem, 50rem, 2rem, -25rem);
    box-shadow: 0 0 30px rgba(255, 255, 255, 0.775);
  }
  80% {
    clip: rect(15rem, 50rem, 12rem, -25rem);
    box-shadow: 0 0 30px rgba(255, 255, 255, 0.8);
  }
  82.5% {
    clip: rect(15rem, 50rem, 5rem, -25rem);
    box-shadow: 0 0 30px rgba(255, 255, 255, 0.825);
  }
  85% {
    clip: rect(11rem, 50rem, 1rem, -25rem);
    box-shadow: 0 0 30px rgba(255, 255, 255, 0.85);
  }
  87.5% {
    clip: rect(1rem, 50rem, 15rem, -25rem);
    box-shadow: 0 0 30px rgba(255, 255, 255, 0.875);
  }
  90% {
    clip: rect(1rem, 50rem, 18rem, -25rem);
    box-shadow: 0 0 30px rgba(255, 255, 255, 0.9);
  }
  92.5% {
    clip: rect(21rem, 50rem, 15rem, -25rem);
    box-shadow: 0 0 30px rgba(255, 255, 255, 0.925);
  }
  95% {
    clip: rect(18rem, 50rem, 3rem, -25rem);
    box-shadow: 0 0 30px rgba(255, 255, 255, 0.95);
  }
  97.5% {
    clip: rect(22rem, 50rem, 22rem, -25rem);
    box-shadow: 0 0 30px rgba(255, 255, 255, 0.975);
  }
  100% {
    clip: rect(20rem, 50rem, 6rem, -25rem);
    box-shadow: 0 0 30px white;
  }
}
@keyframes btn_noise2 {
  0% {
    clip: rect(8rem, 50rem, 1rem, -25rem);
  }
  2.5% {
    clip: rect(11rem, 50rem, 16rem, -25rem);
  }
  5% {
    clip: rect(6rem, 50rem, 9rem, -25rem);
  }
  7.5% {
    clip: rect(23rem, 50rem, 2rem, -25rem);
  }
  10% {
    clip: rect(3rem, 50rem, 17rem, -25rem);
  }
  12.5% {
    clip: rect(20rem, 50rem, 20rem, -25rem);
  }
  15% {
    clip: rect(16rem, 50rem, 18rem, -25rem);
  }
  17.5% {
    clip: rect(5rem, 50rem, 22rem, -25rem);
  }
  20% {
    clip: rect(25rem, 50rem, 2rem, -25rem);
  }
  22.5% {
    clip: rect(10rem, 50rem, 13rem, -25rem);
  }
  25% {
    clip: rect(17rem, 50rem, 24rem, -25rem);
  }
  27.5% {
    clip: rect(3rem, 50rem, 9rem, -25rem);
  }
  30% {
    clip: rect(6rem, 50rem, 18rem, -25rem);
  }
  32.5% {
    clip: rect(6rem, 50rem, 11rem, -25rem);
  }
  35% {
    clip: rect(9rem, 50rem, 18rem, -25rem);
  }
  37.5% {
    clip: rect(17rem, 50rem, 16rem, -25rem);
  }
  40% {
    clip: rect(18rem, 50rem, 25rem, -25rem);
  }
  42.5% {
    clip: rect(6rem, 50rem, 25rem, -25rem);
  }
  45% {
    clip: rect(7rem, 50rem, 25rem, -25rem);
  }
  47.5% {
    clip: rect(14rem, 50rem, 15rem, -25rem);
  }
  50% {
    clip: rect(5rem, 50rem, 2rem, -25rem);
  }
  52.5% {
    clip: rect(20rem, 50rem, 5rem, -25rem);
  }
  55% {
    clip: rect(6rem, 50rem, 4rem, -25rem);
  }
  57.5% {
    clip: rect(4rem, 50rem, 5rem, -25rem);
  }
  60% {
    clip: rect(8rem, 50rem, 24rem, -25rem);
  }
  62.5% {
    clip: rect(15rem, 50rem, 2rem, -25rem);
  }
  65% {
    clip: rect(16rem, 50rem, 5rem, -25rem);
  }
  67.5% {
    clip: rect(5rem, 50rem, 20rem, -25rem);
  }
  70% {
    clip: rect(11rem, 50rem, 13rem, -25rem);
  }
  72.5% {
    clip: rect(12rem, 50rem, 4rem, -25rem);
  }
  75% {
    clip: rect(3rem, 50rem, 6rem, -25rem);
  }
  77.5% {
    clip: rect(16rem, 50rem, 1rem, -25rem);
  }
  80% {
    clip: rect(12rem, 50rem, 25rem, -25rem);
  }
  82.5% {
    clip: rect(12rem, 50rem, 23rem, -25rem);
  }
  85% {
    clip: rect(15rem, 50rem, 21rem, -25rem);
  }
  87.5% {
    clip: rect(9rem, 50rem, 21rem, -25rem);
  }
  90% {
    clip: rect(3rem, 50rem, 1rem, -25rem);
  }
  92.5% {
    clip: rect(20rem, 50rem, 12rem, -25rem);
  }
  95% {
    clip: rect(20rem, 50rem, 12rem, -25rem);
  }
  97.5% {
    clip: rect(5rem, 50rem, 13rem, -25rem);
  }
  100% {
    clip: rect(15rem, 50rem, 12rem, -25rem);
  }
}
@keyframes btn_ring {
  0% {
    box-shadow: inset 0 0 0 0 rgba(255, 255, 255, 0), 0 0 30px white;
  }
  100% {
    box-shadow: inset 0 0 0 20px white, 0 0 30px white;
  }
}
.btn {
  border-radius: 50%;
  transition: transform 0.5s cubic-bezier(1, 0, 0.5, -1) 0.25s, box-shadow 0.5s cubic-bezier(1, -5, 0.5, 5) 0.25s;
  transform: scale(0.5);
  animation: btn_noise 3s ease-in-out 1, btn_ring 1s ease-in-out 3s 1;
  box-shadow: inset 0 0 0 20px white, 0 0 30px white;
  left: 50%;
  top: 50%;
  margin: -12.5rem;
  width: 25rem;
  height: 25rem;
  position: absolute;
  cursor: pointer;
}
.btn::before, .btn::after {
  opacity: 0;
  content: "";
  position: absolute;
  width: 31rem;
  height: 29rem;
  margin: -2rem -3rem -2rem -3rem;
  border-radius: 50%;
  z-index: -10;
}
.btn::before {
  box-shadow: 0 -15px 30px -15px rgba(255, 255, 255, 0.8), -25px 15px 50px -25px rgba(255, 255, 255, 0.2), 0 -25px 15px -20px rgba(255, 255, 255, 0.3);
}
.btn::after {
  box-shadow: 0 -25px 20px -15px rgba(255, 255, 255, 0.2), 10px 25px 15px -30px white, -10px 30px 20px -30px rgba(255, 255, 255, 0.3);
}

.btn-info {
  border-radius: 50%;
  transform: scale(0);
  transition: all 0.3s ease-in-out;
  background-image: repeating-radial-gradient(rgba(255, 255, 255, 0.2) 0, black 2px, black 50px);
  overflow: hidden;
  opacity: 0;
  background-size: 12.5rem 12.5rem;
  position: absolute;
  width: inherit;
  height: inherit;
}

.btn-h1, .btn-button, .btn-button::after, .btn-button:active::after {
  font-family: "Oswald", sans-serif;
  font-weight: 400;
  font-style: italic;
  text-align: center;
  text-transform: uppercase;
  letter-spacing: 2px;
}

.btn-h1 {
  text-shadow: 0 0 0 white, 0 0 1px white, 0 1px 2px rgba(255, 255, 255, 0.5);
  position: absolute;
  clip: rect(0, 20rem, 20rem, 0);
  font-size: 2em;
  padding-top: 3.5rem;
  left: 23%;
  color: transparent;
}

.btn-h1 span {
  font-size: 1.1em;
}

.btn-h1_thin {
  font-size: 2em;
  font-family: "Oswald", sans-serif;
  font-weight: 300;
  font-style: italic;
}

.btn-line {
  transition: all 1s ease-in-out;
  margin: 10.5rem 3rem 2.5rem;
  border-top: 1px solid white;
  width: 0;
}

.btn-copy {
  font-size: 0.9rem;
  font-family: "Oswald", sans-serif;
  font-weight: 300;
  color: white;
  text-align: center;
}

.btn-author {
  transition: all 1s ease-in-out;
  text-shadow: 0 0 1px white;
  font-size: 1.5rem;
  font-family: 'Mrs Saint Delafield', cursive;
  opacity: 0;
  color: white;
  text-align: center;
}

.btn-copy {
  padding: 0 5rem;
  margin-bottom: 1rem;
}

.btn-button {
  transition: all 0.1s ease-in-out;
  font-style: normal;
  font-size: 0.8rem;
  color: white;
  border: 1px solid white;
  width: 5rem;
  padding: 0.5rem;
  margin: 0 auto;
  display: block;
  position: relative;
  outline: none;
  border-radius: 5px;
}

.btn-button:hover {
  width: 7rem;
  font-size:0.9em;
  font-weight:bold;
  background-color: rgba(15,13,34,0.2);
}

.btn:hover {
  box-shadow: inset 0 0 0 0 rgba(255, 255, 255, 0), 0 0 30px white;
  transform: scale(1);
  transition-delay: 1.5s;
}
.btn:hover::before {
  animation: btn_spin 0.5s cubic-bezier(0.6, 0.2, 0, 0.8) infinite alternate, btn_fade 1.5s cubic-bezier(0.4, 0.2, 0.1, 0.7);
}
.btn:hover::after {
  animation: btn_spin 1s cubic-bezier(0.4, 0.2, 0.1, 0.7) 0.25s infinite alternate, btn_fade 1.5s cubic-bezier(0.4, 0.2, 0.1, 0.7);
}
.btn:hover .btn-info {
  transform: scale(1);
  transition-delay: 1.75s;
  animation: btn-bg_size 4s cubic-bezier(0.2, 0, 1, 0.5) infinite alternate, btn-bg_positon 3s ease-in-out infinite alternate;
  opacity: 1;
}
.btn:hover .btn-h1 {
  animation: btn_noise2 4s 1 linear alternate-reverse;
  left: 23%;
}
.btn:hover .btn-author {
  transition-delay: 2.25s;
  opacity: 1;
}
.btn:hover .btn-line {
  transition-delay: 1.75s;
  width: 19rem;
  margin: 10.5rem 3rem 1rem;
}

@keyframes btn_spin {
  100% {
    transform: rotate(360deg) scale(1.5);
  }
}
@keyframes btn_fade {
  0% {
    opacity: 1;
  }
  40% {
    opacity: .2;
  }
  80% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
@keyframes btn-bg_size {
  100% {
    background-size: 2.5rem 2.5rem;
  }
}
@keyframes btn-bg_positon {
  0% {
    background-position: left top;
  }
  25% {
    background-position: right top;
  }
  50% {
    background-position: right bottom;
  }
  75% {
    background-position: left bottom;
  }
}
.btn_ghost {
  animation: btn_ghost 0.3s ease-in-out 2 alternate;
  transition: all 0.3s ease-in-out;
  transition-delay: 0.8s;
  opacity: 0;
}

.btn-h1 span {
  animation-delay: 0.05s;
}

.btn-h1 span > span {
  animation-delay: 0.1s;
}

.btn-h1 span > span > span {
  animation-delay: 0.15s;
}

.btn-h1 span > span > span > span {
  animation-delay: 0.2s;
}

.btn-h1 span > span > span > span > span {
  animation-delay: 0.25s;
}

.btn-h1 span > span > span > span > span > span {
  animation-delay: 0.3s;
}

.btn-h1 span > span > span > span > span > span > span {
  animation-delay: 0.35s;
}

.btn-h1 span > span > span > span > span > span > span > span {
  animation-delay: 0.4s;
}

@keyframes btn_ghost {
  100% {
    text-shadow: 5rem 0 20rem black;
  }
}
.btn_gone {
  transition: all 0.2s ease-in-out;
  transition-delay: 0s !important;
  transform: translateY(1rem) rotateX(90deg);
  opacity: 0 !important;
}

.btn_white {
  transition-delay: 0s !important;
  background: white !important;
}

.btn_shrink {
  transition: all 0.4s ease-in-out;
  transition-delay: 0.4s !important;
  background: white !important;
  transform: scale(0) !important;
  opacity: 0 !important;
}

.scene-spinner {
  margin: auto;
  height: 100%;
  display: none;
}

.spn-wrap {
  position: absolute;
  left: 50%;
  top: 50%;
}

.spn-spinner {
  position: relative;
}

.spn-a {
  display: block;
  position: absolute;
  opacity: 0;
}
.spn-a .spn-b {
  display: block;
  width: 0.25rem;
  height: 0.25rem;
  background: white;
  border-radius: 50%;
  box-shadow: 0 0 1rem white;
  animation: spn_spin 1s infinite ease-in-out;
}

@keyframes spn_out1 {
  30%, 100% {
    transform: rotateZ(3.6deg) translateX(5em);
    opacity: 1;
  }
}
.spn-a:nth-child(1) {
  animation: spn_out1 2s 2 alternate ease-in-out;
}
.spn-a:nth-child(1) .spn-b {
  animation-delay: 0.01s;
}

@keyframes spn_out2 {
  30%, 100% {
    transform: rotateZ(7.2deg) translateX(5em);
    opacity: 1;
  }
}
.spn-a:nth-child(2) {
  animation: spn_out2 2s 2 alternate ease-in-out;
}
.spn-a:nth-child(2) .spn-b {
  animation-delay: 0.02s;
}

@keyframes spn_out3 {
  30%, 100% {
    transform: rotateZ(10.8deg) translateX(5em);
    opacity: 1;
  }
}
.spn-a:nth-child(3) {
  animation: spn_out3 2s 2 alternate ease-in-out;
}
.spn-a:nth-child(3) .spn-b {
  animation-delay: 0.03s;
}

@keyframes spn_out4 {
  30%, 100% {
    transform: rotateZ(14.4deg) translateX(5em);
    opacity: 1;
  }
}
.spn-a:nth-child(4) {
  animation: spn_out4 2s 2 alternate ease-in-out;
}
.spn-a:nth-child(4) .spn-b {
  animation-delay: 0.04s;
}

@keyframes spn_out5 {
  30%, 100% {
    transform: rotateZ(18deg) translateX(5em);
    opacity: 1;
  }
}
.spn-a:nth-child(5) {
  animation: spn_out5 2s 2 alternate ease-in-out;
}
.spn-a:nth-child(5) .spn-b {
  animation-delay: 0.05s;
}

@keyframes spn_out6 {
  30%, 100% {
    transform: rotateZ(21.6deg) translateX(5em);
    opacity: 1;
  }
}
.spn-a:nth-child(6) {
  animation: spn_out6 2s 2 alternate ease-in-out;
}
.spn-a:nth-child(6) .spn-b {
  animation-delay: 0.06s;
}

@keyframes spn_out7 {
  30%, 100% {
    transform: rotateZ(25.2deg) translateX(5em);
    opacity: 1;
  }
}
.spn-a:nth-child(7) {
  animation: spn_out7 2s 2 alternate ease-in-out;
}
.spn-a:nth-child(7) .spn-b {
  animation-delay: 0.07s;
}

@keyframes spn_out8 {
  30%, 100% {
    transform: rotateZ(28.8deg) translateX(5em);
    opacity: 1;
  }
}
.spn-a:nth-child(8) {
  animation: spn_out8 2s 2 alternate ease-in-out;
}
.spn-a:nth-child(8) .spn-b {
  animation-delay: 0.08s;
}

@keyframes spn_out9 {
  30%, 100% {
    transform: rotateZ(32.4deg) translateX(5em);
    opacity: 1;
  }
}
.spn-a:nth-child(9) {
  animation: spn_out9 2s 2 alternate ease-in-out;
}
.spn-a:nth-child(9) .spn-b {
  animation-delay: 0.09s;
}

@keyframes spn_out10 {
  30%, 100% {
    transform: rotateZ(36deg) translateX(5em);
    opacity: 1;
  }
}
.spn-a:nth-child(10) {
  animation: spn_out10 2s 2 alternate ease-in-out;
}
.spn-a:nth-child(10) .spn-b {
  animation-delay: 0.1s;
}

@keyframes spn_out11 {
  30%, 100% {
    transform: rotateZ(39.6deg) translateX(5em);
    opacity: 1;
  }
}
.spn-a:nth-child(11) {
  animation: spn_out11 2s 2 alternate ease-in-out;
}
.spn-a:nth-child(11) .spn-b {
  animation-delay: 0.11s;
}

@keyframes spn_out12 {
  30%, 100% {
    transform: rotateZ(43.2deg) translateX(5em);
    opacity: 1;
  }
}
.spn-a:nth-child(12) {
  animation: spn_out12 2s 2 alternate ease-in-out;
}
.spn-a:nth-child(12) .spn-b {
  animation-delay: 0.12s;
}

@keyframes spn_out13 {
  30%, 100% {
    transform: rotateZ(46.8deg) translateX(5em);
    opacity: 1;
  }
}
.spn-a:nth-child(13) {
  animation: spn_out13 2s 2 alternate ease-in-out;
}
.spn-a:nth-child(13) .spn-b {
  animation-delay: 0.13s;
}

@keyframes spn_out14 {
  30%, 100% {
    transform: rotateZ(50.4deg) translateX(5em);
    opacity: 1;
  }
}
.spn-a:nth-child(14) {
  animation: spn_out14 2s 2 alternate ease-in-out;
}
.spn-a:nth-child(14) .spn-b {
  animation-delay: 0.14s;
}

@keyframes spn_out15 {
  30%, 100% {
    transform: rotateZ(54deg) translateX(5em);
    opacity: 1;
  }
}
.spn-a:nth-child(15) {
  animation: spn_out15 2s 2 alternate ease-in-out;
}
.spn-a:nth-child(15) .spn-b {
  animation-delay: 0.15s;
}

@keyframes spn_out16 {
  30%, 100% {
    transform: rotateZ(57.6deg) translateX(5em);
    opacity: 1;
  }
}
.spn-a:nth-child(16) {
  animation: spn_out16 2s 2 alternate ease-in-out;
}
.spn-a:nth-child(16) .spn-b {
  animation-delay: 0.16s;
}

@keyframes spn_out17 {
  30%, 100% {
    transform: rotateZ(61.2deg) translateX(5em);
    opacity: 1;
  }
}
.spn-a:nth-child(17) {
  animation: spn_out17 2s 2 alternate ease-in-out;
}
.spn-a:nth-child(17) .spn-b {
  animation-delay: 0.17s;
}

@keyframes spn_out18 {
  30%, 100% {
    transform: rotateZ(64.8deg) translateX(5em);
    opacity: 1;
  }
}
.spn-a:nth-child(18) {
  animation: spn_out18 2s 2 alternate ease-in-out;
}
.spn-a:nth-child(18) .spn-b {
  animation-delay: 0.18s;
}

@keyframes spn_out19 {
  30%, 100% {
    transform: rotateZ(68.4deg) translateX(5em);
    opacity: 1;
  }
}
.spn-a:nth-child(19) {
  animation: spn_out19 2s 2 alternate ease-in-out;
}
.spn-a:nth-child(19) .spn-b {
  animation-delay: 0.19s;
}

@keyframes spn_out20 {
  30%, 100% {
    transform: rotateZ(72deg) translateX(5em);
    opacity: 1;
  }
}
.spn-a:nth-child(20) {
  animation: spn_out20 2s 2 alternate ease-in-out;
}
.spn-a:nth-child(20) .spn-b {
  animation-delay: 0.2s;
}

@keyframes spn_out21 {
  30%, 100% {
    transform: rotateZ(75.6deg) translateX(5em);
    opacity: 1;
  }
}
.spn-a:nth-child(21) {
  animation: spn_out21 2s 2 alternate ease-in-out;
}
.spn-a:nth-child(21) .spn-b {
  animation-delay: 0.21s;
}

@keyframes spn_out22 {
  30%, 100% {
    transform: rotateZ(79.2deg) translateX(5em);
    opacity: 1;
  }
}
.spn-a:nth-child(22) {
  animation: spn_out22 2s 2 alternate ease-in-out;
}
.spn-a:nth-child(22) .spn-b {
  animation-delay: 0.22s;
}

@keyframes spn_out23 {
  30%, 100% {
    transform: rotateZ(82.8deg) translateX(5em);
    opacity: 1;
  }
}
.spn-a:nth-child(23) {
  animation: spn_out23 2s 2 alternate ease-in-out;
}
.spn-a:nth-child(23) .spn-b {
  animation-delay: 0.23s;
}

@keyframes spn_out24 {
  30%, 100% {
    transform: rotateZ(86.4deg) translateX(5em);
    opacity: 1;
  }
}
.spn-a:nth-child(24) {
  animation: spn_out24 2s 2 alternate ease-in-out;
}
.spn-a:nth-child(24) .spn-b {
  animation-delay: 0.24s;
}

@keyframes spn_out25 {
  30%, 100% {
    transform: rotateZ(90deg) translateX(5em);
    opacity: 1;
  }
}
.spn-a:nth-child(25) {
  animation: spn_out25 2s 2 alternate ease-in-out;
}
.spn-a:nth-child(25) .spn-b {
  animation-delay: 0.25s;
}

@keyframes spn_out26 {
  30%, 100% {
    transform: rotateZ(93.6deg) translateX(5em);
    opacity: 1;
  }
}
.spn-a:nth-child(26) {
  animation: spn_out26 2s 2 alternate ease-in-out;
}
.spn-a:nth-child(26) .spn-b {
  animation-delay: 0.26s;
}

@keyframes spn_out27 {
  30%, 100% {
    transform: rotateZ(97.2deg) translateX(5em);
    opacity: 1;
  }
}
.spn-a:nth-child(27) {
  animation: spn_out27 2s 2 alternate ease-in-out;
}
.spn-a:nth-child(27) .spn-b {
  animation-delay: 0.27s;
}

@keyframes spn_out28 {
  30%, 100% {
    transform: rotateZ(100.8deg) translateX(5em);
    opacity: 1;
  }
}
.spn-a:nth-child(28) {
  animation: spn_out28 2s 2 alternate ease-in-out;
}
.spn-a:nth-child(28) .spn-b {
  animation-delay: 0.28s;
}

@keyframes spn_out29 {
  30%, 100% {
    transform: rotateZ(104.4deg) translateX(5em);
    opacity: 1;
  }
}
.spn-a:nth-child(29) {
  animation: spn_out29 2s 2 alternate ease-in-out;
}
.spn-a:nth-child(29) .spn-b {
  animation-delay: 0.29s;
}

@keyframes spn_out30 {
  30%, 100% {
    transform: rotateZ(108deg) translateX(5em);
    opacity: 1;
  }
}
.spn-a:nth-child(30) {
  animation: spn_out30 2s 2 alternate ease-in-out;
}
.spn-a:nth-child(30) .spn-b {
  animation-delay: 0.3s;
}

@keyframes spn_out31 {
  30%, 100% {
    transform: rotateZ(111.6deg) translateX(5em);
    opacity: 1;
  }
}
.spn-a:nth-child(31) {
  animation: spn_out31 2s 2 alternate ease-in-out;
}
.spn-a:nth-child(31) .spn-b {
  animation-delay: 0.31s;
}

@keyframes spn_out32 {
  30%, 100% {
    transform: rotateZ(115.2deg) translateX(5em);
    opacity: 1;
  }
}
.spn-a:nth-child(32) {
  animation: spn_out32 2s 2 alternate ease-in-out;
}
.spn-a:nth-child(32) .spn-b {
  animation-delay: 0.32s;
}

@keyframes spn_out33 {
  30%, 100% {
    transform: rotateZ(118.8deg) translateX(5em);
    opacity: 1;
  }
}
.spn-a:nth-child(33) {
  animation: spn_out33 2s 2 alternate ease-in-out;
}
.spn-a:nth-child(33) .spn-b {
  animation-delay: 0.33s;
}

@keyframes spn_out34 {
  30%, 100% {
    transform: rotateZ(122.4deg) translateX(5em);
    opacity: 1;
  }
}
.spn-a:nth-child(34) {
  animation: spn_out34 2s 2 alternate ease-in-out;
}
.spn-a:nth-child(34) .spn-b {
  animation-delay: 0.34s;
}

@keyframes spn_out35 {
  30%, 100% {
    transform: rotateZ(126deg) translateX(5em);
    opacity: 1;
  }
}
.spn-a:nth-child(35) {
  animation: spn_out35 2s 2 alternate ease-in-out;
}
.spn-a:nth-child(35) .spn-b {
  animation-delay: 0.35s;
}

@keyframes spn_out36 {
  30%, 100% {
    transform: rotateZ(129.6deg) translateX(5em);
    opacity: 1;
  }
}
.spn-a:nth-child(36) {
  animation: spn_out36 2s 2 alternate ease-in-out;
}
.spn-a:nth-child(36) .spn-b {
  animation-delay: 0.36s;
}

@keyframes spn_out37 {
  30%, 100% {
    transform: rotateZ(133.2deg) translateX(5em);
    opacity: 1;
  }
}
.spn-a:nth-child(37) {
  animation: spn_out37 2s 2 alternate ease-in-out;
}
.spn-a:nth-child(37) .spn-b {
  animation-delay: 0.37s;
}

@keyframes spn_out38 {
  30%, 100% {
    transform: rotateZ(136.8deg) translateX(5em);
    opacity: 1;
  }
}
.spn-a:nth-child(38) {
  animation: spn_out38 2s 2 alternate ease-in-out;
}
.spn-a:nth-child(38) .spn-b {
  animation-delay: 0.38s;
}

@keyframes spn_out39 {
  30%, 100% {
    transform: rotateZ(140.4deg) translateX(5em);
    opacity: 1;
  }
}
.spn-a:nth-child(39) {
  animation: spn_out39 2s 2 alternate ease-in-out;
}
.spn-a:nth-child(39) .spn-b {
  animation-delay: 0.39s;
}

@keyframes spn_out40 {
  30%, 100% {
    transform: rotateZ(144deg) translateX(5em);
    opacity: 1;
  }
}
.spn-a:nth-child(40) {
  animation: spn_out40 2s 2 alternate ease-in-out;
}
.spn-a:nth-child(40) .spn-b {
  animation-delay: 0.4s;
}

@keyframes spn_out41 {
  30%, 100% {
    transform: rotateZ(147.6deg) translateX(5em);
    opacity: 1;
  }
}
.spn-a:nth-child(41) {
  animation: spn_out41 2s 2 alternate ease-in-out;
}
.spn-a:nth-child(41) .spn-b {
  animation-delay: 0.41s;
}

@keyframes spn_out42 {
  30%, 100% {
    transform: rotateZ(151.2deg) translateX(5em);
    opacity: 1;
  }
}
.spn-a:nth-child(42) {
  animation: spn_out42 2s 2 alternate ease-in-out;
}
.spn-a:nth-child(42) .spn-b {
  animation-delay: 0.42s;
}

@keyframes spn_out43 {
  30%, 100% {
    transform: rotateZ(154.8deg) translateX(5em);
    opacity: 1;
  }
}
.spn-a:nth-child(43) {
  animation: spn_out43 2s 2 alternate ease-in-out;
}
.spn-a:nth-child(43) .spn-b {
  animation-delay: 0.43s;
}

@keyframes spn_out44 {
  30%, 100% {
    transform: rotateZ(158.4deg) translateX(5em);
    opacity: 1;
  }
}
.spn-a:nth-child(44) {
  animation: spn_out44 2s 2 alternate ease-in-out;
}
.spn-a:nth-child(44) .spn-b {
  animation-delay: 0.44s;
}

@keyframes spn_out45 {
  30%, 100% {
    transform: rotateZ(162deg) translateX(5em);
    opacity: 1;
  }
}
.spn-a:nth-child(45) {
  animation: spn_out45 2s 2 alternate ease-in-out;
}
.spn-a:nth-child(45) .spn-b {
  animation-delay: 0.45s;
}

@keyframes spn_out46 {
  30%, 100% {
    transform: rotateZ(165.6deg) translateX(5em);
    opacity: 1;
  }
}
.spn-a:nth-child(46) {
  animation: spn_out46 2s 2 alternate ease-in-out;
}
.spn-a:nth-child(46) .spn-b {
  animation-delay: 0.46s;
}

@keyframes spn_out47 {
  30%, 100% {
    transform: rotateZ(169.2deg) translateX(5em);
    opacity: 1;
  }
}
.spn-a:nth-child(47) {
  animation: spn_out47 2s 2 alternate ease-in-out;
}
.spn-a:nth-child(47) .spn-b {
  animation-delay: 0.47s;
}

@keyframes spn_out48 {
  30%, 100% {
    transform: rotateZ(172.8deg) translateX(5em);
    opacity: 1;
  }
}
.spn-a:nth-child(48) {
  animation: spn_out48 2s 2 alternate ease-in-out;
}
.spn-a:nth-child(48) .spn-b {
  animation-delay: 0.48s;
}

@keyframes spn_out49 {
  30%, 100% {
    transform: rotateZ(176.4deg) translateX(5em);
    opacity: 1;
  }
}
.spn-a:nth-child(49) {
  animation: spn_out49 2s 2 alternate ease-in-out;
}
.spn-a:nth-child(49) .spn-b {
  animation-delay: 0.49s;
}

@keyframes spn_out50 {
  30%, 100% {
    transform: rotateZ(180deg) translateX(5em);
    opacity: 1;
  }
}
.spn-a:nth-child(50) {
  animation: spn_out50 2s 2 alternate ease-in-out;
}
.spn-a:nth-child(50) .spn-b {
  animation-delay: 0.5s;
}

@keyframes spn_out51 {
  30%, 100% {
    transform: rotateZ(183.6deg) translateX(5em);
    opacity: 1;
  }
}
.spn-a:nth-child(51) {
  animation: spn_out51 2s 2 alternate ease-in-out;
}
.spn-a:nth-child(51) .spn-b {
  animation-delay: 0.51s;
}

@keyframes spn_out52 {
  30%, 100% {
    transform: rotateZ(187.2deg) translateX(5em);
    opacity: 1;
  }
}
.spn-a:nth-child(52) {
  animation: spn_out52 2s 2 alternate ease-in-out;
}
.spn-a:nth-child(52) .spn-b {
  animation-delay: 0.52s;
}

@keyframes spn_out53 {
  30%, 100% {
    transform: rotateZ(190.8deg) translateX(5em);
    opacity: 1;
  }
}
.spn-a:nth-child(53) {
  animation: spn_out53 2s 2 alternate ease-in-out;
}
.spn-a:nth-child(53) .spn-b {
  animation-delay: 0.53s;
}

@keyframes spn_out54 {
  30%, 100% {
    transform: rotateZ(194.4deg) translateX(5em);
    opacity: 1;
  }
}
.spn-a:nth-child(54) {
  animation: spn_out54 2s 2 alternate ease-in-out;
}
.spn-a:nth-child(54) .spn-b {
  animation-delay: 0.54s;
}

@keyframes spn_out55 {
  30%, 100% {
    transform: rotateZ(198deg) translateX(5em);
    opacity: 1;
  }
}
.spn-a:nth-child(55) {
  animation: spn_out55 2s 2 alternate ease-in-out;
}
.spn-a:nth-child(55) .spn-b {
  animation-delay: 0.55s;
}

@keyframes spn_out56 {
  30%, 100% {
    transform: rotateZ(201.6deg) translateX(5em);
    opacity: 1;
  }
}
.spn-a:nth-child(56) {
  animation: spn_out56 2s 2 alternate ease-in-out;
}
.spn-a:nth-child(56) .spn-b {
  animation-delay: 0.56s;
}

@keyframes spn_out57 {
  30%, 100% {
    transform: rotateZ(205.2deg) translateX(5em);
    opacity: 1;
  }
}
.spn-a:nth-child(57) {
  animation: spn_out57 2s 2 alternate ease-in-out;
}
.spn-a:nth-child(57) .spn-b {
  animation-delay: 0.57s;
}

@keyframes spn_out58 {
  30%, 100% {
    transform: rotateZ(208.8deg) translateX(5em);
    opacity: 1;
  }
}
.spn-a:nth-child(58) {
  animation: spn_out58 2s 2 alternate ease-in-out;
}
.spn-a:nth-child(58) .spn-b {
  animation-delay: 0.58s;
}

@keyframes spn_out59 {
  30%, 100% {
    transform: rotateZ(212.4deg) translateX(5em);
    opacity: 1;
  }
}
.spn-a:nth-child(59) {
  animation: spn_out59 2s 2 alternate ease-in-out;
}
.spn-a:nth-child(59) .spn-b {
  animation-delay: 0.59s;
}

@keyframes spn_out60 {
  30%, 100% {
    transform: rotateZ(216deg) translateX(5em);
    opacity: 1;
  }
}
.spn-a:nth-child(60) {
  animation: spn_out60 2s 2 alternate ease-in-out;
}
.spn-a:nth-child(60) .spn-b {
  animation-delay: 0.6s;
}

@keyframes spn_out61 {
  30%, 100% {
    transform: rotateZ(219.6deg) translateX(5em);
    opacity: 1;
  }
}
.spn-a:nth-child(61) {
  animation: spn_out61 2s 2 alternate ease-in-out;
}
.spn-a:nth-child(61) .spn-b {
  animation-delay: 0.61s;
}

@keyframes spn_out62 {
  30%, 100% {
    transform: rotateZ(223.2deg) translateX(5em);
    opacity: 1;
  }
}
.spn-a:nth-child(62) {
  animation: spn_out62 2s 2 alternate ease-in-out;
}
.spn-a:nth-child(62) .spn-b {
  animation-delay: 0.62s;
}

@keyframes spn_out63 {
  30%, 100% {
    transform: rotateZ(226.8deg) translateX(5em);
    opacity: 1;
  }
}
.spn-a:nth-child(63) {
  animation: spn_out63 2s 2 alternate ease-in-out;
}
.spn-a:nth-child(63) .spn-b {
  animation-delay: 0.63s;
}

@keyframes spn_out64 {
  30%, 100% {
    transform: rotateZ(230.4deg) translateX(5em);
    opacity: 1;
  }
}
.spn-a:nth-child(64) {
  animation: spn_out64 2s 2 alternate ease-in-out;
}
.spn-a:nth-child(64) .spn-b {
  animation-delay: 0.64s;
}

@keyframes spn_out65 {
  30%, 100% {
    transform: rotateZ(234deg) translateX(5em);
    opacity: 1;
  }
}
.spn-a:nth-child(65) {
  animation: spn_out65 2s 2 alternate ease-in-out;
}
.spn-a:nth-child(65) .spn-b {
  animation-delay: 0.65s;
}

@keyframes spn_out66 {
  30%, 100% {
    transform: rotateZ(237.6deg) translateX(5em);
    opacity: 1;
  }
}
.spn-a:nth-child(66) {
  animation: spn_out66 2s 2 alternate ease-in-out;
}
.spn-a:nth-child(66) .spn-b {
  animation-delay: 0.66s;
}

@keyframes spn_out67 {
  30%, 100% {
    transform: rotateZ(241.2deg) translateX(5em);
    opacity: 1;
  }
}
.spn-a:nth-child(67) {
  animation: spn_out67 2s 2 alternate ease-in-out;
}
.spn-a:nth-child(67) .spn-b {
  animation-delay: 0.67s;
}

@keyframes spn_out68 {
  30%, 100% {
    transform: rotateZ(244.8deg) translateX(5em);
    opacity: 1;
  }
}
.spn-a:nth-child(68) {
  animation: spn_out68 2s 2 alternate ease-in-out;
}
.spn-a:nth-child(68) .spn-b {
  animation-delay: 0.68s;
}

@keyframes spn_out69 {
  30%, 100% {
    transform: rotateZ(248.4deg) translateX(5em);
    opacity: 1;
  }
}
.spn-a:nth-child(69) {
  animation: spn_out69 2s 2 alternate ease-in-out;
}
.spn-a:nth-child(69) .spn-b {
  animation-delay: 0.69s;
}

@keyframes spn_out70 {
  30%, 100% {
    transform: rotateZ(252deg) translateX(5em);
    opacity: 1;
  }
}
.spn-a:nth-child(70) {
  animation: spn_out70 2s 2 alternate ease-in-out;
}
.spn-a:nth-child(70) .spn-b {
  animation-delay: 0.7s;
}

@keyframes spn_out71 {
  30%, 100% {
    transform: rotateZ(255.6deg) translateX(5em);
    opacity: 1;
  }
}
.spn-a:nth-child(71) {
  animation: spn_out71 2s 2 alternate ease-in-out;
}
.spn-a:nth-child(71) .spn-b {
  animation-delay: 0.71s;
}

@keyframes spn_out72 {
  30%, 100% {
    transform: rotateZ(259.2deg) translateX(5em);
    opacity: 1;
  }
}
.spn-a:nth-child(72) {
  animation: spn_out72 2s 2 alternate ease-in-out;
}
.spn-a:nth-child(72) .spn-b {
  animation-delay: 0.72s;
}

@keyframes spn_out73 {
  30%, 100% {
    transform: rotateZ(262.8deg) translateX(5em);
    opacity: 1;
  }
}
.spn-a:nth-child(73) {
  animation: spn_out73 2s 2 alternate ease-in-out;
}
.spn-a:nth-child(73) .spn-b {
  animation-delay: 0.73s;
}

@keyframes spn_out74 {
  30%, 100% {
    transform: rotateZ(266.4deg) translateX(5em);
    opacity: 1;
  }
}
.spn-a:nth-child(74) {
  animation: spn_out74 2s 2 alternate ease-in-out;
}
.spn-a:nth-child(74) .spn-b {
  animation-delay: 0.74s;
}

@keyframes spn_out75 {
  30%, 100% {
    transform: rotateZ(270deg) translateX(5em);
    opacity: 1;
  }
}
.spn-a:nth-child(75) {
  animation: spn_out75 2s 2 alternate ease-in-out;
}
.spn-a:nth-child(75) .spn-b {
  animation-delay: 0.75s;
}

@keyframes spn_out76 {
  30%, 100% {
    transform: rotateZ(273.6deg) translateX(5em);
    opacity: 1;
  }
}
.spn-a:nth-child(76) {
  animation: spn_out76 2s 2 alternate ease-in-out;
}
.spn-a:nth-child(76) .spn-b {
  animation-delay: 0.76s;
}

@keyframes spn_out77 {
  30%, 100% {
    transform: rotateZ(277.2deg) translateX(5em);
    opacity: 1;
  }
}
.spn-a:nth-child(77) {
  animation: spn_out77 2s 2 alternate ease-in-out;
}
.spn-a:nth-child(77) .spn-b {
  animation-delay: 0.77s;
}

@keyframes spn_out78 {
  30%, 100% {
    transform: rotateZ(280.8deg) translateX(5em);
    opacity: 1;
  }
}
.spn-a:nth-child(78) {
  animation: spn_out78 2s 2 alternate ease-in-out;
}
.spn-a:nth-child(78) .spn-b {
  animation-delay: 0.78s;
}

@keyframes spn_out79 {
  30%, 100% {
    transform: rotateZ(284.4deg) translateX(5em);
    opacity: 1;
  }
}
.spn-a:nth-child(79) {
  animation: spn_out79 2s 2 alternate ease-in-out;
}
.spn-a:nth-child(79) .spn-b {
  animation-delay: 0.79s;
}

@keyframes spn_out80 {
  30%, 100% {
    transform: rotateZ(288deg) translateX(5em);
    opacity: 1;
  }
}
.spn-a:nth-child(80) {
  animation: spn_out80 2s 2 alternate ease-in-out;
}
.spn-a:nth-child(80) .spn-b {
  animation-delay: 0.8s;
}

@keyframes spn_out81 {
  30%, 100% {
    transform: rotateZ(291.6deg) translateX(5em);
    opacity: 1;
  }
}
.spn-a:nth-child(81) {
  animation: spn_out81 2s 2 alternate ease-in-out;
}
.spn-a:nth-child(81) .spn-b {
  animation-delay: 0.81s;
}

@keyframes spn_out82 {
  30%, 100% {
    transform: rotateZ(295.2deg) translateX(5em);
    opacity: 1;
  }
}
.spn-a:nth-child(82) {
  animation: spn_out82 2s 2 alternate ease-in-out;
}
.spn-a:nth-child(82) .spn-b {
  animation-delay: 0.82s;
}

@keyframes spn_out83 {
  30%, 100% {
    transform: rotateZ(298.8deg) translateX(5em);
    opacity: 1;
  }
}
.spn-a:nth-child(83) {
  animation: spn_out83 2s 2 alternate ease-in-out;
}
.spn-a:nth-child(83) .spn-b {
  animation-delay: 0.83s;
}

@keyframes spn_out84 {
  30%, 100% {
    transform: rotateZ(302.4deg) translateX(5em);
    opacity: 1;
  }
}
.spn-a:nth-child(84) {
  animation: spn_out84 2s 2 alternate ease-in-out;
}
.spn-a:nth-child(84) .spn-b {
  animation-delay: 0.84s;
}

@keyframes spn_out85 {
  30%, 100% {
    transform: rotateZ(306deg) translateX(5em);
    opacity: 1;
  }
}
.spn-a:nth-child(85) {
  animation: spn_out85 2s 2 alternate ease-in-out;
}
.spn-a:nth-child(85) .spn-b {
  animation-delay: 0.85s;
}

@keyframes spn_out86 {
  30%, 100% {
    transform: rotateZ(309.6deg) translateX(5em);
    opacity: 1;
  }
}
.spn-a:nth-child(86) {
  animation: spn_out86 2s 2 alternate ease-in-out;
}
.spn-a:nth-child(86) .spn-b {
  animation-delay: 0.86s;
}

@keyframes spn_out87 {
  30%, 100% {
    transform: rotateZ(313.2deg) translateX(5em);
    opacity: 1;
  }
}
.spn-a:nth-child(87) {
  animation: spn_out87 2s 2 alternate ease-in-out;
}
.spn-a:nth-child(87) .spn-b {
  animation-delay: 0.87s;
}

@keyframes spn_out88 {
  30%, 100% {
    transform: rotateZ(316.8deg) translateX(5em);
    opacity: 1;
  }
}
.spn-a:nth-child(88) {
  animation: spn_out88 2s 2 alternate ease-in-out;
}
.spn-a:nth-child(88) .spn-b {
  animation-delay: 0.88s;
}

@keyframes spn_out89 {
  30%, 100% {
    transform: rotateZ(320.4deg) translateX(5em);
    opacity: 1;
  }
}
.spn-a:nth-child(89) {
  animation: spn_out89 2s 2 alternate ease-in-out;
}
.spn-a:nth-child(89) .spn-b {
  animation-delay: 0.89s;
}

@keyframes spn_out90 {
  30%, 100% {
    transform: rotateZ(324deg) translateX(5em);
    opacity: 1;
  }
}
.spn-a:nth-child(90) {
  animation: spn_out90 2s 2 alternate ease-in-out;
}
.spn-a:nth-child(90) .spn-b {
  animation-delay: 0.9s;
}

@keyframes spn_out91 {
  30%, 100% {
    transform: rotateZ(327.6deg) translateX(5em);
    opacity: 1;
  }
}
.spn-a:nth-child(91) {
  animation: spn_out91 2s 2 alternate ease-in-out;
}
.spn-a:nth-child(91) .spn-b {
  animation-delay: 0.91s;
}

@keyframes spn_out92 {
  30%, 100% {
    transform: rotateZ(331.2deg) translateX(5em);
    opacity: 1;
  }
}
.spn-a:nth-child(92) {
  animation: spn_out92 2s 2 alternate ease-in-out;
}
.spn-a:nth-child(92) .spn-b {
  animation-delay: 0.92s;
}

@keyframes spn_out93 {
  30%, 100% {
    transform: rotateZ(334.8deg) translateX(5em);
    opacity: 1;
  }
}
.spn-a:nth-child(93) {
  animation: spn_out93 2s 2 alternate ease-in-out;
}
.spn-a:nth-child(93) .spn-b {
  animation-delay: 0.93s;
}

@keyframes spn_out94 {
  30%, 100% {
    transform: rotateZ(338.4deg) translateX(5em);
    opacity: 1;
  }
}
.spn-a:nth-child(94) {
  animation: spn_out94 2s 2 alternate ease-in-out;
}
.spn-a:nth-child(94) .spn-b {
  animation-delay: 0.94s;
}

@keyframes spn_out95 {
  30%, 100% {
    transform: rotateZ(342deg) translateX(5em);
    opacity: 1;
  }
}
.spn-a:nth-child(95) {
  animation: spn_out95 2s 2 alternate ease-in-out;
}
.spn-a:nth-child(95) .spn-b {
  animation-delay: 0.95s;
}

@keyframes spn_out96 {
  30%, 100% {
    transform: rotateZ(345.6deg) translateX(5em);
    opacity: 1;
  }
}
.spn-a:nth-child(96) {
  animation: spn_out96 2s 2 alternate ease-in-out;
}
.spn-a:nth-child(96) .spn-b {
  animation-delay: 0.96s;
}

@keyframes spn_out97 {
  30%, 100% {
    transform: rotateZ(349.2deg) translateX(5em);
    opacity: 1;
  }
}
.spn-a:nth-child(97) {
  animation: spn_out97 2s 2 alternate ease-in-out;
}
.spn-a:nth-child(97) .spn-b {
  animation-delay: 0.97s;
}

@keyframes spn_out98 {
  30%, 100% {
    transform: rotateZ(352.8deg) translateX(5em);
    opacity: 1;
  }
}
.spn-a:nth-child(98) {
  animation: spn_out98 2s 2 alternate ease-in-out;
}
.spn-a:nth-child(98) .spn-b {
  animation-delay: 0.98s;
}

@keyframes spn_out99 {
  30%, 100% {
    transform: rotateZ(356.4deg) translateX(5em);
    opacity: 1;
  }
}
.spn-a:nth-child(99) {
  animation: spn_out99 2s 2 alternate ease-in-out;
}
.spn-a:nth-child(99) .spn-b {
  animation-delay: 0.99s;
}

@keyframes spn_out100 {
  30%, 100% {
    transform: rotateZ(360deg) translateX(5em);
    opacity: 1;
  }
}
.spn-a:nth-child(100) {
  animation: spn_out100 2s 2 alternate ease-in-out;
}
.spn-a:nth-child(100) .spn-b {
  animation-delay: 1s;
}

@keyframes spn_spin {
  15% {
    transform: scale(3);
  }
  50% {
    transform: scale(1);
  }
}
.scene-torus {
  margin: auto;
  height: 100%;
  display: none;
}

.tor-wrap {
  position: absolute;
  left: 50%;
  top: 50%;
}

.tor-field {
  position: relative;
  transform: rotateX(-30deg) rotateY(0deg);
  animation: tor_rotateY 10s ease-in-out 1;
  opacity: 1;
}

.tor-field * {
  position: absolute;
}

.tor-field, .tor-field * {
  transform-style: preserve-3d;
}

.tor-circle:nth-child(1) {
  transform: rotateY(12deg) translateZ(8rem);
}
.tor-circle:nth-child(1) .tor-rotor {
  animation: tor_rotateX 3s linear infinite;
  animation-delay: 0.2s;
}
.tor-circle:nth-child(2) {
  transform: rotateY(24deg) translateZ(8rem);
}
.tor-circle:nth-child(2) .tor-rotor {
  animation: tor_rotateX 3s linear infinite;
  animation-delay: 0.4s;
}
.tor-circle:nth-child(3) {
  transform: rotateY(36deg) translateZ(8rem);
}
.tor-circle:nth-child(3) .tor-rotor {
  animation: tor_rotateX 3s linear infinite;
  animation-delay: 0.6s;
}
.tor-circle:nth-child(4) {
  transform: rotateY(48deg) translateZ(8rem);
}
.tor-circle:nth-child(4) .tor-rotor {
  animation: tor_rotateX 3s linear infinite;
  animation-delay: 0.8s;
}
.tor-circle:nth-child(5) {
  transform: rotateY(60deg) translateZ(8rem);
}
.tor-circle:nth-child(5) .tor-rotor {
  animation: tor_rotateX 3s linear infinite;
  animation-delay: 1s;
}
.tor-circle:nth-child(6) {
  transform: rotateY(72deg) translateZ(8rem);
}
.tor-circle:nth-child(6) .tor-rotor {
  animation: tor_rotateX 3s linear infinite;
  animation-delay: 1.2s;
}
.tor-circle:nth-child(7) {
  transform: rotateY(84deg) translateZ(8rem);
}
.tor-circle:nth-child(7) .tor-rotor {
  animation: tor_rotateX 3s linear infinite;
  animation-delay: 1.4s;
}
.tor-circle:nth-child(8) {
  transform: rotateY(96deg) translateZ(8rem);
}
.tor-circle:nth-child(8) .tor-rotor {
  animation: tor_rotateX 3s linear infinite;
  animation-delay: 1.6s;
}
.tor-circle:nth-child(9) {
  transform: rotateY(108deg) translateZ(8rem);
}
.tor-circle:nth-child(9) .tor-rotor {
  animation: tor_rotateX 3s linear infinite;
  animation-delay: 1.8s;
}
.tor-circle:nth-child(10) {
  transform: rotateY(120deg) translateZ(8rem);
}
.tor-circle:nth-child(10) .tor-rotor {
  animation: tor_rotateX 3s linear infinite;
  animation-delay: 2s;
}
.tor-circle:nth-child(11) {
  transform: rotateY(132deg) translateZ(8rem);
}
.tor-circle:nth-child(11) .tor-rotor {
  animation: tor_rotateX 3s linear infinite;
  animation-delay: 2.2s;
}
.tor-circle:nth-child(12) {
  transform: rotateY(144deg) translateZ(8rem);
}
.tor-circle:nth-child(12) .tor-rotor {
  animation: tor_rotateX 3s linear infinite;
  animation-delay: 2.4s;
}
.tor-circle:nth-child(13) {
  transform: rotateY(156deg) translateZ(8rem);
}
.tor-circle:nth-child(13) .tor-rotor {
  animation: tor_rotateX 3s linear infinite;
  animation-delay: 2.6s;
}
.tor-circle:nth-child(14) {
  transform: rotateY(168deg) translateZ(8rem);
}
.tor-circle:nth-child(14) .tor-rotor {
  animation: tor_rotateX 3s linear infinite;
  animation-delay: 2.8s;
}
.tor-circle:nth-child(15) {
  transform: rotateY(180deg) translateZ(8rem);
}
.tor-circle:nth-child(15) .tor-rotor {
  animation: tor_rotateX 3s linear infinite;
  animation-delay: 3s;
}
.tor-circle:nth-child(16) {
  transform: rotateY(192deg) translateZ(8rem);
}
.tor-circle:nth-child(16) .tor-rotor {
  animation: tor_rotateX 3s linear infinite;
  animation-delay: 3.2s;
}
.tor-circle:nth-child(17) {
  transform: rotateY(204deg) translateZ(8rem);
}
.tor-circle:nth-child(17) .tor-rotor {
  animation: tor_rotateX 3s linear infinite;
  animation-delay: 3.4s;
}
.tor-circle:nth-child(18) {
  transform: rotateY(216deg) translateZ(8rem);
}
.tor-circle:nth-child(18) .tor-rotor {
  animation: tor_rotateX 3s linear infinite;
  animation-delay: 3.6s;
}
.tor-circle:nth-child(19) {
  transform: rotateY(228deg) translateZ(8rem);
}
.tor-circle:nth-child(19) .tor-rotor {
  animation: tor_rotateX 3s linear infinite;
  animation-delay: 3.8s;
}
.tor-circle:nth-child(20) {
  transform: rotateY(240deg) translateZ(8rem);
}
.tor-circle:nth-child(20) .tor-rotor {
  animation: tor_rotateX 3s linear infinite;
  animation-delay: 4s;
}
.tor-circle:nth-child(21) {
  transform: rotateY(252deg) translateZ(8rem);
}
.tor-circle:nth-child(21) .tor-rotor {
  animation: tor_rotateX 3s linear infinite;
  animation-delay: 4.2s;
}
.tor-circle:nth-child(22) {
  transform: rotateY(264deg) translateZ(8rem);
}
.tor-circle:nth-child(22) .tor-rotor {
  animation: tor_rotateX 3s linear infinite;
  animation-delay: 4.4s;
}
.tor-circle:nth-child(23) {
  transform: rotateY(276deg) translateZ(8rem);
}
.tor-circle:nth-child(23) .tor-rotor {
  animation: tor_rotateX 3s linear infinite;
  animation-delay: 4.6s;
}
.tor-circle:nth-child(24) {
  transform: rotateY(288deg) translateZ(8rem);
}
.tor-circle:nth-child(24) .tor-rotor {
  animation: tor_rotateX 3s linear infinite;
  animation-delay: 4.8s;
}
.tor-circle:nth-child(25) {
  transform: rotateY(300deg) translateZ(8rem);
}
.tor-circle:nth-child(25) .tor-rotor {
  animation: tor_rotateX 3s linear infinite;
  animation-delay: 5s;
}
.tor-circle:nth-child(26) {
  transform: rotateY(312deg) translateZ(8rem);
}
.tor-circle:nth-child(26) .tor-rotor {
  animation: tor_rotateX 3s linear infinite;
  animation-delay: 5.2s;
}
.tor-circle:nth-child(27) {
  transform: rotateY(324deg) translateZ(8rem);
}
.tor-circle:nth-child(27) .tor-rotor {
  animation: tor_rotateX 3s linear infinite;
  animation-delay: 5.4s;
}
.tor-circle:nth-child(28) {
  transform: rotateY(336deg) translateZ(8rem);
}
.tor-circle:nth-child(28) .tor-rotor {
  animation: tor_rotateX 3s linear infinite;
  animation-delay: 5.6s;
}
.tor-circle:nth-child(29) {
  transform: rotateY(348deg) translateZ(8rem);
}
.tor-circle:nth-child(29) .tor-rotor {
  animation: tor_rotateX 3s linear infinite;
  animation-delay: 5.8s;
}
.tor-circle:nth-child(30) {
  transform: rotateY(360deg) translateZ(8rem);
}
.tor-circle:nth-child(30) .tor-rotor {
  animation: tor_rotateX 3s linear infinite;
  animation-delay: 6s;
}

.tor-dot {
  width: 0.25rem;
  height: 0.25rem;
  border-radius: 50%;
  backface-visibility: hidden;
}
.tor-dot:nth-child(1) {
  transform: rotateX(18deg) translateZ(3rem);
  background-color: rgba(255, 255, 255, 0.5);
}
.tor-dot:nth-child(2) {
  transform: rotateX(36deg) translateZ(3rem);
  background-color: white;
}
.tor-dot:nth-child(3) {
  transform: rotateX(54deg) translateZ(3rem);
  background-color: rgba(255, 255, 255, 0.2);
}
.tor-dot:nth-child(4) {
  transform: rotateX(72deg) translateZ(3rem);
  background-color: rgba(255, 255, 255, 0.5);
}
.tor-dot:nth-child(5) {
  transform: rotateX(90deg) translateZ(3rem);
  background-color: white;
}
.tor-dot:nth-child(6) {
  transform: rotateX(108deg) translateZ(3rem);
  background-color: rgba(255, 255, 255, 0.2);
}
.tor-dot:nth-child(7) {
  transform: rotateX(126deg) translateZ(3rem);
  background-color: rgba(255, 255, 255, 0.5);
}
.tor-dot:nth-child(8) {
  transform: rotateX(144deg) translateZ(3rem);
  background-color: white;
}
.tor-dot:nth-child(9) {
  transform: rotateX(162deg) translateZ(3rem);
  background-color: rgba(255, 255, 255, 0.2);
}
.tor-dot:nth-child(10) {
  transform: rotateX(180deg) translateZ(3rem);
  background-color: rgba(255, 255, 255, 0.5);
}
.tor-dot:nth-child(11) {
  transform: rotateX(198deg) translateZ(3rem);
  background-color: white;
}
.tor-dot:nth-child(12) {
  transform: rotateX(216deg) translateZ(3rem);
  background-color: rgba(255, 255, 255, 0.2);
}
.tor-dot:nth-child(13) {
  transform: rotateX(234deg) translateZ(3rem);
  background-color: rgba(255, 255, 255, 0.5);
}
.tor-dot:nth-child(14) {
  transform: rotateX(252deg) translateZ(3rem);
  background-color: white;
}
.tor-dot:nth-child(15) {
  transform: rotateX(270deg) translateZ(3rem);
  background-color: rgba(255, 255, 255, 0.2);
}
.tor-dot:nth-child(16) {
  transform: rotateX(288deg) translateZ(3rem);
  background-color: rgba(255, 255, 255, 0.5);
}
.tor-dot:nth-child(17) {
  transform: rotateX(306deg) translateZ(3rem);
  background-color: white;
}
.tor-dot:nth-child(18) {
  transform: rotateX(324deg) translateZ(3rem);
  background-color: rgba(255, 255, 255, 0.2);
}
.tor-dot:nth-child(19) {
  transform: rotateX(342deg) translateZ(3rem);
  background-color: rgba(255, 255, 255, 0.5);
}
.tor-dot:nth-child(20) {
  transform: rotateX(360deg) translateZ(3rem);
  background-color: white;
}

@keyframes tor_rotateX {
  100% {
    transform: rotateX(360deg);
  }
}
@keyframes tor_rotateY {
  20%, 30% {
    transform: rotateX(90deg) rotateY(360deg);
  }
  40%, 50% {
    transform: rotateX(-30deg) rotateZ(30deg) scale(0.6);
  }
  60%, 80% {
    transform: rotateX(60deg) rotateZ(40deg);
  }
  90%, 100% {
    transform: rotateX(-90deg) rotateY(1440deg) scale(2);
  }
}
.scene-hole {
  margin: auto;
  height: 100%;
  display: none;
}

.hol-hole {
  top: 50%;
  left: 50%;
  position: absolute;
}

.hol-a {
  display: block;
  position: absolute;
  width: 20rem;
  height: 20rem;
  margin: -10rem;
  border-radius: 50%;
  opacity: 0;
  animation: hol_scale 2s 2 linear;
}

i:nth-child(1) {
  animation-delay: 0.25s;
}

i:nth-child(2) {
  animation-delay: 0.5s;
}

i:nth-child(3) {
  animation-delay: 0.75s;
}

i:nth-child(4) {
  animation-delay: 1s;
}

i:nth-child(5) {
  animation-delay: 1.25s;
}

i:nth-child(6) {
  animation-delay: 1.5s;
}

i:nth-child(7) {
  animation-delay: 1.75s;
}

i:nth-child(8) {
  animation-delay: 2s;
}

@keyframes hol_scale {
  0% {
    transform: scale(2);
    opacity: 0;
    box-shadow: 0 0 50px rgba(255, 255, 255, 0.5);
  }
  50% {
    transform: scale(1) translate(0, -1rem);
    opacity: 1;
    box-shadow: 0 -10px 20px rgba(255, 255, 255, 0.5);
  }
  100% {
    transform: scale(0.1) translate(0, 1rem);
    opacity: 0;
    box-shadow: 0 50px 20px rgba(255, 255, 255, 0.5);
  }
}
.scene-polygon {
  margin: auto;
  height: 100%;
  display: none;
}

.pol-wrap {
  height: inherit;
  perspective: 35rem;
  perspective-origin: 50% 50%;
  position: absolute;
  left: 50%;
  animation: up 4s 1 ease-in-out;
}

.pol-dodecahedron {
  position: relative;
  transform-style: preserve-3d;
  animation: spin 50s infinite alternate cubic-bezier(0, -5, 1, 10);
}

.pol-dodecahedron, .pol-pentagon, .pol-pentagon-inner, .pol-pentagon-inner::before {
  top: 50%;
  left: 50%;
  margin: -10em;
  width: 20em;
  height: 20em;
}

.pol-pentagon, .pol-pentagon-inner, .pol-pentagon-inner::before {
  position: absolute;
  overflow: hidden;
}

.pol-pentagon:nth-child(1) {
  transform: scaleY(-1) translateY(8.50651em) rotateY(1.88496rad) translateZ(5.25731em) rotateX(-0.46365rad) rotate(-0.62832rad) skewX(0.31416rad) scaleY(0.95106);
}
.pol-pentagon:nth-child(1) .pol-pentagon-inner::before {
  animation: color1 3s infinite alternate linear;
}
.pol-pentagon:nth-child(2) {
  transform: scaleY(-1) translateY(8.50651em) rotateY(3.14159rad) translateZ(5.25731em) rotateX(-0.46365rad) rotate(-0.62832rad) skewX(0.31416rad) scaleY(0.95106);
}
.pol-pentagon:nth-child(2) .pol-pentagon-inner::before {
  animation: color2 3s infinite alternate linear;
}
.pol-pentagon:nth-child(3) {
  transform: scaleY(-1) translateY(8.50651em) rotateY(4.39823rad) translateZ(5.25731em) rotateX(-0.46365rad) rotate(-0.62832rad) skewX(0.31416rad) scaleY(0.95106);
}
.pol-pentagon:nth-child(3) .pol-pentagon-inner::before {
  animation: color3 3s infinite alternate linear;
}
.pol-pentagon:nth-child(4) {
  transform: scaleY(-1) translateY(8.50651em) rotateY(5.65487rad) translateZ(5.25731em) rotateX(-0.46365rad) rotate(-0.62832rad) skewX(0.31416rad) scaleY(0.95106);
}
.pol-pentagon:nth-child(4) .pol-pentagon-inner::before {
  animation: color4 3s infinite alternate linear;
}
.pol-pentagon:nth-child(5) {
  transform: scaleY(-1) translateY(8.50651em) rotateY(6.9115rad) translateZ(5.25731em) rotateX(-0.46365rad) rotate(-0.62832rad) skewX(0.31416rad) scaleY(0.95106);
}
.pol-pentagon:nth-child(5) .pol-pentagon-inner::before {
  animation: color5 3s infinite alternate linear;
}
.pol-pentagon:nth-child(6) {
  transform: scaleY(-1) translateY(8.50651em) rotateX(1.5708rad) scaleY(-1) translateY(5.25731em) rotate(-0.62832rad) skewX(0.31416rad) scaleY(0.95106);
}
.pol-pentagon:nth-child(6) .pol-pentagon-inner::before {
  animation: color6 3s infinite alternate linear;
}
.pol-pentagon:nth-child(7) {
  transform: translateY(8.50651em) rotateY(10.0531rad) translateZ(5.25731em) rotateX(-0.46365rad) rotate(-0.62832rad) skewX(0.31416rad) scaleY(0.95106);
}
.pol-pentagon:nth-child(7) .pol-pentagon-inner::before {
  animation: color7 3s infinite alternate linear;
}
.pol-pentagon:nth-child(8) {
  transform: translateY(8.50651em) rotateY(11.30973rad) translateZ(5.25731em) rotateX(-0.46365rad) rotate(-0.62832rad) skewX(0.31416rad) scaleY(0.95106);
}
.pol-pentagon:nth-child(8) .pol-pentagon-inner::before {
  animation: color8 3s infinite alternate linear;
}
.pol-pentagon:nth-child(9) {
  transform: translateY(8.50651em) rotateY(12.56637rad) translateZ(5.25731em) rotateX(-0.46365rad) rotate(-0.62832rad) skewX(0.31416rad) scaleY(0.95106);
}
.pol-pentagon:nth-child(9) .pol-pentagon-inner::before {
  animation: color9 3s infinite alternate linear;
}
.pol-pentagon:nth-child(10) {
  transform: translateY(8.50651em) rotateY(13.82301rad) translateZ(5.25731em) rotateX(-0.46365rad) rotate(-0.62832rad) skewX(0.31416rad) scaleY(0.95106);
}
.pol-pentagon:nth-child(10) .pol-pentagon-inner::before {
  animation: color10 3s infinite alternate linear;
}
.pol-pentagon:nth-child(11) {
  transform: translateY(8.50651em) rotateY(15.07964rad) translateZ(5.25731em) rotateX(-0.46365rad) rotate(-0.62832rad) skewX(0.31416rad) scaleY(0.95106);
}
.pol-pentagon:nth-child(11) .pol-pentagon-inner::before {
  animation: color11 3s infinite alternate linear;
}
.pol-pentagon:nth-child(12) {
  transform: translateY(8.50651em) rotateX(1.5708rad) translateY(5.25731em) rotate(-0.62832rad) skewX(0.31416rad) scaleY(0.95106);
}
.pol-pentagon:nth-child(12) .pol-pentagon-inner::before {
  animation: color12 3s infinite alternate linear;
}

.pol-pentagon-inner {
  transform: scaleY(1.05146) skewX(-0.31416rad) rotate(0.62832rad) translateY(-7.26543em) rotate(0.31416rad) skewY(0.94248rad) scaleX(0.58779);
}
.pol-pentagon-inner:before {
  content: "";
  transform: scaleX(1.7013) skewY(-0.94248rad) rotate(-0.31416rad) translateY(-2.73457em);
}

@keyframes color1 {
  0% {
    background: rgba(184, 184, 184, 0.5);
  }
  20% {
    background: rgba(36, 36, 36, 0.5);
  }
  40% {
    background: rgba(5, 5, 5, 0.4);
  }
  60% {
    background: rgba(230, 230, 230, 0);
  }
  80% {
    background: #cccccc;
  }
  100% {
    background: rgba(51, 51, 51, 0.8);
  }
}
@keyframes color2 {
  0% {
    background: rgba(250, 250, 250, 0.5);
  }
  20% {
    background: rgba(235, 235, 235, 0.5);
  }
  40% {
    background: rgba(145, 145, 145, 0.4);
  }
  60% {
    background: rgba(138, 138, 138, 0);
  }
  80% {
    background: #cccccc;
  }
  100% {
    background: rgba(51, 51, 51, 0.8);
  }
}
@keyframes color3 {
  0% {
    background: rgba(173, 173, 173, 0.5);
  }
  20% {
    background: rgba(94, 94, 94, 0.5);
  }
  40% {
    background: rgba(242, 242, 242, 0.4);
  }
  60% {
    background: rgba(107, 107, 107, 0);
  }
  80% {
    background: #cccccc;
  }
  100% {
    background: rgba(51, 51, 51, 0.8);
  }
}
@keyframes color4 {
  0% {
    background: rgba(130, 130, 130, 0.5);
  }
  20% {
    background: rgba(209, 209, 209, 0.5);
  }
  40% {
    background: rgba(135, 135, 135, 0.4);
  }
  60% {
    background: rgba(84, 84, 84, 0);
  }
  80% {
    background: #cccccc;
  }
  100% {
    background: rgba(51, 51, 51, 0.8);
  }
}
@keyframes color5 {
  0% {
    background: rgba(33, 33, 33, 0.5);
  }
  20% {
    background: rgba(181, 181, 181, 0.5);
  }
  40% {
    background: rgba(237, 237, 237, 0.4);
  }
  60% {
    background: rgba(201, 201, 201, 0);
  }
  80% {
    background: #cccccc;
  }
  100% {
    background: rgba(51, 51, 51, 0.8);
  }
}
@keyframes color6 {
  0% {
    background: rgba(204, 204, 204, 0.5);
  }
  20% {
    background: rgba(71, 71, 71, 0.5);
  }
  40% {
    background: rgba(10, 10, 10, 0.4);
  }
  60% {
    background: rgba(23, 23, 23, 0);
  }
  80% {
    background: #cccccc;
  }
  100% {
    background: rgba(51, 51, 51, 0.8);
  }
}
@keyframes color7 {
  0% {
    background: rgba(28, 28, 28, 0.5);
  }
  20% {
    background: rgba(48, 48, 48, 0.5);
  }
  40% {
    background: rgba(166, 166, 166, 0);
  }
  60% {
    background: rgba(214, 214, 214, 0.4);
  }
  80% {
    background: rgba(51, 51, 51, 0.8);
  }
  100% {
    background: #cccccc;
  }
}
@keyframes color8 {
  0% {
    background: rgba(33, 33, 33, 0.5);
  }
  20% {
    background: rgba(178, 178, 178, 0.5);
  }
  40% {
    background: rgba(209, 209, 209, 0);
  }
  60% {
    background: rgba(153, 153, 153, 0.4);
  }
  80% {
    background: rgba(51, 51, 51, 0.8);
  }
  100% {
    background: #cccccc;
  }
}
@keyframes color9 {
  0% {
    background: rgba(171, 171, 171, 0.5);
  }
  20% {
    background: rgba(97, 97, 97, 0.5);
  }
  40% {
    background: rgba(171, 171, 171, 0);
  }
  60% {
    background: rgba(176, 176, 176, 0.4);
  }
  80% {
    background: rgba(51, 51, 51, 0.8);
  }
  100% {
    background: #cccccc;
  }
}
@keyframes color10 {
  0% {
    background: rgba(89, 89, 89, 0.5);
  }
  20% {
    background: rgba(102, 102, 102, 0.5);
  }
  40% {
    background: rgba(235, 235, 235, 0);
  }
  60% {
    background: rgba(252, 252, 252, 0.4);
  }
  80% {
    background: rgba(51, 51, 51, 0.8);
  }
  100% {
    background: #cccccc;
  }
}
@keyframes color11 {
  0% {
    background: rgba(227, 227, 227, 0.5);
  }
  20% {
    background: rgba(184, 184, 184, 0.5);
  }
  40% {
    background: rgba(156, 156, 156, 0);
  }
  60% {
    background: rgba(8, 8, 8, 0.4);
  }
  80% {
    background: rgba(51, 51, 51, 0.8);
  }
  100% {
    background: #cccccc;
  }
}
@keyframes color12 {
  0% {
    background: rgba(107, 107, 107, 0.5);
  }
  20% {
    background: rgba(240, 240, 240, 0.5);
  }
  40% {
    background: rgba(161, 161, 161, 0);
  }
  60% {
    background: rgba(224, 224, 224, 0.4);
  }
  80% {
    background: rgba(51, 51, 51, 0.8);
  }
  100% {
    background: #cccccc;
  }
}
.pol-pentagon:nth-child(1) {
  animation: translate1 6s infinite 1s alternate ease-in-out;
}

@keyframes translate1 {
  0%, 20% {
    transform: scaleY(-1) translateY(8.50651em) rotateY(1.88496rad) translateZ(5.25731em) rotateX(-0.46365rad) rotate(-0.62832rad) skewX(0.31416rad) scaleY(0.95106);
  }
  40% {
    transform: scaleY(-1) translateY(8.50651em) rotateY(1.88496rad) translateZ(10.51462em) rotateX(-0.46365rad) rotate(-0.62832rad) skewX(0.31416rad) scaleY(0.95106);
  }
  60% {
    transform: scaleY(-1) translateY(8.50651em) rotateY(1.88496rad) translateZ(10.51462em) rotateX(-1.39094rad);
  }
  80% {
    transform: scaleY(-1) translateY(8.50651em) rotateY(-6.28319rad) translateZ(10.51462em) rotateX(-1.39094rad);
  }
  100% {
    transform: scaleY(-1) translateY(8.50651em) rotateY(-10.0531rad) translateZ(5.25731em) rotateX(-2.78189rad);
  }
}
.pol-pentagon:nth-child(2) {
  animation: translate2 6s infinite 1s alternate ease-in-out;
}

@keyframes translate2 {
  0%, 20% {
    transform: scaleY(-1) translateY(8.50651em) rotateY(3.14159rad) translateZ(5.25731em) rotateX(-0.46365rad) rotate(-0.62832rad) skewX(0.31416rad) scaleY(0.95106);
  }
  40% {
    transform: scaleY(-1) translateY(8.50651em) rotateY(3.14159rad) translateZ(10.51462em) rotateX(-0.46365rad) rotate(-0.62832rad) skewX(0.31416rad) scaleY(0.95106);
  }
  60% {
    transform: scaleY(-1) translateY(8.50651em) rotateY(3.14159rad) translateZ(10.51462em) rotateX(-1.39094rad);
  }
  80% {
    transform: scaleY(-1) translateY(8.50651em) rotateY(-8.79646rad) translateZ(10.51462em) rotateX(-1.39094rad);
  }
  100% {
    transform: scaleY(-1) translateY(8.50651em) rotateY(-12.56637rad) translateZ(5.25731em) rotateX(-2.78189rad);
  }
}
.pol-pentagon:nth-child(3) {
  animation: translate3 6s infinite 1s alternate ease-in-out;
}

@keyframes translate3 {
  0%, 20% {
    transform: scaleY(-1) translateY(8.50651em) rotateY(4.39823rad) translateZ(5.25731em) rotateX(-0.46365rad) rotate(-0.62832rad) skewX(0.31416rad) scaleY(0.95106);
  }
  40% {
    transform: scaleY(-1) translateY(8.50651em) rotateY(4.39823rad) translateZ(10.51462em) rotateX(-0.46365rad) rotate(-0.62832rad) skewX(0.31416rad) scaleY(0.95106);
  }
  60% {
    transform: scaleY(-1) translateY(8.50651em) rotateY(4.39823rad) translateZ(10.51462em) rotateX(-1.39094rad);
  }
  80% {
    transform: scaleY(-1) translateY(8.50651em) rotateY(-11.30973rad) translateZ(10.51462em) rotateX(-1.39094rad);
  }
  100% {
    transform: scaleY(-1) translateY(8.50651em) rotateY(-15.07964rad) translateZ(5.25731em) rotateX(-2.78189rad);
  }
}
.pol-pentagon:nth-child(4) {
  animation: translate4 6s infinite 1s alternate ease-in-out;
}

@keyframes translate4 {
  0%, 20% {
    transform: scaleY(-1) translateY(8.50651em) rotateY(5.65487rad) translateZ(5.25731em) rotateX(-0.46365rad) rotate(-0.62832rad) skewX(0.31416rad) scaleY(0.95106);
  }
  40% {
    transform: scaleY(-1) translateY(8.50651em) rotateY(5.65487rad) translateZ(10.51462em) rotateX(-0.46365rad) rotate(-0.62832rad) skewX(0.31416rad) scaleY(0.95106);
  }
  60% {
    transform: scaleY(-1) translateY(8.50651em) rotateY(5.65487rad) translateZ(10.51462em) rotateX(-1.39094rad);
  }
  80% {
    transform: scaleY(-1) translateY(8.50651em) rotateY(-13.82301rad) translateZ(10.51462em) rotateX(-1.39094rad);
  }
  100% {
    transform: scaleY(-1) translateY(8.50651em) rotateY(-17.59292rad) translateZ(5.25731em) rotateX(-2.78189rad);
  }
}
.pol-pentagon:nth-child(5) {
  animation: translate5 6s infinite 1s alternate ease-in-out;
}

@keyframes translate5 {
  0%, 20% {
    transform: scaleY(-1) translateY(8.50651em) rotateY(6.9115rad) translateZ(5.25731em) rotateX(-0.46365rad) rotate(-0.62832rad) skewX(0.31416rad) scaleY(0.95106);
  }
  40% {
    transform: scaleY(-1) translateY(8.50651em) rotateY(6.9115rad) translateZ(10.51462em) rotateX(-0.46365rad) rotate(-0.62832rad) skewX(0.31416rad) scaleY(0.95106);
  }
  60% {
    transform: scaleY(-1) translateY(8.50651em) rotateY(6.9115rad) translateZ(10.51462em) rotateX(-1.39094rad);
  }
  80% {
    transform: scaleY(-1) translateY(8.50651em) rotateY(-16.33628rad) translateZ(10.51462em) rotateX(-1.39094rad);
  }
  100% {
    transform: scaleY(-1) translateY(8.50651em) rotateY(-20.10619rad) translateZ(5.25731em) rotateX(-2.78189rad);
  }
}
.pol-pentagon:nth-child(6) {
  animation: translate6 6s infinite 1s alternate ease-in-out;
}

@keyframes translate6 {
  100% {
    transform: scaleY(-1) translateY(17.01302em) rotateX(1.5708rad) scaleY(-1) translateY(5.25731em) rotate(-0.62832rad) skewX(0.31416rad) scaleY(0.95106);
  }
}
.pol-pentagon:nth-child(7) {
  animation: translate7 6s infinite 1s alternate ease-in-out;
}

@keyframes translate7 {
  0%, 20% {
    transform: translateY(8.50651em) rotateY(10.0531rad) translateZ(5.25731em) rotateX(-0.46365rad) rotate(-0.62832rad) skewX(0.31416rad) scaleY(0.95106);
  }
  40% {
    transform: translateY(8.50651em) rotateY(10.0531rad) translateZ(10.51462em) rotateX(-0.46365rad) rotate(-0.62832rad) skewX(0.31416rad) scaleY(0.95106);
  }
  60% {
    transform: translateY(8.50651em) rotateY(9.42478rad) translateZ(10.51462em) rotateX(-1.39094rad);
  }
  80% {
    transform: translateY(8.50651em) rotateY(-21.36283rad) translateZ(10.51462em) rotateX(-1.39094rad);
  }
  100% {
    transform: translateY(8.50651em) rotateY(-25.13274rad) translateZ(5.25731em) rotateX(-2.78189rad);
  }
}
.pol-pentagon:nth-child(8) {
  animation: translate8 6s infinite 1s alternate ease-in-out;
}

@keyframes translate8 {
  0%, 20% {
    transform: translateY(8.50651em) rotateY(11.30973rad) translateZ(5.25731em) rotateX(-0.46365rad) rotate(-0.62832rad) skewX(0.31416rad) scaleY(0.95106);
  }
  40% {
    transform: translateY(8.50651em) rotateY(11.30973rad) translateZ(10.51462em) rotateX(-0.46365rad) rotate(-0.62832rad) skewX(0.31416rad) scaleY(0.95106);
  }
  60% {
    transform: translateY(8.50651em) rotateY(10.68142rad) translateZ(10.51462em) rotateX(-1.39094rad);
  }
  80% {
    transform: translateY(8.50651em) rotateY(-23.8761rad) translateZ(10.51462em) rotateX(-1.39094rad);
  }
  100% {
    transform: translateY(8.50651em) rotateY(-27.64602rad) translateZ(5.25731em) rotateX(-2.78189rad);
  }
}
.pol-pentagon:nth-child(9) {
  animation: translate9 6s infinite 1s alternate ease-in-out;
}

@keyframes translate9 {
  0%, 20% {
    transform: translateY(8.50651em) rotateY(12.56637rad) translateZ(5.25731em) rotateX(-0.46365rad) rotate(-0.62832rad) skewX(0.31416rad) scaleY(0.95106);
  }
  40% {
    transform: translateY(8.50651em) rotateY(12.56637rad) translateZ(10.51462em) rotateX(-0.46365rad) rotate(-0.62832rad) skewX(0.31416rad) scaleY(0.95106);
  }
  60% {
    transform: translateY(8.50651em) rotateY(11.93805rad) translateZ(10.51462em) rotateX(-1.39094rad);
  }
  80% {
    transform: translateY(8.50651em) rotateY(-26.38938rad) translateZ(10.51462em) rotateX(-1.39094rad);
  }
  100% {
    transform: translateY(8.50651em) rotateY(-30.15929rad) translateZ(5.25731em) rotateX(-2.78189rad);
  }
}
.pol-pentagon:nth-child(10) {
  animation: translate10 6s infinite 1s alternate ease-in-out;
}

@keyframes translate10 {
  0%, 20% {
    transform: translateY(8.50651em) rotateY(13.82301rad) translateZ(5.25731em) rotateX(-0.46365rad) rotate(-0.62832rad) skewX(0.31416rad) scaleY(0.95106);
  }
  40% {
    transform: translateY(8.50651em) rotateY(13.82301rad) translateZ(10.51462em) rotateX(-0.46365rad) rotate(-0.62832rad) skewX(0.31416rad) scaleY(0.95106);
  }
  60% {
    transform: translateY(8.50651em) rotateY(13.19469rad) translateZ(10.51462em) rotateX(-1.39094rad);
  }
  80% {
    transform: translateY(8.50651em) rotateY(-28.90265rad) translateZ(10.51462em) rotateX(-1.39094rad);
  }
  100% {
    transform: translateY(8.50651em) rotateY(-32.67256rad) translateZ(5.25731em) rotateX(-2.78189rad);
  }
}
.pol-pentagon:nth-child(11) {
  animation: translate11 6s infinite 1s alternate ease-in-out;
}

@keyframes translate11 {
  0%, 20% {
    transform: translateY(8.50651em) rotateY(15.07964rad) translateZ(5.25731em) rotateX(-0.46365rad) rotate(-0.62832rad) skewX(0.31416rad) scaleY(0.95106);
  }
  40% {
    transform: translateY(8.50651em) rotateY(15.07964rad) translateZ(10.51462em) rotateX(-0.46365rad) rotate(-0.62832rad) skewX(0.31416rad) scaleY(0.95106);
  }
  60% {
    transform: translateY(8.50651em) rotateY(14.45133rad) translateZ(10.51462em) rotateX(-1.39094rad);
  }
  80% {
    transform: translateY(8.50651em) rotateY(-31.41593rad) translateZ(10.51462em) rotateX(-1.39094rad);
  }
  100% {
    transform: translateY(8.50651em) rotateY(-35.18584rad) translateZ(5.25731em) rotateX(-2.78189rad);
  }
}
.pol-pentagon:nth-child(12) {
  animation: translate12 6s infinite 1s alternate ease-in-out;
}

@keyframes translate12 {
  100% {
    transform: translateY(17.01302em) rotateX(1.5708rad) translateY(5.25731em) rotate(-0.62832rad) skewX(0.31416rad) scaleY(0.95106);
  }
}
@keyframes spin {
  100% {
    transform: rotateX(360deg) rotateY(360deg) translateX(3.81966em) rotateZ(-360deg);
  }
}
@keyframes up {
  0% {
    transform: translateY(30rem);
  }
  100% {
    transform: translateY(0);
  }
}


.footer {
  position: fixed;
  left: 0;
  bottom: 0;
  width: 100%;
  background-color:rgba(4, 6, 44,0.2) ;
  color: white;
  text-align: center;
}

#loader {
  position: fixed;
  left: 0px;
  top: 0px;
  width: 100%;
  height: 100%;
  z-index: 9999;
  background: url('https://media.giphy.com/media/mBMdeZHp6bqfkL4vBI/giphy.gif') 50% 50% no-repeat rgb(249,249,249);