1.card {
2  position: relative;
3  width: 400px;
4  height: 300px;
5  background-color: rgb(0, 0, 0);
6  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.3);
7  border-radius: 20px;
8  transition: transform 0.3s ease-in-out;
9}
10
11.card:hover {
12  transform: scale(1.05);
13}
14
15.heading {
16  padding: 20px;
17  border-radius: 20px;
18  background-color: rgb(22, 21, 21);
19  color: #fff;
20  font-size: 24px;
21  font-weight: bold;
22}
23
24.heading span {
25  color: rgba(157,71,255,1);
26}
27
28.content {
29  display: flex;
30  align-items: center;
31  justify-content: space-around;
32  height: calc(78% - 80px);
33  padding: 40px 20px;
34  background-color: #000000;
35}
36
37.item {
38  display: flex;
39  flex-direction: column;
40  align-items: center;
41  cursor: pointer;
42  transition: transform 0.3s ease-in-out;
43}
44
45.item:hover {
46  transform: translateY(-10px);
47}
48
49.item svg {
50  width: 48px;
51  height: 48px;
52  margin-bottom: 16px;
53  fill: #333;
54  transition: all 0.3s;
55  color: #333;
56}
57
58.item span {
59  font-size: 16px;
60  font-weight: bold;
61  text-align: center;
62  color: #333;
63}
64
65.card .item:hover {
66  background-color: #000000;
67  cursor: pointer;
68}
69
70.card .item--create:hover span {
71  color: rgb(51, 255, 0);
72}
73
74.card .item--create:hover svg {
75  color: rgb(94, 255, 0);
76}
77
78.card .item--create:hover svg {
79  transform: rotate(45deg);
80}
81
82.card .item--post:hover span {
83  color: rgba(157,71,255,1);
84}
85
86.card .item--post:hover svg {
87  color: rgba(157,71,255,1);
88  transform: scale(1.2);
89}
90
91.card .item--inspire:hover svg {
92  color: yellow;
93  transform: scale(1.2);
94}
95
96.card .item--inspire:hover span {
97  color: yellow;
98  transform: scale(1.2);
99}
100
101button {
102  background: rgba(157,71,255,1);
103  width: 100%;
104  padding: 12px 20px;
105  border-radius: 0px 200px 0px 200px;
106  -moz-border-radius: 0px 200px 0px 200px;
107  -webkit-border-radius: 0px 200px 0px 200px;
108  font-size: 18px;
109  border: none;
110  transition: transform 0.3s ease-in-out;
111  font-weight: bold;
112}
113
114button:hover {
115  background: rgba(145,71,255,1);
116  color: #fff;
117  transform: scale(1.01);
118}