Card by waleedlh10

1.card {
2  width: 280px;
3  background: white;
4  border-radius: 10px;
5  box-shadow: 0px 0px 14px -2px #bebebe;
6  transition: 0.2s ease-in-out;
7}
8
9.card:hover {
10  cursor: pointer;
11}
12
13.img {
14  width: 100%;
15  height: 7em;
16  border-top-left-radius: 10px;
17  border-top-right-radius: 10px;
18  background: linear-gradient(#7980c5, #9198e5);
19  display: flex;
20  align-items: top;
21  justify-content: right;
22}
23
24.save {
25  transition: 0.2s ease-in-out;
26  border-radius: 10px;
27  margin: 20px;
28  width: 30px;
29  height: 30px;
30  background-color: #ffffff;
31  display: flex;
32  align-items: center;
33  justify-content: center;
34}
35
36.save .svg {
37  transition: 0.2s ease-in-out;
38  width: 15px;
39  height: 15px;
40}
41
42.save:hover .svg {
43  fill: #ced8de;
44}
45
46.text {
47  padding: 7px 20px;
48  display: flex;
49  flex-direction: column;
50  align-items: space-around;
51}
52
53.text .h3 {
54  font-family: system-ui;
55  font-size: medium;
56  font-weight: 600;
57  color: black;
58  text-align: center;
59}
60
61.text .p {
62  font-family: system-ui;
63  color: #999999;
64  font-size: 13px;
65  margin: 0px;
66  text-align: center;
67  padding: 5px;
68}
69
70.icon-box {
71  margin: 10px;
72  padding: 12px;
73  background-color: #7980c5;
74  border-radius: 10px;
75  text-align: center;
76}
77
78.icon-box .span {
79  font-family: system-ui;
80  font-size: small;
81  font-weight: 500;
82  color: #fff;
83}/*# sourceMappingURL=index.css.map */