1/* k k im joking */
2.container {
3  display: flex;
4  flex-direction: column;
5  justify-content: center;
6  gap: 1em;
7  color: rgb(129, 129, 129);
8}
9
10.container p {
11  margin-left: 6px;
12}
13
14.button {
15  transition: 180ms ease-in-out;
16  position: relative;
17  display: flex;
18  flex-direction: row;
19  justify-content: center;
20  width: 240px;
21  height: 68px;
22  background: linear-gradient(#ffffff, #7a7a7a);
23  border-radius: 10px;
24  box-shadow: 10px 15px 30px #0000006b, inset -8px 0 8px rgba(196, 196, 196, 0.25), inset 0 -8px 8px rgba(134, 134, 134, 0.15);
25}
26
27.button::before {
28  transition: 180ms ease-in-out;
29  content: '';
30  position: absolute;
31  top: 3px;
32  left: 3px;
33  bottom: 12px;
34  right: 8px;
35  background: linear-gradient(90deg, #c0c0c0, #ffffff);
36  box-shadow: -10px -10px 10px rgba(255, 255, 255, 0.25),
37  10px 5px 10px rgba(0,0,0,0.15);
38  border-radius: 10px;
39  border-left: 1px solid #0004;
40  border-top: 1px solid #0004;
41  border-right: 1px solid #0004;
42  border-bottom: 1px solid #0004;
43}
44
45.button:active {
46  box-shadow: 16px 16px 30px rgba(0, 0, 0, 0.25), inset -8px 0 8px rgba(196, 196, 196, 0.25), inset 0 -8px 8px rgba(134, 134, 134, 0.15);
47}
48
49.button:active::before {
50  transition: 180ms ease-in-out;
51  top: 3px;
52  left: 1px;
53  bottom: 12px;
54  right: 6px;
55  filter: brightness(0.95);
56}
57
58#bump {
59  position: absolute;
60  bottom: 18px;
61  height: 4px;
62  width: 24px;
63  border-radius: 8px;
64  background: rgb(179, 179, 179);
65}
66
67.button li {
68  list-style: none;
69  position: absolute;
70  font-size: medium;
71  font-family: Arial, Helvetica, sans-serif;
72  font-style: italic;
73  margin-top: 8px;
74}