1.card {
2 width: 190px;
3 height: 254px;
4 background: rgb(45, 45, 45);
5 box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.2);
6 transition-duration: 0.5s;
7}
8
9.title {
10 text-align: center;
11 margin-top: 0.5em;
12 font-weight: bold;
13 font-size: x-large;
14 color: rgb(200,200,200);
15}
16
17.pricecontainer {
18 width: 100%;
19 margin-top: 0.7em;
20 background-color: rgb(30,30,30);
21 box-shadow: inset 0px 0px 2em rgba(0, 0, 0, 0.3);
22}
23
24.price {
25 text-align: center;
26 color: rgb(180,180,180);
27 font-size: x-large;
28 font-weight: bold;
29 padding: 0.75em 0 0 0;
30}
31
32.pricedescriptor {
33 text-align: center;
34 color: rgb(118, 118, 118);
35 font-size: medium;
36 padding: 0 0 1em 0;
37}
38
39.includes {
40 text-align: center;
41 color: rgb(110, 110, 110);
42 margin-top: 0.6em;
43 font-size: small;
44 font-weight: bold;
45}
46
47.benefitlist li {
48 color: rgb(150,150,150);
49 font-size: small;
50 text-align: center;
51}
52
53.benefitlist li:nth-child(1) {
54 margin-top: 0.4em;
55}
56
57.btncontainer {
58 text-align: center;
59}
60
61.btncontainer button {
62 margin-top: 1em;
63 padding: 0.5em 0.8em 0.5em 0.8em;
64 border-style: none;
65 border-radius: 1000000px;
66 color: rgb(239, 239, 239);
67 font-weight: bold;
68 background-image: linear-gradient(45deg, #fe4fe1 0%, #3f00fe 100%);
69 transition: box-shadow 0.15s ease-in-out;
70}
71
72.btncontainer button:hover {
73 box-shadow: inset 0px 0px 5px rgb(0,0,0);
74 transition: box-shadow 0.15s ease-in-out;
75}