1/* Style for the entire card */
2.card {
3  background-color: #f9f9f9;
4  border-radius: 8px;
5  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
6  display: inline-block;
7  margin: 16px;
8  padding: 16px;
9  width: 300px;
10}
11
12/* Style for the card heading */
13.heading {
14  color: #444444;
15  font-family: "Open Sans", sans-serif;
16  font-size: 20px;
17  font-weight: bold;
18  margin-bottom: 16px;
19  text-align: center;
20  text-transform: uppercase;
21}
22
23/* Style for the card heading span */
24.heading span {
25  color: #7eb0ff;
26}
27
28/* Style for the card content */
29.content {
30  display: flex;
31  flex-direction: column;
32  gap: 16px;
33}
34
35/* Style for the card items */
36.item {
37  align-items: center;
38  background-color: #ffffff;
39  border-radius: 8px;
40  display: flex;
41  justify-content: center;
42  padding: 16px;
43}
44
45/* Style for the create item */
46.item--create {
47  background-color: #7eb0ff;
48  color: #ffffff;
49}
50
51/* Style for the create item svg */
52.item--create svg {
53  fill: #ffffff;
54}
55
56/* Style for the post item */
57.item--post {
58  background-color: #ffffff;
59  color: #444444;
60}
61
62/* Style for the post item svg */
63.item--post svg {
64  fill: #444444;
65}
66
67.item--inspire {
68  background-color: #ffffff;
69  color: #444444;
70}
71
72/* Style for the post item svg */
73.item--inspire svg {
74  fill: #444444;
75}
76
77/* Style for the item span */
78.item span {
79  font-family: "Open Sans", sans-serif;
80  font-size: 18px;
81  font-weight: bold;
82  margin-left: 16px;
83}
84
85button {
86  display: block;
87  margin: 0 auto;
88  position: relative;
89  top: 0.5em;
90  padding: 10px 20px;
91  font-size: 18px;
92  color: #fff;
93  background-color: #7eb0ff;
94  border: none;
95  border-radius: 30px;
96  box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.5);
97  transition: all 0.3s ease-in-out;
98}
99
100button:hover {
101  transform: scale(1.1);
102  background-color: #5f9cff;
103}
104
105