Introduction to the blog

Snowfall with Pure CSS : Playing around CSS is fun, with the help of CSS many things can be done using transition animation and a lot more. There are more property of CSS to work with

A site’s visual style and design are directed by CSS or Cascading Style Sheets. These are records that shape a site page’s HTML markup, giving internet browsers guidelines on the most proficient method to show the pages that outcome from that markup. CSS handles a page’s format, just as shading, foundation pictures, typography, thus considerably more.

On the off chance that you take a gander at a CSS record, you will see that, similar to any markup or coding language, these documents have a particular punctuation to them. Each template is comprised of various CSS rules. These standards, when taken in full, are what styles the site.

At the point when you compose CSS properties, you can’t just make them up as you see fit. For example, “shading” is a real CSS property, so you can utilize it. This property is the thing that decides the content shade of a component. In the event that you attempted to utilize “text-shading” or “textual style tone” as CSS properties, these would come up short since they are not genuine pieces of the CSS language.

So, in this blog you will know how to create snowfall effect with Pure CSS no jQuery and JavaScript is required:

Step 1 : HTML

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Snofall Effect</title>

</head>
<body>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
<div class="snowdot"></div>
</body>
</html>

 

Step 2 : CSS

body {
  height: 100vh;
  background: url(./snow-bg.jpg);
  overflow: hidden;
  filter: drop-shadow(0 0 10px white);
}

.snowdot {
  position: absolute;
  width: 10px;
  height: 10px;
  background: white;
  border-radius: 50%;
}
.snowdot:nth-child(1) {
  opacity: 0.6889;
  transform: translate(30.7543vw, -10px) scale(0.618);
  animation: fall-1 16s -6s linear infinite;
}
@keyframes fall-1 {
  36.024% {
    transform: translate(37.3153vw, 36.024vh) scale(0.618);
  }
  to {
    transform: translate(34.0348vw, 100vh) scale(0.618);
  }
}
.snowdot:nth-child(2) {
  opacity: 0.5463;
  transform: translate(13.3186vw, -10px) scale(0.1242);
  animation: fall-2 13s -21s linear infinite;
}
@keyframes fall-2 {
  55.682% {
    transform: translate(16.3764vw, 55.682vh) scale(0.1242);
  }
  to {
    transform: translate(14.8475vw, 100vh) scale(0.1242);
  }
}
.snowdot:nth-child(3) {
  opacity: 0.7949;
  transform: translate(35.7772vw, -10px) scale(0.3812);
  animation: fall-3 27s -14s linear infinite;
}
@keyframes fall-3 {
  43.662% {
    transform: translate(34.09vw, 43.662vh) scale(0.3812);
  }
  to {
    transform: translate(34.9336vw, 100vh) scale(0.3812);
  }
}
.snowdot:nth-child(4) {
  opacity: 0.6365;
  transform: translate(22.1872vw, -10px) scale(0.3654);
  animation: fall-4 18s -23s linear infinite;
}
@keyframes fall-4 {
  36.92% {
    transform: translate(16.4547vw, 36.92vh) scale(0.3654);
  }
  to {
    transform: translate(19.32095vw, 100vh) scale(0.3654);
  }
}
.snowdot:nth-child(5) {
  opacity: 0.6352;
  transform: translate(63.1565vw, -10px) scale(0.083);
  animation: fall-5 25s -14s linear infinite;
}
@keyframes fall-5 {
  68.916% {
    transform: translate(56.3248vw, 68.916vh) scale(0.083);
  }
  to {
    transform: translate(59.74065vw, 100vh) scale(0.083);
  }
}
.snowdot:nth-child(6) {
  opacity: 0.8465;
  transform: translate(2.2081vw, -10px) scale(0.6326);
  animation: fall-6 25s -18s linear infinite;
}
@keyframes fall-6 {
  67.203% {
    transform: translate(0.9089vw, 67.203vh) scale(0.6326);
  }
  to {
    transform: translate(1.5585vw, 100vh) scale(0.6326);
  }
}
.snowdot:nth-child(7) {
  opacity: 0.0499;
  transform: translate(25.1378vw, -10px) scale(0.4473);
  animation: fall-7 13s -24s linear infinite;
}
@keyframes fall-7 {
  61.55% {
    transform: translate(23.4783vw, 61.55vh) scale(0.4473);
  }
  to {
    transform: translate(24.30805vw, 100vh) scale(0.4473);
  }
}
.snowdot:nth-child(8) {
  opacity: 0.1631;
  transform: translate(87.5335vw, -10px) scale(0.429);
  animation: fall-8 26s -3s linear infinite;
}
@keyframes fall-8 {
  55.725% {
    transform: translate(82.4vw, 55.725vh) scale(0.429);
  }
  to {
    transform: translate(84.96675vw, 100vh) scale(0.429);
  }
}
.snowdot:nth-child(9) {
  opacity: 0.975;
  transform: translate(42.4408vw, -10px) scale(0.9024);
  animation: fall-9 29s -22s linear infinite;
}
@keyframes fall-9 {
  45.862% {
    transform: translate(41.838vw, 45.862vh) scale(0.9024);
  }
  to {
    transform: translate(42.1394vw, 100vh) scale(0.9024);
  }
}
.snowdot:nth-child(10) {
  opacity: 0.3361;
  transform: translate(78.7775vw, -10px) scale(0.1956);
  animation: fall-10 10s -23s linear infinite;
}
@keyframes fall-10 {
  37.599% {
    transform: translate(73.0556vw, 37.599vh) scale(0.1956);
  }
  to {
    transform: translate(75.91655vw, 100vh) scale(0.1956);
  }
}
.snowdot:nth-child(11) {
  opacity: 0.785;
  transform: translate(43.0434vw, -10px) scale(0.2422);
  animation: fall-11 27s -30s linear infinite;
}
@keyframes fall-11 {
  72.141% {
    transform: translate(33.662vw, 72.141vh) scale(0.2422);
  }
  to {
    transform: translate(38.3527vw, 100vh) scale(0.2422);
  }
}
.snowdot:nth-child(12) {
  opacity: 0.2391;
  transform: translate(17.75vw, -10px) scale(0.6132);
  animation: fall-12 15s -4s linear infinite;
}
@keyframes fall-12 {
  30.034% {
    transform: translate(19.3818vw, 30.034vh) scale(0.6132);
  }
  to {
    transform: translate(18.5659vw, 100vh) scale(0.6132);
  }
}
.snowdot:nth-child(13) {
  opacity: 0.9322;
  transform: translate(83.6105vw, -10px) scale(0.5942);
  animation: fall-13 24s -23s linear infinite;
}
@keyframes fall-13 {
  79.063% {
    transform: translate(78.7181vw, 79.063vh) scale(0.5942);
  }
  to {
    transform: translate(81.1643vw, 100vh) scale(0.5942);
  }
}
.snowdot:nth-child(14) {
  opacity: 0.4371;
  transform: translate(48.5671vw, -10px) scale(0.4509);
  animation: fall-14 24s -2s linear infinite;
}
@keyframes fall-14 {
  69.307% {
    transform: translate(39.5419vw, 69.307vh) scale(0.4509);
  }
  to {
    transform: translate(44.0545vw, 100vh) scale(0.4509);
  }
}
.snowdot:nth-child(15) {
  opacity: 0.4472;
  transform: translate(37.7903vw, -10px) scale(0.9735);
  animation: fall-15 19s -19s linear infinite;
}
@keyframes fall-15 {
  31.872% {
    transform: translate(35.3002vw, 31.872vh) scale(0.9735);
  }
  to {
    transform: translate(36.54525vw, 100vh) scale(0.9735);
  }
}
.snowdot:nth-child(16) {
  opacity: 0.799;
  transform: translate(53.5716vw, -10px) scale(0.5875);
  animation: fall-16 10s -4s linear infinite;
}
@keyframes fall-16 {
  58.149% {
    transform: translate(44.8808vw, 58.149vh) scale(0.5875);
  }
  to {
    transform: translate(49.2262vw, 100vh) scale(0.5875);
  }
}
.snowdot:nth-child(17) {
  opacity: 0.9686;
  transform: translate(60.3792vw, -10px) scale(0.1798);
  animation: fall-17 27s -20s linear infinite;
}
@keyframes fall-17 {
  61.309% {
    transform: translate(54.0186vw, 61.309vh) scale(0.1798);
  }
  to {
    transform: translate(57.1989vw, 100vh) scale(0.1798);
  }
}
.snowdot:nth-child(18) {
  opacity: 0.8476;
  transform: translate(93.5252vw, -10px) scale(0.077);
  animation: fall-18 16s -22s linear infinite;
}
@keyframes fall-18 {
  51.812% {
    transform: translate(90.0046vw, 51.812vh) scale(0.077);
  }
  to {
    transform: translate(91.7649vw, 100vh) scale(0.077);
  }
}
.snowdot:nth-child(19) {
  opacity: 0.216;
  transform: translate(23.3224vw, -10px) scale(0.318);
  animation: fall-19 25s -21s linear infinite;
}
@keyframes fall-19 {
  74.711% {
    transform: translate(18.3764vw, 74.711vh) scale(0.318);
  }
  to {
    transform: translate(20.8494vw, 100vh) scale(0.318);
  }
}
.snowdot:nth-child(20) {
  opacity: 0.81;
  transform: translate(4.8588vw, -10px) scale(0.1435);
  animation: fall-20 22s -23s linear infinite;
}
@keyframes fall-20 {
  52.502% {
    transform: translate(-0.999vw, 52.502vh) scale(0.1435);
  }
  to {
    transform: translate(1.9299vw, 100vh) scale(0.1435);
  }
}
.snowdot:nth-child(21) {
  opacity: 0.5251;
  transform: translate(73.9603vw, -10px) scale(0.3108);
  animation: fall-21 30s -25s linear infinite;
}
@keyframes fall-21 {
  54.262% {
    transform: translate(68.1337vw, 54.262vh) scale(0.3108);
  }
  to {
    transform: translate(71.047vw, 100vh) scale(0.3108);
  }
}
.snowdot:nth-child(22) {
  opacity: 0.9928;
  transform: translate(4.6531vw, -10px) scale(0.2918);
  animation: fall-22 28s -29s linear infinite;
}
@keyframes fall-22 {
  75.167% {
    transform: translate(10.4631vw, 75.167vh) scale(0.2918);
  }
  to {
    transform: translate(7.5581vw, 100vh) scale(0.2918);
  }
}
.snowdot:nth-child(23) {
  opacity: 0.879;
  transform: translate(15.8708vw, -10px) scale(0.5441);
  animation: fall-23 17s -21s linear infinite;
}
@keyframes fall-23 {
  49.929% {
    transform: translate(12.7058vw, 49.929vh) scale(0.5441);
  }
  to {
    transform: translate(14.2883vw, 100vh) scale(0.5441);
  }
}
.snowdot:nth-child(24) {
  opacity: 0.9969;
  transform: translate(45.2942vw, -10px) scale(0.6611);
  animation: fall-24 10s -23s linear infinite;
}
@keyframes fall-24 {
  40.841% {
    transform: translate(55.1631vw, 40.841vh) scale(0.6611);
  }
  to {
    transform: translate(50.22865vw, 100vh) scale(0.6611);
  }
}
.snowdot:nth-child(25) {
  opacity: 0.2059;
  transform: translate(34.2078vw, -10px) scale(0.8644);
  animation: fall-25 13s -1s linear infinite;
}
@keyframes fall-25 {
  75.502% {
    transform: translate(34.0938vw, 75.502vh) scale(0.8644);
  }
  to {
    transform: translate(34.1508vw, 100vh) scale(0.8644);
  }
}
.snowdot:nth-child(26) {
  opacity: 0.5561;
  transform: translate(84.2094vw, -10px) scale(0.2961);
  animation: fall-26 12s -8s linear infinite;
}
@keyframes fall-26 {
  74.147% {
    transform: translate(89.1048vw, 74.147vh) scale(0.2961);
  }
  to {
    transform: translate(86.6571vw, 100vh) scale(0.2961);
  }
}
.snowdot:nth-child(27) {
  opacity: 0.4053;
  transform: translate(98.0698vw, -10px) scale(0.3986);
  animation: fall-27 27s -14s linear infinite;
}
@keyframes fall-27 {
  60.217% {
    transform: translate(94.1621vw, 60.217vh) scale(0.3986);
  }
  to {
    transform: translate(96.11595vw, 100vh) scale(0.3986);
  }
}
.snowdot:nth-child(28) {
  opacity: 0.5631;
  transform: translate(27.146vw, -10px) scale(0.8285);
  animation: fall-28 19s -13s linear infinite;
}
@keyframes fall-28 {
  58.305% {
    transform: translate(33.2433vw, 58.305vh) scale(0.8285);
  }
  to {
    transform: translate(30.19465vw, 100vh) scale(0.8285);
  }
}
.snowdot:nth-child(29) {
  opacity: 0.7025;
  transform: translate(38.4808vw, -10px) scale(0.2398);
  animation: fall-29 20s -1s linear infinite;
}
@keyframes fall-29 {
  59.4% {
    transform: translate(48.1908vw, 59.4vh) scale(0.2398);
  }
  to {
    transform: translate(43.3358vw, 100vh) scale(0.2398);
  }
}
.snowdot:nth-child(30) {
  opacity: 0.735;
  transform: translate(65.1571vw, -10px) scale(0.1493);
  animation: fall-30 30s -17s linear infinite;
}
@keyframes fall-30 {
  42.633% {
    transform: translate(68.72vw, 42.633vh) scale(0.1493);
  }
  to {
    transform: translate(66.93855vw, 100vh) scale(0.1493);
  }
}
.snowdot:nth-child(31) {
  opacity: 0.0481;
  transform: translate(12.7454vw, -10px) scale(0.8663);
  animation: fall-31 18s -9s linear infinite;
}
@keyframes fall-31 {
  73.392% {
    transform: translate(5.4269vw, 73.392vh) scale(0.8663);
  }
  to {
    transform: translate(9.08615vw, 100vh) scale(0.8663);
  }
}
.snowdot:nth-child(32) {
  opacity: 0.3114;
  transform: translate(61.544vw, -10px) scale(0.6776);
  animation: fall-32 13s -17s linear infinite;
}
@keyframes fall-32 {
  79.748% {
    transform: translate(68.6762vw, 79.748vh) scale(0.6776);
  }
  to {
    transform: translate(65.1101vw, 100vh) scale(0.6776);
  }
}
.snowdot:nth-child(33) {
  opacity: 0.8053;
  transform: translate(42.1033vw, -10px) scale(0.0871);
  animation: fall-33 22s -6s linear infinite;
}
@keyframes fall-33 {
  52.599% {
    transform: translate(41.467vw, 52.599vh) scale(0.0871);
  }
  to {
    transform: translate(41.78515vw, 100vh) scale(0.0871);
  }
}
.snowdot:nth-child(34) {
  opacity: 0.5135;
  transform: translate(10.2237vw, -10px) scale(0.8038);
  animation: fall-34 24s -6s linear infinite;
}
@keyframes fall-34 {
  39.401% {
    transform: translate(3.0768vw, 39.401vh) scale(0.8038);
  }
  to {
    transform: translate(6.65025vw, 100vh) scale(0.8038);
  }
}
.snowdot:nth-child(35) {
  opacity: 0.2478;
  transform: translate(87.3627vw, -10px) scale(0.4996);
  animation: fall-35 19s -20s linear infinite;
}
@keyframes fall-35 {
  43.153% {
    transform: translate(88.5063vw, 43.153vh) scale(0.4996);
  }
  to {
    transform: translate(87.9345vw, 100vh) scale(0.4996);
  }
}
.snowdot:nth-child(36) {
  opacity: 0.0403;
  transform: translate(99.0492vw, -10px) scale(0.8184);
  animation: fall-36 11s -8s linear infinite;
}
@keyframes fall-36 {
  70.744% {
    transform: translate(101.2317vw, 70.744vh) scale(0.8184);
  }
  to {
    transform: translate(100.14045vw, 100vh) scale(0.8184);
  }
}
.snowdot:nth-child(37) {
  opacity: 0.3355;
  transform: translate(36.4019vw, -10px) scale(0.6828);
  animation: fall-37 15s -7s linear infinite;
}
@keyframes fall-37 {
  35.065% {
    transform: translate(37.4162vw, 35.065vh) scale(0.6828);
  }
  to {
    transform: translate(36.90905vw, 100vh) scale(0.6828);
  }
}
.snowdot:nth-child(38) {
  opacity: 0.9094;
  transform: translate(68.5879vw, -10px) scale(0.2917);
  animation: fall-38 13s -14s linear infinite;
}
@keyframes fall-38 {
  51.32% {
    transform: translate(66.9977vw, 51.32vh) scale(0.2917);
  }
  to {
    transform: translate(67.7928vw, 100vh) scale(0.2917);
  }
}
.snowdot:nth-child(39) {
  opacity: 0.0857;
  transform: translate(78.1739vw, -10px) scale(0.9082);
  animation: fall-39 16s -3s linear infinite;
}
@keyframes fall-39 {
  43.734% {
    transform: translate(74.8314vw, 43.734vh) scale(0.9082);
  }
  to {
    transform: translate(76.50265vw, 100vh) scale(0.9082);
  }
}
.snowdot:nth-child(40) {
  opacity: 0.2228;
  transform: translate(56.7612vw, -10px) scale(0.5203);
  animation: fall-40 13s -17s linear infinite;
}
@keyframes fall-40 {
  76.444% {
    transform: translate(62.7995vw, 76.444vh) scale(0.5203);
  }
  to {
    transform: translate(59.78035vw, 100vh) scale(0.5203);
  }
}
.snowdot:nth-child(41) {
  opacity: 0.3379;
  transform: translate(7.4798vw, -10px) scale(0.1121);
  animation: fall-41 26s -28s linear infinite;
}
@keyframes fall-41 {
  59.889% {
    transform: translate(6.6573vw, 59.889vh) scale(0.1121);
  }
  to {
    transform: translate(7.06855vw, 100vh) scale(0.1121);
  }
}
.snowdot:nth-child(42) {
  opacity: 0.478;
  transform: translate(0.3175vw, -10px) scale(0.8465);
  animation: fall-42 20s -30s linear infinite;
}
@keyframes fall-42 {
  54.988% {
    transform: translate(4.5026vw, 54.988vh) scale(0.8465);
  }
  to {
    transform: translate(2.41005vw, 100vh) scale(0.8465);
  }
}
.snowdot:nth-child(43) {
  opacity: 0.4541;
  transform: translate(38.1393vw, -10px) scale(0.2143);
  animation: fall-43 18s -3s linear infinite;
}
@keyframes fall-43 {
  50.795% {
    transform: translate(40.2192vw, 50.795vh) scale(0.2143);
  }
  to {
    transform: translate(39.17925vw, 100vh) scale(0.2143);
  }
}
.snowdot:nth-child(44) {
  opacity: 0.4751;
  transform: translate(72.9946vw, -10px) scale(0.7616);
  animation: fall-44 23s -23s linear infinite;
}
@keyframes fall-44 {
  41.196% {
    transform: translate(68.3354vw, 41.196vh) scale(0.7616);
  }
  to {
    transform: translate(70.665vw, 100vh) scale(0.7616);
  }
}
.snowdot:nth-child(45) {
  opacity: 0.9259;
  transform: translate(33.1852vw, -10px) scale(0.7521);
  animation: fall-45 14s -18s linear infinite;
}
@keyframes fall-45 {
  57.03% {
    transform: translate(41.3935vw, 57.03vh) scale(0.7521);
  }
  to {
    transform: translate(37.28935vw, 100vh) scale(0.7521);
  }
}
.snowdot:nth-child(46) {
  opacity: 0.3197;
  transform: translate(57.6235vw, -10px) scale(0.5397);
  animation: fall-46 21s -26s linear infinite;
}
@keyframes fall-46 {
  72.531% {
    transform: translate(65.5051vw, 72.531vh) scale(0.5397);
  }
  to {
    transform: translate(61.5643vw, 100vh) scale(0.5397);
  }
}
.snowdot:nth-child(47) {
  opacity: 0.2397;
  transform: translate(51.337vw, -10px) scale(0.6894);
  animation: fall-47 19s -19s linear infinite;
}
@keyframes fall-47 {
  79.863% {
    transform: translate(53.4694vw, 79.863vh) scale(0.6894);
  }
  to {
    transform: translate(52.4032vw, 100vh) scale(0.6894);
  }
}
.snowdot:nth-child(48) {
  opacity: 0.4152;
  transform: translate(75.2991vw, -10px) scale(0.6796);
  animation: fall-48 12s -30s linear infinite;
}
@keyframes fall-48 {
  56.281% {
    transform: translate(70.287vw, 56.281vh) scale(0.6796);
  }
  to {
    transform: translate(72.79305vw, 100vh) scale(0.6796);
  }
}
.snowdot:nth-child(49) {
  opacity: 0.0176;
  transform: translate(89.1994vw, -10px) scale(0.1318);
  animation: fall-49 27s -20s linear infinite;
}
@keyframes fall-49 {
  70.243% {
    transform: translate(93.7676vw, 70.243vh) scale(0.1318);
  }
  to {
    transform: translate(91.4835vw, 100vh) scale(0.1318);
  }
}
.snowdot:nth-child(50) {
  opacity: 0.1704;
  transform: translate(58.6467vw, -10px) scale(0.7875);
  animation: fall-50 11s -27s linear infinite;
}
@keyframes fall-50 {
  47.829% {
    transform: translate(68.1382vw, 47.829vh) scale(0.7875);
  }
  to {
    transform: translate(63.39245vw, 100vh) scale(0.7875);
  }
}
.snowdot:nth-child(51) {
  opacity: 0.7727;
  transform: translate(25.188vw, -10px) scale(0.6132);
  animation: fall-51 24s -22s linear infinite;
}
@keyframes fall-51 {
  63.256% {
    transform: translate(33.4275vw, 63.256vh) scale(0.6132);
  }
  to {
    transform: translate(29.30775vw, 100vh) scale(0.6132);
  }
}
.snowdot:nth-child(52) {
  opacity: 0.5272;
  transform: translate(34.4986vw, -10px) scale(0.9318);
  animation: fall-52 11s -13s linear infinite;
}
@keyframes fall-52 {
  55.245% {
    transform: translate(29.7725vw, 55.245vh) scale(0.9318);
  }
  to {
    transform: translate(32.13555vw, 100vh) scale(0.9318);
  }
}
.snowdot:nth-child(53) {
  opacity: 0.2244;
  transform: translate(54.4019vw, -10px) scale(0.3568);
  animation: fall-53 24s -7s linear infinite;
}
@keyframes fall-53 {
  34.685% {
    transform: translate(60.1439vw, 34.685vh) scale(0.3568);
  }
  to {
    transform: translate(57.2729vw, 100vh) scale(0.3568);
  }
}
.snowdot:nth-child(54) {
  opacity: 0.9293;
  transform: translate(10.4204vw, -10px) scale(0.6416);
  animation: fall-54 18s -27s linear infinite;
}
@keyframes fall-54 {
  39.942% {
    transform: translate(0.4413vw, 39.942vh) scale(0.6416);
  }
  to {
    transform: translate(5.43085vw, 100vh) scale(0.6416);
  }
}
.snowdot:nth-child(55) {
  opacity: 0.1339;
  transform: translate(40.9497vw, -10px) scale(0.8111);
  animation: fall-55 16s -14s linear infinite;
}
@keyframes fall-55 {
  54.566% {
    transform: translate(39.3945vw, 54.566vh) scale(0.8111);
  }
  to {
    transform: translate(40.1721vw, 100vh) scale(0.8111);
  }
}
.snowdot:nth-child(56) {
  opacity: 0.3563;
  transform: translate(29.7237vw, -10px) scale(0.4314);
  animation: fall-56 15s -10s linear infinite;
}
@keyframes fall-56 {
  49.548% {
    transform: translate(26.7606vw, 49.548vh) scale(0.4314);
  }
  to {
    transform: translate(28.24215vw, 100vh) scale(0.4314);
  }
}
.snowdot:nth-child(57) {
  opacity: 0.0633;
  transform: translate(24.6799vw, -10px) scale(0.5501);
  animation: fall-57 17s -20s linear infinite;
}
@keyframes fall-57 {
  35.738% {
    transform: translate(16.7552vw, 35.738vh) scale(0.5501);
  }
  to {
    transform: translate(20.71755vw, 100vh) scale(0.5501);
  }
}
.snowdot:nth-child(58) {
  opacity: 0.6226;
  transform: translate(27.2441vw, -10px) scale(0.4687);
  animation: fall-58 21s -19s linear infinite;
}
@keyframes fall-58 {
  73.786% {
    transform: translate(36.421vw, 73.786vh) scale(0.4687);
  }
  to {
    transform: translate(31.83255vw, 100vh) scale(0.4687);
  }
}
.snowdot:nth-child(59) {
  opacity: 0.1141;
  transform: translate(82.232vw, -10px) scale(0.1403);
  animation: fall-59 10s -2s linear infinite;
}
@keyframes fall-59 {
  69.087% {
    transform: translate(88.063vw, 69.087vh) scale(0.1403);
  }
  to {
    transform: translate(85.1475vw, 100vh) scale(0.1403);
  }
}
.snowdot:nth-child(60) {
  opacity: 0.2248;
  transform: translate(99.3693vw, -10px) scale(0.1215);
  animation: fall-60 12s -24s linear infinite;
}
@keyframes fall-60 {
  48.06% {
    transform: translate(96.5207vw, 48.06vh) scale(0.1215);
  }
  to {
    transform: translate(97.945vw, 100vh) scale(0.1215);
  }
}
.snowdot:nth-child(61) {
  opacity: 0.4644;
  transform: translate(63.7059vw, -10px) scale(0.9111);
  animation: fall-61 16s -4s linear infinite;
}
@keyframes fall-61 {
  73.767% {
    transform: translate(69.2223vw, 73.767vh) scale(0.9111);
  }
  to {
    transform: translate(66.4641vw, 100vh) scale(0.9111);
  }
}
.snowdot:nth-child(62) {
  opacity: 0.3828;
  transform: translate(89.48vw, -10px) scale(0.4984);
  animation: fall-62 29s -14s linear infinite;
}
@keyframes fall-62 {
  43.199% {
    transform: translate(91.536vw, 43.199vh) scale(0.4984);
  }
  to {
    transform: translate(90.508vw, 100vh) scale(0.4984);
  }
}
.snowdot:nth-child(63) {
  opacity: 0.6973;
  transform: translate(70.4643vw, -10px) scale(0.8025);
  animation: fall-63 13s -9s linear infinite;
}
@keyframes fall-63 {
  40.304% {
    transform: translate(67.1033vw, 40.304vh) scale(0.8025);
  }
  to {
    transform: translate(68.7838vw, 100vh) scale(0.8025);
  }
}
.snowdot:nth-child(64) {
  opacity: 0.9;
  transform: translate(75.5485vw, -10px) scale(0.9844);
  animation: fall-64 14s -26s linear infinite;
}
@keyframes fall-64 {
  39.432% {
    transform: translate(67.0187vw, 39.432vh) scale(0.9844);
  }
  to {
    transform: translate(71.2836vw, 100vh) scale(0.9844);
  }
}
.snowdot:nth-child(65) {
  opacity: 0.2064;
  transform: translate(45.1067vw, -10px) scale(0.6251);
  animation: fall-65 30s -3s linear infinite;
}
@keyframes fall-65 {
  58.202% {
    transform: translate(44.3032vw, 58.202vh) scale(0.6251);
  }
  to {
    transform: translate(44.70495vw, 100vh) scale(0.6251);
  }
}
.snowdot:nth-child(66) {
  opacity: 0.6817;
  transform: translate(34.5771vw, -10px) scale(0.8723);
  animation: fall-66 24s -25s linear infinite;
}
@keyframes fall-66 {
  40.99% {
    transform: translate(31.2768vw, 40.99vh) scale(0.8723);
  }
  to {
    transform: translate(32.92695vw, 100vh) scale(0.8723);
  }
}
.snowdot:nth-child(67) {
  opacity: 0.5111;
  transform: translate(43.2249vw, -10px) scale(0.2363);
  animation: fall-67 17s -21s linear infinite;
}
@keyframes fall-67 {
  65.106% {
    transform: translate(36.6148vw, 65.106vh) scale(0.2363);
  }
  to {
    transform: translate(39.91985vw, 100vh) scale(0.2363);
  }
}
.snowdot:nth-child(68) {
  opacity: 0.7352;
  transform: translate(38.2109vw, -10px) scale(0.1631);
  animation: fall-68 15s -25s linear infinite;
}
@keyframes fall-68 {
  73.41% {
    transform: translate(36.5856vw, 73.41vh) scale(0.1631);
  }
  to {
    transform: translate(37.39825vw, 100vh) scale(0.1631);
  }
}
.snowdot:nth-child(69) {
  opacity: 0.6635;
  transform: translate(37.3401vw, -10px) scale(0.0332);
  animation: fall-69 15s -19s linear infinite;
}
@keyframes fall-69 {
  37.661% {
    transform: translate(35.3414vw, 37.661vh) scale(0.0332);
  }
  to {
    transform: translate(36.34075vw, 100vh) scale(0.0332);
  }
}
.snowdot:nth-child(70) {
  opacity: 0.3773;
  transform: translate(71.4604vw, -10px) scale(0.0733);
  animation: fall-70 21s -8s linear infinite;
}
@keyframes fall-70 {
  68.748% {
    transform: translate(65.3275vw, 68.748vh) scale(0.0733);
  }
  to {
    transform: translate(68.39395vw, 100vh) scale(0.0733);
  }
}
.snowdot:nth-child(71) {
  opacity: 0.4444;
  transform: translate(86.5045vw, -10px) scale(0.0017);
  animation: fall-71 12s -28s linear infinite;
}
@keyframes fall-71 {
  73.617% {
    transform: translate(93.4177vw, 73.617vh) scale(0.0017);
  }
  to {
    transform: translate(89.9611vw, 100vh) scale(0.0017);
  }
}
.snowdot:nth-child(72) {
  opacity: 0.3794;
  transform: translate(15.0016vw, -10px) scale(0.9998);
  animation: fall-72 12s -15s linear infinite;
}
@keyframes fall-72 {
  58.121% {
    transform: translate(13.0754vw, 58.121vh) scale(0.9998);
  }
  to {
    transform: translate(14.0385vw, 100vh) scale(0.9998);
  }
}
.snowdot:nth-child(73) {
  opacity: 0.8136;
  transform: translate(15.9973vw, -10px) scale(0.736);
  animation: fall-73 14s -29s linear infinite;
}
@keyframes fall-73 {
  30.209% {
    transform: translate(24.4556vw, 30.209vh) scale(0.736);
  }
  to {
    transform: translate(20.22645vw, 100vh) scale(0.736);
  }
}
.snowdot:nth-child(74) {
  opacity: 0.1845;
  transform: translate(45.0215vw, -10px) scale(0.7459);
  animation: fall-74 19s -18s linear infinite;
}
@keyframes fall-74 {
  60.221% {
    transform: translate(51.4077vw, 60.221vh) scale(0.7459);
  }
  to {
    transform: translate(48.2146vw, 100vh) scale(0.7459);
  }
}
.snowdot:nth-child(75) {
  opacity: 0.3434;
  transform: translate(29.1851vw, -10px) scale(0.1018);
  animation: fall-75 14s -29s linear infinite;
}
@keyframes fall-75 {
  34.865% {
    transform: translate(35.1939vw, 34.865vh) scale(0.1018);
  }
  to {
    transform: translate(32.1895vw, 100vh) scale(0.1018);
  }
}
.snowdot:nth-child(76) {
  opacity: 0.874;
  transform: translate(55.2834vw, -10px) scale(0.642);
  animation: fall-76 16s -11s linear infinite;
}
@keyframes fall-76 {
  72.086% {
    transform: translate(56.0366vw, 72.086vh) scale(0.642);
  }
  to {
    transform: translate(55.66vw, 100vh) scale(0.642);
  }
}
.snowdot:nth-child(77) {
  opacity: 0.5459;
  transform: translate(50.9485vw, -10px) scale(0.0328);
  animation: fall-77 12s -21s linear infinite;
}
@keyframes fall-77 {
  76.278% {
    transform: translate(52.8427vw, 76.278vh) scale(0.0328);
  }
  to {
    transform: translate(51.8956vw, 100vh) scale(0.0328);
  }
}
.snowdot:nth-child(78) {
  opacity: 0.0375;
  transform: translate(30.9678vw, -10px) scale(0.012);
  animation: fall-78 14s -13s linear infinite;
}
@keyframes fall-78 {
  47.342% {
    transform: translate(33.5108vw, 47.342vh) scale(0.012);
  }
  to {
    transform: translate(32.2393vw, 100vh) scale(0.012);
  }
}
.snowdot:nth-child(79) {
  opacity: 0.8309;
  transform: translate(85.9396vw, -10px) scale(0.2649);
  animation: fall-79 16s -8s linear infinite;
}
@keyframes fall-79 {
  32.007% {
    transform: translate(88.1825vw, 32.007vh) scale(0.2649);
  }
  to {
    transform: translate(87.06105vw, 100vh) scale(0.2649);
  }
}
.snowdot:nth-child(80) {
  opacity: 0.1923;
  transform: translate(85.3993vw, -10px) scale(0.3482);
  animation: fall-80 21s -27s linear infinite;
}
@keyframes fall-80 {
  52.848% {
    transform: translate(76.784vw, 52.848vh) scale(0.3482);
  }
  to {
    transform: translate(81.09165vw, 100vh) scale(0.3482);
  }
}
.snowdot:nth-child(81) {
  opacity: 0.8656;
  transform: translate(83.0564vw, -10px) scale(0.5488);
  animation: fall-81 28s -5s linear infinite;
}
@keyframes fall-81 {
  55.508% {
    transform: translate(82.8148vw, 55.508vh) scale(0.5488);
  }
  to {
    transform: translate(82.9356vw, 100vh) scale(0.5488);
  }
}
.snowdot:nth-child(82) {
  opacity: 0.3156;
  transform: translate(77.1699vw, -10px) scale(0.5333);
  animation: fall-82 14s -1s linear infinite;
}
@keyframes fall-82 {
  35.266% {
    transform: translate(80.8497vw, 35.266vh) scale(0.5333);
  }
  to {
    transform: translate(79.0098vw, 100vh) scale(0.5333);
  }
}
.snowdot:nth-child(83) {
  opacity: 0.2871;
  transform: translate(73.9318vw, -10px) scale(0.9002);
  animation: fall-83 21s -30s linear infinite;
}
@keyframes fall-83 {
  63.572% {
    transform: translate(82.9028vw, 63.572vh) scale(0.9002);
  }
  to {
    transform: translate(78.4173vw, 100vh) scale(0.9002);
  }
}
.snowdot:nth-child(84) {
  opacity: 0.019;
  transform: translate(47.1242vw, -10px) scale(0.8318);
  animation: fall-84 19s -24s linear infinite;
}
@keyframes fall-84 {
  34.562% {
    transform: translate(43.4054vw, 34.562vh) scale(0.8318);
  }
  to {
    transform: translate(45.2648vw, 100vh) scale(0.8318);
  }
}
.snowdot:nth-child(85) {
  opacity: 0.7221;
  transform: translate(78.2772vw, -10px) scale(0.545);
  animation: fall-85 29s -1s linear infinite;
}
@keyframes fall-85 {
  66.334% {
    transform: translate(81.4462vw, 66.334vh) scale(0.545);
  }
  to {
    transform: translate(79.8617vw, 100vh) scale(0.545);
  }
}
.snowdot:nth-child(86) {
  opacity: 0.2226;
  transform: translate(55.4394vw, -10px) scale(0.855);
  animation: fall-86 21s -15s linear infinite;
}
@keyframes fall-86 {
  43.017% {
    transform: translate(56.2679vw, 43.017vh) scale(0.855);
  }
  to {
    transform: translate(55.85365vw, 100vh) scale(0.855);
  }
}
.snowdot:nth-child(87) {
  opacity: 0.5698;
  transform: translate(37.4007vw, -10px) scale(0.4992);
  animation: fall-87 28s -4s linear infinite;
}
@keyframes fall-87 {
  72.179% {
    transform: translate(46.5485vw, 72.179vh) scale(0.4992);
  }
  to {
    transform: translate(41.9746vw, 100vh) scale(0.4992);
  }
}
.snowdot:nth-child(88) {
  opacity: 0.7181;
  transform: translate(15.8831vw, -10px) scale(0.8312);
  animation: fall-88 11s -26s linear infinite;
}
@keyframes fall-88 {
  55.855% {
    transform: translate(12.4424vw, 55.855vh) scale(0.8312);
  }
  to {
    transform: translate(14.16275vw, 100vh) scale(0.8312);
  }
}
.snowdot:nth-child(89) {
  opacity: 0.147;
  transform: translate(18.7926vw, -10px) scale(0.9022);
  animation: fall-89 27s -17s linear infinite;
}
@keyframes fall-89 {
  65.403% {
    transform: translate(25.8314vw, 65.403vh) scale(0.9022);
  }
  to {
    transform: translate(22.312vw, 100vh) scale(0.9022);
  }
}
.snowdot:nth-child(90) {
  opacity: 0.584;
  transform: translate(77.4319vw, -10px) scale(0.5997);
  animation: fall-90 16s -29s linear infinite;
}
@keyframes fall-90 {
  72.913% {
    transform: translate(81.9108vw, 72.913vh) scale(0.5997);
  }
  to {
    transform: translate(79.67135vw, 100vh) scale(0.5997);
  }
}
.snowdot:nth-child(91) {
  opacity: 0.7838;
  transform: translate(17.9317vw, -10px) scale(0.4642);
  animation: fall-91 17s -18s linear infinite;
}
@keyframes fall-91 {
  35.171% {
    transform: translate(22.7536vw, 35.171vh) scale(0.4642);
  }
  to {
    transform: translate(20.34265vw, 100vh) scale(0.4642);
  }
}
.snowdot:nth-child(92) {
  opacity: 0.7703;
  transform: translate(84.3051vw, -10px) scale(0.2701);
  animation: fall-92 27s -22s linear infinite;
}
@keyframes fall-92 {
  36.852% {
    transform: translate(84.818vw, 36.852vh) scale(0.2701);
  }
  to {
    transform: translate(84.56155vw, 100vh) scale(0.2701);
  }
}
.snowdot:nth-child(93) {
  opacity: 0.4725;
  transform: translate(31.1114vw, -10px) scale(0.3651);
  animation: fall-93 11s -8s linear infinite;
}
@keyframes fall-93 {
  79.368% {
    transform: translate(29.9328vw, 79.368vh) scale(0.3651);
  }
  to {
    transform: translate(30.5221vw, 100vh) scale(0.3651);
  }
}
.snowdot:nth-child(94) {
  opacity: 0.7992;
  transform: translate(48.0293vw, -10px) scale(0.5804);
  animation: fall-94 13s -6s linear infinite;
}
@keyframes fall-94 {
  40.239% {
    transform: translate(39.5037vw, 40.239vh) scale(0.5804);
  }
  to {
    transform: translate(43.7665vw, 100vh) scale(0.5804);
  }
}
.snowdot:nth-child(95) {
  opacity: 0.0511;
  transform: translate(18.2337vw, -10px) scale(0.9099);
  animation: fall-95 20s -27s linear infinite;
}
@keyframes fall-95 {
  59.041% {
    transform: translate(10.044vw, 59.041vh) scale(0.9099);
  }
  to {
    transform: translate(14.13885vw, 100vh) scale(0.9099);
  }
}
.snowdot:nth-child(96) {
  opacity: 0.0092;
  transform: translate(27.4472vw, -10px) scale(0.9153);
  animation: fall-96 18s -27s linear infinite;
}
@keyframes fall-96 {
  66.226% {
    transform: translate(36.2489vw, 66.226vh) scale(0.9153);
  }
  to {
    transform: translate(31.84805vw, 100vh) scale(0.9153);
  }
}
.snowdot:nth-child(97) {
  opacity: 0.8979;
  transform: translate(53.0258vw, -10px) scale(0.1645);
  animation: fall-97 29s -19s linear infinite;
}
@keyframes fall-97 {
  77.786% {
    transform: translate(61.6525vw, 77.786vh) scale(0.1645);
  }
  to {
    transform: translate(57.33915vw, 100vh) scale(0.1645);
  }
}
.snowdot:nth-child(98) {
  opacity: 0.7299;
  transform: translate(29.8107vw, -10px) scale(0.0337);
  animation: fall-98 25s -7s linear infinite;
}
@keyframes fall-98 {
  71.325% {
    transform: translate(25.594vw, 71.325vh) scale(0.0337);
  }
  to {
    transform: translate(27.70235vw, 100vh) scale(0.0337);
  }
}
.snowdot:nth-child(99) {
  opacity: 0.6602;
  transform: translate(87.4938vw, -10px) scale(0.1662);
  animation: fall-99 26s -7s linear infinite;
}
@keyframes fall-99 {
  58.148% {
    transform: translate(87.6502vw, 58.148vh) scale(0.1662);
  }
  to {
    transform: translate(87.572vw, 100vh) scale(0.1662);
  }
}
.snowdot:nth-child(100) {
  opacity: 0.3082;
  transform: translate(83.6971vw, -10px) scale(0.591);
  animation: fall-100 17s -17s linear infinite;
}
@keyframes fall-100 {
  40.313% {
    transform: translate(84.2532vw, 40.313vh) scale(0.591);
  }
  to {
    transform: translate(83.97515vw, 100vh) scale(0.591);
  }
}
.snowdot:nth-child(101) {
  opacity: 0.7868;
  transform: translate(49.5073vw, -10px) scale(0.9603);
  animation: fall-101 29s -26s linear infinite;
}
@keyframes fall-101 {
  59.275% {
    transform: translate(45.6409vw, 59.275vh) scale(0.9603);
  }
  to {
    transform: translate(47.5741vw, 100vh) scale(0.9603);
  }
}
.snowdot:nth-child(102) {
  opacity: 0.0768;
  transform: translate(77.6426vw, -10px) scale(0.8373);
  animation: fall-102 20s -19s linear infinite;
}
@keyframes fall-102 {
  36.677% {
    transform: translate(68.5345vw, 36.677vh) scale(0.8373);
  }
  to {
    transform: translate(73.08855vw, 100vh) scale(0.8373);
  }
}
.snowdot:nth-child(103) {
  opacity: 0.8395;
  transform: translate(18.2343vw, -10px) scale(0.4953);
  animation: fall-103 19s -15s linear infinite;
}
@keyframes fall-103 {
  31.697% {
    transform: translate(8.8775vw, 31.697vh) scale(0.4953);
  }
  to {
    transform: translate(13.5559vw, 100vh) scale(0.4953);
  }
}
.snowdot:nth-child(104) {
  opacity: 0.5866;
  transform: translate(60.0369vw, -10px) scale(0.4119);
  animation: fall-104 14s -19s linear infinite;
}
@keyframes fall-104 {
  35.86% {
    transform: translate(52.9841vw, 35.86vh) scale(0.4119);
  }
  to {
    transform: translate(56.5105vw, 100vh) scale(0.4119);
  }
}
.snowdot:nth-child(105) {
  opacity: 0.4912;
  transform: translate(62.7519vw, -10px) scale(0.5233);
  animation: fall-105 30s -17s linear infinite;
}
@keyframes fall-105 {
  52.963% {
    transform: translate(62.3243vw, 52.963vh) scale(0.5233);
  }
  to {
    transform: translate(62.5381vw, 100vh) scale(0.5233);
  }
}
.snowdot:nth-child(106) {
  opacity: 0.9404;
  transform: translate(32.2165vw, -10px) scale(0.0367);
  animation: fall-106 24s -23s linear infinite;
}
@keyframes fall-106 {
  34.355% {
    transform: translate(36.5216vw, 34.355vh) scale(0.0367);
  }
  to {
    transform: translate(34.36905vw, 100vh) scale(0.0367);
  }
}
.snowdot:nth-child(107) {
  opacity: 0.616;
  transform: translate(38.69vw, -10px) scale(0.5938);
  animation: fall-107 10s -20s linear infinite;
}
@keyframes fall-107 {
  62.264% {
    transform: translate(31.0368vw, 62.264vh) scale(0.5938);
  }
  to {
    transform: translate(34.8634vw, 100vh) scale(0.5938);
  }
}
.snowdot:nth-child(108) {
  opacity: 0.7376;
  transform: translate(45.4863vw, -10px) scale(0.3018);
  animation: fall-108 25s -24s linear infinite;
}
@keyframes fall-108 {
  41.407% {
    transform: translate(43.3613vw, 41.407vh) scale(0.3018);
  }
  to {
    transform: translate(44.4238vw, 100vh) scale(0.3018);
  }
}
.snowdot:nth-child(109) {
  opacity: 0.0698;
  transform: translate(28.6717vw, -10px) scale(0.9455);
  animation: fall-109 13s -10s linear infinite;
}
@keyframes fall-109 {
  36.641% {
    transform: translate(31.7995vw, 36.641vh) scale(0.9455);
  }
  to {
    transform: translate(30.2356vw, 100vh) scale(0.9455);
  }
}
.snowdot:nth-child(110) {
  opacity: 0.0411;
  transform: translate(65.8744vw, -10px) scale(0.3776);
  animation: fall-110 14s -12s linear infinite;
}
@keyframes fall-110 {
  73.575% {
    transform: translate(66.0709vw, 73.575vh) scale(0.3776);
  }
  to {
    transform: translate(65.97265vw, 100vh) scale(0.3776);
  }
}
.snowdot:nth-child(111) {
  opacity: 0.4325;
  transform: translate(57.5081vw, -10px) scale(0.97);
  animation: fall-111 18s -7s linear infinite;
}
@keyframes fall-111 {
  38.976% {
    transform: translate(53.3169vw, 38.976vh) scale(0.97);
  }
  to {
    transform: translate(55.4125vw, 100vh) scale(0.97);
  }
}
.snowdot:nth-child(112) {
  opacity: 0.9485;
  transform: translate(9.1889vw, -10px) scale(0.1769);
  animation: fall-112 22s -12s linear infinite;
}
@keyframes fall-112 {
  48.375% {
    transform: translate(15.8068vw, 48.375vh) scale(0.1769);
  }
  to {
    transform: translate(12.49785vw, 100vh) scale(0.1769);
  }
}
.snowdot:nth-child(113) {
  opacity: 0.0593;
  transform: translate(42.043vw, -10px) scale(0.4514);
  animation: fall-113 18s -3s linear infinite;
}
@keyframes fall-113 {
  78.699% {
    transform: translate(47.9656vw, 78.699vh) scale(0.4514);
  }
  to {
    transform: translate(45.0043vw, 100vh) scale(0.4514);
  }
}
.snowdot:nth-child(114) {
  opacity: 0.4349;
  transform: translate(19.186vw, -10px) scale(0.1255);
  animation: fall-114 16s -1s linear infinite;
}
@keyframes fall-114 {
  46.45% {
    transform: translate(10.8335vw, 46.45vh) scale(0.1255);
  }
  to {
    transform: translate(15.00975vw, 100vh) scale(0.1255);
  }
}
.snowdot:nth-child(115) {
  opacity: 0.9326;
  transform: translate(92.9794vw, -10px) scale(0.5649);
  animation: fall-115 30s -4s linear infinite;
}
@keyframes fall-115 {
  74.312% {
    transform: translate(87.5845vw, 74.312vh) scale(0.5649);
  }
  to {
    transform: translate(90.28195vw, 100vh) scale(0.5649);
  }
}
.snowdot:nth-child(116) {
  opacity: 0.8436;
  transform: translate(52.7595vw, -10px) scale(0.8938);
  animation: fall-116 30s -8s linear infinite;
}
@keyframes fall-116 {
  55.612% {
    transform: translate(48.8356vw, 55.612vh) scale(0.8938);
  }
  to {
    transform: translate(50.79755vw, 100vh) scale(0.8938);
  }
}
.snowdot:nth-child(117) {
  opacity: 0.6046;
  transform: translate(48.7454vw, -10px) scale(0.1244);
  animation: fall-117 21s -17s linear infinite;
}
@keyframes fall-117 {
  70.715% {
    transform: translate(57.6883vw, 70.715vh) scale(0.1244);
  }
  to {
    transform: translate(53.21685vw, 100vh) scale(0.1244);
  }
}
.snowdot:nth-child(118) {
  opacity: 0.7904;
  transform: translate(65.3848vw, -10px) scale(0.1934);
  animation: fall-118 26s -21s linear infinite;
}
@keyframes fall-118 {
  49.423% {
    transform: translate(71.9809vw, 49.423vh) scale(0.1934);
  }
  to {
    transform: translate(68.68285vw, 100vh) scale(0.1934);
  }
}
.snowdot:nth-child(119) {
  opacity: 0.2161;
  transform: translate(63.2494vw, -10px) scale(0.2325);
  animation: fall-119 23s -1s linear infinite;
}
@keyframes fall-119 {
  33.461% {
    transform: translate(65.1354vw, 33.461vh) scale(0.2325);
  }
  to {
    transform: translate(64.1924vw, 100vh) scale(0.2325);
  }
}
.snowdot:nth-child(120) {
  opacity: 0.9819;
  transform: translate(37.8449vw, -10px) scale(0.2902);
  animation: fall-120 28s -13s linear infinite;
}
@keyframes fall-120 {
  41.892% {
    transform: translate(30.5052vw, 41.892vh) scale(0.2902);
  }
  to {
    transform: translate(34.17505vw, 100vh) scale(0.2902);
  }
}
.snowdot:nth-child(121) {
  opacity: 0.1829;
  transform: translate(29.7158vw, -10px) scale(0.2768);
  animation: fall-121 15s -18s linear infinite;
}
@keyframes fall-121 {
  67.142% {
    transform: translate(22.0009vw, 67.142vh) scale(0.2768);
  }
  to {
    transform: translate(25.85835vw, 100vh) scale(0.2768);
  }
}
.snowdot:nth-child(122) {
  opacity: 0.1989;
  transform: translate(7.9007vw, -10px) scale(0.7511);
  animation: fall-122 21s -23s linear infinite;
}
@keyframes fall-122 {
  56.935% {
    transform: translate(5.5927vw, 56.935vh) scale(0.7511);
  }
  to {
    transform: translate(6.7467vw, 100vh) scale(0.7511);
  }
}
.snowdot:nth-child(123) {
  opacity: 0.6687;
  transform: translate(80.2318vw, -10px) scale(0.248);
  animation: fall-123 20s -15s linear infinite;
}
@keyframes fall-123 {
  55.051% {
    transform: translate(72.0134vw, 55.051vh) scale(0.248);
  }
  to {
    transform: translate(76.1226vw, 100vh) scale(0.248);
  }
}
.snowdot:nth-child(124) {
  opacity: 0.1675;
  transform: translate(5.9723vw, -10px) scale(0.568);
  animation: fall-124 25s -8s linear infinite;
}
@keyframes fall-124 {
  74.657% {
    transform: translate(5.2711vw, 74.657vh) scale(0.568);
  }
  to {
    transform: translate(5.6217vw, 100vh) scale(0.568);
  }
}
.snowdot:nth-child(125) {
  opacity: 0.0047;
  transform: translate(10.7104vw, -10px) scale(0.7867);
  animation: fall-125 11s -22s linear infinite;
}
@keyframes fall-125 {
  49.102% {
    transform: translate(17.5161vw, 49.102vh) scale(0.7867);
  }
  to {
    transform: translate(14.11325vw, 100vh) scale(0.7867);
  }
}
.snowdot:nth-child(126) {
  opacity: 0.1881;
  transform: translate(58.2921vw, -10px) scale(0.6377);
  animation: fall-126 10s -20s linear infinite;
}
@keyframes fall-126 {
  59.395% {
    transform: translate(66.9835vw, 59.395vh) scale(0.6377);
  }
  to {
    transform: translate(62.6378vw, 100vh) scale(0.6377);
  }
}
.snowdot:nth-child(127) {
  opacity: 0.1646;
  transform: translate(77.9337vw, -10px) scale(0.6994);
  animation: fall-127 26s -2s linear infinite;
}
@keyframes fall-127 {
  36.51% {
    transform: translate(76.5563vw, 36.51vh) scale(0.6994);
  }
  to {
    transform: translate(77.245vw, 100vh) scale(0.6994);
  }
}
.snowdot:nth-child(128) {
  opacity: 0.4332;
  transform: translate(49.2022vw, -10px) scale(0.2752);
  animation: fall-128 13s -14s linear infinite;
}
@keyframes fall-128 {
  69.888% {
    transform: translate(43.0476vw, 69.888vh) scale(0.2752);
  }
  to {
    transform: translate(46.1249vw, 100vh) scale(0.2752);
  }
}
.snowdot:nth-child(129) {
  opacity: 0.2043;
  transform: translate(7.0243vw, -10px) scale(0.0912);
  animation: fall-129 18s -17s linear infinite;
}
@keyframes fall-129 {
  77.359% {
    transform: translate(-2.9049vw, 77.359vh) scale(0.0912);
  }
  to {
    transform: translate(2.0597vw, 100vh) scale(0.0912);
  }
}
.snowdot:nth-child(130) {
  opacity: 0.653;
  transform: translate(23.4745vw, -10px) scale(0.988);
  animation: fall-130 11s -13s linear infinite;
}
@keyframes fall-130 {
  47.609% {
    transform: translate(25.7998vw, 47.609vh) scale(0.988);
  }
  to {
    transform: translate(24.63715vw, 100vh) scale(0.988);
  }
}
.snowdot:nth-child(131) {
  opacity: 0.0762;
  transform: translate(21.304vw, -10px) scale(0.0824);
  animation: fall-131 17s -27s linear infinite;
}
@keyframes fall-131 {
  58.543% {
    transform: translate(16.637vw, 58.543vh) scale(0.0824);
  }
  to {
    transform: translate(18.9705vw, 100vh) scale(0.0824);
  }
}
.snowdot:nth-child(132) {
  opacity: 0.7751;
  transform: translate(35.8084vw, -10px) scale(0.6474);
  animation: fall-132 30s -3s linear infinite;
}
@keyframes fall-132 {
  37.66% {
    transform: translate(39.2264vw, 37.66vh) scale(0.6474);
  }
  to {
    transform: translate(37.5174vw, 100vh) scale(0.6474);
  }
}
.snowdot:nth-child(133) {
  opacity: 0.0111;
  transform: translate(28.2485vw, -10px) scale(0.9542);
  animation: fall-133 24s -14s linear infinite;
}
@keyframes fall-133 {
  30.923% {
    transform: translate(28.8265vw, 30.923vh) scale(0.9542);
  }
  to {
    transform: translate(28.5375vw, 100vh) scale(0.9542);
  }
}
.snowdot:nth-child(134) {
  opacity: 0.707;
  transform: translate(36.1078vw, -10px) scale(0.3576);
  animation: fall-134 26s -15s linear infinite;
}
@keyframes fall-134 {
  45.549% {
    transform: translate(41.5398vw, 45.549vh) scale(0.3576);
  }
  to {
    transform: translate(38.8238vw, 100vh) scale(0.3576);
  }
}
.snowdot:nth-child(135) {
  opacity: 0.8739;
  transform: translate(50.0526vw, -10px) scale(0.7216);
  animation: fall-135 25s -30s linear infinite;
}
@keyframes fall-135 {
  59.566% {
    transform: translate(43.7411vw, 59.566vh) scale(0.7216);
  }
  to {
    transform: translate(46.89685vw, 100vh) scale(0.7216);
  }
}
.snowdot:nth-child(136) {
  opacity: 0.443;
  transform: translate(14.7477vw, -10px) scale(0.9289);
  animation: fall-136 27s -28s linear infinite;
}
@keyframes fall-136 {
  49.077% {
    transform: translate(10.3758vw, 49.077vh) scale(0.9289);
  }
  to {
    transform: translate(12.56175vw, 100vh) scale(0.9289);
  }
}
.snowdot:nth-child(137) {
  opacity: 0.8895;
  transform: translate(42.6784vw, -10px) scale(0.074);
  animation: fall-137 11s -13s linear infinite;
}
@keyframes fall-137 {
  59.466% {
    transform: translate(48.513vw, 59.466vh) scale(0.074);
  }
  to {
    transform: translate(45.5957vw, 100vh) scale(0.074);
  }
}
.snowdot:nth-child(138) {
  opacity: 0.0421;
  transform: translate(48.8353vw, -10px) scale(0.0391);
  animation: fall-138 29s -26s linear infinite;
}
@keyframes fall-138 {
  36.776% {
    transform: translate(58.0751vw, 36.776vh) scale(0.0391);
  }
  to {
    transform: translate(53.4552vw, 100vh) scale(0.0391);
  }
}
.snowdot:nth-child(139) {
  opacity: 0.2185;
  transform: translate(43.4093vw, -10px) scale(0.541);
  animation: fall-139 27s -28s linear infinite;
}
@keyframes fall-139 {
  36.25% {
    transform: translate(37.3286vw, 36.25vh) scale(0.541);
  }
  to {
    transform: translate(40.36895vw, 100vh) scale(0.541);
  }
}
.snowdot:nth-child(140) {
  opacity: 0.7502;
  transform: translate(8.7927vw, -10px) scale(0.5536);
  animation: fall-140 30s -29s linear infinite;
}
@keyframes fall-140 {
  37.544% {
    transform: translate(5.0786vw, 37.544vh) scale(0.5536);
  }
  to {
    transform: translate(6.93565vw, 100vh) scale(0.5536);
  }
}
.snowdot:nth-child(141) {
  opacity: 0.3862;
  transform: translate(33.1975vw, -10px) scale(0.282);
  animation: fall-141 28s -4s linear infinite;
}
@keyframes fall-141 {
  68.358% {
    transform: translate(33.0841vw, 68.358vh) scale(0.282);
  }
  to {
    transform: translate(33.1408vw, 100vh) scale(0.282);
  }
}
.snowdot:nth-child(142) {
  opacity: 0.9299;
  transform: translate(49.0224vw, -10px) scale(0.5774);
  animation: fall-142 18s -24s linear infinite;
}
@keyframes fall-142 {
  71.018% {
    transform: translate(47.3601vw, 71.018vh) scale(0.5774);
  }
  to {
    transform: translate(48.19125vw, 100vh) scale(0.5774);
  }
}
.snowdot:nth-child(143) {
  opacity: 0.1317;
  transform: translate(37.5856vw, -10px) scale(0.4082);
  animation: fall-143 14s -3s linear infinite;
}
@keyframes fall-143 {
  71.641% {
    transform: translate(38.5452vw, 71.641vh) scale(0.4082);
  }
  to {
    transform: translate(38.0654vw, 100vh) scale(0.4082);
  }
}
.snowdot:nth-child(144) {
  opacity: 0.6027;
  transform: translate(62.4546vw, -10px) scale(0.7631);
  animation: fall-144 14s -19s linear infinite;
}
@keyframes fall-144 {
  79.465% {
    transform: translate(62.4553vw, 79.465vh) scale(0.7631);
  }
  to {
    transform: translate(62.45495vw, 100vh) scale(0.7631);
  }
}
.snowdot:nth-child(145) {
  opacity: 0.0412;
  transform: translate(62.7216vw, -10px) scale(0.5121);
  animation: fall-145 24s -14s linear infinite;
}
@keyframes fall-145 {
  34.118% {
    transform: translate(54.8194vw, 34.118vh) scale(0.5121);
  }
  to {
    transform: translate(58.7705vw, 100vh) scale(0.5121);
  }
}
.snowdot:nth-child(146) {
  opacity: 0.9037;
  transform: translate(57.353vw, -10px) scale(0.9859);
  animation: fall-146 15s -22s linear infinite;
}
@keyframes fall-146 {
  33.115% {
    transform: translate(58.8449vw, 33.115vh) scale(0.9859);
  }
  to {
    transform: translate(58.09895vw, 100vh) scale(0.9859);
  }
}
.snowdot:nth-child(147) {
  opacity: 0.5652;
  transform: translate(28.2891vw, -10px) scale(0.1073);
  animation: fall-147 26s -23s linear infinite;
}
@keyframes fall-147 {
  68.727% {
    transform: translate(33.3045vw, 68.727vh) scale(0.1073);
  }
  to {
    transform: translate(30.7968vw, 100vh) scale(0.1073);
  }
}
.snowdot:nth-child(148) {
  opacity: 0.5048;
  transform: translate(7.5785vw, -10px) scale(0.3217);
  animation: fall-148 17s -12s linear infinite;
}
@keyframes fall-148 {
  68.579% {
    transform: translate(13.9222vw, 68.579vh) scale(0.3217);
  }
  to {
    transform: translate(10.75035vw, 100vh) scale(0.3217);
  }
}
.snowdot:nth-child(149) {
  opacity: 0.4061;
  transform: translate(77.9576vw, -10px) scale(0.1266);
  animation: fall-149 15s -19s linear infinite;
}
@keyframes fall-149 {
  49.269% {
    transform: translate(73.9337vw, 49.269vh) scale(0.1266);
  }
  to {
    transform: translate(75.94565vw, 100vh) scale(0.1266);
  }
}
.snowdot:nth-child(150) {
  opacity: 0.1083;
  transform: translate(21.7749vw, -10px) scale(0.822);
  animation: fall-150 13s -29s linear infinite;
}
@keyframes fall-150 {
  31.594% {
    transform: translate(23.7995vw, 31.594vh) scale(0.822);
  }
  to {
    transform: translate(22.7872vw, 100vh) scale(0.822);
  }
}
.snowdot:nth-child(151) {
  opacity: 0.5677;
  transform: translate(82.5511vw, -10px) scale(0.9556);
  animation: fall-151 28s -14s linear infinite;
}
@keyframes fall-151 {
  49.147% {
    transform: translate(75.3703vw, 49.147vh) scale(0.9556);
  }
  to {
    transform: translate(78.9607vw, 100vh) scale(0.9556);
  }
}
.snowdot:nth-child(152) {
  opacity: 0.8578;
  transform: translate(58.9051vw, -10px) scale(0.7867);
  animation: fall-152 22s -16s linear infinite;
}
@keyframes fall-152 {
  37.962% {
    transform: translate(62.0854vw, 37.962vh) scale(0.7867);
  }
  to {
    transform: translate(60.49525vw, 100vh) scale(0.7867);
  }
}
.snowdot:nth-child(153) {
  opacity: 0.1859;
  transform: translate(28.4534vw, -10px) scale(0.4011);
  animation: fall-153 22s -26s linear infinite;
}
@keyframes fall-153 {
  49.435% {
    transform: translate(23.5031vw, 49.435vh) scale(0.4011);
  }
  to {
    transform: translate(25.97825vw, 100vh) scale(0.4011);
  }
}
.snowdot:nth-child(154) {
  opacity: 0.7264;
  transform: translate(10.1362vw, -10px) scale(0.8844);
  animation: fall-154 14s -20s linear infinite;
}
@keyframes fall-154 {
  48.287% {
    transform: translate(2.314vw, 48.287vh) scale(0.8844);
  }
  to {
    transform: translate(6.2251vw, 100vh) scale(0.8844);
  }
}
.snowdot:nth-child(155) {
  opacity: 0.2265;
  transform: translate(26.0983vw, -10px) scale(0.1735);
  animation: fall-155 11s -13s linear infinite;
}
@keyframes fall-155 {
  77.253% {
    transform: translate(23.4196vw, 77.253vh) scale(0.1735);
  }
  to {
    transform: translate(24.75895vw, 100vh) scale(0.1735);
  }
}
.snowdot:nth-child(156) {
  opacity: 0.4909;
  transform: translate(71.3102vw, -10px) scale(0.2498);
  animation: fall-156 20s -4s linear infinite;
}
@keyframes fall-156 {
  72.203% {
    transform: translate(78.056vw, 72.203vh) scale(0.2498);
  }
  to {
    transform: translate(74.6831vw, 100vh) scale(0.2498);
  }
}
.snowdot:nth-child(157) {
  opacity: 0.9549;
  transform: translate(65.4243vw, -10px) scale(0.6395);
  animation: fall-157 17s -27s linear infinite;
}
@keyframes fall-157 {
  44.477% {
    transform: translate(64.0654vw, 44.477vh) scale(0.6395);
  }
  to {
    transform: translate(64.74485vw, 100vh) scale(0.6395);
  }
}
.snowdot:nth-child(158) {
  opacity: 0.6713;
  transform: translate(95.5191vw, -10px) scale(0.3045);
  animation: fall-158 24s -28s linear infinite;
}
@keyframes fall-158 {
  75.022% {
    transform: translate(88.4154vw, 75.022vh) scale(0.3045);
  }
  to {
    transform: translate(91.96725vw, 100vh) scale(0.3045);
  }
}
.snowdot:nth-child(159) {
  opacity: 0.4176;
  transform: translate(97.3215vw, -10px) scale(0.5439);
  animation: fall-159 26s -17s linear infinite;
}
@keyframes fall-159 {
  42.334% {
    transform: translate(92.135vw, 42.334vh) scale(0.5439);
  }
  to {
    transform: translate(94.72825vw, 100vh) scale(0.5439);
  }
}
.snowdot:nth-child(160) {
  opacity: 0.549;
  transform: translate(92.4106vw, -10px) scale(0.6128);
  animation: fall-160 26s -18s linear infinite;
}
@keyframes fall-160 {
  69.662% {
    transform: translate(87.1774vw, 69.662vh) scale(0.6128);
  }
  to {
    transform: translate(89.794vw, 100vh) scale(0.6128);
  }
}
.snowdot:nth-child(161) {
  opacity: 0.7208;
  transform: translate(97.0266vw, -10px) scale(0.9506);
  animation: fall-161 29s -17s linear infinite;
}
@keyframes fall-161 {
  68.881% {
    transform: translate(100.3272vw, 68.881vh) scale(0.9506);
  }
  to {
    transform: translate(98.6769vw, 100vh) scale(0.9506);
  }
}
.snowdot:nth-child(162) {
  opacity: 0.5475;
  transform: translate(52.7884vw, -10px) scale(0.2135);
  animation: fall-162 16s -29s linear infinite;
}
@keyframes fall-162 {
  54.408% {
    transform: translate(59.0884vw, 54.408vh) scale(0.2135);
  }
  to {
    transform: translate(55.9384vw, 100vh) scale(0.2135);
  }
}
.snowdot:nth-child(163) {
  opacity: 0.1915;
  transform: translate(32.1631vw, -10px) scale(0.445);
  animation: fall-163 23s -16s linear infinite;
}
@keyframes fall-163 {
  42.577% {
    transform: translate(38.0498vw, 42.577vh) scale(0.445);
  }
  to {
    transform: translate(35.10645vw, 100vh) scale(0.445);
  }
}
.snowdot:nth-child(164) {
  opacity: 0.2863;
  transform: translate(57.0803vw, -10px) scale(0.339);
  animation: fall-164 24s -10s linear infinite;
}
@keyframes fall-164 {
  54.955% {
    transform: translate(58.4002vw, 54.955vh) scale(0.339);
  }
  to {
    transform: translate(57.74025vw, 100vh) scale(0.339);
  }
}
.snowdot:nth-child(165) {
  opacity: 0.2373;
  transform: translate(17.6113vw, -10px) scale(0.0026);
  animation: fall-165 29s -5s linear infinite;
}
@keyframes fall-165 {
  41.187% {
    transform: translate(10.4879vw, 41.187vh) scale(0.0026);
  }
  to {
    transform: translate(14.0496vw, 100vh) scale(0.0026);
  }
}
.snowdot:nth-child(166) {
  opacity: 0.138;
  transform: translate(33.3845vw, -10px) scale(0.0467);
  animation: fall-166 17s -7s linear infinite;
}
@keyframes fall-166 {
  40.173% {
    transform: translate(34.1638vw, 40.173vh) scale(0.0467);
  }
  to {
    transform: translate(33.77415vw, 100vh) scale(0.0467);
  }
}
.snowdot:nth-child(167) {
  opacity: 0.6187;
  transform: translate(74.1974vw, -10px) scale(0.2062);
  animation: fall-167 29s -2s linear infinite;
}
@keyframes fall-167 {
  58.359% {
    transform: translate(73.6478vw, 58.359vh) scale(0.2062);
  }
  to {
    transform: translate(73.9226vw, 100vh) scale(0.2062);
  }
}
.snowdot:nth-child(168) {
  opacity: 0.0763;
  transform: translate(38.7521vw, -10px) scale(0.6782);
  animation: fall-168 19s -11s linear infinite;
}
@keyframes fall-168 {
  48.917% {
    transform: translate(46.3329vw, 48.917vh) scale(0.6782);
  }
  to {
    transform: translate(42.5425vw, 100vh) scale(0.6782);
  }
}
.snowdot:nth-child(169) {
  opacity: 0.5374;
  transform: translate(87.3537vw, -10px) scale(0.1298);
  animation: fall-169 21s -11s linear infinite;
}
@keyframes fall-169 {
  44.487% {
    transform: translate(82.2124vw, 44.487vh) scale(0.1298);
  }
  to {
    transform: translate(84.78305vw, 100vh) scale(0.1298);
  }
}
.snowdot:nth-child(170) {
  opacity: 0.9761;
  transform: translate(26.5382vw, -10px) scale(0.6716);
  animation: fall-170 20s -17s linear infinite;
}
@keyframes fall-170 {
  35.879% {
    transform: translate(18.2798vw, 35.879vh) scale(0.6716);
  }
  to {
    transform: translate(22.409vw, 100vh) scale(0.6716);
  }
}
.snowdot:nth-child(171) {
  opacity: 0.4313;
  transform: translate(33.9246vw, -10px) scale(0.8143);
  animation: fall-171 18s -17s linear infinite;
}
@keyframes fall-171 {
  46.997% {
    transform: translate(31.8765vw, 46.997vh) scale(0.8143);
  }
  to {
    transform: translate(32.90055vw, 100vh) scale(0.8143);
  }
}
.snowdot:nth-child(172) {
  opacity: 0.3438;
  transform: translate(54.6927vw, -10px) scale(0.3289);
  animation: fall-172 22s -18s linear infinite;
}
@keyframes fall-172 {
  64.805% {
    transform: translate(58.1468vw, 64.805vh) scale(0.3289);
  }
  to {
    transform: translate(56.41975vw, 100vh) scale(0.3289);
  }
}
.snowdot:nth-child(173) {
  opacity: 0.7846;
  transform: translate(37.2687vw, -10px) scale(0.3106);
  animation: fall-173 15s -9s linear infinite;
}
@keyframes fall-173 {
  43.035% {
    transform: translate(38.8743vw, 43.035vh) scale(0.3106);
  }
  to {
    transform: translate(38.0715vw, 100vh) scale(0.3106);
  }
}
.snowdot:nth-child(174) {
  opacity: 0.2062;
  transform: translate(7.7049vw, -10px) scale(0.95);
  animation: fall-174 10s -4s linear infinite;
}
@keyframes fall-174 {
  67.279% {
    transform: translate(5.9776vw, 67.279vh) scale(0.95);
  }
  to {
    transform: translate(6.84125vw, 100vh) scale(0.95);
  }
}
.snowdot:nth-child(175) {
  opacity: 0.8115;
  transform: translate(9.936vw, -10px) scale(0.903);
  animation: fall-175 24s -25s linear infinite;
}
@keyframes fall-175 {
  58.279% {
    transform: translate(16.5448vw, 58.279vh) scale(0.903);
  }
  to {
    transform: translate(13.2404vw, 100vh) scale(0.903);
  }
}
.snowdot:nth-child(176) {
  opacity: 0.3775;
  transform: translate(39.2358vw, -10px) scale(0.3205);
  animation: fall-176 20s -14s linear infinite;
}
@keyframes fall-176 {
  70.607% {
    transform: translate(32.0294vw, 70.607vh) scale(0.3205);
  }
  to {
    transform: translate(35.6326vw, 100vh) scale(0.3205);
  }
}
.snowdot:nth-child(177) {
  opacity: 0.3556;
  transform: translate(98.9037vw, -10px) scale(0.0364);
  animation: fall-177 27s -14s linear infinite;
}
@keyframes fall-177 {
  32.054% {
    transform: translate(103.9562vw, 32.054vh) scale(0.0364);
  }
  to {
    transform: translate(101.42995vw, 100vh) scale(0.0364);
  }
}
.snowdot:nth-child(178) {
  opacity: 0.6072;
  transform: translate(70.4337vw, -10px) scale(0.7809);
  animation: fall-178 13s -16s linear infinite;
}
@keyframes fall-178 {
  33.249% {
    transform: translate(73.6394vw, 33.249vh) scale(0.7809);
  }
  to {
    transform: translate(72.03655vw, 100vh) scale(0.7809);
  }
}
.snowdot:nth-child(179) {
  opacity: 0.6831;
  transform: translate(25.3529vw, -10px) scale(0.2155);
  animation: fall-179 19s -3s linear infinite;
}
@keyframes fall-179 {
  61.704% {
    transform: translate(30.1704vw, 61.704vh) scale(0.2155);
  }
  to {
    transform: translate(27.76165vw, 100vh) scale(0.2155);
  }
}
.snowdot:nth-child(180) {
  opacity: 0.1521;
  transform: translate(84.3817vw, -10px) scale(0.7897);
  animation: fall-180 12s -22s linear infinite;
}
@keyframes fall-180 {
  43.612% {
    transform: translate(89.9586vw, 43.612vh) scale(0.7897);
  }
  to {
    transform: translate(87.17015vw, 100vh) scale(0.7897);
  }
}
.snowdot:nth-child(181) {
  opacity: 0.357;
  transform: translate(29.0409vw, -10px) scale(0.5523);
  animation: fall-181 13s -27s linear infinite;
}
@keyframes fall-181 {
  64.391% {
    transform: translate(23.6891vw, 64.391vh) scale(0.5523);
  }
  to {
    transform: translate(26.365vw, 100vh) scale(0.5523);
  }
}
.snowdot:nth-child(182) {
  opacity: 0.866;
  transform: translate(74.207vw, -10px) scale(0.762);
  animation: fall-182 13s -21s linear infinite;
}
@keyframes fall-182 {
  35.186% {
    transform: translate(79.147vw, 35.186vh) scale(0.762);
  }
  to {
    transform: translate(76.677vw, 100vh) scale(0.762);
  }
}
.snowdot:nth-child(183) {
  opacity: 0.1948;
  transform: translate(39.2323vw, -10px) scale(0.6272);
  animation: fall-183 24s -17s linear infinite;
}
@keyframes fall-183 {
  66.028% {
    transform: translate(42.0527vw, 66.028vh) scale(0.6272);
  }
  to {
    transform: translate(40.6425vw, 100vh) scale(0.6272);
  }
}
.snowdot:nth-child(184) {
  opacity: 0.6447;
  transform: translate(50.2824vw, -10px) scale(0.7949);
  animation: fall-184 20s -9s linear infinite;
}
@keyframes fall-184 {
  31.489% {
    transform: translate(48.9266vw, 31.489vh) scale(0.7949);
  }
  to {
    transform: translate(49.6045vw, 100vh) scale(0.7949);
  }
}
.snowdot:nth-child(185) {
  opacity: 0.3272;
  transform: translate(94.1651vw, -10px) scale(0.6664);
  animation: fall-185 30s -8s linear infinite;
}
@keyframes fall-185 {
  49.016% {
    transform: translate(92.2088vw, 49.016vh) scale(0.6664);
  }
  to {
    transform: translate(93.18695vw, 100vh) scale(0.6664);
  }
}
.snowdot:nth-child(186) {
  opacity: 0.3445;
  transform: translate(37.4138vw, -10px) scale(0.4171);
  animation: fall-186 15s -24s linear infinite;
}
@keyframes fall-186 {
  52.472% {
    transform: translate(34.0836vw, 52.472vh) scale(0.4171);
  }
  to {
    transform: translate(35.7487vw, 100vh) scale(0.4171);
  }
}
.snowdot:nth-child(187) {
  opacity: 0.6438;
  transform: translate(11.3699vw, -10px) scale(0.8383);
  animation: fall-187 26s -27s linear infinite;
}
@keyframes fall-187 {
  79.431% {
    transform: translate(13.7753vw, 79.431vh) scale(0.8383);
  }
  to {
    transform: translate(12.5726vw, 100vh) scale(0.8383);
  }
}
.snowdot:nth-child(188) {
  opacity: 0.9835;
  transform: translate(25.1713vw, -10px) scale(0.4286);
  animation: fall-188 29s -1s linear infinite;
}
@keyframes fall-188 {
  31.489% {
    transform: translate(26.0184vw, 31.489vh) scale(0.4286);
  }
  to {
    transform: translate(25.59485vw, 100vh) scale(0.4286);
  }
}
.snowdot:nth-child(189) {
  opacity: 0.7081;
  transform: translate(59.8883vw, -10px) scale(0.1939);
  animation: fall-189 16s -15s linear infinite;
}
@keyframes fall-189 {
  66.621% {
    transform: translate(54.3938vw, 66.621vh) scale(0.1939);
  }
  to {
    transform: translate(57.14105vw, 100vh) scale(0.1939);
  }
}
.snowdot:nth-child(190) {
  opacity: 0.9142;
  transform: translate(51.1011vw, -10px) scale(0.85);
  animation: fall-190 27s -6s linear infinite;
}
@keyframes fall-190 {
  69.634% {
    transform: translate(57.4487vw, 69.634vh) scale(0.85);
  }
  to {
    transform: translate(54.2749vw, 100vh) scale(0.85);
  }
}
.snowdot:nth-child(191) {
  opacity: 0.6545;
  transform: translate(94.8413vw, -10px) scale(0.068);
  animation: fall-191 21s -1s linear infinite;
}
@keyframes fall-191 {
  70.404% {
    transform: translate(103.4705vw, 70.404vh) scale(0.068);
  }
  to {
    transform: translate(99.1559vw, 100vh) scale(0.068);
  }
}
.snowdot:nth-child(192) {
  opacity: 0.3814;
  transform: translate(54.5538vw, -10px) scale(0.2282);
  animation: fall-192 10s -27s linear infinite;
}
@keyframes fall-192 {
  59.996% {
    transform: translate(53.6683vw, 59.996vh) scale(0.2282);
  }
  to {
    transform: translate(54.11105vw, 100vh) scale(0.2282);
  }
}
.snowdot:nth-child(193) {
  opacity: 0.2672;
  transform: translate(96.3814vw, -10px) scale(0.8448);
  animation: fall-193 19s -4s linear infinite;
}
@keyframes fall-193 {
  51.643% {
    transform: translate(88.4065vw, 51.643vh) scale(0.8448);
  }
  to {
    transform: translate(92.39395vw, 100vh) scale(0.8448);
  }
}
.snowdot:nth-child(194) {
  opacity: 0.8208;
  transform: translate(19.8884vw, -10px) scale(0.7156);
  animation: fall-194 27s -26s linear infinite;
}
@keyframes fall-194 {
  53.202% {
    transform: translate(20.5137vw, 53.202vh) scale(0.7156);
  }
  to {
    transform: translate(20.20105vw, 100vh) scale(0.7156);
  }
}
.snowdot:nth-child(195) {
  opacity: 0.0345;
  transform: translate(17.1508vw, -10px) scale(0.1011);
  animation: fall-195 15s -18s linear infinite;
}
@keyframes fall-195 {
  46.492% {
    transform: translate(11.4173vw, 46.492vh) scale(0.1011);
  }
  to {
    transform: translate(14.28405vw, 100vh) scale(0.1011);
  }
}

 

Please follow and like us: