From b49a76ee8d644f986ff7acc55431adad799c89cf Mon Sep 17 00:00:00 2001 From: Max Litruv Boonzaayer Date: Mon, 2 Dec 2024 17:40:24 +1100 Subject: [PATCH] snow --- index.html | 205 ++++- snow.css | 2609 ++++++++++++++++++++++++++++++++++++++++++++++++++++ style.css | 23 +- 3 files changed, 2814 insertions(+), 23 deletions(-) create mode 100644 snow.css diff --git a/index.html b/index.html index 04061bc..82bdccc 100644 --- a/index.html +++ b/index.html @@ -28,15 +28,218 @@ + Litruv - Dev/Tech Artist - + +
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Avatar

Litruv

diff --git a/snow.css b/snow.css new file mode 100644 index 0000000..80a9778 --- /dev/null +++ b/snow.css @@ -0,0 +1,2609 @@ + + +.snow { + position: absolute; + width: 10px; + height: 10px; + background: white; + border-radius: 50%; + } + .snow:nth-child(1) { + opacity: 0.5546; + transform: translate(97.2748vw, -10px) scale(0.1756); + animation: fall-1 12s -13s linear infinite; + } + @keyframes fall-1 { + 53.833% { + transform: translate(89.7378vw, 53.833vh) scale(0.1756); + } + to { + transform: translate(93.5063vw, 100vh) scale(0.1756); + } + } + .snow:nth-child(2) { + opacity: 0.458; + transform: translate(40.9746vw, -10px) scale(0.5567); + animation: fall-2 15s -22s linear infinite; + } + @keyframes fall-2 { + 76.15% { + transform: translate(41.7941vw, 76.15vh) scale(0.5567); + } + to { + transform: translate(41.38435vw, 100vh) scale(0.5567); + } + } + .snow:nth-child(3) { + opacity: 0.4187; + transform: translate(46.9453vw, -10px) scale(0.6774); + animation: fall-3 29s -5s linear infinite; + } + @keyframes fall-3 { + 43.274% { + transform: translate(55.1871vw, 43.274vh) scale(0.6774); + } + to { + transform: translate(51.0662vw, 100vh) scale(0.6774); + } + } + .snow:nth-child(4) { + opacity: 0.3688; + transform: translate(71.3262vw, -10px) scale(0.2084); + animation: fall-4 23s -10s linear infinite; + } + @keyframes fall-4 { + 71.377% { + transform: translate(63.6503vw, 71.377vh) scale(0.2084); + } + to { + transform: translate(67.48825vw, 100vh) scale(0.2084); + } + } + .snow:nth-child(5) { + opacity: 0.8301; + transform: translate(91.7546vw, -10px) scale(0.7292); + animation: fall-5 22s -7s linear infinite; + } + @keyframes fall-5 { + 39.205% { + transform: translate(101.0756vw, 39.205vh) scale(0.7292); + } + to { + transform: translate(96.4151vw, 100vh) scale(0.7292); + } + } + .snow:nth-child(6) { + opacity: 0.5661; + transform: translate(28.3872vw, -10px) scale(0.8499); + animation: fall-6 14s -16s linear infinite; + } + @keyframes fall-6 { + 73.762% { + transform: translate(36.7021vw, 73.762vh) scale(0.8499); + } + to { + transform: translate(32.54465vw, 100vh) scale(0.8499); + } + } + .snow:nth-child(7) { + opacity: 0.2141; + transform: translate(51.3089vw, -10px) scale(0.4437); + animation: fall-7 23s -7s linear infinite; + } + @keyframes fall-7 { + 75.693% { + transform: translate(58.4263vw, 75.693vh) scale(0.4437); + } + to { + transform: translate(54.8676vw, 100vh) scale(0.4437); + } + } + .snow:nth-child(8) { + opacity: 0.5083; + transform: translate(83.7824vw, -10px) scale(0.5241); + animation: fall-8 14s -6s linear infinite; + } + @keyframes fall-8 { + 41.314% { + transform: translate(91.4921vw, 41.314vh) scale(0.5241); + } + to { + transform: translate(87.63725vw, 100vh) scale(0.5241); + } + } + .snow:nth-child(9) { + opacity: 0.1355; + transform: translate(71.6272vw, -10px) scale(0.2374); + animation: fall-9 24s -30s linear infinite; + } + @keyframes fall-9 { + 39.018% { + transform: translate(70.7345vw, 39.018vh) scale(0.2374); + } + to { + transform: translate(71.18085vw, 100vh) scale(0.2374); + } + } + .snow:nth-child(10) { + opacity: 0.7238; + transform: translate(25.79vw, -10px) scale(0.0617); + animation: fall-10 24s -19s linear infinite; + } + @keyframes fall-10 { + 64.75% { + transform: translate(30.5534vw, 64.75vh) scale(0.0617); + } + to { + transform: translate(28.1717vw, 100vh) scale(0.0617); + } + } + .snow:nth-child(11) { + opacity: 0.4448; + transform: translate(78.3293vw, -10px) scale(0.3391); + animation: fall-11 27s -18s linear infinite; + } + @keyframes fall-11 { + 39.247% { + transform: translate(75.711vw, 39.247vh) scale(0.3391); + } + to { + transform: translate(77.02015vw, 100vh) scale(0.3391); + } + } + .snow:nth-child(12) { + opacity: 0.2825; + transform: translate(99.7779vw, -10px) scale(0.3635); + animation: fall-12 17s -8s linear infinite; + } + @keyframes fall-12 { + 63.311% { + transform: translate(105.4746vw, 63.311vh) scale(0.3635); + } + to { + transform: translate(102.62625vw, 100vh) scale(0.3635); + } + } + .snow:nth-child(13) { + opacity: 0.7141; + transform: translate(54.2306vw, -10px) scale(0.1567); + animation: fall-13 16s -5s linear infinite; + } + @keyframes fall-13 { + 63.285% { + transform: translate(49.4733vw, 63.285vh) scale(0.1567); + } + to { + transform: translate(51.85195vw, 100vh) scale(0.1567); + } + } + .snow:nth-child(14) { + opacity: 0.5165; + transform: translate(11.6324vw, -10px) scale(0.3034); + animation: fall-14 19s -30s linear infinite; + } + @keyframes fall-14 { + 73.018% { + transform: translate(17.8412vw, 73.018vh) scale(0.3034); + } + to { + transform: translate(14.7368vw, 100vh) scale(0.3034); + } + } + .snow:nth-child(15) { + opacity: 0.1381; + transform: translate(43.3372vw, -10px) scale(0.4143); + animation: fall-15 25s -19s linear infinite; + } + @keyframes fall-15 { + 57.762% { + transform: translate(40.9329vw, 57.762vh) scale(0.4143); + } + to { + transform: translate(42.13505vw, 100vh) scale(0.4143); + } + } + .snow:nth-child(16) { + opacity: 0.153; + transform: translate(27.7108vw, -10px) scale(0.9823); + animation: fall-16 28s -5s linear infinite; + } + @keyframes fall-16 { + 70.79% { + transform: translate(35.6487vw, 70.79vh) scale(0.9823); + } + to { + transform: translate(31.67975vw, 100vh) scale(0.9823); + } + } + .snow:nth-child(17) { + opacity: 0.3121; + transform: translate(9.5111vw, -10px) scale(0.5193); + animation: fall-17 12s -25s linear infinite; + } + @keyframes fall-17 { + 50.755% { + transform: translate(11.1805vw, 50.755vh) scale(0.5193); + } + to { + transform: translate(10.3458vw, 100vh) scale(0.5193); + } + } + .snow:nth-child(18) { + opacity: 0.2874; + transform: translate(16.6533vw, -10px) scale(0.0581); + animation: fall-18 25s -7s linear infinite; + } + @keyframes fall-18 { + 65.486% { + transform: translate(18.4286vw, 65.486vh) scale(0.0581); + } + to { + transform: translate(17.54095vw, 100vh) scale(0.0581); + } + } + .snow:nth-child(19) { + opacity: 0.5692; + transform: translate(14.3832vw, -10px) scale(0.3508); + animation: fall-19 22s -7s linear infinite; + } + @keyframes fall-19 { + 79.212% { + transform: translate(16.158vw, 79.212vh) scale(0.3508); + } + to { + transform: translate(15.2706vw, 100vh) scale(0.3508); + } + } + .snow:nth-child(20) { + opacity: 0.9563; + transform: translate(80.2862vw, -10px) scale(0.2206); + animation: fall-20 29s -23s linear infinite; + } + @keyframes fall-20 { + 50.059% { + transform: translate(71.0302vw, 50.059vh) scale(0.2206); + } + to { + transform: translate(75.6582vw, 100vh) scale(0.2206); + } + } + .snow:nth-child(21) { + opacity: 0.9459; + transform: translate(53.6496vw, -10px) scale(0.9296); + animation: fall-21 20s -28s linear infinite; + } + @keyframes fall-21 { + 38.483% { + transform: translate(52.1915vw, 38.483vh) scale(0.9296); + } + to { + transform: translate(52.92055vw, 100vh) scale(0.9296); + } + } + .snow:nth-child(22) { + opacity: 0.9869; + transform: translate(95.9271vw, -10px) scale(0.3816); + animation: fall-22 28s -5s linear infinite; + } + @keyframes fall-22 { + 32.671% { + transform: translate(98.911vw, 32.671vh) scale(0.3816); + } + to { + transform: translate(97.41905vw, 100vh) scale(0.3816); + } + } + .snow:nth-child(23) { + opacity: 0.4848; + transform: translate(79.9113vw, -10px) scale(0.4605); + animation: fall-23 16s -3s linear infinite; + } + @keyframes fall-23 { + 31.434% { + transform: translate(73.0489vw, 31.434vh) scale(0.4605); + } + to { + transform: translate(76.4801vw, 100vh) scale(0.4605); + } + } + .snow:nth-child(24) { + opacity: 0.9335; + transform: translate(64.311vw, -10px) scale(0.4752); + animation: fall-24 12s -28s linear infinite; + } + @keyframes fall-24 { + 55.228% { + transform: translate(70.641vw, 55.228vh) scale(0.4752); + } + to { + transform: translate(67.476vw, 100vh) scale(0.4752); + } + } + .snow:nth-child(25) { + opacity: 0.6791; + transform: translate(13.0098vw, -10px) scale(0.304); + animation: fall-25 20s -6s linear infinite; + } + @keyframes fall-25 { + 49.911% { + transform: translate(21.217vw, 49.911vh) scale(0.304); + } + to { + transform: translate(17.1134vw, 100vh) scale(0.304); + } + } + .snow:nth-child(26) { + opacity: 0.4583; + transform: translate(41.6999vw, -10px) scale(0.1741); + animation: fall-26 30s -6s linear infinite; + } + @keyframes fall-26 { + 55.381% { + transform: translate(32.2759vw, 55.381vh) scale(0.1741); + } + to { + transform: translate(36.9879vw, 100vh) scale(0.1741); + } + } + .snow:nth-child(27) { + opacity: 0.4859; + transform: translate(43.6878vw, -10px) scale(0.0091); + animation: fall-27 27s -17s linear infinite; + } + @keyframes fall-27 { + 55.366% { + transform: translate(49.1073vw, 55.366vh) scale(0.0091); + } + to { + transform: translate(46.39755vw, 100vh) scale(0.0091); + } + } + .snow:nth-child(28) { + opacity: 0.4835; + transform: translate(49.3146vw, -10px) scale(0.4134); + animation: fall-28 27s -11s linear infinite; + } + @keyframes fall-28 { + 63.231% { + transform: translate(46.5458vw, 63.231vh) scale(0.4134); + } + to { + transform: translate(47.9302vw, 100vh) scale(0.4134); + } + } + .snow:nth-child(29) { + opacity: 0.4351; + transform: translate(31.3531vw, -10px) scale(0.77); + animation: fall-29 20s -21s linear infinite; + } + @keyframes fall-29 { + 77.206% { + transform: translate(36.3626vw, 77.206vh) scale(0.77); + } + to { + transform: translate(33.85785vw, 100vh) scale(0.77); + } + } + .snow:nth-child(30) { + opacity: 0.9666; + transform: translate(57.7866vw, -10px) scale(0.6583); + animation: fall-30 20s -14s linear infinite; + } + @keyframes fall-30 { + 63.755% { + transform: translate(50.1504vw, 63.755vh) scale(0.6583); + } + to { + transform: translate(53.9685vw, 100vh) scale(0.6583); + } + } + .snow:nth-child(31) { + opacity: 0.5877; + transform: translate(31.499vw, -10px) scale(0.9863); + animation: fall-31 16s -15s linear infinite; + } + @keyframes fall-31 { + 53.066% { + transform: translate(39.1565vw, 53.066vh) scale(0.9863); + } + to { + transform: translate(35.32775vw, 100vh) scale(0.9863); + } + } + .snow:nth-child(32) { + opacity: 0.7366; + transform: translate(50.7423vw, -10px) scale(0.6835); + animation: fall-32 13s -6s linear infinite; + } + @keyframes fall-32 { + 63.204% { + transform: translate(43.7456vw, 63.204vh) scale(0.6835); + } + to { + transform: translate(47.24395vw, 100vh) scale(0.6835); + } + } + .snow:nth-child(33) { + opacity: 0.0299; + transform: translate(6.3623vw, -10px) scale(0.5389); + animation: fall-33 14s -3s linear infinite; + } + @keyframes fall-33 { + 37.552% { + transform: translate(4.7832vw, 37.552vh) scale(0.5389); + } + to { + transform: translate(5.57275vw, 100vh) scale(0.5389); + } + } + .snow:nth-child(34) { + opacity: 0.2287; + transform: translate(98.5693vw, -10px) scale(0.348); + animation: fall-34 11s -1s linear infinite; + } + @keyframes fall-34 { + 54.6% { + transform: translate(95.7875vw, 54.6vh) scale(0.348); + } + to { + transform: translate(97.1784vw, 100vh) scale(0.348); + } + } + .snow:nth-child(35) { + opacity: 0.263; + transform: translate(94.5771vw, -10px) scale(0.5294); + animation: fall-35 12s -7s linear infinite; + } + @keyframes fall-35 { + 69.121% { + transform: translate(94.3092vw, 69.121vh) scale(0.5294); + } + to { + transform: translate(94.44315vw, 100vh) scale(0.5294); + } + } + .snow:nth-child(36) { + opacity: 0.2617; + transform: translate(3.3501vw, -10px) scale(0.0661); + animation: fall-36 22s -22s linear infinite; + } + @keyframes fall-36 { + 77.132% { + transform: translate(11.2073vw, 77.132vh) scale(0.0661); + } + to { + transform: translate(7.2787vw, 100vh) scale(0.0661); + } + } + .snow:nth-child(37) { + opacity: 0.0511; + transform: translate(69.4258vw, -10px) scale(0.8717); + animation: fall-37 16s -12s linear infinite; + } + @keyframes fall-37 { + 32.799% { + transform: translate(65.9182vw, 32.799vh) scale(0.8717); + } + to { + transform: translate(67.672vw, 100vh) scale(0.8717); + } + } + .snow:nth-child(38) { + opacity: 0.0145; + transform: translate(96.9205vw, -10px) scale(0.0189); + animation: fall-38 15s -17s linear infinite; + } + @keyframes fall-38 { + 78.733% { + transform: translate(104.0001vw, 78.733vh) scale(0.0189); + } + to { + transform: translate(100.4603vw, 100vh) scale(0.0189); + } + } + .snow:nth-child(39) { + opacity: 0.4407; + transform: translate(28.5338vw, -10px) scale(0.9896); + animation: fall-39 27s -28s linear infinite; + } + @keyframes fall-39 { + 33.047% { + transform: translate(31.0332vw, 33.047vh) scale(0.9896); + } + to { + transform: translate(29.7835vw, 100vh) scale(0.9896); + } + } + .snow:nth-child(40) { + opacity: 0.195; + transform: translate(45.6462vw, -10px) scale(0.5708); + animation: fall-40 29s -21s linear infinite; + } + @keyframes fall-40 { + 31.396% { + transform: translate(48.0866vw, 31.396vh) scale(0.5708); + } + to { + transform: translate(46.8664vw, 100vh) scale(0.5708); + } + } + .snow:nth-child(41) { + opacity: 0.0362; + transform: translate(48.7788vw, -10px) scale(0.997); + animation: fall-41 24s -21s linear infinite; + } + @keyframes fall-41 { + 64.586% { + transform: translate(46.7347vw, 64.586vh) scale(0.997); + } + to { + transform: translate(47.75675vw, 100vh) scale(0.997); + } + } + .snow:nth-child(42) { + opacity: 0.0714; + transform: translate(12.5431vw, -10px) scale(0.0787); + animation: fall-42 17s -21s linear infinite; + } + @keyframes fall-42 { + 30.955% { + transform: translate(12.9529vw, 30.955vh) scale(0.0787); + } + to { + transform: translate(12.748vw, 100vh) scale(0.0787); + } + } + .snow:nth-child(43) { + opacity: 0.724; + transform: translate(47.3656vw, -10px) scale(0.5226); + animation: fall-43 14s -5s linear infinite; + } + @keyframes fall-43 { + 49.609% { + transform: translate(47.7088vw, 49.609vh) scale(0.5226); + } + to { + transform: translate(47.5372vw, 100vh) scale(0.5226); + } + } + .snow:nth-child(44) { + opacity: 0.0646; + transform: translate(61.2355vw, -10px) scale(0.4184); + animation: fall-44 20s -24s linear infinite; + } + @keyframes fall-44 { + 61.173% { + transform: translate(57.0258vw, 61.173vh) scale(0.4184); + } + to { + transform: translate(59.13065vw, 100vh) scale(0.4184); + } + } + .snow:nth-child(45) { + opacity: 0.6456; + transform: translate(87.1066vw, -10px) scale(0.5625); + animation: fall-45 23s -29s linear infinite; + } + @keyframes fall-45 { + 76.698% { + transform: translate(79.6369vw, 76.698vh) scale(0.5625); + } + to { + transform: translate(83.37175vw, 100vh) scale(0.5625); + } + } + .snow:nth-child(46) { + opacity: 0.6724; + transform: translate(71.9233vw, -10px) scale(0.813); + animation: fall-46 18s -17s linear infinite; + } + @keyframes fall-46 { + 68.963% { + transform: translate(67.4736vw, 68.963vh) scale(0.813); + } + to { + transform: translate(69.69845vw, 100vh) scale(0.813); + } + } + .snow:nth-child(47) { + opacity: 0.4983; + transform: translate(89.6758vw, -10px) scale(0.3159); + animation: fall-47 28s -22s linear infinite; + } + @keyframes fall-47 { + 38.114% { + transform: translate(79.9094vw, 38.114vh) scale(0.3159); + } + to { + transform: translate(84.7926vw, 100vh) scale(0.3159); + } + } + .snow:nth-child(48) { + opacity: 0.612; + transform: translate(0.2163vw, -10px) scale(0.39); + animation: fall-48 22s -22s linear infinite; + } + @keyframes fall-48 { + 31.359% { + transform: translate(4.3309vw, 31.359vh) scale(0.39); + } + to { + transform: translate(2.2736vw, 100vh) scale(0.39); + } + } + .snow:nth-child(49) { + opacity: 0.9962; + transform: translate(46.4569vw, -10px) scale(0.2725); + animation: fall-49 19s -9s linear infinite; + } + @keyframes fall-49 { + 42.989% { + transform: translate(38.0194vw, 42.989vh) scale(0.2725); + } + to { + transform: translate(42.23815vw, 100vh) scale(0.2725); + } + } + .snow:nth-child(50) { + opacity: 0.5179; + transform: translate(71.556vw, -10px) scale(0.2529); + animation: fall-50 18s -20s linear infinite; + } + @keyframes fall-50 { + 75.989% { + transform: translate(64.0233vw, 75.989vh) scale(0.2529); + } + to { + transform: translate(67.78965vw, 100vh) scale(0.2529); + } + } + .snow:nth-child(51) { + opacity: 0.6012; + transform: translate(17.0604vw, -10px) scale(0.7431); + animation: fall-51 28s -4s linear infinite; + } + @keyframes fall-51 { + 44.65% { + transform: translate(7.6688vw, 44.65vh) scale(0.7431); + } + to { + transform: translate(12.3646vw, 100vh) scale(0.7431); + } + } + .snow:nth-child(52) { + opacity: 0.1209; + transform: translate(86.0817vw, -10px) scale(0.1868); + animation: fall-52 27s -26s linear infinite; + } + @keyframes fall-52 { + 79.24% { + transform: translate(90.5983vw, 79.24vh) scale(0.1868); + } + to { + transform: translate(88.34vw, 100vh) scale(0.1868); + } + } + .snow:nth-child(53) { + opacity: 0.7657; + transform: translate(89.0378vw, -10px) scale(0.7841); + animation: fall-53 17s -9s linear infinite; + } + @keyframes fall-53 { + 42.862% { + transform: translate(90.3405vw, 42.862vh) scale(0.7841); + } + to { + transform: translate(89.68915vw, 100vh) scale(0.7841); + } + } + .snow:nth-child(54) { + opacity: 0.4422; + transform: translate(52.7555vw, -10px) scale(0.5229); + animation: fall-54 30s -18s linear infinite; + } + @keyframes fall-54 { + 54.067% { + transform: translate(56.087vw, 54.067vh) scale(0.5229); + } + to { + transform: translate(54.42125vw, 100vh) scale(0.5229); + } + } + .snow:nth-child(55) { + opacity: 0.1765; + transform: translate(48.3526vw, -10px) scale(0.6496); + animation: fall-55 25s -18s linear infinite; + } + @keyframes fall-55 { + 77.128% { + transform: translate(50.0016vw, 77.128vh) scale(0.6496); + } + to { + transform: translate(49.1771vw, 100vh) scale(0.6496); + } + } + .snow:nth-child(56) { + opacity: 0.3815; + transform: translate(17.9194vw, -10px) scale(0.9939); + animation: fall-56 13s -9s linear infinite; + } + @keyframes fall-56 { + 55.699% { + transform: translate(13.4566vw, 55.699vh) scale(0.9939); + } + to { + transform: translate(15.688vw, 100vh) scale(0.9939); + } + } + .snow:nth-child(57) { + opacity: 0.0514; + transform: translate(28.3616vw, -10px) scale(0.1088); + animation: fall-57 24s -8s linear infinite; + } + @keyframes fall-57 { + 31.69% { + transform: translate(32.0416vw, 31.69vh) scale(0.1088); + } + to { + transform: translate(30.2016vw, 100vh) scale(0.1088); + } + } + .snow:nth-child(58) { + opacity: 0.698; + transform: translate(19.4029vw, -10px) scale(0.7824); + animation: fall-58 14s -18s linear infinite; + } + @keyframes fall-58 { + 72.781% { + transform: translate(15.641vw, 72.781vh) scale(0.7824); + } + to { + transform: translate(17.52195vw, 100vh) scale(0.7824); + } + } + .snow:nth-child(59) { + opacity: 0.6525; + transform: translate(15.7341vw, -10px) scale(0.3282); + animation: fall-59 27s -26s linear infinite; + } + @keyframes fall-59 { + 64.61% { + transform: translate(14.1233vw, 64.61vh) scale(0.3282); + } + to { + transform: translate(14.9287vw, 100vh) scale(0.3282); + } + } + .snow:nth-child(60) { + opacity: 0.1482; + transform: translate(71.6676vw, -10px) scale(0.3259); + animation: fall-60 26s -1s linear infinite; + } + @keyframes fall-60 { + 47.104% { + transform: translate(77.5682vw, 47.104vh) scale(0.3259); + } + to { + transform: translate(74.6179vw, 100vh) scale(0.3259); + } + } + .snow:nth-child(61) { + opacity: 0.7992; + transform: translate(35.6726vw, -10px) scale(0.061); + animation: fall-61 18s -7s linear infinite; + } + @keyframes fall-61 { + 69.793% { + transform: translate(30.6109vw, 69.793vh) scale(0.061); + } + to { + transform: translate(33.14175vw, 100vh) scale(0.061); + } + } + .snow:nth-child(62) { + opacity: 0.343; + transform: translate(71.2185vw, -10px) scale(0.9242); + animation: fall-62 10s -4s linear infinite; + } + @keyframes fall-62 { + 64.574% { + transform: translate(74.1804vw, 64.574vh) scale(0.9242); + } + to { + transform: translate(72.69945vw, 100vh) scale(0.9242); + } + } + .snow:nth-child(63) { + opacity: 0.9252; + transform: translate(4.0058vw, -10px) scale(0.2081); + animation: fall-63 29s -24s linear infinite; + } + @keyframes fall-63 { + 60.334% { + transform: translate(-2.3813vw, 60.334vh) scale(0.2081); + } + to { + transform: translate(0.81225vw, 100vh) scale(0.2081); + } + } + .snow:nth-child(64) { + opacity: 0.2001; + transform: translate(16.0361vw, -10px) scale(0.9397); + animation: fall-64 30s -28s linear infinite; + } + @keyframes fall-64 { + 35.855% { + transform: translate(10.0237vw, 35.855vh) scale(0.9397); + } + to { + transform: translate(13.0299vw, 100vh) scale(0.9397); + } + } + .snow:nth-child(65) { + opacity: 0.2187; + transform: translate(0.6434vw, -10px) scale(0.2176); + animation: fall-65 18s -10s linear infinite; + } + @keyframes fall-65 { + 66.659% { + transform: translate(-5.6282vw, 66.659vh) scale(0.2176); + } + to { + transform: translate(-2.4924vw, 100vh) scale(0.2176); + } + } + .snow:nth-child(66) { + opacity: 0.508; + transform: translate(14.1905vw, -10px) scale(0.5611); + animation: fall-66 17s -7s linear infinite; + } + @keyframes fall-66 { + 33.203% { + transform: translate(22.8772vw, 33.203vh) scale(0.5611); + } + to { + transform: translate(18.53385vw, 100vh) scale(0.5611); + } + } + .snow:nth-child(67) { + opacity: 0.9806; + transform: translate(77.7428vw, -10px) scale(0.2155); + animation: fall-67 26s -30s linear infinite; + } + @keyframes fall-67 { + 47.883% { + transform: translate(87.4816vw, 47.883vh) scale(0.2155); + } + to { + transform: translate(82.6122vw, 100vh) scale(0.2155); + } + } + .snow:nth-child(68) { + opacity: 0.2725; + transform: translate(22.6611vw, -10px) scale(0.663); + animation: fall-68 28s -5s linear infinite; + } + @keyframes fall-68 { + 62.766% { + transform: translate(28.8335vw, 62.766vh) scale(0.663); + } + to { + transform: translate(25.7473vw, 100vh) scale(0.663); + } + } + .snow:nth-child(69) { + opacity: 0.7875; + transform: translate(70.3463vw, -10px) scale(0.5929); + animation: fall-69 11s -23s linear infinite; + } + @keyframes fall-69 { + 77.1% { + transform: translate(61.3582vw, 77.1vh) scale(0.5929); + } + to { + transform: translate(65.85225vw, 100vh) scale(0.5929); + } + } + .snow:nth-child(70) { + opacity: 0.6964; + transform: translate(60.0707vw, -10px) scale(0.8234); + animation: fall-70 10s -24s linear infinite; + } + @keyframes fall-70 { + 71.868% { + transform: translate(56.6116vw, 71.868vh) scale(0.8234); + } + to { + transform: translate(58.34115vw, 100vh) scale(0.8234); + } + } + .snow:nth-child(71) { + opacity: 0.347; + transform: translate(15.6923vw, -10px) scale(0.4859); + animation: fall-71 28s -29s linear infinite; + } + @keyframes fall-71 { + 40.38% { + transform: translate(11.246vw, 40.38vh) scale(0.4859); + } + to { + transform: translate(13.46915vw, 100vh) scale(0.4859); + } + } + .snow:nth-child(72) { + opacity: 0.5285; + transform: translate(40.6442vw, -10px) scale(0.0196); + animation: fall-72 23s -14s linear infinite; + } + @keyframes fall-72 { + 34.922% { + transform: translate(32.5744vw, 34.922vh) scale(0.0196); + } + to { + transform: translate(36.6093vw, 100vh) scale(0.0196); + } + } + .snow:nth-child(73) { + opacity: 0.0713; + transform: translate(61.1659vw, -10px) scale(0.7252); + animation: fall-73 14s -24s linear infinite; + } + @keyframes fall-73 { + 76.978% { + transform: translate(64.6366vw, 76.978vh) scale(0.7252); + } + to { + transform: translate(62.90125vw, 100vh) scale(0.7252); + } + } + .snow:nth-child(74) { + opacity: 0.0576; + transform: translate(92.8929vw, -10px) scale(0.1183); + animation: fall-74 14s -4s linear infinite; + } + @keyframes fall-74 { + 64.965% { + transform: translate(89.3269vw, 64.965vh) scale(0.1183); + } + to { + transform: translate(91.1099vw, 100vh) scale(0.1183); + } + } + .snow:nth-child(75) { + opacity: 0.5244; + transform: translate(93.5196vw, -10px) scale(0.8005); + animation: fall-75 12s -17s linear infinite; + } + @keyframes fall-75 { + 38.411% { + transform: translate(98.3139vw, 38.411vh) scale(0.8005); + } + to { + transform: translate(95.91675vw, 100vh) scale(0.8005); + } + } + .snow:nth-child(76) { + opacity: 0.1897; + transform: translate(41.649vw, -10px) scale(0.9901); + animation: fall-76 13s -11s linear infinite; + } + @keyframes fall-76 { + 53.414% { + transform: translate(33.4995vw, 53.414vh) scale(0.9901); + } + to { + transform: translate(37.57425vw, 100vh) scale(0.9901); + } + } + .snow:nth-child(77) { + opacity: 0.3966; + transform: translate(13.7979vw, -10px) scale(0.1236); + animation: fall-77 11s -16s linear infinite; + } + @keyframes fall-77 { + 62.271% { + transform: translate(4.7703vw, 62.271vh) scale(0.1236); + } + to { + transform: translate(9.2841vw, 100vh) scale(0.1236); + } + } + .snow:nth-child(78) { + opacity: 0.5979; + transform: translate(51.0221vw, -10px) scale(0.2353); + animation: fall-78 13s -26s linear infinite; + } + @keyframes fall-78 { + 61.31% { + transform: translate(56.4398vw, 61.31vh) scale(0.2353); + } + to { + transform: translate(53.73095vw, 100vh) scale(0.2353); + } + } + .snow:nth-child(79) { + opacity: 0.7087; + transform: translate(59.7984vw, -10px) scale(0.9522); + animation: fall-79 11s -23s linear infinite; + } + @keyframes fall-79 { + 69.863% { + transform: translate(56.5499vw, 69.863vh) scale(0.9522); + } + to { + transform: translate(58.17415vw, 100vh) scale(0.9522); + } + } + .snow:nth-child(80) { + opacity: 0.8692; + transform: translate(7.0373vw, -10px) scale(0.0555); + animation: fall-80 13s -4s linear infinite; + } + @keyframes fall-80 { + 40.611% { + transform: translate(7.5889vw, 40.611vh) scale(0.0555); + } + to { + transform: translate(7.3131vw, 100vh) scale(0.0555); + } + } + .snow:nth-child(81) { + opacity: 0.6234; + transform: translate(50.4569vw, -10px) scale(0.4248); + animation: fall-81 10s -1s linear infinite; + } + @keyframes fall-81 { + 46.981% { + transform: translate(48.9673vw, 46.981vh) scale(0.4248); + } + to { + transform: translate(49.7121vw, 100vh) scale(0.4248); + } + } + .snow:nth-child(82) { + opacity: 0.267; + transform: translate(37.5673vw, -10px) scale(0.0957); + animation: fall-82 24s -8s linear infinite; + } + @keyframes fall-82 { + 30.425% { + transform: translate(33.084vw, 30.425vh) scale(0.0957); + } + to { + transform: translate(35.32565vw, 100vh) scale(0.0957); + } + } + .snow:nth-child(83) { + opacity: 0.8498; + transform: translate(88.4314vw, -10px) scale(0.6541); + animation: fall-83 22s -27s linear infinite; + } + @keyframes fall-83 { + 56.444% { + transform: translate(95.8227vw, 56.444vh) scale(0.6541); + } + to { + transform: translate(92.12705vw, 100vh) scale(0.6541); + } + } + .snow:nth-child(84) { + opacity: 0.2044; + transform: translate(95.7125vw, -10px) scale(0.9219); + animation: fall-84 15s -11s linear infinite; + } + @keyframes fall-84 { + 74.845% { + transform: translate(93.1507vw, 74.845vh) scale(0.9219); + } + to { + transform: translate(94.4316vw, 100vh) scale(0.9219); + } + } + .snow:nth-child(85) { + opacity: 0.1232; + transform: translate(81.4376vw, -10px) scale(0.2621); + animation: fall-85 18s -27s linear infinite; + } + @keyframes fall-85 { + 34.967% { + transform: translate(88.1742vw, 34.967vh) scale(0.2621); + } + to { + transform: translate(84.8059vw, 100vh) scale(0.2621); + } + } + .snow:nth-child(86) { + opacity: 0.2529; + transform: translate(37.332vw, -10px) scale(0.5587); + animation: fall-86 14s -20s linear infinite; + } + @keyframes fall-86 { + 31.83% { + transform: translate(32.1778vw, 31.83vh) scale(0.5587); + } + to { + transform: translate(34.7549vw, 100vh) scale(0.5587); + } + } + .snow:nth-child(87) { + opacity: 0.8703; + transform: translate(85.8722vw, -10px) scale(0.6785); + animation: fall-87 14s -14s linear infinite; + } + @keyframes fall-87 { + 37.583% { + transform: translate(89.3445vw, 37.583vh) scale(0.6785); + } + to { + transform: translate(87.60835vw, 100vh) scale(0.6785); + } + } + .snow:nth-child(88) { + opacity: 0.5983; + transform: translate(77.4073vw, -10px) scale(0.1877); + animation: fall-88 15s -25s linear infinite; + } + @keyframes fall-88 { + 40.653% { + transform: translate(80.0382vw, 40.653vh) scale(0.1877); + } + to { + transform: translate(78.72275vw, 100vh) scale(0.1877); + } + } + .snow:nth-child(89) { + opacity: 0.4796; + transform: translate(90.7679vw, -10px) scale(0.5293); + animation: fall-89 26s -7s linear infinite; + } + @keyframes fall-89 { + 33.376% { + transform: translate(85.7093vw, 33.376vh) scale(0.5293); + } + to { + transform: translate(88.2386vw, 100vh) scale(0.5293); + } + } + .snow:nth-child(90) { + opacity: 0.1264; + transform: translate(57.2407vw, -10px) scale(0.4352); + animation: fall-90 17s -20s linear infinite; + } + @keyframes fall-90 { + 48.866% { + transform: translate(57.0499vw, 48.866vh) scale(0.4352); + } + to { + transform: translate(57.1453vw, 100vh) scale(0.4352); + } + } + .snow:nth-child(91) { + opacity: 0.1315; + transform: translate(50.7702vw, -10px) scale(0.3254); + animation: fall-91 27s -30s linear infinite; + } + @keyframes fall-91 { + 52.193% { + transform: translate(54.9962vw, 52.193vh) scale(0.3254); + } + to { + transform: translate(52.8832vw, 100vh) scale(0.3254); + } + } + .snow:nth-child(92) { + opacity: 0.3628; + transform: translate(82.9471vw, -10px) scale(0.3623); + animation: fall-92 24s -19s linear infinite; + } + @keyframes fall-92 { + 44.496% { + transform: translate(83.9985vw, 44.496vh) scale(0.3623); + } + to { + transform: translate(83.4728vw, 100vh) scale(0.3623); + } + } + .snow:nth-child(93) { + opacity: 0.0783; + transform: translate(70.1505vw, -10px) scale(0.4761); + animation: fall-93 30s -21s linear infinite; + } + @keyframes fall-93 { + 45.337% { + transform: translate(78.0005vw, 45.337vh) scale(0.4761); + } + to { + transform: translate(74.0755vw, 100vh) scale(0.4761); + } + } + .snow:nth-child(94) { + opacity: 0.5458; + transform: translate(58.8037vw, -10px) scale(0.3416); + animation: fall-94 13s -30s linear infinite; + } + @keyframes fall-94 { + 59.761% { + transform: translate(57.6895vw, 59.761vh) scale(0.3416); + } + to { + transform: translate(58.2466vw, 100vh) scale(0.3416); + } + } + .snow:nth-child(95) { + opacity: 0.1909; + transform: translate(14.2279vw, -10px) scale(0.8687); + animation: fall-95 30s -9s linear infinite; + } + @keyframes fall-95 { + 71.654% { + transform: translate(19.5258vw, 71.654vh) scale(0.8687); + } + to { + transform: translate(16.87685vw, 100vh) scale(0.8687); + } + } + .snow:nth-child(96) { + opacity: 0.0538; + transform: translate(79.5497vw, -10px) scale(0.5164); + animation: fall-96 11s -2s linear infinite; + } + @keyframes fall-96 { + 52.737% { + transform: translate(75.8114vw, 52.737vh) scale(0.5164); + } + to { + transform: translate(77.68055vw, 100vh) scale(0.5164); + } + } + .snow:nth-child(97) { + opacity: 0.6961; + transform: translate(29.7308vw, -10px) scale(0.6834); + animation: fall-97 22s -8s linear infinite; + } + @keyframes fall-97 { + 69.43% { + transform: translate(30.9957vw, 69.43vh) scale(0.6834); + } + to { + transform: translate(30.36325vw, 100vh) scale(0.6834); + } + } + .snow:nth-child(98) { + opacity: 0.0901; + transform: translate(6.5945vw, -10px) scale(0.1504); + animation: fall-98 22s -8s linear infinite; + } + @keyframes fall-98 { + 50.492% { + transform: translate(10.9336vw, 50.492vh) scale(0.1504); + } + to { + transform: translate(8.76405vw, 100vh) scale(0.1504); + } + } + .snow:nth-child(99) { + opacity: 0.1443; + transform: translate(51.9816vw, -10px) scale(0.532); + animation: fall-99 12s -10s linear infinite; + } + @keyframes fall-99 { + 73.769% { + transform: translate(50.798vw, 73.769vh) scale(0.532); + } + to { + transform: translate(51.3898vw, 100vh) scale(0.532); + } + } + .snow:nth-child(100) { + opacity: 0.2249; + transform: translate(41.3111vw, -10px) scale(0.1792); + animation: fall-100 19s -20s linear infinite; + } + @keyframes fall-100 { + 35.933% { + transform: translate(37.3077vw, 35.933vh) scale(0.1792); + } + to { + transform: translate(39.3094vw, 100vh) scale(0.1792); + } + } + .snow:nth-child(101) { + opacity: 0.9742; + transform: translate(14.4333vw, -10px) scale(0.7184); + animation: fall-101 20s -9s linear infinite; + } + @keyframes fall-101 { + 73.33% { + transform: translate(10.8745vw, 73.33vh) scale(0.7184); + } + to { + transform: translate(12.6539vw, 100vh) scale(0.7184); + } + } + .snow:nth-child(102) { + opacity: 0.5921; + transform: translate(65.4896vw, -10px) scale(0.5526); + animation: fall-102 21s -27s linear infinite; + } + @keyframes fall-102 { + 36.371% { + transform: translate(61.572vw, 36.371vh) scale(0.5526); + } + to { + transform: translate(63.5308vw, 100vh) scale(0.5526); + } + } + .snow:nth-child(103) { + opacity: 0.5974; + transform: translate(76.319vw, -10px) scale(0.4754); + animation: fall-103 21s -2s linear infinite; + } + @keyframes fall-103 { + 56.62% { + transform: translate(69.7167vw, 56.62vh) scale(0.4754); + } + to { + transform: translate(73.01785vw, 100vh) scale(0.4754); + } + } + .snow:nth-child(104) { + opacity: 0.2802; + transform: translate(24.1255vw, -10px) scale(0.5851); + animation: fall-104 13s -20s linear infinite; + } + @keyframes fall-104 { + 77.077% { + transform: translate(15.7828vw, 77.077vh) scale(0.5851); + } + to { + transform: translate(19.95415vw, 100vh) scale(0.5851); + } + } + .snow:nth-child(105) { + opacity: 0.1201; + transform: translate(87.9336vw, -10px) scale(0.4796); + animation: fall-105 11s -5s linear infinite; + } + @keyframes fall-105 { + 53.574% { + transform: translate(83.1507vw, 53.574vh) scale(0.4796); + } + to { + transform: translate(85.54215vw, 100vh) scale(0.4796); + } + } + .snow:nth-child(106) { + opacity: 0.9383; + transform: translate(89.0644vw, -10px) scale(0.0008); + animation: fall-106 24s -20s linear infinite; + } + @keyframes fall-106 { + 36.411% { + transform: translate(84.4448vw, 36.411vh) scale(0.0008); + } + to { + transform: translate(86.7546vw, 100vh) scale(0.0008); + } + } + .snow:nth-child(107) { + opacity: 0.3134; + transform: translate(74.6796vw, -10px) scale(0.2174); + animation: fall-107 23s -25s linear infinite; + } + @keyframes fall-107 { + 58.734% { + transform: translate(72.7957vw, 58.734vh) scale(0.2174); + } + to { + transform: translate(73.73765vw, 100vh) scale(0.2174); + } + } + .snow:nth-child(108) { + opacity: 0.8101; + transform: translate(41.5775vw, -10px) scale(0.6047); + animation: fall-108 26s -23s linear infinite; + } + @keyframes fall-108 { + 72.292% { + transform: translate(41.9894vw, 72.292vh) scale(0.6047); + } + to { + transform: translate(41.78345vw, 100vh) scale(0.6047); + } + } + .snow:nth-child(109) { + opacity: 0.0208; + transform: translate(22.5058vw, -10px) scale(0.7013); + animation: fall-109 20s -13s linear infinite; + } + @keyframes fall-109 { + 67.563% { + transform: translate(20.7457vw, 67.563vh) scale(0.7013); + } + to { + transform: translate(21.62575vw, 100vh) scale(0.7013); + } + } + .snow:nth-child(110) { + opacity: 0.7602; + transform: translate(65.4192vw, -10px) scale(0.6085); + animation: fall-110 28s -30s linear infinite; + } + @keyframes fall-110 { + 31.539% { + transform: translate(58.2244vw, 31.539vh) scale(0.6085); + } + to { + transform: translate(61.8218vw, 100vh) scale(0.6085); + } + } + .snow:nth-child(111) { + opacity: 0.5963; + transform: translate(13.0941vw, -10px) scale(0.157); + animation: fall-111 11s -18s linear infinite; + } + @keyframes fall-111 { + 47.199% { + transform: translate(14.5936vw, 47.199vh) scale(0.157); + } + to { + transform: translate(13.84385vw, 100vh) scale(0.157); + } + } + .snow:nth-child(112) { + opacity: 0.0488; + transform: translate(76.7591vw, -10px) scale(0.4809); + animation: fall-112 14s -14s linear infinite; + } + @keyframes fall-112 { + 31.901% { + transform: translate(71.8978vw, 31.901vh) scale(0.4809); + } + to { + transform: translate(74.32845vw, 100vh) scale(0.4809); + } + } + .snow:nth-child(113) { + opacity: 0.1973; + transform: translate(11.0857vw, -10px) scale(0.4065); + animation: fall-113 30s -12s linear infinite; + } + @keyframes fall-113 { + 59.367% { + transform: translate(3.4171vw, 59.367vh) scale(0.4065); + } + to { + transform: translate(7.2514vw, 100vh) scale(0.4065); + } + } + .snow:nth-child(114) { + opacity: 0.4989; + transform: translate(73.3818vw, -10px) scale(0.1227); + animation: fall-114 30s -7s linear infinite; + } + @keyframes fall-114 { + 56.271% { + transform: translate(70.9342vw, 56.271vh) scale(0.1227); + } + to { + transform: translate(72.158vw, 100vh) scale(0.1227); + } + } + .snow:nth-child(115) { + opacity: 0.2469; + transform: translate(24.8542vw, -10px) scale(0.2837); + animation: fall-115 15s -9s linear infinite; + } + @keyframes fall-115 { + 54.452% { + transform: translate(28.0225vw, 54.452vh) scale(0.2837); + } + to { + transform: translate(26.43835vw, 100vh) scale(0.2837); + } + } + .snow:nth-child(116) { + opacity: 0.2957; + transform: translate(1.4952vw, -10px) scale(0.8476); + animation: fall-116 27s -23s linear infinite; + } + @keyframes fall-116 { + 48.796% { + transform: translate(-7.7104vw, 48.796vh) scale(0.8476); + } + to { + transform: translate(-3.1076vw, 100vh) scale(0.8476); + } + } + .snow:nth-child(117) { + opacity: 0.3001; + transform: translate(6.2807vw, -10px) scale(0.3053); + animation: fall-117 11s -22s linear infinite; + } + @keyframes fall-117 { + 61.77% { + transform: translate(1.6866vw, 61.77vh) scale(0.3053); + } + to { + transform: translate(3.98365vw, 100vh) scale(0.3053); + } + } + .snow:nth-child(118) { + opacity: 0.8594; + transform: translate(76.3257vw, -10px) scale(0.6297); + animation: fall-118 10s -1s linear infinite; + } + @keyframes fall-118 { + 62.557% { + transform: translate(85.2779vw, 62.557vh) scale(0.6297); + } + to { + transform: translate(80.8018vw, 100vh) scale(0.6297); + } + } + .snow:nth-child(119) { + opacity: 0.7814; + transform: translate(99.0225vw, -10px) scale(0.4152); + animation: fall-119 23s -1s linear infinite; + } + @keyframes fall-119 { + 57.744% { + transform: translate(103.8327vw, 57.744vh) scale(0.4152); + } + to { + transform: translate(101.4276vw, 100vh) scale(0.4152); + } + } + .snow:nth-child(120) { + opacity: 0.1354; + transform: translate(60.9597vw, -10px) scale(0.2313); + animation: fall-120 11s -14s linear infinite; + } + @keyframes fall-120 { + 33.505% { + transform: translate(52.3203vw, 33.505vh) scale(0.2313); + } + to { + transform: translate(56.64vw, 100vh) scale(0.2313); + } + } + .snow:nth-child(121) { + opacity: 0.0099; + transform: translate(31.2472vw, -10px) scale(0.9635); + animation: fall-121 27s -24s linear infinite; + } + @keyframes fall-121 { + 72.102% { + transform: translate(23.628vw, 72.102vh) scale(0.9635); + } + to { + transform: translate(27.4376vw, 100vh) scale(0.9635); + } + } + .snow:nth-child(122) { + opacity: 0.8627; + transform: translate(7.5396vw, -10px) scale(0.1686); + animation: fall-122 14s -12s linear infinite; + } + @keyframes fall-122 { + 55.728% { + transform: translate(3.3032vw, 55.728vh) scale(0.1686); + } + to { + transform: translate(5.4214vw, 100vh) scale(0.1686); + } + } + .snow:nth-child(123) { + opacity: 0.6991; + transform: translate(9.5469vw, -10px) scale(0.2035); + animation: fall-123 29s -21s linear infinite; + } + @keyframes fall-123 { + 70.198% { + transform: translate(4.0903vw, 70.198vh) scale(0.2035); + } + to { + transform: translate(6.8186vw, 100vh) scale(0.2035); + } + } + .snow:nth-child(124) { + opacity: 0.5257; + transform: translate(38.3962vw, -10px) scale(0.1144); + animation: fall-124 22s -19s linear infinite; + } + @keyframes fall-124 { + 67.331% { + transform: translate(40.3573vw, 67.331vh) scale(0.1144); + } + to { + transform: translate(39.37675vw, 100vh) scale(0.1144); + } + } + .snow:nth-child(125) { + opacity: 0.0608; + transform: translate(73.0277vw, -10px) scale(0.9219); + animation: fall-125 25s -1s linear infinite; + } + @keyframes fall-125 { + 74.809% { + transform: translate(76.1059vw, 74.809vh) scale(0.9219); + } + to { + transform: translate(74.5668vw, 100vh) scale(0.9219); + } + } + .snow:nth-child(126) { + opacity: 0.2295; + transform: translate(41.2155vw, -10px) scale(0.8154); + animation: fall-126 29s -11s linear infinite; + } + @keyframes fall-126 { + 50.253% { + transform: translate(42.4917vw, 50.253vh) scale(0.8154); + } + to { + transform: translate(41.8536vw, 100vh) scale(0.8154); + } + } + .snow:nth-child(127) { + opacity: 0.5841; + transform: translate(59.1239vw, -10px) scale(0.2124); + animation: fall-127 16s -23s linear infinite; + } + @keyframes fall-127 { + 40.941% { + transform: translate(65.7647vw, 40.941vh) scale(0.2124); + } + to { + transform: translate(62.4443vw, 100vh) scale(0.2124); + } + } + .snow:nth-child(128) { + opacity: 0.3432; + transform: translate(10.3423vw, -10px) scale(0.7237); + animation: fall-128 22s -17s linear infinite; + } + @keyframes fall-128 { + 66.154% { + transform: translate(5.9501vw, 66.154vh) scale(0.7237); + } + to { + transform: translate(8.1462vw, 100vh) scale(0.7237); + } + } + .snow:nth-child(129) { + opacity: 0.2999; + transform: translate(68.5658vw, -10px) scale(0.8904); + animation: fall-129 11s -3s linear infinite; + } + @keyframes fall-129 { + 77.71% { + transform: translate(67.6618vw, 77.71vh) scale(0.8904); + } + to { + transform: translate(68.1138vw, 100vh) scale(0.8904); + } + } + .snow:nth-child(130) { + opacity: 0.0526; + transform: translate(68.2858vw, -10px) scale(0.4901); + animation: fall-130 28s -25s linear infinite; + } + @keyframes fall-130 { + 73.232% { + transform: translate(69.6737vw, 73.232vh) scale(0.4901); + } + to { + transform: translate(68.97975vw, 100vh) scale(0.4901); + } + } + .snow:nth-child(131) { + opacity: 0.5149; + transform: translate(58.7968vw, -10px) scale(0.0148); + animation: fall-131 19s -6s linear infinite; + } + @keyframes fall-131 { + 75.37% { + transform: translate(55.9666vw, 75.37vh) scale(0.0148); + } + to { + transform: translate(57.3817vw, 100vh) scale(0.0148); + } + } + .snow:nth-child(132) { + opacity: 0.0801; + transform: translate(44.9396vw, -10px) scale(0.9805); + animation: fall-132 25s -21s linear infinite; + } + @keyframes fall-132 { + 65.749% { + transform: translate(38.7322vw, 65.749vh) scale(0.9805); + } + to { + transform: translate(41.8359vw, 100vh) scale(0.9805); + } + } + .snow:nth-child(133) { + opacity: 0.2119; + transform: translate(33.655vw, -10px) scale(0.424); + animation: fall-133 14s -19s linear infinite; + } + @keyframes fall-133 { + 31.876% { + transform: translate(26.3866vw, 31.876vh) scale(0.424); + } + to { + transform: translate(30.0208vw, 100vh) scale(0.424); + } + } + .snow:nth-child(134) { + opacity: 0.8506; + transform: translate(2.1753vw, -10px) scale(0.3894); + animation: fall-134 25s -21s linear infinite; + } + @keyframes fall-134 { + 43.274% { + transform: translate(-7.3027vw, 43.274vh) scale(0.3894); + } + to { + transform: translate(-2.5637vw, 100vh) scale(0.3894); + } + } + .snow:nth-child(135) { + opacity: 0.5534; + transform: translate(47.2298vw, -10px) scale(0.7632); + animation: fall-135 27s -24s linear infinite; + } + @keyframes fall-135 { + 32.571% { + transform: translate(44.2063vw, 32.571vh) scale(0.7632); + } + to { + transform: translate(45.71805vw, 100vh) scale(0.7632); + } + } + .snow:nth-child(136) { + opacity: 0.2699; + transform: translate(80.9792vw, -10px) scale(0.9317); + animation: fall-136 27s -29s linear infinite; + } + @keyframes fall-136 { + 71.396% { + transform: translate(71.8724vw, 71.396vh) scale(0.9317); + } + to { + transform: translate(76.4258vw, 100vh) scale(0.9317); + } + } + .snow:nth-child(137) { + opacity: 0.0442; + transform: translate(31.0518vw, -10px) scale(0.5646); + animation: fall-137 22s -26s linear infinite; + } + @keyframes fall-137 { + 58.075% { + transform: translate(31.1553vw, 58.075vh) scale(0.5646); + } + to { + transform: translate(31.10355vw, 100vh) scale(0.5646); + } + } + .snow:nth-child(138) { + opacity: 0.5367; + transform: translate(57.4353vw, -10px) scale(0.4744); + animation: fall-138 27s -17s linear infinite; + } + @keyframes fall-138 { + 51.125% { + transform: translate(64.1636vw, 51.125vh) scale(0.4744); + } + to { + transform: translate(60.79945vw, 100vh) scale(0.4744); + } + } + .snow:nth-child(139) { + opacity: 0.9831; + transform: translate(99.9414vw, -10px) scale(0.1464); + animation: fall-139 29s -5s linear infinite; + } + @keyframes fall-139 { + 47.861% { + transform: translate(91.3869vw, 47.861vh) scale(0.1464); + } + to { + transform: translate(95.66415vw, 100vh) scale(0.1464); + } + } + .snow:nth-child(140) { + opacity: 0.3922; + transform: translate(96.9557vw, -10px) scale(0.1929); + animation: fall-140 22s -26s linear infinite; + } + @keyframes fall-140 { + 66.647% { + transform: translate(106.4053vw, 66.647vh) scale(0.1929); + } + to { + transform: translate(101.6805vw, 100vh) scale(0.1929); + } + } + .snow:nth-child(141) { + opacity: 0.5408; + transform: translate(30.7261vw, -10px) scale(0.3394); + animation: fall-141 29s -15s linear infinite; + } + @keyframes fall-141 { + 35.038% { + transform: translate(28.1181vw, 35.038vh) scale(0.3394); + } + to { + transform: translate(29.4221vw, 100vh) scale(0.3394); + } + } + .snow:nth-child(142) { + opacity: 0.73; + transform: translate(82.6623vw, -10px) scale(0.1187); + animation: fall-142 21s -16s linear infinite; + } + @keyframes fall-142 { + 69.251% { + transform: translate(90.6683vw, 69.251vh) scale(0.1187); + } + to { + transform: translate(86.6653vw, 100vh) scale(0.1187); + } + } + .snow:nth-child(143) { + opacity: 0.4649; + transform: translate(40.2018vw, -10px) scale(0.8455); + animation: fall-143 24s -29s linear infinite; + } + @keyframes fall-143 { + 72.2% { + transform: translate(36.1168vw, 72.2vh) scale(0.8455); + } + to { + transform: translate(38.1593vw, 100vh) scale(0.8455); + } + } + .snow:nth-child(144) { + opacity: 0.7747; + transform: translate(72.4685vw, -10px) scale(0.609); + animation: fall-144 24s -13s linear infinite; + } + @keyframes fall-144 { + 51.492% { + transform: translate(80.7222vw, 51.492vh) scale(0.609); + } + to { + transform: translate(76.59535vw, 100vh) scale(0.609); + } + } + .snow:nth-child(145) { + opacity: 0.9533; + transform: translate(62.4978vw, -10px) scale(0.2025); + animation: fall-145 26s -12s linear infinite; + } + @keyframes fall-145 { + 66.734% { + transform: translate(69.1855vw, 66.734vh) scale(0.2025); + } + to { + transform: translate(65.84165vw, 100vh) scale(0.2025); + } + } + .snow:nth-child(146) { + opacity: 0.1452; + transform: translate(92.7182vw, -10px) scale(0.5453); + animation: fall-146 27s -17s linear infinite; + } + @keyframes fall-146 { + 69.729% { + transform: translate(99.0877vw, 69.729vh) scale(0.5453); + } + to { + transform: translate(95.90295vw, 100vh) scale(0.5453); + } + } + .snow:nth-child(147) { + opacity: 0.705; + transform: translate(40.3862vw, -10px) scale(0.6225); + animation: fall-147 10s -15s linear infinite; + } + @keyframes fall-147 { + 78.729% { + transform: translate(31.157vw, 78.729vh) scale(0.6225); + } + to { + transform: translate(35.7716vw, 100vh) scale(0.6225); + } + } + .snow:nth-child(148) { + opacity: 0.0107; + transform: translate(4.8934vw, -10px) scale(0.8055); + animation: fall-148 20s -2s linear infinite; + } + @keyframes fall-148 { + 77.079% { + transform: translate(7.3669vw, 77.079vh) scale(0.8055); + } + to { + transform: translate(6.13015vw, 100vh) scale(0.8055); + } + } + .snow:nth-child(149) { + opacity: 0.9534; + transform: translate(15.7414vw, -10px) scale(0.1363); + animation: fall-149 24s -1s linear infinite; + } + @keyframes fall-149 { + 66.753% { + transform: translate(14.688vw, 66.753vh) scale(0.1363); + } + to { + transform: translate(15.2147vw, 100vh) scale(0.1363); + } + } + .snow:nth-child(150) { + opacity: 0.8664; + transform: translate(99.6298vw, -10px) scale(0.8735); + animation: fall-150 21s -10s linear infinite; + } + @keyframes fall-150 { + 72.153% { + transform: translate(106.5594vw, 72.153vh) scale(0.8735); + } + to { + transform: translate(103.0946vw, 100vh) scale(0.8735); + } + } + .snow:nth-child(151) { + opacity: 0.302; + transform: translate(9.2878vw, -10px) scale(0.8171); + animation: fall-151 25s -6s linear infinite; + } + @keyframes fall-151 { + 60.966% { + transform: translate(19.2584vw, 60.966vh) scale(0.8171); + } + to { + transform: translate(14.2731vw, 100vh) scale(0.8171); + } + } + .snow:nth-child(152) { + opacity: 0.6952; + transform: translate(18.8317vw, -10px) scale(0.5073); + animation: fall-152 26s -23s linear infinite; + } + @keyframes fall-152 { + 37.709% { + transform: translate(24.2943vw, 37.709vh) scale(0.5073); + } + to { + transform: translate(21.563vw, 100vh) scale(0.5073); + } + } + .snow:nth-child(153) { + opacity: 0.853; + transform: translate(84.4291vw, -10px) scale(0.0796); + animation: fall-153 21s -9s linear infinite; + } + @keyframes fall-153 { + 77.223% { + transform: translate(87.8629vw, 77.223vh) scale(0.0796); + } + to { + transform: translate(86.146vw, 100vh) scale(0.0796); + } + } + .snow:nth-child(154) { + opacity: 0.5482; + transform: translate(22.1947vw, -10px) scale(0.2724); + animation: fall-154 25s -30s linear infinite; + } + @keyframes fall-154 { + 33.05% { + transform: translate(26.6153vw, 33.05vh) scale(0.2724); + } + to { + transform: translate(24.405vw, 100vh) scale(0.2724); + } + } + .snow:nth-child(155) { + opacity: 0.6389; + transform: translate(60.4324vw, -10px) scale(0.4399); + animation: fall-155 12s -30s linear infinite; + } + @keyframes fall-155 { + 79.154% { + transform: translate(64.1389vw, 79.154vh) scale(0.4399); + } + to { + transform: translate(62.28565vw, 100vh) scale(0.4399); + } + } + .snow:nth-child(156) { + opacity: 0.0514; + transform: translate(99.471vw, -10px) scale(0.0416); + animation: fall-156 24s -14s linear infinite; + } + @keyframes fall-156 { + 69.465% { + transform: translate(98.733vw, 69.465vh) scale(0.0416); + } + to { + transform: translate(99.102vw, 100vh) scale(0.0416); + } + } + .snow:nth-child(157) { + opacity: 0.1092; + transform: translate(44.6979vw, -10px) scale(0.5746); + animation: fall-157 11s -6s linear infinite; + } + @keyframes fall-157 { + 64.368% { + transform: translate(51.7147vw, 64.368vh) scale(0.5746); + } + to { + transform: translate(48.2063vw, 100vh) scale(0.5746); + } + } + .snow:nth-child(158) { + opacity: 0.8017; + transform: translate(20.6229vw, -10px) scale(0.7325); + animation: fall-158 29s -22s linear infinite; + } + @keyframes fall-158 { + 56.06% { + transform: translate(18.2195vw, 56.06vh) scale(0.7325); + } + to { + transform: translate(19.4212vw, 100vh) scale(0.7325); + } + } + .snow:nth-child(159) { + opacity: 0.9708; + transform: translate(75.444vw, -10px) scale(0.9754); + animation: fall-159 22s -12s linear infinite; + } + @keyframes fall-159 { + 48.094% { + transform: translate(65.938vw, 48.094vh) scale(0.9754); + } + to { + transform: translate(70.691vw, 100vh) scale(0.9754); + } + } + .snow:nth-child(160) { + opacity: 0.6164; + transform: translate(11.5242vw, -10px) scale(0.0505); + animation: fall-160 29s -26s linear infinite; + } + @keyframes fall-160 { + 61.298% { + transform: translate(12.6167vw, 61.298vh) scale(0.0505); + } + to { + transform: translate(12.07045vw, 100vh) scale(0.0505); + } + } + .snow:nth-child(161) { + opacity: 0.8147; + transform: translate(31.6335vw, -10px) scale(0.6126); + animation: fall-161 26s -6s linear infinite; + } + @keyframes fall-161 { + 40.291% { + transform: translate(33.02vw, 40.291vh) scale(0.6126); + } + to { + transform: translate(32.32675vw, 100vh) scale(0.6126); + } + } + .snow:nth-child(162) { + opacity: 0.046; + transform: translate(70.3385vw, -10px) scale(0.5771); + animation: fall-162 13s -30s linear infinite; + } + @keyframes fall-162 { + 45.646% { + transform: translate(71.6203vw, 45.646vh) scale(0.5771); + } + to { + transform: translate(70.9794vw, 100vh) scale(0.5771); + } + } + .snow:nth-child(163) { + opacity: 0.8217; + transform: translate(42.0414vw, -10px) scale(0.502); + animation: fall-163 25s -1s linear infinite; + } + @keyframes fall-163 { + 77.702% { + transform: translate(45.5737vw, 77.702vh) scale(0.502); + } + to { + transform: translate(43.80755vw, 100vh) scale(0.502); + } + } + .snow:nth-child(164) { + opacity: 0.2287; + transform: translate(75.3064vw, -10px) scale(0.5458); + animation: fall-164 28s -4s linear infinite; + } + @keyframes fall-164 { + 55.14% { + transform: translate(82.5834vw, 55.14vh) scale(0.5458); + } + to { + transform: translate(78.9449vw, 100vh) scale(0.5458); + } + } + .snow:nth-child(165) { + opacity: 0.1001; + transform: translate(74.6205vw, -10px) scale(0.0014); + animation: fall-165 10s -2s linear infinite; + } + @keyframes fall-165 { + 42.086% { + transform: translate(80.575vw, 42.086vh) scale(0.0014); + } + to { + transform: translate(77.59775vw, 100vh) scale(0.0014); + } + } + .snow:nth-child(166) { + opacity: 0.0441; + transform: translate(44.4973vw, -10px) scale(0.169); + animation: fall-166 28s -24s linear infinite; + } + @keyframes fall-166 { + 68.716% { + transform: translate(51.1269vw, 68.716vh) scale(0.169); + } + to { + transform: translate(47.8121vw, 100vh) scale(0.169); + } + } + .snow:nth-child(167) { + opacity: 0.7934; + transform: translate(14.0491vw, -10px) scale(0.9096); + animation: fall-167 13s -20s linear infinite; + } + @keyframes fall-167 { + 69.875% { + transform: translate(10.4231vw, 69.875vh) scale(0.9096); + } + to { + transform: translate(12.2361vw, 100vh) scale(0.9096); + } + } + .snow:nth-child(168) { + opacity: 0.6786; + transform: translate(16.2853vw, -10px) scale(0.6808); + animation: fall-168 10s -15s linear infinite; + } + @keyframes fall-168 { + 34.32% { + transform: translate(10.4744vw, 34.32vh) scale(0.6808); + } + to { + transform: translate(13.37985vw, 100vh) scale(0.6808); + } + } + .snow:nth-child(169) { + opacity: 0.6193; + transform: translate(57.5723vw, -10px) scale(0.8956); + animation: fall-169 30s -28s linear infinite; + } + @keyframes fall-169 { + 33.25% { + transform: translate(47.9152vw, 33.25vh) scale(0.8956); + } + to { + transform: translate(52.74375vw, 100vh) scale(0.8956); + } + } + .snow:nth-child(170) { + opacity: 0.9553; + transform: translate(72.5532vw, -10px) scale(0.2882); + animation: fall-170 22s -14s linear infinite; + } + @keyframes fall-170 { + 55.51% { + transform: translate(71.342vw, 55.51vh) scale(0.2882); + } + to { + transform: translate(71.9476vw, 100vh) scale(0.2882); + } + } + .snow:nth-child(171) { + opacity: 0.8775; + transform: translate(89.513vw, -10px) scale(0.0717); + animation: fall-171 28s -6s linear infinite; + } + @keyframes fall-171 { + 39.241% { + transform: translate(87.835vw, 39.241vh) scale(0.0717); + } + to { + transform: translate(88.674vw, 100vh) scale(0.0717); + } + } + .snow:nth-child(172) { + opacity: 0.0127; + transform: translate(33.092vw, -10px) scale(0.9381); + animation: fall-172 14s -13s linear infinite; + } + @keyframes fall-172 { + 52.686% { + transform: translate(30.6563vw, 52.686vh) scale(0.9381); + } + to { + transform: translate(31.87415vw, 100vh) scale(0.9381); + } + } + .snow:nth-child(173) { + opacity: 0.3754; + transform: translate(56.9038vw, -10px) scale(0.2548); + animation: fall-173 14s -5s linear infinite; + } + @keyframes fall-173 { + 32.618% { + transform: translate(59.1997vw, 32.618vh) scale(0.2548); + } + to { + transform: translate(58.05175vw, 100vh) scale(0.2548); + } + } + .snow:nth-child(174) { + opacity: 0.6787; + transform: translate(97.8636vw, -10px) scale(0.5736); + animation: fall-174 26s -29s linear infinite; + } + @keyframes fall-174 { + 58.84% { + transform: translate(91.0124vw, 58.84vh) scale(0.5736); + } + to { + transform: translate(94.438vw, 100vh) scale(0.5736); + } + } + .snow:nth-child(175) { + opacity: 0.1423; + transform: translate(79.5912vw, -10px) scale(0.1131); + animation: fall-175 21s -16s linear infinite; + } + @keyframes fall-175 { + 41.175% { + transform: translate(85.2839vw, 41.175vh) scale(0.1131); + } + to { + transform: translate(82.43755vw, 100vh) scale(0.1131); + } + } + .snow:nth-child(176) { + opacity: 0.3131; + transform: translate(97.2658vw, -10px) scale(0.1912); + animation: fall-176 27s -7s linear infinite; + } + @keyframes fall-176 { + 64.281% { + transform: translate(87.5193vw, 64.281vh) scale(0.1912); + } + to { + transform: translate(92.39255vw, 100vh) scale(0.1912); + } + } + .snow:nth-child(177) { + opacity: 0.4217; + transform: translate(30.357vw, -10px) scale(0.2767); + animation: fall-177 25s -4s linear infinite; + } + @keyframes fall-177 { + 70.405% { + transform: translate(26.2333vw, 70.405vh) scale(0.2767); + } + to { + transform: translate(28.29515vw, 100vh) scale(0.2767); + } + } + .snow:nth-child(178) { + opacity: 0.7174; + transform: translate(29.4196vw, -10px) scale(0.9387); + animation: fall-178 16s -23s linear infinite; + } + @keyframes fall-178 { + 44.862% { + transform: translate(20.9641vw, 44.862vh) scale(0.9387); + } + to { + transform: translate(25.19185vw, 100vh) scale(0.9387); + } + } + .snow:nth-child(179) { + opacity: 0.0506; + transform: translate(60.0842vw, -10px) scale(0.5306); + animation: fall-179 21s -21s linear infinite; + } + @keyframes fall-179 { + 59.908% { + transform: translate(51.1862vw, 59.908vh) scale(0.5306); + } + to { + transform: translate(55.6352vw, 100vh) scale(0.5306); + } + } + .snow:nth-child(180) { + opacity: 0.967; + transform: translate(69.1243vw, -10px) scale(0.8865); + animation: fall-180 13s -6s linear infinite; + } + @keyframes fall-180 { + 77.052% { + transform: translate(74.5612vw, 77.052vh) scale(0.8865); + } + to { + transform: translate(71.84275vw, 100vh) scale(0.8865); + } + } + .snow:nth-child(181) { + opacity: 0.2505; + transform: translate(96.3309vw, -10px) scale(0.5332); + animation: fall-181 24s -12s linear infinite; + } + @keyframes fall-181 { + 51.059% { + transform: translate(87.0002vw, 51.059vh) scale(0.5332); + } + to { + transform: translate(91.66555vw, 100vh) scale(0.5332); + } + } + .snow:nth-child(182) { + opacity: 0.9577; + transform: translate(98.525vw, -10px) scale(0.8385); + animation: fall-182 26s -19s linear infinite; + } + @keyframes fall-182 { + 68.505% { + transform: translate(100.0099vw, 68.505vh) scale(0.8385); + } + to { + transform: translate(99.26745vw, 100vh) scale(0.8385); + } + } + .snow:nth-child(183) { + opacity: 0.8696; + transform: translate(99.5031vw, -10px) scale(0.4755); + animation: fall-183 17s -30s linear infinite; + } + @keyframes fall-183 { + 48.245% { + transform: translate(90.7281vw, 48.245vh) scale(0.4755); + } + to { + transform: translate(95.1156vw, 100vh) scale(0.4755); + } + } + .snow:nth-child(184) { + opacity: 0.6816; + transform: translate(58.6293vw, -10px) scale(0.535); + animation: fall-184 28s -25s linear infinite; + } + @keyframes fall-184 { + 66.604% { + transform: translate(60.3968vw, 66.604vh) scale(0.535); + } + to { + transform: translate(59.51305vw, 100vh) scale(0.535); + } + } + .snow:nth-child(185) { + opacity: 0.8649; + transform: translate(9.574vw, -10px) scale(0.0501); + animation: fall-185 22s -2s linear infinite; + } + @keyframes fall-185 { + 49.327% { + transform: translate(4.4976vw, 49.327vh) scale(0.0501); + } + to { + transform: translate(7.0358vw, 100vh) scale(0.0501); + } + } + .snow:nth-child(186) { + opacity: 0.0409; + transform: translate(86.6595vw, -10px) scale(0.3209); + animation: fall-186 22s -14s linear infinite; + } + @keyframes fall-186 { + 72.074% { + transform: translate(94.9827vw, 72.074vh) scale(0.3209); + } + to { + transform: translate(90.8211vw, 100vh) scale(0.3209); + } + } + .snow:nth-child(187) { + opacity: 0.0059; + transform: translate(21.8115vw, -10px) scale(0.5076); + animation: fall-187 24s -26s linear infinite; + } + @keyframes fall-187 { + 79.107% { + transform: translate(31.3872vw, 79.107vh) scale(0.5076); + } + to { + transform: translate(26.59935vw, 100vh) scale(0.5076); + } + } + .snow:nth-child(188) { + opacity: 0.8292; + transform: translate(71.5969vw, -10px) scale(0.9458); + animation: fall-188 26s -19s linear infinite; + } + @keyframes fall-188 { + 67.622% { + transform: translate(80.2669vw, 67.622vh) scale(0.9458); + } + to { + transform: translate(75.9319vw, 100vh) scale(0.9458); + } + } + .snow:nth-child(189) { + opacity: 0.2547; + transform: translate(96.9107vw, -10px) scale(0.6832); + animation: fall-189 24s -19s linear infinite; + } + @keyframes fall-189 { + 63.323% { + transform: translate(91.4326vw, 63.323vh) scale(0.6832); + } + to { + transform: translate(94.17165vw, 100vh) scale(0.6832); + } + } + .snow:nth-child(190) { + opacity: 0.4824; + transform: translate(46.3118vw, -10px) scale(0.9619); + animation: fall-190 19s -21s linear infinite; + } + @keyframes fall-190 { + 43.976% { + transform: translate(54.7809vw, 43.976vh) scale(0.9619); + } + to { + transform: translate(50.54635vw, 100vh) scale(0.9619); + } + } + .snow:nth-child(191) { + opacity: 0.0648; + transform: translate(53.3925vw, -10px) scale(0.0137); + animation: fall-191 11s -5s linear infinite; + } + @keyframes fall-191 { + 76.157% { + transform: translate(57.6665vw, 76.157vh) scale(0.0137); + } + to { + transform: translate(55.5295vw, 100vh) scale(0.0137); + } + } + .snow:nth-child(192) { + opacity: 0.2015; + transform: translate(42.2246vw, -10px) scale(0.402); + animation: fall-192 29s -29s linear infinite; + } + @keyframes fall-192 { + 35.555% { + transform: translate(36.1763vw, 35.555vh) scale(0.402); + } + to { + transform: translate(39.20045vw, 100vh) scale(0.402); + } + } + .snow:nth-child(193) { + opacity: 0.7923; + transform: translate(3.2938vw, -10px) scale(0.4219); + animation: fall-193 29s -29s linear infinite; + } + @keyframes fall-193 { + 78.977% { + transform: translate(-1.3605vw, 78.977vh) scale(0.4219); + } + to { + transform: translate(0.96665vw, 100vh) scale(0.4219); + } + } + .snow:nth-child(194) { + opacity: 0.9547; + transform: translate(26.7684vw, -10px) scale(0.5924); + animation: fall-194 28s -17s linear infinite; + } + @keyframes fall-194 { + 68.903% { + transform: translate(34.707vw, 68.903vh) scale(0.5924); + } + to { + transform: translate(30.7377vw, 100vh) scale(0.5924); + } + } + .snow:nth-child(195) { + opacity: 0.2156; + transform: translate(49.1782vw, -10px) scale(0.662); + animation: fall-195 25s -5s linear infinite; + } + @keyframes fall-195 { + 35.374% { + transform: translate(46.2173vw, 35.374vh) scale(0.662); + } + to { + transform: translate(47.69775vw, 100vh) scale(0.662); + } + } + .snow:nth-child(196) { + opacity: 0.1765; + transform: translate(16.3485vw, -10px) scale(0.1705); + animation: fall-196 18s -27s linear infinite; + } + @keyframes fall-196 { + 55.562% { + transform: translate(17.739vw, 55.562vh) scale(0.1705); + } + to { + transform: translate(17.04375vw, 100vh) scale(0.1705); + } + } + .snow:nth-child(197) { + opacity: 0.9971; + transform: translate(9.0659vw, -10px) scale(0.1913); + animation: fall-197 11s -4s linear infinite; + } + @keyframes fall-197 { + 77.171% { + transform: translate(1.4242vw, 77.171vh) scale(0.1913); + } + to { + transform: translate(5.24505vw, 100vh) scale(0.1913); + } + } + .snow:nth-child(198) { + opacity: 0.0948; + transform: translate(81.533vw, -10px) scale(0.0822); + animation: fall-198 21s -14s linear infinite; + } + @keyframes fall-198 { + 49.491% { + transform: translate(78.4759vw, 49.491vh) scale(0.0822); + } + to { + transform: translate(80.00445vw, 100vh) scale(0.0822); + } + } + .snow:nth-child(199) { + opacity: 0.9526; + transform: translate(17.5335vw, -10px) scale(0.3399); + animation: fall-199 23s -26s linear infinite; + } + @keyframes fall-199 { + 69.45% { + transform: translate(16.2468vw, 69.45vh) scale(0.3399); + } + to { + transform: translate(16.89015vw, 100vh) scale(0.3399); + } + } + .snow:nth-child(200) { + opacity: 0.4047; + transform: translate(30.0196vw, -10px) scale(0.7308); + animation: fall-200 14s -21s linear infinite; + } + @keyframes fall-200 { + 63.428% { + transform: translate(28.4435vw, 63.428vh) scale(0.7308); + } + to { + transform: translate(29.23155vw, 100vh) scale(0.7308); + } + } \ No newline at end of file diff --git a/style.css b/style.css index 148c12b..07d5e5a 100644 --- a/style.css +++ b/style.css @@ -182,28 +182,6 @@ h1 { color: #3E5BFF; } -@keyframes wildSpin { - 0% { - transform: scale(1) rotate(0deg); - } - - 25% { - transform: scale(1.5) rotate(180deg) skew(15deg); - } - - 50% { - transform: scale(0.8) rotate(-180deg) skew(-15deg); - } - - 75% { - transform: scale(1.2) rotate(360deg); - } - - 100% { - transform: scale(1) rotate(720deg); - } -} - @keyframes shake { 0%, @@ -254,3 +232,4 @@ h1:hover { .social-links a:hover::after { opacity: 1; } +