ReactJS

1
.s28 {
2
    font-size: 28px;
3
    line-height: 33px;
4
}
5
.s20 {
6
    font-size: 20px;
7
    line-height: 23px;
8
}
9
.s16 {
10
    font-size: 16px;
11
    line-height: 19px;
12
}
13
.s14 {
14
    font-size: 14px;
15
    line-height: 16px;
16
}
17
.s12 {
18
    font-size: 12px;
19
    line-height: 14px;
20
}
21
.s10 {
22
    font-size: 10px;
23
    line-height: 12px;
24
}
25

26
.black {
27
    color: var(--black);
28
}
29
.orange {
30
    color: var(--orange);
31
}
32
.green {
33
    color: var(--green);
34
}
35
.white {
36
    color: var(--white);
37
}
38
.grayF4 {
39
    color: var(--grayF4);
40
}
41
.greyF3 {
42
    color: var(--greyF3);
43
}
44
.greyD9 {
45
    color: var(--greyD9);
46
}
47
.greyC4 {
48
    color: var(--greyC4);
49
}
50
.grey99 {
51
    color: var(--grey99);
52
}
53
.grey66 {
54
    color: var(--grey66);
55
}
56

57
.upperCase {
58
    text-transform: uppercase;
59
}
60

61
@media all and (min-width: 320px) and (max-width: 1023px) {
62
    .m28 {
63
        font-size: 28px;
64
        line-height: 33px;
65
    }
66
    .m20 {
67
        font-size: 20px;
68
        line-height: 23px;
69
    }
70
    .m16 {
71
        font-size: 16px;
72
        line-height: 19px;
73
    }
74
    .m14 {
75
        font-size: 14px;
76
        line-height: 16px;
77
    }
78
    .m12 {
79
        font-size: 12px;
80
        line-height: 14px;
81
    }
82
    .m10 {
83
        font-size: 10px;
84
        line-height: 12px;
85
    }
86
}
87

88
.bold {
89
    font-weight: 500;
90
}
91

92
@media all and (min-width: 1024px) and (max-width: 1539px) {
93
    .t28 {
94
        font-size: 28px;
95
        line-height: 33px;
96
    }
97
    .t20 {
98
        font-size: 20px;
99
        line-height: 23px;
100
    }
101
    .t16 {
102
        font-size: 16px;
103
        line-height: 19px;
104
    }
105
    .t14 {
106
        font-size: 14px;
107
        line-height: 16px;
108
    }
109
    .t12 {
110
        font-size: 12px;
111
        line-height: 14px;
112
    }
113
    .t10 {
114
        font-size: 10px;
115
        line-height: 12px;
116
    }
117
}
118

119
@media all and (min-width: 1540px) {
120
    .d28 {
121
        font-size: 28px;
122
        line-height: 33px;
123
    }
124
    .d20 {
125
        font-size: 20px;
126
        line-height: 23px;
127
    }
128
    .d16 {
129
        font-size: 16px;
130
        line-height: 19px;
131
    }
132
    .d14 {
133
        font-size: 14px;
134
        line-height: 16px;
135
    }
136
    .d12 {
137
        font-size: 12px;
138
        line-height: 14px;
139
    }
140
    .d10 {
141
        font-size: 10px;
142
        line-height: 12px;
143
    }
144
}
145