2 lines
17 KiB
CSS
2 lines
17 KiB
CSS
snowfall{position:fixed;top:0;right:0;bottom:0;left:0;z-index:50000000;display:block;font-size:40px;overflow:hidden;pointer-events:none}snowfall snowflake{position:absolute;top:0;left:0;display:flex;justify-content:center;width:100px;height:100px}snowfall snowflake span{align-self:center}snowfall snowflake img{align-self:center;width:20px}snowfall snowflake:nth-child(50){animation:animation-snowflake-50 linear infinite;animation-duration:13.1s;animation-delay:-1.1s}@keyframes animation-snowflake-50{0%{left:85%;top:calc(0% - 100px);transform:scale(1.058) rotate3d(.36,.38,.25,0deg)}100%{left:114.1%;top:calc(100% + 100px);transform:scale(1.058) rotate3d(.35,.84,.72,997deg)}}snowfall snowflake:nth-child(49){animation:animation-snowflake-49 linear infinite;animation-duration:12s;animation-delay:-14.8s}@keyframes animation-snowflake-49{0%{left:26%;top:calc(0% - 100px);transform:scale(.637) rotate3d(.22,.52,.15,0deg)}100%{left:16%;top:calc(100% + 100px);transform:scale(.637) rotate3d(.12,.67,.79,-1212deg)}}snowfall snowflake:nth-child(48){animation:animation-snowflake-48 linear infinite;animation-duration:11.8s;animation-delay:-10.4s}@keyframes animation-snowflake-48{0%{left:3%;top:calc(0% - 100px);transform:scale(1.235) rotate3d(.92,.78,.97,0deg)}100%{left:26.8%;top:calc(100% + 100px);transform:scale(1.235) rotate3d(.75,.86,.08,-1042deg)}}snowfall snowflake:nth-child(47){animation:animation-snowflake-47 linear infinite;animation-duration:9.2s;animation-delay:-1s}@keyframes animation-snowflake-47{0%{left:50%;top:calc(0% - 100px);transform:scale(1.046) rotate3d(.88,.19,.75,0deg)}100%{left:75.1%;top:calc(100% + 100px);transform:scale(1.046) rotate3d(.22,.68,.67,-1287deg)}}snowfall snowflake:nth-child(46){animation:animation-snowflake-46 linear infinite;animation-duration:15.8s;animation-delay:-15.1s}@keyframes animation-snowflake-46{0%{left:78%;top:calc(0% - 100px);transform:scale(1.146) rotate3d(.95,.06,.46,0deg)}100%{left:67%;top:calc(100% + 100px);transform:scale(1.146) rotate3d(.79,.01,.63,1235deg)}}snowfall snowflake:nth-child(45){animation:animation-snowflake-45 linear infinite;animation-duration:13.4s;animation-delay:-15.5s}@keyframes animation-snowflake-45{0%{left:22%;top:calc(0% - 100px);transform:scale(.705) rotate3d(.2,1,.33,0deg)}100%{left:22.5%;top:calc(100% + 100px);transform:scale(.705) rotate3d(.99,.94,.9,1293deg)}}snowfall snowflake:nth-child(44){animation:animation-snowflake-44 linear infinite;animation-duration:11.3s;animation-delay:-15.7s}@keyframes animation-snowflake-44{0%{left:74%;top:calc(0% - 100px);transform:scale(.87) rotate3d(.89,.22,.95,0deg)}100%{left:58.7%;top:calc(100% + 100px);transform:scale(.87) rotate3d(.77,.8,.04,1038deg)}}snowfall snowflake:nth-child(43){animation:animation-snowflake-43 linear infinite;animation-duration:14.8s;animation-delay:-14s}@keyframes animation-snowflake-43{0%{left:57%;top:calc(0% - 100px);transform:scale(1.103) rotate3d(.11,.59,.53,0deg)}100%{left:55.6%;top:calc(100% + 100px);transform:scale(1.103) rotate3d(.84,.39,.31,955deg)}}snowfall snowflake:nth-child(42){animation:animation-snowflake-42 linear infinite;animation-duration:8.1s;animation-delay:-7.8s}@keyframes animation-snowflake-42{0%{left:91%;top:calc(0% - 100px);transform:scale(1.249) rotate3d(.56,.42,.15,0deg)}100%{left:81.8%;top:calc(100% + 100px);transform:scale(1.249) rotate3d(.16,.03,.8,1214deg)}}snowfall snowflake:nth-child(41){animation:animation-snowflake-41 linear infinite;animation-duration:15.9s;animation-delay:-11.1s}@keyframes animation-snowflake-41{0%{left:66%;top:calc(0% - 100px);transform:scale(1.389) rotate3d(.91,.12,.21,0deg)}100%{left:105.3%;top:calc(100% + 100px);transform:scale(1.389) rotate3d(.31,.97,.5,-885deg)}}snowfall snowflake:nth-child(40){animation:animation-snowflake-40 linear infinite;animation-duration:14.4s;animation-delay:-4.2s}@keyframes animation-snowflake-40{0%{left:3%;top:calc(0% - 100px);transform:scale(1.247) rotate3d(.38,.39,.66,0deg)}100%{left:23.7%;top:calc(100% + 100px);transform:scale(1.247) rotate3d(.98,.66,.46,999deg)}}snowfall snowflake:nth-child(39){animation:animation-snowflake-39 linear infinite;animation-duration:15.4s;animation-delay:-7.2s}@keyframes animation-snowflake-39{0%{left:11%;top:calc(0% - 100px);transform:scale(1.091) rotate3d(.92,.21,.47,0deg)}100%{left:26.9%;top:calc(100% + 100px);transform:scale(1.091) rotate3d(.29,.72,.17,1290deg)}}snowfall snowflake:nth-child(38){animation:animation-snowflake-38 linear infinite;animation-duration:12.9s;animation-delay:-15.6s}@keyframes animation-snowflake-38{0%{left:98%;top:calc(0% - 100px);transform:scale(1.319) rotate3d(.44,.68,.72,0deg)}100%{left:108%;top:calc(100% + 100px);transform:scale(1.319) rotate3d(1,.46,.76,-986deg)}}snowfall snowflake:nth-child(37){animation:animation-snowflake-37 linear infinite;animation-duration:14.9s;animation-delay:-1.6s}@keyframes animation-snowflake-37{0%{left:53%;top:calc(0% - 100px);transform:scale(1.076) rotate3d(.98,.27,.82,0deg)}100%{left:34.5%;top:calc(100% + 100px);transform:scale(1.076) rotate3d(.18,.66,.97,-1163deg)}}snowfall snowflake:nth-child(36){animation:animation-snowflake-36 linear infinite;animation-duration:8.1s;animation-delay:-9.8s}@keyframes animation-snowflake-36{0%{left:37%;top:calc(0% - 100px);transform:scale(1.243) rotate3d(.89,.81,.03,0deg)}100%{left:26.3%;top:calc(100% + 100px);transform:scale(1.243) rotate3d(.72,.02,.43,1191deg)}}snowfall snowflake:nth-child(35){animation:animation-snowflake-35 linear infinite;animation-duration:10.2s;animation-delay:-6.4s}@keyframes animation-snowflake-35{0%{left:94%;top:calc(0% - 100px);transform:scale(1.325) rotate3d(.08,1,.49,0deg)}100%{left:75.6%;top:calc(100% + 100px);transform:scale(1.325) rotate3d(.59,.71,.97,-1205deg)}}snowfall snowflake:nth-child(34){animation:animation-snowflake-34 linear infinite;animation-duration:10.4s;animation-delay:-12.2s}@keyframes animation-snowflake-34{0%{left:62%;top:calc(0% - 100px);transform:scale(1.279) rotate3d(.2,.59,.26,0deg)}100%{left:80.4%;top:calc(100% + 100px);transform:scale(1.279) rotate3d(.38,.84,.22,-1054deg)}}snowfall snowflake:nth-child(33){animation:animation-snowflake-33 linear infinite;animation-duration:13.2s;animation-delay:-13.1s}@keyframes animation-snowflake-33{0%{left:21%;top:calc(0% - 100px);transform:scale(1.061) rotate3d(.17,.36,.93,0deg)}100%{left:55.6%;top:calc(100% + 100px);transform:scale(1.061) rotate3d(.43,.77,.22,1349deg)}}snowfall snowflake:nth-child(32){animation:animation-snowflake-32 linear infinite;animation-duration:15.2s;animation-delay:-9.1s}@keyframes animation-snowflake-32{0%{left:76%;top:calc(0% - 100px);transform:scale(.678) rotate3d(.13,.84,.29,0deg)}100%{left:85.9%;top:calc(100% + 100px);transform:scale(.678) rotate3d(.24,.97,.55,-928deg)}}snowfall snowflake:nth-child(31){animation:animation-snowflake-31 linear infinite;animation-duration:12.2s;animation-delay:-14.5s}@keyframes animation-snowflake-31{0%{left:66%;top:calc(0% - 100px);transform:scale(.976) rotate3d(.84,.11,.1,0deg)}100%{left:97.2%;top:calc(100% + 100px);transform:scale(.976) rotate3d(.19,.18,.09,-1195deg)}}snowfall snowflake:nth-child(30){animation:animation-snowflake-30 linear infinite;animation-duration:10.1s;animation-delay:-13.5s}@keyframes animation-snowflake-30{0%{left:22%;top:calc(0% - 100px);transform:scale(1.134) rotate3d(.7,.26,.81,0deg)}100%{left:41.8%;top:calc(100% + 100px);transform:scale(1.134) rotate3d(.96,.05,.37,-1222deg)}}snowfall snowflake:nth-child(29){animation:animation-snowflake-29 linear infinite;animation-duration:13.5s;animation-delay:-8.1s}@keyframes animation-snowflake-29{0%{left:31%;top:calc(0% - 100px);transform:scale(.791) rotate3d(.09,.54,.58,0deg)}100%{left:25.5%;top:calc(100% + 100px);transform:scale(.791) rotate3d(.72,.86,.33,-1293deg)}}snowfall snowflake:nth-child(28){animation:animation-snowflake-28 linear infinite;animation-duration:13.8s;animation-delay:-9.2s}@keyframes animation-snowflake-28{0%{left:69%;top:calc(0% - 100px);transform:scale(1.265) rotate3d(.41,.08,.53,0deg)}100%{left:75.6%;top:calc(100% + 100px);transform:scale(1.265) rotate3d(.59,.52,.07,-981deg)}}snowfall snowflake:nth-child(27){animation:animation-snowflake-27 linear infinite;animation-duration:8.2s;animation-delay:-11.8s}@keyframes animation-snowflake-27{0%{left:54%;top:calc(0% - 100px);transform:scale(1.083) rotate3d(.32,.88,.84,0deg)}100%{left:72.1%;top:calc(100% + 100px);transform:scale(1.083) rotate3d(.44,.8,.4,-1244deg)}}snowfall snowflake:nth-child(26){animation:animation-snowflake-26 linear infinite;animation-duration:15.5s;animation-delay:-8.2s}@keyframes animation-snowflake-26{0%{left:20%;top:calc(0% - 100px);transform:scale(1.265) rotate3d(.92,.26,.4,0deg)}100%{left:46.4%;top:calc(100% + 100px);transform:scale(1.265) rotate3d(.6,.22,.73,1384deg)}}snowfall snowflake:nth-child(25){animation:animation-snowflake-25 linear infinite;animation-duration:9.1s;animation-delay:-6.6s}@keyframes animation-snowflake-25{0%{left:55%;top:calc(0% - 100px);transform:scale(1.109) rotate3d(.99,.76,.88,0deg)}100%{left:83.1%;top:calc(100% + 100px);transform:scale(1.109) rotate3d(.39,.41,.09,-1253deg)}}snowfall snowflake:nth-child(24){animation:animation-snowflake-24 linear infinite;animation-duration:12.8s;animation-delay:-2.7s}@keyframes animation-snowflake-24{0%{left:48%;top:calc(0% - 100px);transform:scale(.679) rotate3d(.07,.53,.37,0deg)}100%{left:34.6%;top:calc(100% + 100px);transform:scale(.679) rotate3d(.64,.2,.67,1156deg)}}snowfall snowflake:nth-child(23){animation:animation-snowflake-23 linear infinite;animation-duration:9.9s;animation-delay:-12.9s}@keyframes animation-snowflake-23{0%{left:51%;top:calc(0% - 100px);transform:scale(1.306) rotate3d(.12,.01,.04,0deg)}100%{left:84.7%;top:calc(100% + 100px);transform:scale(1.306) rotate3d(.43,.98,.24,847deg)}}snowfall snowflake:nth-child(22){animation:animation-snowflake-22 linear infinite;animation-duration:11.3s;animation-delay:-8.7s}@keyframes animation-snowflake-22{0%{left:97%;top:calc(0% - 100px);transform:scale(.964) rotate3d(.23,.31,.39,0deg)}100%{left:81.2%;top:calc(100% + 100px);transform:scale(.964) rotate3d(.49,.82,.23,-1168deg)}}snowfall snowflake:nth-child(21){animation:animation-snowflake-21 linear infinite;animation-duration:8.2s;animation-delay:-13s}@keyframes animation-snowflake-21{0%{left:41%;top:calc(0% - 100px);transform:scale(.727) rotate3d(.43,.68,.27,0deg)}100%{left:34.9%;top:calc(100% + 100px);transform:scale(.727) rotate3d(.51,.21,.74,-1207deg)}}snowfall snowflake:nth-child(20){animation:animation-snowflake-20 linear infinite;animation-duration:10.9s;animation-delay:-12.1s}@keyframes animation-snowflake-20{0%{left:89%;top:calc(0% - 100px);transform:scale(1.054) rotate3d(.12,.28,.78,0deg)}100%{left:112.6%;top:calc(100% + 100px);transform:scale(1.054) rotate3d(.79,.98,.03,-935deg)}}snowfall snowflake:nth-child(19){animation:animation-snowflake-19 linear infinite;animation-duration:9.6s;animation-delay:-8.1s}@keyframes animation-snowflake-19{0%{left:8%;top:calc(0% - 100px);transform:scale(1.099) rotate3d(.5,.55,.33,0deg)}100%{left:33.4%;top:calc(100% + 100px);transform:scale(1.099) rotate3d(.03,.94,.22,-1355deg)}}snowfall snowflake:nth-child(18){animation:animation-snowflake-18 linear infinite;animation-duration:8.2s;animation-delay:-1.9s}@keyframes animation-snowflake-18{0%{left:76%;top:calc(0% - 100px);transform:scale(1.176) rotate3d(.85,.88,.1,0deg)}100%{left:115%;top:calc(100% + 100px);transform:scale(1.176) rotate3d(.28,1,.43,-1280deg)}}snowfall snowflake:nth-child(17){animation:animation-snowflake-17 linear infinite;animation-duration:12.7s;animation-delay:-11.8s}@keyframes animation-snowflake-17{0%{left:61%;top:calc(0% - 100px);transform:scale(1.167) rotate3d(.63,.55,.91,0deg)}100%{left:57%;top:calc(100% + 100px);transform:scale(1.167) rotate3d(.88,.94,.56,-730deg)}}snowfall snowflake:nth-child(16){animation:animation-snowflake-16 linear infinite;animation-duration:10.1s;animation-delay:-15.6s}@keyframes animation-snowflake-16{0%{left:81%;top:calc(0% - 100px);transform:scale(.679) rotate3d(.38,.57,.03,0deg)}100%{left:89.5%;top:calc(100% + 100px);transform:scale(.679) rotate3d(.88,.72,.54,-823deg)}}snowfall snowflake:nth-child(15){animation:animation-snowflake-15 linear infinite;animation-duration:13.5s;animation-delay:-7.8s}@keyframes animation-snowflake-15{0%{left:21%;top:calc(0% - 100px);transform:scale(1.258) rotate3d(.91,.74,.08,0deg)}100%{left:50.3%;top:calc(100% + 100px);transform:scale(1.258) rotate3d(.17,.45,.92,-1414deg)}}snowfall snowflake:nth-child(14){animation:animation-snowflake-14 linear infinite;animation-duration:15.8s;animation-delay:-1.1s}@keyframes animation-snowflake-14{0%{left:91%;top:calc(0% - 100px);transform:scale(1.206) rotate3d(.99,.51,.09,0deg)}100%{left:112.7%;top:calc(100% + 100px);transform:scale(1.206) rotate3d(1,.79,.88,-1104deg)}}snowfall snowflake:nth-child(13){animation:animation-snowflake-13 linear infinite;animation-duration:9.6s;animation-delay:-3.7s}@keyframes animation-snowflake-13{0%{left:35%;top:calc(0% - 100px);transform:scale(.83) rotate3d(.71,.4,.55,0deg)}100%{left:33.7%;top:calc(100% + 100px);transform:scale(.83) rotate3d(.32,.98,.05,-751deg)}}snowfall snowflake:nth-child(12){animation:animation-snowflake-12 linear infinite;animation-duration:14.9s;animation-delay:-12.7s}@keyframes animation-snowflake-12{0%{left:100%;top:calc(0% - 100px);transform:scale(.842) rotate3d(.24,.64,.95,0deg)}100%{left:102.6%;top:calc(100% + 100px);transform:scale(.842) rotate3d(.35,.75,.27,-1036deg)}}snowfall snowflake:nth-child(11){animation:animation-snowflake-11 linear infinite;animation-duration:9.6s;animation-delay:-10.1s}@keyframes animation-snowflake-11{0%{left:38%;top:calc(0% - 100px);transform:scale(.657) rotate3d(.96,.89,.08,0deg)}100%{left:26.2%;top:calc(100% + 100px);transform:scale(.657) rotate3d(.38,.17,.49,966deg)}}snowfall snowflake:nth-child(10){animation:animation-snowflake-10 linear infinite;animation-duration:11.6s;animation-delay:0s}@keyframes animation-snowflake-10{0%{left:7%;top:calc(0% - 100px);transform:scale(.853) rotate3d(.55,.12,.29,0deg)}100%{left:1.1%;top:calc(100% + 100px);transform:scale(.853) rotate3d(.89,.15,.88,-1051deg)}}snowfall snowflake:nth-child(9){animation:animation-snowflake-9 linear infinite;animation-duration:10.1s;animation-delay:-1.1s}@keyframes animation-snowflake-9{0%{left:27%;top:calc(0% - 100px);transform:scale(1.089) rotate3d(.53,.28,.7,0deg)}100%{left:35.9%;top:calc(100% + 100px);transform:scale(1.089) rotate3d(.2,.34,.61,839deg)}}snowfall snowflake:nth-child(8){animation:animation-snowflake-8 linear infinite;animation-duration:12.2s;animation-delay:-13.1s}@keyframes animation-snowflake-8{0%{left:100%;top:calc(0% - 100px);transform:scale(1.267) rotate3d(.12,.05,.67,0deg)}100%{left:80.2%;top:calc(100% + 100px);transform:scale(1.267) rotate3d(.83,.53,.26,1210deg)}}snowfall snowflake:nth-child(7){animation:animation-snowflake-7 linear infinite;animation-duration:14.4s;animation-delay:-8.3s}@keyframes animation-snowflake-7{0%{left:88%;top:calc(0% - 100px);transform:scale(.735) rotate3d(.19,.67,.92,0deg)}100%{left:99.9%;top:calc(100% + 100px);transform:scale(.735) rotate3d(.61,.2,.61,732deg)}}snowfall snowflake:nth-child(6){animation:animation-snowflake-6 linear infinite;animation-duration:10.1s;animation-delay:-1.6s}@keyframes animation-snowflake-6{0%{left:97%;top:calc(0% - 100px);transform:scale(.843) rotate3d(.91,.22,.24,0deg)}100%{left:77.6%;top:calc(100% + 100px);transform:scale(.843) rotate3d(.28,.42,.7,-1136deg)}}snowfall snowflake:nth-child(5){animation:animation-snowflake-5 linear infinite;animation-duration:15s;animation-delay:-15.8s}@keyframes animation-snowflake-5{0%{left:75%;top:calc(0% - 100px);transform:scale(1.273) rotate3d(.43,.12,.5,0deg)}100%{left:78.4%;top:calc(100% + 100px);transform:scale(1.273) rotate3d(.85,.92,.24,756deg)}}snowfall snowflake:nth-child(4){animation:animation-snowflake-4 linear infinite;animation-duration:8.9s;animation-delay:-8.3s}@keyframes animation-snowflake-4{0%{left:62%;top:calc(0% - 100px);transform:scale(.733) rotate3d(.59,.92,.35,0deg)}100%{left:99.9%;top:calc(100% + 100px);transform:scale(.733) rotate3d(.1,.92,.88,-1240deg)}}snowfall snowflake:nth-child(3){animation:animation-snowflake-3 linear infinite;animation-duration:11s;animation-delay:-14.6s}@keyframes animation-snowflake-3{0%{left:22%;top:calc(0% - 100px);transform:scale(.985) rotate3d(.07,.47,.03,0deg)}100%{left:5.5%;top:calc(100% + 100px);transform:scale(.985) rotate3d(.71,.56,.29,-1298deg)}}snowfall snowflake:nth-child(2){animation:animation-snowflake-2 linear infinite;animation-duration:14.3s;animation-delay:-7.3s}@keyframes animation-snowflake-2{0%{left:4%;top:calc(0% - 100px);transform:scale(.756) rotate3d(.09,.66,.96,0deg)}100%{left:40%;top:calc(100% + 100px);transform:scale(.756) rotate3d(.9,.7,.22,-1393deg)}}snowfall snowflake:nth-child(1){animation:animation-snowflake-1 linear infinite;animation-duration:12.4s;animation-delay:-14.9s}@keyframes animation-snowflake-1{0%{left:30%;top:calc(0% - 100px);transform:scale(.656) rotate3d(.08,.14,.22,0deg)}100%{left:53.2%;top:calc(100% + 100px);transform:scale(.656) rotate3d(.58,.99,.13,729deg)}}
|