@@ -4,8 +4,8 @@
44
55body {
66 font-family: 'Inter UI', -apple-system, BlinkMacSystemFont, Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
7− font-size: 3.5rem;
8− line-height: 6rem;
7+ font-size: (3.5rem / 4);
8+ line-height: (6rem / 4);
99 color: #000000;
1010}
1111
@@ -14,7 +14,7 @@ a {
1414}
1515
1616p img {
17− margin: 4rem 0;
17+ margin: (4rem / 4) 0;
1818 width: 100%;
1919}
2020
@@ -27,34 +27,34 @@ iframe {
2727 */
2828
2929.main-wrapper {
30− margin-top: 24rem;
30+ margin-top: (24rem / 4);
3131}
3232
3333.wrapper {
3434 position: relative;
3535 margin: 0 auto;
36− padding: 0 2rem;
36+ padding: 0 (4rem / 4);
3737 max-width: 960px;
3838}
3939
4040.container {
4141 display: flex;
42− padding-bottom: 32rem;
42+ padding-bottom: (32rem / 4);
4343}
4444
4545.container--fixed {
4646 position: fixed;
47− margin-top: -24rem;
47+ margin-top: -(24rem / 4);
4848}
4949
5050.content-nav {
5151 width: 20%;
5252 min-width: 200px;
53− padding-right: 1rem;
54− margin-top: 24rem;
53+ padding-right: (1rem / 4);
54+ margin-top: (24rem / 4);
5555 &__item {
56− line-height: 8rem;
57− margin-bottom: 1rem;
56+ line-height: (8rem / 4);
57+ margin-bottom: (1rem / 4);
5858 }
5959 li {
6060 font-size: inherit;
@@ -64,8 +64,8 @@ iframe {
6464
6565.content-nav-icon {
6666 position: fixed;
67− left: 2rem;
68− top: 24rem;
67+ left: (2rem / 4);
68+ top: (24rem / 4);
6969 width: 10px;
7070 height: 10px;
7171 cursor: pointer;
@@ -85,7 +85,7 @@ iframe {
8585 .content-nav {
8686 overflow-y: scroll;
8787 .list:first-child {
88− padding-bottom: 14rem;
88+ padding-bottom: (14rem / 4);
8989 }
9090 .list li:last-child .subsub-list li:last-child {
9191 padding-bottom: 0;
@@ -96,10 +96,10 @@ iframe {
9696.content-nav-spacer {
9797 width: 20%;
9898 min-width: 200px;
99− padding-right: 5rem;
99+ padding-right: (5rem / 4);
100100 &__item {
101− line-height: 8rem;
102− margin-bottom: 1rem;
101+ line-height: (8rem / 4);
102+ margin-bottom: (1rem / 4);
103103 }
104104}
105105
@@ -111,7 +111,7 @@ iframe {
111111.content {
112112 position: relative;
113113 z-index: 3;
114− margin-top: -16rem;
114+ margin-top: -(16rem / 4);
115115}
116116
117117.content-nav-icon {
@@ -130,12 +130,12 @@ iframe {
130130}
131131
132132.sub-list {
133− padding-left: 4rem;
133+ padding-left: (4rem / 4);
134134 .sub-list {
135135 padding-left: 0;
136136 }
137137 .subsub-list {
138− padding-left: 4rem;
138+ padding-left: (4rem / 4);
139139 }
140140}
141141
@@ -150,12 +150,12 @@ iframe {
150150 display: flex;
151151 justify-content: flex-start;
152152 .list__item {
153− margin-right: 4rem;
153+ margin-right: (4rem / 4);
154154 }
155155}
156156
157157.body-regular {
158− margin-bottom: 7rem;
158+ margin-bottom: (7rem / 4);
159159}
160160
161161.video-wrapper {
@@ -179,7 +179,7 @@ iframe {
179179
180180.header {
181181 position: fixed;
182− height: 24rem;
182+ height: (24rem / 4);
183183 width: 100%;
184184 z-index: 2;
185185 top: 0;
@@ -192,24 +192,24 @@ iframe {
192192 supported by Chrome and Opera */
193193 &__navigation {
194194 display: none;
195− padding-top: 9rem;
195+ padding-top: (9rem / 4);
196196 }
197197 &__nav-icon {
198198 position: absolute;
199− margin-left: 2rem;
200− width: 6rem;
201− height: 10rem;
199+ margin-left: (4rem / 4);
200+ width: (6rem / 4);
201+ height: (10rem / 4);
202202 left: 0;
203− top: 6rem;
203+ top: (6rem / 4);
204204 z-index: 3;
205205 cursor: pointer;
206206 &:before, &:after {
207207 content: '';
208208 position: absolute;
209209 width: 100%;
210− height: 1rem;
210+ height: (1rem / 4);
211211 background: #000;
212− margin-bottom: 4rem;
212+ margin-bottom: (4rem / 4);
213213 top: 50%;
214214 left: 0;
215215 transform-origin: 50%;
@@ -256,7 +256,7 @@ iframe {
256256.posts {
257257 &__content {
258258 z-index: 3;
259− margin-left: -8rem;
259+ margin-left: -(8rem / 4);
260260 }
261261}
262262
@@ -284,10 +284,10 @@ textarea, input[type="text"], input[type="email"], input[type="number"] {
284284button, .btn {
285285 font-family: 'Inter UI', -apple-system, BlinkMacSystemFont, Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
286286 font-weight: 500;
287− font-size: 4rem;
288− line-height: 4rem;
287+ font-size: (4rem / 4);
288+ line-height: (4rem / 4);
289289 user-select: none;
290− padding: 3rem 6rem;
290+ padding: (3rem /4) (6rem / 4);
291291 margin: 0 0 6px;
292292 border: none;
293293 cursor: pointer;
@@ -348,59 +348,59 @@ h1, h2, h3, h4 {
348348 font-weight: 700;
349349}
350350h1 {
351− font-size: 8rem;
352− line-height: 8rem;
351+ font-size: (8rem / 4);
352+ line-height: (8rem / 4);
353353}
354354h2 {
355− font-size: 6rem;
356− line-height: 6rem;
355+ font-size: (6rem / 4);
356+ line-height: (6rem / 4);
357357}
358358h3 {
359− font-size: 5rem;
360− line-height: 5rem;
359+ font-size: (5rem / 4);
360+ line-height: (5rem / 4);
361361}
362362h4 {
363− font-size: 4.5rem;
364− line-height: 4.5rem;
363+ font-size: (4.5rem / 4);
364+ line-height: (4.5rem / 4);
365365}
366366h5 {
367− font-size: 4rem;
368− line-height: 4rem;
367+ font-size: (4rem / 4);
368+ line-height: (4rem / 4);
369369}
370370
371371.article {
372372 h1 {
373− margin-bottom: 7rem;
373+ margin-bottom: (7rem / 4);
374374 }
375375 h2 {
376− margin-top: 8rem;
377− margin-bottom: 4rem;
376+ margin-top: (8rem / 4);
377+ margin-bottom: (4rem / 4);
378378 }
379379 h3 {
380− margin-top: 7rem;
381− margin-bottom: 3rem;
380+ margin-top: (7rem / 4);
381+ margin-bottom: (3rem / 4);
382382 }
383383 h4 {
384− margin-top: 6.5rem;
385− margin-bottom: 2.5rem;
384+ margin-top: (6.5rem / 4);
385+ margin-bottom: (2.5rem / 4);
386386 }
387387 h5 {
388− margin-top: 6rem;
389− margin-bottom: 2rem;
388+ margin-top: (6rem / 4);
389+ margin-bottom: (2rem / 4);
390390 }
391391}
392392
393393li {
394− font-size: 4rem;
395− line-height: 8rem;
394+ font-size: (4rem / 4);
395+ line-height: (8rem / 4);
396396 font-weight: 400;
397397}
398398
399399p, .p {
400− font-size: 4rem;
400+ font-size: (4rem / 4);
401401 font-weight: 400;
402− line-height: 8rem;
403− margin: 0 0 4rem;
402+ line-height: (8rem / 4);
403+ margin: 0 0 (4rem / 4);
404404}
405405
406406pre, code {
@@ -412,15 +412,15 @@ pre, code {
412412 span {
413413 color: #000 !important;
414414 }
415− padding: 1rem;
416− font-size: 4rem;
415+ padding: (1rem / 4);
416+ font-size: (4rem / 4);
417417}
418418
419419textarea, input[type="text"], input[type="email"], input[type="number"] {
420420 border: 1px solid #B1B2B3;
421421 font-family: "Source Code Pro", mono;
422− font-size: 4rem;
423− line-height: 6rem;
422+ font-size: (4rem / 4);
423+ line-height: (6rem / 4);
424424 transition: all 0.1s linear;
425425 padding-right: 40px;
426426 position: relative;