body {
  background-image: linear-gradient(#000, #204);
  min-height: 100vh;
  margin: 0;
  overflow: hidden;
  perspective: 1000px;
}

.fireworks {
  position: absolute;
  top: 100%;
  left: 50%;
  width: 10px;
  height: 10px;
  transform-style: preserve-3d;
  transform: translateX(-50%);
}
@-webkit-keyframes fireworksTop {
  0% {
    top: 100%;
  }
  25% {
    top: var(--height);
    -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
  }
  100% {
    top: 200%;
  }
}
@keyframes fireworksTop {
  0% {
    top: 100%;
  }
  25% {
    top: var(--height);
    -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
  }
  100% {
    top: 200%;
  }
}
.fireworks:nth-child(1) {
  -webkit-animation: fireworksTop 5s 0s infinite ease-out, fireworks0 50s 0s infinite step-end;
          animation: fireworksTop 5s 0s infinite ease-out, fireworks0 50s 0s infinite step-end;
}
@-webkit-keyframes fireworks0 {
  0% {
    left: 76%;
    transform: translateX(-50%) scale(0.89);
    --hue: 0;
    --height: 16% ;
  }
  10% {
    left: 55%;
    transform: translateX(-50%) scale(0.83);
    --hue: 36;
    --height: 22% ;
  }
  20% {
    left: 21%;
    transform: translateX(-50%) scale(0.97);
    --hue: 72;
    --height: 37% ;
  }
  30% {
    left: 30%;
    transform: translateX(-50%) scale(0.75);
    --hue: 108;
    --height: 17% ;
  }
  40% {
    left: 37%;
    transform: translateX(-50%) scale(0.73);
    --hue: 144;
    --height: 20% ;
  }
  50% {
    left: 67%;
    transform: translateX(-50%) scale(0.64);
    --hue: 180;
    --height: 34% ;
  }
  60% {
    left: 32%;
    transform: translateX(-50%) scale(0.92);
    --hue: 216;
    --height: 38% ;
  }
  70% {
    left: 38%;
    transform: translateX(-50%) scale(0.52);
    --hue: 252;
    --height: 29% ;
  }
  80% {
    left: 67%;
    transform: translateX(-50%) scale(0.54);
    --hue: 288;
    --height: 22% ;
  }
  90% {
    left: 46%;
    transform: translateX(-50%) scale(0.63);
    --hue: 324;
    --height: 31% ;
  }
}
@keyframes fireworks0 {
  0% {
    left: 76%;
    transform: translateX(-50%) scale(0.89);
    --hue: 0;
    --height: 16% ;
  }
  10% {
    left: 55%;
    transform: translateX(-50%) scale(0.83);
    --hue: 36;
    --height: 22% ;
  }
  20% {
    left: 21%;
    transform: translateX(-50%) scale(0.97);
    --hue: 72;
    --height: 37% ;
  }
  30% {
    left: 30%;
    transform: translateX(-50%) scale(0.75);
    --hue: 108;
    --height: 17% ;
  }
  40% {
    left: 37%;
    transform: translateX(-50%) scale(0.73);
    --hue: 144;
    --height: 20% ;
  }
  50% {
    left: 67%;
    transform: translateX(-50%) scale(0.64);
    --hue: 180;
    --height: 34% ;
  }
  60% {
    left: 32%;
    transform: translateX(-50%) scale(0.92);
    --hue: 216;
    --height: 38% ;
  }
  70% {
    left: 38%;
    transform: translateX(-50%) scale(0.52);
    --hue: 252;
    --height: 29% ;
  }
  80% {
    left: 67%;
    transform: translateX(-50%) scale(0.54);
    --hue: 288;
    --height: 22% ;
  }
  90% {
    left: 46%;
    transform: translateX(-50%) scale(0.63);
    --hue: 324;
    --height: 31% ;
  }
}
.fireworks:nth-child(1) > .year {
  background-color: hsl(calc(var(--hue) + 0), 100%, 75%);
}
.fireworks:nth-child(1) > .year:nth-child(1) {
  --t:
    translateX(450px)
    translateY(-290px)
    translateZ(-440px)
    rotateX(400deg)
    rotateY(56deg)
    rotateZ(148deg)
    scale(0);
}
.fireworks:nth-child(1) > .year:nth-child(2) {
  --t:
    translateX(480px)
    translateY(-450px)
    translateZ(-180px)
    rotateX(269deg)
    rotateY(128deg)
    rotateZ(710deg)
    scale(0);
}
.fireworks:nth-child(1) > .year:nth-child(3) {
  --t:
    translateX(-490px)
    translateY(-250px)
    translateZ(-440px)
    rotateX(73deg)
    rotateY(466deg)
    rotateZ(286deg)
    scale(0);
}
.fireworks:nth-child(1) > .year:nth-child(4) {
  --t:
    translateX(90px)
    translateY(-670px)
    translateZ(-20px)
    rotateX(430deg)
    rotateY(596deg)
    rotateZ(510deg)
    scale(0);
}
.fireworks:nth-child(1) > .year:nth-child(5) {
  --t:
    translateX(-210px)
    translateY(-520px)
    translateZ(240px)
    rotateX(213deg)
    rotateY(395deg)
    rotateZ(483deg)
    scale(0);
}
.fireworks:nth-child(1) > .year:nth-child(6) {
  --t:
    translateX(50px)
    translateY(-680px)
    translateZ(-280px)
    rotateX(82deg)
    rotateY(136deg)
    rotateZ(439deg)
    scale(0);
}
.fireworks:nth-child(1) > .year:nth-child(7) {
  --t:
    translateX(360px)
    translateY(-580px)
    translateZ(-290px)
    rotateX(146deg)
    rotateY(470deg)
    rotateZ(171deg)
    scale(0);
}
.fireworks:nth-child(1) > .year:nth-child(8) {
  --t:
    translateX(-290px)
    translateY(-520px)
    translateZ(-310px)
    rotateX(151deg)
    rotateY(35deg)
    rotateZ(554deg)
    scale(0);
}
.fireworks:nth-child(1) > .year:nth-child(9) {
  --t:
    translateX(-250px)
    translateY(-580px)
    translateZ(-270px)
    rotateX(207deg)
    rotateY(576deg)
    rotateZ(648deg)
    scale(0);
}
.fireworks:nth-child(1) > .year:nth-child(10) {
  --t:
    translateX(-410px)
    translateY(-380px)
    translateZ(-450px)
    rotateX(237deg)
    rotateY(186deg)
    rotateZ(149deg)
    scale(0);
}
.fireworks:nth-child(1) > .year:nth-child(11) {
  --t:
    translateX(-70px)
    translateY(-720px)
    translateZ(420px)
    rotateX(450deg)
    rotateY(111deg)
    rotateZ(73deg)
    scale(0);
}
.fireworks:nth-child(1) > .year:nth-child(12) {
  --t:
    translateX(-370px)
    translateY(-320px)
    translateZ(-480px)
    rotateX(232deg)
    rotateY(137deg)
    rotateZ(611deg)
    scale(0);
}
.fireworks:nth-child(1) > .year:nth-child(13) {
  --t:
    translateX(480px)
    translateY(-730px)
    translateZ(-180px)
    rotateX(526deg)
    rotateY(416deg)
    rotateZ(690deg)
    scale(0);
}
.fireworks:nth-child(1) > .year:nth-child(14) {
  --t:
    translateX(-490px)
    translateY(-470px)
    translateZ(-400px)
    rotateX(611deg)
    rotateY(352deg)
    rotateZ(273deg)
    scale(0);
}
.fireworks:nth-child(1) > .year:nth-child(15) {
  --t:
    translateX(250px)
    translateY(-660px)
    translateZ(-80px)
    rotateX(487deg)
    rotateY(598deg)
    rotateZ(316deg)
    scale(0);
}
.fireworks:nth-child(1) > .year:nth-child(16) {
  --t:
    translateX(140px)
    translateY(-310px)
    translateZ(350px)
    rotateX(645deg)
    rotateY(421deg)
    rotateZ(321deg)
    scale(0);
}
.fireworks:nth-child(1) > .year:nth-child(17) {
  --t:
    translateX(-320px)
    translateY(-730px)
    translateZ(-210px)
    rotateX(571deg)
    rotateY(331deg)
    rotateZ(445deg)
    scale(0);
}
.fireworks:nth-child(1) > .year:nth-child(18) {
  --t:
    translateX(460px)
    translateY(-700px)
    translateZ(90px)
    rotateX(454deg)
    rotateY(540deg)
    rotateZ(491deg)
    scale(0);
}
.fireworks:nth-child(1) > .year:nth-child(19) {
  --t:
    translateX(70px)
    translateY(-660px)
    translateZ(130px)
    rotateX(424deg)
    rotateY(643deg)
    rotateZ(252deg)
    scale(0);
}
.fireworks:nth-child(1) > .year:nth-child(20) {
  --t:
    translateX(180px)
    translateY(-660px)
    translateZ(130px)
    rotateX(651deg)
    rotateY(534deg)
    rotateZ(377deg)
    scale(0);
}
.fireworks:nth-child(1) > .year:nth-child(21) {
  --t:
    translateX(130px)
    translateY(-560px)
    translateZ(-400px)
    rotateX(209deg)
    rotateY(411deg)
    rotateZ(248deg)
    scale(0);
}
.fireworks:nth-child(1) > .year:nth-child(22) {
  --t:
    translateX(-50px)
    translateY(-740px)
    translateZ(-260px)
    rotateX(342deg)
    rotateY(368deg)
    rotateZ(182deg)
    scale(0);
}
.fireworks:nth-child(1) > .year:nth-child(23) {
  --t:
    translateX(-360px)
    translateY(-450px)
    translateZ(420px)
    rotateX(233deg)
    rotateY(173deg)
    rotateZ(219deg)
    scale(0);
}
.fireworks:nth-child(1) > .year:nth-child(24) {
  --t:
    translateX(220px)
    translateY(-250px)
    translateZ(-160px)
    rotateX(416deg)
    rotateY(6deg)
    rotateZ(430deg)
    scale(0);
}
.fireworks:nth-child(1) > .year:nth-child(25) {
  --t:
    translateX(-100px)
    translateY(-490px)
    translateZ(-470px)
    rotateX(653deg)
    rotateY(221deg)
    rotateZ(539deg)
    scale(0);
}
.fireworks:nth-child(1) > .year:nth-child(26) {
  --t:
    translateX(390px)
    translateY(-720px)
    translateZ(130px)
    rotateX(453deg)
    rotateY(43deg)
    rotateZ(385deg)
    scale(0);
}
.fireworks:nth-child(1) > .year:nth-child(27) {
  --t:
    translateX(320px)
    translateY(-260px)
    translateZ(60px)
    rotateX(573deg)
    rotateY(326deg)
    rotateZ(557deg)
    scale(0);
}
.fireworks:nth-child(1) > .year:nth-child(28) {
  --t:
    translateX(-320px)
    translateY(-710px)
    translateZ(400px)
    rotateX(711deg)
    rotateY(140deg)
    rotateZ(153deg)
    scale(0);
}
.fireworks:nth-child(1) > .year:nth-child(29) {
  --t:
    translateX(60px)
    translateY(-330px)
    translateZ(-410px)
    rotateX(148deg)
    rotateY(248deg)
    rotateZ(295deg)
    scale(0);
}
.fireworks:nth-child(1) > .year:nth-child(30) {
  --t:
    translateX(170px)
    translateY(-500px)
    translateZ(160px)
    rotateX(20deg)
    rotateY(385deg)
    rotateZ(639deg)
    scale(0);
}
.fireworks:nth-child(1) > .year:nth-child(31) {
  --t:
    translateX(350px)
    translateY(-470px)
    translateZ(0px)
    rotateX(251deg)
    rotateY(25deg)
    rotateZ(385deg)
    scale(0);
}
.fireworks:nth-child(1) > .year:nth-child(32) {
  --t:
    translateX(310px)
    translateY(-430px)
    translateZ(-200px)
    rotateX(528deg)
    rotateY(676deg)
    rotateZ(247deg)
    scale(0);
}
.fireworks:nth-child(1) > .year:nth-child(33) {
  --t:
    translateX(-490px)
    translateY(-300px)
    translateZ(100px)
    rotateX(676deg)
    rotateY(137deg)
    rotateZ(62deg)
    scale(0);
}
.fireworks:nth-child(1) > .year:nth-child(34) {
  --t:
    translateX(-340px)
    translateY(-530px)
    translateZ(110px)
    rotateX(702deg)
    rotateY(634deg)
    rotateZ(344deg)
    scale(0);
}
.fireworks:nth-child(1) > .year:nth-child(35) {
  --t:
    translateX(140px)
    translateY(-580px)
    translateZ(110px)
    rotateX(648deg)
    rotateY(149deg)
    rotateZ(280deg)
    scale(0);
}
.fireworks:nth-child(1) > .year:nth-child(36) {
  --t:
    translateX(100px)
    translateY(-690px)
    translateZ(-350px)
    rotateX(416deg)
    rotateY(296deg)
    rotateZ(500deg)
    scale(0);
}
.fireworks:nth-child(1) > .year:nth-child(37) {
  --t:
    translateX(350px)
    translateY(-460px)
    translateZ(-270px)
    rotateX(33deg)
    rotateY(166deg)
    rotateZ(320deg)
    scale(0);
}
.fireworks:nth-child(1) > .year:nth-child(38) {
  --t:
    translateX(-330px)
    translateY(-440px)
    translateZ(270px)
    rotateX(461deg)
    rotateY(321deg)
    rotateZ(88deg)
    scale(0);
}
.fireworks:nth-child(1) > .year:nth-child(39) {
  --t:
    translateX(140px)
    translateY(-580px)
    translateZ(-260px)
    rotateX(370deg)
    rotateY(508deg)
    rotateZ(692deg)
    scale(0);
}
.fireworks:nth-child(1) > .year:nth-child(40) {
  --t:
    translateX(490px)
    translateY(-480px)
    translateZ(280px)
    rotateX(513deg)
    rotateY(341deg)
    rotateZ(579deg)
    scale(0);
}
.fireworks:nth-child(1) > .year:nth-child(41) {
  --t:
    translateX(150px)
    translateY(-590px)
    translateZ(-220px)
    rotateX(76deg)
    rotateY(574deg)
    rotateZ(179deg)
    scale(0);
}
.fireworks:nth-child(1) > .year:nth-child(42) {
  --t:
    translateX(-250px)
    translateY(-560px)
    translateZ(-260px)
    rotateX(53deg)
    rotateY(632deg)
    rotateZ(211deg)
    scale(0);
}
.fireworks:nth-child(1) > .year:nth-child(43) {
  --t:
    translateX(-70px)
    translateY(-480px)
    translateZ(480px)
    rotateX(698deg)
    rotateY(265deg)
    rotateZ(185deg)
    scale(0);
}
.fireworks:nth-child(1) > .year:nth-child(44) {
  --t:
    translateX(250px)
    translateY(-710px)
    translateZ(490px)
    rotateX(180deg)
    rotateY(442deg)
    rotateZ(572deg)
    scale(0);
}
.fireworks:nth-child(1) > .year:nth-child(45) {
  --t:
    translateX(-390px)
    translateY(-710px)
    translateZ(310px)
    rotateX(477deg)
    rotateY(145deg)
    rotateZ(554deg)
    scale(0);
}
.fireworks:nth-child(1) > .year:nth-child(46) {
  --t:
    translateX(480px)
    translateY(-460px)
    translateZ(320px)
    rotateX(415deg)
    rotateY(694deg)
    rotateZ(57deg)
    scale(0);
}
.fireworks:nth-child(1) > .year:nth-child(47) {
  --t:
    translateX(-330px)
    translateY(-700px)
    translateZ(-350px)
    rotateX(218deg)
    rotateY(62deg)
    rotateZ(346deg)
    scale(0);
}
.fireworks:nth-child(1) > .year:nth-child(48) {
  --t:
    translateX(350px)
    translateY(-440px)
    translateZ(210px)
    rotateX(305deg)
    rotateY(645deg)
    rotateZ(220deg)
    scale(0);
}
.fireworks:nth-child(1) > .year:nth-child(49) {
  --t:
    translateX(290px)
    translateY(-520px)
    translateZ(-340px)
    rotateX(158deg)
    rotateY(620deg)
    rotateZ(402deg)
    scale(0);
}
.fireworks:nth-child(1) > .year:nth-child(50) {
  --t:
    translateX(20px)
    translateY(-700px)
    translateZ(320px)
    rotateX(331deg)
    rotateY(61deg)
    rotateZ(166deg)
    scale(0);
}
.fireworks:nth-child(1) > .year:nth-child(51) {
  --t:
    translateX(340px)
    translateY(-570px)
    translateZ(60px)
    rotateX(479deg)
    rotateY(430deg)
    rotateZ(240deg)
    scale(0);
}
.fireworks:nth-child(1) > .year:nth-child(52) {
  --t:
    translateX(-290px)
    translateY(-610px)
    translateZ(-120px)
    rotateX(503deg)
    rotateY(180deg)
    rotateZ(159deg)
    scale(0);
}
.fireworks:nth-child(1) > .year:nth-child(53) {
  --t:
    translateX(-40px)
    translateY(-260px)
    translateZ(-190px)
    rotateX(317deg)
    rotateY(6deg)
    rotateZ(599deg)
    scale(0);
}
.fireworks:nth-child(1) > .year:nth-child(54) {
  --t:
    translateX(-290px)
    translateY(-600px)
    translateZ(-130px)
    rotateX(106deg)
    rotateY(35deg)
    rotateZ(209deg)
    scale(0);
}
.fireworks:nth-child(1) > .year:nth-child(55) {
  --t:
    translateX(240px)
    translateY(-330px)
    translateZ(-370px)
    rotateX(586deg)
    rotateY(587deg)
    rotateZ(289deg)
    scale(0);
}
.fireworks:nth-child(1) > .year:nth-child(56) {
  --t:
    translateX(60px)
    translateY(-480px)
    translateZ(140px)
    rotateX(385deg)
    rotateY(480deg)
    rotateZ(672deg)
    scale(0);
}
.fireworks:nth-child(1) > .year:nth-child(57) {
  --t:
    translateX(440px)
    translateY(-360px)
    translateZ(140px)
    rotateX(201deg)
    rotateY(192deg)
    rotateZ(583deg)
    scale(0);
}
.fireworks:nth-child(1) > .year:nth-child(58) {
  --t:
    translateX(-160px)
    translateY(-410px)
    translateZ(150px)
    rotateX(340deg)
    rotateY(383deg)
    rotateZ(561deg)
    scale(0);
}
.fireworks:nth-child(1) > .year:nth-child(59) {
  --t:
    translateX(-30px)
    translateY(-470px)
    translateZ(-200px)
    rotateX(480deg)
    rotateY(19deg)
    rotateZ(662deg)
    scale(0);
}
.fireworks:nth-child(1) > .year:nth-child(60) {
  --t:
    translateX(-290px)
    translateY(-260px)
    translateZ(380px)
    rotateX(190deg)
    rotateY(578deg)
    rotateZ(555deg)
    scale(0);
}
.fireworks:nth-child(1) > .year:nth-child(61) {
  --t:
    translateX(-80px)
    translateY(-460px)
    translateZ(-340px)
    rotateX(252deg)
    rotateY(175deg)
    rotateZ(543deg)
    scale(0);
}
.fireworks:nth-child(1) > .year:nth-child(62) {
  --t:
    translateX(-160px)
    translateY(-300px)
    translateZ(80px)
    rotateX(347deg)
    rotateY(486deg)
    rotateZ(293deg)
    scale(0);
}
.fireworks:nth-child(1) > .year:nth-child(63) {
  --t:
    translateX(290px)
    translateY(-650px)
    translateZ(220px)
    rotateX(572deg)
    rotateY(441deg)
    rotateZ(520deg)
    scale(0);
}
.fireworks:nth-child(1) > .year:nth-child(64) {
  --t:
    translateX(430px)
    translateY(-690px)
    translateZ(-390px)
    rotateX(548deg)
    rotateY(688deg)
    rotateZ(453deg)
    scale(0);
}
.fireworks:nth-child(1) > .year:nth-child(65) {
  --t:
    translateX(-410px)
    translateY(-560px)
    translateZ(-240px)
    rotateX(462deg)
    rotateY(344deg)
    rotateZ(414deg)
    scale(0);
}
.fireworks:nth-child(1) > .year:nth-child(66) {
  --t:
    translateX(420px)
    translateY(-630px)
    translateZ(460px)
    rotateX(404deg)
    rotateY(586deg)
    rotateZ(443deg)
    scale(0);
}
.fireworks:nth-child(1) > .year:nth-child(67) {
  --t:
    translateX(210px)
    translateY(-430px)
    translateZ(-130px)
    rotateX(672deg)
    rotateY(290deg)
    rotateZ(605deg)
    scale(0);
}
.fireworks:nth-child(1) > .year:nth-child(68) {
  --t:
    translateX(-490px)
    translateY(-600px)
    translateZ(-220px)
    rotateX(658deg)
    rotateY(291deg)
    rotateZ(620deg)
    scale(0);
}
.fireworks:nth-child(1) > .year:nth-child(69) {
  --t:
    translateX(250px)
    translateY(-290px)
    translateZ(100px)
    rotateX(504deg)
    rotateY(431deg)
    rotateZ(466deg)
    scale(0);
}
.fireworks:nth-child(1) > .year:nth-child(70) {
  --t:
    translateX(110px)
    translateY(-520px)
    translateZ(170px)
    rotateX(22deg)
    rotateY(301deg)
    rotateZ(397deg)
    scale(0);
}
.fireworks:nth-child(1) > .year:nth-child(71) {
  --t:
    translateX(30px)
    translateY(-670px)
    translateZ(490px)
    rotateX(477deg)
    rotateY(119deg)
    rotateZ(208deg)
    scale(0);
}
.fireworks:nth-child(1) > .year:nth-child(72) {
  --t:
    translateX(0px)
    translateY(-360px)
    translateZ(-200px)
    rotateX(540deg)
    rotateY(469deg)
    rotateZ(319deg)
    scale(0);
}
.fireworks:nth-child(1) > .year:nth-child(73) {
  --t:
    translateX(-90px)
    translateY(-500px)
    translateZ(-240px)
    rotateX(564deg)
    rotateY(74deg)
    rotateZ(554deg)
    scale(0);
}
.fireworks:nth-child(2) {
  -webkit-animation: fireworksTop 5s 1.6666666667s infinite ease-out, fireworks1 50s 1.6666666667s infinite step-end;
          animation: fireworksTop 5s 1.6666666667s infinite ease-out, fireworks1 50s 1.6666666667s infinite step-end;
}
@-webkit-keyframes fireworks1 {
  0% {
    left: 59%;
    transform: translateX(-50%) scale(0.69);
    --hue: 0;
    --height: 31% ;
  }
  10% {
    left: 58%;
    transform: translateX(-50%) scale(0.63);
    --hue: 36;
    --height: 17% ;
  }
  20% {
    left: 60%;
    transform: translateX(-50%) scale(1);
    --hue: 72;
    --height: 37% ;
  }
  30% {
    left: 43%;
    transform: translateX(-50%) scale(0.67);
    --hue: 108;
    --height: 25% ;
  }
  40% {
    left: 76%;
    transform: translateX(-50%) scale(0.66);
    --hue: 144;
    --height: 34% ;
  }
  50% {
    left: 63%;
    transform: translateX(-50%) scale(0.58);
    --hue: 180;
    --height: 32% ;
  }
  60% {
    left: 29%;
    transform: translateX(-50%) scale(0.78);
    --hue: 216;
    --height: 36% ;
  }
  70% {
    left: 80%;
    transform: translateX(-50%) scale(0.96);
    --hue: 252;
    --height: 30% ;
  }
  80% {
    left: 79%;
    transform: translateX(-50%) scale(0.93);
    --hue: 288;
    --height: 38% ;
  }
  90% {
    left: 56%;
    transform: translateX(-50%) scale(0.57);
    --hue: 324;
    --height: 24% ;
  }
}
@keyframes fireworks1 {
  0% {
    left: 59%;
    transform: translateX(-50%) scale(0.69);
    --hue: 0;
    --height: 31% ;
  }
  10% {
    left: 58%;
    transform: translateX(-50%) scale(0.63);
    --hue: 36;
    --height: 17% ;
  }
  20% {
    left: 60%;
    transform: translateX(-50%) scale(1);
    --hue: 72;
    --height: 37% ;
  }
  30% {
    left: 43%;
    transform: translateX(-50%) scale(0.67);
    --hue: 108;
    --height: 25% ;
  }
  40% {
    left: 76%;
    transform: translateX(-50%) scale(0.66);
    --hue: 144;
    --height: 34% ;
  }
  50% {
    left: 63%;
    transform: translateX(-50%) scale(0.58);
    --hue: 180;
    --height: 32% ;
  }
  60% {
    left: 29%;
    transform: translateX(-50%) scale(0.78);
    --hue: 216;
    --height: 36% ;
  }
  70% {
    left: 80%;
    transform: translateX(-50%) scale(0.96);
    --hue: 252;
    --height: 30% ;
  }
  80% {
    left: 79%;
    transform: translateX(-50%) scale(0.93);
    --hue: 288;
    --height: 38% ;
  }
  90% {
    left: 56%;
    transform: translateX(-50%) scale(0.57);
    --hue: 324;
    --height: 24% ;
  }
}
.fireworks:nth-child(2) > .year {
  background-color: hsl(calc(var(--hue) + 120), 100%, 75%);
}
.fireworks:nth-child(2) > .year:nth-child(1) {
  --t:
    translateX(-420px)
    translateY(-470px)
    translateZ(450px)
    rotateX(424deg)
    rotateY(102deg)
    rotateZ(516deg)
    scale(0);
}
.fireworks:nth-child(2) > .year:nth-child(2) {
  --t:
    translateX(-30px)
    translateY(-710px)
    translateZ(-430px)
    rotateX(208deg)
    rotateY(182deg)
    rotateZ(335deg)
    scale(0);
}
.fireworks:nth-child(2) > .year:nth-child(3) {
  --t:
    translateX(-70px)
    translateY(-490px)
    translateZ(-90px)
    rotateX(38deg)
    rotateY(191deg)
    rotateZ(493deg)
    scale(0);
}
.fireworks:nth-child(2) > .year:nth-child(4) {
  --t:
    translateX(480px)
    translateY(-290px)
    translateZ(-400px)
    rotateX(593deg)
    rotateY(104deg)
    rotateZ(345deg)
    scale(0);
}
.fireworks:nth-child(2) > .year:nth-child(5) {
  --t:
    translateX(210px)
    translateY(-730px)
    translateZ(-30px)
    rotateX(597deg)
    rotateY(89deg)
    rotateZ(219deg)
    scale(0);
}
.fireworks:nth-child(2) > .year:nth-child(6) {
  --t:
    translateX(-120px)
    translateY(-720px)
    translateZ(60px)
    rotateX(686deg)
    rotateY(355deg)
    rotateZ(473deg)
    scale(0);
}
.fireworks:nth-child(2) > .year:nth-child(7) {
  --t:
    translateX(-40px)
    translateY(-610px)
    translateZ(-160px)
    rotateX(370deg)
    rotateY(82deg)
    rotateZ(28deg)
    scale(0);
}
.fireworks:nth-child(2) > .year:nth-child(8) {
  --t:
    translateX(280px)
    translateY(-500px)
    translateZ(200px)
    rotateX(461deg)
    rotateY(323deg)
    rotateZ(597deg)
    scale(0);
}
.fireworks:nth-child(2) > .year:nth-child(9) {
  --t:
    translateX(-480px)
    translateY(-680px)
    translateZ(-430px)
    rotateX(325deg)
    rotateY(549deg)
    rotateZ(565deg)
    scale(0);
}
.fireworks:nth-child(2) > .year:nth-child(10) {
  --t:
    translateX(430px)
    translateY(-350px)
    translateZ(-40px)
    rotateX(371deg)
    rotateY(187deg)
    rotateZ(700deg)
    scale(0);
}
.fireworks:nth-child(2) > .year:nth-child(11) {
  --t:
    translateX(-340px)
    translateY(-260px)
    translateZ(-450px)
    rotateX(245deg)
    rotateY(218deg)
    rotateZ(598deg)
    scale(0);
}
.fireworks:nth-child(2) > .year:nth-child(12) {
  --t:
    translateX(-30px)
    translateY(-310px)
    translateZ(500px)
    rotateX(32deg)
    rotateY(489deg)
    rotateZ(563deg)
    scale(0);
}
.fireworks:nth-child(2) > .year:nth-child(13) {
  --t:
    translateX(500px)
    translateY(-450px)
    translateZ(-310px)
    rotateX(300deg)
    rotateY(267deg)
    rotateZ(99deg)
    scale(0);
}
.fireworks:nth-child(2) > .year:nth-child(14) {
  --t:
    translateX(-360px)
    translateY(-260px)
    translateZ(-200px)
    rotateX(375deg)
    rotateY(539deg)
    rotateZ(3deg)
    scale(0);
}
.fireworks:nth-child(2) > .year:nth-child(15) {
  --t:
    translateX(100px)
    translateY(-400px)
    translateZ(10px)
    rotateX(239deg)
    rotateY(223deg)
    rotateZ(417deg)
    scale(0);
}
.fireworks:nth-child(2) > .year:nth-child(16) {
  --t:
    translateX(-30px)
    translateY(-470px)
    translateZ(-270px)
    rotateX(299deg)
    rotateY(536deg)
    rotateZ(256deg)
    scale(0);
}
.fireworks:nth-child(2) > .year:nth-child(17) {
  --t:
    translateX(250px)
    translateY(-740px)
    translateZ(230px)
    rotateX(216deg)
    rotateY(597deg)
    rotateZ(29deg)
    scale(0);
}
.fireworks:nth-child(2) > .year:nth-child(18) {
  --t:
    translateX(280px)
    translateY(-310px)
    translateZ(-470px)
    rotateX(490deg)
    rotateY(584deg)
    rotateZ(325deg)
    scale(0);
}
.fireworks:nth-child(2) > .year:nth-child(19) {
  --t:
    translateX(220px)
    translateY(-630px)
    translateZ(-200px)
    rotateX(672deg)
    rotateY(324deg)
    rotateZ(32deg)
    scale(0);
}
.fireworks:nth-child(2) > .year:nth-child(20) {
  --t:
    translateX(40px)
    translateY(-260px)
    translateZ(40px)
    rotateX(393deg)
    rotateY(559deg)
    rotateZ(621deg)
    scale(0);
}
.fireworks:nth-child(2) > .year:nth-child(21) {
  --t:
    translateX(20px)
    translateY(-430px)
    translateZ(80px)
    rotateX(243deg)
    rotateY(281deg)
    rotateZ(180deg)
    scale(0);
}
.fireworks:nth-child(2) > .year:nth-child(22) {
  --t:
    translateX(210px)
    translateY(-590px)
    translateZ(-370px)
    rotateX(337deg)
    rotateY(172deg)
    rotateZ(413deg)
    scale(0);
}
.fireworks:nth-child(2) > .year:nth-child(23) {
  --t:
    translateX(420px)
    translateY(-420px)
    translateZ(-40px)
    rotateX(116deg)
    rotateY(97deg)
    rotateZ(313deg)
    scale(0);
}
.fireworks:nth-child(2) > .year:nth-child(24) {
  --t:
    translateX(70px)
    translateY(-250px)
    translateZ(110px)
    rotateX(656deg)
    rotateY(177deg)
    rotateZ(69deg)
    scale(0);
}
.fireworks:nth-child(2) > .year:nth-child(25) {
  --t:
    translateX(-410px)
    translateY(-580px)
    translateZ(0px)
    rotateX(504deg)
    rotateY(596deg)
    rotateZ(347deg)
    scale(0);
}
.fireworks:nth-child(2) > .year:nth-child(26) {
  --t:
    translateX(470px)
    translateY(-620px)
    translateZ(-110px)
    rotateX(660deg)
    rotateY(161deg)
    rotateZ(480deg)
    scale(0);
}
.fireworks:nth-child(2) > .year:nth-child(27) {
  --t:
    translateX(-230px)
    translateY(-280px)
    translateZ(410px)
    rotateX(296deg)
    rotateY(61deg)
    rotateZ(470deg)
    scale(0);
}
.fireworks:nth-child(2) > .year:nth-child(28) {
  --t:
    translateX(-390px)
    translateY(-610px)
    translateZ(270px)
    rotateX(24deg)
    rotateY(12deg)
    rotateZ(98deg)
    scale(0);
}
.fireworks:nth-child(2) > .year:nth-child(29) {
  --t:
    translateX(-480px)
    translateY(-560px)
    translateZ(-60px)
    rotateX(541deg)
    rotateY(170deg)
    rotateZ(229deg)
    scale(0);
}
.fireworks:nth-child(2) > .year:nth-child(30) {
  --t:
    translateX(330px)
    translateY(-700px)
    translateZ(-400px)
    rotateX(165deg)
    rotateY(640deg)
    rotateZ(341deg)
    scale(0);
}
.fireworks:nth-child(2) > .year:nth-child(31) {
  --t:
    translateX(90px)
    translateY(-610px)
    translateZ(370px)
    rotateX(467deg)
    rotateY(501deg)
    rotateZ(479deg)
    scale(0);
}
.fireworks:nth-child(2) > .year:nth-child(32) {
  --t:
    translateX(-40px)
    translateY(-490px)
    translateZ(310px)
    rotateX(388deg)
    rotateY(54deg)
    rotateZ(393deg)
    scale(0);
}
.fireworks:nth-child(2) > .year:nth-child(33) {
  --t:
    translateX(290px)
    translateY(-710px)
    translateZ(-30px)
    rotateX(600deg)
    rotateY(403deg)
    rotateZ(166deg)
    scale(0);
}
.fireworks:nth-child(2) > .year:nth-child(34) {
  --t:
    translateX(220px)
    translateY(-410px)
    translateZ(-70px)
    rotateX(574deg)
    rotateY(384deg)
    rotateZ(491deg)
    scale(0);
}
.fireworks:nth-child(2) > .year:nth-child(35) {
  --t:
    translateX(-330px)
    translateY(-330px)
    translateZ(490px)
    rotateX(455deg)
    rotateY(528deg)
    rotateZ(85deg)
    scale(0);
}
.fireworks:nth-child(2) > .year:nth-child(36) {
  --t:
    translateX(10px)
    translateY(-700px)
    translateZ(80px)
    rotateX(25deg)
    rotateY(414deg)
    rotateZ(142deg)
    scale(0);
}
.fireworks:nth-child(2) > .year:nth-child(37) {
  --t:
    translateX(-50px)
    translateY(-260px)
    translateZ(220px)
    rotateX(296deg)
    rotateY(438deg)
    rotateZ(362deg)
    scale(0);
}
.fireworks:nth-child(2) > .year:nth-child(38) {
  --t:
    translateX(-140px)
    translateY(-580px)
    translateZ(490px)
    rotateX(538deg)
    rotateY(374deg)
    rotateZ(212deg)
    scale(0);
}
.fireworks:nth-child(2) > .year:nth-child(39) {
  --t:
    translateX(-470px)
    translateY(-590px)
    translateZ(460px)
    rotateX(427deg)
    rotateY(326deg)
    rotateZ(51deg)
    scale(0);
}
.fireworks:nth-child(2) > .year:nth-child(40) {
  --t:
    translateX(-250px)
    translateY(-460px)
    translateZ(-360px)
    rotateX(270deg)
    rotateY(320deg)
    rotateZ(49deg)
    scale(0);
}
.fireworks:nth-child(2) > .year:nth-child(41) {
  --t:
    translateX(240px)
    translateY(-450px)
    translateZ(-70px)
    rotateX(627deg)
    rotateY(610deg)
    rotateZ(316deg)
    scale(0);
}
.fireworks:nth-child(2) > .year:nth-child(42) {
  --t:
    translateX(340px)
    translateY(-310px)
    translateZ(-480px)
    rotateX(91deg)
    rotateY(40deg)
    rotateZ(357deg)
    scale(0);
}
.fireworks:nth-child(2) > .year:nth-child(43) {
  --t:
    translateX(-10px)
    translateY(-490px)
    translateZ(310px)
    rotateX(193deg)
    rotateY(211deg)
    rotateZ(629deg)
    scale(0);
}
.fireworks:nth-child(2) > .year:nth-child(44) {
  --t:
    translateX(-410px)
    translateY(-250px)
    translateZ(210px)
    rotateX(699deg)
    rotateY(199deg)
    rotateZ(693deg)
    scale(0);
}
.fireworks:nth-child(2) > .year:nth-child(45) {
  --t:
    translateX(340px)
    translateY(-720px)
    translateZ(-280px)
    rotateX(141deg)
    rotateY(130deg)
    rotateZ(536deg)
    scale(0);
}
.fireworks:nth-child(2) > .year:nth-child(46) {
  --t:
    translateX(290px)
    translateY(-470px)
    translateZ(230px)
    rotateX(177deg)
    rotateY(512deg)
    rotateZ(197deg)
    scale(0);
}
.fireworks:nth-child(2) > .year:nth-child(47) {
  --t:
    translateX(-440px)
    translateY(-640px)
    translateZ(-10px)
    rotateX(440deg)
    rotateY(170deg)
    rotateZ(515deg)
    scale(0);
}
.fireworks:nth-child(2) > .year:nth-child(48) {
  --t:
    translateX(260px)
    translateY(-650px)
    translateZ(-120px)
    rotateX(609deg)
    rotateY(489deg)
    rotateZ(76deg)
    scale(0);
}
.fireworks:nth-child(2) > .year:nth-child(49) {
  --t:
    translateX(10px)
    translateY(-510px)
    translateZ(-210px)
    rotateX(91deg)
    rotateY(178deg)
    rotateZ(294deg)
    scale(0);
}
.fireworks:nth-child(2) > .year:nth-child(50) {
  --t:
    translateX(450px)
    translateY(-330px)
    translateZ(-40px)
    rotateX(419deg)
    rotateY(534deg)
    rotateZ(363deg)
    scale(0);
}
.fireworks:nth-child(2) > .year:nth-child(51) {
  --t:
    translateX(20px)
    translateY(-380px)
    translateZ(120px)
    rotateX(517deg)
    rotateY(173deg)
    rotateZ(102deg)
    scale(0);
}
.fireworks:nth-child(2) > .year:nth-child(52) {
  --t:
    translateX(-160px)
    translateY(-700px)
    translateZ(-100px)
    rotateX(297deg)
    rotateY(438deg)
    rotateZ(13deg)
    scale(0);
}
.fireworks:nth-child(2) > .year:nth-child(53) {
  --t:
    translateX(120px)
    translateY(-550px)
    translateZ(-30px)
    rotateX(170deg)
    rotateY(146deg)
    rotateZ(296deg)
    scale(0);
}
.fireworks:nth-child(2) > .year:nth-child(54) {
  --t:
    translateX(-60px)
    translateY(-340px)
    translateZ(-80px)
    rotateX(260deg)
    rotateY(150deg)
    rotateZ(700deg)
    scale(0);
}
.fireworks:nth-child(2) > .year:nth-child(55) {
  --t:
    translateX(-60px)
    translateY(-590px)
    translateZ(480px)
    rotateX(318deg)
    rotateY(492deg)
    rotateZ(667deg)
    scale(0);
}
.fireworks:nth-child(2) > .year:nth-child(56) {
  --t:
    translateX(290px)
    translateY(-620px)
    translateZ(-300px)
    rotateX(532deg)
    rotateY(216deg)
    rotateZ(28deg)
    scale(0);
}
.fireworks:nth-child(2) > .year:nth-child(57) {
  --t:
    translateX(130px)
    translateY(-560px)
    translateZ(130px)
    rotateX(214deg)
    rotateY(197deg)
    rotateZ(112deg)
    scale(0);
}
.fireworks:nth-child(2) > .year:nth-child(58) {
  --t:
    translateX(-150px)
    translateY(-710px)
    translateZ(320px)
    rotateX(656deg)
    rotateY(286deg)
    rotateZ(174deg)
    scale(0);
}
.fireworks:nth-child(2) > .year:nth-child(59) {
  --t:
    translateX(200px)
    translateY(-740px)
    translateZ(-480px)
    rotateX(561deg)
    rotateY(646deg)
    rotateZ(258deg)
    scale(0);
}
.fireworks:nth-child(2) > .year:nth-child(60) {
  --t:
    translateX(-120px)
    translateY(-590px)
    translateZ(20px)
    rotateX(278deg)
    rotateY(6deg)
    rotateZ(643deg)
    scale(0);
}
.fireworks:nth-child(2) > .year:nth-child(61) {
  --t:
    translateX(-180px)
    translateY(-270px)
    translateZ(100px)
    rotateX(282deg)
    rotateY(716deg)
    rotateZ(107deg)
    scale(0);
}
.fireworks:nth-child(2) > .year:nth-child(62) {
  --t:
    translateX(180px)
    translateY(-480px)
    translateZ(-10px)
    rotateX(125deg)
    rotateY(626deg)
    rotateZ(113deg)
    scale(0);
}
.fireworks:nth-child(2) > .year:nth-child(63) {
  --t:
    translateX(-470px)
    translateY(-740px)
    translateZ(80px)
    rotateX(166deg)
    rotateY(484deg)
    rotateZ(596deg)
    scale(0);
}
.fireworks:nth-child(2) > .year:nth-child(64) {
  --t:
    translateX(410px)
    translateY(-620px)
    translateZ(-220px)
    rotateX(441deg)
    rotateY(156deg)
    rotateZ(687deg)
    scale(0);
}
.fireworks:nth-child(2) > .year:nth-child(65) {
  --t:
    translateX(90px)
    translateY(-370px)
    translateZ(-70px)
    rotateX(635deg)
    rotateY(258deg)
    rotateZ(5deg)
    scale(0);
}
.fireworks:nth-child(2) > .year:nth-child(66) {
  --t:
    translateX(-270px)
    translateY(-430px)
    translateZ(420px)
    rotateX(105deg)
    rotateY(223deg)
    rotateZ(27deg)
    scale(0);
}
.fireworks:nth-child(2) > .year:nth-child(67) {
  --t:
    translateX(-90px)
    translateY(-420px)
    translateZ(-130px)
    rotateX(582deg)
    rotateY(567deg)
    rotateZ(667deg)
    scale(0);
}
.fireworks:nth-child(2) > .year:nth-child(68) {
  --t:
    translateX(10px)
    translateY(-400px)
    translateZ(-20px)
    rotateX(39deg)
    rotateY(14deg)
    rotateZ(272deg)
    scale(0);
}
.fireworks:nth-child(2) > .year:nth-child(69) {
  --t:
    translateX(10px)
    translateY(-280px)
    translateZ(-190px)
    rotateX(220deg)
    rotateY(165deg)
    rotateZ(528deg)
    scale(0);
}
.fireworks:nth-child(2) > .year:nth-child(70) {
  --t:
    translateX(-10px)
    translateY(-290px)
    translateZ(180px)
    rotateX(272deg)
    rotateY(550deg)
    rotateZ(202deg)
    scale(0);
}
.fireworks:nth-child(2) > .year:nth-child(71) {
  --t:
    translateX(400px)
    translateY(-490px)
    translateZ(-360px)
    rotateX(578deg)
    rotateY(7deg)
    rotateZ(163deg)
    scale(0);
}
.fireworks:nth-child(2) > .year:nth-child(72) {
  --t:
    translateX(380px)
    translateY(-350px)
    translateZ(-120px)
    rotateX(522deg)
    rotateY(46deg)
    rotateZ(413deg)
    scale(0);
}
.fireworks:nth-child(2) > .year:nth-child(73) {
  --t:
    translateX(-180px)
    translateY(-350px)
    translateZ(-160px)
    rotateX(519deg)
    rotateY(114deg)
    rotateZ(669deg)
    scale(0);
}
.fireworks:nth-child(3) {
  -webkit-animation: fireworksTop 5s 3.3333333333s infinite ease-out, fireworks2 50s 3.3333333333s infinite step-end;
          animation: fireworksTop 5s 3.3333333333s infinite ease-out, fireworks2 50s 3.3333333333s infinite step-end;
}
@-webkit-keyframes fireworks2 {
  0% {
    left: 76%;
    transform: translateX(-50%) scale(0.59);
    --hue: 0;
    --height: 37% ;
  }
  10% {
    left: 57%;
    transform: translateX(-50%) scale(0.85);
    --hue: 36;
    --height: 33% ;
  }
  20% {
    left: 55%;
    transform: translateX(-50%) scale(0.58);
    --hue: 72;
    --height: 31% ;
  }
  30% {
    left: 28%;
    transform: translateX(-50%) scale(0.93);
    --hue: 108;
    --height: 34% ;
  }
  40% {
    left: 59%;
    transform: translateX(-50%) scale(0.7);
    --hue: 144;
    --height: 40% ;
  }
  50% {
    left: 43%;
    transform: translateX(-50%) scale(0.72);
    --hue: 180;
    --height: 28% ;
  }
  60% {
    left: 41%;
    transform: translateX(-50%) scale(0.79);
    --hue: 216;
    --height: 33% ;
  }
  70% {
    left: 53%;
    transform: translateX(-50%) scale(0.61);
    --hue: 252;
    --height: 31% ;
  }
  80% {
    left: 62%;
    transform: translateX(-50%) scale(0.59);
    --hue: 288;
    --height: 40% ;
  }
  90% {
    left: 54%;
    transform: translateX(-50%) scale(0.74);
    --hue: 324;
    --height: 29% ;
  }
}
@keyframes fireworks2 {
  0% {
    left: 76%;
    transform: translateX(-50%) scale(0.59);
    --hue: 0;
    --height: 37% ;
  }
  10% {
    left: 57%;
    transform: translateX(-50%) scale(0.85);
    --hue: 36;
    --height: 33% ;
  }
  20% {
    left: 55%;
    transform: translateX(-50%) scale(0.58);
    --hue: 72;
    --height: 31% ;
  }
  30% {
    left: 28%;
    transform: translateX(-50%) scale(0.93);
    --hue: 108;
    --height: 34% ;
  }
  40% {
    left: 59%;
    transform: translateX(-50%) scale(0.7);
    --hue: 144;
    --height: 40% ;
  }
  50% {
    left: 43%;
    transform: translateX(-50%) scale(0.72);
    --hue: 180;
    --height: 28% ;
  }
  60% {
    left: 41%;
    transform: translateX(-50%) scale(0.79);
    --hue: 216;
    --height: 33% ;
  }
  70% {
    left: 53%;
    transform: translateX(-50%) scale(0.61);
    --hue: 252;
    --height: 31% ;
  }
  80% {
    left: 62%;
    transform: translateX(-50%) scale(0.59);
    --hue: 288;
    --height: 40% ;
  }
  90% {
    left: 54%;
    transform: translateX(-50%) scale(0.74);
    --hue: 324;
    --height: 29% ;
  }
}
.fireworks:nth-child(3) > .year {
  background-color: hsl(calc(var(--hue) + 240), 100%, 75%);
}
.fireworks:nth-child(3) > .year:nth-child(1) {
  --t:
    translateX(140px)
    translateY(-300px)
    translateZ(130px)
    rotateX(668deg)
    rotateY(2deg)
    rotateZ(680deg)
    scale(0);
}
.fireworks:nth-child(3) > .year:nth-child(2) {
  --t:
    translateX(40px)
    translateY(-300px)
    translateZ(-100px)
    rotateX(492deg)
    rotateY(204deg)
    rotateZ(617deg)
    scale(0);
}
.fireworks:nth-child(3) > .year:nth-child(3) {
  --t:
    translateX(-380px)
    translateY(-280px)
    translateZ(310px)
    rotateX(678deg)
    rotateY(676deg)
    rotateZ(14deg)
    scale(0);
}
.fireworks:nth-child(3) > .year:nth-child(4) {
  --t:
    translateX(210px)
    translateY(-480px)
    translateZ(150px)
    rotateX(444deg)
    rotateY(122deg)
    rotateZ(104deg)
    scale(0);
}
.fireworks:nth-child(3) > .year:nth-child(5) {
  --t:
    translateX(-100px)
    translateY(-410px)
    translateZ(30px)
    rotateX(344deg)
    rotateY(279deg)
    rotateZ(184deg)
    scale(0);
}
.fireworks:nth-child(3) > .year:nth-child(6) {
  --t:
    translateX(220px)
    translateY(-600px)
    translateZ(10px)
    rotateX(54deg)
    rotateY(139deg)
    rotateZ(666deg)
    scale(0);
}
.fireworks:nth-child(3) > .year:nth-child(7) {
  --t:
    translateX(150px)
    translateY(-530px)
    translateZ(-80px)
    rotateX(628deg)
    rotateY(66deg)
    rotateZ(327deg)
    scale(0);
}
.fireworks:nth-child(3) > .year:nth-child(8) {
  --t:
    translateX(350px)
    translateY(-570px)
    translateZ(-300px)
    rotateX(129deg)
    rotateY(567deg)
    rotateZ(380deg)
    scale(0);
}
.fireworks:nth-child(3) > .year:nth-child(9) {
  --t:
    translateX(120px)
    translateY(-550px)
    translateZ(290px)
    rotateX(310deg)
    rotateY(198deg)
    rotateZ(675deg)
    scale(0);
}
.fireworks:nth-child(3) > .year:nth-child(10) {
  --t:
    translateX(-330px)
    translateY(-310px)
    translateZ(440px)
    rotateX(648deg)
    rotateY(655deg)
    rotateZ(657deg)
    scale(0);
}
.fireworks:nth-child(3) > .year:nth-child(11) {
  --t:
    translateX(-80px)
    translateY(-710px)
    translateZ(250px)
    rotateX(59deg)
    rotateY(719deg)
    rotateZ(452deg)
    scale(0);
}
.fireworks:nth-child(3) > .year:nth-child(12) {
  --t:
    translateX(280px)
    translateY(-460px)
    translateZ(-160px)
    rotateX(342deg)
    rotateY(713deg)
    rotateZ(256deg)
    scale(0);
}
.fireworks:nth-child(3) > .year:nth-child(13) {
  --t:
    translateX(-280px)
    translateY(-430px)
    translateZ(380px)
    rotateX(458deg)
    rotateY(384deg)
    rotateZ(576deg)
    scale(0);
}
.fireworks:nth-child(3) > .year:nth-child(14) {
  --t:
    translateX(60px)
    translateY(-350px)
    translateZ(430px)
    rotateX(441deg)
    rotateY(382deg)
    rotateZ(649deg)
    scale(0);
}
.fireworks:nth-child(3) > .year:nth-child(15) {
  --t:
    translateX(-110px)
    translateY(-730px)
    translateZ(340px)
    rotateX(683deg)
    rotateY(706deg)
    rotateZ(177deg)
    scale(0);
}
.fireworks:nth-child(3) > .year:nth-child(16) {
  --t:
    translateX(70px)
    translateY(-550px)
    translateZ(-230px)
    rotateX(456deg)
    rotateY(185deg)
    rotateZ(531deg)
    scale(0);
}
.fireworks:nth-child(3) > .year:nth-child(17) {
  --t:
    translateX(-270px)
    translateY(-570px)
    translateZ(-140px)
    rotateX(311deg)
    rotateY(282deg)
    rotateZ(78deg)
    scale(0);
}
.fireworks:nth-child(3) > .year:nth-child(18) {
  --t:
    translateX(-140px)
    translateY(-500px)
    translateZ(70px)
    rotateX(343deg)
    rotateY(630deg)
    rotateZ(511deg)
    scale(0);
}
.fireworks:nth-child(3) > .year:nth-child(19) {
  --t:
    translateX(260px)
    translateY(-400px)
    translateZ(-70px)
    rotateX(441deg)
    rotateY(712deg)
    rotateZ(403deg)
    scale(0);
}
.fireworks:nth-child(3) > .year:nth-child(20) {
  --t:
    translateX(410px)
    translateY(-510px)
    translateZ(-390px)
    rotateX(105deg)
    rotateY(260deg)
    rotateZ(283deg)
    scale(0);
}
.fireworks:nth-child(3) > .year:nth-child(21) {
  --t:
    translateX(-250px)
    translateY(-500px)
    translateZ(440px)
    rotateX(158deg)
    rotateY(477deg)
    rotateZ(445deg)
    scale(0);
}
.fireworks:nth-child(3) > .year:nth-child(22) {
  --t:
    translateX(-390px)
    translateY(-490px)
    translateZ(-30px)
    rotateX(456deg)
    rotateY(434deg)
    rotateZ(512deg)
    scale(0);
}
.fireworks:nth-child(3) > .year:nth-child(23) {
  --t:
    translateX(-490px)
    translateY(-590px)
    translateZ(-140px)
    rotateX(297deg)
    rotateY(677deg)
    rotateZ(31deg)
    scale(0);
}
.fireworks:nth-child(3) > .year:nth-child(24) {
  --t:
    translateX(-390px)
    translateY(-300px)
    translateZ(410px)
    rotateX(566deg)
    rotateY(517deg)
    rotateZ(60deg)
    scale(0);
}
.fireworks:nth-child(3) > .year:nth-child(25) {
  --t:
    translateX(130px)
    translateY(-660px)
    translateZ(-390px)
    rotateX(653deg)
    rotateY(662deg)
    rotateZ(489deg)
    scale(0);
}
.fireworks:nth-child(3) > .year:nth-child(26) {
  --t:
    translateX(-260px)
    translateY(-390px)
    translateZ(90px)
    rotateX(700deg)
    rotateY(174deg)
    rotateZ(25deg)
    scale(0);
}
.fireworks:nth-child(3) > .year:nth-child(27) {
  --t:
    translateX(-210px)
    translateY(-550px)
    translateZ(-480px)
    rotateX(384deg)
    rotateY(655deg)
    rotateZ(169deg)
    scale(0);
}
.fireworks:nth-child(3) > .year:nth-child(28) {
  --t:
    translateX(470px)
    translateY(-670px)
    translateZ(-470px)
    rotateX(701deg)
    rotateY(147deg)
    rotateZ(284deg)
    scale(0);
}
.fireworks:nth-child(3) > .year:nth-child(29) {
  --t:
    translateX(260px)
    translateY(-350px)
    translateZ(-170px)
    rotateX(557deg)
    rotateY(114deg)
    rotateZ(281deg)
    scale(0);
}
.fireworks:nth-child(3) > .year:nth-child(30) {
  --t:
    translateX(-410px)
    translateY(-270px)
    translateZ(110px)
    rotateX(169deg)
    rotateY(236deg)
    rotateZ(68deg)
    scale(0);
}
.fireworks:nth-child(3) > .year:nth-child(31) {
  --t:
    translateX(290px)
    translateY(-490px)
    translateZ(80px)
    rotateX(604deg)
    rotateY(706deg)
    rotateZ(704deg)
    scale(0);
}
.fireworks:nth-child(3) > .year:nth-child(32) {
  --t:
    translateX(110px)
    translateY(-530px)
    translateZ(80px)
    rotateX(594deg)
    rotateY(460deg)
    rotateZ(260deg)
    scale(0);
}
.fireworks:nth-child(3) > .year:nth-child(33) {
  --t:
    translateX(370px)
    translateY(-400px)
    translateZ(300px)
    rotateX(405deg)
    rotateY(385deg)
    rotateZ(637deg)
    scale(0);
}
.fireworks:nth-child(3) > .year:nth-child(34) {
  --t:
    translateX(390px)
    translateY(-430px)
    translateZ(-350px)
    rotateX(579deg)
    rotateY(330deg)
    rotateZ(563deg)
    scale(0);
}
.fireworks:nth-child(3) > .year:nth-child(35) {
  --t:
    translateX(-460px)
    translateY(-650px)
    translateZ(390px)
    rotateX(350deg)
    rotateY(378deg)
    rotateZ(169deg)
    scale(0);
}
.fireworks:nth-child(3) > .year:nth-child(36) {
  --t:
    translateX(110px)
    translateY(-660px)
    translateZ(420px)
    rotateX(236deg)
    rotateY(380deg)
    rotateZ(398deg)
    scale(0);
}
.fireworks:nth-child(3) > .year:nth-child(37) {
  --t:
    translateX(480px)
    translateY(-400px)
    translateZ(120px)
    rotateX(41deg)
    rotateY(295deg)
    rotateZ(483deg)
    scale(0);
}
.fireworks:nth-child(3) > .year:nth-child(38) {
  --t:
    translateX(80px)
    translateY(-450px)
    translateZ(-160px)
    rotateX(495deg)
    rotateY(546deg)
    rotateZ(3deg)
    scale(0);
}
.fireworks:nth-child(3) > .year:nth-child(39) {
  --t:
    translateX(-250px)
    translateY(-580px)
    translateZ(-30px)
    rotateX(29deg)
    rotateY(44deg)
    rotateZ(567deg)
    scale(0);
}
.fireworks:nth-child(3) > .year:nth-child(40) {
  --t:
    translateX(440px)
    translateY(-260px)
    translateZ(-330px)
    rotateX(666deg)
    rotateY(426deg)
    rotateZ(434deg)
    scale(0);
}
.fireworks:nth-child(3) > .year:nth-child(41) {
  --t:
    translateX(330px)
    translateY(-280px)
    translateZ(-30px)
    rotateX(365deg)
    rotateY(401deg)
    rotateZ(25deg)
    scale(0);
}
.fireworks:nth-child(3) > .year:nth-child(42) {
  --t:
    translateX(-10px)
    translateY(-690px)
    translateZ(50px)
    rotateX(140deg)
    rotateY(513deg)
    rotateZ(615deg)
    scale(0);
}
.fireworks:nth-child(3) > .year:nth-child(43) {
  --t:
    translateX(-260px)
    translateY(-570px)
    translateZ(230px)
    rotateX(458deg)
    rotateY(700deg)
    rotateZ(145deg)
    scale(0);
}
.fireworks:nth-child(3) > .year:nth-child(44) {
  --t:
    translateX(210px)
    translateY(-610px)
    translateZ(120px)
    rotateX(154deg)
    rotateY(671deg)
    rotateZ(330deg)
    scale(0);
}
.fireworks:nth-child(3) > .year:nth-child(45) {
  --t:
    translateX(-10px)
    translateY(-530px)
    translateZ(-110px)
    rotateX(12deg)
    rotateY(85deg)
    rotateZ(193deg)
    scale(0);
}
.fireworks:nth-child(3) > .year:nth-child(46) {
  --t:
    translateX(430px)
    translateY(-580px)
    translateZ(-170px)
    rotateX(26deg)
    rotateY(28deg)
    rotateZ(584deg)
    scale(0);
}
.fireworks:nth-child(3) > .year:nth-child(47) {
  --t:
    translateX(330px)
    translateY(-530px)
    translateZ(-80px)
    rotateX(319deg)
    rotateY(430deg)
    rotateZ(696deg)
    scale(0);
}
.fireworks:nth-child(3) > .year:nth-child(48) {
  --t:
    translateX(380px)
    translateY(-480px)
    translateZ(450px)
    rotateX(327deg)
    rotateY(154deg)
    rotateZ(307deg)
    scale(0);
}
.fireworks:nth-child(3) > .year:nth-child(49) {
  --t:
    translateX(470px)
    translateY(-610px)
    translateZ(250px)
    rotateX(632deg)
    rotateY(518deg)
    rotateZ(159deg)
    scale(0);
}
.fireworks:nth-child(3) > .year:nth-child(50) {
  --t:
    translateX(-430px)
    translateY(-450px)
    translateZ(-110px)
    rotateX(667deg)
    rotateY(687deg)
    rotateZ(679deg)
    scale(0);
}
.fireworks:nth-child(3) > .year:nth-child(51) {
  --t:
    translateX(-410px)
    translateY(-460px)
    translateZ(-200px)
    rotateX(224deg)
    rotateY(303deg)
    rotateZ(14deg)
    scale(0);
}
.fireworks:nth-child(3) > .year:nth-child(52) {
  --t:
    translateX(160px)
    translateY(-540px)
    translateZ(-20px)
    rotateX(591deg)
    rotateY(67deg)
    rotateZ(582deg)
    scale(0);
}
.fireworks:nth-child(3) > .year:nth-child(53) {
  --t:
    translateX(-180px)
    translateY(-390px)
    translateZ(110px)
    rotateX(311deg)
    rotateY(598deg)
    rotateZ(410deg)
    scale(0);
}
.fireworks:nth-child(3) > .year:nth-child(54) {
  --t:
    translateX(-220px)
    translateY(-590px)
    translateZ(450px)
    rotateX(72deg)
    rotateY(70deg)
    rotateZ(281deg)
    scale(0);
}
.fireworks:nth-child(3) > .year:nth-child(55) {
  --t:
    translateX(320px)
    translateY(-610px)
    translateZ(470px)
    rotateX(87deg)
    rotateY(55deg)
    rotateZ(552deg)
    scale(0);
}
.fireworks:nth-child(3) > .year:nth-child(56) {
  --t:
    translateX(-370px)
    translateY(-270px)
    translateZ(370px)
    rotateX(92deg)
    rotateY(498deg)
    rotateZ(580deg)
    scale(0);
}
.fireworks:nth-child(3) > .year:nth-child(57) {
  --t:
    translateX(190px)
    translateY(-740px)
    translateZ(150px)
    rotateX(54deg)
    rotateY(720deg)
    rotateZ(536deg)
    scale(0);
}
.fireworks:nth-child(3) > .year:nth-child(58) {
  --t:
    translateX(490px)
    translateY(-600px)
    translateZ(70px)
    rotateX(70deg)
    rotateY(414deg)
    rotateZ(368deg)
    scale(0);
}
.fireworks:nth-child(3) > .year:nth-child(59) {
  --t:
    translateX(210px)
    translateY(-720px)
    translateZ(120px)
    rotateX(337deg)
    rotateY(186deg)
    rotateZ(488deg)
    scale(0);
}
.fireworks:nth-child(3) > .year:nth-child(60) {
  --t:
    translateX(-300px)
    translateY(-480px)
    translateZ(290px)
    rotateX(271deg)
    rotateY(7deg)
    rotateZ(693deg)
    scale(0);
}
.fireworks:nth-child(3) > .year:nth-child(61) {
  --t:
    translateX(190px)
    translateY(-730px)
    translateZ(-420px)
    rotateX(58deg)
    rotateY(165deg)
    rotateZ(273deg)
    scale(0);
}
.fireworks:nth-child(3) > .year:nth-child(62) {
  --t:
    translateX(90px)
    translateY(-310px)
    translateZ(150px)
    rotateX(188deg)
    rotateY(81deg)
    rotateZ(498deg)
    scale(0);
}
.fireworks:nth-child(3) > .year:nth-child(63) {
  --t:
    translateX(220px)
    translateY(-700px)
    translateZ(-190px)
    rotateX(553deg)
    rotateY(271deg)
    rotateZ(330deg)
    scale(0);
}
.fireworks:nth-child(3) > .year:nth-child(64) {
  --t:
    translateX(-20px)
    translateY(-710px)
    translateZ(260px)
    rotateX(404deg)
    rotateY(415deg)
    rotateZ(313deg)
    scale(0);
}
.fireworks:nth-child(3) > .year:nth-child(65) {
  --t:
    translateX(240px)
    translateY(-640px)
    translateZ(-160px)
    rotateX(286deg)
    rotateY(564deg)
    rotateZ(221deg)
    scale(0);
}
.fireworks:nth-child(3) > .year:nth-child(66) {
  --t:
    translateX(110px)
    translateY(-570px)
    translateZ(-270px)
    rotateX(343deg)
    rotateY(648deg)
    rotateZ(445deg)
    scale(0);
}
.fireworks:nth-child(3) > .year:nth-child(67) {
  --t:
    translateX(270px)
    translateY(-320px)
    translateZ(-360px)
    rotateX(498deg)
    rotateY(150deg)
    rotateZ(673deg)
    scale(0);
}
.fireworks:nth-child(3) > .year:nth-child(68) {
  --t:
    translateX(-470px)
    translateY(-270px)
    translateZ(100px)
    rotateX(136deg)
    rotateY(299deg)
    rotateZ(607deg)
    scale(0);
}
.fireworks:nth-child(3) > .year:nth-child(69) {
  --t:
    translateX(20px)
    translateY(-350px)
    translateZ(190px)
    rotateX(394deg)
    rotateY(218deg)
    rotateZ(79deg)
    scale(0);
}
.fireworks:nth-child(3) > .year:nth-child(70) {
  --t:
    translateX(320px)
    translateY(-410px)
    translateZ(-470px)
    rotateX(650deg)
    rotateY(393deg)
    rotateZ(154deg)
    scale(0);
}
.fireworks:nth-child(3) > .year:nth-child(71) {
  --t:
    translateX(310px)
    translateY(-360px)
    translateZ(480px)
    rotateX(492deg)
    rotateY(694deg)
    rotateZ(495deg)
    scale(0);
}
.fireworks:nth-child(3) > .year:nth-child(72) {
  --t:
    translateX(350px)
    translateY(-640px)
    translateZ(450px)
    rotateX(387deg)
    rotateY(301deg)
    rotateZ(5deg)
    scale(0);
}
.fireworks:nth-child(3) > .year:nth-child(73) {
  --t:
    translateX(-340px)
    translateY(-720px)
    translateZ(-380px)
    rotateX(507deg)
    rotateY(214deg)
    rotateZ(700deg)
    scale(0);
}
.fireworks > .year {
  position: absolute;
  width: 100%;
  height: 100%;
  background-color: #fff;
  -webkit-animation: yearTransform 5s infinite ease-out;
          animation: yearTransform 5s infinite ease-out;
  -webkit-animation-delay: inherit;
          animation-delay: inherit;
}
@-webkit-keyframes yearTransform {
  0% {
    transform: scale(0);
  }
  25% {
    transform: none;
  }
  100% {
    transform: var(--t);
  }
}
@keyframes yearTransform {
  0% {
    transform: scale(0);
  }
  25% {
    transform: none;
  }
  100% {
    transform: var(--t);
  }
}

.city {
  position: fixed;
  bottom: 0;
  width: 100%;
  height: 30vh;
  background-repeat: no-repeat;
  background-size: 0 0, 40px 26%, 40px 91%, 60px 89%, 40px 45%, 60px 82%, 30px 95%, 50px 35%, 50px 95%, 50px 50%, 20px 41%, 60px 63%, 40px 42%, 20px 67%, 20px 24%, 60px 68%, 60px 68%, 60px 79%, 50px 12%, 20px 34%, 30px 66%, 60px 40%, 20px 50%, 60px 20%, 50px 79%, 50px 28%, 40px 68%, 30px 41%, 40px 48%, 50px 76%, 20px 16%, 30px 66%, 20px 75%, 40px 38%, 60px 81%, 40px 63%, 30px 61%, 20px 48%, 40px 93%, 20px 25%, 40px 28%, 60px 17%, 40px 27%, 50px 86%, 50px 65%, 50px 98%, 50px 73%, 40px 40%, 50px 34%;
  background-position: center, 0px bottom, 40px bottom, 80px bottom, 140px bottom, 180px bottom, 240px bottom, 270px bottom, 320px bottom, 370px bottom, 420px bottom, 440px bottom, 500px bottom, 540px bottom, 560px bottom, 580px bottom, 640px bottom, 700px bottom, 760px bottom, 810px bottom, 830px bottom, 860px bottom, 920px bottom, 940px bottom, 1000px bottom, 1050px bottom, 1100px bottom, 1140px bottom, 1170px bottom, 1210px bottom, 1260px bottom, 1280px bottom, 1310px bottom, 1330px bottom, 1370px bottom, 1430px bottom, 1470px bottom, 1500px bottom, 1520px bottom, 1560px bottom, 1580px bottom, 1620px bottom, 1680px bottom, 1720px bottom, 1770px bottom, 1820px bottom, 1870px bottom, 1920px bottom, 1960px bottom;
  background-image: linear-gradient(#000, #102), linear-gradient(#000, #102), linear-gradient(#000, #102), linear-gradient(#000, #102), linear-gradient(#000, #102), linear-gradient(#000, #102), linear-gradient(#000, #102), linear-gradient(#000, #102), linear-gradient(#000, #102), linear-gradient(#000, #102), linear-gradient(#000, #102), linear-gradient(#000, #102), linear-gradient(#000, #102), linear-gradient(#000, #102), linear-gradient(#000, #102), linear-gradient(#000, #102), linear-gradient(#000, #102), linear-gradient(#000, #102), linear-gradient(#000, #102), linear-gradient(#000, #102), linear-gradient(#000, #102), linear-gradient(#000, #102), linear-gradient(#000, #102), linear-gradient(#000, #102), linear-gradient(#000, #102), linear-gradient(#000, #102), linear-gradient(#000, #102), linear-gradient(#000, #102), linear-gradient(#000, #102), linear-gradient(#000, #102), linear-gradient(#000, #102), linear-gradient(#000, #102), linear-gradient(#000, #102), linear-gradient(#000, #102), linear-gradient(#000, #102), linear-gradient(#000, #102), linear-gradient(#000, #102), linear-gradient(#000, #102), linear-gradient(#000, #102), linear-gradient(#000, #102), linear-gradient(#000, #102), linear-gradient(#000, #102), linear-gradient(#000, #102), linear-gradient(#000, #102), linear-gradient(#000, #102), linear-gradient(#000, #102), linear-gradient(#000, #102), linear-gradient(#000, #102), linear-gradient(#000, #102);
}