1@import url('https://fonts.googleapis.com/css2?family=Source+Sans+Pro:wght@200;300;400;500;700;900&display=swap');
2
3::-webkit-scrollbar {
4 width: 10px;
5}
6
7::-webkit-scrollbar-track-piece {
8 background-color: #393939;
9}
10
11::-webkit-scrollbar-thumb {
12 background-color: #FFFFFF;
13}
14
15html {
16 scrollbar-color: #ffffff #393939;
17 scrollbar-width: thin;
18}
19
20body {
21 position: relative;
22 margin: 0;
23 font-family: "Source Sans Pro";
24 color: white;
25 background: #000000;
26 font-weight: 200;
27 text-shadow: 0px 0px 5px black;
28 width: 100vw;
29 height: 100vh;
30}
31
32#container {
33 position: absolute;
34 top: 0;
35 left: 0;
36 width: 100vw;
37 height: 100vh;
38}
39
40#info-container {
41 position: absolute;
42 top: 64px;
43 left: 256px;
44 border: white solid 1px;
45 padding: 8px;
46 width: 320px;
47}
48
49.ptelement {
50 position: absolute;
51 border: white solid 1px;
52 background: black;
53 width: 60px;
54 height: 60px;
55 text-align: center;
56 font-size: 24px;
57 border-radius: 2px;
58 transition: filter 0.3s ease-in-out;
59}
60
61.element-name {
62 font-size: 10px;
63}
64
65.element-a-number {
66 position: absolute;
67 font-size: 8px;
68 top: 4px;
69 left: 4px;
70}
71
72.element-z-number {
73 position: absolute;
74 font-size: 8px;
75 bottom: 4px;
76 left: 4px;
77}
78
79#home-link {
80 position: absolute;
81 top: 40px;
82 right: 40px;
83}
84
85#home-link-a {
86 color: white;
87 text-decoration: none;
88 font-size: 32px;
89 font-weight: 400;
90}
91
92#home-icon {
93 width: 32px;
94 height: 32px;
95}
96
97.info-element{
98 animation: loadIn 0.2s ease-in-out;
99}
100
101@keyframes loadIn {
102 from{
103 opacity: 0;
104 transform: translateY(-10px);
105 }
106 to{
107 opacity: 1;
108 transform: translateY(0px);
109 }
110}