Card by javierBarroso

1.card {
2  width: 190px;
3  height: 254px;
4  margin: 0 auto;
5  background-color: #f4f4f3;
6  border-radius: 8px;
7  z-index: 1;
8  position: relative;
9  display: flex;
10  flex-direction: column;
11}
12
13.card::after {
14  position: absolute;
15  content: '';
16  background-color: #454a50;
17  width: 50px;
18  height: 100px;
19  z-index: -1;
20  border-radius: 8px;
21}
22
23.tools {
24  display: flex;
25  align-items: center;
26  padding: 9px;
27  border-radius: 8px;
28  background: #454a50;
29  margin-top: -2px;
30}
31
32.circle {
33  padding: 0 4px;
34}
35
36.card__content {
37  height: 100%;
38  margin: 0px;
39  border-radius: 8px;
40  background: #f4f4f3;
41  padding: 10px;
42}
43
44.title {
45  font-size: 20px;
46}
47
48.content {
49  margin-top: 10px;
50  font-size: 14px;
51}
52
53.box {
54  display: inline-block;
55  align-items: center;
56  width: 10px;
57  height: 10px;
58  padding: 1px;
59  border-radius: 50%;
60}
61
62.red {
63  background-color: #ff605c;
64}
65
66.yellow {
67  background-color: #ffbd44;
68}
69
70.green {
71  background-color: #00ca4e;
72}
73