Day 29 鐵人賽太空粒子的例子
相信大家對於這個頁面都不陌生吧。這是我們2023 iThome 鐵人賽的首頁。我覺得他的粒子特效和地球很酷，所以我們今天就來看看怎麼做吧。
以下是今天我們的目標。為了版面乾淨我省略了上面的文字，只留下熊俠、標題、粒子特效、和地球。且為了讓他不要太長我有稍微縮小了一點。
HTML 架構
上面 header 我們放了兩張圖片，一個是熊俠，一個是標題。下面的 section 我們放了五個 div，它們分別是
- 粒子特效
- 粒子特效
- 粒子特效
- 光線
- 地球
1<header>
2 <img src="https://ithelp.ithome.com.tw/static/2023ironman/img/event/kv_deco_front.png" alt="">
3 <img src="https://ithelp.ithome.com.tw/static/2023ironman/img/event/logo-ironmankv.svg" alt="">
4</header>
5<section class="sec_eff">
6 <div class="stars"></div>
7 <div class="stars2"></div>
8 <div class="stars3"></div>
9 <div class="horizon">
10 <div class="glow"></div>
11 </div>
12 <div class="earth"></div>
13 </div>
14</section>
header 版面
裡面兩張圖片用 flex 置中。背景放圖片上面疊上一層漸層。大小設為 cover 確保圖片有填滿。最後再調整一下上方的 padding 讓它看起來比較好看。
背景圖片寫前面的會疊在上面，寫後面的會疊在下面。
官網在背景圖片設定
background-size時因為被background屬性預設的auto值影響，所以使用了!important，不過其實只需要打在後面就可以了。
1header {
2 display: flex;
3 justify-content: center;
4 align-items: center;
5 flex-direction: column;
6 height: 60vh;
7 background: linear-gradient(
8 to bottom,
9 rgba(17, 55, 126, 0) 0%,
10 rgba(17, 55, 126, 0) 35%,
11 rgba(17, 55, 126, 1) 100%
12 ),
13 url(https://ithelp.ithome.com.tw/static/2023ironman/img/kv_bg.jpg) no-repeat
14 center;
15 background-size: cover;
16 padding-top: 3.5rem;
17}
18header img {
19 width: 37%;
20}
宇宙
我們先弄一個宇宙
1 background: #11377e;
2 min-height: 40vh;
3 position: relative;
然後做一束高光，並進行定位。原理是先搞一個橢圓形
1.horizon {
2 position: absolute;
3 width: 160%;
4 height: 70%;
5 background: #038bff;
6 left: -30%;
7 bottom: -20%;
8 border-radius: 100%/100%;
9}
然後再模糊一下
1filter: blur(30px);
關於置中我們之前有提到，可以把 left 設為 (寬度-100)/2，這樣就不需要再用 transform 或是 margin-left 來調整位置了。
再多加幾個光點
1.horizon:before {
2 content: "";
3 position: absolute;
4 width: 81.25%;
5 height: 70%;
6 background: #51afff;
7 -webkit-filter: blur(30px);
8 opacity: 0.6;
9 margin-left: 9.375%;
10 border-radius: 100%/100%;
11}
12
13.horizon:after {
14 content: " ";
15 position: absolute;
16 width: 32%;
17 height: 20%;
18 border-radius: 650px/350px;
19 background: #b0daff;
20 -webkit-filter: blur(30px);
21 opacity: 0.5;
22 margin-left: 34%;
23 border-radius: 100%/100%;
24}
25
26.horizon .glow {
27 position: absolute;
28 width: 100%;
29 height: 100%;
30 background: #215496;
31 -webkit-filter: blur(200px);
32 opacity: 0.7;
33 top: -10%;
34 border-radius: 100%/100%;
35}
地球
加上一點內陰影讓他看起來更有立體感。
1.earth {
2 position: absolute;
3 width: 200%;
4 height: 100%;
5 background: #2c4790;
6 left: -50%;
7 bottom: -50%;
8 border-radius: 100%/100%;
9 box-shadow: inset 0px 0px 62px 20px rgba(60, 105, 138, 0.85);
10}
星空
星空效果 iThome 沒有使用什麼 particles.js。我們打開 FireFox Dev Tools 的動畫分頁可以看出原來這是一個長150秒的往上移動 CSS 動畫。
1@keyframes animStar {
2 from {
3 transform: translateY(0px);
4 }
5
6 to {
7 transform: translateY(-2000px);
8 }
9}
而裡面是使用陰影製作放入一堆星星座標，這些點點會隨著動畫往上移動。我們放三個 div 來做三層星空，而裡面再使用 ::before 和 ::after 來做更多的星星。以下是一個星星大概的樣子。
1.stars {
2 width: 1px;
3 height: 1px;
4 background: transparent;
5 box-shadow: 1665px 905px #fff, 1973px 1300px #fff, 873px 1598px #fff,
6 1380px 1879px #fff, 1694px 73px #fff, 84px 1196px #fff, 64px 203px #fff,
7 1153px 637px #fff, 1123px 586px #fff, 1522px 1014px #fff, 585px 991px #fff...
8}
好啦結合在一起完成了，我們來看看成果吧。
https://codepen.io/edit-mr/pen/OJrGmyW
1<header>
2 <img src="https://ithelp.ithome.com.tw/static/2023ironman/img/event/kv_deco_front.png" alt="">
3 <img src="https://ithelp.ithome.com.tw/static/2023ironman/img/event/logo-ironmankv.svg" alt="">
4</header>
5<section class="sec_eff">
6 <div class="stars"></div>
7 <div class="stars2"></div>
8 <div class="stars3"></div>
9 <div class="horizon">
10 <div class="glow"></div>
11 </div>
12 <div class="earth"></div>
13 </div>
14</section>
1* {
2 padding: 0;
3 margin: 0;
4 box-sizing: border-box;
5}
6body {
7 overflow: hidden;
8}
9header {
10 display: flex;
11 justify-content: center;
12 align-items: center;
13 flex-direction: column;
14 height: 60vh;
15 background: linear-gradient(
16 to bottom,
17 rgba(17, 55, 126, 0) 0%,
18 rgba(17, 55, 126, 0) 35%,
19 rgba(17, 55, 126, 1) 100%
20 ),
21 url(https://ithelp.ithome.com.tw/static/2023ironman/img/kv_bg.jpg) no-repeat
22 center;
23 background-size: cover;
24 padding-top: 3.5rem;
25}
26header img {
27 width: 37%;
28}
29section {
30 padding: 0;
31 background: #11377e;
32 height: 40vh;
33 position: relative;
34}
35
36.stars {
37 width: 1px;
38 height: 1px;
39 background: transparent;
40 box-shadow: 1665px 905px #fff, 1973px 1300px #fff, 873px 1598px #fff,
41 1380px 1879px #fff, 1694px 73px #fff, 84px 1196px #fff, 64px 203px #fff,
42 1153px 637px #fff, 1123px 586px #fff, 1522px 1014px #fff, 585px 991px #fff,
43 919px 475px #fff, 1304px 1012px #fff, 41px 405px #fff, 413px 1035px #fff,
44 964px 1719px #fff, 1297px 1968px #fff, 921px 313px #fff, 1672px 1797px #fff,
45 1936px 1414px #fff, 1330px 1893px #fff, 137px 1968px #fff, 650px 80px #fff,
46 1010px 164px #fff, 1812px 1531px #fff, 932px 1391px #fff, 1866px 1791px #fff,
47 448px 709px #fff, 1197px 361px #fff, 598px 1716px #fff, 201px 1385px #fff,
48 619px 1008px #fff, 399px 594px #fff, 1920px 400px #fff, 1191px 1610px #fff,
49 38px 1305px #fff, 1585px 1996px #fff, 82px 1248px #fff, 1718px 1511px #fff,
50 1911px 1385px #fff, 432px 429px #fff, 877px 1753px #fff, 1942px 1041px #fff,
51 1179px 1237px #fff, 803px 873px #fff, 1349px 1953px #fff, 716px 396px #fff,
52 945px 785px #fff, 727px 1451px #fff, 1609px 1074px #fff, 729px 1982px #fff,
53 1600px 263px #fff, 1759px 1512px #fff, 1647px 1963px #fff, 476px 567px #fff,
54 1233px 1450px #fff, 409px 289px #fff, 868px 635px #fff, 1742px 961px #fff,
55 1667px 530px #fff, 219px 1025px #fff, 441px 380px #fff, 418px 154px #fff,
56 1481px 1171px #fff, 1356px 1389px #fff, 1542px 1527px #fff, 820px 562px #fff,
57 1550px 1619px #fff, 1844px 862px #fff, 1251px 274px #fff, 1813px 1213px #fff,
58 188px 1861px #fff, 374px 680px #fff, 9px 1554px #fff, 241px 77px #fff,
59 759px 1856px #fff, 763px 968px #fff, 1430px 304px #fff, 265px 559px #fff,
60 1780px 1729px #fff, 1818px 78px #fff, 1332px 1435px #fff, 1949px 1900px #fff,
61 521px 21px #fff, 1552px 106px #fff, 756px 764px #fff, 783px 1985px #fff,
62 1431px 776px #fff, 1320px 211px #fff, 784px 461px #fff, 1012px 1314px #fff,
63 1632px 1042px #fff, 813px 1963px #fff, 1391px 1922px #fff,
64 1929px 1748px #fff, 777px 1088px #fff, 1462px 1982px #fff, 210px 123px #fff,
65 155px 1187px #fff, 1451px 1023px #fff, 1172px 1449px #fff, 934px 1741px #fff,
66 942px 607px #fff, 387px 1425px #fff, 987px 255px #fff, 278px 1531px #fff,
67 372px 1977px #fff, 379px 710px #fff, 1219px 468px #fff, 1243px 898px #fff,
68 154px 1255px #fff, 1798px 1264px #fff, 1481px 401px #fff, 338px 1887px #fff,
69 171px 1488px #fff, 802px 685px #fff, 1px 906px #fff, 378px 1993px #fff,
70 1432px 1237px #fff, 425px 350px #fff, 1369px 244px #fff, 109px 797px #fff,
71 1851px 522px #fff, 1987px 1805px #fff, 270px 1738px #fff, 1004px 776px #fff,
72 671px 13px #fff, 61px 1461px #fff, 1846px 65px #fff, 383px 1457px #fff,
73 861px 945px #fff, 1429px 145px #fff, 784px 1077px #fff, 78px 1226px #fff,
74 285px 1185px #fff, 1933px 1295px #fff, 735px 981px #fff, 1714px 1944px #fff,
75 1443px 1623px #fff, 1176px 1887px #fff, 773px 680px #fff, 1829px 1191px #fff,
76 1154px 1509px #fff, 1005px 1941px #fff, 165px 1152px #fff, 968px 519px #fff,
77 1066px 1787px #fff, 793px 1313px #fff, 688px 1287px #fff, 462px 970px #fff,
78 1401px 959px #fff, 616px 386px #fff, 239px 1679px #fff, 1894px 575px #fff,
79 1721px 894px #fff, 410px 1883px #fff, 434px 1714px #fff, 1190px 663px #fff,
80 857px 1661px #fff, 969px 201px #fff, 987px 1321px #fff, 774px 1403px #fff,
81 416px 759px #fff, 1740px 1727px #fff, 180px 1776px #fff, 1222px 1208px #fff,
82 1628px 1226px #fff, 1626px 25px #fff, 1490px 403px #fff, 971px 228px #fff,
83 1968px 566px #fff, 642px 1329px #fff, 1190px 707px #fff, 1654px 1781px #fff,
84 570px 856px #fff, 1598px 1631px #fff, 1945px 1078px #fff, 452px 322px #fff,
85 854px 953px #fff, 117px 939px #fff, 147px 233px #fff, 1731px 1954px #fff,
86 1792px 1077px #fff, 979px 1290px #fff, 558px 1357px #fff, 26px 1194px #fff,
87 1781px 366px #fff, 1187px 1547px #fff, 1096px 1628px #fff, 1286px 275px #fff,
88 718px 728px #fff, 402px 968px #fff, 1568px 389px #fff, 602px 1986px #fff,
89 347px 260px #fff, 1319px 790px #fff, 49px 118px #fff, 1405px 1009px #fff,
90 1190px 794px #fff, 1080px 943px #fff, 488px 1273px #fff, 602px 521px #fff,
91 172px 1277px #fff, 899px 1474px #fff, 1501px 1252px #fff, 1930px 565px #fff,
92 1281px 696px #fff, 1859px 63px #fff, 717px 797px #fff, 435px 557px #fff,
93 1703px 1909px #fff, 1243px 1573px #fff, 1088px 100px #fff, 575px 1207px #fff,
94 1544px 1619px #fff, 1387px 1643px #fff, 794px 144px #fff, 542px 1224px #fff,
95 1451px 1206px #fff, 1592px 380px #fff, 478px 1121px #fff, 1487px 1294px #fff,
96 32px 823px #fff, 1982px 527px #fff, 482px 1527px #fff, 488px 852px #fff,
97 1393px 1932px #fff, 1931px 1506px #fff, 558px 299px #fff, 677px 1152px #fff,
98 1473px 1639px #fff, 1949px 515px #fff, 1353px 982px #fff, 594px 1517px #fff,
99 10px 1896px #fff, 512px 1217px #fff, 1738px 973px #fff, 614px 640px #fff,
100 86px 231px #fff, 1567px 850px #fff, 1601px 218px #fff, 1979px 276px #fff,
101 654px 922px #fff, 400px 1552px #fff, 706px 1483px #fff, 930px 882px #fff,
102 1651px 1636px #fff, 732px 1662px #fff, 1069px 1105px #fff, 1304px 561px #fff,
103 193px 1671px #fff, 906px 1141px #fff, 380px 1301px #fff, 146px 24px #fff,
104 133px 522px #fff, 1645px 502px #fff, 719px 1320px #fff, 1702px 1031px #fff,
105 792px 1457px #fff, 1668px 907px #fff, 1149px 175px #fff, 1017px 1718px #fff,
106 554px 524px #fff, 1705px 1905px #fff, 1082px 450px #fff, 1895px 848px #fff,
107 738px 689px #fff, 381px 501px #fff, 1018px 1607px #fff, 298px 499px #fff,
108 38px 142px #fff, 339px 1859px #fff, 731px 1198px #fff, 485px 768px #fff,
109 636px 1676px #fff, 768px 435px #fff, 702px 195px #fff, 1921px 5px #fff,
110 761px 1840px #fff, 552px 35px #fff, 1607px 1610px #fff, 1406px 1483px #fff,
111 1056px 672px #fff, 1564px 1621px #fff, 714px 1408px #fff, 1246px 1449px #fff,
112 186px 1871px #fff, 861px 1109px #fff, 1285px 1601px #fff, 1446px 279px #fff,
113 1526px 1055px #fff, 1277px 1963px #fff, 474px 343px #fff, 968px 1803px #fff,
114 14px 50px #fff, 1730px 1656px #fff, 1765px 1521px #fff, 1352px 375px #fff,
115 476px 1313px #fff, 52px 1780px #fff, 1502px 1264px #fff, 503px 965px #fff,
116 1134px 1713px #fff, 1978px 939px #fff, 1051px 1208px #fff, 249px 1302px #fff,
117 246px 1055px #fff, 1575px 1616px #fff, 138px 1501px #fff, 330px 667px #fff,
118 1516px 1155px #fff, 1972px 1487px #fff, 333px 341px #fff, 1895px 1578px #fff,
119 1176px 664px #fff, 454px 1200px #fff, 845px 1459px #fff, 913px 1051px #fff,
120 1642px 1485px #fff, 1652px 1038px #fff, 1530px 1160px #fff,
121 172px 1145px #fff, 1311px 1476px #fff, 1509px 937px #fff, 102px 1820px #fff,
122 1868px 1916px #fff, 1592px 1062px #fff, 1326px 46px #fff, 343px 1594px #fff,
123 1829px 1180px #fff, 1583px 786px #fff, 1359px 759px #fff, 307px 284px #fff,
124 1652px 1360px #fff, 1433px 886px #fff, 1893px 708px #fff, 1728px 352px #fff,
125 1121px 606px #fff, 1213px 540px #fff, 1581px 978px #fff, 1264px 1589px #fff,
126 1477px 600px #fff, 497px 209px #fff, 315px 1061px #fff, 1420px 1210px #fff,
127 420px 1765px #fff, 1653px 64px #fff, 822px 1625px #fff, 279px 1733px #fff,
128 1702px 964px #fff, 596px 1341px #fff, 901px 920px #fff, 1673px 781px #fff,
129 726px 1958px #fff, 141px 1661px #fff, 847px 853px #fff, 22px 1618px #fff,
130 1048px 131px #fff, 1212px 1058px #fff, 641px 1931px #fff, 223px 1919px #fff,
131 1127px 49px #fff, 154px 1429px #fff, 619px 481px #fff, 1297px 826px #fff,
132 599px 1788px #fff, 988px 1997px #fff, 1558px 563px #fff, 1822px 763px #fff,
133 1263px 1022px #fff, 1743px 1143px #fff, 759px 1320px #fff, 1146px 153px #fff,
134 329px 343px #fff, 776px 424px #fff, 988px 958px #fff, 732px 1349px #fff,
135 1262px 1329px #fff, 1970px 1937px #fff, 1485px 220px #fff,
136 1642px 1851px #fff, 967px 1320px #fff, 1976px 834px #fff, 831px 1727px #fff,
137 1247px 575px #fff, 914px 1639px #fff, 745px 609px #fff, 1620px 1933px #fff,
138 812px 1503px #fff, 18px 798px #fff, 669px 189px #fff, 1927px 332px #fff,
139 1084px 330px #fff, 1569px 1651px #fff, 1843px 1392px #fff, 985px 1337px #fff,
140 228px 260px #fff, 1115px 1455px #fff, 1489px 1404px #fff, 300px 1470px #fff,
141 1480px 567px #fff, 103px 1131px #fff, 902px 499px #fff, 1254px 1008px #fff,
142 1545px 1498px #fff, 698px 11px #fff, 1794px 1178px #fff, 1331px 984px #fff,
143 1311px 1813px #fff, 1166px 600px #fff, 353px 64px #fff, 1881px 1215px #fff,
144 70px 223px #fff, 124px 1287px #fff, 489px 758px #fff, 515px 1073px #fff,
145 925px 288px #fff, 341px 853px #fff, 67px 821px #fff, 497px 692px #fff,
146 1063px 401px #fff, 1900px 1380px #fff, 212px 1516px #fff, 369px 1477px #fff,
147 259px 674px #fff, 167px 1283px #fff, 1217px 1546px #fff, 1752px 1666px #fff,
148 1318px 605px #fff, 1015px 466px #fff, 1794px 1552px #fff, 367px 1003px #fff,
149 1459px 283px #fff, 849px 689px #fff, 1894px 79px #fff, 698px 1136px #fff,
150 550px 32px #fff, 1437px 1747px #fff, 1613px 1305px #fff, 561px 65px #fff,
151 742px 452px #fff, 890px 777px #fff, 1246px 293px #fff, 1207px 423px #fff,
152 373px 1772px #fff, 400px 360px #fff, 827px 1859px #fff, 1711px 579px #fff,
153 1815px 493px #fff, 1659px 180px #fff, 821px 293px #fff, 1958px 754px #fff,
154 575px 1385px #fff, 346px 478px #fff, 1632px 1059px #fff, 1841px 1840px #fff,
155 813px 899px #fff, 963px 48px #fff, 1357px 120px #fff, 594px 1608px #fff,
156 797px 16px #fff, 1372px 1261px #fff, 1205px 1624px #fff, 1777px 1519px #fff,
157 55px 232px #fff, 1416px 1668px #fff, 65px 494px #fff, 636px 639px #fff,
158 1166px 376px #fff, 863px 1606px #fff, 32px 160px #fff, 162px 1992px #fff,
159 282px 838px #fff, 712px 1613px #fff, 752px 126px #fff, 1809px 1834px #fff,
160 551px 775px #fff, 1832px 1796px #fff, 426px 399px #fff, 1032px 1571px #fff,
161 379px 1453px #fff, 1186px 1504px #fff, 1529px 1867px #fff, 667px 1442px #fff,
162 140px 1797px #fff, 857px 1938px #fff, 1760px 1655px #fff, 880px 742px #fff,
163 1674px 1773px #fff, 1718px 776px #fff, 439px 1401px #fff, 1002px 1741px #fff,
164 1251px 772px #fff, 570px 215px #fff, 1903px 844px #fff, 1598px 95px #fff,
165 660px 1679px #fff, 934px 395px #fff, 561px 1650px #fff, 357px 1790px #fff,
166 565px 474px #fff, 1682px 1789px #fff, 805px 988px #fff, 822px 1438px #fff,
167 881px 896px #fff, 1909px 1729px #fff, 1307px 875px #fff, 1286px 273px #fff,
168 484px 340px #fff, 1136px 742px #fff, 682px 23px #fff, 842px 1920px #fff,
169 144px 519px #fff, 1738px 1091px #fff, 1918px 1267px #fff, 227px 1061px #fff,
170 21px 168px #fff, 435px 1977px #fff, 674px 430px #fff, 262px 750px #fff,
171 1693px 323px #fff, 723px 1818px #fff, 1562px 1459px #fff, 335px 973px #fff,
172 801px 1301px #fff, 1319px 1975px #fff, 514px 1767px #fff, 727px 1414px #fff,
173 549px 1046px #fff, 1875px 995px #fff, 1671px 1727px #fff, 1084px 1149px #fff,
174 1893px 1598px #fff, 1670px 1491px #fff, 963px 64px #fff, 304px 398px #fff,
175 7px 1926px #fff, 1725px 421px #fff, 356px 1055px #fff, 302px 1760px #fff,
176 1604px 504px #fff, 985px 545px #fff, 800px 1492px #fff, 1787px 449px #fff,
177 1467px 627px #fff, 454px 966px #fff, 851px 491px #fff, 149px 1643px #fff,
178 705px 1305px #fff, 1995px 726px #fff, 381px 1345px #fff, 1079px 498px #fff,
179 835px 299px #fff, 1573px 236px #fff, 1918px 1261px #fff, 1094px 871px #fff,
180 1814px 954px #fff, 1123px 183px #fff, 1329px 1692px #fff, 400px 578px #fff,
181 32px 180px #fff, 488px 653px #fff, 1598px 1956px #fff, 60px 215px #fff,
182 677px 187px #fff, 1916px 301px #fff, 1568px 9px #fff, 1288px 744px #fff,
183 379px 131px #fff, 676px 181px #fff, 1152px 1560px #fff, 60px 444px #fff,
184 273px 417px #fff, 1905px 1728px #fff, 292px 1031px #fff, 1169px 675px #fff,
185 253px 1946px #fff, 1980px 566px #fff, 1919px 1554px #fff, 1257px 112px #fff,
186 375px 1784px #fff, 872px 546px #fff, 1478px 643px #fff, 1617px 1383px #fff,
187 434px 1720px #fff, 1432px 383px #fff, 544px 1041px #fff, 1305px 1662px #fff,
188 837px 1942px #fff, 1003px 1239px #fff, 1620px 1263px #fff, 34px 1965px #fff,
189 910px 649px #fff, 517px 1192px #fff, 380px 1986px #fff, 998px 1217px #fff,
190 1907px 1336px #fff, 1553px 905px #fff, 787px 1618px #fff, 1821px 1220px #fff,
191 879px 924px #fff, 461px 1082px #fff, 355px 1521px #fff, 1525px 544px #fff,
192 973px 773px #fff, 1769px 1168px #fff, 1944px 865px #fff, 963px 426px #fff,
193 749px 1869px #fff, 1297px 1077px #fff, 1383px 429px #fff, 762px 1953px #fff,
194 545px 313px #fff, 1852px 1012px #fff, 792px 465px #fff, 1901px 172px #fff,
195 1419px 1071px #fff, 846px 1524px #fff, 1060px 438px #fff, 700px 481px #fff,
196 1916px 575px #fff, 612px 914px #fff, 682px 1849px #fff, 1402px 235px #fff,
197 347px 1728px #fff, 1727px 569px #fff, 1028px 502px #fff, 1259px 498px #fff,
198 533px 470px #fff, 23px 1264px #fff, 1063px 1847px #fff, 1604px 1186px #fff,
199 1344px 1048px #fff, 1940px 580px #fff, 1383px 954px #fff, 867px 685px #fff,
200 1937px 1817px #fff, 1854px 1462px #fff, 1542px 744px #fff, 42px 1194px #fff,
201 1606px 411px #fff, 1162px 1787px #fff, 1262px 1133px #fff, 990px 42px #fff,
202 776px 1810px #fff, 1620px 1919px #fff, 1182px 1125px #fff, 112px 874px #fff,
203 468px 1881px #fff, 1681px 127px #fff, 853px 416px #fff, 661px 1038px #fff,
204 1875px 218px #fff, 883px 1792px #fff, 537px 386px #fff, 763px 1013px #fff,
205 558px 862px #fff, 1766px 1106px #fff, 826px 70px #fff, 1785px 1216px #fff,
206 27px 1710px #fff, 1226px 416px #fff, 835px 1570px #fff, 346px 63px #fff,
207 1217px 611px #fff, 1265px 879px #fff, 1276px 840px #fff, 817px 1228px #fff,
208 83px 674px #fff, 685px 766px #fff, 1945px 554px #fff, 697px 691px #fff,
209 332px 115px #fff, 770px 758px #fff, 1739px 757px #fff, 1417px 825px #fff,
210 928px 1369px #fff, 579px 905px #fff, 1862px 1695px #fff, 1991px 880px #fff,
211 1501px 415px #fff, 1319px 347px #fff, 713px 930px #fff, 1317px 1131px #fff,
212 1034px 1871px #fff, 760px 134px #fff, 724px 656px #fff, 1380px 1623px #fff,
213 383px 1183px #fff, 5px 953px #fff, 1614px 1248px #fff, 1510px 1350px #fff,
214 255px 217px #fff, 544px 1096px #fff, 1818px 413px #fff, 1165px 255px #fff,
215 1372px 1813px #fff, 1173px 1888px #fff, 1970px 1388px #fff, 1032px 87px #fff;
216 animation: animStar 50s linear infinite;
217}
218
219.stars:after {
220 content: " ";
221 position: absolute;
222 top: 2000px;
223 width: 1px;
224 height: 1px;
225 background: transparent;
226 box-shadow: 1665px 905px #fff, 1973px 1300px #fff, 873px 1598px #fff,
227 1380px 1879px #fff, 1694px 73px #fff, 84px 1196px #fff, 64px 203px #fff,
228 1153px 637px #fff, 1123px 586px #fff, 1522px 1014px #fff, 585px 991px #fff,
229 919px 475px #fff, 1304px 1012px #fff, 41px 405px #fff, 413px 1035px #fff,
230 964px 1719px #fff, 1297px 1968px #fff, 921px 313px #fff, 1672px 1797px #fff,
231 1936px 1414px #fff, 1330px 1893px #fff, 137px 1968px #fff, 650px 80px #fff,
232 1010px 164px #fff, 1812px 1531px #fff, 932px 1391px #fff, 1866px 1791px #fff,
233 448px 709px #fff, 1197px 361px #fff, 598px 1716px #fff, 201px 1385px #fff,
234 619px 1008px #fff, 399px 594px #fff, 1920px 400px #fff, 1191px 1610px #fff,
235 38px 1305px #fff, 1585px 1996px #fff, 82px 1248px #fff, 1718px 1511px #fff,
236 1911px 1385px #fff, 432px 429px #fff, 877px 1753px #fff, 1942px 1041px #fff,
237 1179px 1237px #fff, 803px 873px #fff, 1349px 1953px #fff, 716px 396px #fff,
238 945px 785px #fff, 727px 1451px #fff, 1609px 1074px #fff, 729px 1982px #fff,
239 1600px 263px #fff, 1759px 1512px #fff, 1647px 1963px #fff, 476px 567px #fff,
240 1233px 1450px #fff, 409px 289px #fff, 868px 635px #fff, 1742px 961px #fff,
241 1667px 530px #fff, 219px 1025px #fff, 441px 380px #fff, 418px 154px #fff,
242 1481px 1171px #fff, 1356px 1389px #fff, 1542px 1527px #fff, 820px 562px #fff,
243 1550px 1619px #fff, 1844px 862px #fff, 1251px 274px #fff, 1813px 1213px #fff,
244 188px 1861px #fff, 374px 680px #fff, 9px 1554px #fff, 241px 77px #fff,
245 759px 1856px #fff, 763px 968px #fff, 1430px 304px #fff, 265px 559px #fff,
246 1780px 1729px #fff, 1818px 78px #fff, 1332px 1435px #fff, 1949px 1900px #fff,
247 521px 21px #fff, 1552px 106px #fff, 756px 764px #fff, 783px 1985px #fff,
248 1431px 776px #fff, 1320px 211px #fff, 784px 461px #fff, 1012px 1314px #fff,
249 1632px 1042px #fff, 813px 1963px #fff, 1391px 1922px #fff,
250 1929px 1748px #fff, 777px 1088px #fff, 1462px 1982px #fff, 210px 123px #fff,
251 155px 1187px #fff, 1451px 1023px #fff, 1172px 1449px #fff, 934px 1741px #fff,
252 942px 607px #fff, 387px 1425px #fff, 987px 255px #fff, 278px 1531px #fff,
253 372px 1977px #fff, 379px 710px #fff, 1219px 468px #fff, 1243px 898px #fff,
254 154px 1255px #fff, 1798px 1264px #fff, 1481px 401px #fff, 338px 1887px #fff,
255 171px 1488px #fff, 802px 685px #fff, 1px 906px #fff, 378px 1993px #fff,
256 1432px 1237px #fff, 425px 350px #fff, 1369px 244px #fff, 109px 797px #fff,
257 1851px 522px #fff, 1987px 1805px #fff, 270px 1738px #fff, 1004px 776px #fff,
258 671px 13px #fff, 61px 1461px #fff, 1846px 65px #fff, 383px 1457px #fff,
259 861px 945px #fff, 1429px 145px #fff, 784px 1077px #fff, 78px 1226px #fff,
260 285px 1185px #fff, 1933px 1295px #fff, 735px 981px #fff, 1714px 1944px #fff,
261 1443px 1623px #fff, 1176px 1887px #fff, 773px 680px #fff, 1829px 1191px #fff,
262 1154px 1509px #fff, 1005px 1941px #fff, 165px 1152px #fff, 968px 519px #fff,
263 1066px 1787px #fff, 793px 1313px #fff, 688px 1287px #fff, 462px 970px #fff,
264 1401px 959px #fff, 616px 386px #fff, 239px 1679px #fff, 1894px 575px #fff,
265 1721px 894px #fff, 410px 1883px #fff, 434px 1714px #fff, 1190px 663px #fff,
266 857px 1661px #fff, 969px 201px #fff, 987px 1321px #fff, 774px 1403px #fff,
267 416px 759px #fff, 1740px 1727px #fff, 180px 1776px #fff, 1222px 1208px #fff,
268 1628px 1226px #fff, 1626px 25px #fff, 1490px 403px #fff, 971px 228px #fff,
269 1968px 566px #fff, 642px 1329px #fff, 1190px 707px #fff, 1654px 1781px #fff,
270 570px 856px #fff, 1598px 1631px #fff, 1945px 1078px #fff, 452px 322px #fff,
271 854px 953px #fff, 117px 939px #fff, 147px 233px #fff, 1731px 1954px #fff,
272 1792px 1077px #fff, 979px 1290px #fff, 558px 1357px #fff, 26px 1194px #fff,
273 1781px 366px #fff, 1187px 1547px #fff, 1096px 1628px #fff, 1286px 275px #fff,
274 718px 728px #fff, 402px 968px #fff, 1568px 389px #fff, 602px 1986px #fff,
275 347px 260px #fff, 1319px 790px #fff, 49px 118px #fff, 1405px 1009px #fff,
276 1190px 794px #fff, 1080px 943px #fff, 488px 1273px #fff, 602px 521px #fff,
277 172px 1277px #fff, 899px 1474px #fff, 1501px 1252px #fff, 1930px 565px #fff,
278 1281px 696px #fff, 1859px 63px #fff, 717px 797px #fff, 435px 557px #fff,
279 1703px 1909px #fff, 1243px 1573px #fff, 1088px 100px #fff, 575px 1207px #fff,
280 1544px 1619px #fff, 1387px 1643px #fff, 794px 144px #fff, 542px 1224px #fff,
281 1451px 1206px #fff, 1592px 380px #fff, 478px 1121px #fff, 1487px 1294px #fff,
282 32px 823px #fff, 1982px 527px #fff, 482px 1527px #fff, 488px 852px #fff,
283 1393px 1932px #fff, 1931px 1506px #fff, 558px 299px #fff, 677px 1152px #fff,
284 1473px 1639px #fff, 1949px 515px #fff, 1353px 982px #fff, 594px 1517px #fff,
285 10px 1896px #fff, 512px 1217px #fff, 1738px 973px #fff, 614px 640px #fff,
286 86px 231px #fff, 1567px 850px #fff, 1601px 218px #fff, 1979px 276px #fff,
287 654px 922px #fff, 400px 1552px #fff, 706px 1483px #fff, 930px 882px #fff,
288 1651px 1636px #fff, 732px 1662px #fff, 1069px 1105px #fff, 1304px 561px #fff,
289 193px 1671px #fff, 906px 1141px #fff, 380px 1301px #fff, 146px 24px #fff,
290 133px 522px #fff, 1645px 502px #fff, 719px 1320px #fff, 1702px 1031px #fff,
291 792px 1457px #fff, 1668px 907px #fff, 1149px 175px #fff, 1017px 1718px #fff,
292 554px 524px #fff, 1705px 1905px #fff, 1082px 450px #fff, 1895px 848px #fff,
293 738px 689px #fff, 381px 501px #fff, 1018px 1607px #fff, 298px 499px #fff,
294 38px 142px #fff, 339px 1859px #fff, 731px 1198px #fff, 485px 768px #fff,
295 636px 1676px #fff, 768px 435px #fff, 702px 195px #fff, 1921px 5px #fff,
296 761px 1840px #fff, 552px 35px #fff, 1607px 1610px #fff, 1406px 1483px #fff,
297 1056px 672px #fff, 1564px 1621px #fff, 714px 1408px #fff, 1246px 1449px #fff,
298 186px 1871px #fff, 861px 1109px #fff, 1285px 1601px #fff, 1446px 279px #fff,
299 1526px 1055px #fff, 1277px 1963px #fff, 474px 343px #fff, 968px 1803px #fff,
300 14px 50px #fff, 1730px 1656px #fff, 1765px 1521px #fff, 1352px 375px #fff,
301 476px 1313px #fff, 52px 1780px #fff, 1502px 1264px #fff, 503px 965px #fff,
302 1134px 1713px #fff, 1978px 939px #fff, 1051px 1208px #fff, 249px 1302px #fff,
303 246px 1055px #fff, 1575px 1616px #fff, 138px 1501px #fff, 330px 667px #fff,
304 1516px 1155px #fff, 1972px 1487px #fff, 333px 341px #fff, 1895px 1578px #fff,
305 1176px 664px #fff, 454px 1200px #fff, 845px 1459px #fff, 913px 1051px #fff,
306 1642px 1485px #fff, 1652px 1038px #fff, 1530px 1160px #fff,
307 172px 1145px #fff, 1311px 1476px #fff, 1509px 937px #fff, 102px 1820px #fff,
308 1868px 1916px #fff, 1592px 1062px #fff, 1326px 46px #fff, 343px 1594px #fff,
309 1829px 1180px #fff, 1583px 786px #fff, 1359px 759px #fff, 307px 284px #fff,
310 1652px 1360px #fff, 1433px 886px #fff, 1893px 708px #fff, 1728px 352px #fff,
311 1121px 606px #fff, 1213px 540px #fff, 1581px 978px #fff, 1264px 1589px #fff,
312 1477px 600px #fff, 497px 209px #fff, 315px 1061px #fff, 1420px 1210px #fff,
313 420px 1765px #fff, 1653px 64px #fff, 822px 1625px #fff, 279px 1733px #fff,
314 1702px 964px #fff, 596px 1341px #fff, 901px 920px #fff, 1673px 781px #fff,
315 726px 1958px #fff, 141px 1661px #fff, 847px 853px #fff, 22px 1618px #fff,
316 1048px 131px #fff, 1212px 1058px #fff, 641px 1931px #fff, 223px 1919px #fff,
317 1127px 49px #fff, 154px 1429px #fff, 619px 481px #fff, 1297px 826px #fff,
318 599px 1788px #fff, 988px 1997px #fff, 1558px 563px #fff, 1822px 763px #fff,
319 1263px 1022px #fff, 1743px 1143px #fff, 759px 1320px #fff, 1146px 153px #fff,
320 329px 343px #fff, 776px 424px #fff, 988px 958px #fff, 732px 1349px #fff,
321 1262px 1329px #fff, 1970px 1937px #fff, 1485px 220px #fff,
322 1642px 1851px #fff, 967px 1320px #fff, 1976px 834px #fff, 831px 1727px #fff,
323 1247px 575px #fff, 914px 1639px #fff, 745px 609px #fff, 1620px 1933px #fff,
324 812px 1503px #fff, 18px 798px #fff, 669px 189px #fff, 1927px 332px #fff,
325 1084px 330px #fff, 1569px 1651px #fff, 1843px 1392px #fff, 985px 1337px #fff,
326 228px 260px #fff, 1115px 1455px #fff, 1489px 1404px #fff, 300px 1470px #fff,
327 1480px 567px #fff, 103px 1131px #fff, 902px 499px #fff, 1254px 1008px #fff,
328 1545px 1498px #fff, 698px 11px #fff, 1794px 1178px #fff, 1331px 984px #fff,
329 1311px 1813px #fff, 1166px 600px #fff, 353px 64px #fff, 1881px 1215px #fff,
330 70px 223px #fff, 124px 1287px #fff, 489px 758px #fff, 515px 1073px #fff,
331 925px 288px #fff, 341px 853px #fff, 67px 821px #fff, 497px 692px #fff,
332 1063px 401px #fff, 1900px 1380px #fff, 212px 1516px #fff, 369px 1477px #fff,
333 259px 674px #fff, 167px 1283px #fff, 1217px 1546px #fff, 1752px 1666px #fff,
334 1318px 605px #fff, 1015px 466px #fff, 1794px 1552px #fff, 367px 1003px #fff,
335 1459px 283px #fff, 849px 689px #fff, 1894px 79px #fff, 698px 1136px #fff,
336 550px 32px #fff, 1437px 1747px #fff, 1613px 1305px #fff, 561px 65px #fff,
337 742px 452px #fff, 890px 777px #fff, 1246px 293px #fff, 1207px 423px #fff,
338 373px 1772px #fff, 400px 360px #fff, 827px 1859px #fff, 1711px 579px #fff,
339 1815px 493px #fff, 1659px 180px #fff, 821px 293px #fff, 1958px 754px #fff,
340 575px 1385px #fff, 346px 478px #fff, 1632px 1059px #fff, 1841px 1840px #fff,
341 813px 899px #fff, 963px 48px #fff, 1357px 120px #fff, 594px 1608px #fff,
342 797px 16px #fff, 1372px 1261px #fff, 1205px 1624px #fff, 1777px 1519px #fff,
343 55px 232px #fff, 1416px 1668px #fff, 65px 494px #fff, 636px 639px #fff,
344 1166px 376px #fff, 863px 1606px #fff, 32px 160px #fff, 162px 1992px #fff,
345 282px 838px #fff, 712px 1613px #fff, 752px 126px #fff, 1809px 1834px #fff,
346 551px 775px #fff, 1832px 1796px #fff, 426px 399px #fff, 1032px 1571px #fff,
347 379px 1453px #fff, 1186px 1504px #fff, 1529px 1867px #fff, 667px 1442px #fff,
348 140px 1797px #fff, 857px 1938px #fff, 1760px 1655px #fff, 880px 742px #fff,
349 1674px 1773px #fff, 1718px 776px #fff, 439px 1401px #fff, 1002px 1741px #fff,
350 1251px 772px #fff, 570px 215px #fff, 1903px 844px #fff, 1598px 95px #fff,
351 660px 1679px #fff, 934px 395px #fff, 561px 1650px #fff, 357px 1790px #fff,
352 565px 474px #fff, 1682px 1789px #fff, 805px 988px #fff, 822px 1438px #fff,
353 881px 896px #fff, 1909px 1729px #fff, 1307px 875px #fff, 1286px 273px #fff,
354 484px 340px #fff, 1136px 742px #fff, 682px 23px #fff, 842px 1920px #fff,
355 144px 519px #fff, 1738px 1091px #fff, 1918px 1267px #fff, 227px 1061px #fff,
356 21px 168px #fff, 435px 1977px #fff, 674px 430px #fff, 262px 750px #fff,
357 1693px 323px #fff, 723px 1818px #fff, 1562px 1459px #fff, 335px 973px #fff,
358 801px 1301px #fff, 1319px 1975px #fff, 514px 1767px #fff, 727px 1414px #fff,
359 549px 1046px #fff, 1875px 995px #fff, 1671px 1727px #fff, 1084px 1149px #fff,
360 1893px 1598px #fff, 1670px 1491px #fff, 963px 64px #fff, 304px 398px #fff,
361 7px 1926px #fff, 1725px 421px #fff, 356px 1055px #fff, 302px 1760px #fff,
362 1604px 504px #fff, 985px 545px #fff, 800px 1492px #fff, 1787px 449px #fff,
363 1467px 627px #fff, 454px 966px #fff, 851px 491px #fff, 149px 1643px #fff,
364 705px 1305px #fff, 1995px 726px #fff, 381px 1345px #fff, 1079px 498px #fff,
365 835px 299px #fff, 1573px 236px #fff, 1918px 1261px #fff, 1094px 871px #fff,
366 1814px 954px #fff, 1123px 183px #fff, 1329px 1692px #fff, 400px 578px #fff,
367 32px 180px #fff, 488px 653px #fff, 1598px 1956px #fff, 60px 215px #fff,
368 677px 187px #fff, 1916px 301px #fff, 1568px 9px #fff, 1288px 744px #fff,
369 379px 131px #fff, 676px 181px #fff, 1152px 1560px #fff, 60px 444px #fff,
370 273px 417px #fff, 1905px 1728px #fff, 292px 1031px #fff, 1169px 675px #fff,
371 253px 1946px #fff, 1980px 566px #fff, 1919px 1554px #fff, 1257px 112px #fff,
372 375px 1784px #fff, 872px 546px #fff, 1478px 643px #fff, 1617px 1383px #fff,
373 434px 1720px #fff, 1432px 383px #fff, 544px 1041px #fff, 1305px 1662px #fff,
374 837px 1942px #fff, 1003px 1239px #fff, 1620px 1263px #fff, 34px 1965px #fff,
375 910px 649px #fff, 517px 1192px #fff, 380px 1986px #fff, 998px 1217px #fff,
376 1907px 1336px #fff, 1553px 905px #fff, 787px 1618px #fff, 1821px 1220px #fff,
377 879px 924px #fff, 461px 1082px #fff, 355px 1521px #fff, 1525px 544px #fff,
378 973px 773px #fff, 1769px 1168px #fff, 1944px 865px #fff, 963px 426px #fff,
379 749px 1869px #fff, 1297px 1077px #fff, 1383px 429px #fff, 762px 1953px #fff,
380 545px 313px #fff, 1852px 1012px #fff, 792px 465px #fff, 1901px 172px #fff,
381 1419px 1071px #fff, 846px 1524px #fff, 1060px 438px #fff, 700px 481px #fff,
382 1916px 575px #fff, 612px 914px #fff, 682px 1849px #fff, 1402px 235px #fff,
383 347px 1728px #fff, 1727px 569px #fff, 1028px 502px #fff, 1259px 498px #fff,
384 533px 470px #fff, 23px 1264px #fff, 1063px 1847px #fff, 1604px 1186px #fff,
385 1344px 1048px #fff, 1940px 580px #fff, 1383px 954px #fff, 867px 685px #fff,
386 1937px 1817px #fff, 1854px 1462px #fff, 1542px 744px #fff, 42px 1194px #fff,
387 1606px 411px #fff, 1162px 1787px #fff, 1262px 1133px #fff, 990px 42px #fff,
388 776px 1810px #fff, 1620px 1919px #fff, 1182px 1125px #fff, 112px 874px #fff,
389 468px 1881px #fff, 1681px 127px #fff, 853px 416px #fff, 661px 1038px #fff,
390 1875px 218px #fff, 883px 1792px #fff, 537px 386px #fff, 763px 1013px #fff,
391 558px 862px #fff, 1766px 1106px #fff, 826px 70px #fff, 1785px 1216px #fff,
392 27px 1710px #fff, 1226px 416px #fff, 835px 1570px #fff, 346px 63px #fff,
393 1217px 611px #fff, 1265px 879px #fff, 1276px 840px #fff, 817px 1228px #fff,
394 83px 674px #fff, 685px 766px #fff, 1945px 554px #fff, 697px 691px #fff,
395 332px 115px #fff, 770px 758px #fff, 1739px 757px #fff, 1417px 825px #fff,
396 928px 1369px #fff, 579px 905px #fff, 1862px 1695px #fff, 1991px 880px #fff,
397 1501px 415px #fff, 1319px 347px #fff, 713px 930px #fff, 1317px 1131px #fff,
398 1034px 1871px #fff, 760px 134px #fff, 724px 656px #fff, 1380px 1623px #fff,
399 383px 1183px #fff, 5px 953px #fff, 1614px 1248px #fff, 1510px 1350px #fff,
400 255px 217px #fff, 544px 1096px #fff, 1818px 413px #fff, 1165px 255px #fff,
401 1372px 1813px #fff, 1173px 1888px #fff, 1970px 1388px #fff, 1032px 87px #fff;
402}
403
404.stars2 {
405 width: 2px;
406 height: 2px;
407 background: transparent;
408 box-shadow: 197px 1147px #fff, 1881px 971px #fff, 31px 834px #fff,
409 898px 1518px #fff, 1701px 1126px #fff, 467px 1034px #fff, 1360px 983px #fff,
410 1687px 1784px #fff, 1739px 29px #fff, 145px 993px #fff, 1187px 722px #fff,
411 527px 910px #fff, 1491px 715px #fff, 1173px 1910px #fff, 755px 1917px #fff,
412 1830px 1185px #fff, 1663px 583px #fff, 543px 1875px #fff, 490px 1340px #fff,
413 987px 547px #fff, 158px 409px #fff, 1011px 1813px #fff, 1860px 534px #fff,
414 322px 1560px #fff, 835px 1698px #fff, 1838px 685px #fff, 1622px 1913px #fff,
415 441px 738px #fff, 899px 1509px #fff, 416px 1186px #fff, 130px 1103px #fff,
416 1554px 1736px #fff, 906px 1867px #fff, 1776px 340px #fff, 632px 1394px #fff,
417 1861px 601px #fff, 1578px 200px #fff, 1500px 560px #fff, 1187px 1553px #fff,
418 1443px 1685px #fff, 1417px 1211px #fff, 1305px 808px #fff, 1418px 779px #fff,
419 1938px 1205px #fff, 1320px 595px #fff, 501px 3px #fff, 1315px 381px #fff,
420 778px 264px #fff, 327px 1252px #fff, 1692px 753px #fff, 41px 41px #fff,
421 1775px 1273px #fff, 1995px 314px #fff, 293px 1048px #fff, 509px 1092px #fff,
422 34px 375px #fff, 533px 664px #fff, 538px 469px #fff, 856px 589px #fff,
423 1077px 1850px #fff, 280px 1938px #fff, 1130px 1300px #fff, 847px 1652px #fff,
424 1777px 806px #fff, 999px 1869px #fff, 701px 1483px #fff, 1803px 762px #fff,
425 1530px 254px #fff, 1153px 1277px #fff, 1397px 1096px #fff, 1676px 873px #fff,
426 1671px 244px #fff, 1979px 668px #fff, 1266px 1192px #fff, 1968px 43px #fff,
427 1110px 1896px #fff, 1666px 203px #fff, 1025px 1577px #fff, 1840px 193px #fff,
428 996px 525px #fff, 1023px 1083px #fff, 1809px 1247px #fff, 546px 391px #fff,
429 813px 801px #fff, 398px 1228px #fff, 1699px 1495px #fff, 96px 381px #fff,
430 1238px 98px #fff, 1870px 94px #fff, 1715px 241px #fff, 415px 1345px #fff,
431 1867px 506px #fff, 624px 453px #fff, 1200px 1662px #fff, 1889px 790px #fff,
432 613px 1546px #fff, 1884px 462px #fff, 163px 227px #fff, 1527px 66px #fff,
433 422px 587px #fff, 423px 1393px #fff, 1187px 755px #fff, 202px 683px #fff,
434 1784px 811px #fff, 84px 45px #fff, 208px 174px #fff, 1060px 414px #fff,
435 1501px 772px #fff, 1612px 1821px #fff, 1901px 395px #fff, 1480px 1744px #fff,
436 1592px 675px #fff, 358px 840px #fff, 705px 1818px #fff, 1667px 1180px #fff,
437 1123px 386px #fff, 1912px 1561px #fff, 804px 112px #fff, 309px 1476px #fff,
438 244px 253px #fff, 1027px 1937px #fff, 1036px 558px #fff, 621px 1442px #fff,
439 768px 628px #fff, 756px 89px #fff, 1044px 319px #fff, 1297px 1667px #fff,
440 945px 1218px #fff, 789px 1990px #fff, 665px 1467px #fff, 1836px 81px #fff,
441 415px 1273px #fff, 68px 1205px #fff, 1621px 1823px #fff, 85px 1610px #fff,
442 1252px 1125px #fff, 334px 958px #fff, 1422px 1069px #fff, 1488px 455px #fff,
443 1570px 374px #fff, 1012px 698px #fff, 86px 581px #fff, 519px 1176px #fff,
444 1279px 1961px #fff, 1181px 321px #fff, 1593px 1111px #fff, 555px 84px #fff,
445 1071px 1481px #fff, 530px 1495px #fff, 367px 1954px #fff, 94px 1355px #fff,
446 815px 417px #fff, 1409px 1428px #fff, 1680px 1781px #fff, 1040px 488px #fff,
447 1552px 1718px #fff, 1767px 1851px #fff, 32px 362px #fff, 1924px 636px #fff,
448 286px 1412px #fff, 1489px 1248px #fff, 614px 1651px #fff, 1106px 329px #fff,
449 254px 1103px #fff, 1010px 325px #fff, 999px 1061px #fff, 408px 1958px #fff,
450 407px 1585px #fff, 764px 774px #fff, 1173px 896px #fff, 1258px 638px #fff,
451 1744px 1072px #fff, 1944px 931px #fff, 1727px 1278px #fff, 289px 649px #fff,
452 1870px 222px #fff, 1418px 776px #fff, 1269px 975px #fff, 906px 1686px #fff,
453 1545px 1267px #fff, 1418px 388px #fff, 46px 738px #fff, 1268px 899px #fff,
454 536px 1685px #fff, 1186px 142px #fff, 1144px 1663px #fff, 1144px 682px #fff,
455 146px 1758px #fff, 1775px 222px #fff, 1272px 781px #fff, 1267px 911px #fff,
456 1355px 337px #fff, 1733px 1418px #fff, 883px 1415px #fff, 1892px 687px #fff,
457 607px 783px #fff, 538px 734px #fff, 789px 1344px #fff, 1358px 596px #fff,
458 1728px 1015px #fff;
459 animation: animStar 100s linear infinite;
460}
461
462.stars2:after {
463 content: " ";
464 position: absolute;
465 top: 2000px;
466 width: 2px;
467 height: 2px;
468 background: transparent;
469 box-shadow: 197px 1147px #fff, 1881px 971px #fff, 31px 834px #fff,
470 898px 1518px #fff, 1701px 1126px #fff, 467px 1034px #fff, 1360px 983px #fff,
471 1687px 1784px #fff, 1739px 29px #fff, 145px 993px #fff, 1187px 722px #fff,
472 527px 910px #fff, 1491px 715px #fff, 1173px 1910px #fff, 755px 1917px #fff,
473 1830px 1185px #fff, 1663px 583px #fff, 543px 1875px #fff, 490px 1340px #fff,
474 987px 547px #fff, 158px 409px #fff, 1011px 1813px #fff, 1860px 534px #fff,
475 322px 1560px #fff, 835px 1698px #fff, 1838px 685px #fff, 1622px 1913px #fff,
476 441px 738px #fff, 899px 1509px #fff, 416px 1186px #fff, 130px 1103px #fff,
477 1554px 1736px #fff, 906px 1867px #fff, 1776px 340px #fff, 632px 1394px #fff,
478 1861px 601px #fff, 1578px 200px #fff, 1500px 560px #fff, 1187px 1553px #fff,
479 1443px 1685px #fff, 1417px 1211px #fff, 1305px 808px #fff, 1418px 779px #fff,
480 1938px 1205px #fff, 1320px 595px #fff, 501px 3px #fff, 1315px 381px #fff,
481 778px 264px #fff, 327px 1252px #fff, 1692px 753px #fff, 41px 41px #fff,
482 1775px 1273px #fff, 1995px 314px #fff, 293px 1048px #fff, 509px 1092px #fff,
483 34px 375px #fff, 533px 664px #fff, 538px 469px #fff, 856px 589px #fff,
484 1077px 1850px #fff, 280px 1938px #fff, 1130px 1300px #fff, 847px 1652px #fff,
485 1777px 806px #fff, 999px 1869px #fff, 701px 1483px #fff, 1803px 762px #fff,
486 1530px 254px #fff, 1153px 1277px #fff, 1397px 1096px #fff, 1676px 873px #fff,
487 1671px 244px #fff, 1979px 668px #fff, 1266px 1192px #fff, 1968px 43px #fff,
488 1110px 1896px #fff, 1666px 203px #fff, 1025px 1577px #fff, 1840px 193px #fff,
489 996px 525px #fff, 1023px 1083px #fff, 1809px 1247px #fff, 546px 391px #fff,
490 813px 801px #fff, 398px 1228px #fff, 1699px 1495px #fff, 96px 381px #fff,
491 1238px 98px #fff, 1870px 94px #fff, 1715px 241px #fff, 415px 1345px #fff,
492 1867px 506px #fff, 624px 453px #fff, 1200px 1662px #fff, 1889px 790px #fff,
493 613px 1546px #fff, 1884px 462px #fff, 163px 227px #fff, 1527px 66px #fff,
494 422px 587px #fff, 423px 1393px #fff, 1187px 755px #fff, 202px 683px #fff,
495 1784px 811px #fff, 84px 45px #fff, 208px 174px #fff, 1060px 414px #fff,
496 1501px 772px #fff, 1612px 1821px #fff, 1901px 395px #fff, 1480px 1744px #fff,
497 1592px 675px #fff, 358px 840px #fff, 705px 1818px #fff, 1667px 1180px #fff,
498 1123px 386px #fff, 1912px 1561px #fff, 804px 112px #fff, 309px 1476px #fff,
499 244px 253px #fff, 1027px 1937px #fff, 1036px 558px #fff, 621px 1442px #fff,
500 768px 628px #fff, 756px 89px #fff, 1044px 319px #fff, 1297px 1667px #fff,
501 945px 1218px #fff, 789px 1990px #fff, 665px 1467px #fff, 1836px 81px #fff,
502 415px 1273px #fff, 68px 1205px #fff, 1621px 1823px #fff, 85px 1610px #fff,
503 1252px 1125px #fff, 334px 958px #fff, 1422px 1069px #fff, 1488px 455px #fff,
504 1570px 374px #fff, 1012px 698px #fff, 86px 581px #fff, 519px 1176px #fff,
505 1279px 1961px #fff, 1181px 321px #fff, 1593px 1111px #fff, 555px 84px #fff,
506 1071px 1481px #fff, 530px 1495px #fff, 367px 1954px #fff, 94px 1355px #fff,
507 815px 417px #fff, 1409px 1428px #fff, 1680px 1781px #fff, 1040px 488px #fff,
508 1552px 1718px #fff, 1767px 1851px #fff, 32px 362px #fff, 1924px 636px #fff,
509 286px 1412px #fff, 1489px 1248px #fff, 614px 1651px #fff, 1106px 329px #fff,
510 254px 1103px #fff, 1010px 325px #fff, 999px 1061px #fff, 408px 1958px #fff,
511 407px 1585px #fff, 764px 774px #fff, 1173px 896px #fff, 1258px 638px #fff,
512 1744px 1072px #fff, 1944px 931px #fff, 1727px 1278px #fff, 289px 649px #fff,
513 1870px 222px #fff, 1418px 776px #fff, 1269px 975px #fff, 906px 1686px #fff,
514 1545px 1267px #fff, 1418px 388px #fff, 46px 738px #fff, 1268px 899px #fff,
515 536px 1685px #fff, 1186px 142px #fff, 1144px 1663px #fff, 1144px 682px #fff,
516 146px 1758px #fff, 1775px 222px #fff, 1272px 781px #fff, 1267px 911px #fff,
517 1355px 337px #fff, 1733px 1418px #fff, 883px 1415px #fff, 1892px 687px #fff,
518 607px 783px #fff, 538px 734px #fff, 789px 1344px #fff, 1358px 596px #fff,
519 1728px 1015px #fff;
520}
521
522.stars3 {
523 width: 3px;
524 height: 3px;
525 background: transparent;
526 box-shadow: 1351px 1339px #fff, 1041px 1607px #fff, 748px 575px #fff,
527 881px 567px #fff, 1630px 41px #fff, 1459px 990px #fff, 1946px 718px #fff,
528 623px 1811px #fff, 872px 20px #fff, 1087px 1739px #fff, 1595px 1087px #fff,
529 957px 721px #fff, 1399px 182px #fff, 1611px 1257px #fff, 402px 720px #fff,
530 1666px 746px #fff, 1820px 1485px #fff, 1221px 1538px #fff, 36px 258px #fff,
531 1154px 292px #fff, 998px 642px #fff, 1756px 1543px #fff, 1033px 1895px #fff,
532 522px 115px #fff, 1329px 355px #fff, 1180px 1883px #fff, 1200px 438px #fff,
533 1432px 595px #fff, 1295px 460px #fff, 779px 1071px #fff, 238px 1639px #fff,
534 1504px 1257px #fff, 1815px 560px #fff, 1712px 1549px #fff, 1150px 890px #fff,
535 1054px 658px #fff, 1715px 1751px #fff, 1994px 1439px #fff,
536 1076px 1147px #fff, 878px 1108px #fff, 339px 1199px #fff, 1303px 975px #fff,
537 1162px 649px #fff, 1903px 155px #fff, 1092px 706px #fff, 1028px 1752px #fff,
538 432px 1314px #fff, 508px 1057px #fff, 173px 459px #fff, 749px 1819px #fff,
539 856px 884px #fff, 1638px 1523px #fff, 323px 1905px #fff, 1148px 1513px #fff,
540 16px 1416px #fff, 1611px 1779px #fff, 987px 830px #fff, 900px 15px #fff,
541 642px 855px #fff, 1423px 964px #fff, 928px 752px #fff, 812px 1135px #fff,
542 1067px 1384px #fff, 435px 1826px #fff, 1393px 1857px #fff, 971px 1542px #fff,
543 110px 693px #fff, 453px 509px #fff, 849px 1126px #fff, 1627px 1176px #fff,
544 1287px 88px #fff, 1265px 309px #fff, 671px 1984px #fff, 1514px 1833px #fff,
545 243px 1832px #fff, 1516px 773px #fff, 1543px 461px #fff, 1363px 888px #fff,
546 414px 1461px #fff, 1609px 1271px #fff, 1898px 1558px #fff, 412px 1579px #fff,
547 1593px 1317px #fff, 1425px 1875px #fff, 951px 999px #fff, 418px 1254px #fff,
548 595px 1779px #fff, 864px 754px #fff, 1052px 911px #fff, 1652px 1525px #fff,
549 540px 389px #fff, 1380px 587px #fff, 1406px 1779px #fff, 251px 841px #fff,
550 1806px 1696px #fff, 1599px 1165px #fff, 1965px 477px #fff,
551 1861px 1781px #fff, 347px 135px #fff, 421px 1306px #fff;
552 animation: animStar 150s linear infinite;
553}
554
555.stars3:after {
556 content: " ";
557 position: absolute;
558 top: 2000px;
559 width: 3px;
560 height: 3px;
561 background: transparent;
562 box-shadow: 1351px 1339px #fff, 1041px 1607px #fff, 748px 575px #fff,
563 881px 567px #fff, 1630px 41px #fff, 1459px 990px #fff, 1946px 718px #fff,
564 623px 1811px #fff, 872px 20px #fff, 1087px 1739px #fff, 1595px 1087px #fff,
565 957px 721px #fff, 1399px 182px #fff, 1611px 1257px #fff, 402px 720px #fff,
566 1666px 746px #fff, 1820px 1485px #fff, 1221px 1538px #fff, 36px 258px #fff,
567 1154px 292px #fff, 998px 642px #fff, 1756px 1543px #fff, 1033px 1895px #fff,
568 522px 115px #fff, 1329px 355px #fff, 1180px 1883px #fff, 1200px 438px #fff,
569 1432px 595px #fff, 1295px 460px #fff, 779px 1071px #fff, 238px 1639px #fff,
570 1504px 1257px #fff, 1815px 560px #fff, 1712px 1549px #fff, 1150px 890px #fff,
571 1054px 658px #fff, 1715px 1751px #fff, 1994px 1439px #fff,
572 1076px 1147px #fff, 878px 1108px #fff, 339px 1199px #fff, 1303px 975px #fff,
573 1162px 649px #fff, 1903px 155px #fff, 1092px 706px #fff, 1028px 1752px #fff,
574 432px 1314px #fff, 508px 1057px #fff, 173px 459px #fff, 749px 1819px #fff,
575 856px 884px #fff, 1638px 1523px #fff, 323px 1905px #fff, 1148px 1513px #fff,
576 16px 1416px #fff, 1611px 1779px #fff, 987px 830px #fff, 900px 15px #fff,
577 642px 855px #fff, 1423px 964px #fff, 928px 752px #fff, 812px 1135px #fff,
578 1067px 1384px #fff, 435px 1826px #fff, 1393px 1857px #fff, 971px 1542px #fff,
579 110px 693px #fff, 453px 509px #fff, 849px 1126px #fff, 1627px 1176px #fff,
580 1287px 88px #fff, 1265px 309px #fff, 671px 1984px #fff, 1514px 1833px #fff,
581 243px 1832px #fff, 1516px 773px #fff, 1543px 461px #fff, 1363px 888px #fff,
582 414px 1461px #fff, 1609px 1271px #fff, 1898px 1558px #fff, 412px 1579px #fff,
583 1593px 1317px #fff, 1425px 1875px #fff, 951px 999px #fff, 418px 1254px #fff,
584 595px 1779px #fff, 864px 754px #fff, 1052px 911px #fff, 1652px 1525px #fff,
585 540px 389px #fff, 1380px 587px #fff, 1406px 1779px #fff, 251px 841px #fff,
586 1806px 1696px #fff, 1599px 1165px #fff, 1965px 477px #fff,
587 1861px 1781px #fff, 347px 135px #fff, 421px 1306px #fff;
588}
589
590.horizon {
591 position: absolute;
592 width: 160%;
593 height: 70%;
594 background: #038bff;
595 filter: blur(30px);
596 left: -30%;
597 bottom: -20%;
598 border-radius: 100%/100%;
599}
600
601.horizon:before {
602 content: "";
603 position: absolute;
604 width: 81.25%;
605 height: 70%;
606 background: #51afff;
607 -webkit-filter: blur(30px);
608 opacity: 0.6;
609 margin-left: 9.375%;
610 border-radius: 100%/100%;
611}
612
613.horizon:after {
614 content: " ";
615 position: absolute;
616 width: 32%;
617 height: 20%;
618 border-radius: 650px/350px;
619 background: #b0daff;
620 -webkit-filter: blur(30px);
621 opacity: 0.5;
622 margin-left: 34%;
623 border-radius: 100%/100%;
624}
625
626.horizon .glow {
627 position: absolute;
628 width: 100%;
629 height: 100%;
630 background: #215496;
631 -webkit-filter: blur(200px);
632 opacity: 0.7;
633 top: -10%;
634 border-radius: 100%/100%;
635}
636
637.earth {
638 position: absolute;
639 width: 200%;
640 height: 100%;
641 background: #2c4790;
642 left: -50%;
643 bottom: -50%;
644 border-radius: 100%/100%;
645 box-shadow: inset 0px 0px 62px 20px rgba(60, 105, 138, 0.85);
646}
647
648@keyframes animStar {
649 from {
650 transform: translateY(0px);
651 }
652
653 to {
654 transform: translateY(-2000px);
655 }
656}
以上就是我今天的分享，歡迎在 Instagram 和 Google 新聞追蹤毛哥EM資訊密技，也歡迎訂閱我新開的YouTube頻道：網棧。
我是毛哥EM，讓我們明天再見。