1.card {
2  background-color: #e4e4e4;
3  border-radius: 15px;
4  box-shadow: 10px 10px 20px #c4c4c4,
5              -10px -10px 20px #ffffff;
6  display: flex;
7  flex-direction: row;
8  justify-content: space-around;
9  padding: 4px;
10}
11
12.button {
13  background-color: #e4e4e4;
14  border: none;
15  border-radius: 10px;
16  box-shadow: inset 5px 5px 5px #c4c4c4,
17              inset -5px -5px 5px #ffffff;
18  color: #333;
19  cursor: pointer;
20  display: flex;
21  flex-direction: row;
22  justify-content: center;
23  align-items: center;
24  font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
25  font-size: 13px;
26  font-weight: bold;
27  margin: 3px;
28  padding: 10px;
29  text-transform: uppercase;
30}
31
32.button:hover {
33  box-shadow: none;
34}
35
36.svg {
37  width: 20px;
38  height: 20px;
39  margin-right: 5px;
40}
41
42.card .Explore {
43  color: #3035cb;
44}
45
46.card .Explore:hover {
47  background-color: #3035cb;
48  color: #e4e4e4;
49}
50
51.card .Explore svg {
52  fill: #3035cb;
53}
54
55.card .Explore:hover svg {
56  fill: #e4e4e4;
57}
58
59.card .Post {
60  color: #333;
61}
62
63.card .Post:hover {
64  background-color: #333;
65  color: #e4e4e4;
66}
67
68.card .Post svg {
69  fill: #333;
70}
71
72.card .Post:hover svg {
73  fill: #e4e4e4;
74}
75
76.card .Chat {
77  color: #b82323;
78}
79
80.card .Chat:hover {
81  background-color: #b82323;
82  color: #e4e4e4;
83}
84
85.card .Chat svg {
86  fill: #b82323;
87}
88
89.card .Chat:hover svg {
90  fill: #e4e4e4;
91}
92