@transferwise/neptune-css 0.0.0-experimental-7cfec48 → 0.0.0-experimental-1ed1574

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (59) hide show
  1. package/dist/css/accordion.css +21 -6
  2. package/dist/css/alerts.css +159 -14
  3. package/dist/css/background.css +6 -2
  4. package/dist/css/badge.css +11 -1
  5. package/dist/css/breadcrumbs.css +2 -1
  6. package/dist/css/button-groups.css +8 -2
  7. package/dist/css/buttons.css +212 -142
  8. package/dist/css/chevron.css +1 -1
  9. package/dist/css/circles.css +22 -10
  10. package/dist/css/close.css +3 -2
  11. package/dist/css/column-layout.css +4 -0
  12. package/dist/css/currency-flags.css +5 -1
  13. package/dist/css/decision.css +14 -5
  14. package/dist/css/dropdowns.css +28 -8
  15. package/dist/css/droppable.css +18 -11
  16. package/dist/css/flex.css +32 -0
  17. package/dist/css/footer.css +46 -8
  18. package/dist/css/grid.css +6 -0
  19. package/dist/css/input-groups.css +188 -142
  20. package/dist/css/link-callout.css +2 -0
  21. package/dist/css/list-group.css +39 -8
  22. package/dist/css/media.css +6 -0
  23. package/dist/css/modals.css +13 -3
  24. package/dist/css/navbar-base.css +107 -19
  25. package/dist/css/navbar.css +175 -37
  26. package/dist/css/navs.css +33 -8
  27. package/dist/css/neptune-addons.css +466 -4
  28. package/dist/css/neptune-core.css +196 -32
  29. package/dist/css/neptune.css +2204 -655
  30. package/dist/css/panels.css +3 -0
  31. package/dist/css/popovers.css +30 -6
  32. package/dist/css/process.css +8 -8
  33. package/dist/css/progress-bars.css +11 -2
  34. package/dist/css/ring.css +2 -2
  35. package/dist/css/select.css +12 -2
  36. package/dist/css/sequences.css +173 -25
  37. package/dist/css/table.css +65 -18
  38. package/dist/css/tick.css +2 -0
  39. package/dist/css/tooltip.css +7 -1
  40. package/dist/css/wells.css +25 -5
  41. package/dist/less/neptune-tokens.less +264 -153
  42. package/dist/props/neptune-tokens.css +132 -145
  43. package/package.json +2 -2
  44. package/src/less/addons/_background-utilities.less +33 -33
  45. package/src/less/alerts.less +28 -28
  46. package/src/less/background.less +3 -0
  47. package/src/less/buttons.less +19 -19
  48. package/src/less/column-layout.less +1 -1
  49. package/src/less/core/_scaffolding.less +13 -13
  50. package/src/less/core/_typography-utilities.less +18 -18
  51. package/src/less/dropdowns.less +7 -7
  52. package/src/less/footer.less +26 -26
  53. package/src/less/modals.less +1 -1
  54. package/src/less/navbar-base.less +25 -25
  55. package/src/less/navbar.less +3 -3
  56. package/src/less/navs.less +9 -9
  57. package/src/less/sequences.less +13 -13
  58. package/src/less/table.less +31 -31
  59. package/src/variables/neptune-tokens.less +8 -8
package/dist/css/neptune-addons.css CHANGED
@@ -1,23 +1,31 @@
1
1
  .bg-default,
2
2
  .bg-neutral {
3
- background-color: rgba(22,51,0,0.07843) !important;
3
+ background-color: rgba(134,167,189,0.10196) !important;
4
4
  background-color: var(--color-background-neutral) !important;
5
- color: #454745;
5
+ color: #5d7079;
6
6
  color: var(--color-content-secondary);
7
7
  }
8
8
  .bg-accent,
9
9
  .bg-info {
10
+ background-color: rgba(56,200,255,0.10196) !important;
10
11
  background-color: var(--color-background-accent) !important;
11
12
  }
13
+ .bg-primary {
14
+ background-color: #37517e !important;
15
+ color: #ffffff;
16
+ }
12
17
  .bg-positive,
13
18
  .bg-success {
19
+ background-color: rgba(54,199,151,0.10196) !important;
14
20
  background-color: var(--color-background-positive) !important;
15
21
  }
16
22
  .bg-negative,
17
23
  .bg-danger {
24
+ background-color: rgba(255,135,135,0.10196) !important;
18
25
  background-color: var(--color-background-negative) !important;
19
26
  }
20
27
  .bg-warning {
28
+ background-color: rgba(255,172,0,0.10196) !important;
21
29
  background-color: var(--color-background-warning) !important;
22
30
  }
23
31
  .bg-elevated {
@@ -29,9 +37,80 @@
29
37
  background-color: var(--color-background-screen) !important;
30
38
  }
31
39
  .bg-overlay {
32
- background-color: rgba(22,51,0,0.07843) !important;
40
+ background-color: rgba(0,0,0,0.10196) !important;
33
41
  background-color: var(--color-background-overlay) !important;
34
42
  }
43
+ .bg-primary h1,
44
+ .bg-info h1,
45
+ .bg-accent h1,
46
+ .bg-primary h2,
47
+ .bg-info h2,
48
+ .bg-accent h2,
49
+ .bg-primary h3,
50
+ .bg-info h3,
51
+ .bg-accent h3,
52
+ .bg-primary h4,
53
+ .bg-info h4,
54
+ .bg-accent h4,
55
+ .bg-primary h5,
56
+ .bg-info h5,
57
+ .bg-accent h5,
58
+ .bg-primary h6,
59
+ .bg-info h6,
60
+ .bg-accent h6,
61
+ .bg-primary .h1,
62
+ .bg-info .h1,
63
+ .bg-accent .h1,
64
+ .bg-primary .h2,
65
+ .bg-info .h2,
66
+ .bg-accent .h2,
67
+ .bg-primary .h3,
68
+ .bg-info .h3,
69
+ .bg-accent .h3,
70
+ .bg-primary .h4,
71
+ .bg-info .h4,
72
+ .bg-accent .h4,
73
+ .bg-primary .h5,
74
+ .bg-info .h5,
75
+ .bg-accent .h5,
76
+ .bg-primary .h6,
77
+ .bg-info .h6,
78
+ .bg-accent .h6,
79
+ .bg-primary .title-1,
80
+ .bg-info .title-1,
81
+ .bg-accent .title-1,
82
+ .bg-primary .title-2,
83
+ .bg-info .title-2,
84
+ .bg-accent .title-2,
85
+ .bg-primary .title-3,
86
+ .bg-info .title-3,
87
+ .bg-accent .title-3,
88
+ .bg-primary .title-4,
89
+ .bg-info .title-4,
90
+ .bg-accent .title-4,
91
+ .bg-primary .title-5,
92
+ .bg-info .title-5,
93
+ .bg-accent .title-5,
94
+ .bg-primary .np-text-title-screen,
95
+ .bg-info .np-text-title-screen,
96
+ .bg-accent .np-text-title-screen,
97
+ .bg-primary .np-text-title-section,
98
+ .bg-info .np-text-title-section,
99
+ .bg-accent .np-text-title-section,
100
+ .bg-primary .np-text-title-subsection,
101
+ .bg-info .np-text-title-subsection,
102
+ .bg-accent .np-text-title-subsection,
103
+ .bg-primary .np-text-title-body,
104
+ .bg-info .np-text-title-body,
105
+ .bg-accent .np-text-title-body,
106
+ .bg-primary .np-text-title-group,
107
+ .bg-info .np-text-title-group,
108
+ .bg-accent .np-text-title-group,
109
+ .bg-primary strong,
110
+ .bg-info strong,
111
+ .bg-accent strong {
112
+ color: #ffffff;
113
+ }
35
114
  .d-block {
36
115
  display: block !important;
37
116
  }
@@ -269,1049 +348,1426 @@ html:not([dir="rtl"]) .p-x-0 {
269
348
  padding-right: 0 !important;
270
349
  }
271
350
  .m-a-1 {
351
+ margin-top: 8px !important;
272
352
  margin-top: var(--size-8) !important;
353
+ margin-bottom: 8px !important;
273
354
  margin-bottom: var(--size-8) !important;
274
355
  }
275
356
  [dir="rtl"] .m-a-1 {
357
+ margin-left: 8px !important;
276
358
  margin-left: var(--size-8) !important;
277
359
  }
278
360
  html:not([dir="rtl"]) .m-a-1 {
361
+ margin-right: 8px !important;
279
362
  margin-right: var(--size-8) !important;
280
363
  }
281
364
  [dir="rtl"] .m-a-1 {
365
+ margin-right: 8px !important;
282
366
  margin-right: var(--size-8) !important;
283
367
  }
284
368
  html:not([dir="rtl"]) .m-a-1 {
369
+ margin-left: 8px !important;
285
370
  margin-left: var(--size-8) !important;
286
371
  }
287
372
  .p-a-1 {
373
+ padding-top: 8px !important;
288
374
  padding-top: var(--size-8) !important;
375
+ padding-bottom: 8px !important;
289
376
  padding-bottom: var(--size-8) !important;
290
377
  }
291
378
  [dir="rtl"] .p-a-1 {
379
+ padding-left: 8px !important;
292
380
  padding-left: var(--size-8) !important;
293
381
  }
294
382
  html:not([dir="rtl"]) .p-a-1 {
383
+ padding-right: 8px !important;
295
384
  padding-right: var(--size-8) !important;
296
385
  }
297
386
  [dir="rtl"] .p-a-1 {
387
+ padding-right: 8px !important;
298
388
  padding-right: var(--size-8) !important;
299
389
  }
300
390
  html:not([dir="rtl"]) .p-a-1 {
391
+ padding-left: 8px !important;
301
392
  padding-left: var(--size-8) !important;
302
393
  }
303
394
  .m-t-1 {
395
+ margin-top: 8px !important;
304
396
  margin-top: var(--size-8) !important;
305
397
  }
306
398
  .m-b-1 {
399
+ margin-bottom: 8px !important;
307
400
  margin-bottom: var(--size-8) !important;
308
401
  }
309
402
  .m-y-1 {
403
+ margin-top: 8px !important;
310
404
  margin-top: var(--size-8) !important;
405
+ margin-bottom: 8px !important;
311
406
  margin-bottom: var(--size-8) !important;
312
407
  }
313
408
  .p-t-1 {
409
+ padding-top: 8px !important;
314
410
  padding-top: var(--size-8) !important;
315
411
  }
316
412
  .p-b-1 {
413
+ padding-bottom: 8px !important;
317
414
  padding-bottom: var(--size-8) !important;
318
415
  }
319
416
  .p-y-1 {
417
+ padding-top: 8px !important;
320
418
  padding-top: var(--size-8) !important;
419
+ padding-bottom: 8px !important;
321
420
  padding-bottom: var(--size-8) !important;
322
421
  }
323
422
  [dir="rtl"] .m-l-1 {
423
+ margin-right: 8px !important;
324
424
  margin-right: var(--size-8) !important;
325
425
  }
326
426
  html:not([dir="rtl"]) .m-l-1 {
427
+ margin-left: 8px !important;
327
428
  margin-left: var(--size-8) !important;
328
429
  }
329
430
  [dir="rtl"] .m-r-1 {
431
+ margin-left: 8px !important;
330
432
  margin-left: var(--size-8) !important;
331
433
  }
332
434
  html:not([dir="rtl"]) .m-r-1 {
435
+ margin-right: 8px !important;
333
436
  margin-right: var(--size-8) !important;
334
437
  }
335
438
  [dir="rtl"] .m-x-1 {
439
+ margin-right: 8px !important;
336
440
  margin-right: var(--size-8) !important;
337
441
  }
338
442
  html:not([dir="rtl"]) .m-x-1 {
443
+ margin-left: 8px !important;
339
444
  margin-left: var(--size-8) !important;
340
445
  }
341
446
  [dir="rtl"] .m-x-1 {
447
+ margin-left: 8px !important;
342
448
  margin-left: var(--size-8) !important;
343
449
  }
344
450
  html:not([dir="rtl"]) .m-x-1 {
451
+ margin-right: 8px !important;
345
452
  margin-right: var(--size-8) !important;
346
453
  }
347
454
  [dir="rtl"] .p-l-1 {
455
+ padding-right: 8px !important;
348
456
  padding-right: var(--size-8) !important;
349
457
  }
350
458
  html:not([dir="rtl"]) .p-l-1 {
459
+ padding-left: 8px !important;
351
460
  padding-left: var(--size-8) !important;
352
461
  }
353
462
  [dir="rtl"] .p-r-1 {
463
+ padding-left: 8px !important;
354
464
  padding-left: var(--size-8) !important;
355
465
  }
356
466
  html:not([dir="rtl"]) .p-r-1 {
467
+ padding-right: 8px !important;
357
468
  padding-right: var(--size-8) !important;
358
469
  }
359
470
  [dir="rtl"] .p-x-1 {
471
+ padding-right: 8px !important;
360
472
  padding-right: var(--size-8) !important;
361
473
  }
362
474
  html:not([dir="rtl"]) .p-x-1 {
475
+ padding-left: 8px !important;
363
476
  padding-left: var(--size-8) !important;
364
477
  }
365
478
  [dir="rtl"] .p-x-1 {
479
+ padding-left: 8px !important;
366
480
  padding-left: var(--size-8) !important;
367
481
  }
368
482
  html:not([dir="rtl"]) .p-x-1 {
483
+ padding-right: 8px !important;
369
484
  padding-right: var(--size-8) !important;
370
485
  }
371
486
  .m-a-2 {
487
+ margin-top: 16px !important;
372
488
  margin-top: var(--size-16) !important;
489
+ margin-bottom: 16px !important;
373
490
  margin-bottom: var(--size-16) !important;
374
491
  }
375
492
  [dir="rtl"] .m-a-2 {
493
+ margin-left: 16px !important;
376
494
  margin-left: var(--size-16) !important;
377
495
  }
378
496
  html:not([dir="rtl"]) .m-a-2 {
497
+ margin-right: 16px !important;
379
498
  margin-right: var(--size-16) !important;
380
499
  }
381
500
  [dir="rtl"] .m-a-2 {
501
+ margin-right: 16px !important;
382
502
  margin-right: var(--size-16) !important;
383
503
  }
384
504
  html:not([dir="rtl"]) .m-a-2 {
505
+ margin-left: 16px !important;
385
506
  margin-left: var(--size-16) !important;
386
507
  }
387
508
  .p-a-2 {
509
+ padding-top: 16px !important;
388
510
  padding-top: var(--size-16) !important;
511
+ padding-bottom: 16px !important;
389
512
  padding-bottom: var(--size-16) !important;
390
513
  }
391
514
  [dir="rtl"] .p-a-2 {
515
+ padding-left: 16px !important;
392
516
  padding-left: var(--size-16) !important;
393
517
  }
394
518
  html:not([dir="rtl"]) .p-a-2 {
519
+ padding-right: 16px !important;
395
520
  padding-right: var(--size-16) !important;
396
521
  }
397
522
  [dir="rtl"] .p-a-2 {
523
+ padding-right: 16px !important;
398
524
  padding-right: var(--size-16) !important;
399
525
  }
400
526
  html:not([dir="rtl"]) .p-a-2 {
527
+ padding-left: 16px !important;
401
528
  padding-left: var(--size-16) !important;
402
529
  }
403
530
  .m-t-2 {
531
+ margin-top: 16px !important;
404
532
  margin-top: var(--size-16) !important;
405
533
  }
406
534
  .m-b-2 {
535
+ margin-bottom: 16px !important;
407
536
  margin-bottom: var(--size-16) !important;
408
537
  }
409
538
  .m-y-2 {
539
+ margin-top: 16px !important;
410
540
  margin-top: var(--size-16) !important;
541
+ margin-bottom: 16px !important;
411
542
  margin-bottom: var(--size-16) !important;
412
543
  }
413
544
  .p-t-2 {
545
+ padding-top: 16px !important;
414
546
  padding-top: var(--size-16) !important;
415
547
  }
416
548
  .p-b-2 {
549
+ padding-bottom: 16px !important;
417
550
  padding-bottom: var(--size-16) !important;
418
551
  }
419
552
  .p-y-2 {
553
+ padding-top: 16px !important;
420
554
  padding-top: var(--size-16) !important;
555
+ padding-bottom: 16px !important;
421
556
  padding-bottom: var(--size-16) !important;
422
557
  }
423
558
  [dir="rtl"] .m-l-2 {
559
+ margin-right: 16px !important;
424
560
  margin-right: var(--size-16) !important;
425
561
  }
426
562
  html:not([dir="rtl"]) .m-l-2 {
563
+ margin-left: 16px !important;
427
564
  margin-left: var(--size-16) !important;
428
565
  }
429
566
  [dir="rtl"] .m-r-2 {
567
+ margin-left: 16px !important;
430
568
  margin-left: var(--size-16) !important;
431
569
  }
432
570
  html:not([dir="rtl"]) .m-r-2 {
571
+ margin-right: 16px !important;
433
572
  margin-right: var(--size-16) !important;
434
573
  }
435
574
  [dir="rtl"] .m-x-2 {
575
+ margin-right: 16px !important;
436
576
  margin-right: var(--size-16) !important;
437
577
  }
438
578
  html:not([dir="rtl"]) .m-x-2 {
579
+ margin-left: 16px !important;
439
580
  margin-left: var(--size-16) !important;
440
581
  }
441
582
  [dir="rtl"] .m-x-2 {
583
+ margin-left: 16px !important;
442
584
  margin-left: var(--size-16) !important;
443
585
  }
444
586
  html:not([dir="rtl"]) .m-x-2 {
587
+ margin-right: 16px !important;
445
588
  margin-right: var(--size-16) !important;
446
589
  }
447
590
  [dir="rtl"] .p-l-2 {
591
+ padding-right: 16px !important;
448
592
  padding-right: var(--size-16) !important;
449
593
  }
450
594
  html:not([dir="rtl"]) .p-l-2 {
595
+ padding-left: 16px !important;
451
596
  padding-left: var(--size-16) !important;
452
597
  }
453
598
  [dir="rtl"] .p-r-2 {
599
+ padding-left: 16px !important;
454
600
  padding-left: var(--size-16) !important;
455
601
  }
456
602
  html:not([dir="rtl"]) .p-r-2 {
603
+ padding-right: 16px !important;
457
604
  padding-right: var(--size-16) !important;
458
605
  }
459
606
  [dir="rtl"] .p-x-2 {
607
+ padding-right: 16px !important;
460
608
  padding-right: var(--size-16) !important;
461
609
  }
462
610
  html:not([dir="rtl"]) .p-x-2 {
611
+ padding-left: 16px !important;
463
612
  padding-left: var(--size-16) !important;
464
613
  }
465
614
  [dir="rtl"] .p-x-2 {
615
+ padding-left: 16px !important;
466
616
  padding-left: var(--size-16) !important;
467
617
  }
468
618
  html:not([dir="rtl"]) .p-x-2 {
619
+ padding-right: 16px !important;
469
620
  padding-right: var(--size-16) !important;
470
621
  }
471
622
  .m-a-3 {
623
+ margin-top: 24px !important;
472
624
  margin-top: var(--size-24) !important;
625
+ margin-bottom: 24px !important;
473
626
  margin-bottom: var(--size-24) !important;
474
627
  }
475
628
  [dir="rtl"] .m-a-3 {
629
+ margin-left: 24px !important;
476
630
  margin-left: var(--size-24) !important;
477
631
  }
478
632
  html:not([dir="rtl"]) .m-a-3 {
633
+ margin-right: 24px !important;
479
634
  margin-right: var(--size-24) !important;
480
635
  }
481
636
  [dir="rtl"] .m-a-3 {
637
+ margin-right: 24px !important;
482
638
  margin-right: var(--size-24) !important;
483
639
  }
484
640
  html:not([dir="rtl"]) .m-a-3 {
641
+ margin-left: 24px !important;
485
642
  margin-left: var(--size-24) !important;
486
643
  }
487
644
  .p-a-3 {
645
+ padding-top: 24px !important;
488
646
  padding-top: var(--size-24) !important;
647
+ padding-bottom: 24px !important;
489
648
  padding-bottom: var(--size-24) !important;
490
649
  }
491
650
  [dir="rtl"] .p-a-3 {
651
+ padding-left: 24px !important;
492
652
  padding-left: var(--size-24) !important;
493
653
  }
494
654
  html:not([dir="rtl"]) .p-a-3 {
655
+ padding-right: 24px !important;
495
656
  padding-right: var(--size-24) !important;
496
657
  }
497
658
  [dir="rtl"] .p-a-3 {
659
+ padding-right: 24px !important;
498
660
  padding-right: var(--size-24) !important;
499
661
  }
500
662
  html:not([dir="rtl"]) .p-a-3 {
663
+ padding-left: 24px !important;
501
664
  padding-left: var(--size-24) !important;
502
665
  }
503
666
  .m-t-3 {
667
+ margin-top: 24px !important;
504
668
  margin-top: var(--size-24) !important;
505
669
  }
506
670
  .m-b-3 {
671
+ margin-bottom: 24px !important;
507
672
  margin-bottom: var(--size-24) !important;
508
673
  }
509
674
  .m-y-3 {
675
+ margin-top: 24px !important;
510
676
  margin-top: var(--size-24) !important;
677
+ margin-bottom: 24px !important;
511
678
  margin-bottom: var(--size-24) !important;
512
679
  }
513
680
  .p-t-3 {
681
+ padding-top: 24px !important;
514
682
  padding-top: var(--size-24) !important;
515
683
  }
516
684
  .p-b-3 {
685
+ padding-bottom: 24px !important;
517
686
  padding-bottom: var(--size-24) !important;
518
687
  }
519
688
  .p-y-3 {
689
+ padding-top: 24px !important;
520
690
  padding-top: var(--size-24) !important;
691
+ padding-bottom: 24px !important;
521
692
  padding-bottom: var(--size-24) !important;
522
693
  }
523
694
  [dir="rtl"] .m-l-3 {
695
+ margin-right: 24px !important;
524
696
  margin-right: var(--size-24) !important;
525
697
  }
526
698
  html:not([dir="rtl"]) .m-l-3 {
699
+ margin-left: 24px !important;
527
700
  margin-left: var(--size-24) !important;
528
701
  }
529
702
  [dir="rtl"] .m-r-3 {
703
+ margin-left: 24px !important;
530
704
  margin-left: var(--size-24) !important;
531
705
  }
532
706
  html:not([dir="rtl"]) .m-r-3 {
707
+ margin-right: 24px !important;
533
708
  margin-right: var(--size-24) !important;
534
709
  }
535
710
  [dir="rtl"] .m-x-3 {
711
+ margin-right: 24px !important;
536
712
  margin-right: var(--size-24) !important;
537
713
  }
538
714
  html:not([dir="rtl"]) .m-x-3 {
715
+ margin-left: 24px !important;
539
716
  margin-left: var(--size-24) !important;
540
717
  }
541
718
  [dir="rtl"] .m-x-3 {
719
+ margin-left: 24px !important;
542
720
  margin-left: var(--size-24) !important;
543
721
  }
544
722
  html:not([dir="rtl"]) .m-x-3 {
723
+ margin-right: 24px !important;
545
724
  margin-right: var(--size-24) !important;
546
725
  }
547
726
  [dir="rtl"] .p-l-3 {
727
+ padding-right: 24px !important;
548
728
  padding-right: var(--size-24) !important;
549
729
  }
550
730
  html:not([dir="rtl"]) .p-l-3 {
731
+ padding-left: 24px !important;
551
732
  padding-left: var(--size-24) !important;
552
733
  }
553
734
  [dir="rtl"] .p-r-3 {
735
+ padding-left: 24px !important;
554
736
  padding-left: var(--size-24) !important;
555
737
  }
556
738
  html:not([dir="rtl"]) .p-r-3 {
739
+ padding-right: 24px !important;
557
740
  padding-right: var(--size-24) !important;
558
741
  }
559
742
  [dir="rtl"] .p-x-3 {
743
+ padding-right: 24px !important;
560
744
  padding-right: var(--size-24) !important;
561
745
  }
562
746
  html:not([dir="rtl"]) .p-x-3 {
747
+ padding-left: 24px !important;
563
748
  padding-left: var(--size-24) !important;
564
749
  }
565
750
  [dir="rtl"] .p-x-3 {
751
+ padding-left: 24px !important;
566
752
  padding-left: var(--size-24) !important;
567
753
  }
568
754
  html:not([dir="rtl"]) .p-x-3 {
755
+ padding-right: 24px !important;
569
756
  padding-right: var(--size-24) !important;
570
757
  }
571
758
  .m-a-4 {
759
+ margin-top: 32px !important;
572
760
  margin-top: var(--size-32) !important;
761
+ margin-bottom: 32px !important;
573
762
  margin-bottom: var(--size-32) !important;
574
763
  }
575
764
  [dir="rtl"] .m-a-4 {
765
+ margin-left: 32px !important;
576
766
  margin-left: var(--size-32) !important;
577
767
  }
578
768
  html:not([dir="rtl"]) .m-a-4 {
769
+ margin-right: 32px !important;
579
770
  margin-right: var(--size-32) !important;
580
771
  }
581
772
  [dir="rtl"] .m-a-4 {
773
+ margin-right: 32px !important;
582
774
  margin-right: var(--size-32) !important;
583
775
  }
584
776
  html:not([dir="rtl"]) .m-a-4 {
777
+ margin-left: 32px !important;
585
778
  margin-left: var(--size-32) !important;
586
779
  }
587
780
  .p-a-4 {
781
+ padding-top: 32px !important;
588
782
  padding-top: var(--size-32) !important;
783
+ padding-bottom: 32px !important;
589
784
  padding-bottom: var(--size-32) !important;
590
785
  }
591
786
  [dir="rtl"] .p-a-4 {
787
+ padding-left: 32px !important;
592
788
  padding-left: var(--size-32) !important;
593
789
  }
594
790
  html:not([dir="rtl"]) .p-a-4 {
791
+ padding-right: 32px !important;
595
792
  padding-right: var(--size-32) !important;
596
793
  }
597
794
  [dir="rtl"] .p-a-4 {
795
+ padding-right: 32px !important;
598
796
  padding-right: var(--size-32) !important;
599
797
  }
600
798
  html:not([dir="rtl"]) .p-a-4 {
799
+ padding-left: 32px !important;
601
800
  padding-left: var(--size-32) !important;
602
801
  }
603
802
  .m-t-4 {
803
+ margin-top: 32px !important;
604
804
  margin-top: var(--size-32) !important;
605
805
  }
606
806
  .m-b-4 {
807
+ margin-bottom: 32px !important;
607
808
  margin-bottom: var(--size-32) !important;
608
809
  }
609
810
  .m-y-4 {
811
+ margin-top: 32px !important;
610
812
  margin-top: var(--size-32) !important;
813
+ margin-bottom: 32px !important;
611
814
  margin-bottom: var(--size-32) !important;
612
815
  }
613
816
  .p-t-4 {
817
+ padding-top: 32px !important;
614
818
  padding-top: var(--size-32) !important;
615
819
  }
616
820
  .p-b-4 {
821
+ padding-bottom: 32px !important;
617
822
  padding-bottom: var(--size-32) !important;
618
823
  }
619
824
  .p-y-4 {
825
+ padding-top: 32px !important;
620
826
  padding-top: var(--size-32) !important;
827
+ padding-bottom: 32px !important;
621
828
  padding-bottom: var(--size-32) !important;
622
829
  }
623
830
  [dir="rtl"] .m-l-4 {
831
+ margin-right: 32px !important;
624
832
  margin-right: var(--size-32) !important;
625
833
  }
626
834
  html:not([dir="rtl"]) .m-l-4 {
835
+ margin-left: 32px !important;
627
836
  margin-left: var(--size-32) !important;
628
837
  }
629
838
  [dir="rtl"] .m-r-4 {
839
+ margin-left: 32px !important;
630
840
  margin-left: var(--size-32) !important;
631
841
  }
632
842
  html:not([dir="rtl"]) .m-r-4 {
843
+ margin-right: 32px !important;
633
844
  margin-right: var(--size-32) !important;
634
845
  }
635
846
  [dir="rtl"] .m-x-4 {
847
+ margin-right: 32px !important;
636
848
  margin-right: var(--size-32) !important;
637
849
  }
638
850
  html:not([dir="rtl"]) .m-x-4 {
851
+ margin-left: 32px !important;
639
852
  margin-left: var(--size-32) !important;
640
853
  }
641
854
  [dir="rtl"] .m-x-4 {
855
+ margin-left: 32px !important;
642
856
  margin-left: var(--size-32) !important;
643
857
  }
644
858
  html:not([dir="rtl"]) .m-x-4 {
859
+ margin-right: 32px !important;
645
860
  margin-right: var(--size-32) !important;
646
861
  }
647
862
  [dir="rtl"] .p-l-4 {
863
+ padding-right: 32px !important;
648
864
  padding-right: var(--size-32) !important;
649
865
  }
650
866
  html:not([dir="rtl"]) .p-l-4 {
867
+ padding-left: 32px !important;
651
868
  padding-left: var(--size-32) !important;
652
869
  }
653
870
  [dir="rtl"] .p-r-4 {
871
+ padding-left: 32px !important;
654
872
  padding-left: var(--size-32) !important;
655
873
  }
656
874
  html:not([dir="rtl"]) .p-r-4 {
875
+ padding-right: 32px !important;
657
876
  padding-right: var(--size-32) !important;
658
877
  }
659
878
  [dir="rtl"] .p-x-4 {
879
+ padding-right: 32px !important;
660
880
  padding-right: var(--size-32) !important;
661
881
  }
662
882
  html:not([dir="rtl"]) .p-x-4 {
883
+ padding-left: 32px !important;
663
884
  padding-left: var(--size-32) !important;
664
885
  }
665
886
  [dir="rtl"] .p-x-4 {
887
+ padding-left: 32px !important;
666
888
  padding-left: var(--size-32) !important;
667
889
  }
668
890
  html:not([dir="rtl"]) .p-x-4 {
891
+ padding-right: 32px !important;
669
892
  padding-right: var(--size-32) !important;
670
893
  }
671
894
  .m-a-5 {
895
+ margin-top: 40px !important;
672
896
  margin-top: var(--size-40) !important;
897
+ margin-bottom: 40px !important;
673
898
  margin-bottom: var(--size-40) !important;
674
899
  }
675
900
  [dir="rtl"] .m-a-5 {
901
+ margin-left: 40px !important;
676
902
  margin-left: var(--size-40) !important;
677
903
  }
678
904
  html:not([dir="rtl"]) .m-a-5 {
905
+ margin-right: 40px !important;
679
906
  margin-right: var(--size-40) !important;
680
907
  }
681
908
  [dir="rtl"] .m-a-5 {
909
+ margin-right: 40px !important;
682
910
  margin-right: var(--size-40) !important;
683
911
  }
684
912
  html:not([dir="rtl"]) .m-a-5 {
913
+ margin-left: 40px !important;
685
914
  margin-left: var(--size-40) !important;
686
915
  }
687
916
  .p-a-5 {
917
+ padding-top: 40px !important;
688
918
  padding-top: var(--size-40) !important;
919
+ padding-bottom: 40px !important;
689
920
  padding-bottom: var(--size-40) !important;
690
921
  }
691
922
  [dir="rtl"] .p-a-5 {
923
+ padding-left: 40px !important;
692
924
  padding-left: var(--size-40) !important;
693
925
  }
694
926
  html:not([dir="rtl"]) .p-a-5 {
927
+ padding-right: 40px !important;
695
928
  padding-right: var(--size-40) !important;
696
929
  }
697
930
  [dir="rtl"] .p-a-5 {
931
+ padding-right: 40px !important;
698
932
  padding-right: var(--size-40) !important;
699
933
  }
700
934
  html:not([dir="rtl"]) .p-a-5 {
935
+ padding-left: 40px !important;
701
936
  padding-left: var(--size-40) !important;
702
937
  }
703
938
  .m-t-5 {
939
+ margin-top: 40px !important;
704
940
  margin-top: var(--size-40) !important;
705
941
  }
706
942
  .m-b-5 {
943
+ margin-bottom: 40px !important;
707
944
  margin-bottom: var(--size-40) !important;
708
945
  }
709
946
  .m-y-5 {
947
+ margin-top: 40px !important;
710
948
  margin-top: var(--size-40) !important;
949
+ margin-bottom: 40px !important;
711
950
  margin-bottom: var(--size-40) !important;
712
951
  }
713
952
  .p-t-5 {
953
+ padding-top: 40px !important;
714
954
  padding-top: var(--size-40) !important;
715
955
  }
716
956
  .p-b-5 {
957
+ padding-bottom: 40px !important;
717
958
  padding-bottom: var(--size-40) !important;
718
959
  }
719
960
  .p-y-5 {
961
+ padding-top: 40px !important;
720
962
  padding-top: var(--size-40) !important;
963
+ padding-bottom: 40px !important;
721
964
  padding-bottom: var(--size-40) !important;
722
965
  }
723
966
  [dir="rtl"] .m-l-5 {
967
+ margin-right: 40px !important;
724
968
  margin-right: var(--size-40) !important;
725
969
  }
726
970
  html:not([dir="rtl"]) .m-l-5 {
971
+ margin-left: 40px !important;
727
972
  margin-left: var(--size-40) !important;
728
973
  }
729
974
  [dir="rtl"] .m-r-5 {
975
+ margin-left: 40px !important;
730
976
  margin-left: var(--size-40) !important;
731
977
  }
732
978
  html:not([dir="rtl"]) .m-r-5 {
979
+ margin-right: 40px !important;
733
980
  margin-right: var(--size-40) !important;
734
981
  }
735
982
  [dir="rtl"] .m-x-5 {
983
+ margin-right: 40px !important;
736
984
  margin-right: var(--size-40) !important;
737
985
  }
738
986
  html:not([dir="rtl"]) .m-x-5 {
987
+ margin-left: 40px !important;
739
988
  margin-left: var(--size-40) !important;
740
989
  }
741
990
  [dir="rtl"] .m-x-5 {
991
+ margin-left: 40px !important;
742
992
  margin-left: var(--size-40) !important;
743
993
  }
744
994
  html:not([dir="rtl"]) .m-x-5 {
995
+ margin-right: 40px !important;
745
996
  margin-right: var(--size-40) !important;
746
997
  }
747
998
  [dir="rtl"] .p-l-5 {
999
+ padding-right: 40px !important;
748
1000
  padding-right: var(--size-40) !important;
749
1001
  }
750
1002
  html:not([dir="rtl"]) .p-l-5 {
1003
+ padding-left: 40px !important;
751
1004
  padding-left: var(--size-40) !important;
752
1005
  }
753
1006
  [dir="rtl"] .p-r-5 {
1007
+ padding-left: 40px !important;
754
1008
  padding-left: var(--size-40) !important;
755
1009
  }
756
1010
  html:not([dir="rtl"]) .p-r-5 {
1011
+ padding-right: 40px !important;
757
1012
  padding-right: var(--size-40) !important;
758
1013
  }
759
1014
  [dir="rtl"] .p-x-5 {
1015
+ padding-right: 40px !important;
760
1016
  padding-right: var(--size-40) !important;
761
1017
  }
762
1018
  html:not([dir="rtl"]) .p-x-5 {
1019
+ padding-left: 40px !important;
763
1020
  padding-left: var(--size-40) !important;
764
1021
  }
765
1022
  [dir="rtl"] .p-x-5 {
1023
+ padding-left: 40px !important;
766
1024
  padding-left: var(--size-40) !important;
767
1025
  }
768
1026
  html:not([dir="rtl"]) .p-x-5 {
1027
+ padding-right: 40px !important;
769
1028
  padding-right: var(--size-40) !important;
770
1029
  }
771
1030
  .m-t-4 {
1031
+ margin-top: 32px !important;
772
1032
  margin-top: var(--size-32) !important;
773
1033
  }
774
1034
  .m-b-4 {
1035
+ margin-bottom: 32px !important;
775
1036
  margin-bottom: var(--size-32) !important;
776
1037
  }
777
1038
  .m-y-4 {
1039
+ margin-top: 32px !important;
778
1040
  margin-top: var(--size-32) !important;
1041
+ margin-bottom: 32px !important;
779
1042
  margin-bottom: var(--size-32) !important;
780
1043
  }
781
1044
  .p-t-4 {
1045
+ padding-top: 32px !important;
782
1046
  padding-top: var(--size-32) !important;
783
1047
  }
784
1048
  .p-b-4 {
1049
+ padding-bottom: 32px !important;
785
1050
  padding-bottom: var(--size-32) !important;
786
1051
  }
787
1052
  .p-y-4 {
1053
+ padding-top: 32px !important;
788
1054
  padding-top: var(--size-32) !important;
1055
+ padding-bottom: 32px !important;
789
1056
  padding-bottom: var(--size-32) !important;
790
1057
  }
791
1058
  .m-t-5 {
1059
+ margin-top: 40px !important;
792
1060
  margin-top: var(--size-40) !important;
793
1061
  }
794
1062
  .m-b-5 {
1063
+ margin-bottom: 40px !important;
795
1064
  margin-bottom: var(--size-40) !important;
796
1065
  }
797
1066
  .m-y-5 {
1067
+ margin-top: 40px !important;
798
1068
  margin-top: var(--size-40) !important;
1069
+ margin-bottom: 40px !important;
799
1070
  margin-bottom: var(--size-40) !important;
800
1071
  }
801
1072
  .p-t-5 {
1073
+ padding-top: 40px !important;
802
1074
  padding-top: var(--size-40) !important;
803
1075
  }
804
1076
  .p-b-5 {
1077
+ padding-bottom: 40px !important;
805
1078
  padding-bottom: var(--size-40) !important;
806
1079
  }
807
1080
  .p-y-5 {
1081
+ padding-top: 40px !important;
808
1082
  padding-top: var(--size-40) !important;
1083
+ padding-bottom: 40px !important;
809
1084
  padding-bottom: var(--size-40) !important;
810
1085
  }
811
1086
  .gap-y-1 {
1087
+ row-gap: 8px;
812
1088
  row-gap: var(--size-8);
813
1089
  }
814
1090
  .m-a-panel {
1091
+ margin-top: 16px !important;
815
1092
  margin-top: var(--size-16) !important;
1093
+ margin-bottom: 16px !important;
816
1094
  margin-bottom: var(--size-16) !important;
817
1095
  }
818
1096
  [dir="rtl"] .m-a-panel {
1097
+ margin-left: 16px !important;
819
1098
  margin-left: var(--size-16) !important;
820
1099
  }
821
1100
  html:not([dir="rtl"]) .m-a-panel {
1101
+ margin-right: 16px !important;
822
1102
  margin-right: var(--size-16) !important;
823
1103
  }
824
1104
  [dir="rtl"] .m-a-panel {
1105
+ margin-right: 16px !important;
825
1106
  margin-right: var(--size-16) !important;
826
1107
  }
827
1108
  html:not([dir="rtl"]) .m-a-panel {
1109
+ margin-left: 16px !important;
828
1110
  margin-left: var(--size-16) !important;
829
1111
  }
830
1112
  .p-a-panel {
1113
+ padding-top: 16px !important;
831
1114
  padding-top: var(--size-16) !important;
1115
+ padding-bottom: 16px !important;
832
1116
  padding-bottom: var(--size-16) !important;
833
1117
  }
834
1118
  [dir="rtl"] .p-a-panel {
1119
+ padding-left: 16px !important;
835
1120
  padding-left: var(--size-16) !important;
836
1121
  }
837
1122
  html:not([dir="rtl"]) .p-a-panel {
1123
+ padding-right: 16px !important;
838
1124
  padding-right: var(--size-16) !important;
839
1125
  }
840
1126
  [dir="rtl"] .p-a-panel {
1127
+ padding-right: 16px !important;
841
1128
  padding-right: var(--size-16) !important;
842
1129
  }
843
1130
  html:not([dir="rtl"]) .p-a-panel {
1131
+ padding-left: 16px !important;
844
1132
  padding-left: var(--size-16) !important;
845
1133
  }
846
1134
  @media (min-width: 576px) {
847
1135
  .m-a-panel {
1136
+ margin-top: 24px !important;
848
1137
  margin-top: var(--size-24) !important;
1138
+ margin-bottom: 24px !important;
849
1139
  margin-bottom: var(--size-24) !important;
850
1140
  }
851
1141
  [dir="rtl"] .m-a-panel {
1142
+ margin-left: 24px !important;
852
1143
  margin-left: var(--size-24) !important;
853
1144
  }
854
1145
  html:not([dir="rtl"]) .m-a-panel {
1146
+ margin-right: 24px !important;
855
1147
  margin-right: var(--size-24) !important;
856
1148
  }
857
1149
  [dir="rtl"] .m-a-panel {
1150
+ margin-right: 24px !important;
858
1151
  margin-right: var(--size-24) !important;
859
1152
  }
860
1153
  html:not([dir="rtl"]) .m-a-panel {
1154
+ margin-left: 24px !important;
861
1155
  margin-left: var(--size-24) !important;
862
1156
  }
863
1157
  .p-a-panel {
1158
+ padding-top: 24px !important;
864
1159
  padding-top: var(--size-24) !important;
1160
+ padding-bottom: 24px !important;
865
1161
  padding-bottom: var(--size-24) !important;
866
1162
  }
867
1163
  [dir="rtl"] .p-a-panel {
1164
+ padding-left: 24px !important;
868
1165
  padding-left: var(--size-24) !important;
869
1166
  }
870
1167
  html:not([dir="rtl"]) .p-a-panel {
1168
+ padding-right: 24px !important;
871
1169
  padding-right: var(--size-24) !important;
872
1170
  }
873
1171
  [dir="rtl"] .p-a-panel {
1172
+ padding-right: 24px !important;
874
1173
  padding-right: var(--size-24) !important;
875
1174
  }
876
1175
  html:not([dir="rtl"]) .p-a-panel {
1176
+ padding-left: 24px !important;
877
1177
  padding-left: var(--size-24) !important;
878
1178
  }
879
1179
  }
880
1180
  @media (min-width: 992px) {
881
1181
  .m-a-panel {
1182
+ margin-top: 32px !important;
882
1183
  margin-top: var(--size-32) !important;
1184
+ margin-bottom: 32px !important;
883
1185
  margin-bottom: var(--size-32) !important;
884
1186
  }
885
1187
  [dir="rtl"] .m-a-panel {
1188
+ margin-left: 32px !important;
886
1189
  margin-left: var(--size-32) !important;
887
1190
  }
888
1191
  html:not([dir="rtl"]) .m-a-panel {
1192
+ margin-right: 32px !important;
889
1193
  margin-right: var(--size-32) !important;
890
1194
  }
891
1195
  [dir="rtl"] .m-a-panel {
1196
+ margin-right: 32px !important;
892
1197
  margin-right: var(--size-32) !important;
893
1198
  }
894
1199
  html:not([dir="rtl"]) .m-a-panel {
1200
+ margin-left: 32px !important;
895
1201
  margin-left: var(--size-32) !important;
896
1202
  }
897
1203
  .p-a-panel {
1204
+ padding-top: 32px !important;
898
1205
  padding-top: var(--size-32) !important;
1206
+ padding-bottom: 32px !important;
899
1207
  padding-bottom: var(--size-32) !important;
900
1208
  }
901
1209
  [dir="rtl"] .p-a-panel {
1210
+ padding-left: 32px !important;
902
1211
  padding-left: var(--size-32) !important;
903
1212
  }
904
1213
  html:not([dir="rtl"]) .p-a-panel {
1214
+ padding-right: 32px !important;
905
1215
  padding-right: var(--size-32) !important;
906
1216
  }
907
1217
  [dir="rtl"] .p-a-panel {
1218
+ padding-right: 32px !important;
908
1219
  padding-right: var(--size-32) !important;
909
1220
  }
910
1221
  html:not([dir="rtl"]) .p-a-panel {
1222
+ padding-left: 32px !important;
911
1223
  padding-left: var(--size-32) !important;
912
1224
  }
913
1225
  }
914
1226
  .m-t-panel {
1227
+ margin-top: 16px !important;
915
1228
  margin-top: var(--size-16) !important;
916
1229
  }
917
1230
  .m-b-panel {
1231
+ margin-bottom: 16px !important;
918
1232
  margin-bottom: var(--size-16) !important;
919
1233
  }
920
1234
  .m-y-panel {
1235
+ margin-top: 16px !important;
921
1236
  margin-top: var(--size-16) !important;
1237
+ margin-bottom: 16px !important;
922
1238
  margin-bottom: var(--size-16) !important;
923
1239
  }
924
1240
  .p-t-panel {
1241
+ padding-top: 16px !important;
925
1242
  padding-top: var(--size-16) !important;
926
1243
  }
927
1244
  .p-b-panel {
1245
+ padding-bottom: 16px !important;
928
1246
  padding-bottom: var(--size-16) !important;
929
1247
  }
930
1248
  .p-y-panel {
1249
+ padding-top: 16px !important;
931
1250
  padding-top: var(--size-16) !important;
1251
+ padding-bottom: 16px !important;
932
1252
  padding-bottom: var(--size-16) !important;
933
1253
  }
934
1254
  @media (min-width: 576px) {
935
1255
  .m-t-panel {
1256
+ margin-top: 24px !important;
936
1257
  margin-top: var(--size-24) !important;
937
1258
  }
938
1259
  .m-b-panel {
1260
+ margin-bottom: 24px !important;
939
1261
  margin-bottom: var(--size-24) !important;
940
1262
  }
941
1263
  .m-y-panel {
1264
+ margin-top: 24px !important;
942
1265
  margin-top: var(--size-24) !important;
1266
+ margin-bottom: 24px !important;
943
1267
  margin-bottom: var(--size-24) !important;
944
1268
  }
945
1269
  .p-t-panel {
1270
+ padding-top: 24px !important;
946
1271
  padding-top: var(--size-24) !important;
947
1272
  }
948
1273
  .p-b-panel {
1274
+ padding-bottom: 24px !important;
949
1275
  padding-bottom: var(--size-24) !important;
950
1276
  }
951
1277
  .p-y-panel {
1278
+ padding-top: 24px !important;
952
1279
  padding-top: var(--size-24) !important;
1280
+ padding-bottom: 24px !important;
953
1281
  padding-bottom: var(--size-24) !important;
954
1282
  }
955
1283
  }
956
1284
  @media (min-width: 992px) {
957
1285
  .m-t-panel {
1286
+ margin-top: 32px !important;
958
1287
  margin-top: var(--size-32) !important;
959
1288
  }
960
1289
  .m-b-panel {
1290
+ margin-bottom: 32px !important;
961
1291
  margin-bottom: var(--size-32) !important;
962
1292
  }
963
1293
  .m-y-panel {
1294
+ margin-top: 32px !important;
964
1295
  margin-top: var(--size-32) !important;
1296
+ margin-bottom: 32px !important;
965
1297
  margin-bottom: var(--size-32) !important;
966
1298
  }
967
1299
  .p-t-panel {
1300
+ padding-top: 32px !important;
968
1301
  padding-top: var(--size-32) !important;
969
1302
  }
970
1303
  .p-b-panel {
1304
+ padding-bottom: 32px !important;
971
1305
  padding-bottom: var(--size-32) !important;
972
1306
  }
973
1307
  .p-y-panel {
1308
+ padding-top: 32px !important;
974
1309
  padding-top: var(--size-32) !important;
1310
+ padding-bottom: 32px !important;
975
1311
  padding-bottom: var(--size-32) !important;
976
1312
  }
977
1313
  }
978
1314
  [dir="rtl"] .m-l-panel {
1315
+ margin-right: 16px !important;
979
1316
  margin-right: var(--size-16) !important;
980
1317
  }
981
1318
  html:not([dir="rtl"]) .m-l-panel {
1319
+ margin-left: 16px !important;
982
1320
  margin-left: var(--size-16) !important;
983
1321
  }
984
1322
  [dir="rtl"] .m-r-panel {
1323
+ margin-left: 16px !important;
985
1324
  margin-left: var(--size-16) !important;
986
1325
  }
987
1326
  html:not([dir="rtl"]) .m-r-panel {
1327
+ margin-right: 16px !important;
988
1328
  margin-right: var(--size-16) !important;
989
1329
  }
990
1330
  [dir="rtl"] .m-x-panel {
1331
+ margin-right: 16px !important;
991
1332
  margin-right: var(--size-16) !important;
992
1333
  }
993
1334
  html:not([dir="rtl"]) .m-x-panel {
1335
+ margin-left: 16px !important;
994
1336
  margin-left: var(--size-16) !important;
995
1337
  }
996
1338
  [dir="rtl"] .m-x-panel {
1339
+ margin-left: 16px !important;
997
1340
  margin-left: var(--size-16) !important;
998
1341
  }
999
1342
  html:not([dir="rtl"]) .m-x-panel {
1343
+ margin-right: 16px !important;
1000
1344
  margin-right: var(--size-16) !important;
1001
1345
  }
1002
1346
  [dir="rtl"] .p-l-panel {
1347
+ padding-right: 16px !important;
1003
1348
  padding-right: var(--size-16) !important;
1004
1349
  }
1005
1350
  html:not([dir="rtl"]) .p-l-panel {
1351
+ padding-left: 16px !important;
1006
1352
  padding-left: var(--size-16) !important;
1007
1353
  }
1008
1354
  [dir="rtl"] .p-r-panel {
1355
+ padding-left: 16px !important;
1009
1356
  padding-left: var(--size-16) !important;
1010
1357
  }
1011
1358
  html:not([dir="rtl"]) .p-r-panel {
1359
+ padding-right: 16px !important;
1012
1360
  padding-right: var(--size-16) !important;
1013
1361
  }
1014
1362
  [dir="rtl"] .p-x-panel {
1363
+ padding-right: 16px !important;
1015
1364
  padding-right: var(--size-16) !important;
1016
1365
  }
1017
1366
  html:not([dir="rtl"]) .p-x-panel {
1367
+ padding-left: 16px !important;
1018
1368
  padding-left: var(--size-16) !important;
1019
1369
  }
1020
1370
  [dir="rtl"] .p-x-panel {
1371
+ padding-left: 16px !important;
1021
1372
  padding-left: var(--size-16) !important;
1022
1373
  }
1023
1374
  html:not([dir="rtl"]) .p-x-panel {
1375
+ padding-right: 16px !important;
1024
1376
  padding-right: var(--size-16) !important;
1025
1377
  }
1026
1378
  @media (min-width: 576px) {
1027
1379
  [dir="rtl"] .m-l-panel {
1380
+ margin-right: 24px !important;
1028
1381
  margin-right: var(--size-24) !important;
1029
1382
  }
1030
1383
  html:not([dir="rtl"]) .m-l-panel {
1384
+ margin-left: 24px !important;
1031
1385
  margin-left: var(--size-24) !important;
1032
1386
  }
1033
1387
  [dir="rtl"] .m-r-panel {
1388
+ margin-left: 24px !important;
1034
1389
  margin-left: var(--size-24) !important;
1035
1390
  }
1036
1391
  html:not([dir="rtl"]) .m-r-panel {
1392
+ margin-right: 24px !important;
1037
1393
  margin-right: var(--size-24) !important;
1038
1394
  }
1039
1395
  [dir="rtl"] .m-x-panel {
1396
+ margin-right: 24px !important;
1040
1397
  margin-right: var(--size-24) !important;
1041
1398
  }
1042
1399
  html:not([dir="rtl"]) .m-x-panel {
1400
+ margin-left: 24px !important;
1043
1401
  margin-left: var(--size-24) !important;
1044
1402
  }
1045
1403
  [dir="rtl"] .m-x-panel {
1404
+ margin-left: 24px !important;
1046
1405
  margin-left: var(--size-24) !important;
1047
1406
  }
1048
1407
  html:not([dir="rtl"]) .m-x-panel {
1408
+ margin-right: 24px !important;
1049
1409
  margin-right: var(--size-24) !important;
1050
1410
  }
1051
1411
  [dir="rtl"] .p-l-panel {
1412
+ padding-right: 24px !important;
1052
1413
  padding-right: var(--size-24) !important;
1053
1414
  }
1054
1415
  html:not([dir="rtl"]) .p-l-panel {
1416
+ padding-left: 24px !important;
1055
1417
  padding-left: var(--size-24) !important;
1056
1418
  }
1057
1419
  [dir="rtl"] .p-r-panel {
1420
+ padding-left: 24px !important;
1058
1421
  padding-left: var(--size-24) !important;
1059
1422
  }
1060
1423
  html:not([dir="rtl"]) .p-r-panel {
1424
+ padding-right: 24px !important;
1061
1425
  padding-right: var(--size-24) !important;
1062
1426
  }
1063
1427
  [dir="rtl"] .p-x-panel {
1428
+ padding-right: 24px !important;
1064
1429
  padding-right: var(--size-24) !important;
1065
1430
  }
1066
1431
  html:not([dir="rtl"]) .p-x-panel {
1432
+ padding-left: 24px !important;
1067
1433
  padding-left: var(--size-24) !important;
1068
1434
  }
1069
1435
  [dir="rtl"] .p-x-panel {
1436
+ padding-left: 24px !important;
1070
1437
  padding-left: var(--size-24) !important;
1071
1438
  }
1072
1439
  html:not([dir="rtl"]) .p-x-panel {
1440
+ padding-right: 24px !important;
1073
1441
  padding-right: var(--size-24) !important;
1074
1442
  }
1075
1443
  }
1076
1444
  @media (min-width: 992px) {
1077
1445
  [dir="rtl"] .m-l-panel {
1446
+ margin-right: 32px !important;
1078
1447
  margin-right: var(--size-32) !important;
1079
1448
  }
1080
1449
  html:not([dir="rtl"]) .m-l-panel {
1450
+ margin-left: 32px !important;
1081
1451
  margin-left: var(--size-32) !important;
1082
1452
  }
1083
1453
  [dir="rtl"] .m-r-panel {
1454
+ margin-left: 32px !important;
1084
1455
  margin-left: var(--size-32) !important;
1085
1456
  }
1086
1457
  html:not([dir="rtl"]) .m-r-panel {
1458
+ margin-right: 32px !important;
1087
1459
  margin-right: var(--size-32) !important;
1088
1460
  }
1089
1461
  [dir="rtl"] .m-x-panel {
1462
+ margin-right: 32px !important;
1090
1463
  margin-right: var(--size-32) !important;
1091
1464
  }
1092
1465
  html:not([dir="rtl"]) .m-x-panel {
1466
+ margin-left: 32px !important;
1093
1467
  margin-left: var(--size-32) !important;
1094
1468
  }
1095
1469
  [dir="rtl"] .m-x-panel {
1470
+ margin-left: 32px !important;
1096
1471
  margin-left: var(--size-32) !important;
1097
1472
  }
1098
1473
  html:not([dir="rtl"]) .m-x-panel {
1474
+ margin-right: 32px !important;
1099
1475
  margin-right: var(--size-32) !important;
1100
1476
  }
1101
1477
  [dir="rtl"] .p-l-panel {
1478
+ padding-right: 32px !important;
1102
1479
  padding-right: var(--size-32) !important;
1103
1480
  }
1104
1481
  html:not([dir="rtl"]) .p-l-panel {
1482
+ padding-left: 32px !important;
1105
1483
  padding-left: var(--size-32) !important;
1106
1484
  }
1107
1485
  [dir="rtl"] .p-r-panel {
1486
+ padding-left: 32px !important;
1108
1487
  padding-left: var(--size-32) !important;
1109
1488
  }
1110
1489
  html:not([dir="rtl"]) .p-r-panel {
1490
+ padding-right: 32px !important;
1111
1491
  padding-right: var(--size-32) !important;
1112
1492
  }
1113
1493
  [dir="rtl"] .p-x-panel {
1494
+ padding-right: 32px !important;
1114
1495
  padding-right: var(--size-32) !important;
1115
1496
  }
1116
1497
  html:not([dir="rtl"]) .p-x-panel {
1498
+ padding-left: 32px !important;
1117
1499
  padding-left: var(--size-32) !important;
1118
1500
  }
1119
1501
  [dir="rtl"] .p-x-panel {
1502
+ padding-left: 32px !important;
1120
1503
  padding-left: var(--size-32) !important;
1121
1504
  }
1122
1505
  html:not([dir="rtl"]) .p-x-panel {
1506
+ padding-right: 32px !important;
1123
1507
  padding-right: var(--size-32) !important;
1124
1508
  }
1125
1509
  }
1126
1510
  .m-t-section-1 {
1511
+ margin-top: 16px !important;
1127
1512
  margin-top: var(--size-16) !important;
1128
1513
  }
1129
1514
  .m-b-section-1 {
1515
+ margin-bottom: 16px !important;
1130
1516
  margin-bottom: var(--size-16) !important;
1131
1517
  }
1132
1518
  .m-y-section-1 {
1519
+ margin-top: 16px !important;
1133
1520
  margin-top: var(--size-16) !important;
1521
+ margin-bottom: 16px !important;
1134
1522
  margin-bottom: var(--size-16) !important;
1135
1523
  }
1136
1524
  .p-t-section-1 {
1525
+ padding-top: 16px !important;
1137
1526
  padding-top: var(--size-16) !important;
1138
1527
  }
1139
1528
  .p-b-section-1 {
1529
+ padding-bottom: 16px !important;
1140
1530
  padding-bottom: var(--size-16) !important;
1141
1531
  }
1142
1532
  .p-y-section-1 {
1533
+ padding-top: 16px !important;
1143
1534
  padding-top: var(--size-16) !important;
1535
+ padding-bottom: 16px !important;
1144
1536
  padding-bottom: var(--size-16) !important;
1145
1537
  }
1146
1538
  @media (min-width: 576px) {
1147
1539
  .m-t-section-1 {
1540
+ margin-top: 24px !important;
1148
1541
  margin-top: var(--size-24) !important;
1149
1542
  }
1150
1543
  .m-b-section-1 {
1544
+ margin-bottom: 24px !important;
1151
1545
  margin-bottom: var(--size-24) !important;
1152
1546
  }
1153
1547
  .m-y-section-1 {
1548
+ margin-top: 24px !important;
1154
1549
  margin-top: var(--size-24) !important;
1550
+ margin-bottom: 24px !important;
1155
1551
  margin-bottom: var(--size-24) !important;
1156
1552
  }
1157
1553
  .p-t-section-1 {
1554
+ padding-top: 24px !important;
1158
1555
  padding-top: var(--size-24) !important;
1159
1556
  }
1160
1557
  .p-b-section-1 {
1558
+ padding-bottom: 24px !important;
1161
1559
  padding-bottom: var(--size-24) !important;
1162
1560
  }
1163
1561
  .p-y-section-1 {
1562
+ padding-top: 24px !important;
1164
1563
  padding-top: var(--size-24) !important;
1564
+ padding-bottom: 24px !important;
1165
1565
  padding-bottom: var(--size-24) !important;
1166
1566
  }
1167
1567
  }
1168
1568
  @media (min-width: 992px) {
1169
1569
  .m-t-section-1 {
1570
+ margin-top: 32px !important;
1170
1571
  margin-top: var(--size-32) !important;
1171
1572
  }
1172
1573
  .m-b-section-1 {
1574
+ margin-bottom: 32px !important;
1173
1575
  margin-bottom: var(--size-32) !important;
1174
1576
  }
1175
1577
  .m-y-section-1 {
1578
+ margin-top: 32px !important;
1176
1579
  margin-top: var(--size-32) !important;
1580
+ margin-bottom: 32px !important;
1177
1581
  margin-bottom: var(--size-32) !important;
1178
1582
  }
1179
1583
  .p-t-section-1 {
1584
+ padding-top: 32px !important;
1180
1585
  padding-top: var(--size-32) !important;
1181
1586
  }
1182
1587
  .p-b-section-1 {
1588
+ padding-bottom: 32px !important;
1183
1589
  padding-bottom: var(--size-32) !important;
1184
1590
  }
1185
1591
  .p-y-section-1 {
1592
+ padding-top: 32px !important;
1186
1593
  padding-top: var(--size-32) !important;
1594
+ padding-bottom: 32px !important;
1187
1595
  padding-bottom: var(--size-32) !important;
1188
1596
  }
1189
1597
  }
1190
1598
  .m-t-section-2 {
1599
+ margin-top: 32px !important;
1191
1600
  margin-top: var(--size-32) !important;
1192
1601
  }
1193
1602
  .m-b-section-2 {
1603
+ margin-bottom: 32px !important;
1194
1604
  margin-bottom: var(--size-32) !important;
1195
1605
  }
1196
1606
  .m-y-section-2 {
1607
+ margin-top: 32px !important;
1197
1608
  margin-top: var(--size-32) !important;
1609
+ margin-bottom: 32px !important;
1198
1610
  margin-bottom: var(--size-32) !important;
1199
1611
  }
1200
1612
  .p-t-section-2 {
1613
+ padding-top: 32px !important;
1201
1614
  padding-top: var(--size-32) !important;
1202
1615
  }
1203
1616
  .p-b-section-2 {
1617
+ padding-bottom: 32px !important;
1204
1618
  padding-bottom: var(--size-32) !important;
1205
1619
  }
1206
1620
  .p-y-section-2 {
1621
+ padding-top: 32px !important;
1207
1622
  padding-top: var(--size-32) !important;
1623
+ padding-bottom: 32px !important;
1208
1624
  padding-bottom: var(--size-32) !important;
1209
1625
  }
1210
1626
  @media (min-width: 576px) {
1211
1627
  .m-t-section-2 {
1628
+ margin-top: 48px !important;
1212
1629
  margin-top: var(--size-48) !important;
1213
1630
  }
1214
1631
  .m-b-section-2 {
1632
+ margin-bottom: 48px !important;
1215
1633
  margin-bottom: var(--size-48) !important;
1216
1634
  }
1217
1635
  .m-y-section-2 {
1636
+ margin-top: 48px !important;
1218
1637
  margin-top: var(--size-48) !important;
1638
+ margin-bottom: 48px !important;
1219
1639
  margin-bottom: var(--size-48) !important;
1220
1640
  }
1221
1641
  .p-t-section-2 {
1642
+ padding-top: 48px !important;
1222
1643
  padding-top: var(--size-48) !important;
1223
1644
  }
1224
1645
  .p-b-section-2 {
1646
+ padding-bottom: 48px !important;
1225
1647
  padding-bottom: var(--size-48) !important;
1226
1648
  }
1227
1649
  .p-y-section-2 {
1650
+ padding-top: 48px !important;
1228
1651
  padding-top: var(--size-48) !important;
1652
+ padding-bottom: 48px !important;
1229
1653
  padding-bottom: var(--size-48) !important;
1230
1654
  }
1231
1655
  }
1232
1656
  @media (min-width: 992px) {
1233
1657
  .m-t-section-2 {
1658
+ margin-top: 64px !important;
1234
1659
  margin-top: var(--size-64) !important;
1235
1660
  }
1236
1661
  .m-b-section-2 {
1662
+ margin-bottom: 64px !important;
1237
1663
  margin-bottom: var(--size-64) !important;
1238
1664
  }
1239
1665
  .m-y-section-2 {
1666
+ margin-top: 64px !important;
1240
1667
  margin-top: var(--size-64) !important;
1668
+ margin-bottom: 64px !important;
1241
1669
  margin-bottom: var(--size-64) !important;
1242
1670
  }
1243
1671
  .p-t-section-2 {
1672
+ padding-top: 64px !important;
1244
1673
  padding-top: var(--size-64) !important;
1245
1674
  }
1246
1675
  .p-b-section-2 {
1676
+ padding-bottom: 64px !important;
1247
1677
  padding-bottom: var(--size-64) !important;
1248
1678
  }
1249
1679
  .p-y-section-2 {
1680
+ padding-top: 64px !important;
1250
1681
  padding-top: var(--size-64) !important;
1682
+ padding-bottom: 64px !important;
1251
1683
  padding-bottom: var(--size-64) !important;
1252
1684
  }
1253
1685
  }
1254
1686
  .m-t-section-3 {
1687
+ margin-top: 48px !important;
1255
1688
  margin-top: var(--size-48) !important;
1256
1689
  }
1257
1690
  .m-b-section-3 {
1691
+ margin-bottom: 48px !important;
1258
1692
  margin-bottom: var(--size-48) !important;
1259
1693
  }
1260
1694
  .m-y-section-3 {
1695
+ margin-top: 48px !important;
1261
1696
  margin-top: var(--size-48) !important;
1697
+ margin-bottom: 48px !important;
1262
1698
  margin-bottom: var(--size-48) !important;
1263
1699
  }
1264
1700
  .p-t-section-3 {
1701
+ padding-top: 48px !important;
1265
1702
  padding-top: var(--size-48) !important;
1266
1703
  }
1267
1704
  .p-b-section-3 {
1705
+ padding-bottom: 48px !important;
1268
1706
  padding-bottom: var(--size-48) !important;
1269
1707
  }
1270
1708
  .p-y-section-3 {
1709
+ padding-top: 48px !important;
1271
1710
  padding-top: var(--size-48) !important;
1711
+ padding-bottom: 48px !important;
1272
1712
  padding-bottom: var(--size-48) !important;
1273
1713
  }
1274
1714
  @media (min-width: 576px) {
1275
1715
  .m-t-section-3 {
1716
+ margin-top: 72px !important;
1276
1717
  margin-top: var(--size-72) !important;
1277
1718
  }
1278
1719
  .m-b-section-3 {
1720
+ margin-bottom: 72px !important;
1279
1721
  margin-bottom: var(--size-72) !important;
1280
1722
  }
1281
1723
  .m-y-section-3 {
1724
+ margin-top: 72px !important;
1282
1725
  margin-top: var(--size-72) !important;
1726
+ margin-bottom: 72px !important;
1283
1727
  margin-bottom: var(--size-72) !important;
1284
1728
  }
1285
1729
  .p-t-section-3 {
1730
+ padding-top: 72px !important;
1286
1731
  padding-top: var(--size-72) !important;
1287
1732
  }
1288
1733
  .p-b-section-3 {
1734
+ padding-bottom: 72px !important;
1289
1735
  padding-bottom: var(--size-72) !important;
1290
1736
  }
1291
1737
  .p-y-section-3 {
1738
+ padding-top: 72px !important;
1292
1739
  padding-top: var(--size-72) !important;
1740
+ padding-bottom: 72px !important;
1293
1741
  padding-bottom: var(--size-72) !important;
1294
1742
  }
1295
1743
  }
1296
1744
  @media (min-width: 992px) {
1297
1745
  .m-t-section-3 {
1746
+ margin-top: 96px !important;
1298
1747
  margin-top: var(--size-96) !important;
1299
1748
  }
1300
1749
  .m-b-section-3 {
1750
+ margin-bottom: 96px !important;
1301
1751
  margin-bottom: var(--size-96) !important;
1302
1752
  }
1303
1753
  .m-y-section-3 {
1754
+ margin-top: 96px !important;
1304
1755
  margin-top: var(--size-96) !important;
1756
+ margin-bottom: 96px !important;
1305
1757
  margin-bottom: var(--size-96) !important;
1306
1758
  }
1307
1759
  .p-t-section-3 {
1760
+ padding-top: 96px !important;
1308
1761
  padding-top: var(--size-96) !important;
1309
1762
  }
1310
1763
  .p-b-section-3 {
1764
+ padding-bottom: 96px !important;
1311
1765
  padding-bottom: var(--size-96) !important;
1312
1766
  }
1313
1767
  .p-y-section-3 {
1768
+ padding-top: 96px !important;
1314
1769
  padding-top: var(--size-96) !important;
1770
+ padding-bottom: 96px !important;
1315
1771
  padding-bottom: var(--size-96) !important;
1316
1772
  }
1317
1773
  }
@@ -1346,22 +1802,28 @@ html:not([dir="rtl"]) .p-x-panel {
1346
1802
  margin-left: initial !important;
1347
1803
  }
1348
1804
  .section {
1805
+ padding-top: 48px;
1349
1806
  padding-top: var(--size-48);
1807
+ padding-bottom: 48px;
1350
1808
  padding-bottom: var(--size-48);
1351
1809
  }
1352
1810
  @media (min-width: 576px) {
1353
1811
  .section {
1812
+ padding-top: 72px;
1354
1813
  padding-top: var(--size-72);
1814
+ padding-bottom: 72px;
1355
1815
  padding-bottom: var(--size-72);
1356
1816
  }
1357
1817
  }
1358
1818
  @media (min-width: 992px) {
1359
1819
  .section {
1820
+ padding-top: 96px;
1360
1821
  padding-top: var(--size-96);
1822
+ padding-bottom: 96px;
1361
1823
  padding-bottom: var(--size-96);
1362
1824
  }
1363
1825
  }
1364
1826
  .border-bottom {
1365
- border-bottom: 1px solid rgba(22,51,0,0.07843);
1827
+ border-bottom: 1px solid rgba(134,167,189,0.10196);
1366
1828
  border-bottom: 1px solid var(--color-background-neutral);
1367
1829
  }