Button by asgardOP

1.ul {
2  width: fit-content;
3  height: fit-content;
4  background-color: transparent;
5  list-style: none;
6}
7.li {
8  margin-bottom: 0px;
9}
10.button {
11  background-color: transparent;
12  font-family: sans-serif;
13  color: rgb(255, 255, 255);
14  border: none;
15  font-size: 22px;
16  font-weight: 700;
17  padding: 10px 30px;
18  cursor: pointer;
19  position: relative;
20  padding-left: 11px;
21  text-align: center;
22  transition: 0.1s;
23  z-index: 1;
24}
25
26.p {
27  z-index: 2;
28  position: relative;
29}
30
31.button:hover {
32  color: rgb(172, 40, 0);
33  text-align: center;
34}
35.button:hover::before {
36  transform: rotate(0deg);
37  width: 100%;
38  height: 40px;
39  top: 2px;
40  border-radius: 3px;
41  background-color: rgb(255, 83, 53);
42}
43.button::before {
44  content: "";
45  border-radius: 1px;
46  position: absolute;
47  width: 6px;
48  height: 6px;
49  background-color: tomato;
50  left: -10px;
51  top: 19px;
52  cursor: pointer;
53  transform: rotate(225deg);
54  transition: 0.3s;
55  z-index: -1;
56}
57
58.button:active::before {
59  background-color: rgb(255, 38, 0);
60}
61