PluginProbe ʕ •ᴥ•ʔ
Spider Elements – Premium Elementor Widgets & Addons Library / trunk
Spider Elements – Premium Elementor Widgets & Addons Library vtrunk
trunk 1.0.0 1.1.0 1.5.0 1.6.0 1.6.1 1.6.2 1.6.3 1.6.4 1.6.5 1.6.6 1.6.7 1.7.0 1.8.0 1.9.0
spider-elements / assets / css / main.css
spider-elements / assets / css Last commit date
admin-rtl.css 6 months ago admin-rtl.css.map 6 months ago admin.css 4 months ago admin.css.map 4 months ago dark-mode.css 6 months ago dark-mode.css.map 6 months ago elementor-editor.css 1 year ago extension.css 1 year ago extension.css.map 1 year ago main.css 1 month ago main.css.map 6 months ago rtl.css 1 year ago rtl.css.map 1 year ago
main.css
10253 lines
1 @charset "UTF-8";
2 /*----------------------------------------------------
3 @File: Default Styles
4
5 This file contains the styling for the actual template, this
6 is the file you need to edit to change the look of the
7 template.
8 ---------------------------------------------------- */
9 /*=====================================================================
10 @Template Name: Spider Elements
11
12 @Default Styles
13 Table of Content:
14 01/ Mixins
15 02/ prefix
16 02/ Common
17 04/ framework
18 05/ Accordion
19 06/ Tabs
20 07/ Testimonial
21 08/ Video_Playlist
22 09/ Alerts_box
23 10/ Animation
24 11/ List_Item
25 12/ Cheat_sheet
26 13/ Team
27 14/ Integration
28 15/ Blog_grid
29 16/ Before_after
30 17/ Timeline
31 18/ Buttons
32 19/ Animated_Headline
33 20/ video_popup
34 21/ Counter
35 22/ Instagram
36 23/ Fullscreen_Slider
37 24/ Icon_box
38 25/ Pricing_Table
39 26/ Pricing_Table_Switcher
40
41
42 =====================================================================*/
43 /* Base margin classes */
44 .spel-m-0 {
45 margin: 0 !important;
46 }
47
48 .spel-m-4 {
49 margin: 4px !important;
50 }
51
52 .spel-m-8 {
53 margin: 8px !important;
54 }
55
56 .spel-m-12 {
57 margin: 12px !important;
58 }
59
60 .spel-m-16 {
61 margin: 16px !important;
62 }
63
64 .spel-m-20 {
65 margin: 20px !important;
66 }
67
68 .spel-m-24 {
69 margin: 24px !important;
70 }
71
72 .spel-m-28 {
73 margin: 28px !important;
74 }
75
76 .spel-m-32 {
77 margin: 32px !important;
78 }
79
80 .spel-m-36 {
81 margin: 36px !important;
82 }
83
84 .spel-m-40 {
85 margin: 40px !important;
86 }
87
88 .spel-m-44 {
89 margin: 44px !important;
90 }
91
92 .spel-m-48 {
93 margin: 48px !important;
94 }
95
96 .spel-m-52 {
97 margin: 52px !important;
98 }
99
100 .spel-m-56 {
101 margin: 56px !important;
102 }
103
104 .spel-m-60 {
105 margin: 60px !important;
106 }
107
108 .spel-m-64 {
109 margin: 64px !important;
110 }
111
112 .spel-m-68 {
113 margin: 68px !important;
114 }
115
116 .spel-m-72 {
117 margin: 72px !important;
118 }
119
120 .spel-m-76 {
121 margin: 76px !important;
122 }
123
124 .spel-m-80 {
125 margin: 80px !important;
126 }
127
128 .spel-m-84 {
129 margin: 84px !important;
130 }
131
132 .spel-m-88 {
133 margin: 88px !important;
134 }
135
136 .spel-m-92 {
137 margin: 92px !important;
138 }
139
140 .spel-m-96 {
141 margin: 96px !important;
142 }
143
144 .spel-m-100 {
145 margin: 100px !important;
146 }
147
148 /* Base padding classes */
149 .spel-p-0 {
150 padding: 0 !important;
151 }
152
153 .spel-p-4 {
154 padding: 4px !important;
155 }
156
157 .spel-p-8 {
158 padding: 8px !important;
159 }
160
161 .spel-p-12 {
162 padding: 12px !important;
163 }
164
165 .spel-p-16 {
166 padding: 16px !important;
167 }
168
169 .spel-p-20 {
170 padding: 20px !important;
171 }
172
173 .spel-p-24 {
174 padding: 24px !important;
175 }
176
177 .spel-p-28 {
178 padding: 28px !important;
179 }
180
181 .spel-p-32 {
182 padding: 32px !important;
183 }
184
185 .spel-p-36 {
186 padding: 36px !important;
187 }
188
189 .spel-p-40 {
190 padding: 40px !important;
191 }
192
193 .spel-p-44 {
194 padding: 44px !important;
195 }
196
197 .spel-p-48 {
198 padding: 48px !important;
199 }
200
201 .spel-p-52 {
202 padding: 52px !important;
203 }
204
205 .spel-p-56 {
206 padding: 56px !important;
207 }
208
209 .spel-p-60 {
210 padding: 60px !important;
211 }
212
213 .spel-p-64 {
214 padding: 64px !important;
215 }
216
217 .spel-p-68 {
218 padding: 68px !important;
219 }
220
221 .spel-p-72 {
222 padding: 72px !important;
223 }
224
225 .spel-p-76 {
226 padding: 76px !important;
227 }
228
229 .spel-p-80 {
230 padding: 80px !important;
231 }
232
233 .spel-p-84 {
234 padding: 84px !important;
235 }
236
237 .spel-p-88 {
238 padding: 88px !important;
239 }
240
241 .spel-p-92 {
242 padding: 92px !important;
243 }
244
245 .spel-p-96 {
246 padding: 96px !important;
247 }
248
249 .spel-p-100 {
250 padding: 100px !important;
251 }
252
253 /* Margin classes for each side */
254 .spel-mt-0 {
255 margin-top: 0 !important;
256 }
257
258 .spel-mt-4 {
259 margin-top: 4px !important;
260 }
261
262 .spel-mt-8 {
263 margin-top: 8px !important;
264 }
265
266 .spel-mt-12 {
267 margin-top: 12px !important;
268 }
269
270 .spel-mt-16 {
271 margin-top: 16px !important;
272 }
273
274 .spel-mt-20 {
275 margin-top: 20px !important;
276 }
277
278 .spel-mt-24 {
279 margin-top: 24px !important;
280 }
281
282 .spel-mt-28 {
283 margin-top: 28px !important;
284 }
285
286 .spel-mt-32 {
287 margin-top: 32px !important;
288 }
289
290 .spel-mt-36 {
291 margin-top: 36px !important;
292 }
293
294 .spel-mt-40 {
295 margin-top: 40px !important;
296 }
297
298 .spel-mt-44 {
299 margin-top: 44px !important;
300 }
301
302 .spel-mt-48 {
303 margin-top: 48px !important;
304 }
305
306 .spel-mt-52 {
307 margin-top: 52px !important;
308 }
309
310 .spel-mt-56 {
311 margin-top: 56px !important;
312 }
313
314 .spel-mt-60 {
315 margin-top: 60px !important;
316 }
317
318 .spel-mt-64 {
319 margin-top: 64px !important;
320 }
321
322 .spel-mt-68 {
323 margin-top: 68px !important;
324 }
325
326 .spel-mt-72 {
327 margin-top: 72px !important;
328 }
329
330 .spel-mt-76 {
331 margin-top: 76px !important;
332 }
333
334 .spel-mt-80 {
335 margin-top: 80px !important;
336 }
337
338 .spel-mt-84 {
339 margin-top: 84px !important;
340 }
341
342 .spel-mt-88 {
343 margin-top: 88px !important;
344 }
345
346 .spel-mt-92 {
347 margin-top: 92px !important;
348 }
349
350 .spel-mt-96 {
351 margin-top: 96px !important;
352 }
353
354 .spel-mt-100 {
355 margin-top: 100px !important;
356 }
357
358 .spel-mr-0 {
359 margin-right: 0 !important;
360 }
361
362 .spel-mr-4 {
363 margin-right: 4px !important;
364 }
365
366 .spel-mr-8 {
367 margin-right: 8px !important;
368 }
369
370 .spel-mr-12 {
371 margin-right: 12px !important;
372 }
373
374 .spel-mr-16 {
375 margin-right: 16px !important;
376 }
377
378 .spel-mr-20 {
379 margin-right: 20px !important;
380 }
381
382 .spel-mr-24 {
383 margin-right: 24px !important;
384 }
385
386 .spel-mr-28 {
387 margin-right: 28px !important;
388 }
389
390 .spel-mr-32 {
391 margin-right: 32px !important;
392 }
393
394 .spel-mr-36 {
395 margin-right: 36px !important;
396 }
397
398 .spel-mr-40 {
399 margin-right: 40px !important;
400 }
401
402 .spel-mr-44 {
403 margin-right: 44px !important;
404 }
405
406 .spel-mr-48 {
407 margin-right: 48px !important;
408 }
409
410 .spel-mr-52 {
411 margin-right: 52px !important;
412 }
413
414 .spel-mr-56 {
415 margin-right: 56px !important;
416 }
417
418 .spel-mr-60 {
419 margin-right: 60px !important;
420 }
421
422 .spel-mr-64 {
423 margin-right: 64px !important;
424 }
425
426 .spel-mr-68 {
427 margin-right: 68px !important;
428 }
429
430 .spel-mr-72 {
431 margin-right: 72px !important;
432 }
433
434 .spel-mr-76 {
435 margin-right: 76px !important;
436 }
437
438 .spel-mr-80 {
439 margin-right: 80px !important;
440 }
441
442 .spel-mr-84 {
443 margin-right: 84px !important;
444 }
445
446 .spel-mr-88 {
447 margin-right: 88px !important;
448 }
449
450 .spel-mr-92 {
451 margin-right: 92px !important;
452 }
453
454 .spel-mr-96 {
455 margin-right: 96px !important;
456 }
457
458 .spel-mr-100 {
459 margin-right: 100px !important;
460 }
461
462 .spel-mb-0 {
463 margin-bottom: 0 !important;
464 }
465
466 .spel-mb-4 {
467 margin-bottom: 4px !important;
468 }
469
470 .spel-mb-8 {
471 margin-bottom: 8px !important;
472 }
473
474 .spel-mb-12 {
475 margin-bottom: 12px !important;
476 }
477
478 .spel-mb-16 {
479 margin-bottom: 16px !important;
480 }
481
482 .spel-mb-20 {
483 margin-bottom: 20px !important;
484 }
485
486 .spel-mb-24 {
487 margin-bottom: 24px !important;
488 }
489
490 .spel-mb-28 {
491 margin-bottom: 28px !important;
492 }
493
494 .spel-mb-32 {
495 margin-bottom: 32px !important;
496 }
497
498 .spel-mb-36 {
499 margin-bottom: 36px !important;
500 }
501
502 .spel-mb-40 {
503 margin-bottom: 40px !important;
504 }
505
506 .spel-mb-44 {
507 margin-bottom: 44px !important;
508 }
509
510 .spel-mb-48 {
511 margin-bottom: 48px !important;
512 }
513
514 .spel-mb-52 {
515 margin-bottom: 52px !important;
516 }
517
518 .spel-mb-56 {
519 margin-bottom: 56px !important;
520 }
521
522 .spel-mb-60 {
523 margin-bottom: 60px !important;
524 }
525
526 .spel-mb-64 {
527 margin-bottom: 64px !important;
528 }
529
530 .spel-mb-68 {
531 margin-bottom: 68px !important;
532 }
533
534 .spel-mb-72 {
535 margin-bottom: 72px !important;
536 }
537
538 .spel-mb-76 {
539 margin-bottom: 76px !important;
540 }
541
542 .spel-mb-80 {
543 margin-bottom: 80px !important;
544 }
545
546 .spel-mb-84 {
547 margin-bottom: 84px !important;
548 }
549
550 .spel-mb-88 {
551 margin-bottom: 88px !important;
552 }
553
554 .spel-mb-92 {
555 margin-bottom: 92px !important;
556 }
557
558 .spel-mb-96 {
559 margin-bottom: 96px !important;
560 }
561
562 .spel-mb-100 {
563 margin-bottom: 100px !important;
564 }
565
566 .spel-ml-0 {
567 margin-left: 0 !important;
568 }
569
570 .spel-ml-4 {
571 margin-left: 4px !important;
572 }
573
574 .spel-ml-8 {
575 margin-left: 8px !important;
576 }
577
578 .spel-ml-12 {
579 margin-left: 12px !important;
580 }
581
582 .spel-ml-16 {
583 margin-left: 16px !important;
584 }
585
586 .spel-ml-20 {
587 margin-left: 20px !important;
588 }
589
590 .spel-ml-24 {
591 margin-left: 24px !important;
592 }
593
594 .spel-ml-28 {
595 margin-left: 28px !important;
596 }
597
598 .spel-ml-32 {
599 margin-left: 32px !important;
600 }
601
602 .spel-ml-36 {
603 margin-left: 36px !important;
604 }
605
606 .spel-ml-40 {
607 margin-left: 40px !important;
608 }
609
610 .spel-ml-44 {
611 margin-left: 44px !important;
612 }
613
614 .spel-ml-48 {
615 margin-left: 48px !important;
616 }
617
618 .spel-ml-52 {
619 margin-left: 52px !important;
620 }
621
622 .spel-ml-56 {
623 margin-left: 56px !important;
624 }
625
626 .spel-ml-60 {
627 margin-left: 60px !important;
628 }
629
630 .spel-ml-64 {
631 margin-left: 64px !important;
632 }
633
634 .spel-ml-68 {
635 margin-left: 68px !important;
636 }
637
638 .spel-ml-72 {
639 margin-left: 72px !important;
640 }
641
642 .spel-ml-76 {
643 margin-left: 76px !important;
644 }
645
646 .spel-ml-80 {
647 margin-left: 80px !important;
648 }
649
650 .spel-ml-84 {
651 margin-left: 84px !important;
652 }
653
654 .spel-ml-88 {
655 margin-left: 88px !important;
656 }
657
658 .spel-ml-92 {
659 margin-left: 92px !important;
660 }
661
662 .spel-ml-96 {
663 margin-left: 96px !important;
664 }
665
666 .spel-ml-100 {
667 margin-left: 100px !important;
668 }
669
670 /* Padding classes for each side */
671 .spel-pt-0 {
672 padding-top: 0 !important;
673 }
674
675 .spel-pt-4 {
676 padding-top: 4px !important;
677 }
678
679 .spel-pt-8 {
680 padding-top: 8px !important;
681 }
682
683 .spel-pt-12 {
684 padding-top: 12px !important;
685 }
686
687 .spel-pt-16 {
688 padding-top: 16px !important;
689 }
690
691 .spel-pt-20 {
692 padding-top: 20px !important;
693 }
694
695 .spel-pt-24 {
696 padding-top: 24px !important;
697 }
698
699 .spel-pt-28 {
700 padding-top: 28px !important;
701 }
702
703 .spel-pt-32 {
704 padding-top: 32px !important;
705 }
706
707 .spel-pt-36 {
708 padding-top: 36px !important;
709 }
710
711 .spel-pt-40 {
712 padding-top: 40px !important;
713 }
714
715 .spel-pt-44 {
716 padding-top: 44px !important;
717 }
718
719 .spel-pt-48 {
720 padding-top: 48px !important;
721 }
722
723 .spel-pt-52 {
724 padding-top: 52px !important;
725 }
726
727 .spel-pt-56 {
728 padding-top: 56px !important;
729 }
730
731 .spel-pt-60 {
732 padding-top: 60px !important;
733 }
734
735 .spel-pt-64 {
736 padding-top: 64px !important;
737 }
738
739 .spel-pt-68 {
740 padding-top: 68px !important;
741 }
742
743 .spel-pt-72 {
744 padding-top: 72px !important;
745 }
746
747 .spel-pt-76 {
748 padding-top: 76px !important;
749 }
750
751 .spel-pt-80 {
752 padding-top: 80px !important;
753 }
754
755 .spel-pt-84 {
756 padding-top: 84px !important;
757 }
758
759 .spel-pt-88 {
760 padding-top: 88px !important;
761 }
762
763 .spel-pt-92 {
764 padding-top: 92px !important;
765 }
766
767 .spel-pt-96 {
768 padding-top: 96px !important;
769 }
770
771 .spel-pt-100 {
772 padding-top: 100px !important;
773 }
774
775 .spel-pr-0 {
776 padding-right: 0 !important;
777 }
778
779 .spel-pr-4 {
780 padding-right: 4px !important;
781 }
782
783 .spel-pr-8 {
784 padding-right: 8px !important;
785 }
786
787 .spel-pr-12 {
788 padding-right: 12px !important;
789 }
790
791 .spel-pr-16 {
792 padding-right: 16px !important;
793 }
794
795 .spel-pr-20 {
796 padding-right: 20px !important;
797 }
798
799 .spel-pr-24 {
800 padding-right: 24px !important;
801 }
802
803 .spel-pr-28 {
804 padding-right: 28px !important;
805 }
806
807 .spel-pr-32 {
808 padding-right: 32px !important;
809 }
810
811 .spel-pr-36 {
812 padding-right: 36px !important;
813 }
814
815 .spel-pr-40 {
816 padding-right: 40px !important;
817 }
818
819 .spel-pr-44 {
820 padding-right: 44px !important;
821 }
822
823 .spel-pr-48 {
824 padding-right: 48px !important;
825 }
826
827 .spel-pr-52 {
828 padding-right: 52px !important;
829 }
830
831 .spel-pr-56 {
832 padding-right: 56px !important;
833 }
834
835 .spel-pr-60 {
836 padding-right: 60px !important;
837 }
838
839 .spel-pr-64 {
840 padding-right: 64px !important;
841 }
842
843 .spel-pr-68 {
844 padding-right: 68px !important;
845 }
846
847 .spel-pr-72 {
848 padding-right: 72px !important;
849 }
850
851 .spel-pr-76 {
852 padding-right: 76px !important;
853 }
854
855 .spel-pr-80 {
856 padding-right: 80px !important;
857 }
858
859 .spel-pr-84 {
860 padding-right: 84px !important;
861 }
862
863 .spel-pr-88 {
864 padding-right: 88px !important;
865 }
866
867 .spel-pr-92 {
868 padding-right: 92px !important;
869 }
870
871 .spel-pr-96 {
872 padding-right: 96px !important;
873 }
874
875 .spel-pr-100 {
876 padding-right: 100px !important;
877 }
878
879 .spel-pb-0 {
880 padding-bottom: 0 !important;
881 }
882
883 .spel-pb-4 {
884 padding-bottom: 4px !important;
885 }
886
887 .spel-pb-8 {
888 padding-bottom: 8px !important;
889 }
890
891 .spel-pb-12 {
892 padding-bottom: 12px !important;
893 }
894
895 .spel-pb-16 {
896 padding-bottom: 16px !important;
897 }
898
899 .spel-pb-20 {
900 padding-bottom: 20px !important;
901 }
902
903 .spel-pb-24 {
904 padding-bottom: 24px !important;
905 }
906
907 .spel-pb-28 {
908 padding-bottom: 28px !important;
909 }
910
911 .spel-pb-32 {
912 padding-bottom: 32px !important;
913 }
914
915 .spel-pb-36 {
916 padding-bottom: 36px !important;
917 }
918
919 .spel-pb-40 {
920 padding-bottom: 40px !important;
921 }
922
923 .spel-pb-44 {
924 padding-bottom: 44px !important;
925 }
926
927 .spel-pb-48 {
928 padding-bottom: 48px !important;
929 }
930
931 .spel-pb-52 {
932 padding-bottom: 52px !important;
933 }
934
935 .spel-pb-56 {
936 padding-bottom: 56px !important;
937 }
938
939 .spel-pb-60 {
940 padding-bottom: 60px !important;
941 }
942
943 .spel-pb-64 {
944 padding-bottom: 64px !important;
945 }
946
947 .spel-pb-68 {
948 padding-bottom: 68px !important;
949 }
950
951 .spel-pb-72 {
952 padding-bottom: 72px !important;
953 }
954
955 .spel-pb-76 {
956 padding-bottom: 76px !important;
957 }
958
959 .spel-pb-80 {
960 padding-bottom: 80px !important;
961 }
962
963 .spel-pb-84 {
964 padding-bottom: 84px !important;
965 }
966
967 .spel-pb-88 {
968 padding-bottom: 88px !important;
969 }
970
971 .spel-pb-92 {
972 padding-bottom: 92px !important;
973 }
974
975 .spel-pb-96 {
976 padding-bottom: 96px !important;
977 }
978
979 .spel-pb-100 {
980 padding-bottom: 100px !important;
981 }
982
983 .spel-pl-0 {
984 padding-left: 0 !important;
985 }
986
987 .spel-pl-4 {
988 padding-left: 4px !important;
989 }
990
991 .spel-pl-8 {
992 padding-left: 8px !important;
993 }
994
995 .spel-pl-12 {
996 padding-left: 12px !important;
997 }
998
999 .spel-pl-16 {
1000 padding-left: 16px !important;
1001 }
1002
1003 .spel-pl-20 {
1004 padding-left: 20px !important;
1005 }
1006
1007 .spel-pl-24 {
1008 padding-left: 24px !important;
1009 }
1010
1011 .spel-pl-28 {
1012 padding-left: 28px !important;
1013 }
1014
1015 .spel-pl-32 {
1016 padding-left: 32px !important;
1017 }
1018
1019 .spel-pl-36 {
1020 padding-left: 36px !important;
1021 }
1022
1023 .spel-pl-40 {
1024 padding-left: 40px !important;
1025 }
1026
1027 .spel-pl-44 {
1028 padding-left: 44px !important;
1029 }
1030
1031 .spel-pl-48 {
1032 padding-left: 48px !important;
1033 }
1034
1035 .spel-pl-52 {
1036 padding-left: 52px !important;
1037 }
1038
1039 .spel-pl-56 {
1040 padding-left: 56px !important;
1041 }
1042
1043 .spel-pl-60 {
1044 padding-left: 60px !important;
1045 }
1046
1047 .spel-pl-64 {
1048 padding-left: 64px !important;
1049 }
1050
1051 .spel-pl-68 {
1052 padding-left: 68px !important;
1053 }
1054
1055 .spel-pl-72 {
1056 padding-left: 72px !important;
1057 }
1058
1059 .spel-pl-76 {
1060 padding-left: 76px !important;
1061 }
1062
1063 .spel-pl-80 {
1064 padding-left: 80px !important;
1065 }
1066
1067 .spel-pl-84 {
1068 padding-left: 84px !important;
1069 }
1070
1071 .spel-pl-88 {
1072 padding-left: 88px !important;
1073 }
1074
1075 .spel-pl-92 {
1076 padding-left: 92px !important;
1077 }
1078
1079 .spel-pl-96 {
1080 padding-left: 96px !important;
1081 }
1082
1083 .spel-pl-100 {
1084 padding-left: 100px !important;
1085 }
1086
1087 /* Responsive classes for small screens */
1088 @media (min-width: 576px) {
1089 .spel-sm-m-0 {
1090 margin: 0 !important;
1091 }
1092 .spel-sm-m-4 {
1093 margin: 4px !important;
1094 }
1095 .spel-sm-m-8 {
1096 margin: 8px !important;
1097 }
1098 .spel-sm-m-12 {
1099 margin: 12px !important;
1100 }
1101 .spel-sm-m-16 {
1102 margin: 16px !important;
1103 }
1104 .spel-sm-m-20 {
1105 margin: 20px !important;
1106 }
1107 .spel-sm-m-24 {
1108 margin: 24px !important;
1109 }
1110 .spel-sm-m-28 {
1111 margin: 28px !important;
1112 }
1113 .spel-sm-m-32 {
1114 margin: 32px !important;
1115 }
1116 .spel-sm-m-36 {
1117 margin: 36px !important;
1118 }
1119 .spel-sm-m-40 {
1120 margin: 40px !important;
1121 }
1122 .spel-sm-m-44 {
1123 margin: 44px !important;
1124 }
1125 .spel-sm-m-48 {
1126 margin: 48px !important;
1127 }
1128 .spel-sm-m-52 {
1129 margin: 52px !important;
1130 }
1131 .spel-sm-m-56 {
1132 margin: 56px !important;
1133 }
1134 .spel-sm-m-60 {
1135 margin: 60px !important;
1136 }
1137 .spel-sm-m-64 {
1138 margin: 64px !important;
1139 }
1140 .spel-sm-m-68 {
1141 margin: 68px !important;
1142 }
1143 .spel-sm-m-72 {
1144 margin: 72px !important;
1145 }
1146 .spel-sm-m-76 {
1147 margin: 76px !important;
1148 }
1149 .spel-sm-m-80 {
1150 margin: 80px !important;
1151 }
1152 .spel-sm-m-84 {
1153 margin: 84px !important;
1154 }
1155 .spel-sm-m-88 {
1156 margin: 88px !important;
1157 }
1158 .spel-sm-m-92 {
1159 margin: 92px !important;
1160 }
1161 .spel-sm-m-96 {
1162 margin: 96px !important;
1163 }
1164 .spel-sm-m-100 {
1165 margin: 100px !important;
1166 }
1167 .spel-sm-p-0 {
1168 padding: 0 !important;
1169 }
1170 .spel-sm-p-4 {
1171 padding: 4px !important;
1172 }
1173 .spel-sm-p-8 {
1174 padding: 8px !important;
1175 }
1176 .spel-sm-p-12 {
1177 padding: 12px !important;
1178 }
1179 .spel-sm-p-16 {
1180 padding: 16px !important;
1181 }
1182 .spel-sm-p-20 {
1183 padding: 20px !important;
1184 }
1185 .spel-sm-p-24 {
1186 padding: 24px !important;
1187 }
1188 .spel-sm-p-28 {
1189 padding: 28px !important;
1190 }
1191 .spel-sm-p-32 {
1192 padding: 32px !important;
1193 }
1194 .spel-sm-p-36 {
1195 padding: 36px !important;
1196 }
1197 .spel-sm-p-40 {
1198 padding: 40px !important;
1199 }
1200 .spel-sm-p-44 {
1201 padding: 44px !important;
1202 }
1203 .spel-sm-p-48 {
1204 padding: 48px !important;
1205 }
1206 .spel-sm-p-52 {
1207 padding: 52px !important;
1208 }
1209 .spel-sm-p-56 {
1210 padding: 56px !important;
1211 }
1212 .spel-sm-p-60 {
1213 padding: 60px !important;
1214 }
1215 .spel-sm-p-64 {
1216 padding: 64px !important;
1217 }
1218 .spel-sm-p-68 {
1219 padding: 68px !important;
1220 }
1221 .spel-sm-p-72 {
1222 padding: 72px !important;
1223 }
1224 .spel-sm-p-76 {
1225 padding: 76px !important;
1226 }
1227 .spel-sm-p-80 {
1228 padding: 80px !important;
1229 }
1230 .spel-sm-p-84 {
1231 padding: 84px !important;
1232 }
1233 .spel-sm-p-88 {
1234 padding: 88px !important;
1235 }
1236 .spel-sm-p-92 {
1237 padding: 92px !important;
1238 }
1239 .spel-sm-p-96 {
1240 padding: 96px !important;
1241 }
1242 .spel-sm-p-100 {
1243 padding: 100px !important;
1244 }
1245 .spel-sm-mt-0 {
1246 margin-top: 0 !important;
1247 }
1248 .spel-sm-mt-4 {
1249 margin-top: 4px !important;
1250 }
1251 .spel-sm-mt-8 {
1252 margin-top: 8px !important;
1253 }
1254 .spel-sm-mt-12 {
1255 margin-top: 12px !important;
1256 }
1257 .spel-sm-mt-16 {
1258 margin-top: 16px !important;
1259 }
1260 .spel-sm-mt-20 {
1261 margin-top: 20px !important;
1262 }
1263 .spel-sm-mt-24 {
1264 margin-top: 24px !important;
1265 }
1266 .spel-sm-mt-28 {
1267 margin-top: 28px !important;
1268 }
1269 .spel-sm-mt-32 {
1270 margin-top: 32px !important;
1271 }
1272 .spel-sm-mt-36 {
1273 margin-top: 36px !important;
1274 }
1275 .spel-sm-mt-40 {
1276 margin-top: 40px !important;
1277 }
1278 .spel-sm-mt-44 {
1279 margin-top: 44px !important;
1280 }
1281 .spel-sm-mt-48 {
1282 margin-top: 48px !important;
1283 }
1284 .spel-sm-mt-52 {
1285 margin-top: 52px !important;
1286 }
1287 .spel-sm-mt-56 {
1288 margin-top: 56px !important;
1289 }
1290 .spel-sm-mt-60 {
1291 margin-top: 60px !important;
1292 }
1293 .spel-sm-mt-64 {
1294 margin-top: 64px !important;
1295 }
1296 .spel-sm-mt-68 {
1297 margin-top: 68px !important;
1298 }
1299 .spel-sm-mt-72 {
1300 margin-top: 72px !important;
1301 }
1302 .spel-sm-mt-76 {
1303 margin-top: 76px !important;
1304 }
1305 .spel-sm-mt-80 {
1306 margin-top: 80px !important;
1307 }
1308 .spel-sm-mt-84 {
1309 margin-top: 84px !important;
1310 }
1311 .spel-sm-mt-88 {
1312 margin-top: 88px !important;
1313 }
1314 .spel-sm-mt-92 {
1315 margin-top: 92px !important;
1316 }
1317 .spel-sm-mt-96 {
1318 margin-top: 96px !important;
1319 }
1320 .spel-sm-mt-100 {
1321 margin-top: 100px !important;
1322 }
1323 .spel-sm-mr-0 {
1324 margin-right: 0 !important;
1325 }
1326 .spel-sm-mr-4 {
1327 margin-right: 4px !important;
1328 }
1329 .spel-sm-mr-8 {
1330 margin-right: 8px !important;
1331 }
1332 .spel-sm-mr-12 {
1333 margin-right: 12px !important;
1334 }
1335 .spel-sm-mr-16 {
1336 margin-right: 16px !important;
1337 }
1338 .spel-sm-mr-20 {
1339 margin-right: 20px !important;
1340 }
1341 .spel-sm-mr-24 {
1342 margin-right: 24px !important;
1343 }
1344 .spel-sm-mr-28 {
1345 margin-right: 28px !important;
1346 }
1347 .spel-sm-mr-32 {
1348 margin-right: 32px !important;
1349 }
1350 .spel-sm-mr-36 {
1351 margin-right: 36px !important;
1352 }
1353 .spel-sm-mr-40 {
1354 margin-right: 40px !important;
1355 }
1356 .spel-sm-mr-44 {
1357 margin-right: 44px !important;
1358 }
1359 .spel-sm-mr-48 {
1360 margin-right: 48px !important;
1361 }
1362 .spel-sm-mr-52 {
1363 margin-right: 52px !important;
1364 }
1365 .spel-sm-mr-56 {
1366 margin-right: 56px !important;
1367 }
1368 .spel-sm-mr-60 {
1369 margin-right: 60px !important;
1370 }
1371 .spel-sm-mr-64 {
1372 margin-right: 64px !important;
1373 }
1374 .spel-sm-mr-68 {
1375 margin-right: 68px !important;
1376 }
1377 .spel-sm-mr-72 {
1378 margin-right: 72px !important;
1379 }
1380 .spel-sm-mr-76 {
1381 margin-right: 76px !important;
1382 }
1383 .spel-sm-mr-80 {
1384 margin-right: 80px !important;
1385 }
1386 .spel-sm-mr-84 {
1387 margin-right: 84px !important;
1388 }
1389 .spel-sm-mr-88 {
1390 margin-right: 88px !important;
1391 }
1392 .spel-sm-mr-92 {
1393 margin-right: 92px !important;
1394 }
1395 .spel-sm-mr-96 {
1396 margin-right: 96px !important;
1397 }
1398 .spel-sm-mr-100 {
1399 margin-right: 100px !important;
1400 }
1401 .spel-sm-mb-0 {
1402 margin-bottom: 0 !important;
1403 }
1404 .spel-sm-mb-4 {
1405 margin-bottom: 4px !important;
1406 }
1407 .spel-sm-mb-8 {
1408 margin-bottom: 8px !important;
1409 }
1410 .spel-sm-mb-12 {
1411 margin-bottom: 12px !important;
1412 }
1413 .spel-sm-mb-16 {
1414 margin-bottom: 16px !important;
1415 }
1416 .spel-sm-mb-20 {
1417 margin-bottom: 20px !important;
1418 }
1419 .spel-sm-mb-24 {
1420 margin-bottom: 24px !important;
1421 }
1422 .spel-sm-mb-28 {
1423 margin-bottom: 28px !important;
1424 }
1425 .spel-sm-mb-32 {
1426 margin-bottom: 32px !important;
1427 }
1428 .spel-sm-mb-36 {
1429 margin-bottom: 36px !important;
1430 }
1431 .spel-sm-mb-40 {
1432 margin-bottom: 40px !important;
1433 }
1434 .spel-sm-mb-44 {
1435 margin-bottom: 44px !important;
1436 }
1437 .spel-sm-mb-48 {
1438 margin-bottom: 48px !important;
1439 }
1440 .spel-sm-mb-52 {
1441 margin-bottom: 52px !important;
1442 }
1443 .spel-sm-mb-56 {
1444 margin-bottom: 56px !important;
1445 }
1446 .spel-sm-mb-60 {
1447 margin-bottom: 60px !important;
1448 }
1449 .spel-sm-mb-64 {
1450 margin-bottom: 64px !important;
1451 }
1452 .spel-sm-mb-68 {
1453 margin-bottom: 68px !important;
1454 }
1455 .spel-sm-mb-72 {
1456 margin-bottom: 72px !important;
1457 }
1458 .spel-sm-mb-76 {
1459 margin-bottom: 76px !important;
1460 }
1461 .spel-sm-mb-80 {
1462 margin-bottom: 80px !important;
1463 }
1464 .spel-sm-mb-84 {
1465 margin-bottom: 84px !important;
1466 }
1467 .spel-sm-mb-88 {
1468 margin-bottom: 88px !important;
1469 }
1470 .spel-sm-mb-92 {
1471 margin-bottom: 92px !important;
1472 }
1473 .spel-sm-mb-96 {
1474 margin-bottom: 96px !important;
1475 }
1476 .spel-sm-mb-100 {
1477 margin-bottom: 100px !important;
1478 }
1479 .spel-sm-ml-0 {
1480 margin-left: 0 !important;
1481 }
1482 .spel-sm-ml-4 {
1483 margin-left: 4px !important;
1484 }
1485 .spel-sm-ml-8 {
1486 margin-left: 8px !important;
1487 }
1488 .spel-sm-ml-12 {
1489 margin-left: 12px !important;
1490 }
1491 .spel-sm-ml-16 {
1492 margin-left: 16px !important;
1493 }
1494 .spel-sm-ml-20 {
1495 margin-left: 20px !important;
1496 }
1497 .spel-sm-ml-24 {
1498 margin-left: 24px !important;
1499 }
1500 .spel-sm-ml-28 {
1501 margin-left: 28px !important;
1502 }
1503 .spel-sm-ml-32 {
1504 margin-left: 32px !important;
1505 }
1506 .spel-sm-ml-36 {
1507 margin-left: 36px !important;
1508 }
1509 .spel-sm-ml-40 {
1510 margin-left: 40px !important;
1511 }
1512 .spel-sm-ml-44 {
1513 margin-left: 44px !important;
1514 }
1515 .spel-sm-ml-48 {
1516 margin-left: 48px !important;
1517 }
1518 .spel-sm-ml-52 {
1519 margin-left: 52px !important;
1520 }
1521 .spel-sm-ml-56 {
1522 margin-left: 56px !important;
1523 }
1524 .spel-sm-ml-60 {
1525 margin-left: 60px !important;
1526 }
1527 .spel-sm-ml-64 {
1528 margin-left: 64px !important;
1529 }
1530 .spel-sm-ml-68 {
1531 margin-left: 68px !important;
1532 }
1533 .spel-sm-ml-72 {
1534 margin-left: 72px !important;
1535 }
1536 .spel-sm-ml-76 {
1537 margin-left: 76px !important;
1538 }
1539 .spel-sm-ml-80 {
1540 margin-left: 80px !important;
1541 }
1542 .spel-sm-ml-84 {
1543 margin-left: 84px !important;
1544 }
1545 .spel-sm-ml-88 {
1546 margin-left: 88px !important;
1547 }
1548 .spel-sm-ml-92 {
1549 margin-left: 92px !important;
1550 }
1551 .spel-sm-ml-96 {
1552 margin-left: 96px !important;
1553 }
1554 .spel-sm-ml-100 {
1555 margin-left: 100px !important;
1556 }
1557 }
1558 /* Responsive classes for medium screens */
1559 @media (min-width: 768px) {
1560 .spel-md-m-0 {
1561 margin: 0 !important;
1562 }
1563 .spel-md-m-4 {
1564 margin: 4px !important;
1565 }
1566 .spel-md-m-8 {
1567 margin: 8px !important;
1568 }
1569 .spel-md-m-12 {
1570 margin: 12px !important;
1571 }
1572 .spel-md-m-16 {
1573 margin: 16px !important;
1574 }
1575 .spel-md-m-20 {
1576 margin: 20px !important;
1577 }
1578 .spel-md-m-24 {
1579 margin: 24px !important;
1580 }
1581 .spel-md-m-28 {
1582 margin: 28px !important;
1583 }
1584 .spel-md-m-32 {
1585 margin: 32px !important;
1586 }
1587 .spel-md-m-36 {
1588 margin: 36px !important;
1589 }
1590 .spel-md-m-40 {
1591 margin: 40px !important;
1592 }
1593 .spel-md-m-44 {
1594 margin: 44px !important;
1595 }
1596 .spel-md-m-48 {
1597 margin: 48px !important;
1598 }
1599 .spel-md-m-52 {
1600 margin: 52px !important;
1601 }
1602 .spel-md-m-56 {
1603 margin: 56px !important;
1604 }
1605 .spel-md-m-60 {
1606 margin: 60px !important;
1607 }
1608 .spel-md-m-64 {
1609 margin: 64px !important;
1610 }
1611 .spel-md-m-68 {
1612 margin: 68px !important;
1613 }
1614 .spel-md-m-72 {
1615 margin: 72px !important;
1616 }
1617 .spel-md-m-76 {
1618 margin: 76px !important;
1619 }
1620 .spel-md-m-80 {
1621 margin: 80px !important;
1622 }
1623 .spel-md-m-84 {
1624 margin: 84px !important;
1625 }
1626 .spel-md-m-88 {
1627 margin: 88px !important;
1628 }
1629 .spel-md-m-92 {
1630 margin: 92px !important;
1631 }
1632 .spel-md-m-96 {
1633 margin: 96px !important;
1634 }
1635 .spel-md-m-100 {
1636 margin: 100px !important;
1637 }
1638 .spel-md-p-0 {
1639 padding: 0 !important;
1640 }
1641 .spel-md-p-4 {
1642 padding: 4px !important;
1643 }
1644 .spel-md-p-8 {
1645 padding: 8px !important;
1646 }
1647 .spel-md-p-12 {
1648 padding: 12px !important;
1649 }
1650 .spel-md-p-16 {
1651 padding: 16px !important;
1652 }
1653 .spel-md-p-20 {
1654 padding: 20px !important;
1655 }
1656 .spel-md-p-24 {
1657 padding: 24px !important;
1658 }
1659 .spel-md-p-28 {
1660 padding: 28px !important;
1661 }
1662 .spel-md-p-32 {
1663 padding: 32px !important;
1664 }
1665 .spel-md-p-36 {
1666 padding: 36px !important;
1667 }
1668 .spel-md-p-40 {
1669 padding: 40px !important;
1670 }
1671 .spel-md-p-44 {
1672 padding: 44px !important;
1673 }
1674 .spel-md-p-48 {
1675 padding: 48px !important;
1676 }
1677 .spel-md-p-52 {
1678 padding: 52px !important;
1679 }
1680 .spel-md-p-56 {
1681 padding: 56px !important;
1682 }
1683 .spel-md-p-60 {
1684 padding: 60px !important;
1685 }
1686 .spel-md-p-64 {
1687 padding: 64px !important;
1688 }
1689 .spel-md-p-68 {
1690 padding: 68px !important;
1691 }
1692 .spel-md-p-72 {
1693 padding: 72px !important;
1694 }
1695 .spel-md-p-76 {
1696 padding: 76px !important;
1697 }
1698 .spel-md-p-80 {
1699 padding: 80px !important;
1700 }
1701 .spel-md-p-84 {
1702 padding: 84px !important;
1703 }
1704 .spel-md-p-88 {
1705 padding: 88px !important;
1706 }
1707 .spel-md-p-92 {
1708 padding: 92px !important;
1709 }
1710 .spel-md-p-96 {
1711 padding: 96px !important;
1712 }
1713 .spel-md-p-100 {
1714 padding: 100px !important;
1715 }
1716 .spel-md-mt-0 {
1717 margin-top: 0 !important;
1718 }
1719 .spel-md-mt-4 {
1720 margin-top: 4px !important;
1721 }
1722 .spel-md-mt-8 {
1723 margin-top: 8px !important;
1724 }
1725 .spel-md-mt-12 {
1726 margin-top: 12px !important;
1727 }
1728 .spel-md-mt-16 {
1729 margin-top: 16px !important;
1730 }
1731 .spel-md-mt-20 {
1732 margin-top: 20px !important;
1733 }
1734 .spel-md-mt-24 {
1735 margin-top: 24px !important;
1736 }
1737 .spel-md-mt-28 {
1738 margin-top: 28px !important;
1739 }
1740 .spel-md-mt-32 {
1741 margin-top: 32px !important;
1742 }
1743 .spel-md-mt-36 {
1744 margin-top: 36px !important;
1745 }
1746 .spel-md-mt-40 {
1747 margin-top: 40px !important;
1748 }
1749 .spel-md-mt-44 {
1750 margin-top: 44px !important;
1751 }
1752 .spel-md-mt-48 {
1753 margin-top: 48px !important;
1754 }
1755 .spel-md-mt-52 {
1756 margin-top: 52px !important;
1757 }
1758 .spel-md-mt-56 {
1759 margin-top: 56px !important;
1760 }
1761 .spel-md-mt-60 {
1762 margin-top: 60px !important;
1763 }
1764 .spel-md-mt-64 {
1765 margin-top: 64px !important;
1766 }
1767 .spel-md-mt-68 {
1768 margin-top: 68px !important;
1769 }
1770 .spel-md-mt-72 {
1771 margin-top: 72px !important;
1772 }
1773 .spel-md-mt-76 {
1774 margin-top: 76px !important;
1775 }
1776 .spel-md-mt-80 {
1777 margin-top: 80px !important;
1778 }
1779 .spel-md-mt-84 {
1780 margin-top: 84px !important;
1781 }
1782 .spel-md-mt-88 {
1783 margin-top: 88px !important;
1784 }
1785 .spel-md-mt-92 {
1786 margin-top: 92px !important;
1787 }
1788 .spel-md-mt-96 {
1789 margin-top: 96px !important;
1790 }
1791 .spel-md-mt-100 {
1792 margin-top: 100px !important;
1793 }
1794 .spel-md-mr-0 {
1795 margin-right: 0 !important;
1796 }
1797 .spel-md-mr-4 {
1798 margin-right: 4px !important;
1799 }
1800 .spel-md-mr-8 {
1801 margin-right: 8px !important;
1802 }
1803 .spel-md-mr-12 {
1804 margin-right: 12px !important;
1805 }
1806 .spel-md-mr-16 {
1807 margin-right: 16px !important;
1808 }
1809 .spel-md-mr-20 {
1810 margin-right: 20px !important;
1811 }
1812 .spel-md-mr-24 {
1813 margin-right: 24px !important;
1814 }
1815 .spel-md-mr-28 {
1816 margin-right: 28px !important;
1817 }
1818 .spel-md-mr-32 {
1819 margin-right: 32px !important;
1820 }
1821 .spel-md-mr-36 {
1822 margin-right: 36px !important;
1823 }
1824 .spel-md-mr-40 {
1825 margin-right: 40px !important;
1826 }
1827 .spel-md-mr-44 {
1828 margin-right: 44px !important;
1829 }
1830 .spel-md-mr-48 {
1831 margin-right: 48px !important;
1832 }
1833 .spel-md-mr-52 {
1834 margin-right: 52px !important;
1835 }
1836 .spel-md-mr-56 {
1837 margin-right: 56px !important;
1838 }
1839 .spel-md-mr-60 {
1840 margin-right: 60px !important;
1841 }
1842 .spel-md-mr-64 {
1843 margin-right: 64px !important;
1844 }
1845 .spel-md-mr-68 {
1846 margin-right: 68px !important;
1847 }
1848 .spel-md-mr-72 {
1849 margin-right: 72px !important;
1850 }
1851 .spel-md-mr-76 {
1852 margin-right: 76px !important;
1853 }
1854 .spel-md-mr-80 {
1855 margin-right: 80px !important;
1856 }
1857 .spel-md-mr-84 {
1858 margin-right: 84px !important;
1859 }
1860 .spel-md-mr-88 {
1861 margin-right: 88px !important;
1862 }
1863 .spel-md-mr-92 {
1864 margin-right: 92px !important;
1865 }
1866 .spel-md-mr-96 {
1867 margin-right: 96px !important;
1868 }
1869 .spel-md-mr-100 {
1870 margin-right: 100px !important;
1871 }
1872 .spel-md-mb-0 {
1873 margin-bottom: 0 !important;
1874 }
1875 .spel-md-mb-4 {
1876 margin-bottom: 4px !important;
1877 }
1878 .spel-md-mb-8 {
1879 margin-bottom: 8px !important;
1880 }
1881 .spel-md-mb-12 {
1882 margin-bottom: 12px !important;
1883 }
1884 .spel-md-mb-16 {
1885 margin-bottom: 16px !important;
1886 }
1887 .spel-md-mb-20 {
1888 margin-bottom: 20px !important;
1889 }
1890 .spel-md-mb-24 {
1891 margin-bottom: 24px !important;
1892 }
1893 .spel-md-mb-28 {
1894 margin-bottom: 28px !important;
1895 }
1896 .spel-md-mb-32 {
1897 margin-bottom: 32px !important;
1898 }
1899 .spel-md-mb-36 {
1900 margin-bottom: 36px !important;
1901 }
1902 .spel-md-mb-40 {
1903 margin-bottom: 40px !important;
1904 }
1905 .spel-md-mb-44 {
1906 margin-bottom: 44px !important;
1907 }
1908 .spel-md-mb-48 {
1909 margin-bottom: 48px !important;
1910 }
1911 .spel-md-mb-52 {
1912 margin-bottom: 52px !important;
1913 }
1914 .spel-md-mb-56 {
1915 margin-bottom: 56px !important;
1916 }
1917 .spel-md-mb-60 {
1918 margin-bottom: 60px !important;
1919 }
1920 .spel-md-mb-64 {
1921 margin-bottom: 64px !important;
1922 }
1923 .spel-md-mb-68 {
1924 margin-bottom: 68px !important;
1925 }
1926 .spel-md-mb-72 {
1927 margin-bottom: 72px !important;
1928 }
1929 .spel-md-mb-76 {
1930 margin-bottom: 76px !important;
1931 }
1932 .spel-md-mb-80 {
1933 margin-bottom: 80px !important;
1934 }
1935 .spel-md-mb-84 {
1936 margin-bottom: 84px !important;
1937 }
1938 .spel-md-mb-88 {
1939 margin-bottom: 88px !important;
1940 }
1941 .spel-md-mb-92 {
1942 margin-bottom: 92px !important;
1943 }
1944 .spel-md-mb-96 {
1945 margin-bottom: 96px !important;
1946 }
1947 .spel-md-mb-100 {
1948 margin-bottom: 100px !important;
1949 }
1950 .spel-md-ml-0 {
1951 margin-left: 0 !important;
1952 }
1953 .spel-md-ml-4 {
1954 margin-left: 4px !important;
1955 }
1956 .spel-md-ml-8 {
1957 margin-left: 8px !important;
1958 }
1959 .spel-md-ml-12 {
1960 margin-left: 12px !important;
1961 }
1962 .spel-md-ml-16 {
1963 margin-left: 16px !important;
1964 }
1965 .spel-md-ml-20 {
1966 margin-left: 20px !important;
1967 }
1968 .spel-md-ml-24 {
1969 margin-left: 24px !important;
1970 }
1971 .spel-md-ml-28 {
1972 margin-left: 28px !important;
1973 }
1974 .spel-md-ml-32 {
1975 margin-left: 32px !important;
1976 }
1977 .spel-md-ml-36 {
1978 margin-left: 36px !important;
1979 }
1980 .spel-md-ml-40 {
1981 margin-left: 40px !important;
1982 }
1983 .spel-md-ml-44 {
1984 margin-left: 44px !important;
1985 }
1986 .spel-md-ml-48 {
1987 margin-left: 48px !important;
1988 }
1989 .spel-md-ml-52 {
1990 margin-left: 52px !important;
1991 }
1992 .spel-md-ml-56 {
1993 margin-left: 56px !important;
1994 }
1995 .spel-md-ml-60 {
1996 margin-left: 60px !important;
1997 }
1998 .spel-md-ml-64 {
1999 margin-left: 64px !important;
2000 }
2001 .spel-md-ml-68 {
2002 margin-left: 68px !important;
2003 }
2004 .spel-md-ml-72 {
2005 margin-left: 72px !important;
2006 }
2007 .spel-md-ml-76 {
2008 margin-left: 76px !important;
2009 }
2010 .spel-md-ml-80 {
2011 margin-left: 80px !important;
2012 }
2013 .spel-md-ml-84 {
2014 margin-left: 84px !important;
2015 }
2016 .spel-md-ml-88 {
2017 margin-left: 88px !important;
2018 }
2019 .spel-md-ml-92 {
2020 margin-left: 92px !important;
2021 }
2022 .spel-md-ml-96 {
2023 margin-left: 96px !important;
2024 }
2025 .spel-md-ml-100 {
2026 margin-left: 100px !important;
2027 }
2028 }
2029 /* Responsive classes for large screens */
2030 @media (min-width: 992px) {
2031 .spel-lg-m-0 {
2032 margin: 0 !important;
2033 }
2034 .spel-lg-m-4 {
2035 margin: 4px !important;
2036 }
2037 .spel-lg-m-8 {
2038 margin: 8px !important;
2039 }
2040 .spel-lg-m-12 {
2041 margin: 12px !important;
2042 }
2043 .spel-lg-m-16 {
2044 margin: 16px !important;
2045 }
2046 .spel-lg-m-20 {
2047 margin: 20px !important;
2048 }
2049 .spel-lg-m-24 {
2050 margin: 24px !important;
2051 }
2052 .spel-lg-m-28 {
2053 margin: 28px !important;
2054 }
2055 .spel-lg-m-32 {
2056 margin: 32px !important;
2057 }
2058 .spel-lg-m-36 {
2059 margin: 36px !important;
2060 }
2061 .spel-lg-m-40 {
2062 margin: 40px !important;
2063 }
2064 .spel-lg-m-44 {
2065 margin: 44px !important;
2066 }
2067 .spel-lg-m-48 {
2068 margin: 48px !important;
2069 }
2070 .spel-lg-m-52 {
2071 margin: 52px !important;
2072 }
2073 .spel-lg-m-56 {
2074 margin: 56px !important;
2075 }
2076 .spel-lg-m-60 {
2077 margin: 60px !important;
2078 }
2079 .spel-lg-m-64 {
2080 margin: 64px !important;
2081 }
2082 .spel-lg-m-68 {
2083 margin: 68px !important;
2084 }
2085 .spel-lg-m-72 {
2086 margin: 72px !important;
2087 }
2088 .spel-lg-m-76 {
2089 margin: 76px !important;
2090 }
2091 .spel-lg-m-80 {
2092 margin: 80px !important;
2093 }
2094 .spel-lg-m-84 {
2095 margin: 84px !important;
2096 }
2097 .spel-lg-m-88 {
2098 margin: 88px !important;
2099 }
2100 .spel-lg-m-92 {
2101 margin: 92px !important;
2102 }
2103 .spel-lg-m-96 {
2104 margin: 96px !important;
2105 }
2106 .spel-lg-m-100 {
2107 margin: 100px !important;
2108 }
2109 .spel-lg-p-0 {
2110 padding: 0 !important;
2111 }
2112 .spel-lg-p-4 {
2113 padding: 4px !important;
2114 }
2115 .spel-lg-p-8 {
2116 padding: 8px !important;
2117 }
2118 .spel-lg-p-12 {
2119 padding: 12px !important;
2120 }
2121 .spel-lg-p-16 {
2122 padding: 16px !important;
2123 }
2124 .spel-lg-p-20 {
2125 padding: 20px !important;
2126 }
2127 .spel-lg-p-24 {
2128 padding: 24px !important;
2129 }
2130 .spel-lg-p-28 {
2131 padding: 28px !important;
2132 }
2133 .spel-lg-p-32 {
2134 padding: 32px !important;
2135 }
2136 .spel-lg-p-36 {
2137 padding: 36px !important;
2138 }
2139 .spel-lg-p-40 {
2140 padding: 40px !important;
2141 }
2142 .spel-lg-p-44 {
2143 padding: 44px !important;
2144 }
2145 .spel-lg-p-48 {
2146 padding: 48px !important;
2147 }
2148 .spel-lg-p-52 {
2149 padding: 52px !important;
2150 }
2151 .spel-lg-p-56 {
2152 padding: 56px !important;
2153 }
2154 .spel-lg-p-60 {
2155 padding: 60px !important;
2156 }
2157 .spel-lg-p-64 {
2158 padding: 64px !important;
2159 }
2160 .spel-lg-p-68 {
2161 padding: 68px !important;
2162 }
2163 .spel-lg-p-72 {
2164 padding: 72px !important;
2165 }
2166 .spel-lg-p-76 {
2167 padding: 76px !important;
2168 }
2169 .spel-lg-p-80 {
2170 padding: 80px !important;
2171 }
2172 .spel-lg-p-84 {
2173 padding: 84px !important;
2174 }
2175 .spel-lg-p-88 {
2176 padding: 88px !important;
2177 }
2178 .spel-lg-p-92 {
2179 padding: 92px !important;
2180 }
2181 .spel-lg-p-96 {
2182 padding: 96px !important;
2183 }
2184 .spel-lg-p-100 {
2185 padding: 100px !important;
2186 }
2187 .spel-lg-mt-0 {
2188 margin-top: 0 !important;
2189 }
2190 .spel-lg-mt-4 {
2191 margin-top: 4px !important;
2192 }
2193 .spel-lg-mt-8 {
2194 margin-top: 8px !important;
2195 }
2196 .spel-lg-mt-12 {
2197 margin-top: 12px !important;
2198 }
2199 .spel-lg-mt-16 {
2200 margin-top: 16px !important;
2201 }
2202 .spel-lg-mt-20 {
2203 margin-top: 20px !important;
2204 }
2205 .spel-lg-mt-24 {
2206 margin-top: 24px !important;
2207 }
2208 .spel-lg-mt-28 {
2209 margin-top: 28px !important;
2210 }
2211 .spel-lg-mt-32 {
2212 margin-top: 32px !important;
2213 }
2214 .spel-lg-mt-36 {
2215 margin-top: 36px !important;
2216 }
2217 .spel-lg-mt-40 {
2218 margin-top: 40px !important;
2219 }
2220 .spel-lg-mt-44 {
2221 margin-top: 44px !important;
2222 }
2223 .spel-lg-mt-48 {
2224 margin-top: 48px !important;
2225 }
2226 .spel-lg-mt-52 {
2227 margin-top: 52px !important;
2228 }
2229 .spel-lg-mt-56 {
2230 margin-top: 56px !important;
2231 }
2232 .spel-lg-mt-60 {
2233 margin-top: 60px !important;
2234 }
2235 .spel-lg-mt-64 {
2236 margin-top: 64px !important;
2237 }
2238 .spel-lg-mt-68 {
2239 margin-top: 68px !important;
2240 }
2241 .spel-lg-mt-72 {
2242 margin-top: 72px !important;
2243 }
2244 .spel-lg-mt-76 {
2245 margin-top: 76px !important;
2246 }
2247 .spel-lg-mt-80 {
2248 margin-top: 80px !important;
2249 }
2250 .spel-lg-mt-84 {
2251 margin-top: 84px !important;
2252 }
2253 .spel-lg-mt-88 {
2254 margin-top: 88px !important;
2255 }
2256 .spel-lg-mt-92 {
2257 margin-top: 92px !important;
2258 }
2259 .spel-lg-mt-96 {
2260 margin-top: 96px !important;
2261 }
2262 .spel-lg-mt-100 {
2263 margin-top: 100px !important;
2264 }
2265 .spel-lg-mr-0 {
2266 margin-right: 0 !important;
2267 }
2268 .spel-lg-mr-4 {
2269 margin-right: 4px !important;
2270 }
2271 .spel-lg-mr-8 {
2272 margin-right: 8px !important;
2273 }
2274 .spel-lg-mr-12 {
2275 margin-right: 12px !important;
2276 }
2277 .spel-lg-mr-16 {
2278 margin-right: 16px !important;
2279 }
2280 .spel-lg-mr-20 {
2281 margin-right: 20px !important;
2282 }
2283 .spel-lg-mr-24 {
2284 margin-right: 24px !important;
2285 }
2286 .spel-lg-mr-28 {
2287 margin-right: 28px !important;
2288 }
2289 .spel-lg-mr-32 {
2290 margin-right: 32px !important;
2291 }
2292 .spel-lg-mr-36 {
2293 margin-right: 36px !important;
2294 }
2295 .spel-lg-mr-40 {
2296 margin-right: 40px !important;
2297 }
2298 .spel-lg-mr-44 {
2299 margin-right: 44px !important;
2300 }
2301 .spel-lg-mr-48 {
2302 margin-right: 48px !important;
2303 }
2304 .spel-lg-mr-52 {
2305 margin-right: 52px !important;
2306 }
2307 .spel-lg-mr-56 {
2308 margin-right: 56px !important;
2309 }
2310 .spel-lg-mr-60 {
2311 margin-right: 60px !important;
2312 }
2313 .spel-lg-mr-64 {
2314 margin-right: 64px !important;
2315 }
2316 .spel-lg-mr-68 {
2317 margin-right: 68px !important;
2318 }
2319 .spel-lg-mr-72 {
2320 margin-right: 72px !important;
2321 }
2322 .spel-lg-mr-76 {
2323 margin-right: 76px !important;
2324 }
2325 .spel-lg-mr-80 {
2326 margin-right: 80px !important;
2327 }
2328 .spel-lg-mr-84 {
2329 margin-right: 84px !important;
2330 }
2331 .spel-lg-mr-88 {
2332 margin-right: 88px !important;
2333 }
2334 .spel-lg-mr-92 {
2335 margin-right: 92px !important;
2336 }
2337 .spel-lg-mr-96 {
2338 margin-right: 96px !important;
2339 }
2340 .spel-lg-mr-100 {
2341 margin-right: 100px !important;
2342 }
2343 .spel-lg-mb-0 {
2344 margin-bottom: 0 !important;
2345 }
2346 .spel-lg-mb-4 {
2347 margin-bottom: 4px !important;
2348 }
2349 .spel-lg-mb-8 {
2350 margin-bottom: 8px !important;
2351 }
2352 .spel-lg-mb-12 {
2353 margin-bottom: 12px !important;
2354 }
2355 .spel-lg-mb-16 {
2356 margin-bottom: 16px !important;
2357 }
2358 .spel-lg-mb-20 {
2359 margin-bottom: 20px !important;
2360 }
2361 .spel-lg-mb-24 {
2362 margin-bottom: 24px !important;
2363 }
2364 .spel-lg-mb-28 {
2365 margin-bottom: 28px !important;
2366 }
2367 .spel-lg-mb-32 {
2368 margin-bottom: 32px !important;
2369 }
2370 .spel-lg-mb-36 {
2371 margin-bottom: 36px !important;
2372 }
2373 .spel-lg-mb-40 {
2374 margin-bottom: 40px !important;
2375 }
2376 .spel-lg-mb-44 {
2377 margin-bottom: 44px !important;
2378 }
2379 .spel-lg-mb-48 {
2380 margin-bottom: 48px !important;
2381 }
2382 .spel-lg-mb-52 {
2383 margin-bottom: 52px !important;
2384 }
2385 .spel-lg-mb-56 {
2386 margin-bottom: 56px !important;
2387 }
2388 .spel-lg-mb-60 {
2389 margin-bottom: 60px !important;
2390 }
2391 .spel-lg-mb-64 {
2392 margin-bottom: 64px !important;
2393 }
2394 .spel-lg-mb-68 {
2395 margin-bottom: 68px !important;
2396 }
2397 .spel-lg-mb-72 {
2398 margin-bottom: 72px !important;
2399 }
2400 .spel-lg-mb-76 {
2401 margin-bottom: 76px !important;
2402 }
2403 .spel-lg-mb-80 {
2404 margin-bottom: 80px !important;
2405 }
2406 .spel-lg-mb-84 {
2407 margin-bottom: 84px !important;
2408 }
2409 .spel-lg-mb-88 {
2410 margin-bottom: 88px !important;
2411 }
2412 .spel-lg-mb-92 {
2413 margin-bottom: 92px !important;
2414 }
2415 .spel-lg-mb-96 {
2416 margin-bottom: 96px !important;
2417 }
2418 .spel-lg-mb-100 {
2419 margin-bottom: 100px !important;
2420 }
2421 .spel-lg-ml-0 {
2422 margin-left: 0 !important;
2423 }
2424 .spel-lg-ml-4 {
2425 margin-left: 4px !important;
2426 }
2427 .spel-lg-ml-8 {
2428 margin-left: 8px !important;
2429 }
2430 .spel-lg-ml-12 {
2431 margin-left: 12px !important;
2432 }
2433 .spel-lg-ml-16 {
2434 margin-left: 16px !important;
2435 }
2436 .spel-lg-ml-20 {
2437 margin-left: 20px !important;
2438 }
2439 .spel-lg-ml-24 {
2440 margin-left: 24px !important;
2441 }
2442 .spel-lg-ml-28 {
2443 margin-left: 28px !important;
2444 }
2445 .spel-lg-ml-32 {
2446 margin-left: 32px !important;
2447 }
2448 .spel-lg-ml-36 {
2449 margin-left: 36px !important;
2450 }
2451 .spel-lg-ml-40 {
2452 margin-left: 40px !important;
2453 }
2454 .spel-lg-ml-44 {
2455 margin-left: 44px !important;
2456 }
2457 .spel-lg-ml-48 {
2458 margin-left: 48px !important;
2459 }
2460 .spel-lg-ml-52 {
2461 margin-left: 52px !important;
2462 }
2463 .spel-lg-ml-56 {
2464 margin-left: 56px !important;
2465 }
2466 .spel-lg-ml-60 {
2467 margin-left: 60px !important;
2468 }
2469 .spel-lg-ml-64 {
2470 margin-left: 64px !important;
2471 }
2472 .spel-lg-ml-68 {
2473 margin-left: 68px !important;
2474 }
2475 .spel-lg-ml-72 {
2476 margin-left: 72px !important;
2477 }
2478 .spel-lg-ml-76 {
2479 margin-left: 76px !important;
2480 }
2481 .spel-lg-ml-80 {
2482 margin-left: 80px !important;
2483 }
2484 .spel-lg-ml-84 {
2485 margin-left: 84px !important;
2486 }
2487 .spel-lg-ml-88 {
2488 margin-left: 88px !important;
2489 }
2490 .spel-lg-ml-92 {
2491 margin-left: 92px !important;
2492 }
2493 .spel-lg-ml-96 {
2494 margin-left: 96px !important;
2495 }
2496 .spel-lg-ml-100 {
2497 margin-left: 100px !important;
2498 }
2499 }
2500 /* Responsive classes for extra-large screens */
2501 @media (min-width: 1200px) {
2502 .spel-xl-m-0 {
2503 margin: 0 !important;
2504 }
2505 .spel-xl-m-4 {
2506 margin: 4px !important;
2507 }
2508 .spel-xl-m-8 {
2509 margin: 8px !important;
2510 }
2511 .spel-xl-m-12 {
2512 margin: 12px !important;
2513 }
2514 .spel-xl-m-16 {
2515 margin: 16px !important;
2516 }
2517 .spel-xl-m-20 {
2518 margin: 20px !important;
2519 }
2520 .spel-xl-m-24 {
2521 margin: 24px !important;
2522 }
2523 .spel-xl-m-28 {
2524 margin: 28px !important;
2525 }
2526 .spel-xl-m-32 {
2527 margin: 32px !important;
2528 }
2529 .spel-xl-m-36 {
2530 margin: 36px !important;
2531 }
2532 .spel-xl-m-40 {
2533 margin: 40px !important;
2534 }
2535 .spel-xl-m-44 {
2536 margin: 44px !important;
2537 }
2538 .spel-xl-m-48 {
2539 margin: 48px !important;
2540 }
2541 .spel-xl-m-52 {
2542 margin: 52px !important;
2543 }
2544 .spel-xl-m-56 {
2545 margin: 56px !important;
2546 }
2547 .spel-xl-m-60 {
2548 margin: 60px !important;
2549 }
2550 .spel-xl-m-64 {
2551 margin: 64px !important;
2552 }
2553 .spel-xl-m-68 {
2554 margin: 68px !important;
2555 }
2556 .spel-xl-m-72 {
2557 margin: 72px !important;
2558 }
2559 .spel-xl-m-76 {
2560 margin: 76px !important;
2561 }
2562 .spel-xl-m-80 {
2563 margin: 80px !important;
2564 }
2565 .spel-xl-m-84 {
2566 margin: 84px !important;
2567 }
2568 .spel-xl-m-88 {
2569 margin: 88px !important;
2570 }
2571 .spel-xl-m-92 {
2572 margin: 92px !important;
2573 }
2574 .spel-xl-m-96 {
2575 margin: 96px !important;
2576 }
2577 .spel-xl-m-100 {
2578 margin: 100px !important;
2579 }
2580 .spel-xl-p-0 {
2581 padding: 0 !important;
2582 }
2583 .spel-xl-p-4 {
2584 padding: 4px !important;
2585 }
2586 .spel-xl-p-8 {
2587 padding: 8px !important;
2588 }
2589 .spel-xl-p-12 {
2590 padding: 12px !important;
2591 }
2592 .spel-xl-p-16 {
2593 padding: 16px !important;
2594 }
2595 .spel-xl-p-20 {
2596 padding: 20px !important;
2597 }
2598 .spel-xl-p-24 {
2599 padding: 24px !important;
2600 }
2601 .spel-xl-p-28 {
2602 padding: 28px !important;
2603 }
2604 .spel-xl-p-32 {
2605 padding: 32px !important;
2606 }
2607 .spel-xl-p-36 {
2608 padding: 36px !important;
2609 }
2610 .spel-xl-p-40 {
2611 padding: 40px !important;
2612 }
2613 .spel-xl-p-44 {
2614 padding: 44px !important;
2615 }
2616 .spel-xl-p-48 {
2617 padding: 48px !important;
2618 }
2619 .spel-xl-p-52 {
2620 padding: 52px !important;
2621 }
2622 .spel-xl-p-56 {
2623 padding: 56px !important;
2624 }
2625 .spel-xl-p-60 {
2626 padding: 60px !important;
2627 }
2628 .spel-xl-p-64 {
2629 padding: 64px !important;
2630 }
2631 .spel-xl-p-68 {
2632 padding: 68px !important;
2633 }
2634 .spel-xl-p-72 {
2635 padding: 72px !important;
2636 }
2637 .spel-xl-p-76 {
2638 padding: 76px !important;
2639 }
2640 .spel-xl-p-80 {
2641 padding: 80px !important;
2642 }
2643 .spel-xl-p-84 {
2644 padding: 84px !important;
2645 }
2646 .spel-xl-p-88 {
2647 padding: 88px !important;
2648 }
2649 .spel-xl-p-92 {
2650 padding: 92px !important;
2651 }
2652 .spel-xl-p-96 {
2653 padding: 96px !important;
2654 }
2655 .spel-xl-p-100 {
2656 padding: 100px !important;
2657 }
2658 .spel-xl-mt-0 {
2659 margin-top: 0 !important;
2660 }
2661 .spel-xl-mt-4 {
2662 margin-top: 4px !important;
2663 }
2664 .spel-xl-mt-8 {
2665 margin-top: 8px !important;
2666 }
2667 .spel-xl-mt-12 {
2668 margin-top: 12px !important;
2669 }
2670 .spel-xl-mt-16 {
2671 margin-top: 16px !important;
2672 }
2673 .spel-xl-mt-20 {
2674 margin-top: 20px !important;
2675 }
2676 .spel-xl-mt-24 {
2677 margin-top: 24px !important;
2678 }
2679 .spel-xl-mt-28 {
2680 margin-top: 28px !important;
2681 }
2682 .spel-xl-mt-32 {
2683 margin-top: 32px !important;
2684 }
2685 .spel-xl-mt-36 {
2686 margin-top: 36px !important;
2687 }
2688 .spel-xl-mt-40 {
2689 margin-top: 40px !important;
2690 }
2691 .spel-xl-mt-44 {
2692 margin-top: 44px !important;
2693 }
2694 .spel-xl-mt-48 {
2695 margin-top: 48px !important;
2696 }
2697 .spel-xl-mt-52 {
2698 margin-top: 52px !important;
2699 }
2700 .spel-xl-mt-56 {
2701 margin-top: 56px !important;
2702 }
2703 .spel-xl-mt-60 {
2704 margin-top: 60px !important;
2705 }
2706 .spel-xl-mt-64 {
2707 margin-top: 64px !important;
2708 }
2709 .spel-xl-mt-68 {
2710 margin-top: 68px !important;
2711 }
2712 .spel-xl-mt-72 {
2713 margin-top: 72px !important;
2714 }
2715 .spel-xl-mt-76 {
2716 margin-top: 76px !important;
2717 }
2718 .spel-xl-mt-80 {
2719 margin-top: 80px !important;
2720 }
2721 .spel-xl-mt-84 {
2722 margin-top: 84px !important;
2723 }
2724 .spel-xl-mt-88 {
2725 margin-top: 88px !important;
2726 }
2727 .spel-xl-mt-92 {
2728 margin-top: 92px !important;
2729 }
2730 .spel-xl-mt-96 {
2731 margin-top: 96px !important;
2732 }
2733 .spel-xl-mt-100 {
2734 margin-top: 100px !important;
2735 }
2736 .spel-xl-mr-0 {
2737 margin-right: 0 !important;
2738 }
2739 .spel-xl-mr-4 {
2740 margin-right: 4px !important;
2741 }
2742 .spel-xl-mr-8 {
2743 margin-right: 8px !important;
2744 }
2745 .spel-xl-mr-12 {
2746 margin-right: 12px !important;
2747 }
2748 .spel-xl-mr-16 {
2749 margin-right: 16px !important;
2750 }
2751 .spel-xl-mr-20 {
2752 margin-right: 20px !important;
2753 }
2754 .spel-xl-mr-24 {
2755 margin-right: 24px !important;
2756 }
2757 .spel-xl-mr-28 {
2758 margin-right: 28px !important;
2759 }
2760 .spel-xl-mr-32 {
2761 margin-right: 32px !important;
2762 }
2763 .spel-xl-mr-36 {
2764 margin-right: 36px !important;
2765 }
2766 .spel-xl-mr-40 {
2767 margin-right: 40px !important;
2768 }
2769 .spel-xl-mr-44 {
2770 margin-right: 44px !important;
2771 }
2772 .spel-xl-mr-48 {
2773 margin-right: 48px !important;
2774 }
2775 .spel-xl-mr-52 {
2776 margin-right: 52px !important;
2777 }
2778 .spel-xl-mr-56 {
2779 margin-right: 56px !important;
2780 }
2781 .spel-xl-mr-60 {
2782 margin-right: 60px !important;
2783 }
2784 .spel-xl-mr-64 {
2785 margin-right: 64px !important;
2786 }
2787 .spel-xl-mr-68 {
2788 margin-right: 68px !important;
2789 }
2790 .spel-xl-mr-72 {
2791 margin-right: 72px !important;
2792 }
2793 .spel-xl-mr-76 {
2794 margin-right: 76px !important;
2795 }
2796 .spel-xl-mr-80 {
2797 margin-right: 80px !important;
2798 }
2799 .spel-xl-mr-84 {
2800 margin-right: 84px !important;
2801 }
2802 .spel-xl-mr-88 {
2803 margin-right: 88px !important;
2804 }
2805 .spel-xl-mr-92 {
2806 margin-right: 92px !important;
2807 }
2808 .spel-xl-mr-96 {
2809 margin-right: 96px !important;
2810 }
2811 .spel-xl-mr-100 {
2812 margin-right: 100px !important;
2813 }
2814 .spel-xl-mb-0 {
2815 margin-bottom: 0 !important;
2816 }
2817 .spel-xl-mb-4 {
2818 margin-bottom: 4px !important;
2819 }
2820 .spel-xl-mb-8 {
2821 margin-bottom: 8px !important;
2822 }
2823 .spel-xl-mb-12 {
2824 margin-bottom: 12px !important;
2825 }
2826 .spel-xl-mb-16 {
2827 margin-bottom: 16px !important;
2828 }
2829 .spel-xl-mb-20 {
2830 margin-bottom: 20px !important;
2831 }
2832 .spel-xl-mb-24 {
2833 margin-bottom: 24px !important;
2834 }
2835 .spel-xl-mb-28 {
2836 margin-bottom: 28px !important;
2837 }
2838 .spel-xl-mb-32 {
2839 margin-bottom: 32px !important;
2840 }
2841 .spel-xl-mb-36 {
2842 margin-bottom: 36px !important;
2843 }
2844 .spel-xl-mb-40 {
2845 margin-bottom: 40px !important;
2846 }
2847 .spel-xl-mb-44 {
2848 margin-bottom: 44px !important;
2849 }
2850 .spel-xl-mb-48 {
2851 margin-bottom: 48px !important;
2852 }
2853 .spel-xl-mb-52 {
2854 margin-bottom: 52px !important;
2855 }
2856 .spel-xl-mb-56 {
2857 margin-bottom: 56px !important;
2858 }
2859 .spel-xl-mb-60 {
2860 margin-bottom: 60px !important;
2861 }
2862 .spel-xl-mb-64 {
2863 margin-bottom: 64px !important;
2864 }
2865 .spel-xl-mb-68 {
2866 margin-bottom: 68px !important;
2867 }
2868 .spel-xl-mb-72 {
2869 margin-bottom: 72px !important;
2870 }
2871 .spel-xl-mb-76 {
2872 margin-bottom: 76px !important;
2873 }
2874 .spel-xl-mb-80 {
2875 margin-bottom: 80px !important;
2876 }
2877 .spel-xl-mb-84 {
2878 margin-bottom: 84px !important;
2879 }
2880 .spel-xl-mb-88 {
2881 margin-bottom: 88px !important;
2882 }
2883 .spel-xl-mb-92 {
2884 margin-bottom: 92px !important;
2885 }
2886 .spel-xl-mb-96 {
2887 margin-bottom: 96px !important;
2888 }
2889 .spel-xl-mb-100 {
2890 margin-bottom: 100px !important;
2891 }
2892 .spel-xl-ml-0 {
2893 margin-left: 0 !important;
2894 }
2895 .spel-xl-ml-4 {
2896 margin-left: 4px !important;
2897 }
2898 .spel-xl-ml-8 {
2899 margin-left: 8px !important;
2900 }
2901 .spel-xl-ml-12 {
2902 margin-left: 12px !important;
2903 }
2904 .spel-xl-ml-16 {
2905 margin-left: 16px !important;
2906 }
2907 .spel-xl-ml-20 {
2908 margin-left: 20px !important;
2909 }
2910 .spel-xl-ml-24 {
2911 margin-left: 24px !important;
2912 }
2913 .spel-xl-ml-28 {
2914 margin-left: 28px !important;
2915 }
2916 .spel-xl-ml-32 {
2917 margin-left: 32px !important;
2918 }
2919 .spel-xl-ml-36 {
2920 margin-left: 36px !important;
2921 }
2922 .spel-xl-ml-40 {
2923 margin-left: 40px !important;
2924 }
2925 .spel-xl-ml-44 {
2926 margin-left: 44px !important;
2927 }
2928 .spel-xl-ml-48 {
2929 margin-left: 48px !important;
2930 }
2931 .spel-xl-ml-52 {
2932 margin-left: 52px !important;
2933 }
2934 .spel-xl-ml-56 {
2935 margin-left: 56px !important;
2936 }
2937 .spel-xl-ml-60 {
2938 margin-left: 60px !important;
2939 }
2940 .spel-xl-ml-64 {
2941 margin-left: 64px !important;
2942 }
2943 .spel-xl-ml-68 {
2944 margin-left: 68px !important;
2945 }
2946 .spel-xl-ml-72 {
2947 margin-left: 72px !important;
2948 }
2949 .spel-xl-ml-76 {
2950 margin-left: 76px !important;
2951 }
2952 .spel-xl-ml-80 {
2953 margin-left: 80px !important;
2954 }
2955 .spel-xl-ml-84 {
2956 margin-left: 84px !important;
2957 }
2958 .spel-xl-ml-88 {
2959 margin-left: 88px !important;
2960 }
2961 .spel-xl-ml-92 {
2962 margin-left: 92px !important;
2963 }
2964 .spel-xl-ml-96 {
2965 margin-left: 96px !important;
2966 }
2967 .spel-xl-ml-100 {
2968 margin-left: 100px !important;
2969 }
2970 }
2971 /* Spider Elements common CSS */
2972 .fade {
2973 transition: opacity 0.15s linear;
2974 }
2975
2976 a:hover, a:focus {
2977 outline: none;
2978 text-decoration: none;
2979 }
2980
2981 .ezd-grid {
2982 display: grid;
2983 grid-template-columns: repeat(3, 1fr);
2984 grid-column-gap: 25px;
2985 }
2986 .ezd-grid.ezd-column-1 {
2987 grid-template-columns: repeat(1, 1fr);
2988 }
2989 .ezd-grid.ezd-column-2 {
2990 grid-template-columns: repeat(2, 1fr);
2991 }
2992 @media (max-width: 600px) {
2993 .ezd-grid.ezd-column-2 {
2994 grid-template-columns: repeat(1, 1fr);
2995 }
2996 }
2997 .ezd-grid.ezd-column-4 {
2998 grid-template-columns: repeat(4, 1fr);
2999 }
3000 @media (max-width: 991px) {
3001 .ezd-grid.ezd-column-4 {
3002 grid-template-columns: repeat(2, 1fr);
3003 }
3004 }
3005 @media (max-width: 600px) {
3006 .ezd-grid.ezd-column-4 {
3007 grid-template-columns: repeat(1, 1fr);
3008 }
3009 }
3010 .ezd-grid.ezd-column-3 {
3011 grid-template-columns: repeat(3, 1fr);
3012 }
3013 @media (max-width: 991px) {
3014 .ezd-grid.ezd-column-3 {
3015 grid-template-columns: repeat(2, 1fr);
3016 }
3017 }
3018 @media (max-width: 600px) {
3019 .ezd-grid.ezd-column-3 {
3020 grid-template-columns: repeat(1, 1fr);
3021 }
3022 }
3023 .ezd-grid.ezd-column-5 {
3024 grid-template-columns: repeat(5, 1fr);
3025 }
3026 @media (max-width: 991px) {
3027 .ezd-grid.ezd-column-5 {
3028 grid-template-columns: repeat(3, 1fr);
3029 }
3030 }
3031 @media (max-width: 600px) {
3032 .ezd-grid.ezd-column-5 {
3033 grid-template-columns: repeat(1, 1fr);
3034 }
3035 }
3036 .ezd-grid.ezd-column-6 {
3037 grid-template-columns: repeat(6, 1fr);
3038 }
3039 @media (max-width: 991px) {
3040 .ezd-grid.ezd-column-6 {
3041 grid-template-columns: repeat(2, 1fr);
3042 }
3043 }
3044 @media (max-width: 600px) {
3045 .ezd-grid.ezd-column-6 {
3046 grid-template-columns: repeat(1, 1fr);
3047 }
3048 }
3049
3050 .ezd-grid-cols-12 {
3051 grid-template-columns: repeat(12, minmax(0, 1fr));
3052 }
3053
3054 .ezd-grid-column-full,
3055 [class^=ezd-lg-col],
3056 [class^=ezd-md-col],
3057 [class^=ezd-sm-col] {
3058 grid-column: 1/-1;
3059 }
3060
3061 @media (max-width: 991px) {
3062 [class^=ezd-lg-col] {
3063 grid-column: 1/-1;
3064 }
3065 }
3066 @media (min-width: 576px) {
3067 .ezd-sm-col-4 {
3068 grid-column: span 4/span 4;
3069 }
3070 .ezd-sm-col-3 {
3071 grid-column: span 3/span 3;
3072 }
3073 .ezd-sm-col-5 {
3074 grid-column: span 5/span 5;
3075 }
3076 .ezd-sm-col-6 {
3077 grid-column: span 6/span 6;
3078 }
3079 .ezd-sm-col-7 {
3080 grid-column: span 7/span 7;
3081 }
3082 .ezd-sm-col-8 {
3083 grid-column: span 8/span 8;
3084 }
3085 .ezd-sm-col-9 {
3086 grid-column: span 9/span 9;
3087 }
3088 .ezd-sm-col-10 {
3089 grid-column: span 10/span 10;
3090 }
3091 .ezd-sm-col-2 {
3092 grid-column: span 2/span 2;
3093 }
3094 .ezd-sm-col-11 {
3095 grid-column: span 11/span 11;
3096 }
3097 .ezd-sm-col-12 {
3098 grid-column: span 12/span 12;
3099 }
3100 .ezd-justify-content-sm-between {
3101 justify-content: space-between !important;
3102 }
3103 }
3104 @media (min-width: 768px) {
3105 .ezd-md-col-4 {
3106 grid-column: span 4/span 4;
3107 }
3108 .ezd-md-col-3 {
3109 grid-column: span 3/span 3;
3110 }
3111 .ezd-md-col-5 {
3112 grid-column: span 5/span 5;
3113 }
3114 .ezd-md-col-6 {
3115 grid-column: span 6/span 6;
3116 }
3117 .ezd-md-col-7 {
3118 grid-column: span 7/span 7;
3119 }
3120 .ezd-md-col-8 {
3121 grid-column: span 8/span 8;
3122 }
3123 .ezd-md-col-9 {
3124 grid-column: span 9/span 9;
3125 }
3126 .ezd-md-col-10 {
3127 grid-column: span 10/span 10;
3128 }
3129 .ezd-md-col-11 {
3130 grid-column: span 11/span 11;
3131 }
3132 .ezd-md-col-12 {
3133 grid-column: span 12/span 12;
3134 }
3135 .ezd-md-col-2 {
3136 grid-column: span 2/span 2;
3137 }
3138 }
3139 @media (min-width: 992px) {
3140 .ezd-lg-col-4 {
3141 grid-column: span 4/span 4;
3142 }
3143 .ezd-lg-col-3 {
3144 grid-column: span 3/span 3;
3145 }
3146 .ezd-lg-col-5 {
3147 grid-column: span 5/span 5;
3148 }
3149 .ezd-lg-col-6 {
3150 grid-column: span 6/span 6;
3151 }
3152 .ezd-lg-col-8 {
3153 grid-column: span 8/span 8;
3154 }
3155 .ezd-lg-col-7 {
3156 grid-column: span 7/span 7;
3157 }
3158 .ezd-lg-col-9 {
3159 grid-column: span 9/span 9;
3160 }
3161 .ezd-lg-col-10 {
3162 grid-column: span 10/span 10;
3163 }
3164 .ezd-lg-col-11 {
3165 grid-column: span 11/span 11;
3166 }
3167 .ezd-lg-col-12 {
3168 grid-column: span 12/span 12;
3169 }
3170 .ezd-lg-col-2 {
3171 grid-column: span 2/span 2;
3172 }
3173 .ezd-d-lg-block {
3174 display: block !important;
3175 }
3176 }
3177 @media (min-width: 1200px) {
3178 .ezd-xl-col-4 {
3179 grid-column: span 4/span 4;
3180 }
3181 .ezd-xl-col-3 {
3182 grid-column: span 3/span 3;
3183 }
3184 .ezd-xl-col-5 {
3185 grid-column: span 5/span 5;
3186 }
3187 .ezd-xl-col-6 {
3188 grid-column: span 6/span 6;
3189 }
3190 .ezd-xl-col-8 {
3191 grid-column: span 8/span 8;
3192 }
3193 .ezd-xl-col-7 {
3194 grid-column: span 7/span 7;
3195 }
3196 .ezd-xl-col-9 {
3197 grid-column: span 9/span 9;
3198 }
3199 .ezd-xl-col-10 {
3200 grid-column: span 10/span 10;
3201 }
3202 .ezd-xl-col-11 {
3203 grid-column: span 11/span 11;
3204 }
3205 .ezd-xl-col-12 {
3206 grid-column: span 12/span 12;
3207 }
3208 .ezd-xl-col-2 {
3209 grid-column: span 2/span 2;
3210 }
3211 }
3212 .ezd-list-unstyled {
3213 list-style: none !important;
3214 padding: 0;
3215 }
3216
3217 .ezd-tab-content {
3218 display: block;
3219 }
3220
3221 .ezd-btn-circle {
3222 border-radius: 15px;
3223 }
3224
3225 .ezd-rounded-circle {
3226 border-radius: 50% !important;
3227 }
3228
3229 .ezd-ms-3 {
3230 margin-left: 1rem;
3231 }
3232
3233 .ezd-order-lg-last {
3234 order: 6 !important;
3235 }
3236
3237 .ezd-order-lg-first {
3238 order: -1 !important;
3239 }
3240
3241 .ezd-custom-container.ezd-container {
3242 width: 100%;
3243 }
3244 @media (min-width: 1300px) {
3245 .ezd-custom-container.ezd-container {
3246 max-width: 1240px;
3247 }
3248 }
3249 @media (min-width: 1500px) {
3250 .ezd-custom-container.ezd-container {
3251 max-width: 1470px;
3252 }
3253 }
3254
3255 .ezd-container {
3256 padding-left: 0.75rem;
3257 padding-right: 0.75rem;
3258 }
3259 @media (min-width: 1200px) {
3260 .ezd-container {
3261 max-width: 1140px;
3262 }
3263 }
3264 @media (min-width: 992px) {
3265 .ezd-container {
3266 max-width: 960px;
3267 }
3268 }
3269
3270 .eazydocs_shortcode .ezd-container,
3271 .ezd-container {
3272 width: 100%;
3273 margin-right: auto;
3274 margin-left: auto;
3275 }
3276 @media (min-width: 1200px) {
3277 .eazydocs_shortcode .ezd-container,
3278 .ezd-container {
3279 max-width: 1200px;
3280 }
3281 }
3282
3283 .modal {
3284 position: fixed;
3285 top: 0;
3286 left: 0;
3287 z-index: 1055;
3288 display: none;
3289 width: 100%;
3290 height: 100%;
3291 overflow-x: hidden;
3292 overflow-y: auto;
3293 outline: 0;
3294 }
3295
3296 .modal-dialog {
3297 position: relative;
3298 width: auto;
3299 margin: 0.5rem;
3300 pointer-events: none;
3301 }
3302
3303 .modal-content {
3304 position: relative;
3305 display: flex;
3306 flex-direction: column;
3307 width: 100%;
3308 pointer-events: auto;
3309 background-color: #fff;
3310 background-clip: padding-box;
3311 border: 1px solid rgba(0, 0, 0, 0.2);
3312 border-radius: 0.3rem;
3313 outline: 0;
3314 }
3315
3316 .modal.is-visible {
3317 visibility: visible;
3318 display: block;
3319 }
3320
3321 .modal-overlay {
3322 position: fixed;
3323 z-index: 10;
3324 top: 0;
3325 left: 0;
3326 width: 100%;
3327 height: 100%;
3328 transition: visibility 0s linear 0.3s, opacity 0.3s;
3329 }
3330
3331 @media (min-width: 576px) {
3332 .modal-dialog {
3333 margin: 1.75rem auto;
3334 }
3335 }
3336 /** === Utility Classes === **/
3337 .ezd-d-flex {
3338 display: flex;
3339 }
3340
3341 .ezd-circle {
3342 border-radius: 50% !important;
3343 }
3344
3345 .ezd-align-items-center {
3346 align-items: center;
3347 }
3348
3349 .ezd-align-items-start {
3350 align-items: start;
3351 }
3352
3353 .ezd-align-items-end {
3354 align-items: end;
3355 }
3356
3357 .ezd-justify-content-between {
3358 justify-content: space-between;
3359 }
3360
3361 .ezd-justify-content-center {
3362 justify-content: center;
3363 }
3364
3365 .ezd-justify-content-start {
3366 justify-content: start;
3367 }
3368
3369 .ezd-position-relative {
3370 position: relative;
3371 }
3372
3373 .ezd-position-absolute {
3374 position: absolute;
3375 }
3376
3377 .ezd-d-inline-block {
3378 display: inline-block;
3379 }
3380
3381 .ezd-text-center {
3382 text-align: center;
3383 }
3384
3385 .ezd-shadow-lg {
3386 box-shadow: 0 1rem 1.2rem rgba(0, 0, 0, 0.175) !important;
3387 }
3388
3389 .ezd-m-auto {
3390 margin-left: auto;
3391 margin-right: auto;
3392 }
3393
3394 .ezd-ms-auto {
3395 margin-left: auto;
3396 margin-right: 0;
3397 }
3398
3399 .ezd-me-auto {
3400 margin-left: 0;
3401 margin-right: auto;
3402 }
3403
3404 [type=button]:focus,
3405 [type=submit]:focus,
3406 button:focus {
3407 outline: 0 auto -webkit-focus-ring-color;
3408 }
3409
3410 @media (min-width: 992px) {
3411 .ezd-d-md-block {
3412 display: block;
3413 }
3414 }
3415
3416 .spel-accordion .card {
3417 border: 0;
3418 overflow: hidden;
3419 border-radius: unset;
3420 margin-bottom: 1rem;
3421 background: unset;
3422 }
3423 .spel-accordion .card:last-child {
3424 margin-bottom: 0;
3425 }
3426 .spel-accordion .card.border-bottom-none {
3427 border: unset !important;
3428 }
3429 .spel-accordion .card .card-header {
3430 border-radius: 0;
3431 border: 0;
3432 background: transparent;
3433 padding: 0;
3434 }
3435 .spel-accordion .card .card-header .title {
3436 padding: 0;
3437 margin: 0;
3438 }
3439 .spel-accordion .card .card-header .accordion_btn_link {
3440 padding: 12px 30px;
3441 text-align: left;
3442 width: 100%;
3443 font-weight: 400;
3444 background: #ebebeb;
3445 text-decoration: none;
3446 position: relative;
3447 box-shadow: none;
3448 border: 0;
3449 display: flex;
3450 align-items: center;
3451 }
3452 .spel-accordion .card .card-header .accordion_btn_link:focus {
3453 box-shadow: none;
3454 outline: none;
3455 }
3456 .spel-accordion .card .card-header .accordion_btn_link .collapsed .collapsed-icon {
3457 display: none;
3458 }
3459 .spel-accordion .card .card-header .accordion_btn_link .icon-wrapper {
3460 position: absolute;
3461 right: 0;
3462 }
3463 .spel-accordion .card .card-header .accordion_btn_link .icon-wrapper svg {
3464 position: absolute;
3465 right: 0;
3466 top: 0;
3467 transform: unset;
3468 transition: all 0.2s linear;
3469 width: 16px;
3470 height: 16px;
3471 }
3472 .spel-accordion .card .card-header .accordion_btn_link .icon-wrapper svg + svg {
3473 display: block;
3474 }
3475 .spel-accordion .card .card-header .accordion_btn_link .icon-wrapper .expanded-icon {
3476 display: block;
3477 line-height: 0;
3478 }
3479 .spel-accordion .card .card-header .accordion_btn_link .icon-wrapper .collapsed-icon {
3480 display: none;
3481 line-height: 0;
3482 }
3483 .spel-accordion .card .card-header .accordion_btn_link.icon-align-left {
3484 padding-left: 60px;
3485 }
3486 .spel-accordion .card .card-header .accordion_btn_link.icon-align-left .icon-wrapper {
3487 left: 0;
3488 right: auto;
3489 }
3490 .spel-accordion .card .card-body {
3491 border-style: none;
3492 border-radius: 0;
3493 padding: 18px 30px 24px;
3494 line-height: 26px;
3495 background: #ffffff;
3496 }
3497 @media only screen and (min-width: 320px) and (max-width: 425px) {
3498 .spel-accordion .card .card-body {
3499 padding: 18px 15px 24px;
3500 }
3501 }
3502 .spel-accordion .card .card-body p {
3503 font-size: 16px;
3504 font-weight: 400;
3505 }
3506 .spel-accordion .card .card-body p:last-child {
3507 margin-bottom: 0;
3508 }
3509 .spel-accordion .card.collapsed .card-header .accordion_btn_link .icon-wrapper .expanded-icon {
3510 display: none;
3511 }
3512 .spel-accordion .card.collapsed .card-header .accordion_btn_link .icon-wrapper .collapsed-icon {
3513 display: block;
3514 }
3515
3516 /*============== Tab Styles ==========*/
3517 .spel-tabs .tab-content {
3518 display: block;
3519 padding: 25px 30px;
3520 border: 1px solid var(--black_50);
3521 border-radius: 0 5px 5px 5px;
3522 background-color: var(--bs-white);
3523 position: relative;
3524 margin-top: -1px;
3525 }
3526 .spel-tabs .tab-content p {
3527 margin: 0;
3528 }
3529 .spel-tabs .tab-content .tab_arrow_btn {
3530 background: #0dcaf0;
3531 border-color: #0dcaf0;
3532 color: #fff;
3533 }
3534 .spel-tabs .tab-content .tab_arrow_btn.previous, .spel-tabs .tab-content .tab_arrow_btn.next {
3535 position: absolute;
3536 top: 50%;
3537 transform: translateY(-50%);
3538 padding: 0;
3539 border-radius: 0;
3540 background: #e1ebf0;
3541 border: 0;
3542 color: var(--e-global-color-accent);
3543 outline: none;
3544 box-shadow: none;
3545 transition: all 0.4s linear;
3546 height: 32px;
3547 width: 19px;
3548 text-align: center;
3549 opacity: 0;
3550 }
3551 .spel-tabs .tab-content .tab_arrow_btn.previous:hover, .spel-tabs .tab-content .tab_arrow_btn.next:hover {
3552 background: var(--e-global-color-accent);
3553 color: #fff;
3554 }
3555 .spel-tabs .tab-content .tab_arrow_btn.previous {
3556 left: 0;
3557 }
3558 .spel-tabs .tab-content .tab_arrow_btn.next {
3559 right: 0;
3560 }
3561 .spel-tabs .tab-content:hover .previous,
3562 .spel-tabs .tab-content:hover .next {
3563 opacity: 1;
3564 }
3565
3566 .tab_shortcode {
3567 margin-bottom: 0 !important;
3568 }
3569
3570 .header_tab_items .nav-tabs .numb,
3571 .tab_shortcode .nav-tabs .numb {
3572 width: 20px;
3573 height: 20px;
3574 border-radius: 50%;
3575 background: var(--e-global-color-accent);
3576 display: inline-block;
3577 text-align: center;
3578 line-height: 20px;
3579 font-size: 12px;
3580 margin-right: 10px;
3581 transition: all 0.2s linear;
3582 color: #ffffff;
3583 }
3584
3585 .header_tab_items .nav-tabs .nav-item .nav-link {
3586 flex-flow: column;
3587 box-shadow: none;
3588 text-align: center;
3589 }
3590 .header_tab_items .nav-tabs .nav-item .nav-link.active {
3591 background: #ffffff;
3592 color: var(--e-global-color-accent);
3593 }
3594
3595 /* Sticky Tab Styles */
3596 .process_tab_shortcode .previous,
3597 .process_tab_shortcode .next {
3598 position: absolute;
3599 top: 56%;
3600 transform: translateY(-50%);
3601 padding: 0;
3602 border-radius: 0;
3603 background: #e1ebf0;
3604 border: 0;
3605 color: var(--e-global-color-accent);
3606 outline: none;
3607 box-shadow: none;
3608 transition: all 0.4s linear;
3609 height: 32px;
3610 width: 19px;
3611 text-align: center;
3612 }
3613 .process_tab_shortcode .previous:focus,
3614 .process_tab_shortcode .next:focus {
3615 outline: none;
3616 box-shadow: none;
3617 }
3618 .process_tab_shortcode .previous:hover,
3619 .process_tab_shortcode .next:hover {
3620 background: var(--e-global-color-accent);
3621 color: #fff;
3622 border-color: transparent #ebebeb;
3623 }
3624 .process_tab_shortcode .next {
3625 right: -30px;
3626 border-radius: 5px 0 0 5px;
3627 }
3628 .process_tab_shortcode .previous {
3629 left: -30px;
3630 border-radius: 0 5px 5px 0;
3631 }
3632 .process_tab_shortcode:hover .next {
3633 right: 0;
3634 }
3635 .process_tab_shortcode:hover .previous {
3636 left: 0;
3637 }
3638
3639 /* Vertical Menu Styles */
3640 .v_menu {
3641 border-bottom: 1px solid var(--black_50);
3642 padding-bottom: 20px;
3643 padding-top: 5px;
3644 margin-bottom: 20px;
3645 }
3646 .v_menu .nav-item {
3647 display: inline-block;
3648 }
3649 .v_menu .nav-item .nav-link {
3650 font-size: 16px;
3651 color: #6A737C;
3652 transition: all 0.2s linear;
3653 padding: 0;
3654 border: 0;
3655 border-radius: 0;
3656 }
3657 .v_menu .nav-item .nav-link span {
3658 width: 20px;
3659 height: 20px;
3660 border-radius: 50%;
3661 background: #e1e3eb;
3662 display: inline-block;
3663 text-align: center;
3664 line-height: 20px;
3665 font-size: 12px;
3666 margin-right: 10px;
3667 transition: all 0.2s linear;
3668 position: relative;
3669 top: -2px;
3670 }
3671 .v_menu .nav-item .nav-link.active, .v_menu .nav-item .nav-link:hover {
3672 color: var(--e-global-color-accent);
3673 border: 0;
3674 background: transparent;
3675 }
3676 .v_menu .nav-item .nav-link.active span, .v_menu .nav-item .nav-link:hover span {
3677 background: var(--e-global-color-accent);
3678 color: #fff;
3679 }
3680 .v_menu .nav-item + li {
3681 margin-left: 55px;
3682 }
3683
3684 /* Sticky Tab in Admin Bar */
3685 body.admin-bar .sticky_tab.tab_fixed.sticky_tab_item {
3686 top: -38px;
3687 }
3688
3689 /* Sticky Tab Fixed Position */
3690 .sticky_tab.tab_fixed.sticky_tab_item {
3691 position: fixed;
3692 width: 100%;
3693 top: -70px;
3694 left: 0;
3695 right: 0;
3696 background: #031933;
3697 transform: translateY(70px);
3698 transition: transform 500ms ease, background 500ms ease;
3699 z-index: 30;
3700 }
3701
3702 /* Tabs Slider Styles */
3703 .tabs_sliders {
3704 position: relative;
3705 overflow: hidden;
3706 }
3707 .tabs_sliders .scroller-btn {
3708 position: absolute;
3709 top: 50%;
3710 color: var(--e-global-color-accent);
3711 font-size: 20px;
3712 cursor: pointer;
3713 transform: translateY(-50%);
3714 left: 0;
3715 width: 40px;
3716 background: #f9f9f9;
3717 box-shadow: 4px 0 9px 1px rgba(0, 0, 0, 0.03);
3718 line-height: 44px;
3719 z-index: 9;
3720 text-align: center;
3721 }
3722 .tabs_sliders .scroller-btn.right {
3723 right: 0;
3724 left: auto;
3725 }
3726 .tabs_sliders .scroller-btn.right::before {
3727 left: -20px;
3728 right: auto;
3729 }
3730 .tabs_sliders .scroller-btn.inactive-left-arrow {
3731 display: none;
3732 }
3733 .tabs_sliders .scroller-btn.inactive-right-arrow {
3734 display: none;
3735 }
3736 .tabs_sliders ul.nav-tabs {
3737 display: flex;
3738 flex-wrap: nowrap;
3739 overflow: hidden;
3740 margin-bottom: -1px;
3741 border: 0;
3742 }
3743 .tabs_sliders ul.nav-tabs .nav-item {
3744 margin: 0;
3745 min-width: fit-content;
3746 }
3747 .tabs_sliders ul.nav-tabs .nav-item .nav-link {
3748 font-size: 16px;
3749 color: var(--black_700);
3750 border-radius: 0;
3751 padding: 9px 20px;
3752 background: var(--black_25);
3753 border: 1px solid var(--black_50);
3754 position: relative;
3755 text-decoration: none;
3756 margin-bottom: 0;
3757 display: flex;
3758 gap: 8px;
3759 align-items: center;
3760 transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out;
3761 }
3762 .tabs_sliders ul.nav-tabs .nav-item .nav-link::before {
3763 content: "";
3764 width: 0;
3765 height: 2.1px;
3766 background: var(--e-global-color-accent);
3767 position: absolute;
3768 top: -1px;
3769 left: 0;
3770 opacity: 0;
3771 transition: width 0.2s linear;
3772 }
3773 .tabs_sliders ul.nav-tabs .nav-item .nav-link.active {
3774 background: var(--bs-white);
3775 color: var(--black_800);
3776 border-color: var(--black_75);
3777 border-bottom-color: transparent;
3778 z-index: 1;
3779 }
3780 .tabs_sliders ul.nav-tabs .nav-item .nav-link.active::before {
3781 opacity: 1;
3782 width: 100%;
3783 }
3784 .tabs_sliders ul.nav-tabs .nav-item .nav-link.active .tab_progress .progress-bar {
3785 background: var(--e-global-color-accent);
3786 height: 2px;
3787 }
3788 .tabs_sliders ul.nav-tabs .nav-item .nav-link svg, .tabs_sliders ul.nav-tabs .nav-item .nav-link i {
3789 display: block;
3790 height: 24px;
3791 width: 24px;
3792 max-width: 26px;
3793 max-height: 26px;
3794 padding-top: 5px;
3795 }
3796 .tabs_sliders ul.nav-tabs .nav-item .nav-link .tab_progress .progress-bar {
3797 background: transparent;
3798 height: 2px;
3799 }
3800 .tabs_sliders ul.nav-tabs .nav-item:last-child .nav-link {
3801 border-right: 1px solid var(--black_50);
3802 }
3803
3804 /* Process Tab Shortcode */
3805 .process_tab_shortcode p {
3806 margin-bottom: 20px;
3807 font-size: 15px;
3808 color: #6b707f;
3809 }
3810 .process_tab_shortcode p:last-child {
3811 margin-bottom: 0;
3812 }
3813 .process_tab_shortcode .v_head {
3814 padding-bottom: 24px;
3815 }
3816 .process_tab_shortcode .v_middle p {
3817 margin-bottom: 0;
3818 font-size: 15px;
3819 }
3820 .process_tab_shortcode .v_middle p .red {
3821 color: #f12249;
3822 }
3823 .process_tab_shortcode .v_middle p .green {
3824 color: #11c52f;
3825 }
3826 .process_tab_shortcode .v_footer {
3827 padding-top: 25px;
3828 }
3829 .process_tab_shortcode .v_footer p {
3830 margin-bottom: 0;
3831 }
3832
3833 /* Process Tab Shortcode */
3834 .process_tab_shortcode .previous,
3835 .process_tab_shortcode .next {
3836 position: absolute;
3837 top: 56%;
3838 transform: translateY(-50%);
3839 padding: 0;
3840 border-radius: 0;
3841 background: #e1ebf0;
3842 border: 0;
3843 color: var(--e-global-color-accent);
3844 outline: none;
3845 box-shadow: none;
3846 transition: all 0.4s linear;
3847 height: 32px;
3848 width: 19px;
3849 text-align: center;
3850 }
3851 .process_tab_shortcode .previous:focus,
3852 .process_tab_shortcode .next:focus {
3853 outline: none;
3854 box-shadow: none;
3855 }
3856 .process_tab_shortcode .previous:hover,
3857 .process_tab_shortcode .next:hover {
3858 outline: none;
3859 box-shadow: none;
3860 background: var(--e-global-color-accent);
3861 color: #fff;
3862 }
3863 .process_tab_shortcode .next {
3864 right: -30px;
3865 border-radius: 5px 0 0 5px;
3866 }
3867 .process_tab_shortcode .previous {
3868 left: -30px;
3869 border-radius: 0 5px 5px 0;
3870 }
3871 .process_tab_shortcode:hover .next {
3872 right: 0;
3873 }
3874 .process_tab_shortcode:hover .previous {
3875 left: 0;
3876 }
3877
3878 /* Sticky Tab Styles */
3879 body.remove .tab_fixed.header_tab_items {
3880 transform: translateY(144px);
3881 }
3882
3883 /* Header Tab Items */
3884 .header_tab_items {
3885 background: #031933;
3886 }
3887 .header_tab_items.tab_fixed .nav.nav-tabs li a svg,
3888 .header_tab_items.tab_fixed .nav.nav-tabs li a i,
3889 .header_tab_items.tab_fixed .nav.nav-tabs li a img {
3890 display: inline-block;
3891 margin-bottom: 0;
3892 position: relative;
3893 margin-right: 4px;
3894 }
3895 .header_tab_items.tab_fixed .header_tab_content {
3896 margin-top: 61px;
3897 }
3898 .header_tab_items.tab_fixed .header_tab_content .tab-pane {
3899 padding: 0;
3900 }
3901 .header_tab_items .nav.nav-tabs {
3902 justify-content: center;
3903 border: none;
3904 }
3905 .header_tab_items .nav.nav-tabs li {
3906 margin-bottom: 0;
3907 }
3908 .header_tab_items .nav.nav-tabs li a {
3909 border: none;
3910 box-shadow: none;
3911 background: transparent;
3912 border-radius: 0;
3913 text-align: center;
3914 font-size: 14px;
3915 font-weight: 400;
3916 color: #fff;
3917 padding: 10px 30px;
3918 text-decoration: none;
3919 }
3920 .header_tab_items .nav.nav-tabs li a svg,
3921 .header_tab_items .nav.nav-tabs li a i,
3922 .header_tab_items .nav.nav-tabs li a img {
3923 display: block;
3924 margin-bottom: 2px;
3925 }
3926 .header_tab_items .nav.nav-tabs li a:hover {
3927 background: #ebebeb;
3928 color: #6A737C;
3929 }
3930 .header_tab_items .nav.nav-tabs li a:hover svg path {
3931 fill: #6A737C;
3932 }
3933 .header_tab_items .nav.nav-tabs li a.active {
3934 background-color: #fff;
3935 color: var(--e-global-color-accent);
3936 }
3937 .header_tab_items .nav.nav-tabs li a.active svg path {
3938 fill: var(--e-global-color-accent);
3939 }
3940
3941 /* Auto Tabs Styles */
3942 .tab_shortcode .tab_auto_play .nav-item .nav-link,
3943 .header_tab_items .tab_auto_play .nav-item .nav-link {
3944 position: relative;
3945 overflow: hidden;
3946 }
3947 .tab_shortcode .tab_auto_play .nav-item .nav-link::before,
3948 .header_tab_items .tab_auto_play .nav-item .nav-link::before {
3949 display: none;
3950 }
3951 .tab_shortcode .tab_auto_play .nav-item .nav-link .tab_progress,
3952 .header_tab_items .tab_auto_play .nav-item .nav-link .tab_progress {
3953 position: absolute;
3954 top: 0;
3955 left: 0;
3956 width: 100%;
3957 height: 2px;
3958 }
3959 .tab_shortcode .tab_auto_play .nav-item .nav-link .tab_progress::before,
3960 .header_tab_items .tab_auto_play .nav-item .nav-link .tab_progress::before {
3961 content: "";
3962 position: absolute;
3963 width: 100%;
3964 height: 100%;
3965 left: 0;
3966 top: 0;
3967 opacity: 0.4;
3968 }
3969
3970 /*============ Start doc_feedback_area css ==========*/
3971 .doc_feedback_info {
3972 position: relative;
3973 }
3974
3975 .slider_nav .arrow {
3976 width: 25px;
3977 height: 2px;
3978 background: #989dad;
3979 transition: all 0.3s ease-in-out;
3980 display: block;
3981 margin-top: 12px;
3982 }
3983 .slider_nav .arrow:before, .slider_nav .arrow:after {
3984 content: "";
3985 position: absolute;
3986 width: 15px;
3987 height: 2px;
3988 left: -2px;
3989 background-color: #bdb4b4;
3990 transition: all 0.3s ease-in-out;
3991 }
3992 .slider_nav .prev,
3993 .slider_nav .next {
3994 height: 25px;
3995 width: 27px;
3996 position: absolute;
3997 top: 50%;
3998 transform: translateY(-50%);
3999 transition: all 0.3s ease-in-out;
4000 cursor: pointer;
4001 }
4002 .slider_nav .prev:hover,
4003 .slider_nav .next:hover {
4004 width: 40px;
4005 }
4006 .slider_nav .prev:hover .arrow,
4007 .slider_nav .next:hover .arrow {
4008 width: 40px;
4009 background: var(--e-global-color-accent);
4010 }
4011 .slider_nav .prev:hover .arrow:before, .slider_nav .prev:hover .arrow:after,
4012 .slider_nav .next:hover .arrow:before,
4013 .slider_nav .next:hover .arrow:after {
4014 background: var(--e-global-color-accent);
4015 }
4016 .slider_nav .prev {
4017 left: 0;
4018 }
4019 .slider_nav .prev .arrow:before {
4020 top: 17px;
4021 transform: rotate(45deg);
4022 }
4023 .slider_nav .prev .arrow:after {
4024 top: 7px;
4025 transform: rotate(-45deg);
4026 }
4027 .slider_nav .prev:hover {
4028 left: -20px;
4029 }
4030 .slider_nav .next {
4031 right: 0;
4032 }
4033 .slider_nav .next .arrow:before {
4034 transform: rotate(-45deg);
4035 right: -1px;
4036 left: auto;
4037 bottom: 6px;
4038 }
4039 .slider_nav .next .arrow:after {
4040 transform: rotate(45deg);
4041 right: -1px;
4042 left: auto;
4043 top: 6px;
4044 }
4045 .slider_nav .next:hover {
4046 right: -20px;
4047 }
4048
4049 .doc_feedback_slider {
4050 max-width: 770px;
4051 margin: 0 auto 0;
4052 text-align: center;
4053 }
4054 .doc_feedback_slider .item .author_img {
4055 border-radius: 50%;
4056 width: 60px;
4057 height: 60px;
4058 overflow: hidden;
4059 margin: 0 auto 43px;
4060 }
4061 .doc_feedback_slider .item p {
4062 font-size: 18px;
4063 color: #000;
4064 line-height: 30px;
4065 margin-bottom: 38px;
4066 font-weight: 300;
4067 }
4068 .doc_feedback_slider .item h5 {
4069 font-size: 20px;
4070 font-weight: 500;
4071 color: #000;
4072 }
4073 .doc_feedback_slider .item h6 {
4074 font-size: 16px;
4075 color: #989dad;
4076 font-weight: 400;
4077 margin-bottom: 0;
4078 }
4079
4080 /*============ End doc_feedback_area css ==========*/
4081 /*============ Start doc_action_area css ==========*/
4082 .doc_action_area {
4083 position: relative;
4084 z-index: 1;
4085 padding: 93px 0;
4086 }
4087 .doc_action_area .overlay_bg {
4088 background-image: linear-gradient(180deg, rgba(4, 133, 161, 0.6) 0%, rgba(29, 39, 70, 0.6) 100%);
4089 }
4090 .doc_action_area .action_btn {
4091 border: 1px solid var(--e-global-color-accent);
4092 }
4093 .doc_action_area .action_btn:hover {
4094 background: transparent;
4095 border-color: #fff;
4096 color: #fff;
4097 }
4098
4099 .action_text h2 {
4100 color: #fff;
4101 font-size: 40px;
4102 font-weight: 500;
4103 }
4104 .action_text p {
4105 font-size: 18px;
4106 line-height: 28px;
4107 color: #b4b9c8;
4108 margin-bottom: 0;
4109 }
4110
4111 /*============ End doc_action_area css ==========*/
4112 /*============= spider_testimonial_area css ================*/
4113 .doc_testimonial_slider {
4114 padding-right: 100px;
4115 }
4116 .doc_testimonial_slider .item {
4117 padding-left: 15px;
4118 position: relative;
4119 padding-top: 10px;
4120 }
4121 .doc_testimonial_slider .item:before {
4122 content: "";
4123 font-weight: 400;
4124 font-size: 150px;
4125 color: var(--e-global-color-accent);
4126 opacity: 0.1;
4127 position: absolute;
4128 left: -5px;
4129 width: 38px;
4130 height: 38px;
4131 line-height: 130px;
4132 top: 0;
4133 z-index: 1;
4134 }
4135 .doc_testimonial_slider .item h3 {
4136 font-size: 34px;
4137 line-height: 52px;
4138 font-weight: 400;
4139 margin-bottom: 20px;
4140 margin-top: 0;
4141 }
4142 .doc_testimonial_slider .item .name {
4143 font-size: 14px;
4144 font-weight: 700;
4145 color: #6a737c;
4146 margin-bottom: 20px;
4147 }
4148
4149 .doc_testimonial_slider {
4150 padding-right: 100px;
4151 }
4152 .doc_testimonial_slider .item {
4153 padding-left: 15px;
4154 position: relative;
4155 padding-top: 10px;
4156 }
4157 .doc_testimonial_slider .item:before {
4158 content: "";
4159 font-weight: 400;
4160 font-size: 150px;
4161 color: var(--e-global-color-accent);
4162 opacity: 0.1;
4163 position: absolute;
4164 left: -5px;
4165 width: 38px;
4166 height: 38px;
4167 line-height: 130px;
4168 top: 0;
4169 z-index: 1;
4170 }
4171 .doc_testimonial_slider .item h3 {
4172 font-size: 34px;
4173 line-height: 52px;
4174 font-weight: 400;
4175 margin-bottom: 20px;
4176 margin-top: 0;
4177 }
4178 .doc_testimonial_slider .item .name {
4179 font-size: 14px;
4180 font-weight: 700;
4181 color: #6a737c;
4182 margin-bottom: 20px;
4183 }
4184 .doc_testimonial_slider .item .name h5 {
4185 font-size: 20px;
4186 margin-bottom: 10px;
4187 margin-top: 0;
4188 text-transform: capitalize;
4189 }
4190 .doc_testimonial_slider .item .name span {
4191 font-weight: 400;
4192 }
4193 .doc_testimonial_slider .item .sign {
4194 display: inline-block;
4195 }
4196 .doc_testimonial_slider .slick-dots {
4197 position: relative;
4198 bottom: 0;
4199 text-align: left;
4200 margin-top: 30px;
4201 padding-left: 15px;
4202 }
4203 .doc_testimonial_slider .slick-dots li {
4204 width: auto;
4205 height: auto;
4206 }
4207 .doc_testimonial_slider .slick-dots li button {
4208 width: 8px;
4209 height: 8px;
4210 border-radius: 50%;
4211 background: #dbdbfc;
4212 transition: all 0.2s;
4213 }
4214 .doc_testimonial_slider .slick-dots li button:before {
4215 display: none;
4216 }
4217 .doc_testimonial_slider .slick-dots li :nth-child(even) button {
4218 background: #a5a5f8;
4219 }
4220 .doc_testimonial_slider .slick-dots li.slick-active button {
4221 background: var(--e-global-color-accent);
4222 }
4223 .doc_testimonial_slider .action_text h2 {
4224 color: #fff;
4225 font-size: 40px;
4226 font-weight: 500;
4227 }
4228 .doc_testimonial_slider .action_text p {
4229 font-size: 18px;
4230 line-height: 28px;
4231 color: #b4b9c8;
4232 margin-bottom: 0;
4233 }
4234
4235 .doc_img_slider .item {
4236 text-align: center;
4237 position: relative;
4238 padding-bottom: 25px;
4239 z-index: 1;
4240 }
4241 .doc_img_slider .item img {
4242 display: inline-block;
4243 border-radius: 20px;
4244 }
4245 .doc_img_slider .item .dot {
4246 border-radius: 0;
4247 position: absolute;
4248 left: 60px;
4249 bottom: 0;
4250 z-index: -1;
4251 }
4252 .doc_img_slider .item .round {
4253 border-radius: 50%;
4254 position: absolute;
4255 z-index: -1;
4256 }
4257 .doc_img_slider .item .round.one {
4258 width: 150px;
4259 height: 150px;
4260 right: 60px;
4261 top: 60px;
4262 background-image: linear-gradient(50deg, rgb(87, 54, 254) 0%, rgb(253, 64, 110) 100%);
4263 opacity: 0.1;
4264 }
4265 .doc_img_slider .item .round.two {
4266 width: 280px;
4267 height: 280px;
4268 right: 0;
4269 top: 50%;
4270 margin-top: -140px;
4271 background-image: linear-gradient(50deg, rgb(87, 54, 254) 0%, rgb(253, 64, 110) 100%);
4272 }
4273 .doc_img_slider .item.slick-active .one {
4274 animation: zoomIn 0.8s linear both 0.4s;
4275 }
4276 .doc_img_slider .item.slick-active .two {
4277 animation: zoomIn 0.8s linear both 0.5s;
4278 }
4279
4280 .slick-arrow.slick-hidden {
4281 display: none;
4282 }
4283
4284 /*============ testimonial slider 6 ===========*/
4285 .feedback_section_one .slick-arrow-one {
4286 position: absolute;
4287 right: 0;
4288 top: -80px;
4289 }
4290
4291 .feedback-slider-one {
4292 margin-left: -15px;
4293 margin-right: 15px;
4294 }
4295 .feedback-slider-one .item {
4296 margin-left: 15px;
4297 margin-right: 15px;
4298 }
4299
4300 .feedback-block-one {
4301 background: #f9ffe1;
4302 border: 2px solid #000;
4303 border-radius: 30px;
4304 padding: 40px 40px 45px;
4305 transition: all 0.25s linear;
4306 }
4307 .feedback-block-one:hover {
4308 background: rgba(var(--e-global-color-accent), 0.4);
4309 }
4310 .feedback-block-one .logo {
4311 height: 50px;
4312 }
4313 .feedback-block-one .logo img {
4314 max-height: 100%;
4315 }
4316 .feedback-block-one h3 {
4317 font-size: 36px;
4318 line-height: 1.3888em;
4319 color: #000;
4320 margin-top: 50px;
4321 margin-bottom: 50px;
4322 }
4323 .feedback-block-one .name {
4324 font-size: 16px;
4325 margin-bottom: 0;
4326 }
4327 .feedback-block-one .name span {
4328 font-weight: 500;
4329 }
4330 .feedback-block-one .review {
4331 border-top: 2px solid #000;
4332 padding-top: 40px;
4333 }
4334 @media (max-width: 1024px) {
4335 .feedback-block-one .review {
4336 margin-top: 30px;
4337 padding-top: 20px;
4338 }
4339 }
4340 .feedback-block-one .review .text-md {
4341 font-size: 20px;
4342 font-weight: 500;
4343 }
4344 .feedback-block-one.color-two {
4345 background: #755146;
4346 border: none;
4347 }
4348 .feedback-block-one.color-two:hover {
4349 background: #249f47;
4350 }
4351 .feedback-block-one.color-two .review {
4352 border-top: 1px solid #fff;
4353 }
4354 .feedback-block-one.color-two .review ul li a {
4355 color: #fff;
4356 }
4357
4358 /*========= feedback-slider-two css =============*/
4359 .feedback-section-two .slick-dots {
4360 margin: 40px 0 0 15px;
4361 position: relative;
4362 bottom: 0;
4363 text-align: left;
4364 }
4365 .feedback-section-two .slick-dots li {
4366 height: auto;
4367 width: auto;
4368 margin: 0;
4369 }
4370 .feedback-section-two .slick-dots li button {
4371 text-indent: -50000px;
4372 width: 8px;
4373 height: 8px;
4374 border-radius: 50%;
4375 margin: 0 5px;
4376 background: #e4e4e4;
4377 transition: all 0.3s ease-in-out;
4378 padding: 0;
4379 }
4380 .feedback-section-two .slick-dots li.slick-active button {
4381 background: var(--e-global-color-accent);
4382 }
4383
4384 .feedback-slider-two .item {
4385 margin: 50px 25px;
4386 }
4387
4388 .feedback-block-two {
4389 box-shadow: 0 20px 35px rgba(0, 16, 34, 0.03);
4390 background: #ffffff;
4391 border-radius: 10px;
4392 padding: 38px 45px 40px;
4393 border: 0;
4394 }
4395 .feedback-block-two:hover {
4396 background: #fff;
4397 }
4398 .feedback-block-two h3 {
4399 font-size: 20px;
4400 line-height: 2em;
4401 color: #212529;
4402 font-weight: 500;
4403 margin-top: 30px;
4404 margin-bottom: 45px;
4405 }
4406 .feedback-block-two .review {
4407 border: 0;
4408 padding-top: 0;
4409 }
4410 .feedback-block-two .review .text-md {
4411 font-size: 28px;
4412 color: var(--e-global-color-accent);
4413 line-height: 1;
4414 }
4415 .feedback-block-two .block-footer {
4416 padding-top: 35px;
4417 border-top: 1px solid #000;
4418 }
4419 .feedback-block-two .block-footer .author-img {
4420 width: 50px;
4421 height: 50px;
4422 }
4423 .feedback-block-two .block-footer .name {
4424 margin-bottom: 0;
4425 font-size: 18px;
4426 font-weight: 500;
4427 color: #212529;
4428 line-height: 1;
4429 }
4430 .feedback-block-two .block-footer span {
4431 font-size: 16px;
4432 }
4433 .feedback-block-two .block-footer .quote-icon {
4434 width: 40px;
4435 }
4436
4437 .feedback-section-seven .slick-arrow-one {
4438 position: absolute;
4439 right: 0;
4440 top: -80px;
4441 }
4442 .feedback-section-seven .slick-arrow-one li {
4443 color: #000;
4444 }
4445 .feedback-section-seven .slick-arrow-one li:hover {
4446 background: var(--e-global-color-accent);
4447 color: #fff;
4448 }
4449 .feedback-section-seven .feedback-slider-one {
4450 margin-left: -35px;
4451 margin-right: -35px;
4452 }
4453 .feedback-section-seven .feedback-slider-one .item {
4454 margin: 0 35px;
4455 }
4456 @media (max-width: 1025px) {
4457 .feedback-section-seven .feedback-slider-one .item {
4458 margin: 0 17.5px;
4459 }
4460 }
4461 @media (max-width: 767px) {
4462 .feedback-section-seven .feedback-slider-one .item {
4463 margin: 0 35px;
4464 }
4465 }
4466 .feedback-section-seven .feedback-slider-one .item .feedback-block-one {
4467 position: relative;
4468 }
4469 .feedback-section-seven .feedback-slider-one .item .feedback-block-one .quote-icon {
4470 position: absolute;
4471 top: 58px;
4472 right: 55px;
4473 }
4474 @media (max-width: 1024px) {
4475 .feedback-section-seven .feedback-slider-one .item .feedback-block-one .review {
4476 margin-top: 0;
4477 padding-top: 0;
4478 }
4479 }
4480
4481 .feedback-block-three {
4482 position: relative;
4483 padding: 45px 55px 40px;
4484 background: #FAFAFA;
4485 border-radius: 10px;
4486 border: 0;
4487 }
4488 @media (max-width: 1025px) {
4489 .feedback-block-three {
4490 padding: 35px 40px 35px;
4491 }
4492 }
4493 .feedback-block-three .quote-icon {
4494 position: absolute;
4495 top: 58px;
4496 right: 55px;
4497 width: 41px;
4498 }
4499 .feedback-block-three .review {
4500 border: 0;
4501 padding-top: 0;
4502 }
4503 .feedback-block-three .review .text-md {
4504 font-size: 28px;
4505 color: var(--e-global-color-accent);
4506 }
4507 .feedback-block-three h3 {
4508 font-size: 24px;
4509 line-height: 2em;
4510 font-weight: 400;
4511 color: #212529;
4512 }
4513 .feedback-block-three .name {
4514 margin-bottom: 0;
4515 font-size: 20px;
4516 color: #212529;
4517 font-weight: 500;
4518 }
4519 .feedback-block-three .name span {
4520 opacity: 0.5;
4521 font-weight: 400;
4522 padding-left: 5px;
4523 }
4524 .feedback-block-three .author-img {
4525 width: 60px;
4526 height: 60px;
4527 }
4528 .feedback-block-three:hover {
4529 background: #fff;
4530 }
4531
4532 /*==== testimonial 8 css ====*/
4533 .feedback-section-three {
4534 position: relative;
4535 }
4536 .feedback-section-three .feedback_slider {
4537 max-width: 950px;
4538 margin: 0 auto;
4539 overflow: hidden;
4540 }
4541 .feedback-section-three .carousel-inner p {
4542 font-size: 36px;
4543 line-height: 1.888em;
4544 color: #000;
4545 margin-bottom: 55px;
4546 }
4547 .feedback-section-three .name {
4548 font-size: 22px;
4549 color: #000;
4550 font-weight: 500;
4551 }
4552 .feedback-section-three .name:before {
4553 content: "";
4554 position: absolute;
4555 width: 30px;
4556 height: 2px;
4557 background: #000;
4558 left: -45px;
4559 top: 16px;
4560 }
4561 .feedback-section-three .name span {
4562 font-weight: 400;
4563 }
4564 .feedback-section-three .carousel-indicators {
4565 position: static;
4566 width: 100%;
4567 margin: 60px 0 0;
4568 display: flex;
4569 justify-content: center;
4570 }
4571 .feedback-section-three .carousel-indicators button {
4572 width: 80px;
4573 height: 80px;
4574 border-radius: 50%;
4575 border: 3px solid transparent;
4576 opacity: 1;
4577 margin: 0 10px;
4578 transition: all 0.2s linear;
4579 text-indent: 0;
4580 padding: 0;
4581 }
4582 .feedback-section-three .carousel-indicators button:focus, .feedback-section-three .carousel-indicators button:hover {
4583 outline: none;
4584 border-color: #29503d;
4585 background: transparent;
4586 }
4587 .feedback-section-three .carousel-indicators button.active {
4588 border-color: #29503d;
4589 }
4590 .feedback-section-three .carousel-btn {
4591 top: 65px;
4592 width: 50px;
4593 height: 50px;
4594 border-radius: 50%;
4595 border: 1px solid rgba(0, 0, 0, 0.15);
4596 opacity: 1;
4597 line-height: 48px;
4598 text-align: center;
4599 font-size: 30px;
4600 color: #000;
4601 padding: 0;
4602 transition: all 0.3s linear;
4603 position: absolute;
4604 }
4605 .feedback-section-three .carousel-btn:hover, .feedback-section-three .carousel-btn:focus {
4606 border-color: #29503d;
4607 background: #29503d;
4608 color: #fff;
4609 }
4610 .feedback-section-three .carousel-btn.carousel-control-next {
4611 right: 0;
4612 left: auto;
4613 }
4614
4615 @media (max-width: 1024px) {
4616 .feedback-section-four .ezd-grid {
4617 display: block;
4618 }
4619 }
4620 .feedback-section-four .bg-wrapper {
4621 background: #1ea243;
4622 padding: 125px 110px 165px 110px;
4623 transition: 0.3s;
4624 }
4625 @media (min-width: 1200px) and (max-width: 1399px) {
4626 .feedback-section-four .bg-wrapper {
4627 padding: 80px 100px 130px 70px;
4628 }
4629 }
4630 @media (max-width: 1199px) {
4631 .feedback-section-four .bg-wrapper {
4632 padding: 60px 70px 100px 35px;
4633 }
4634 }
4635 @media (max-width: 991px) {
4636 .feedback-section-four .bg-wrapper {
4637 padding: 45px 15px 100px;
4638 }
4639 }
4640 .feedback-section-four .bg-wrapper .icon {
4641 width: 80px;
4642 height: 80px;
4643 background: rgba(255, 255, 255, 0.16);
4644 }
4645 .feedback-section-four .bg-wrapper p {
4646 font-size: 40px;
4647 color: #fff;
4648 line-height: 1.7em;
4649 margin: 50px 0 95px;
4650 transition: 0.3s;
4651 }
4652 @media (min-width: 1200px) and (max-width: 1399px) {
4653 .feedback-section-four .bg-wrapper p {
4654 font-size: 35px;
4655 margin-bottom: 70px;
4656 }
4657 }
4658 @media (min-width: 992px) and (max-width: 1199px) {
4659 .feedback-section-four .bg-wrapper p {
4660 font-size: 25px;
4661 margin-bottom: 70px;
4662 }
4663 }
4664 @media (max-width: 991px) {
4665 .feedback-section-four .bg-wrapper p {
4666 font-size: 25px;
4667 margin: 30px 0 40px;
4668 }
4669 }
4670 .feedback-section-four .bg-wrapper .name {
4671 font-size: 20px;
4672 transition: 0.3s;
4673 }
4674 .feedback-section-four .bg-wrapper .slider-arrows {
4675 display: flex;
4676 justify-content: center;
4677 align-items: center;
4678 position: absolute;
4679 list-style: none;
4680 left: 0;
4681 bottom: 0;
4682 margin-bottom: 0;
4683 padding: 0;
4684 }
4685 @media (max-width: 991px) {
4686 .feedback-section-four .bg-wrapper .slider-arrows {
4687 right: 0;
4688 padding: 0;
4689 justify-content: space-between;
4690 }
4691 }
4692 .feedback-section-four .bg-wrapper .slider-arrows li {
4693 width: 60px;
4694 height: 60px;
4695 font-size: 22px;
4696 text-align: center;
4697 line-height: 65px;
4698 color: #fff;
4699 cursor: pointer;
4700 transition: all 0.2s linear;
4701 border-left: 1px solid rgba(255, 255, 255, 0.14);
4702 background: rgba(255, 255, 255, 0.13);
4703 }
4704 .feedback-section-four .bg-wrapper .slider-arrows li:hover {
4705 background: #fff;
4706 color: #000;
4707 }
4708
4709 .feedback-section-four .slider-wrapper {
4710 position: absolute;
4711 width: 79vw;
4712 right: -42vw;
4713 bottom: 10%;
4714 }
4715 @media (min-width: 1921px) {
4716 .feedback-section-four .slider-wrapper {
4717 right: -28vw;
4718 width: 55vw;
4719 }
4720 }
4721 @media (max-width: 1600px) {
4722 .feedback-section-four .slider-wrapper {
4723 right: -30vw;
4724 }
4725 }
4726 @media (max-width: 1400px) {
4727 .feedback-section-four .slider-wrapper {
4728 right: -12vw;
4729 }
4730 }
4731 @media (min-width: 992px) and (max-width: 1199px) {
4732 .feedback-section-four .slider-wrapper {
4733 width: 75vw;
4734 bottom: 10%;
4735 right: -22vw;
4736 }
4737 }
4738 @media (min-width: 1200px) and (max-width: 1399px) {
4739 .feedback-section-four .slider-wrapper {
4740 right: -28vw;
4741 }
4742 }
4743 @media (max-width: 991px) {
4744 .feedback-section-four .slider-wrapper {
4745 width: 100%;
4746 position: static;
4747 }
4748 }
4749 .feedback-section-four .slider-wrapper .item {
4750 margin: 0 15px;
4751 }
4752 .feedback-section-four .slider-wrapper .slick-dots {
4753 position: absolute;
4754 margin: 0;
4755 padding: 0;
4756 bottom: -14%;
4757 left: 20%;
4758 width: auto;
4759 }
4760 @media (max-width: 1024px) {
4761 .feedback-section-four .slider-wrapper .slick-dots {
4762 position: relative;
4763 margin-top: 15px;
4764 left: 0;
4765 bottom: 0;
4766 display: block;
4767 }
4768 }
4769 .feedback-section-four .slider-wrapper .slick-dots li {
4770 width: auto;
4771 height: auto;
4772 margin: 0 auto;
4773 }
4774 .feedback-section-four .slider-wrapper .slick-dots li button {
4775 text-indent: -50000px;
4776 width: 8px;
4777 height: 8px;
4778 border-radius: 50%;
4779 margin: 0 5px;
4780 background: #e4e4e4;
4781 transition: all 0.3s ease-in-out;
4782 padding: 0;
4783 }
4784 .feedback-section-four .slider-wrapper .slick-dots li.slick-active button {
4785 background: var(--e-global-color-accent);
4786 }
4787 @media (min-width: 1400px) {
4788 .feedback-section-four .col-lg-6 {
4789 flex: 0 0 auto;
4790 width: 58.33333333%;
4791 }
4792 }
4793 @media (max-width: 1024px) {
4794 .feedback-section-four .col-lg-6 {
4795 width: 100%;
4796 max-width: 100%;
4797 padding-left: 15px;
4798 padding-right: 15px;
4799 margin-bottom: 40px;
4800 }
4801 }
4802 @media (min-width: 992px) {
4803 .feedback-section-four .col-lg-6 {
4804 flex: 0 0 auto;
4805 width: 50%;
4806 }
4807 }
4808
4809 .testimonial-slider .arrow {
4810 width: 45px;
4811 height: 2px;
4812 background: #989dad;
4813 transition: all 0.3s ease-in-out;
4814 display: block;
4815 margin-top: 12px;
4816 position: relative;
4817 }
4818 .testimonial-slider .arrow::before, .testimonial-slider .arrow::after {
4819 content: "";
4820 position: absolute;
4821 width: 15px;
4822 height: 2px;
4823 left: -2px;
4824 background-color: #bdb4b4;
4825 transition: all 0.3s ease-in-out;
4826 }
4827 .testimonial-slider .arrow::before {
4828 transform: rotate(45deg);
4829 right: -1px;
4830 left: auto;
4831 bottom: 6px;
4832 }
4833 .testimonial-slider .arrow::after {
4834 transform: rotate(-45deg);
4835 right: -1px;
4836 left: auto;
4837 top: 6px;
4838 }
4839 .testimonial-slider .next {
4840 height: 25px;
4841 width: 27px;
4842 position: absolute;
4843 top: 50%;
4844 transform: translateY(-50%);
4845 transition: all 0.3s ease-in-out;
4846 right: -50px;
4847 cursor: pointer;
4848 }
4849 .testimonial-slider .next:hover {
4850 right: -50px;
4851 }
4852 .testimonial-slider .next:hover .arrow {
4853 width: 70px;
4854 }
4855
4856 .testimonial-area .testimonial-slider .slick-prev.slick-arrow {
4857 display: none;
4858 }
4859
4860 .carousel {
4861 width: 100%;
4862 margin: 0 auto;
4863 overflow: hidden;
4864 }
4865
4866 .carousel-inner {
4867 display: flex;
4868 transition: transform 0.5s ease-in-out;
4869 }
4870
4871 .carousel-item {
4872 flex: 0 0 100%;
4873 }
4874
4875 .carousel img {
4876 width: 100%;
4877 height: auto;
4878 }
4879
4880 .testimonial-item {
4881 background: #ffffff;
4882 box-shadow: 0 5px 15px -3px rgba(131, 146, 167, 0.25);
4883 border-radius: 8px;
4884 padding: 40px;
4885 margin-bottom: 70px;
4886 transition: 0.3s ease-out;
4887 }
4888 @media only screen and (min-width: 320px) and (max-width: 768px) {
4889 .testimonial-item {
4890 margin-bottom: 50px;
4891 }
4892 }
4893 .testimonial-item:hover {
4894 box-shadow: 0 30px 60px -15px rgba(131, 146, 167, 0.3);
4895 }
4896
4897 /*=== Ratting ===*/
4898 .jobus-review-rating {
4899 font-size: 15px;
4900 display: inline-block;
4901 letter-spacing: 5px;
4902 line-height: 1;
4903 }
4904 .jobus-review-rating i {
4905 font-style: normal;
4906 position: relative;
4907 display: inline-block;
4908 vertical-align: middle;
4909 transition: color 0.2s;
4910 }
4911 .jobus-review-rating i.fa {
4912 font-family: "FontAwesome";
4913 }
4914 .jobus-review-rating i.elementor-star-full {
4915 color: #ffcc4a;
4916 }
4917 .jobus-review-rating i.elementor-star-empty {
4918 color: rgba(0, 0, 0, 0.4);
4919 }
4920 .jobus-review-rating i.elementor-star-1, .jobus-review-rating i.elementor-star-2, .jobus-review-rating i.elementor-star-3, .jobus-review-rating i.elementor-star-4, .jobus-review-rating i.elementor-star-5, .jobus-review-rating i.elementor-star-6, .jobus-review-rating i.elementor-star-7, .jobus-review-rating i.elementor-star-8, .jobus-review-rating i.elementor-star-9 {
4921 color: rgba(0, 0, 0, 0.4);
4922 }
4923 .jobus-review-rating i.elementor-star-1::after, .jobus-review-rating i.elementor-star-2::after, .jobus-review-rating i.elementor-star-3::after, .jobus-review-rating i.elementor-star-4::after, .jobus-review-rating i.elementor-star-5::after, .jobus-review-rating i.elementor-star-6::after, .jobus-review-rating i.elementor-star-7::after, .jobus-review-rating i.elementor-star-8::after, .jobus-review-rating i.elementor-star-9::after {
4924 content: "\f005";
4925 font-family: "FontAwesome";
4926 color: #ffcc4a;
4927 position: absolute;
4928 top: 0;
4929 left: 0;
4930 overflow: hidden;
4931 width: 100%;
4932 z-index: 2;
4933 clip-path: inset(0 100% 0 0);
4934 }
4935 .jobus-review-rating i.elementor-star-1::after {
4936 width: 10%;
4937 clip-path: inset(0 90% 0 0);
4938 }
4939 .jobus-review-rating i.elementor-star-2::after {
4940 width: 20%;
4941 clip-path: inset(0 80% 0 0);
4942 }
4943 .jobus-review-rating i.elementor-star-3::after {
4944 width: 30%;
4945 clip-path: inset(0 70% 0 0);
4946 }
4947 .jobus-review-rating i.elementor-star-4::after {
4948 width: 40%;
4949 clip-path: inset(0 60% 0 0);
4950 }
4951 .jobus-review-rating i.elementor-star-5::after {
4952 width: 50%;
4953 clip-path: inset(0 50% 0 0);
4954 }
4955 .jobus-review-rating i.elementor-star-6::after {
4956 width: 60%;
4957 clip-path: inset(0 40% 0 0);
4958 }
4959 .jobus-review-rating i.elementor-star-7::after {
4960 width: 70%;
4961 clip-path: inset(0 30% 0 0);
4962 }
4963 .jobus-review-rating i.elementor-star-8::after {
4964 width: 80%;
4965 clip-path: inset(0 20% 0 0);
4966 }
4967 .jobus-review-rating i.elementor-star-9::after {
4968 width: 90%;
4969 clip-path: inset(0 10% 0 0);
4970 }
4971 .jobus-review-rating .elementor-screen-only {
4972 position: absolute;
4973 left: -9999px;
4974 width: 1px;
4975 height: 1px;
4976 overflow: hidden;
4977 }
4978
4979 .spel-video-playlist.video-playlist-1 .video_list .video_list_inner .list .videos_meta i {
4980 padding-right: 4px;
4981 }
4982
4983 .ycp .belah .luhur span.about {
4984 display: none;
4985 }
4986 .ycp .belah .luhur {
4987 height: 74px;
4988 }
4989 .ycp .belah .luhur span.tombol {
4990 font-size: 14px;
4991 }
4992 .ycp .belah .luhur span.tombol.vid-next {
4993 float: right;
4994 margin-right: 0;
4995 }
4996
4997 .video_list_area.bg_gradient {
4998 background: linear-gradient(180deg, #ffffff 0%, #f0f3f7 100%);
4999 }
5000 .video_list_area.bg_gradient .accordion .card {
5001 box-shadow: 0 0.3px 0.9px rgba(29, 56, 70, 0.1), 0 1.6px 3.6px rgba(29, 56, 70, 0.13);
5002 }
5003 .video_list_area .art-video-player .art-bottom {
5004 overflow: visible;
5005 }
5006 .video_list_area .art-video-player .art-bottom .art-progress .art-control-progress .art-control-progress-inner .art-progress-highlight span {
5007 background: transparent !important;
5008 }
5009 .video_list_area .art-video-player .art-state {
5010 width: 80px;
5011 height: 80px;
5012 }
5013 .video_list_area .art-video-player .art-state i {
5014 font-size: 28px;
5015 }
5016 .video_list_area .art-video-player .art-mask-show.add_icon .art-danmuku:before {
5017 content: "";
5018 background: rgba(54, 56, 149, 0.5);
5019 border-radius: 5px 5px 0 0;
5020 position: absolute;
5021 left: 0;
5022 top: 0;
5023 height: 100%;
5024 width: 100%;
5025 z-index: 11;
5026 }
5027 .video_list_area.theatermode {
5028 overflow: hidden;
5029 }
5030 .video_list_area.theatermode .row > * {
5031 flex: 0 0 100%;
5032 max-width: 100%;
5033 transition: all 0.3s linear 0s;
5034 }
5035 .video_list_area.theatermode .video_list {
5036 width: 100%;
5037 margin-top: 100px;
5038 }
5039 .video_list_area.theatermode .video_list .video_list_inner .card .card-body .nav li {
5040 width: 100%;
5041 display: block;
5042 }
5043
5044 .art-auto-size {
5045 height: 530px !important;
5046 align-items: flex-start !important;
5047 }
5048
5049 .art-video-player.art-subtitle-show.art-layer-show.art-control-show.art-mask-show.art-fullscreen:hover .art-bottom {
5050 bottom: 0 !important;
5051 }
5052
5053 .art-video-player.art-fullscreen-web {
5054 height: 100% !important;
5055 position: relative !important;
5056 z-index: 10 !important;
5057 }
5058
5059 .art-video-player {
5060 width: 100% !important;
5061 }
5062
5063 .mCSB_scrollTools {
5064 width: 8px;
5065 background: #fff;
5066 border-radius: 4px;
5067 }
5068 .mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
5069 width: 8px;
5070 background: #b8c3cc;
5071 }
5072 .mCSB_scrollTools .mCSB_draggerRail {
5073 width: 8px;
5074 background: #fff;
5075 }
5076
5077 .video_list .play_list_title {
5078 color: #1d2746;
5079 margin-bottom: 32px;
5080 }
5081 .video_list .mCustomScrollBox {
5082 padding-right: 20px;
5083 }
5084 .video_list .mCSB_scrollTools {
5085 width: 8px;
5086 background: #fff;
5087 border-radius: 4px;
5088 }
5089 .video_list .mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
5090 width: 8px;
5091 background: #b8c3cc;
5092 }
5093 .video_list .mCSB_scrollTools .mCSB_draggerRail {
5094 width: 8px;
5095 background: #fff;
5096 }
5097 .video_list .video_list_inner {
5098 max-height: 472px;
5099 padding-right: 0;
5100 }
5101 .video_list .video_list_inner .accordion {
5102 display: grid;
5103 row-gap: 12px;
5104 }
5105 .video_list .video_list_inner .accordion .accordion-panel {
5106 border: none;
5107 border-radius: 0 5px 5px 5px !important;
5108 overflow: hidden;
5109 margin-bottom: 0;
5110 }
5111 .video_list .video_list_inner .accordion .accordion-panel .spe-accordion {
5112 border: none;
5113 border-radius: 0 !important;
5114 background-color: transparent;
5115 margin-bottom: 0;
5116 }
5117 .video_list .video_list_inner .accordion .accordion-panel .spe-accordion:last-child {
5118 margin-bottom: 0;
5119 }
5120 .video_list .video_list_inner .accordion .accordion-panel .spe-accordion .card-header {
5121 border: none !important;
5122 background: transparent;
5123 padding: 0;
5124 }
5125 .video_list .video_list_inner .accordion .accordion-panel .spe-accordion .card-header .list_title {
5126 font-weight: 700;
5127 font-family: "Roboto", sans-serif;
5128 }
5129 .video_list .video_list_inner .accordion .accordion-panel .spe-accordion .card-header button {
5130 padding: 16px 30px 16px 30px;
5131 font-size: 18px;
5132 color: var(--black_800);
5133 font-weight: 500;
5134 text-decoration: none;
5135 margin-bottom: 0;
5136 border: none;
5137 outline: none;
5138 text-transform: inherit;
5139 display: flex;
5140 align-items: center;
5141 background: rgba(255, 255, 255, 0);
5142 }
5143 .video_list .video_list_inner .accordion .accordion-panel .spe-accordion .card-header button .list_count {
5144 color: #7f8493;
5145 font-size: 14px;
5146 font-weight: 400;
5147 position: relative;
5148 margin-left: 11px;
5149 background: transparent;
5150 height: 22px;
5151 display: flex;
5152 align-items: center;
5153 line-height: 1.2;
5154 padding: 3px 7px 5px 7px;
5155 transition: all 0.3s;
5156 min-width: 20px;
5157 border-radius: 2em;
5158 }
5159 .video_list .video_list_inner .accordion .accordion-panel .spe-accordion .card-header button .plus-minus {
5160 margin-left: auto;
5161 right: 20px;
5162 position: absolute;
5163 }
5164 .video_list .video_list_inner .accordion .accordion-panel .spe-accordion .card-header button .plus-minus svg {
5165 line-height: 26px;
5166 color: #425466;
5167 }
5168
5169 .video_list .video_list_inner .accordion .accordion-panel .spe-accordion .card-header button #plus {
5170 display: block;
5171 }
5172
5173 .video_list .video_list_inner .accordion .spe-collapsed .spe-accordion .card-header button #plus {
5174 display: none;
5175 }
5176
5177 .video_list .video_list_inner .accordion .spe-collapsed .spe-accordion .card-header button #minus {
5178 display: block !important;
5179 }
5180
5181 .video_list .video_list_inner .accordion .accordion-panel .spe-accordion .card-header button #minus {
5182 display: none;
5183 }
5184
5185 .video_list .video_list_inner .card .card-body {
5186 padding: 8px 35px 25px 35px;
5187 }
5188 .video_list .video_list_inner .card .card-body .nav {
5189 border: none;
5190 }
5191 .video_list .video_list_inner .card .card-body .nav li {
5192 margin-bottom: 20px;
5193 }
5194 .video_list .video_list_inner .card .card-body .nav li a {
5195 padding: 0;
5196 border: none;
5197 text-decoration: none;
5198 }
5199 .video_list .video_list_inner .card .card-body .nav li a .media .ezd-d-flex {
5200 padding-right: 20px;
5201 }
5202 .video_list .video_list_inner .card .card-body .nav li a .media .ezd-d-flex .video_tab_img {
5203 border-radius: 5px;
5204 position: relative;
5205 overflow: hidden;
5206 }
5207 .video_list .video_list_inner .card .card-body .nav li a .media .ezd-d-flex .video_tab_img img {
5208 height: 100%;
5209 }
5210 .video_list .video_list_inner .card .card-body .nav li a .media .ezd-d-flex .video_tab_img:before {
5211 content: "";
5212 background: rgba(29, 39, 70, 0.55);
5213 position: absolute;
5214 left: 0;
5215 top: 0;
5216 width: 100%;
5217 height: 100%;
5218 opacity: 0;
5219 transition: all 300ms linear 0s;
5220 }
5221 .video_list .video_list_inner .card .card-body .nav li a .media .ezd-d-flex .video_tab_img:after {
5222 content: "\f215";
5223 left: 0;
5224 top: 50%;
5225 transform: translateY(-50%);
5226 width: 100%;
5227 text-align: center;
5228 position: absolute;
5229 color: #fff;
5230 opacity: 0;
5231 transition: all 300ms linear 0s;
5232 }
5233 .video_list .video_list_inner .card .card-body .nav li a .media .media-body h4 {
5234 color: #1d2746;
5235 font-size: 14px;
5236 font-weight: 500;
5237 margin-bottom: 3px;
5238 transition: all 300ms linear 0s;
5239 margin-top: 0;
5240 }
5241 .video_list .video_list_inner .card .card-body .nav li a .media .media-body .list {
5242 line-height: 1;
5243 }
5244 .video_list .video_list_inner .card .card-body .nav li a .media .media-body .list div {
5245 display: inline-block;
5246 color: #7f8493;
5247 font-weight: 400;
5248 font-size: 12px;
5249 margin-right: 20px;
5250 }
5251 .video_list .video_list_inner .card .card-body .nav li a .media .media-body .list div:last-child {
5252 margin-right: 0;
5253 }
5254 .video_list .video_list_inner .card .card-body .nav li a .media .media-body .list .dot {
5255 position: relative;
5256 }
5257 .video_list .video_list_inner .card .card-body .nav li a .media .media-body .list .dot::before {
5258 content: "";
5259 width: 3px;
5260 height: 3px;
5261 background: #7f8493;
5262 border-radius: 50%;
5263 position: absolute;
5264 left: -12px;
5265 top: 62%;
5266 transform: translateY(-62%);
5267 }
5268 .video_list .video_list_inner .card .card-body .nav li a:hover .media.d-flex .video_tab_img:before, .video_list .video_list_inner .card .card-body .nav li a:hover .media.d-flex .video_tab_img:after, .video_list .video_list_inner .card .card-body .nav li a.active .media.d-flex .video_tab_img:before, .video_list .video_list_inner .card .card-body .nav li a.active .media.d-flex .video_tab_img:after {
5269 opacity: 1;
5270 }
5271 .video_list .video_list_inner .card .card-body .nav li a:hover .media.d-flex .media-body h4, .video_list .video_list_inner .card .card-body .nav li a.active .media.d-flex .media-body h4 {
5272 color: var(--e-global-color-accent);
5273 }
5274 .video_list .video_list_inner .card .card-body .nav li:hover .media.d-flex .media-body h4 {
5275 text-decoration-color: var(--e-global-color-accent);
5276 text-decoration: underline;
5277 text-underline-offset: 4px;
5278 }
5279 .video_list .video_list_inner .card .card-body .nav li:last-child {
5280 margin-bottom: 0;
5281 }
5282
5283 .art-video-player.art-layer-show .art-layers {
5284 display: none !important;
5285 }
5286
5287 .art-control.art-control-control13.art-control-onlyText {
5288 display: none;
5289 }
5290
5291 /* End Video Area css
5292 ============================================================================================ */
5293 /* Video Slider Area css
5294 ============================================================================================ */
5295 .gallery-thumbs {
5296 margin-top: 0;
5297 padding-left: 20px;
5298 padding-right: 20px;
5299 }
5300 .gallery-thumbs .item {
5301 padding-left: 10px;
5302 padding-right: 10px;
5303 }
5304 .gallery-thumbs .item img {
5305 max-width: 100%;
5306 }
5307 .gallery-thumbs .item .caption_text {
5308 padding-left: 15px;
5309 padding-right: 15px;
5310 }
5311 .gallery-thumbs .item .caption_text svg {
5312 width: 23px;
5313 height: 23px;
5314 }
5315 .gallery-thumbs .item .caption_text h4 {
5316 font-size: 12px;
5317 margin-top: 8px;
5318 }
5319
5320 .next svg,
5321 .prev svg {
5322 width: 10px;
5323 }
5324
5325 .prev {
5326 left: 8px;
5327 }
5328
5329 .next {
5330 right: 8px;
5331 }
5332
5333 .video_slider_area .gallery_inner_thumb {
5334 position: relative;
5335 border-radius: 5px;
5336 overflow: hidden;
5337 }
5338 .video_slider_area .gallery_inner_thumb:before {
5339 content: "";
5340 height: 100%;
5341 width: 100%;
5342 background: linear-gradient(180deg, rgba(44, 44, 81, 0) 0%, rgba(44, 44, 81, 0.9) 73.67%);
5343 position: absolute;
5344 left: 0;
5345 bottom: 0;
5346 border-radius: 5px;
5347 top: 7px;
5348 }
5349 .video_slider_area .gallery-top .art-video-player.art-auto-size {
5350 height: 410px !important;
5351 }
5352 .video_slider_area .gallery-top .art-video-player.art-auto-size:hover .art-bottom {
5353 transform: translateY(0);
5354 }
5355 .video_slider_area .gallery-top .art-video-player {
5356 border-radius: 10px;
5357 overflow: hidden;
5358 }
5359 .video_slider_area .gallery-top .art-video-player .art-bottom {
5360 bottom: 0;
5361 background: rgba(235, 245, 250, 0.1);
5362 border-radius: 0 0 5px 5px;
5363 transform: translateY(48px);
5364 overflow: visible !important;
5365 }
5366 .video_slider_area .gallery-top .art-video-player .art-bottom .art-controls .art-control {
5367 color: #fff;
5368 }
5369 .video_slider_area .gallery-top .art-video-player .art-bottom .art-controls .art-control.art-control-subtitle[aria-label="Hide subtitle"] svg {
5370 fill: rgba(235, 245, 250, 0.5);
5371 }
5372 .video_slider_area .gallery-top .art-video-player .art-bottom .art-controls .art-control.art-control-subtitle[aria-label="Show subtitle"] svg {
5373 fill: #fff;
5374 }
5375 .video_slider_area .gallery-top .art-video-player .art-bottom .art-controls .art-control.art-control-setting[aria-label="Hide subtitle"] svg {
5376 fill: #fff;
5377 }
5378 .video_slider_area .gallery-top .art-video-player .art-bottom .art-controls .art-control.art-control-setting[aria-label="Show subtitle"] svg {
5379 fill: rgba(235, 245, 250, 0.5);
5380 }
5381 .video_slider_area .gallery-top .art-video-player .art-bottom .art-controls .art-control.art-control-control13.art-control-onlyText {
5382 display: none;
5383 }
5384 .video_slider_area .gallery-top .art-video-player .art-bottom .art-controls .art-control .art-icon svg {
5385 fill: rgba(235, 245, 250, 0.5);
5386 }
5387 .video_slider_area .gallery-top .art-video-player .art-bottom .art-controls .art-control .art-icon svg:hover {
5388 fill: #fff !important;
5389 }
5390 .video_slider_area .gallery-top .art-video-player .art-bottom .art-controls .art-control-volume .art-volume-panel .art-volume-slider-handle {
5391 background: #fff;
5392 }
5393 .video_slider_area .gallery-top .art-video-player .art-bottom .art-controls .art-control-volume .art-volume-panel .art-volume-slider-handle:after {
5394 background: rgba(235, 245, 250, 0.5);
5395 }
5396 .video_slider_area .gallery-top .art-video-player .art-bottom .art-controls .art-control-volume .art-volume-panel .art-volume-slider-handle:before, .video_slider_area .gallery-top .art-video-player .art-bottom .art-controls .art-control-volume .art-volume-panel .art-volume-slider-handle:after {
5397 background: #fff;
5398 }
5399 .video_slider_area .gallery-top .art-video-player .art-bottom .art-progress {
5400 background: rgba(235, 245, 250, 0.1);
5401 }
5402 .video_slider_area .gallery-top .art-video-player .art-bottom .art-progress .art-control-progress {
5403 height: 2px;
5404 transition: all 300ms linear 0s;
5405 }
5406 .video_slider_area .gallery-top .art-video-player .art-bottom .art-progress .art-control-progress:hover {
5407 height: 4px;
5408 margin-top: -2px;
5409 }
5410 .video_slider_area.theatermode .gallery-top .artplayer-app,
5411 .video_slider_area.theatermode .gallery-top .art-video-player {
5412 height: 717px !important;
5413 }
5414 .video_slider_area.theatermode .gallery-top .slide_text {
5415 margin-top: 30px;
5416 padding-left: 0;
5417 padding-bottom: 4px;
5418 }
5419 .video_slider_area.theatermode .gallery-top .slide_text p {
5420 max-width: 100%;
5421 }
5422
5423 .slide_text {
5424 padding-left: 8px;
5425 transition: all 300ms linear 0s;
5426 }
5427 .slide_text a {
5428 text-decoration: none !important;
5429 }
5430 .slide_text a .video_title {
5431 font-size: 26px;
5432 font-weight: 500;
5433 margin: 0;
5434 }
5435 .slide_text p {
5436 font-size: 16px;
5437 color: #54595d;
5438 max-width: 420px;
5439 margin: 25px 0 12px;
5440 transition: all 300ms linear 0s;
5441 }
5442 .slide_text .video_user a {
5443 color: #425466;
5444 font-size: 14px;
5445 margin-right: 15px;
5446 display: inline-block;
5447 }
5448 .slide_text .video_user img {
5449 width: auto;
5450 max-width: 100%;
5451 display: inline-block;
5452 position: relative;
5453 top: -1px;
5454 }
5455
5456 .gallery_main_area {
5457 position: relative;
5458 }
5459 .gallery_main_area .prev,
5460 .gallery_main_area .next {
5461 position: absolute;
5462 top: 50%;
5463 transform: translateY(-50%);
5464 cursor: pointer;
5465 box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.04), 0 4px 8px 0 rgba(0, 0, 0, 0.2);
5466 height: 36px;
5467 width: 36px;
5468 border-radius: 50%;
5469 border: 1px solid #dfe1e5;
5470 z-index: 0;
5471 color: #848d95;
5472 background-color: #fff;
5473 display: flex !important;
5474 justify-content: center;
5475 align-items: center;
5476 }
5477 .gallery_main_area .prev:hover svg path,
5478 .gallery_main_area .next:hover svg path {
5479 fill: var(--e-global-color-accent);
5480 }
5481 .gallery_main_area .prev.slick-disabled,
5482 .gallery_main_area .next.slick-disabled {
5483 display: none !important;
5484 }
5485 .gallery_main_area .prev.prev,
5486 .gallery_main_area .next.prev {
5487 left: -20px;
5488 }
5489 .gallery_main_area .prev.next,
5490 .gallery_main_area .next.next {
5491 right: -20px;
5492 }
5493 .gallery_main_area .prev:hover, .gallery_main_area .prev.slick-current,
5494 .gallery_main_area .next:hover,
5495 .gallery_main_area .next.slick-current {
5496 color: #3c4146;
5497 }
5498 .gallery_main_area .gallery-thumbs {
5499 margin-top: 45px;
5500 }
5501 .gallery_main_area .gallery-thumbs .slick-track {
5502 margin: 0 -15px;
5503 }
5504 .gallery_main_area .gallery-thumbs .item {
5505 padding: 0 15px;
5506 position: relative;
5507 cursor: pointer;
5508 }
5509 .gallery_main_area .gallery-thumbs .item > img {
5510 width: 100%;
5511 }
5512 .gallery_main_area .gallery-thumbs .item .caption_text .play-icon {
5513 position: absolute;
5514 right: 0;
5515 top: 50%;
5516 transform: translateY(-50%) translateX(-50%);
5517 text-align: center;
5518 left: 50%;
5519 display: none;
5520 }
5521 .gallery_main_area .gallery-thumbs .item .caption_text .play-icon i {
5522 font-size: 18px;
5523 }
5524 .gallery_main_area .gallery-thumbs .item .caption_text img {
5525 margin: auto !important;
5526 }
5527 .gallery_main_area .gallery-thumbs .item .caption_text .thumbnail_title {
5528 color: #fff;
5529 font-size: 14px;
5530 font-weight: 400;
5531 margin-bottom: 0;
5532 text-align: center;
5533 position: absolute;
5534 bottom: 15px;
5535 transform: translateX(-50%);
5536 left: 50%;
5537 width: 95%;
5538 }
5539 .gallery_main_area .gallery-thumbs .item .caption_text svg {
5540 opacity: 0;
5541 }
5542 .gallery_main_area .gallery-thumbs .item:hover .caption_text svg {
5543 opacity: 1;
5544 }
5545 .gallery_main_area .gallery-thumbs .item.slick-current .caption_text svg {
5546 opacity: 1;
5547 }
5548 .gallery_main_area .gallery-thumbs .item.slick-current .caption_text .play-icon {
5549 display: flex;
5550 }
5551 .gallery_main_area .gallery-thumbs .slick-prev,
5552 .gallery_main_area .gallery-thumbs .slick-next {
5553 z-index: 5;
5554 }
5555 .gallery_main_area .gallery-thumbs .slick-prev::before,
5556 .gallery_main_area .gallery-thumbs .slick-next::before {
5557 content: "";
5558 font-size: 60px;
5559 color: #425466;
5560 opacity: 1;
5561 background-image: url(../img/svg/arrow_left.svg);
5562 }
5563 .gallery_main_area .gallery-thumbs .slick-prev {
5564 left: 0;
5565 }
5566 .gallery_main_area .gallery-thumbs .slick-next {
5567 right: 0;
5568 }
5569
5570 .social_option {
5571 margin-top: 32px;
5572 }
5573
5574 .social_option .count_div.active i {
5575 color: var(--e-global-color-accent);
5576 }
5577
5578 .social_option .count_div {
5579 display: inline-block;
5580 line-height: 40px;
5581 font-size: 14px;
5582 margin-right: 15px;
5583 color: #425466;
5584 }
5585
5586 .social_option .count_div a,
5587 .social_option .count_div i {
5588 color: #425466;
5589 margin-right: 2px;
5590 }
5591
5592 .social_option .share_gropu {
5593 position: relative;
5594 display: inline-block;
5595 width: 160px;
5596 transition: all 300ms linear 0s;
5597 }
5598
5599 .social_option .share_gropu .nav {
5600 position: absolute;
5601 left: 0;
5602 top: 0;
5603 transition: all 300ms linear 0s;
5604 transform: perspective(1px) translateZ(0);
5605 transform-origin: 0 50%;
5606 transition-property: transform;
5607 transform: scaleX(0);
5608 }
5609
5610 .social_option .share_gropu.active {
5611 width: 150px;
5612 }
5613
5614 .social_option .share_gropu.active .nav {
5615 transform: scaleX(1);
5616 }
5617
5618 .social_option .nav {
5619 background: rgba(76, 76, 241, 0.2);
5620 border-radius: 20px;
5621 box-shadow: 0 0.3px 0.9px rgba(29, 56, 70, 0.1), 0 1.6px 3.6px rgba(29, 56, 70, 0.13);
5622 padding-right: 12px;
5623 }
5624
5625 .social_option .nav li {
5626 display: inline-block;
5627 margin-right: 10px;
5628 }
5629
5630 .social_option .nav li i {
5631 color: #3c4146;
5632 }
5633
5634 .social_option .nav li:first-child a {
5635 background: #fafcfc;
5636 box-shadow: 0 0 3.6px rgba(29, 56, 70, 0.1);
5637 border-radius: 20px;
5638 height: 42px;
5639 width: 42px;
5640 text-align: center;
5641 }
5642
5643 .social_option .nav li a {
5644 color: #373b46;
5645 display: inline-block;
5646 line-height: 42px;
5647 }
5648
5649 .social_option .nav li a i {
5650 position: relative;
5651 top: 2px;
5652 }
5653
5654 .social_option .nav li:hover a {
5655 color: var(--e-global-color-accent);
5656 }
5657
5658 .status_area {
5659 margin-top: 125px;
5660 }
5661 .status_area .status_inner {
5662 background: #ffffff;
5663 box-shadow: 0 1px 3px rgba(12, 0, 46, 0.1);
5664 border-radius: 5px;
5665 padding: 25px 50px;
5666 }
5667 .status_area .status_inner .media {
5668 align-self: center;
5669 align-items: center;
5670 }
5671 .status_area .status_inner .media .d-flex {
5672 margin-right: 86px;
5673 }
5674 .status_area .status_inner .media .media-body {
5675 align-self: center;
5676 }
5677 .status_area .status_inner .media .media-body h4 {
5678 font-size: 30px;
5679 font-weight: 700;
5680 margin-bottom: 0;
5681 }
5682 .status_area .status_inner .media .media-right .main_btn {
5683 background: var(--e-global-color-accent);
5684 color: #fff;
5685 line-height: 60px;
5686 padding: 0 37px;
5687 font-size: 20px;
5688 font-weight: 700;
5689 }
5690 .status_area .status_inner .media .media-right .main_btn:hover {
5691 color: #fff;
5692 background: var(--e-global-color-accent);
5693 }
5694
5695 .art-state,
5696 .play-icon {
5697 width: 40px;
5698 height: 40px;
5699 background: #fff;
5700 border-radius: 50%;
5701 display: flex;
5702 justify-content: center;
5703 align-items: center;
5704 }
5705
5706 .art-state i,
5707 .play-icon i {
5708 text-shadow: 0 6px 12px rgba(76, 76, 241, 0.5);
5709 color: var(--e-global-color-accent);
5710 }
5711
5712 .video_popup_slider {
5713 padding: 120px 0;
5714 background: #ffffff;
5715 }
5716 .video_popup_slider .container {
5717 position: relative;
5718 }
5719 .video_popup_slider .prev1,
5720 .video_popup_slider .next1 {
5721 position: absolute;
5722 top: 50%;
5723 transform: translateY(-50%);
5724 height: 50px;
5725 width: 50px;
5726 background: #54595d;
5727 opacity: 0.5;
5728 border-radius: 50%;
5729 transition: all 300ms linear 0s;
5730 cursor: pointer;
5731 text-align: center;
5732 }
5733 .video_popup_slider .prev1 i,
5734 .video_popup_slider .next1 i {
5735 color: #fff;
5736 font-size: 30px;
5737 position: relative;
5738 top: 10px;
5739 }
5740 .video_popup_slider .prev1:hover,
5741 .video_popup_slider .next1:hover {
5742 opacity: 1;
5743 }
5744 .video_popup_slider .prev1.slick-disabled,
5745 .video_popup_slider .next1.slick-disabled {
5746 opacity: 0;
5747 visibility: hidden;
5748 }
5749 .video_popup_slider .prev1 {
5750 left: 25px;
5751 }
5752 .video_popup_slider .next1 {
5753 right: 25px;
5754 }
5755 .video_popup_slider .popup_slick {
5756 margin-left: -15px;
5757 margin-right: -15px;
5758 }
5759 .video_popup_slider .popup_slick .item {
5760 padding-left: 15px;
5761 padding-right: 15px;
5762 border-radius: 5px;
5763 overflow: hidden;
5764 text-align: center;
5765 cursor: pointer;
5766 }
5767 .video_popup_slider .popup_slick .item img {
5768 max-width: 100%;
5769 }
5770 .video_popup_slider .popup_slick .item:hover .item_modal_box .text svg {
5771 opacity: 1;
5772 transform: scale(1);
5773 }
5774 .video_popup_slider .popup_slick .item .item_modal_box {
5775 position: relative;
5776 border-radius: 5px;
5777 overflow: hidden;
5778 height: 320px;
5779 }
5780 .video_popup_slider .popup_slick .item .item_modal_box video::-moz-range-track {
5781 display: none !important;
5782 }
5783 .video_popup_slider .popup_slick .item .item_modal_box video::-moz-range-thumb {
5784 display: none !important;
5785 }
5786 .video_popup_slider .popup_slick .item .item_modal_box:before {
5787 content: "";
5788 position: absolute;
5789 left: 0;
5790 width: 100%;
5791 bottom: 0;
5792 height: 145px;
5793 background: linear-gradient(180deg, rgba(29, 56, 70, 0) 0%, rgba(29, 56, 70, 0.8) 100%);
5794 }
5795 .video_popup_slider .popup_slick .item .item_modal_box video {
5796 height: 320px;
5797 width: 100%;
5798 z-index: 3;
5799 }
5800 .video_popup_slider .popup_slick .item .item_modal_box .text {
5801 bottom: 0;
5802 left: 0;
5803 width: 100%;
5804 text-align: center;
5805 z-index: 2;
5806 padding: 0 15px;
5807 }
5808 .video_popup_slider .popup_slick .item .item_modal_box .text svg,
5809 .video_popup_slider .popup_slick .item .item_modal_box .text img {
5810 position: absolute;
5811 left: 50%;
5812 top: 39%;
5813 margin-left: -20px;
5814 margin-top: -20px;
5815 opacity: 0;
5816 transform: scale(0.8);
5817 transition: all 300ms linear 0s;
5818 }
5819 .video_popup_slider .popup_slick .item .item_modal_box .text h4 {
5820 color: #fff;
5821 font-size: 16px;
5822 font-weight: 400;
5823 margin-bottom: 17px;
5824 position: absolute;
5825 width: 100%;
5826 bottom: 0;
5827 text-align: center;
5828 padding: 0 15px;
5829 left: 0;
5830 }
5831 .video_popup_slider .popup_slick .item .item_modal_box .text img:hover {
5832 transform: scale(1);
5833 opacity: 1;
5834 }
5835
5836 .modal_slider_css .modal-dialog {
5837 max-width: 100%;
5838 margin: 0;
5839 }
5840 .modal_slider_css .modal-dialog .modal-content {
5841 background: #4b5155;
5842 min-height: 100vh;
5843 }
5844 .modal_slider_css .modal-dialog .modal-content .modal-header {
5845 border: none;
5846 padding: 0;
5847 padding-top: 25px;
5848 width: 100%;
5849 height: 76px;
5850 position: relative;
5851 }
5852 .modal_slider_css .modal-dialog .modal-content .modal-header .button_social {
5853 position: absolute;
5854 right: 0;
5855 }
5856 .modal_slider_css .modal-dialog .modal-content .modal-header .close {
5857 height: 50px;
5858 width: 50px;
5859 background: #41484d;
5860 text-align: center;
5861 border-radius: 50%;
5862 font-size: 20px;
5863 color: #fff;
5864 opacity: 1;
5865 margin: 0;
5866 margin-right: 25px;
5867 float: none;
5868 display: inline-block;
5869 transition: all 300ms linear 0s;
5870 }
5871 .modal_slider_css .modal-dialog .modal-content .modal-header .close i {
5872 position: relative;
5873 left: -1px;
5874 top: -1px;
5875 }
5876 .modal_slider_css .modal-dialog .modal-content .modal-header .close:hover {
5877 background: var(--e-global-color-accent);
5878 }
5879 .modal_slider_css .modal-dialog .modal-content .modal-header .share_icon {
5880 height: 50px;
5881 width: 50px;
5882 background: #41484d;
5883 text-align: center;
5884 border-radius: 50%;
5885 font-size: 20px;
5886 display: inline-block;
5887 color: #fff;
5888 opacity: 1;
5889 margin: 0;
5890 margin-right: 27px;
5891 padding: 1rem 1rem;
5892 cursor: pointer;
5893 transition: all 300ms linear 0s;
5894 }
5895 .modal_slider_css .modal-dialog .modal-content .modal-header .share_icon i {
5896 position: relative;
5897 left: -1px;
5898 top: -1px;
5899 }
5900 .modal_slider_css .modal-dialog .modal-content .modal-header .share_icon:hover {
5901 background: var(--e-global-color-accent);
5902 }
5903 .modal_slider_css .modal-dialog .modal-content .modal-header .modal_social {
5904 position: absolute;
5905 right: 106px;
5906 top: 0;
5907 background: #393d40;
5908 width: 171px;
5909 border-radius: 25px;
5910 justify-content: flex-end;
5911 box-shadow: 0 0 6px rgba(0, 0, 0, 0.1);
5912 transform-origin: 100% 50%;
5913 transition-property: transform;
5914 transform: scaleX(0);
5915 transition: all 300ms linear 0s;
5916 }
5917 .modal_slider_css .modal-dialog .modal-content .modal-header .modal_social li a {
5918 display: inline-block;
5919 margin-right: 15px;
5920 color: rgba(255, 255, 255, 0.5);
5921 transition: all 300ms linear 0s;
5922 line-height: 50px;
5923 font-size: 18px;
5924 }
5925 .modal_slider_css .modal-dialog .modal-content .modal-header .modal_social li a i {
5926 position: relative;
5927 top: 2px;
5928 }
5929 .modal_slider_css .modal-dialog .modal-content .modal-header .modal_social li a:hover {
5930 color: #fff;
5931 }
5932 .modal_slider_css .modal-dialog .modal-content .modal-header .modal_social li:last-child a {
5933 height: 50px;
5934 width: 50px;
5935 border-radius: 50%;
5936 text-align: center;
5937 background: #41484d;
5938 box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.04), 0 4px 8px rgba(0, 0, 0, 0.2);
5939 font-size: 22px;
5940 line-height: 56px;
5941 margin-right: 0;
5942 }
5943 .modal_slider_css .modal-dialog .modal-content .modal-header .modal_social.active {
5944 transform: scaleX(1);
5945 }
5946 .modal_slider_css .modal-dialog .modal-content .modal-body {
5947 padding-left: 0;
5948 padding-right: 0;
5949 }
5950 .modal_slider_css .modal-dialog .modal-content .modal-body #modal_slider {
5951 padding-left: 0;
5952 }
5953 .modal_slider_css .modal-dialog .modal-content .modal-body .posting {
5954 position: relative;
5955 max-width: 1350px;
5956 margin: auto;
5957 }
5958 .modal_slider_css .modal-dialog .modal-content .modal-body .posting .video_item {
5959 transform: scale(0.8);
5960 margin: 0 20px;
5961 transition: all 300ms linear 0s;
5962 border-radius: 10px;
5963 overflow: hidden;
5964 position: relative;
5965 }
5966 .modal_slider_css .modal-dialog .modal-content .modal-body .posting .video_item h4 {
5967 position: absolute;
5968 left: 0;
5969 bottom: 10px;
5970 width: 100%;
5971 text-align: center;
5972 color: #fff;
5973 font-size: 20px;
5974 font-weight: 400;
5975 opacity: 0;
5976 visibility: hidden;
5977 z-index: 3;
5978 }
5979 .modal_slider_css .modal-dialog .modal-content .modal-body .posting .video_item .video-js {
5980 max-width: 100%;
5981 height: 669px;
5982 border-radius: 5px;
5983 overflow: hidden;
5984 }
5985 .modal_slider_css .modal-dialog .modal-content .modal-body .posting .video_item .video-js .vjs-poster {
5986 background-size: cover;
5987 }
5988 .modal_slider_css .modal-dialog .modal-content .modal-body .posting .video_item .video-js .vjs-progress-control.vjs-control {
5989 margin: 0;
5990 margin-right: -40px;
5991 }
5992 .modal_slider_css .modal-dialog .modal-content .modal-body .posting .video_item .video-js .vjs-time-tooltip {
5993 display: none;
5994 }
5995 .modal_slider_css .modal-dialog .modal-content .modal-body .posting .video_item .video-js .vjs-progress-control .vjs-play-progress:before {
5996 display: none;
5997 }
5998 .modal_slider_css .modal-dialog .modal-content .modal-body .posting .video_item .video-js .vjs-progress-control .vjs-play-progress {
5999 background-color: #fff;
6000 height: 5px;
6001 }
6002 .modal_slider_css .modal-dialog .modal-content .modal-body .posting .video_item .video-js .vjs-progress-control .vjs-load-progress {
6003 background-color: #9da2a6;
6004 height: 5px;
6005 }
6006 .modal_slider_css .modal-dialog .modal-content .modal-body .posting .video_item .video-js .vjs-progress-control .vjs-slider:before {
6007 height: 5px;
6008 background: #9da2a6;
6009 }
6010 .modal_slider_css .modal-dialog .modal-content .modal-body .posting .video_item .video-js .vjs-big-play-button {
6011 background: url(../img/play-button.png) no-repeat;
6012 border: none;
6013 display: none;
6014 }
6015 .modal_slider_css .modal-dialog .modal-content .modal-body .posting .video_item .video-js .vjs-control-bar {
6016 position: absolute;
6017 top: 0;
6018 left: 0;
6019 width: 100%;
6020 background-color: transparent;
6021 height: 5px;
6022 }
6023 .modal_slider_css .modal-dialog .modal-content .modal-body .posting .video_item .video-js .vjs-control-bar .vjs-button {
6024 display: none;
6025 }
6026 .modal_slider_css .modal-dialog .modal-content .modal-body .posting .video_item .video-js .vjs-control-bar .vjs-current-time {
6027 display: none;
6028 }
6029 .modal_slider_css .modal-dialog .modal-content .modal-body .posting .video_item .video-js .vjs-control-bar .vjs-duration {
6030 display: none;
6031 }
6032 .modal_slider_css .modal-dialog .modal-content .modal-body .posting .video_item video {
6033 border-radius: 5px;
6034 overflow: hidden;
6035 }
6036 .modal_slider_css .modal-dialog .modal-content .modal-body .posting .video_item img {
6037 max-width: 100%;
6038 }
6039 .modal_slider_css .modal-dialog .modal-content .modal-body .posting li .video_item {
6040 position: relative;
6041 filter: blur(5px);
6042 transition: all 300ms linear 0s;
6043 }
6044 .modal_slider_css .modal-dialog .modal-content .modal-body .posting li .video_item:before {
6045 content: "";
6046 position: absolute;
6047 left: 0;
6048 top: 0;
6049 width: 100%;
6050 height: 100%;
6051 z-index: 2;
6052 background: rgba(107, 112, 127, 0.5);
6053 opacity: 0;
6054 transition: all 300ms linear 0s;
6055 }
6056 .modal_slider_css .modal-dialog .modal-content .modal-body .posting li .video_item:hover {
6057 filter: blur(0);
6058 }
6059 .modal_slider_css .modal-dialog .modal-content .modal-body .posting li .video_item:hover:before {
6060 opacity: 1;
6061 }
6062 .modal_slider_css .modal-dialog .modal-content .modal-body .posting li.slick-current .video_item {
6063 transform: scale(1);
6064 filter: blur(0);
6065 border-radius: 0 0 5px 5px;
6066 }
6067 .modal_slider_css .modal-dialog .modal-content .modal-body .posting li.slick-current .video_item:before {
6068 display: none;
6069 }
6070 .modal_slider_css .modal-dialog .modal-content .modal-body .posting li.slick-current .video_item:after {
6071 content: "";
6072 background: linear-gradient(180deg, rgba(29, 56, 70, 0) 0%, rgba(29, 56, 70, 0.8) 100%);
6073 position: absolute;
6074 left: 0;
6075 bottom: 0;
6076 height: 285px;
6077 width: 100%;
6078 }
6079 .modal_slider_css .modal-dialog .modal-content .modal-body .posting li.slick-current .video_item h4 {
6080 visibility: visible;
6081 opacity: 1;
6082 }
6083 .modal_slider_css .modal-dialog .modal-content .modal-body .posting li.slick-current .video_item .vjs-big-play-button {
6084 display: block;
6085 }
6086 .modal_slider_css .modal-dialog .modal-content .modal-body .posting li.slick-current .video_item .vjs-playing .vjs-big-play-button {
6087 display: none;
6088 }
6089 .modal_slider_css .modal-dialog .modal-content .modal-body .posting li.slick-current .video_item .vjs-has-started .vjs-big-play-button {
6090 display: none;
6091 }
6092 .modal_slider_css .modal-dialog .modal-content .modal-body .posting li.slick-current .video_item .vjs-ended .vjs-big-play-button {
6093 display: block;
6094 }
6095 .modal_slider_css .modal-dialog .modal-content .modal-body .posting li.slick-current .video_item .vjs-paused .vjs-big-play-button {
6096 display: block;
6097 }
6098 .modal_slider_css .modal-dialog .modal-content .modal-body .posting li.slick-current + .slick-active .video_item {
6099 filter: blur(5px);
6100 transition: all 300ms linear 0s;
6101 }
6102 .modal_slider_css .modal-dialog .modal-content .modal-body .posting li.slick-current + .slick-active .video_item:hover {
6103 filter: blur(0);
6104 }
6105 .modal_slider_css .modal-dialog .modal-content .modal-body .posting li.slick-current + .slick-active .video_item:hover:before {
6106 opacity: 1;
6107 }
6108 .modal_slider_css .modal-dialog .modal-content .modal-body .quesiton_slider {
6109 position: relative;
6110 }
6111 .modal_slider_css .modal-dialog .modal-content .modal-body .prev_modal {
6112 position: absolute;
6113 top: 50%;
6114 height: 50px;
6115 width: 50px;
6116 background: rgba(166, 174, 179, 0.5);
6117 border-radius: 50%;
6118 transition: all 300ms linear 0s;
6119 color: #c0c3cc;
6120 text-align: center;
6121 line-height: 60px;
6122 cursor: pointer;
6123 transform: translateY(-50%);
6124 z-index: 5;
6125 left: 60px;
6126 }
6127 .modal_slider_css .modal-dialog .modal-content .modal-body .prev_modal:hover {
6128 background: var(--e-global-color-accent);
6129 }
6130 .modal_slider_css .modal-dialog .modal-content .modal-body .prev_modal i {
6131 font-size: 20px;
6132 }
6133 .modal_slider_css .modal-dialog .modal-content .modal-body .next_modal {
6134 position: absolute;
6135 top: 50%;
6136 height: 50px;
6137 width: 50px;
6138 background: rgba(166, 174, 179, 0.5);
6139 border-radius: 50%;
6140 transition: all 300ms linear 0s;
6141 color: #c0c3cc;
6142 text-align: center;
6143 line-height: 60px;
6144 cursor: pointer;
6145 transform: translateY(-50%);
6146 z-index: 5;
6147 right: 60px;
6148 }
6149 .modal_slider_css .modal-dialog .modal-content .modal-body .next_modal:hover {
6150 background: var(--e-global-color-accent);
6151 }
6152 .modal_slider_css .modal-dialog .modal-content .modal-body .next_modal i {
6153 font-size: 20px;
6154 }
6155 .modal_slider_css .modal-dialog .modal-content .modal-body .prev_modal.slick-disabled {
6156 opacity: 0;
6157 visibility: hidden;
6158 }
6159 .modal_slider_css .modal-dialog .modal-content .modal-body .next_modal.slick-disabled {
6160 opacity: 0;
6161 visibility: hidden;
6162 }
6163 .modal_slider_css .modal-dialog .modal-content .modal-body h3 {
6164 color: #fff;
6165 font-size: 20px;
6166 font-weight: 400;
6167 margin-left: 50px;
6168 margin-bottom: 18px;
6169 margin-top: 50px;
6170 }
6171 .modal_slider_css .modal-dialog .modal-content .modal-body .main_div_carousel {
6172 position: relative;
6173 }
6174 .modal_slider_css .modal-dialog .modal-content .modal-body .main_div_carousel .prev_car {
6175 position: absolute;
6176 top: 50%;
6177 height: 50px;
6178 width: 50px;
6179 background: rgba(34, 37, 38, 0.9);
6180 border-radius: 50%;
6181 transition: all 300ms linear 0s;
6182 color: #c0c3cc;
6183 text-align: center;
6184 line-height: 60px;
6185 cursor: pointer;
6186 transform: translateY(-50%);
6187 opacity: 0;
6188 left: 60px;
6189 }
6190 .modal_slider_css .modal-dialog .modal-content .modal-body .main_div_carousel .prev_car i {
6191 font-size: 20px;
6192 }
6193 .modal_slider_css .modal-dialog .modal-content .modal-body .main_div_carousel .prev_car:hover {
6194 background: #000;
6195 }
6196 .modal_slider_css .modal-dialog .modal-content .modal-body .main_div_carousel .next_car {
6197 position: absolute;
6198 top: 50%;
6199 height: 50px;
6200 width: 50px;
6201 background: rgba(34, 37, 38, 0.9);
6202 border-radius: 50%;
6203 transition: all 300ms linear 0s;
6204 color: #c0c3cc;
6205 text-align: center;
6206 line-height: 60px;
6207 cursor: pointer;
6208 transform: translateY(-50%);
6209 opacity: 0;
6210 right: 60px;
6211 }
6212 .modal_slider_css .modal-dialog .modal-content .modal-body .main_div_carousel .next_car i {
6213 font-size: 20px;
6214 }
6215 .modal_slider_css .modal-dialog .modal-content .modal-body .main_div_carousel .next_car:hover {
6216 background: #000;
6217 }
6218 .modal_slider_css .modal-dialog .modal-content .modal-body .main_div_carousel .prev_car.slick-disabled {
6219 opacity: 0;
6220 visibility: hidden;
6221 }
6222 .modal_slider_css .modal-dialog .modal-content .modal-body .main_div_carousel .next_car.slick-disabled {
6223 opacity: 0;
6224 visibility: hidden;
6225 }
6226 .modal_slider_css .modal-dialog .modal-content .modal-body .main_div_carousel:hover .prev_car {
6227 opacity: 1;
6228 }
6229 .modal_slider_css .modal-dialog .modal-content .modal-body .main_div_carousel:hover .next_car {
6230 opacity: 1;
6231 }
6232 .modal_slider_css .modal-dialog .modal-content .modal-body .main_div_carousel .slick-current .text_item {
6233 background: #393d40;
6234 }
6235 .modal_slider_css .modal-dialog .modal-content .modal-body .main_div_carousel .slick-current .text_item h4 {
6236 color: #fff;
6237 }
6238 .modal_slider_css .modal-dialog .modal-content .modal-body #modal_carousel {
6239 margin-bottom: 0;
6240 }
6241 .modal_slider_css .modal-dialog .modal-content .modal-body #modal_carousel li {
6242 padding-left: 10px;
6243 padding-right: 10px;
6244 }
6245 .modal_slider_css .modal-dialog .modal-content .modal-body #modal_carousel .slick-list {
6246 padding: 0 27% 0 0 !important;
6247 }
6248 .modal_slider_css .modal-dialog .modal-content .modal-body .text_item {
6249 background: #393d40;
6250 padding: 13px 24px;
6251 border-radius: 5px;
6252 }
6253 .modal_slider_css .modal-dialog .modal-content .modal-body .text_item h4 {
6254 color: #8a8e99;
6255 font-size: 18px;
6256 font-weight: 400;
6257 line-height: 27px;
6258 margin-bottom: 0;
6259 }
6260
6261 .video_slider_area {
6262 position: relative;
6263 }
6264 .video_slider_area #video_loader {
6265 position: absolute;
6266 top: 0;
6267 left: 0;
6268 width: 100%;
6269 height: 100%;
6270 background-color: #f3f3f3;
6271 z-index: 9999;
6272 }
6273 .video_slider_area #video_loader #loader {
6274 border: 6px solid rgba(152, 149, 149, 0.614);
6275 border-top: 6px solid var(--e-global-color-accent);
6276 border-radius: 50%;
6277 width: 60px;
6278 height: 60px;
6279 position: absolute;
6280 top: 50%;
6281 left: 50%;
6282 margin-top: -60px;
6283 margin-left: -60px;
6284 animation: spin 2s linear infinite;
6285 }
6286 .video_slider_area.loaded #video_loader {
6287 display: none;
6288 }
6289 .video_slider_area .video-js {
6290 min-height: 414px;
6291 border-radius: 5px;
6292 overflow: hidden;
6293 }
6294 .video_slider_area .video-js:before {
6295 content: "";
6296 position: absolute;
6297 left: 0;
6298 top: 0;
6299 background: rgba(44, 44, 81, 0.6);
6300 border-radius: 5px;
6301 width: 100%;
6302 height: 100%;
6303 z-index: 1;
6304 }
6305 .video_slider_area .video-js .vjs-big-play-button {
6306 border: none;
6307 }
6308 .video_slider_area .video-js .vjs-control-bar {
6309 transform: translateY(45px);
6310 }
6311 .video_slider_area .video-js .vjs-control-bar .vjs-button {
6312 color: rgba(235, 245, 250, 0.5);
6313 transition: all 300ms linear 0s;
6314 }
6315 .video_slider_area .video-js .vjs-control-bar .vjs-button:hover {
6316 color: #fff;
6317 }
6318 .video_slider_area .video-js .vjs-control.vjs-button.vjs-control-button.vjs-mode-control span {
6319 border-color: rgba(235, 245, 250, 0.5);
6320 transition: all 300ms linear 0s;
6321 }
6322 .video_slider_area .video-js .vjs-control.vjs-button.vjs-control-button.vjs-mode-control:hover span {
6323 border-color: #fff;
6324 }
6325 .video_slider_area .video-js:hover .vjs-control-bar {
6326 transform: translateY(0);
6327 }
6328 .video_slider_area .video-js.vjs-has-started:before {
6329 opacity: 0;
6330 visibility: hidden;
6331 }
6332
6333 @keyframes spin {
6334 0% {
6335 transform: rotate(0deg);
6336 }
6337 100% {
6338 transform: rotate(360deg);
6339 }
6340 }
6341 /* End Video Area css
6342 ============================================================================================ */
6343 /* 3d video Slider Area css
6344 ============================================================================================ */
6345 .flipvideo_area .slider-wrapper.no-padding .js-slider--main {
6346 padding-top: 7px;
6347 }
6348 .flipvideo_area .slider-wrapper.no-padding .js-slider--main .swiper-slide-shadow-left {
6349 background-image: unset;
6350 }
6351 .flipvideo_area .slider-wrapper.no-padding .js-slider--main .swiper-slide-shadow-right {
6352 background-image: unset;
6353 }
6354 .flipvideo_area .slider-wrapper.no-padding .js-slider--main .swiper-slide.swiper-slide-prev {
6355 position: relative;
6356 }
6357 .flipvideo_area .slider-wrapper.no-padding .js-slider--main .swiper-slide.swiper-slide-prev:before {
6358 content: "";
6359 background: rgba(0, 0, 0, 0.6);
6360 position: absolute;
6361 left: 0;
6362 top: 3px;
6363 width: 100%;
6364 height: 98%;
6365 }
6366 .flipvideo_area .slider-wrapper.no-padding .js-slider--main .swiper-slide.swiper-slide-next {
6367 position: relative;
6368 }
6369 .flipvideo_area .slider-wrapper.no-padding .js-slider--main .swiper-slide.swiper-slide-next:before {
6370 content: "";
6371 background: rgba(0, 0, 0, 0.6);
6372 position: absolute;
6373 left: 0;
6374 top: 3px;
6375 width: 100%;
6376 height: 98%;
6377 }
6378 .flipvideo_area .slider-wrapper.no-padding .swiper-container.js-slider--nav {
6379 padding-bottom: 0;
6380 }
6381 .flipvideo_area .slider-wrapper.no-padding .swiper-container.js-slider--nav .swiper-button-prev {
6382 left: 0;
6383 border-top-right-radius: 3px;
6384 border-bottom-right-radius: 3px;
6385 opacity: 0;
6386 transition: all 300ms linear 0s;
6387 background: var(--e-global-color-accent);
6388 }
6389 .flipvideo_area .slider-wrapper.no-padding .swiper-container.js-slider--nav .swiper-button-prev:after {
6390 font-size: 16px;
6391 }
6392 .flipvideo_area .slider-wrapper.no-padding .swiper-container.js-slider--nav .swiper-button-next {
6393 right: 0;
6394 border-top-left-radius: 3px;
6395 border-bottom-left-radius: 3px;
6396 opacity: 0;
6397 transition: all 300ms linear 0s;
6398 background: var(--e-global-color-accent);
6399 }
6400 .flipvideo_area .slider-wrapper.no-padding .swiper-container.js-slider--nav .swiper-button-next:after {
6401 font-size: 16px;
6402 }
6403 .flipvideo_area .slider-wrapper.no-padding .swiper-container.js-slider--nav:hover .swiper-button-prev {
6404 opacity: 1;
6405 }
6406 .flipvideo_area .slider-wrapper.no-padding .swiper-container.js-slider--nav:hover .swiper-button-next {
6407 opacity: 1;
6408 }
6409
6410 .swiper-pagination-bullet {
6411 border: 1px solid #1da1f2;
6412 }
6413
6414 .swiper-pagination-bullet-active {
6415 background: #1da1f2;
6416 }
6417
6418 .swiper-container {
6419 margin-left: auto;
6420 margin-right: auto;
6421 position: relative;
6422 overflow: hidden;
6423 z-index: 1;
6424 }
6425
6426 .swiper-container-no-flexbox .swiper-slide {
6427 float: left;
6428 }
6429
6430 .swiper-container-vertical > .swiper-wrapper {
6431 flex-direction: column;
6432 }
6433
6434 .swiper-wrapper {
6435 position: relative;
6436 width: 100%;
6437 height: 100%;
6438 z-index: 1;
6439 display: flex;
6440 box-sizing: content-box;
6441 }
6442
6443 .swiper-container-android .swiper-slide,
6444 .swiper-wrapper {
6445 transform: translate3d(0, 0, 0);
6446 }
6447
6448 .swiper-container-multirow > .swiper-wrapper {
6449 flex-wrap: wrap;
6450 }
6451
6452 .swiper-container-free-mode > .swiper-wrapper {
6453 transition-timing-function: ease-out;
6454 margin: 0 auto;
6455 }
6456
6457 .swiper-slide {
6458 flex: 0 0 auto;
6459 flex-negative: 0;
6460 flex-shrink: 0;
6461 width: 100%;
6462 height: 100%;
6463 position: relative;
6464 }
6465
6466 .swiper-container-autoheight,
6467 .swiper-container-autoheight .swiper-slide {
6468 height: auto;
6469 }
6470
6471 .swiper-container-autoheight .swiper-wrapper {
6472 align-items: flex-start;
6473 transition-property: transform, height;
6474 }
6475
6476 .swiper-container .swiper-notification {
6477 position: absolute;
6478 left: 0;
6479 top: 0;
6480 pointer-events: none;
6481 opacity: 0;
6482 z-index: -1000;
6483 }
6484
6485 .swiper-wp8-horizontal {
6486 -ms-touch-action: pan-y;
6487 touch-action: pan-y;
6488 }
6489
6490 .swiper-wp8-vertical {
6491 -ms-touch-action: pan-x;
6492 touch-action: pan-x;
6493 }
6494
6495 .swiper-button-next,
6496 .swiper-button-prev {
6497 position: absolute;
6498 top: 50%;
6499 width: 27px;
6500 height: 44px;
6501 margin-top: -22px;
6502 z-index: 10;
6503 cursor: pointer;
6504 background-size: 27px 44px;
6505 background-position: center;
6506 background-repeat: no-repeat;
6507 }
6508
6509 .swiper-button-next.swiper-button-disabled,
6510 .swiper-button-prev.swiper-button-disabled {
6511 opacity: 0.35;
6512 cursor: auto;
6513 pointer-events: none;
6514 }
6515
6516 .swiper-pagination {
6517 position: absolute;
6518 text-align: center;
6519 transition: 0.3s;
6520 transform: translate3d(0, 0, 0);
6521 z-index: 10;
6522 }
6523
6524 .swiper-pagination.swiper-pagination-hidden {
6525 opacity: 0;
6526 }
6527
6528 .swiper-container-horizontal > .swiper-pagination-bullets,
6529 .swiper-pagination-custom,
6530 .swiper-pagination-fraction {
6531 bottom: 10px;
6532 left: 0;
6533 width: 100%;
6534 }
6535
6536 .swiper-pagination-bullet {
6537 width: 8px;
6538 height: 8px;
6539 display: inline-block;
6540 border-radius: 100%;
6541 background: #000;
6542 opacity: 0.2;
6543 }
6544
6545 button.swiper-pagination-bullet {
6546 border: none;
6547 margin: 0;
6548 padding: 0;
6549 box-shadow: none;
6550 appearance: none;
6551 }
6552
6553 .swiper-pagination-clickable .swiper-pagination-bullet {
6554 cursor: pointer;
6555 }
6556
6557 .swiper-pagination-white .swiper-pagination-bullet {
6558 background: #fff;
6559 }
6560
6561 .swiper-pagination-bullet-active {
6562 opacity: 1;
6563 background: #007aff;
6564 }
6565
6566 .swiper-pagination-white .swiper-pagination-bullet-active {
6567 background: #fff;
6568 }
6569
6570 .swiper-pagination-black .swiper-pagination-bullet-active {
6571 background: #000;
6572 }
6573
6574 .swiper-container-vertical > .swiper-pagination-bullets {
6575 right: 10px;
6576 top: 50%;
6577 transform: translate3d(0, -50%, 0);
6578 }
6579
6580 .swiper-container-vertical > .swiper-pagination-bullets .swiper-pagination-bullet {
6581 margin: 5px 0;
6582 display: block;
6583 }
6584
6585 .swiper-container-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet {
6586 margin: 0 5px;
6587 }
6588
6589 .swiper-pagination-progress {
6590 background: rgba(0, 0, 0, 0.25);
6591 position: absolute;
6592 }
6593
6594 .swiper-pagination-progress .swiper-pagination-progressbar {
6595 background: #007aff;
6596 position: absolute;
6597 left: 0;
6598 top: 0;
6599 width: 100%;
6600 height: 100%;
6601 transform: scale(0);
6602 transform-origin: left top;
6603 }
6604
6605 .swiper-container-rtl .swiper-pagination-progress .swiper-pagination-progressbar {
6606 transform-origin: right top;
6607 }
6608
6609 .swiper-container-horizontal > .swiper-pagination-progress {
6610 width: 100%;
6611 height: 4px;
6612 left: 0;
6613 top: 0;
6614 }
6615
6616 .swiper-container-vertical > .swiper-pagination-progress {
6617 width: 4px;
6618 height: 100%;
6619 left: 0;
6620 top: 0;
6621 }
6622
6623 .swiper-pagination-progress.swiper-pagination-white {
6624 background: rgba(255, 255, 255, 0.5);
6625 }
6626
6627 .swiper-pagination-progress.swiper-pagination-white .swiper-pagination-progressbar {
6628 background: #fff;
6629 }
6630
6631 .swiper-pagination-progress.swiper-pagination-black .swiper-pagination-progressbar {
6632 background: #000;
6633 }
6634
6635 .swiper-container-3d {
6636 perspective: 1200px;
6637 }
6638
6639 .swiper-container-3d .swiper-cube-shadow,
6640 .swiper-container-3d .swiper-slide,
6641 .swiper-container-3d .swiper-slide-shadow-bottom,
6642 .swiper-container-3d .swiper-slide-shadow-left,
6643 .swiper-container-3d .swiper-slide-shadow-right,
6644 .swiper-container-3d .swiper-slide-shadow-top,
6645 .swiper-container-3d .swiper-wrapper {
6646 transform-style: preserve-3d;
6647 }
6648
6649 .swiper-container-3d .swiper-slide-shadow-bottom,
6650 .swiper-container-3d .swiper-slide-shadow-left,
6651 .swiper-container-3d .swiper-slide-shadow-right,
6652 .swiper-container-3d .swiper-slide-shadow-top {
6653 position: absolute;
6654 left: 0;
6655 top: 0;
6656 width: 100%;
6657 height: 100%;
6658 pointer-events: none;
6659 z-index: 10;
6660 }
6661
6662 .swiper-container-coverflow .swiper-wrapper,
6663 .swiper-container-flip .swiper-wrapper {
6664 -ms-perspective: 1200px;
6665 }
6666
6667 .swiper-container-cube,
6668 .swiper-container-flip {
6669 overflow: visible;
6670 }
6671
6672 .swiper-container-cube .swiper-slide,
6673 .swiper-container-flip .swiper-slide {
6674 pointer-events: none;
6675 backface-visibility: hidden;
6676 z-index: 1;
6677 }
6678
6679 .swiper-container-cube .swiper-slide .swiper-slide,
6680 .swiper-container-flip .swiper-slide .swiper-slide {
6681 pointer-events: none;
6682 }
6683
6684 .swiper-container-cube .swiper-slide-active,
6685 .swiper-container-cube .swiper-slide-active .swiper-slide-active,
6686 .swiper-container-flip .swiper-slide-active,
6687 .swiper-container-flip .swiper-slide-active .swiper-slide-active {
6688 pointer-events: auto;
6689 }
6690
6691 .swiper-container-cube .swiper-slide-shadow-bottom,
6692 .swiper-container-cube .swiper-slide-shadow-left,
6693 .swiper-container-cube .swiper-slide-shadow-right,
6694 .swiper-container-cube .swiper-slide-shadow-top,
6695 .swiper-container-flip .swiper-slide-shadow-bottom,
6696 .swiper-container-flip .swiper-slide-shadow-left,
6697 .swiper-container-flip .swiper-slide-shadow-right,
6698 .swiper-container-flip .swiper-slide-shadow-top {
6699 z-index: 0;
6700 backface-visibility: hidden;
6701 }
6702
6703 .swiper-container-cube .swiper-slide {
6704 visibility: hidden;
6705 transform-origin: 0 0;
6706 width: 100%;
6707 height: 100%;
6708 }
6709
6710 .swiper-container-cube.swiper-container-rtl .swiper-slide {
6711 transform-origin: 100% 0;
6712 }
6713
6714 .swiper-container-cube .swiper-slide-active,
6715 .swiper-container-cube .swiper-slide-next,
6716 .swiper-container-cube .swiper-slide-next + .swiper-slide,
6717 .swiper-container-cube .swiper-slide-prev {
6718 pointer-events: auto;
6719 visibility: visible;
6720 }
6721
6722 .swiper-container-cube .swiper-cube-shadow {
6723 position: absolute;
6724 left: 0;
6725 bottom: 0;
6726 width: 100%;
6727 height: 100%;
6728 background: #000;
6729 opacity: 0.6;
6730 filter: blur(50px);
6731 z-index: 0;
6732 }
6733
6734 .swiper-container-fade.swiper-container-free-mode .swiper-slide {
6735 transition-timing-function: ease-out;
6736 }
6737
6738 .swiper-container-fade .swiper-slide {
6739 pointer-events: none;
6740 transition-property: opacity;
6741 }
6742
6743 .swiper-container-fade .swiper-slide .swiper-slide {
6744 pointer-events: none;
6745 }
6746
6747 .swiper-container-fade .swiper-slide-active,
6748 .swiper-container-fade .swiper-slide-active .swiper-slide-active {
6749 pointer-events: auto;
6750 }
6751
6752 .swiper-zoom-container {
6753 width: 100%;
6754 height: 100%;
6755 display: flex;
6756 justify-content: center;
6757 align-items: center;
6758 text-align: center;
6759 }
6760
6761 .swiper-zoom-container > canvas,
6762 .swiper-zoom-container > img,
6763 .swiper-zoom-container > svg {
6764 max-width: 100%;
6765 max-height: 100%;
6766 -o-object-fit: contain;
6767 object-fit: contain;
6768 }
6769
6770 .swiper-scrollbar {
6771 border-radius: 10px;
6772 position: relative;
6773 -ms-touch-action: none;
6774 background: rgba(0, 0, 0, 0.1);
6775 }
6776
6777 .swiper-container-horizontal > .swiper-scrollbar {
6778 position: absolute;
6779 left: 1%;
6780 bottom: 3px;
6781 z-index: 50;
6782 height: 5px;
6783 width: 98%;
6784 }
6785
6786 .swiper-container-vertical > .swiper-scrollbar {
6787 position: absolute;
6788 right: 3px;
6789 top: 1%;
6790 z-index: 50;
6791 width: 5px;
6792 height: 98%;
6793 }
6794
6795 .swiper-scrollbar-drag {
6796 height: 100%;
6797 width: 100%;
6798 position: relative;
6799 background: rgba(0, 0, 0, 0.5);
6800 border-radius: 10px;
6801 left: 0;
6802 top: 0;
6803 }
6804
6805 .swiper-scrollbar-cursor-drag {
6806 cursor: move;
6807 }
6808
6809 .swiper-lazy-preloader {
6810 width: 42px;
6811 height: 42px;
6812 position: absolute;
6813 left: 50%;
6814 top: 50%;
6815 margin-left: -21px;
6816 margin-top: -21px;
6817 z-index: 10;
6818 transform-origin: 50%;
6819 animation: swiper-preloader-spin 1s steps(12, end) infinite;
6820 }
6821
6822 @-webkit-keyframes swiper-preloader-spin {
6823 100% {
6824 -webkit-transform: rotate(360deg);
6825 }
6826 }
6827 @keyframes swiper-preloader-spin {
6828 100% {
6829 transform: rotate(360deg);
6830 }
6831 }
6832 .swiper-container.one {
6833 padding-top: 40px;
6834 text-align: center;
6835 }
6836
6837 .swiper-container.one .swiper-slide {
6838 padding: 0 43px;
6839 }
6840
6841 .swiper-container {
6842 width: 100%;
6843 padding-bottom: 60px;
6844 }
6845
6846 .swiper-slide img {
6847 display: block;
6848 margin: auto;
6849 max-width: 100%;
6850 box-shadow: none !important;
6851 }
6852
6853 .js-slider--main .swiper-slide {
6854 width: 390px;
6855 height: auto;
6856 padding: 0 0;
6857 }
6858
6859 .swiper-slide .slider-image .preview-icon {
6860 z-index: -1;
6861 width: calc(100% - 30px);
6862 }
6863
6864 .swiper-slide.swiper-slide-active .slider-image:hover .preview-icon {
6865 opacity: 1;
6866 -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
6867 z-index: 1;
6868 }
6869
6870 .swiper-container-horizontal > .swiper-pagination-bullets,
6871 .swiper-pagination-custom,
6872 .swiper-pagination-fraction {
6873 bottom: 0;
6874 }
6875
6876 .swiper-pagination-bullet {
6877 background: transparent none repeat scroll 0 0;
6878 border: 1px solid #ee0f6f;
6879 border-radius: 10px;
6880 display: inline-block;
6881 height: 10px;
6882 -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
6883 opacity: 1;
6884 width: 26px;
6885 transition: 0.2s;
6886 }
6887
6888 .swiper-pagination-bullet-active {
6889 background: rgba(0, 0, 0, 0) linear-gradient(to right, #ee0f6f 0%, #f89482 100%) repeat scroll 0 0;
6890 border: medium none;
6891 height: 12px;
6892 opacity: 1;
6893 -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
6894 width: 12px;
6895 }
6896
6897 .art-video-player .art-mask .art-state {
6898 width: 80px !important;
6899 height: 80px !important;
6900 bottom: 0 !important;
6901 right: 0 !important;
6902 left: 0 !important;
6903 top: 0 !important;
6904 margin: auto;
6905 overflow: hidden;
6906 transform: unset !important;
6907 }
6908
6909 .art-video-player .art-mask .art-state i svg {
6910 fill: white;
6911 width: 100px;
6912 height: 100px;
6913 background: blue;
6914 }
6915
6916 .accordion-panel .accordion-content.show #minus {
6917 display: inline-block;
6918 }
6919
6920 .accordion-panel .accordion-header.active::before {
6921 content: "-";
6922 }
6923
6924 .spe_accordion_inner:not(.spe-collapsed) #plus {
6925 display: none;
6926 }
6927
6928 .accordion-panel .accordion-content {
6929 overflow: hidden;
6930 }
6931
6932 .accordion-header {
6933 cursor: pointer;
6934 }
6935
6936 .video_player .tab-content {
6937 display: block;
6938 }
6939
6940 .art-undercover {
6941 background: #000;
6942 position: fixed;
6943 top: 0;
6944 left: 0;
6945 display: none;
6946 height: 100%;
6947 width: 100%;
6948 opacity: 0.9;
6949 z-index: 10;
6950 }
6951
6952 @media (max-width: 576px) {
6953 .video_list_area .art-video-player {
6954 height: 396px !important;
6955 }
6956 }
6957 @media (max-width: 450px) {
6958 .video_list_area .art-video-player {
6959 height: 277px !important;
6960 }
6961 }
6962 /*=========== message_alert Shortcode css ========*/
6963 .message_alert {
6964 display: flex;
6965 border: 1px solid #ebebeb;
6966 border-radius: 4px;
6967 background: rgba(243, 243, 243, 0.24);
6968 padding: 32px 40px 30px;
6969 margin-bottom: 0;
6970 }
6971 .message_alert i {
6972 font-size: 24px;
6973 color: #abb0c0;
6974 margin-right: 25px;
6975 }
6976 .message_alert .title {
6977 font-size: 16px;
6978 color: #031933;
6979 font-weight: 500;
6980 margin-bottom: 10px;
6981 margin-top: 0;
6982 }
6983 .message_alert p {
6984 margin-bottom: 0;
6985 margin-top: 12px;
6986 }
6987 .message_alert .close {
6988 position: absolute;
6989 right: 14px;
6990 top: 12px;
6991 font-size: 24px;
6992 opacity: 1;
6993 border: none;
6994 background: transparent;
6995 }
6996 .message_alert .close i {
6997 margin-right: 0;
6998 }
6999
7000 .alert-danger {
7001 background: rgba(255, 243, 244, 0.7);
7002 border-color: #fbadb3;
7003 }
7004 .alert-danger i,
7005 .alert-danger .title {
7006 color: #fa303e;
7007 }
7008
7009 .alert-success {
7010 background: rgba(241, 253, 243, 0.7);
7011 border-color: #94e3a1;
7012 }
7013 .alert-success i,
7014 .alert-success .title {
7015 color: #10d631;
7016 }
7017
7018 .alert-warning {
7019 background: #fefbf1;
7020 border-color: #f2dca0;
7021 }
7022 .alert-warning i,
7023 .alert-warning .title {
7024 color: #f6ba18;
7025 }
7026
7027 .alert-info {
7028 background: #f1fbfd;
7029 border-color: #a0e3f2;
7030 }
7031 .alert-info i,
7032 .alert-info .title {
7033 color: #055160;
7034 }
7035
7036 .notice-box {
7037 border-left: 10px solid;
7038 padding: 30px 40px;
7039 margin-bottom: 0;
7040 margin-top: 0;
7041 }
7042 .notice-box:before, .notice-box:after {
7043 display: none;
7044 }
7045 .notice-box i {
7046 font-size: 24px;
7047 margin-right: 25px;
7048 }
7049 .notice-box h5 {
7050 font-size: 20px;
7051 font-weight: 500;
7052 margin-bottom: 16px;
7053 }
7054 .notice-box p {
7055 font-size: 18px;
7056 font-weight: 400;
7057 margin-bottom: 0;
7058 color: #6b707f;
7059 line-height: 34px;
7060 }
7061 .notice-box p span {
7062 padding: 1px 10px;
7063 background: #fff;
7064 color: #ed2937;
7065 }
7066
7067 .notice-success {
7068 background: #459e6d;
7069 border-color: #30845e;
7070 }
7071 .notice-success p {
7072 color: #ebebeb;
7073 }
7074
7075 .notice-warning {
7076 background: #fefaed;
7077 border-color: #ffce49;
7078 }
7079 .notice-warning i {
7080 color: #ffce49;
7081 padding-top: 4px;
7082 }
7083
7084 .notice-danger {
7085 background: #ffeff0;
7086 border-color: #ff5e69;
7087 }
7088 .notice-danger i {
7089 color: #ff5e69;
7090 }
7091
7092 .explanation {
7093 position: relative;
7094 background: linear-gradient(90deg, #fff, rgba(117, 227, 251, 0.6196078431));
7095 border: 10px solid #fff;
7096 padding: 1rem 2rem;
7097 border-radius: 16px;
7098 }
7099 .explanation::before {
7100 content: "";
7101 position: absolute;
7102 top: -10px;
7103 left: -10px;
7104 right: -10px;
7105 bottom: -10px;
7106 border: 1px solid #e6edf0;
7107 border-radius: 8px;
7108 pointer-events: none;
7109 }
7110 .explanation::after {
7111 content: "Hey!";
7112 text-transform: uppercase;
7113 font-weight: 700;
7114 top: -19px;
7115 left: 1rem;
7116 padding: 0 0.5rem;
7117 font-size: 0.6rem;
7118 position: absolute;
7119 z-index: 1;
7120 color: #000;
7121 background: #fff;
7122 }
7123
7124 .note-with-icon {
7125 margin: 0;
7126 padding-left: 20px;
7127 position: relative;
7128 }
7129 .note-with-icon .nic-content-wrap .info-tab .icon-wrapper::before {
7130 content: "";
7131 display: inline-block;
7132 position: absolute;
7133 left: 0;
7134 transform: rotateX(60deg);
7135 }
7136 .note-with-icon .nic-content-wrap .info-tab .icon-wrapper i {
7137 position: absolute;
7138 top: 0;
7139 bottom: 0;
7140 margin: auto;
7141 display: block;
7142 left: 0;
7143 right: 0;
7144 text-align: center;
7145 height: 20px;
7146 color: white;
7147 }
7148 .note-with-icon .nic-content-wrap .info-tab .icon-wrapper::after {
7149 content: "";
7150 display: inline-block;
7151 position: absolute;
7152 left: 0;
7153 transform: rotateX(60deg);
7154 background-color: #3b3f4c;
7155 width: 20px;
7156 height: 20px;
7157 border: 12px solid transparent;
7158 border-bottom-color: #fff;
7159 border-left-color: #fff;
7160 bottom: -18px;
7161 box-shadow: inset 12px 0 13px rgba(0, 0, 0, 0.5);
7162 }
7163
7164 .note-with-icon .nic-content-wrap {
7165 margin: 0 0 0 4px;
7166 }
7167
7168 .nic-content-wrap .nic-alert {
7169 padding: 3px;
7170 margin: 15px 0 20px;
7171 }
7172
7173 .nic-alert .nic-content-wrap .note-box {
7174 color: #144261;
7175 background: #d5e9f6;
7176 padding: 30px 40px;
7177 border: 1px solid rgba(255, 255, 255, 0);
7178 }
7179
7180 .nic-alert .nic-content-wrap .note-box h5.title {
7181 margin-bottom: 16px;
7182 }
7183
7184 .nic-alert .nic-content-wrap .note-box p {
7185 margin-bottom: 3px;
7186 }
7187
7188 .nic-alert .nic-content-wrap .note-icon {
7189 width: 40px;
7190 height: 40px;
7191 display: inline-block;
7192 position: absolute;
7193 top: 20px;
7194 left: 0;
7195 color: white;
7196 }
7197
7198 /* ALERT [MESSAGE && INFO] */
7199 .nic-alert.nic-alert-info .nic-content-wrap .note-box,
7200 .nic-alert.nic-alert-message .nic-content-wrap .note-box {
7201 background: rgb(243, 243, 255);
7202 }
7203
7204 .nic-alert.nic-alert-info .nic-content-wrap .note-icon,
7205 .nic-alert.nic-alert-message .nic-content-wrap .note-icon {
7206 background: #4c5267;
7207 }
7208
7209 .nic-alert-message .note-icon .icon-wrapper::after,
7210 .nic-alert-info .note-icon .icon-wrapper::after {
7211 background: #3b3f4c;
7212 }
7213
7214 /* ALERT [WARNING] */
7215 .nic-alert.nic-alert-warning .nic-content-wrap .note-box {
7216 background: #fefbf1;
7217 }
7218
7219 .nic-alert.nic-alert-warning .nic-content-wrap .note-icon {
7220 background: #f6ba18;
7221 }
7222
7223 .nic-alert.nic-alert-warning .note-icon .icon-wrapper::after {
7224 background: #e1aa17;
7225 }
7226
7227 /* ALERT [SUCCESS] */
7228 .nic-alert.nic-alert-success .nic-content-wrap .note-box {
7229 background: #459e6d;
7230 }
7231
7232 .nic-alert.nic-alert-success .nic-content-wrap .note-icon {
7233 background: #30845e;
7234 }
7235
7236 .nic-alert.nic-alert-success .note-icon .icon-wrapper::after {
7237 background: #2d7655;
7238 }
7239
7240 /* ALERT [DANGER] */
7241 .nic-alert.nic-alert-danger .nic-content-wrap .note-box {
7242 background: #ffeff0;
7243 }
7244
7245 .nic-alert.nic-alert-danger .nic-content-wrap .note-icon {
7246 background: #fa303e;
7247 }
7248
7249 .nic-alert.nic-alert-danger .note-icon .icon-wrapper::after {
7250 background: #fa303e;
7251 }
7252
7253 .dual-box-wrapper {
7254 position: relative;
7255 border-width: 2.5px;
7256 border-radius: 8px;
7257 border-style: solid;
7258 }
7259
7260 .dual-box-wrapper.bottom-right,
7261 .dual-box-wrapper.top-right {
7262 right: -8px;
7263 }
7264
7265 .dual-box-content {
7266 bottom: 10px;
7267 left: 10px;
7268 border-width: 2.5px;
7269 border-radius: 8px;
7270 border-style: solid;
7271 background: #fff;
7272 position: relative;
7273 padding: 20px;
7274 box-sizing: border-box;
7275 }
7276 .dual-box-content.top-left {
7277 top: 10px;
7278 left: 10px;
7279 }
7280 .dual-box-content.top-right {
7281 top: 10px;
7282 right: 10px;
7283 left: unset;
7284 }
7285 .dual-box-content.bottom-right {
7286 bottom: 10px;
7287 right: 10px;
7288 left: unset;
7289 }
7290 .dual-box-content .notice-box {
7291 display: flex;
7292 border: none;
7293 border-radius: 6px;
7294 margin: 0;
7295 padding: 20px;
7296 }
7297 .dual-box-content.notice-warning .dual-box-content {
7298 border-color: #f6ba18;
7299 }
7300 .dual-box-content.notice-success .dual-box-content {
7301 border-color: #30845e;
7302 }
7303 .dual-box-content.notice-danger .dual-box-content {
7304 border-color: #fa303e;
7305 }
7306 .dual-box-content.notice-success .dual-box-content i {
7307 color: #459e6d;
7308 }
7309 .dual-box-content p {
7310 color: #535a60;
7311 }
7312
7313 .block-notice-wrapper {
7314 position: relative;
7315 padding: 20px 40px;
7316 margin: 0 0 5px;
7317 box-sizing: border-box;
7318 }
7319 .block-notice-wrapper::before {
7320 content: "";
7321 display: block;
7322 clear: both;
7323 width: 1rem;
7324 height: 100%;
7325 border-bottom-width: 1px;
7326 border-left-width: 1px;
7327 border-top-width: 1px;
7328 border-style: solid;
7329 border-color: #8cafd3;
7330 position: absolute;
7331 left: 0;
7332 top: 0;
7333 border-right: none;
7334 }
7335 .block-notice-wrapper::after {
7336 content: "";
7337 display: block;
7338 clear: both;
7339 width: 1rem;
7340 height: 100%;
7341 border-bottom-width: 1px;
7342 border-right-width: 1px;
7343 border-top-width: 1px;
7344 border-style: solid;
7345 border-color: #8cafd3;
7346 position: absolute;
7347 right: 0;
7348 top: 0;
7349 border-left: none;
7350 }
7351
7352 .block-notice-content-wrapper {
7353 background: white;
7354 position: relative;
7355 }
7356
7357 .block-notice-wrapper .block-notice-icon {
7358 width: 60px;
7359 height: 60px;
7360 border-radius: 50%;
7361 background: #fff;
7362 position: absolute;
7363 left: -28px;
7364 top: 15px;
7365 border: 10px solid white;
7366 }
7367 .block-notice-wrapper .block-notice-icon svg {
7368 width: auto;
7369 position: absolute;
7370 right: -2px;
7371 max-width: 2.5rem;
7372 top: -2px;
7373 z-index: 9999;
7374 }
7375
7376 .dual-box-wrapper .dual-box-content .notice-box i {
7377 width: auto;
7378 padding: 0;
7379 box-sizing: border-box;
7380 margin-right: 15px;
7381 }
7382 .dual-box-wrapper .dual-box-content .notice-box svg {
7383 width: auto;
7384 padding: 0;
7385 height: auto;
7386 max-height: 30px;
7387 margin-top: 5px;
7388 max-width: 3rem;
7389 margin-right: 15px;
7390 }
7391
7392 .block-notice-wrapper .block-notice-icon i {
7393 position: absolute;
7394 font-size: 22px;
7395 bottom: 0;
7396 margin: auto;
7397 display: block;
7398 text-align: center;
7399 height: 0;
7400 top: -22px;
7401 z-index: 9999;
7402 }
7403 .block-notice-wrapper .block-notice-body h5 {
7404 margin-bottom: 20px;
7405 }
7406 .block-notice-wrapper .block-notice-body p {
7407 margin: 0;
7408 }
7409 .block-notice-wrapper .block-notice-icon:after {
7410 content: "";
7411 display: block;
7412 clear: both;
7413 width: 100%;
7414 height: 100%;
7415 position: absolute;
7416 border-radius: 50%;
7417 }
7418 .block-notice-wrapper.block-notice-message .block-notice-icon:after {
7419 background: rgba(76, 76, 241, 0.05);
7420 }
7421 .block-notice-wrapper.block-notice-warning .block-notice-icon:after {
7422 background: #fefbf1;
7423 }
7424 .block-notice-wrapper.block-notice-info .block-notice-icon:after {
7425 background: #f6f6fe;
7426 }
7427 .block-notice-wrapper.block-notice-success .block-notice-icon:after {
7428 background: #459e6d;
7429 }
7430 .block-notice-wrapper.block-notice-danger .block-notice-icon:after {
7431 background: #ffeff0;
7432 }
7433 .block-notice-wrapper.block-notice-message:before, .block-notice-wrapper.block-notice-message:after {
7434 border-color: #4c5267;
7435 }
7436 .block-notice-wrapper.block-notice-warning:before, .block-notice-wrapper.block-notice-warning:after {
7437 border-color: #f6ba18;
7438 }
7439 .block-notice-wrapper.block-notice-info:before, .block-notice-wrapper.block-notice-info:after {
7440 border-color: #4c5267;
7441 }
7442 .block-notice-wrapper.block-notice-success:before, .block-notice-wrapper.block-notice-success:after {
7443 border-color: #30845e;
7444 }
7445 .block-notice-wrapper.block-notice-danger:before, .block-notice-wrapper.block-notice-danger:after {
7446 border-color: #fa303e;
7447 }
7448 .block-notice-wrapper.block-notice-success .block-notice-icon i {
7449 color: #fff;
7450 }
7451
7452 @-webkit-keyframes fadeIn {
7453 0% {
7454 opacity: 0;
7455 }
7456 100% {
7457 opacity: 1;
7458 }
7459 }
7460 @keyframes fadeIn {
7461 0% {
7462 opacity: 0;
7463 }
7464 100% {
7465 opacity: 1;
7466 }
7467 }
7468 .fadeIn {
7469 animation-name: fadeIn;
7470 }
7471
7472 @-webkit-keyframes fadeInDown {
7473 0% {
7474 opacity: 0;
7475 -webkit-transform: translateY(-20px);
7476 transform: translateY(-20px);
7477 }
7478 100% {
7479 opacity: 1;
7480 -webkit-transform: translateY(0);
7481 transform: translateY(0);
7482 }
7483 }
7484 @keyframes fadeInDown {
7485 0% {
7486 opacity: 0;
7487 -webkit-transform: translateY(-20px);
7488 -ms-transform: translateY(-20px);
7489 transform: translateY(-20px);
7490 }
7491 100% {
7492 opacity: 1;
7493 -webkit-transform: translateY(0);
7494 -ms-transform: translateY(0);
7495 transform: translateY(0);
7496 }
7497 }
7498 .fadeInDown {
7499 -webkit-animation-name: fadeInDown;
7500 animation-name: fadeInDown;
7501 }
7502
7503 @-webkit-keyframes height {
7504 0% {
7505 opacity: 0;
7506 height: 0;
7507 }
7508 100% {
7509 opacity: 0.1;
7510 height: 50%;
7511 }
7512 }
7513 @keyframes height {
7514 0% {
7515 opacity: 0;
7516 height: 0;
7517 transition: all 0.6s linear;
7518 }
7519 100% {
7520 opacity: 0.3;
7521 height: 50%;
7522 }
7523 }
7524 .height {
7525 -webkit-animation-name: height;
7526 animation-name: height;
7527 }
7528
7529 @-webkit-keyframes fadeInDown2 {
7530 0% {
7531 -webkit-transform: translateY(-40px);
7532 -ms-transform: translateY(-40px);
7533 transform: translateY(-40px);
7534 opacity: 0;
7535 }
7536 100% {
7537 -webkit-transform: translateY(0);
7538 transform: translateY(0);
7539 opacity: 0.2;
7540 }
7541 }
7542 @keyframes fadeInDown2 {
7543 0% {
7544 -webkit-transform: translateY(-40px);
7545 -ms-transform: translateY(-40px);
7546 transform: translateY(-40px);
7547 opacity: 0;
7548 }
7549 100% {
7550 -webkit-transform: translateY(0);
7551 -ms-transform: translateY(0);
7552 transform: translateY(0);
7553 opacity: 0.2;
7554 }
7555 }
7556 .fadeInDown2 {
7557 -webkit-animation-name: fadeInDown2;
7558 animation-name: fadeInDown2;
7559 }
7560
7561 @-webkit-keyframes fadeInDownBig {
7562 0% {
7563 opacity: 0;
7564 -webkit-transform: translateY(-2000px);
7565 transform: translateY(-2000px);
7566 }
7567 100% {
7568 opacity: 1;
7569 -webkit-transform: translateY(0);
7570 transform: translateY(0);
7571 }
7572 }
7573 @keyframes fadeInDownBig {
7574 0% {
7575 opacity: 0;
7576 -webkit-transform: translateY(-2000px);
7577 -ms-transform: translateY(-2000px);
7578 transform: translateY(-2000px);
7579 }
7580 100% {
7581 opacity: 1;
7582 -webkit-transform: translateY(0);
7583 -ms-transform: translateY(0);
7584 transform: translateY(0);
7585 }
7586 }
7587 .fadeInDownBig {
7588 -webkit-animation-name: fadeInDownBig;
7589 animation-name: fadeInDownBig;
7590 }
7591
7592 @-webkit-keyframes fadeInLeft {
7593 0% {
7594 opacity: 0;
7595 -webkit-transform: translateX(-20px);
7596 transform: translateX(-20px);
7597 }
7598 100% {
7599 opacity: 1;
7600 -webkit-transform: translateX(0);
7601 transform: translateX(0);
7602 }
7603 }
7604 @keyframes fadeInLeft {
7605 0% {
7606 opacity: 0;
7607 -webkit-transform: translateX(-20px);
7608 -ms-transform: translateX(-20px);
7609 transform: translateX(-20px);
7610 }
7611 100% {
7612 opacity: 1;
7613 -webkit-transform: translateX(0);
7614 -ms-transform: translateX(0);
7615 transform: translateX(0);
7616 }
7617 }
7618 .fadeInLeft {
7619 -webkit-animation-name: fadeInLeft;
7620 animation-name: fadeInLeft;
7621 }
7622
7623 @-webkit-keyframes fadeInLeftBig {
7624 0% {
7625 opacity: 0;
7626 -webkit-transform: translateX(-2000px);
7627 transform: translateX(-2000px);
7628 }
7629 100% {
7630 opacity: 1;
7631 -webkit-transform: translateX(0);
7632 transform: translateX(0);
7633 }
7634 }
7635 @keyframes fadeInLeftBig {
7636 0% {
7637 opacity: 0;
7638 -webkit-transform: translateX(-2000px);
7639 -ms-transform: translateX(-2000px);
7640 transform: translateX(-2000px);
7641 }
7642 100% {
7643 opacity: 1;
7644 -webkit-transform: translateX(0);
7645 -ms-transform: translateX(0);
7646 transform: translateX(0);
7647 }
7648 }
7649 .fadeInLeftBig {
7650 -webkit-animation-name: fadeInLeftBig;
7651 animation-name: fadeInLeftBig;
7652 }
7653
7654 @-webkit-keyframes fadeInRight {
7655 0% {
7656 opacity: 0;
7657 -webkit-transform: translateX(20px);
7658 transform: translateX(20px);
7659 }
7660 100% {
7661 opacity: 1;
7662 -webkit-transform: translateX(0);
7663 transform: translateX(0);
7664 }
7665 }
7666 @keyframes fadeInRight {
7667 0% {
7668 opacity: 0;
7669 -webkit-transform: translateX(20px);
7670 -ms-transform: translateX(20px);
7671 transform: translateX(20px);
7672 }
7673 100% {
7674 opacity: 1;
7675 -webkit-transform: translateX(0);
7676 -ms-transform: translateX(0);
7677 transform: translateX(0);
7678 }
7679 }
7680 .fadeInRight {
7681 -webkit-animation-name: fadeInRight;
7682 animation-name: fadeInRight;
7683 }
7684
7685 @-webkit-keyframes fadeInRightBig {
7686 0% {
7687 opacity: 0;
7688 -webkit-transform: translateX(2000px);
7689 transform: translateX(2000px);
7690 }
7691 100% {
7692 opacity: 1;
7693 -webkit-transform: translateX(0);
7694 transform: translateX(0);
7695 }
7696 }
7697 @keyframes fadeInRightBig {
7698 0% {
7699 opacity: 0;
7700 -webkit-transform: translateX(2000px);
7701 -ms-transform: translateX(2000px);
7702 transform: translateX(2000px);
7703 }
7704 100% {
7705 opacity: 1;
7706 -webkit-transform: translateX(0);
7707 -ms-transform: translateX(0);
7708 transform: translateX(0);
7709 }
7710 }
7711 .fadeInRightBig {
7712 -webkit-animation-name: fadeInRightBig;
7713 animation-name: fadeInRightBig;
7714 }
7715
7716 @-webkit-keyframes fadeInUp {
7717 0% {
7718 opacity: 0;
7719 -webkit-transform: translateY(20px);
7720 transform: translateY(20px);
7721 }
7722 100% {
7723 opacity: 1;
7724 -webkit-transform: translateY(0);
7725 transform: translateY(0);
7726 }
7727 }
7728 @keyframes fadeInUp {
7729 0% {
7730 opacity: 0;
7731 -webkit-transform: translateY(20px);
7732 -ms-transform: translateY(20px);
7733 transform: translateY(20px);
7734 }
7735 100% {
7736 opacity: 1;
7737 -webkit-transform: translateY(0);
7738 -ms-transform: translateY(0);
7739 transform: translateY(0);
7740 }
7741 }
7742 .fadeInUp {
7743 -webkit-animation-name: fadeInUp;
7744 animation-name: fadeInUp;
7745 }
7746
7747 @-webkit-keyframes fadeInUp2 {
7748 0% {
7749 opacity: 0;
7750 -webkit-transform: translateY(20px);
7751 transform: translateY(20px);
7752 }
7753 100% {
7754 opacity: 0.2;
7755 -webkit-transform: translateY(0);
7756 transform: translateY(0);
7757 }
7758 }
7759 @keyframes fadeInUp2 {
7760 0% {
7761 opacity: 0;
7762 -webkit-transform: translateY(20px);
7763 -ms-transform: translateY(20px);
7764 transform: translateY(20px);
7765 }
7766 100% {
7767 opacity: 0.2;
7768 -webkit-transform: translateY(0);
7769 -ms-transform: translateY(0);
7770 transform: translateY(0);
7771 }
7772 }
7773 .fadeInUp2 {
7774 -webkit-animation-name: fadeInUp2;
7775 animation-name: fadeInUp2;
7776 }
7777
7778 @-webkit-keyframes fadeInUpBig {
7779 0% {
7780 opacity: 0;
7781 -webkit-transform: translateY(2000px);
7782 transform: translateY(2000px);
7783 }
7784 100% {
7785 opacity: 1;
7786 -webkit-transform: translateY(0);
7787 transform: translateY(0);
7788 }
7789 }
7790 @keyframes fadeInUpBig {
7791 0% {
7792 opacity: 0;
7793 -webkit-transform: translateY(2000px);
7794 -ms-transform: translateY(2000px);
7795 transform: translateY(2000px);
7796 }
7797 100% {
7798 opacity: 1;
7799 -webkit-transform: translateY(0);
7800 -ms-transform: translateY(0);
7801 transform: translateY(0);
7802 }
7803 }
7804 .fadeInUpBig {
7805 -webkit-animation-name: fadeInUpBig;
7806 animation-name: fadeInUpBig;
7807 }
7808
7809 @-webkit-keyframes fadeOut {
7810 0% {
7811 opacity: 1;
7812 }
7813 100% {
7814 opacity: 0;
7815 }
7816 }
7817 @keyframes fadeOut {
7818 0% {
7819 opacity: 1;
7820 }
7821 100% {
7822 opacity: 0;
7823 }
7824 }
7825 .fadeOut {
7826 -webkit-animation-name: fadeOut;
7827 animation-name: fadeOut;
7828 }
7829
7830 @-webkit-keyframes fadeOutDown {
7831 0% {
7832 opacity: 1;
7833 -webkit-transform: translateY(0);
7834 transform: translateY(0);
7835 }
7836 100% {
7837 opacity: 0;
7838 -webkit-transform: translateY(20px);
7839 transform: translateY(20px);
7840 }
7841 }
7842 @keyframes fadeOutDown {
7843 0% {
7844 opacity: 1;
7845 -webkit-transform: translateY(0);
7846 -ms-transform: translateY(0);
7847 transform: translateY(0);
7848 }
7849 100% {
7850 opacity: 0;
7851 -webkit-transform: translateY(20px);
7852 -ms-transform: translateY(20px);
7853 transform: translateY(20px);
7854 }
7855 }
7856 .fadeOutDown {
7857 -webkit-animation-name: fadeOutDown;
7858 animation-name: fadeOutDown;
7859 }
7860
7861 @-webkit-keyframes fadeOutDownBig {
7862 0% {
7863 opacity: 1;
7864 -webkit-transform: translateY(0);
7865 transform: translateY(0);
7866 }
7867 100% {
7868 opacity: 0;
7869 -webkit-transform: translateY(2000px);
7870 transform: translateY(2000px);
7871 }
7872 }
7873 @keyframes fadeOutDownBig {
7874 0% {
7875 opacity: 1;
7876 -webkit-transform: translateY(0);
7877 -ms-transform: translateY(0);
7878 transform: translateY(0);
7879 }
7880 100% {
7881 opacity: 0;
7882 -webkit-transform: translateY(2000px);
7883 -ms-transform: translateY(2000px);
7884 transform: translateY(2000px);
7885 }
7886 }
7887 .fadeOutDownBig {
7888 -webkit-animation-name: fadeOutDownBig;
7889 animation-name: fadeOutDownBig;
7890 }
7891
7892 @-webkit-keyframes fadeOutLeft {
7893 0% {
7894 opacity: 1;
7895 -webkit-transform: translateX(0);
7896 transform: translateX(0);
7897 }
7898 100% {
7899 opacity: 0;
7900 -webkit-transform: translateX(-20px);
7901 transform: translateX(-20px);
7902 }
7903 }
7904 @keyframes fadeOutLeft {
7905 0% {
7906 opacity: 1;
7907 -webkit-transform: translateX(0);
7908 -ms-transform: translateX(0);
7909 transform: translateX(0);
7910 }
7911 100% {
7912 opacity: 0;
7913 -webkit-transform: translateX(-20px);
7914 -ms-transform: translateX(-20px);
7915 transform: translateX(-20px);
7916 }
7917 }
7918 .fadeOutLeft {
7919 -webkit-animation-name: fadeOutLeft;
7920 animation-name: fadeOutLeft;
7921 }
7922
7923 @-webkit-keyframes fadeOutLeftBig {
7924 0% {
7925 opacity: 1;
7926 -webkit-transform: translateX(0);
7927 transform: translateX(0);
7928 }
7929 100% {
7930 opacity: 0;
7931 -webkit-transform: translateX(-2000px);
7932 transform: translateX(-2000px);
7933 }
7934 }
7935 @keyframes fadeOutLeftBig {
7936 0% {
7937 opacity: 1;
7938 -webkit-transform: translateX(0);
7939 -ms-transform: translateX(0);
7940 transform: translateX(0);
7941 }
7942 100% {
7943 opacity: 0;
7944 -webkit-transform: translateX(-2000px);
7945 -ms-transform: translateX(-2000px);
7946 transform: translateX(-2000px);
7947 }
7948 }
7949 .fadeOutLeftBig {
7950 -webkit-animation-name: fadeOutLeftBig;
7951 animation-name: fadeOutLeftBig;
7952 }
7953
7954 @-webkit-keyframes fadeOutRight {
7955 0% {
7956 opacity: 1;
7957 -webkit-transform: translateX(0);
7958 transform: translateX(0);
7959 }
7960 100% {
7961 opacity: 0;
7962 -webkit-transform: translateX(20px);
7963 transform: translateX(20px);
7964 }
7965 }
7966 @keyframes fadeOutRight {
7967 0% {
7968 opacity: 1;
7969 -webkit-transform: translateX(0);
7970 -ms-transform: translateX(0);
7971 transform: translateX(0);
7972 }
7973 100% {
7974 opacity: 0;
7975 -webkit-transform: translateX(20px);
7976 -ms-transform: translateX(20px);
7977 transform: translateX(20px);
7978 }
7979 }
7980 .fadeOutRight {
7981 -webkit-animation-name: fadeOutRight;
7982 animation-name: fadeOutRight;
7983 }
7984
7985 @-webkit-keyframes fadeOutRightBig {
7986 0% {
7987 opacity: 1;
7988 -webkit-transform: translateX(0);
7989 transform: translateX(0);
7990 }
7991 100% {
7992 opacity: 0;
7993 -webkit-transform: translateX(2000px);
7994 transform: translateX(2000px);
7995 }
7996 }
7997 @keyframes fadeOutRightBig {
7998 0% {
7999 opacity: 1;
8000 -webkit-transform: translateX(0);
8001 -ms-transform: translateX(0);
8002 transform: translateX(0);
8003 }
8004 100% {
8005 opacity: 0;
8006 -webkit-transform: translateX(2000px);
8007 -ms-transform: translateX(2000px);
8008 transform: translateX(2000px);
8009 }
8010 }
8011 .fadeOutRightBig {
8012 -webkit-animation-name: fadeOutRightBig;
8013 animation-name: fadeOutRightBig;
8014 }
8015
8016 @-webkit-keyframes fadeOutUp {
8017 0% {
8018 opacity: 1;
8019 -webkit-transform: translateY(0);
8020 transform: translateY(0);
8021 }
8022 100% {
8023 opacity: 0;
8024 -webkit-transform: translateY(-20px);
8025 transform: translateY(-20px);
8026 }
8027 }
8028 @keyframes fadeOutUp {
8029 0% {
8030 opacity: 1;
8031 -webkit-transform: translateY(0);
8032 -ms-transform: translateY(0);
8033 transform: translateY(0);
8034 }
8035 100% {
8036 opacity: 0;
8037 -webkit-transform: translateY(-20px);
8038 -ms-transform: translateY(-20px);
8039 transform: translateY(-20px);
8040 }
8041 }
8042 .fadeOutUp {
8043 -webkit-animation-name: fadeOutUp;
8044 animation-name: fadeOutUp;
8045 }
8046
8047 @-webkit-keyframes fadeOutUpBig {
8048 0% {
8049 opacity: 1;
8050 -webkit-transform: translateY(0);
8051 transform: translateY(0);
8052 }
8053 100% {
8054 opacity: 0;
8055 -webkit-transform: translateY(-2000px);
8056 transform: translateY(-2000px);
8057 }
8058 }
8059 @keyframes fadeOutUpBig {
8060 0% {
8061 opacity: 1;
8062 -webkit-transform: translateY(0);
8063 -ms-transform: translateY(0);
8064 transform: translateY(0);
8065 }
8066 100% {
8067 opacity: 0;
8068 -webkit-transform: translateY(-2000px);
8069 -ms-transform: translateY(-2000px);
8070 transform: translateY(-2000px);
8071 }
8072 }
8073 .fadeOutUpBig {
8074 -webkit-animation-name: fadeOutUpBig;
8075 animation-name: fadeOutUpBig;
8076 }
8077
8078 .app-pricing-area {
8079 position: relative;
8080 background-size: cover;
8081 background-position: center;
8082 background-repeat: no-repeat;
8083 z-index: 1;
8084 }
8085
8086 .app-pricing-area .shape {
8087 position: absolute;
8088 z-index: -1;
8089 }
8090
8091 .app-pricing-area .shape:nth-child(1) {
8092 width: 10px;
8093 height: 10px;
8094 top: 7%;
8095 left: 15%;
8096 position: absolute;
8097 border-radius: 50%;
8098 background: #37bd8a;
8099 animation: zoomIn 3s linear infinite both alternate-reverse;
8100 }
8101
8102 .app-pricing-area .shape:nth-child(2) {
8103 width: 25px;
8104 height: 25px;
8105 top: 10%;
8106 left: 7%;
8107 position: absolute;
8108 border-radius: 50%;
8109 background: #bbc0c4;
8110 animation: zoomIn 6s linear infinite both alternate-reverse;
8111 }
8112
8113 .app-pricing-area .shape:nth-child(3) {
8114 width: 10px;
8115 height: 10px;
8116 top: 18%;
8117 right: 26%;
8118 position: absolute;
8119 border-radius: 50%;
8120 background: #37bd8a;
8121 animation: zoomIn 4s linear infinite both alternate-reverse;
8122 }
8123
8124 .app-pricing-area .shape:nth-child(4) {
8125 width: 25px;
8126 height: 25px;
8127 top: 10%;
8128 right: 12%;
8129 position: absolute;
8130 border-radius: 50%;
8131 background: #bbc0c4;
8132 animation: zoomIn 5s linear infinite both alternate-reverse;
8133 }
8134
8135 .app-pricing-area .shape:nth-child(5) {
8136 top: 16%;
8137 left: 24%;
8138 position: absolute;
8139 }
8140
8141 .app-pricing-area .shape:nth-child(6) {
8142 right: 20%;
8143 bottom: 12%;
8144 position: absolute;
8145 }
8146
8147 .spel-steps-panel {
8148 box-shadow: 0 3px 6px 0 rgba(4, 73, 89, 0.02);
8149 border: 1px solid rgb(235, 235, 235);
8150 border-radius: 10px;
8151 display: flex;
8152 padding: 22px 0;
8153 }
8154 .spel-steps-panel .item-list {
8155 position: relative;
8156 list-style: none;
8157 padding-left: 20px;
8158 }
8159 .spel-steps-panel .item-list::after {
8160 content: "";
8161 position: absolute;
8162 left: 32px;
8163 top: 2px;
8164 bottom: 5px;
8165 width: 1px;
8166 background-color: #c4cdd5;
8167 }
8168 .spel-steps-panel .item-list li {
8169 font-size: 16px;
8170 margin: 16px 0;
8171 position: relative;
8172 padding-left: 35px;
8173 z-index: 1;
8174 line-height: 25px;
8175 }
8176 .spel-steps-panel .item-list li:first-child {
8177 margin-top: 0 !important;
8178 }
8179 .spel-steps-panel .item-list li:last-child {
8180 margin-bottom: 0 !important;
8181 }
8182 .spel-steps-panel .item-list li .icon {
8183 display: flex;
8184 justify-content: center;
8185 align-items: center;
8186 position: absolute;
8187 height: 32px;
8188 width: 32px;
8189 border-radius: 50%;
8190 background-color: var(--e-global-color-accent);
8191 left: -4px;
8192 border: 5px solid #ffffff;
8193 }
8194 .spel-steps-panel .item-list li .icon i {
8195 color: #fff;
8196 font-weight: 500;
8197 font-size: 12px;
8198 }
8199 .spel-steps-panel .item-list li .icon svg {
8200 height: 10px;
8201 width: 10px;
8202 }
8203 .spel-steps-panel .ordered {
8204 counter-reset: list-counter;
8205 }
8206 .spel-steps-panel .ordered li {
8207 counter-increment: list-counter;
8208 position: relative;
8209 padding-left: 50px;
8210 }
8211 .spel-steps-panel .ordered li::before {
8212 content: counter(list-counter);
8213 position: absolute;
8214 display: flex;
8215 justify-content: center;
8216 align-items: center;
8217 height: 32px;
8218 width: 32px;
8219 border-radius: 50%;
8220 background-color: var(--e-global-color-accent);
8221 left: 0;
8222 border: 5px solid #ffffff;
8223 color: #fff;
8224 font-weight: 500;
8225 font-size: 12px;
8226 transition: all 0.3s ease;
8227 }
8228 .spel-steps-panel .ordered.alpha li::before {
8229 content: counter(list-counter, lower-alpha);
8230 }
8231 .spel-steps-panel .ordered.roman li::before {
8232 content: counter(list-counter, upper-roman);
8233 }
8234
8235 /*========== cheatsheet_info css =========*/
8236 .cheatsheet_info + .cheatsheet_info {
8237 margin-top: 30px;
8238 }
8239
8240 .cheatsheet_accordion .card {
8241 border: 0;
8242 padding: 0;
8243 overflow: visible;
8244 margin-top: 0;
8245 background: transparent;
8246 }
8247 .cheatsheet_accordion .card .card-header {
8248 padding: 0;
8249 border: 0;
8250 background: transparent;
8251 }
8252 .cheatsheet_accordion .card .card-header button {
8253 padding: 0;
8254 font-size: 20px;
8255 font-weight: 600;
8256 margin-bottom: 30px;
8257 background: transparent;
8258 color: var(--black_900);
8259 text-decoration: none;
8260 margin-left: 8px;
8261 border: none;
8262 }
8263 .cheatsheet_accordion .card .card-header button .minus {
8264 display: inline-block;
8265 }
8266 .cheatsheet_accordion .card .card-header button .pluse {
8267 display: none;
8268 }
8269 .cheatsheet_accordion .card .card-header button.active .pluse {
8270 display: inline-block;
8271 }
8272 .cheatsheet_accordion .card .card-header button.active .minus {
8273 display: none;
8274 }
8275 .cheatsheet_accordion .collapse.show {
8276 display: block;
8277 }
8278
8279 .cheatsheet_item {
8280 text-align: left;
8281 padding: 20px 20px 30px;
8282 margin-bottom: 0;
8283 transition: all 0.3s linear;
8284 background: var(--bs-white);
8285 box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);
8286 }
8287 .cheatsheet_item:hover {
8288 box-shadow: 0 20px 27px 0 rgba(4, 73, 89, 0.08);
8289 }
8290 .cheatsheet_item .cheatsheet_num {
8291 text-align: right;
8292 transition: 0.3s;
8293 }
8294 .cheatsheet_item p {
8295 margin-bottom: 0;
8296 transition: 0.3s;
8297 }
8298 .cheatsheet_item h5 {
8299 margin-bottom: 0;
8300 color: rgb(76, 76, 241);
8301 transition: 0.3s;
8302 }
8303
8304 .light-header {
8305 position: absolute;
8306 bottom: -23px;
8307 left: 0;
8308 width: 100%;
8309 text-align: center;
8310 }
8311 @media (max-width: 768px) {
8312 .light-header {
8313 bottom: -10px;
8314 }
8315 }
8316 .light-header .title-light {
8317 color: #eff4f7;
8318 font-size: 60px;
8319 font-weight: 700;
8320 line-height: 1;
8321 margin: 0;
8322 }
8323 @media (max-width: 768px) {
8324 .light-header .title-light {
8325 font-size: 30px;
8326 bottom: -10px;
8327 }
8328 }
8329
8330 .cheat-info-box {
8331 display: flex;
8332 align-items: start;
8333 padding: 10px;
8334 background-color: #f7e2cf;
8335 border-radius: 5px;
8336 transition: 0.3s;
8337 position: relative;
8338 }
8339 .cheat-info-box .cheatsheet_num {
8340 position: absolute;
8341 right: 20px;
8342 }
8343 .cheat-info-box .outline {
8344 position: relative;
8345 }
8346 .cheat-info-box .outline:before {
8347 content: "";
8348 position: absolute;
8349 top: 20px;
8350 left: 60px;
8351 width: 48px;
8352 height: 3px;
8353 background-color: #d9534f;
8354 }
8355 .cheat-info-box .outline .info-box-number {
8356 background-color: #d9534f;
8357 border-radius: 50%;
8358 min-width: 72px;
8359 height: 72px;
8360 display: flex;
8361 align-items: center;
8362 justify-content: center;
8363 overflow: hidden;
8364 }
8365 .cheat-info-box .outline .info-box-number .number-circle {
8366 background-color: #fff;
8367 color: #d9534f;
8368 border-radius: 50%;
8369 min-width: 50px;
8370 height: 50px;
8371 display: flex;
8372 align-items: center;
8373 justify-content: center;
8374 font-size: 22px;
8375 font-weight: 500;
8376 box-shadow: 15px 20px 0 rgba(0, 0, 0, 0.1);
8377 }
8378 .cheat-info-box .cheat-info-content {
8379 padding: 10px 0 0 15px;
8380 display: inline-block;
8381 }
8382 .cheat-info-box .cheat-info-content .info-box-heading {
8383 font-size: 20px;
8384 font-weight: 700;
8385 color: #d9534f;
8386 transition: 0.3s;
8387 margin: 0 0 0 24px;
8388 }
8389 .cheat-info-box .cheat-info-content .info-box-description {
8390 font-size: 14px;
8391 color: #333;
8392 transition: 0.3s;
8393 }
8394
8395 .smooth-show-hide {
8396 display: none;
8397 opacity: 0;
8398 transition: opacity 0.5s ease-in-out; /* Smooth transition */
8399 }
8400
8401 .smooth-show-hide.visible {
8402 display: block;
8403 opacity: 1;
8404 }
8405
8406 /*========== cheatsheet-3 css =========*/
8407 .cs-items3-gap {
8408 grid-gap: 30px;
8409 }
8410 .cs-items3-gap .cs-items3 {
8411 padding: 20px 20px 25px;
8412 border-radius: 10px;
8413 overflow: hidden;
8414 transition: 0.3s;
8415 box-shadow: 0 5px 15px 5px rgba(0, 0, 0, 0.075);
8416 }
8417 .cs-items3-gap .cs-items3 .cs-outline3 {
8418 display: flex;
8419 position: relative;
8420 align-items: center;
8421 column-gap: 42px;
8422 transition: 0.3s;
8423 }
8424 .cs-items3-gap .cs-items3 .cs-outline3:before {
8425 content: "";
8426 position: absolute;
8427 top: 15px;
8428 left: 35px;
8429 width: 25px;
8430 height: 2px;
8431 background-color: #f6ba18;
8432 transition: 0.3s;
8433 }
8434 .cs-items3-gap .cs-items3 .cs-outline3 .serial-number {
8435 line-height: 1.3;
8436 font-size: 24px;
8437 font-weight: 700;
8438 color: #245749;
8439 transition: 0.3s;
8440 }
8441 .cs-items3-gap .cs-items3 .cs-outline3 .cs3-title {
8442 font-size: 24px;
8443 font-weight: 700;
8444 color: #245749;
8445 margin: 0;
8446 transition: 0.3s;
8447 }
8448 .cs-items3-gap .cs-items3 .cs-info-desc {
8449 color: #1a3830;
8450 transition: 0.3s;
8451 margin: 10px 0 15px;
8452 }
8453
8454 .expert-slider-one .item {
8455 margin: 0 15px;
8456 }
8457
8458 .card-style-three .name {
8459 font-weight: 500;
8460 font-size: 20px;
8461 color: #212529;
8462 cursor: pointer;
8463 }
8464 .card-style-three .name:hover {
8465 color: #244034;
8466 text-decoration: underline;
8467 }
8468 .card-style-three .img-meta {
8469 margin-bottom: 20px;
8470 }
8471 .card-style-three .img-meta img {
8472 border-radius: 200px;
8473 }
8474
8475 .card-style-three .post {
8476 color: rgba(0, 0, 0, 0.5);
8477 }
8478
8479 .expert-section-one .slick-arrow-one {
8480 position: absolute;
8481 right: 0;
8482 top: -100px;
8483 }
8484
8485 .slick-arrow-one {
8486 margin-left: -2px;
8487 margin-right: -2px;
8488 }
8489 .slick-arrow-one li {
8490 cursor: pointer;
8491 width: 50px;
8492 height: 50px;
8493 border-radius: 50%;
8494 color: #000;
8495 text-align: center;
8496 line-height: 50px;
8497 font-size: 22px;
8498 transition: all 0.2s linear;
8499 display: flex;
8500 align-items: center;
8501 justify-content: center;
8502 }
8503 .slick-arrow-one li:hover {
8504 background: #d2f34c;
8505 }
8506 .slick-arrow-one.color-two li:hover {
8507 background: #d2f34c;
8508 color: #fff;
8509 }
8510
8511 .expert-slider-two {
8512 margin-left: -15px;
8513 margin-right: -15px;
8514 }
8515 .expert-slider-two .slick-slide {
8516 margin: 0 15px;
8517 }
8518 .expert-slider-two .slick-dots {
8519 position: relative;
8520 padding: 0;
8521 margin: 65px 0 0;
8522 justify-content: center;
8523 bottom: 0;
8524 display: flex;
8525 }
8526 .expert-slider-two .slick-dots:after, .expert-slider-two .slick-dots::before {
8527 content: "";
8528 position: absolute;
8529 width: 44%;
8530 height: 1px;
8531 background: #e0e0e0;
8532 top: 4px;
8533 left: 0;
8534 }
8535 .expert-slider-two .slick-dots::before {
8536 left: auto;
8537 right: 0;
8538 }
8539 .expert-slider-two .slick-dots li {
8540 margin: 0;
8541 padding: 0;
8542 width: auto;
8543 height: auto;
8544 }
8545 .expert-slider-two .slick-dots li button {
8546 text-indent: -50000px;
8547 width: 8px;
8548 height: 8px;
8549 border-radius: 50%;
8550 margin: 0 5px;
8551 background: #e4e4e4;
8552 transition: all 0.3s ease-in-out;
8553 }
8554 .expert-slider-two .slick-dots li.slick-active button {
8555 background: var(--e-global-color-accent);
8556 }
8557
8558 .card-style-eight .img-meta {
8559 position: relative;
8560 overflow: hidden;
8561 margin-bottom: 20px;
8562 }
8563 .card-style-eight .img-meta::before {
8564 content: "";
8565 position: absolute;
8566 width: 50px;
8567 height: 50px;
8568 background: #fff;
8569 right: -25px;
8570 bottom: -25px;
8571 transform: rotate(45deg);
8572 }
8573 .card-style-eight .img-meta img {
8574 width: 100%;
8575 }
8576
8577 .card-style-eight .name {
8578 font-size: 18px;
8579 color: #000;
8580 font-weight: 500;
8581 }
8582 .card-style-eight .name:hover {
8583 color: var(--e-global-color-accent);
8584 }
8585 .card-style-eight .post {
8586 font-size: 16px;
8587 color: rgba(0, 0, 0, 0.7);
8588 }
8589
8590 .big-circle {
8591 width: 490px;
8592 height: 490px;
8593 z-index: 1;
8594 border: 1px solid #EEEEEE;
8595 border-radius: 50%;
8596 margin: 0 !important;
8597 }
8598 .big-circle .inner-circle {
8599 width: 51%;
8600 height: 51%;
8601 border: 1px solid #EEEEEE;
8602 }
8603 .big-circle .shape_01 {
8604 right: -7%;
8605 bottom: 30%;
8606 }
8607 .big-circle .brand-icon {
8608 background: rgba(255, 255, 255, 0);
8609 position: absolute;
8610 z-index: 2;
8611 border: 1px solid #EEEEEE;
8612 overflow: hidden;
8613 }
8614 .big-circle .brand-icon:nth-child(1) {
8615 width: 51%;
8616 height: 51%;
8617 border: 1px solid #EEEEEE;
8618 position: relative;
8619 }
8620 .big-circle .brand-icon:nth-child(2) {
8621 width: 65px;
8622 height: 65px;
8623 top: -25px;
8624 left: 50%;
8625 animation: jumpTwo 8s infinite linear;
8626 }
8627 .big-circle .brand-icon:nth-child(3) {
8628 width: 100px;
8629 height: 100px;
8630 top: 19%;
8631 right: -4%;
8632 animation: jumpThree 8s infinite linear;
8633 }
8634 .big-circle .brand-icon:nth-child(4) {
8635 width: 140px;
8636 height: 140px;
8637 bottom: -8%;
8638 right: 10%;
8639 animation: jumpFour 8s infinite linear;
8640 }
8641 .big-circle .brand-icon:nth-child(5) {
8642 width: 80px;
8643 height: 80px;
8644 bottom: 8%;
8645 left: 4%;
8646 animation: jumpTwo 8s infinite linear;
8647 }
8648 .big-circle .brand-icon:nth-child(6) {
8649 width: 100px;
8650 height: 100px;
8651 top: 22%;
8652 left: -5%;
8653 animation: jumpThree 8s infinite linear;
8654 }
8655
8656 /* Custome Animation */
8657 @-webkit-keyframes jump {
8658 0% {
8659 -webkit-transform: translate3d(0, 0, 0);
8660 transform: translate3d(0, 0, 0);
8661 }
8662 40% {
8663 -webkit-transform: translate3d(0, 50%, 0);
8664 transform: translate3d(0, 50%, 0);
8665 }
8666 100% {
8667 -webkit-transform: translate3d(0, 0, 0);
8668 transform: translate3d(0, 0, 0);
8669 }
8670 }
8671 @keyframes jump {
8672 0% {
8673 -webkit-transform: translate3d(0, 0, 0);
8674 transform: translate3d(0, 0, 0);
8675 }
8676 40% {
8677 -webkit-transform: translate3d(0, 50%, 0);
8678 transform: translate3d(0, 50%, 0);
8679 }
8680 100% {
8681 -webkit-transform: translate3d(0, 0, 0);
8682 transform: translate3d(0, 0, 0);
8683 }
8684 }
8685 @-webkit-keyframes jumpTwo {
8686 0% {
8687 -webkit-transform: translate3d(0, 0, 0);
8688 transform: translate3d(0, 0, 0);
8689 }
8690 40% {
8691 -webkit-transform: translate3d(0, 20px, 0);
8692 transform: translate3d(0, 20px, 0);
8693 }
8694 100% {
8695 -webkit-transform: translate3d(0, 0, 0);
8696 transform: translate3d(0, 0, 0);
8697 }
8698 }
8699 @keyframes jumpTwo {
8700 0% {
8701 -webkit-transform: translate3d(0, 0, 0);
8702 transform: translate3d(0, 0, 0);
8703 }
8704 40% {
8705 -webkit-transform: translate3d(0, 20px, 0);
8706 transform: translate3d(0, 20px, 0);
8707 }
8708 100% {
8709 -webkit-transform: translate3d(0, 0, 0);
8710 transform: translate3d(0, 0, 0);
8711 }
8712 }
8713 @-webkit-keyframes jumpThree {
8714 0% {
8715 -webkit-transform: translate3d(0, 0, 0);
8716 transform: translate3d(0, 0, 0);
8717 }
8718 40% {
8719 -webkit-transform: translate3d(0, -20px, 0);
8720 transform: translate3d(0, -20px, 0);
8721 }
8722 100% {
8723 -webkit-transform: translate3d(0, 0, 0);
8724 transform: translate3d(0, 0, 0);
8725 }
8726 }
8727 @keyframes jumpThree {
8728 0% {
8729 -webkit-transform: translate3d(0, 0, 0);
8730 transform: translate3d(0, 0, 0);
8731 }
8732 40% {
8733 -webkit-transform: translate3d(0, -20px, 0);
8734 transform: translate3d(0, -20px, 0);
8735 }
8736 100% {
8737 -webkit-transform: translate3d(0, 0, 0);
8738 transform: translate3d(0, 0, 0);
8739 }
8740 }
8741 @-webkit-keyframes jumpFour {
8742 0% {
8743 -webkit-transform: translate3d(0, 0, 0);
8744 transform: translate3d(0, 0, 0);
8745 }
8746 50% {
8747 -webkit-transform: translate3d(0, -10px, 0);
8748 transform: translate3d(0, -10px, 0);
8749 }
8750 100% {
8751 -webkit-transform: translate3d(0, 0, 0);
8752 transform: translate3d(0, 0, 0);
8753 }
8754 }
8755 @keyframes jumpFour {
8756 0% {
8757 -webkit-transform: translate3d(0, 0, 0);
8758 transform: translate3d(0, 0, 0);
8759 }
8760 50% {
8761 -webkit-transform: translate3d(0, -10px, 0);
8762 transform: translate3d(0, -10px, 0);
8763 }
8764 100% {
8765 -webkit-transform: translate3d(0, 0, 0);
8766 transform: translate3d(0, 0, 0);
8767 }
8768 }
8769 @-webkit-keyframes jumpFive {
8770 0% {
8771 -webkit-transform: translate3d(0, 0, 0);
8772 transform: translate3d(0, 0, 0);
8773 }
8774 50% {
8775 -webkit-transform: translate3d(0, 10px, 0);
8776 transform: translate3d(0, 10px, 0);
8777 }
8778 100% {
8779 -webkit-transform: translate3d(0, 0, 0);
8780 transform: translate3d(0, 0, 0);
8781 }
8782 }
8783 @keyframes jumpFive {
8784 0% {
8785 -webkit-transform: translate3d(0, 0, 0);
8786 transform: translate3d(0, 0, 0);
8787 }
8788 50% {
8789 -webkit-transform: translate3d(0, 10px, 0);
8790 transform: translate3d(0, 10px, 0);
8791 }
8792 100% {
8793 -webkit-transform: translate3d(0, 0, 0);
8794 transform: translate3d(0, 0, 0);
8795 }
8796 }
8797 .integration_style_two {
8798 background: url("../images/bg_shape_02.png") no-repeat scroll center center;
8799 border: 0;
8800 }
8801 .integration_style_two .brand-icon {
8802 position: absolute;
8803 background: #fff;
8804 }
8805 .integration_style_two .brand-icon:nth-child(1) {
8806 width: 155px;
8807 height: 155px;
8808 position: absolute;
8809 top: 50%;
8810 left: 50%;
8811 transform: translate(-50%, -50%);
8812 }
8813 .integration_style_two .brand-icon:nth-child(2) {
8814 width: 55px;
8815 height: 55px;
8816 top: 2%;
8817 left: 50%;
8818 animation: jumpTwo 8s infinite linear;
8819 }
8820 .integration_style_two .brand-icon:nth-child(3) {
8821 width: 88px;
8822 height: 88px;
8823 top: 20%;
8824 right: 2%;
8825 animation: jumpThree 8s infinite linear;
8826 }
8827 .integration_style_two .brand-icon:nth-child(4) {
8828 width: 110px;
8829 height: 110px;
8830 bottom: -2%;
8831 right: 23%;
8832 animation: jumpFour 8s infinite linear;
8833 }
8834 .integration_style_two .brand-icon:nth-child(5) {
8835 width: 68px;
8836 height: 68px;
8837 bottom: 17%;
8838 left: 7%;
8839 animation: jumpTwo 8s infinite linear;
8840 }
8841 .integration_style_two .brand-icon:nth-child(6) {
8842 width: 88px;
8843 height: 88px;
8844 top: 20%;
8845 left: 2%;
8846 animation: jumpThree 8s infinite linear;
8847 }
8848
8849 @media (max-width: 1199px) {
8850 .big-circle .brand-icon {
8851 max-height: 105px;
8852 max-width: 105px;
8853 padding: 15px;
8854 }
8855 }
8856 @media (max-width: 991px) {
8857 .big-circle {
8858 margin: 60px auto 0;
8859 }
8860 .integration_style_two {
8861 margin-top: 0;
8862 background-size: contain !important;
8863 }
8864 }
8865 @media (max-width: 767px) {
8866 .big-circle {
8867 width: 370px;
8868 height: 370px;
8869 }
8870 }
8871 @media (max-width: 576px) {
8872 .big-circle .brand-icon:nth-child(2) {
8873 right: 1%;
8874 }
8875 .big-circle .brand-icon:nth-child(6) {
8876 left: 1%;
8877 }
8878 }
8879 .blog_grid_gap {
8880 row-gap: 50px;
8881 }
8882
8883 .blog-meta-two {
8884 transition: 0.3s;
8885 margin-bottom: 0;
8886 overflow: hidden;
8887 }
8888 .blog-meta-two .post-img {
8889 display: inline-block;
8890 position: relative;
8891 margin-bottom: unset !important;
8892 overflow: hidden;
8893 padding: 0;
8894 }
8895 .blog-meta-two .post-img a {
8896 overflow: hidden;
8897 }
8898 .blog-meta-two .post-img a img {
8899 transition: all 0.4s ease-in-out;
8900 }
8901 .blog-meta-two .post-img .tags {
8902 font-size: 11px;
8903 letter-spacing: 0.5px;
8904 border-radius: 13px;
8905 padding: 5px 18px;
8906 color: #fff;
8907 text-transform: uppercase;
8908 background: var(--e-global-color-accent);
8909 position: absolute;
8910 left: 30px;
8911 bottom: 30px;
8912 }
8913 .blog-meta-two .post-img .tags:hover {
8914 text-decoration: none;
8915 }
8916 .blog-meta-two .post-data .blog-one-title:hover {
8917 text-decoration: none;
8918 }
8919 .blog-meta-two:hover .post-img img {
8920 transform: scale3d(1.1, 1.1, 1);
8921 }
8922 .blog-meta-two .fw-500 {
8923 font-weight: 500;
8924 }
8925 .blog-meta-two .date a {
8926 color: #aaaaaa;
8927 }
8928 .blog-meta-two .date a:hover {
8929 color: #000;
8930 text-decoration: underline;
8931 }
8932 .blog-meta-two .blog-title {
8933 font-family: "gordita";
8934 font-size: 32px;
8935 line-height: 1.28em;
8936 margin: 25px 0;
8937 font-weight: 500;
8938 color: #000000;
8939 transition: all 0.3s ease-in-out;
8940 }
8941 .blog-meta-two .blog-title:hover {
8942 color: var(--e-global-color-accent);
8943 }
8944 .blog-meta-two .blog-title.two {
8945 font-size: 24px;
8946 line-height: 1.428em;
8947 margin-top: 10px;
8948 margin-bottom: 30px;
8949 }
8950 .blog-meta-two .continue-btn {
8951 font-size: 18px;
8952 color: #000;
8953 letter-spacing: -1px;
8954 vertical-align: middle;
8955 font-weight: 500;
8956 transition: all 0.3s linear;
8957 }
8958 .blog-meta-two .continue-btn i {
8959 margin-left: 5px;
8960 }
8961 .blog-meta-two .continue-btn:hover {
8962 color: var(--e-global-color-accent);
8963 text-decoration: none;
8964 }
8965 .blog-meta-two .continue-btn.btn-seven {
8966 font-weight: 500;
8967 padding: 13px 36px;
8968 text-align: center;
8969 border-radius: 50px;
8970 color: var(--e-global-color-accent);
8971 border: 1px solid var(--e-global-color-accent);
8972 transition: all 0.3s ease-in-out 0s;
8973 display: inline-block;
8974 text-align: center;
8975 }
8976 .blog-meta-two .continue-btn.btn-seven:hover {
8977 background: #244034;
8978 border-color: #244034;
8979 color: #fff;
8980 }
8981 .blog-meta-two.box-layout {
8982 background: #fff;
8983 border-radius: 20px;
8984 padding: 20px 25px 50px;
8985 }
8986 .blog-meta-two.box-layout .post-img {
8987 border-radius: 15px;
8988 }
8989
8990 .blog_item a:hover {
8991 text-decoration: none !important;
8992 }
8993
8994 .blog-meta-one {
8995 margin-top: 0;
8996 transition: 0.3s;
8997 }
8998 .blog-meta-one .post-img {
8999 overflow: hidden;
9000 display: inline-block;
9001 padding: 0;
9002 }
9003 .blog-meta-one .post-img img {
9004 transition: all 0.3s ease-in-out;
9005 }
9006 .blog-meta-one .post-data {
9007 margin-top: 25px;
9008 }
9009 .blog-meta-one .post-data .by-author {
9010 font-family: "IBM Plex Sans", sans-serif;
9011 font-size: 15px;
9012 font-weight: 400;
9013 line-height: 18px;
9014 color: rgba(0, 0, 0, 0.7019607843);
9015 margin-bottom: 0;
9016 padding-left: 0;
9017 text-transform: capitalize;
9018 }
9019 .blog-meta-one .post-data .by-author .author-name {
9020 font-size: 16px;
9021 color: #212529;
9022 font-weight: 600;
9023 }
9024 .blog-meta-one .post-data .by-author .author-name:hover {
9025 text-decoration: underline;
9026 }
9027 .blog-meta-one .date {
9028 font-size: 14px;
9029 color: rgba(0, 0, 0, 0.5);
9030 }
9031 .blog-meta-one .date .fw-500 {
9032 font-weight: 500;
9033 }
9034 .blog-meta-one .date a {
9035 color: rgba(0, 0, 0, 0.5);
9036 }
9037 .blog-meta-one .date a:hover {
9038 text-decoration: underline;
9039 }
9040 .blog-meta-one .blog-title {
9041 font-family: "gordita";
9042 font-size: 24px;
9043 line-height: 1.4em;
9044 color: #000;
9045 margin: 6px 0 10px 0;
9046 transition: all 0.3s ease-in-out;
9047 }
9048 .blog-meta-one .blog-title:hover {
9049 color: var(--e-global-color-accent);
9050 }
9051 .blog-meta-one p {
9052 font-family: "gordita";
9053 font-size: 16px;
9054 color: rgba(0, 0, 0, 0.7);
9055 margin-bottom: 20px;
9056 }
9057 .blog-meta-one .continue-btn {
9058 font-size: 30px;
9059 color: #000;
9060 }
9061 .blog-meta-one .continue-btn:hover {
9062 text-decoration: none;
9063 }
9064 .blog-meta-one .author {
9065 font-size: 16px;
9066 color: rgba(0, 0, 0, 0.7);
9067 }
9068 .blog-meta-one .author a {
9069 font-weight: 500;
9070 color: #000;
9071 transition: all 0.2s linear;
9072 }
9073 .blog-meta-one .author a:hover {
9074 text-decoration: underline;
9075 }
9076 .blog-meta-one:hover .post-img img {
9077 transform: scale3d(1.1, 1.1, 1);
9078 }
9079 .blog-meta-one .blog-tow-title:hover {
9080 text-decoration: none;
9081 }
9082
9083 .blog-meta-one .tags {
9084 font-size: 15px;
9085 color: rgba(0, 0, 0, 0.4);
9086 transition: all 0.2s linear;
9087 }
9088 .blog-meta-one .tags:hover {
9089 color: #000;
9090 text-decoration: none;
9091 }
9092
9093 .item-margin {
9094 margin: 0 12px;
9095 }
9096
9097 .card-style-six {
9098 display: flex;
9099 align-items: flex-end;
9100 background-position: center;
9101 background-repeat: no-repeat;
9102 background-size: cover;
9103 position: relative;
9104 z-index: 1;
9105 height: 350px;
9106 }
9107 .card-style-six:before {
9108 content: "";
9109 width: 100%;
9110 height: 30%;
9111 bottom: 0;
9112 left: 0;
9113 z-index: -1;
9114 position: absolute;
9115 background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, #000000 100%);
9116 -webkit-transition: all 0.2s ease-in-out 0s;
9117 -moz-transition: all 0.2s ease-in-out 0s;
9118 -ms-transition: all 0.2s ease-in-out 0s;
9119 -o-transition: all 0.2s ease-in-out 0s;
9120 transition: all 0.2s ease-in-out 0s;
9121 }
9122 .card-style-six:hover:before {
9123 height: 100%;
9124 }
9125 .card-style-six .blog-item-six {
9126 padding: 0 0 20px 24px;
9127 text-decoration: none !important;
9128 }
9129 .card-style-six .blog-item-six .blog-six-title {
9130 font-family: "gordita";
9131 font-size: 22px;
9132 line-height: 1.3em;
9133 font-weight: 500;
9134 color: #fff;
9135 }
9136
9137 .blog-slider-arrows {
9138 position: absolute;
9139 top: -60px;
9140 right: -2px;
9141 }
9142 @media (min-width: 992px) and (max-width: 1201px) {
9143 .blog-slider-arrows {
9144 top: -100px;
9145 }
9146 }
9147 @media (min-width: 541px) and (max-width: 991px) {
9148 .blog-slider-arrows {
9149 top: -80px;
9150 }
9151 }
9152 @media only screen and (max-width: 540px) {
9153 .blog-slider-arrows {
9154 position: static;
9155 margin-top: 20px;
9156 }
9157 }
9158 .blog-slider-arrows .blog-slick-arrow {
9159 width: 40px;
9160 height: 35px;
9161 cursor: pointer;
9162 border: 1px solid #f5f5f5;
9163 text-align: center;
9164 line-height: 31px;
9165 font-size: 17px;
9166 color: black;
9167 display: flex;
9168 justify-content: center;
9169 align-items: center;
9170 transition: all 0.2s ease-in-out 0s;
9171 }
9172 .blog-slider-arrows .blog-slick-arrow:hover {
9173 background: #f5f5f5;
9174 color: #005025;
9175 }
9176
9177 .spel-pagination {
9178 display: flex;
9179 align-items: center;
9180 }
9181 .spel-pagination .current {
9182 width: 35px;
9183 height: 35px;
9184 text-align: center;
9185 line-height: 35px;
9186 border-radius: 50%;
9187 font-size: 17px;
9188 font-weight: 500;
9189 color: #fff;
9190 background: var(--e-global-color-accent);
9191 }
9192 .spel-pagination a {
9193 width: 35px;
9194 height: 35px;
9195 text-align: center;
9196 line-height: 35px;
9197 border-radius: 50%;
9198 font-size: 17px;
9199 font-weight: 500;
9200 color: var(--e-global-color-accent);
9201 }
9202 .spel-pagination a:hover {
9203 text-decoration: none;
9204 }
9205 .spel-pagination a.prev, .spel-pagination a.next {
9206 display: flex;
9207 align-items: center;
9208 width: auto;
9209 height: auto;
9210 }
9211
9212 .timeline-widget {
9213 list-style: none;
9214 padding: 0;
9215 position: relative;
9216 }
9217 .timeline-widget::before {
9218 top: 0;
9219 bottom: 0;
9220 position: absolute;
9221 content: " ";
9222 width: 5px;
9223 background-color: #f5f5f5;
9224 left: 50%;
9225 margin-left: -1.5px;
9226 border-radius: 2.5px;
9227 }
9228
9229 .timeline-wrapper {
9230 display: block;
9231 margin-bottom: 40px;
9232 position: relative;
9233 width: 100%;
9234 padding-right: 90px;
9235 }
9236 .timeline-wrapper.timeline-inverted {
9237 padding-right: 0;
9238 padding-left: 90px;
9239 }
9240 .timeline-wrapper.timeline-inverted .timeline-panel {
9241 margin-left: auto;
9242 margin-right: 10%;
9243 text-align: left;
9244 }
9245 .timeline-wrapper.timeline-inverted .timeline-panel p::after {
9246 left: inherit;
9247 right: calc(100% + 75px);
9248 }
9249 .timeline-wrapper.timeline-inverted .timestamp {
9250 left: inherit;
9251 right: calc(50% + 30px);
9252 }
9253 .timeline-wrapper.timeline-inverted .timestamp::after {
9254 right: inherit;
9255 left: 100%;
9256 border-right: none;
9257 border-left: 11px solid #f5f5f5;
9258 }
9259 .timeline-wrapper::after {
9260 content: "";
9261 width: 15px;
9262 height: 15px;
9263 position: absolute;
9264 top: 16px;
9265 left: calc(50% - 7px);
9266 z-index: 0;
9267 border-radius: 50%;
9268 border: 3px solid #3d3d4e;
9269 }
9270 .timeline-wrapper .timeline-panel {
9271 position: relative;
9272 width: 40%;
9273 text-align: right;
9274 margin-left: 10%;
9275 }
9276 .timeline-wrapper .timeline-panel h3 {
9277 font-family: "IBM Plex Sans", sans-serif;
9278 font-size: 24px;
9279 font-weight: 500;
9280 line-height: 30px;
9281 color: #17161a;
9282 }
9283 .timeline-wrapper .timeline-panel span,
9284 .timeline-wrapper .timeline-panel p {
9285 font-family: "IBM Plex Sans", sans-serif;
9286 font-size: 16px;
9287 font-weight: 400;
9288 line-height: 28px;
9289 color: #3d3d4e;
9290 }
9291 .timeline-wrapper .timeline-panel p {
9292 margin-top: 20px;
9293 position: relative;
9294 }
9295 .timeline-wrapper .timeline-panel p::after {
9296 content: "";
9297 width: 100%;
9298 height: 100%;
9299 background-image: url("../images/timeline-bg.png");
9300 background-position: center;
9301 background-size: cover;
9302 position: absolute;
9303 left: calc(100% + 75px);
9304 top: 0;
9305 }
9306 .timeline-wrapper .timestamp {
9307 position: absolute;
9308 top: 9px;
9309 left: calc(50% + 30px);
9310 z-index: 0;
9311 background: #f5f5f5;
9312 border-radius: 3px;
9313 padding: 2px 9px;
9314 font-family: "IBM Plex Sans", sans-serif;
9315 font-size: 12px;
9316 font-weight: 400;
9317 }
9318 .timeline-wrapper .timestamp::after {
9319 position: absolute;
9320 right: 100%;
9321 content: "";
9322 width: 0;
9323 height: 0;
9324 border-top: 7px solid transparent;
9325 border-bottom: 7px solid transparent;
9326 border-right: 11px solid #f5f5f5;
9327 top: 50%;
9328 transform: translateY(-50%);
9329 }
9330
9331 .timeline-roadmap .icon {
9332 position: relative;
9333 z-index: 1;
9334 height: 100%;
9335 display: inline-block;
9336 overflow: hidden;
9337 }
9338 .timeline-roadmap .icon.animated::after {
9339 transform: scaleY(1);
9340 }
9341 .timeline-roadmap .icon.no-line::after {
9342 display: none;
9343 }
9344 .timeline-roadmap .icon img {
9345 border-radius: 50%;
9346 padding: 15px;
9347 border: 1px solid #ccccce;
9348 background: #f5f5f5;
9349 display: inline-flex;
9350 overflow: hidden;
9351 }
9352 .timeline-roadmap .icon::after {
9353 content: "";
9354 position: absolute;
9355 border-left: 1px solid #ccccce;
9356 z-index: -1;
9357 height: 100%;
9358 left: 50%;
9359 top: 10%;
9360 transform: scaleY(0);
9361 transform-origin: top;
9362 transition: transform 1s linear;
9363 }
9364 .timeline-roadmap h4 {
9365 margin-bottom: 30px;
9366 margin-top: 15px;
9367 }
9368 .timeline-roadmap h4 a {
9369 font-family: "IBM Plex Sans", sans-serif;
9370 color: #17161a;
9371 }
9372 .timeline-roadmap .timeline div {
9373 padding: 0;
9374 height: 40px;
9375 }
9376 .timeline-roadmap .curve {
9377 display: flex;
9378 overflow: hidden;
9379 }
9380 .timeline-roadmap .corner {
9381 border: 1px solid #ccccce;
9382 width: 100%;
9383 position: relative;
9384 border-radius: 10px;
9385 transform: scaleX(0);
9386 transform-origin: left;
9387 transition: transform 1s linear;
9388 }
9389 .timeline-roadmap .corner.top-right {
9390 left: 43px;
9391 top: -50%;
9392 transition-delay: 1s;
9393 }
9394 .timeline-roadmap .corner.top-left {
9395 right: 42px;
9396 top: -50%;
9397 transform-origin: right;
9398 transition-delay: 1s;
9399 }
9400 .timeline-roadmap .corner.right-bottom {
9401 left: 43px;
9402 top: calc(50% - 1px);
9403 transform-origin: right;
9404 transition-delay: 4s;
9405 }
9406 .timeline-roadmap .corner.left-bottom {
9407 right: 43px;
9408 top: calc(50% - 1px);
9409 transition-delay: 4s;
9410 }
9411 .timeline-roadmap .animated hr {
9412 transform: scale(1);
9413 transition-delay: 2s;
9414 }
9415 .timeline-roadmap .animated .corner {
9416 transform: scale(1);
9417 }
9418 .timeline-roadmap hr {
9419 border-top: 1px solid #ccccce;
9420 margin: 0;
9421 top: 19px;
9422 position: relative;
9423 opacity: 1;
9424 transform: scaleX(0);
9425 transform-origin: left;
9426 transition: transform 2s linear;
9427 }
9428 .timeline-roadmap .animate-reverse hr {
9429 transform-origin: right;
9430 }
9431
9432 .keyword-tag {
9433 display: flex;
9434 gap: 10px;
9435 flex-wrap: wrap;
9436 margin-bottom: 30px;
9437 }
9438 .keyword-tag a {
9439 display: inline-block;
9440 color: #17161a;
9441 padding: 1px 10px;
9442 background-color: #fff;
9443 box-shadow: 0 1px 5px 0 rgba(0, 0, 0, 0.0509803922);
9444 color: #17161a;
9445 border-radius: 3px;
9446 }
9447 .keyword-tag a:hover {
9448 background-color: var(--e-global-color-accent);
9449 color: #fff;
9450 box-shadow: none;
9451 }
9452
9453 .scroll-down-one {
9454 display: inline-block;
9455 }
9456 .scroll-down-one .circle {
9457 height: 25px;
9458 width: 18px;
9459 border-radius: 9px;
9460 position: relative;
9461 border: 1px solid #fff;
9462 box-sizing: border-box;
9463 }
9464 .scroll-down-one .circle::after {
9465 content: "";
9466 position: absolute;
9467 top: 50%;
9468 left: 50%;
9469 transform: translate(-50%, -50%);
9470 height: 6px;
9471 width: 1px;
9472 background-color: #fff;
9473 }
9474 .scroll-down-one .arrow-cont {
9475 cursor: pointer;
9476 position: relative;
9477 display: inline-block;
9478 height: 20px;
9479 width: 20px;
9480 }
9481 .scroll-down-one .arrow-cont i {
9482 position: absolute;
9483 bottom: 0;
9484 background-size: contain;
9485 top: 2px;
9486 left: 0%;
9487 font-size: 17px;
9488 color: #fff;
9489 }
9490 .scroll-down-one .arrow-cont i:nth-child(2) {
9491 margin-top: 5.5px;
9492 }
9493 .scroll-down-one .arrow-cont i:nth-child(3) {
9494 margin-top: 11.5px;
9495 }
9496 .scroll-down-one:hover i {
9497 animation-name: bounceAlphaUpper;
9498 animation-duration: 1.4s;
9499 animation-iteration-count: infinite;
9500 animation-timing-function: linear;
9501 }
9502 .scroll-down-one:hover i:nth-child(1) {
9503 animation-delay: 0.4s;
9504 }
9505 .scroll-down-one:hover i:nth-child(2) {
9506 animation-delay: 0.2s;
9507 }
9508
9509 .banner-content-typing h1 {
9510 font-family: "Playfair Display", serif;
9511 font-size: 68px;
9512 color: #e6e6e6;
9513 letter-spacing: 0;
9514 font-weight: 700;
9515 }
9516 .banner-content-typing p {
9517 color: #b9b9ba;
9518 font-size: 36px;
9519 font-weight: 500;
9520 margin-top: 15px;
9521 font-family: "IBM Plex Sans", sans-serif;
9522 }
9523 .banner-content-typing .allfolio-btn-group {
9524 margin-top: 65px;
9525 }
9526 .banner-content-typing .allfolio-btn-group .theme-btn {
9527 font-family: "IBM Plex Sans", sans-serif;
9528 font-weight: 600;
9529 font-size: 18px;
9530 letter-spacing: 0.01em;
9531 text-transform: capitalize;
9532 }
9533 .banner-content-typing .allfolio-btn-group .theme-btn + .theme-btn {
9534 margin-left: 20px;
9535 }
9536
9537 .single-headline {
9538 position: relative;
9539 display: inline-block;
9540 vertical-align: top;
9541 font-size: 68px;
9542 line-height: 1.2;
9543 font-family: "Playfair Display", serif;
9544 font-weight: 700;
9545 text-transform: capitalize;
9546 margin-bottom: 0;
9547 }
9548 .single-headline:after {
9549 position: absolute;
9550 content: "";
9551 width: 2px;
9552 height: 100%;
9553 top: 0;
9554 right: 0;
9555 background: #fff;
9556 }
9557 .single-headline span {
9558 opacity: 0;
9559 display: inline-block;
9560 position: absolute;
9561 white-space: nowrap;
9562 left: 0;
9563 top: 0;
9564 font-style: normal;
9565 }
9566 .single-headline span b {
9567 color: #e86a42;
9568 }
9569 .single-headline span.is-visible {
9570 position: relative;
9571 opacity: 1;
9572 visibility: visible;
9573 }
9574
9575 @media (max-width: 1300px) {
9576 .banner-content-typing h1,
9577 .banner-content-typing .single-headline {
9578 font-size: 50px;
9579 line-height: 1.2;
9580 }
9581 }
9582 @media (max-width: 575px) {
9583 .banner-content-typing h1,
9584 .banner-content-typing .single-headline {
9585 font-size: 45px;
9586 line-height: 50px;
9587 }
9588 }
9589 /*======== video popup 1 ========*/
9590 .video-icon {
9591 width: 120px;
9592 height: 120px;
9593 line-height: 120px;
9594 color: #fff;
9595 font-size: 35px;
9596 background: var(--e-global-color-accent);
9597 display: inline-flex;
9598 align-items: center;
9599 justify-content: center;
9600 z-index: 1;
9601 }
9602 .video-icon:hover {
9603 text-decoration: none !important;
9604 }
9605
9606 /*======== video popup 1========*/
9607 @keyframes pulse-white {
9608 0% {
9609 box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.8);
9610 }
9611 70% {
9612 box-shadow: 0 0 0 10px rgba(204, 169, 44, 0);
9613 }
9614 100% {
9615 box-shadow: 0 0 0 0 rgba(204, 169, 44, 0);
9616 }
9617 }
9618 @keyframes pulse-red {
9619 0% {
9620 box-shadow: 0 0 0 0 rgb(217, 44, 10);
9621 }
9622 80% {
9623 box-shadow: 0 0 0 10px rgba(204, 169, 44, 0);
9624 }
9625 100% {
9626 box-shadow: 0 0 0 0 rgba(204, 169, 44, 0);
9627 }
9628 }
9629 /*======== video popup 1(with wave) ========*/
9630 .wave a::before {
9631 animation: pulse-red 2s infinite;
9632 width: 110px;
9633 height: 110px;
9634 }
9635 .wave a {
9636 width: 90px;
9637 transition: 0.3s ease-out;
9638 }
9639 .wave a::before {
9640 content: "";
9641 width: 110px;
9642 height: 110px;
9643 top: -10px;
9644 left: -10px;
9645 position: absolute;
9646 border-radius: 50%;
9647 }
9648
9649 /*======== video popup 1(with hover wave) ========*/
9650 .hover_wave a {
9651 width: 90px;
9652 height: 90px;
9653 line-height: 90px;
9654 border-radius: 50%;
9655 color: var(--e-global-color-accent);
9656 background: #fff;
9657 display: block;
9658 text-align: center;
9659 font-size: 40px;
9660 padding-top: 5px;
9661 transition: 0.3s ease-out;
9662 }
9663 .hover_wave a::before {
9664 content: "";
9665 width: 110px;
9666 height: 110px;
9667 top: -10px;
9668 left: -10px;
9669 position: absolute;
9670 border-radius: 50%;
9671 }
9672 .hover_wave a:hover::before {
9673 animation: pulse-white 2s infinite;
9674 }
9675
9676 /*======== video popup 2========*/
9677 .play-button2 .video2-icon {
9678 display: flex;
9679 justify-content: center;
9680 align-items: center;
9681 background: #fff;
9682 color: var(--e-global-color-accent);
9683 width: 50px;
9684 height: 50px;
9685 font-size: 25px;
9686 z-index: 1;
9687 position: relative;
9688 border-radius: 50%;
9689 transition: 0.3s ease-out;
9690 text-decoration: none !important;
9691 }
9692 @media screen and (min-width: 768px) {
9693 .play-button2 .video2-icon {
9694 width: 78px;
9695 height: 78px;
9696 }
9697 }
9698 .play-button2 .video2-icon::before {
9699 content: "";
9700 position: absolute;
9701 border-radius: 50%;
9702 background: rgba(255, 255, 255, 0.3);
9703 z-index: -1;
9704 top: -15px;
9705 left: -15px;
9706 width: calc(100% + 30px);
9707 height: calc(100% + 30px);
9708 animation: pulse-white 2s infinite;
9709 }
9710 @media screen and (min-width: 768px) {
9711 .play-button2 .video2-icon::before {
9712 width: calc(100% + 28px);
9713 height: calc(100% + 28px);
9714 }
9715 }
9716 .play-button2 .video2-icon::after {
9717 content: "";
9718 position: absolute;
9719 border-radius: 50%;
9720 background: rgba(255, 255, 255, 0.3);
9721 z-index: -1;
9722 top: -30px;
9723 left: -30px;
9724 width: calc(100% + 60px);
9725 height: calc(100% + 60px);
9726 animation: pulse-white 2s infinite;
9727 animation-delay: 1.3s;
9728 }
9729 @media screen and (min-width: 768px) {
9730 .play-button2 .video2-icon::after {
9731 width: calc(100% + 58px);
9732 height: calc(100% + 58px);
9733 }
9734 }
9735
9736 @keyframes rotate {
9737 from {
9738 transform: rotate(360deg);
9739 -webkit-filter: blur(0.2px);
9740 }
9741 to {
9742 transform: rotate(0);
9743 -webkit-filter: blur(0);
9744 }
9745 }
9746 svg.radial-progress {
9747 height: auto;
9748 padding: 0.5em;
9749 transform: rotate(-90deg);
9750 }
9751
9752 svg.radial-progress circle {
9753 fill: transparent;
9754 stroke-dashoffset: 219.9114857513;
9755 stroke-width: 6px;
9756 }
9757
9758 svg.radial-progress circle.complete {
9759 stroke-dasharray: 219.9114857513;
9760 }
9761
9762 svg.radial-progress text {
9763 font-size: 16px;
9764 font-weight: 500;
9765 text-anchor: middle;
9766 }
9767
9768 svg .complete {
9769 stroke: var(--e-global-color-accent);
9770 stroke-linecap: round;
9771 }
9772
9773 svg .incomplete {
9774 stroke: rgba(213, 166, 166, 0.431372549);
9775 }
9776
9777 .skill_item_two .radial-progress {
9778 background: linear-gradient(rgb(79, 248, 186) 0%, rgb(0, 204, 255) 100%);
9779 border-radius: 50%;
9780 }
9781 .skill_item_two .radial-progress circle {
9782 stroke-width: 4px;
9783 }
9784 .skill_item_two .radial-progress circle.incomplete {
9785 stroke: rgba(255, 255, 255, 0.5);
9786 }
9787 .skill_item_two .radial-progress circle.complete {
9788 stroke: #fff;
9789 }
9790 .skill_item_two .skill_pr {
9791 position: relative;
9792 }
9793 .skill_item_two .skill_pr .counter2-wrap {
9794 display: flex;
9795 align-items: center;
9796 justify-content: center;
9797 color: #fff;
9798 font-size: 28px;
9799 top: 50%;
9800 left: 0;
9801 width: 100%;
9802 position: absolute;
9803 transform: translateY(-50%);
9804 }
9805
9806 .counters-container {
9807 text-align: center;
9808 }
9809 .counters-container .skill_item {
9810 position: relative;
9811 }
9812 .counters-container .skill_item .counter-wrap {
9813 display: flex;
9814 align-items: center;
9815 justify-content: center;
9816 color: #000000;
9817 font-size: 18px;
9818 top: 50%;
9819 width: 100%;
9820 position: absolute;
9821 transform: translateY(-50%);
9822 }
9823 .counters-container h6 {
9824 margin: 0;
9825 }
9826
9827 .instagram-area {
9828 transform: translateY(-50%);
9829 position: relative;
9830 z-index: 1;
9831 }
9832
9833 .instagram-feed-item {
9834 position: relative;
9835 z-index: 1;
9836 height: 196px;
9837 }
9838 .instagram-feed-item img {
9839 width: 100%;
9840 height: 100%;
9841 object-fit: cover;
9842 }
9843 .instagram-feed-item .icon-link {
9844 inset: 0;
9845 position: absolute;
9846 width: 100%;
9847 height: 100%;
9848 font-size: 35px;
9849 color: #fff;
9850 background: rgba(0, 0, 0, 0.4);
9851 display: flex;
9852 align-items: center;
9853 justify-content: center;
9854 opacity: 0;
9855 visibility: hidden;
9856 }
9857
9858 .instagram-wrapper {
9859 position: relative;
9860 }
9861 .instagram-wrapper :is(.swiper-button-prev, .swiper-button-next) {
9862 opacity: 0;
9863 visibility: hidden;
9864 width: 36px;
9865 height: 36px;
9866 line-height: 36px;
9867 text-align: center;
9868 border-radius: 50%;
9869 background: #fff;
9870 -webkit-transition: 0.3s ease-out;
9871 transition: 0.3s ease-out;
9872 }
9873 .instagram-wrapper :is(.swiper-button-prev, .swiper-button-next)::after {
9874 font-size: 12px;
9875 color: #838586;
9876 -webkit-transition: 0.3s ease-out;
9877 transition: 0.3s ease-out;
9878 font-family: "Font Awesome 5 Free";
9879 font-weight: 900;
9880 display: block;
9881 width: 36px;
9882 height: 36px;
9883 line-height: 36px;
9884 text-align: center;
9885 border-radius: 50%;
9886 box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.04), 0 4px 8px 0 rgba(0, 0, 0, 0.2);
9887 }
9888
9889 .spel_icon_box {
9890 transition: 0.3s;
9891 background-color: #fff;
9892 border: 1px solid #F0E9FC;
9893 border-radius: 6px;
9894 overflow: hidden;
9895 }
9896 .spel_icon_box:hover {
9897 background-color: #7460FF;
9898 border-color: transparent;
9899 }
9900 .spel_icon_box:hover .box_icon .box_main_icon {
9901 color: #fff;
9902 }
9903 .spel_icon_box:hover .box_title {
9904 color: #fff;
9905 }
9906 .spel_icon_box:hover .icon_box_description {
9907 color: #fff;
9908 }
9909 .spel_icon_box:hover .icon_box_button .button_items {
9910 color: #fff;
9911 }
9912 .spel_icon_box:hover .icon_box_button {
9913 color: #fff;
9914 }
9915 .spel_icon_box .box_bg_shape {
9916 display: flex;
9917 transition: 0.3s;
9918 background-repeat: no-repeat;
9919 padding: 20px 20px 20px 55px;
9920 text-decoration: none !important;
9921 }
9922 .spel_icon_box .box_title {
9923 font-weight: 500;
9924 line-height: 28px;
9925 color: #00000E;
9926 transition: 0.3s;
9927 margin: 0;
9928 }
9929 .spel_icon_box .icon_box_description {
9930 font-size: 14px;
9931 font-weight: 400;
9932 line-height: 28px;
9933 color: #6A737C;
9934 transition: 0.3s;
9935 margin: 0;
9936 padding: 0;
9937 }
9938 .spel_icon_box .box_icon {
9939 line-height: normal;
9940 height: 100%;
9941 }
9942 .spel_icon_box .box_icon .box_main_icon {
9943 font-size: 50px;
9944 transition: 0.3s;
9945 color: #69727d;
9946 }
9947 .spel_icon_box .box_icon .box_main_icon svg path {
9948 transition: 0.3s;
9949 }
9950 .spel_icon_box .box_button {
9951 transition: 0.3s;
9952 line-height: 18px;
9953 }
9954 .spel_icon_box .icon_box_button {
9955 display: flex;
9956 align-items: center;
9957 gap: 3px;
9958 color: #E9336B;
9959 font-size: 14px;
9960 font-weight: 500;
9961 line-height: 28px;
9962 text-decoration: none;
9963 }
9964 .spel_icon_box .icon_box_button:hover {
9965 text-decoration: none;
9966 }
9967 .spel_icon_box .icon_box_button .box_button {
9968 transition: 0.3s;
9969 }
9970 .spel_icon_box .icon_box_button i {
9971 transition: 0.3s;
9972 }
9973
9974 .icon_box_two {
9975 border-radius: 8px;
9976 transition: 0.3s;
9977 overflow: hidden;
9978 box-shadow: 0 1.6px 3.6px 0 rgba(51, 77, 114, 0.2078431373);
9979 }
9980 .icon_box_two:hover {
9981 background-color: #9A6FFF;
9982 box-shadow: 0 20px 45px 0 rgba(51, 77, 114, 0.1450980392);
9983 }
9984 .icon_box_two:hover .box_main_icon {
9985 background: rgba(255, 255, 255, 0.1254901961);
9986 color: #fff;
9987 }
9988 .icon_box_two:hover .box_two_title {
9989 color: #fff;
9990 }
9991 .icon_box_two .box2_bg_shape {
9992 padding: 32px;
9993 transition: 0.3s;
9994 background-repeat: no-repeat;
9995 }
9996 .icon_box_two .box2_bg_shape svg path {
9997 transition: 0.3s;
9998 }
9999 .icon_box_two .box2_url {
10000 display: block;
10001 text-decoration: none !important;
10002 }
10003 .icon_box_two .box_main_icon {
10004 display: inline-flex;
10005 padding: 14px 12px;
10006 background: #F0E9FC;
10007 border-radius: 100px;
10008 color: #cf7272;
10009 font-size: 45px;
10010 transition: 0.3s;
10011 }
10012 .icon_box_two .box_pro_icon {
10013 color: #FAA629;
10014 position: absolute;
10015 top: 25px;
10016 right: 25px;
10017 }
10018 .icon_box_two .box_two_title {
10019 transition: 0.3s;
10020 margin: 0;
10021 }
10022 .icon_box_two a {
10023 text-decoration: none !important;
10024 }
10025
10026 /*============ Start dynamic faq css ==========*/
10027 .spel-faq-wrap {
10028 max-width: 780px;
10029 margin: 0 auto;
10030 }
10031
10032 .spel-faq-item {
10033 background: #fff;
10034 border: 1px solid var(--line, #ecdfc9);
10035 border-radius: var(--radius, 14px);
10036 margin-bottom: 14px;
10037 overflow: hidden;
10038 transition: border-color 0.2s, box-shadow 0.2s;
10039 }
10040
10041 .spel-faq-item[open] {
10042 border-color: var(--line-strong, #dcc8a8);
10043 box-shadow: var(--shadow-md, 0 8px 24px -8px rgba(90, 50, 20, 0.14), 0 2px 4px rgba(90, 50, 20, 0.04));
10044 }
10045
10046 .spel-faq-item[open] .spel-faq-chev {
10047 color: var(--accent, #c2410c);
10048 }
10049
10050 .spel-faq-summary {
10051 display: flex;
10052 align-items: center;
10053 gap: 18px;
10054 padding: 20px 22px;
10055 cursor: pointer;
10056 list-style: none;
10057 -webkit-user-select: none;
10058 user-select: none;
10059 }
10060
10061 .spel-faq-summary::-webkit-details-marker {
10062 display: none;
10063 }
10064
10065 .spel-faq-summary:focus-visible {
10066 outline: 2px solid var(--accent, #c2410c);
10067 outline-offset: -2px;
10068 }
10069
10070 .spel-faq-icon {
10071 width: 38px;
10072 height: 38px;
10073 border-radius: 10px;
10074 background: var(--accent-wash, #fef0e0);
10075 color: var(--accent, #c2410c);
10076 display: grid;
10077 place-items: center;
10078 flex-shrink: 0;
10079 overflow: hidden;
10080 }
10081
10082 .spel-faq-icon img {
10083 width: 100%;
10084 height: 100%;
10085 object-fit: cover;
10086 border-radius: 10px;
10087 display: block;
10088 }
10089
10090 .spel-faq-icon svg {
10091 width: 18px;
10092 height: 18px;
10093 flex-shrink: 0;
10094 }
10095
10096 .spel-faq-icon i {
10097 font-size: 16px;
10098 line-height: 1;
10099 }
10100
10101 .spel-faq-summary-text {
10102 flex: 1;
10103 min-width: 0;
10104 }
10105
10106 .spel-faq-summary-text h3 {
10107 margin: 0;
10108 font-size: 15.5px;
10109 font-weight: 600;
10110 line-height: 1.35;
10111 letter-spacing: -0.005em;
10112 color: var(--ink, #1a1410);
10113 white-space: normal;
10114 }
10115
10116 .spel-faq-summary-meta {
10117 font-size: 12px;
10118 color: var(--ink-mute, #a08674);
10119 font-weight: 500;
10120 margin-top: 3px;
10121 line-height: 1.4;
10122 }
10123
10124 .spel-faq-chev {
10125 display: inline-flex;
10126 align-items: center;
10127 justify-content: center;
10128 flex-shrink: 0;
10129 color: var(--ink-mute, #a08674);
10130 transition: color 0.2s;
10131 }
10132
10133 .spel-faq-chev .spel-faq-chev-icon {
10134 display: none;
10135 }
10136
10137 .spel-faq-item:not([open]) .spel-faq-chev .spel-faq-chev-collapsed,
10138 .spel-faq-item[open] .spel-faq-chev .spel-faq-chev-active {
10139 display: inline-flex;
10140 align-items: center;
10141 justify-content: center;
10142 }
10143
10144 .spel-faq-chev svg {
10145 width: 14px;
10146 height: 14px;
10147 }
10148
10149 .spel-faq-chev i {
10150 font-size: 14px;
10151 line-height: 1;
10152 }
10153
10154 .spel-faq-body {
10155 padding: 0 22px 22px 78px;
10156 color: var(--ink-soft, #5a4a3e);
10157 font-size: 14.5px;
10158 line-height: 1.65;
10159 }
10160
10161 .spel-faq-body p {
10162 margin: 0 0 10px;
10163 }
10164
10165 .spel-faq-body p:last-child {
10166 margin-bottom: 0;
10167 }
10168
10169 .spel-faq-item--no-icon .spel-faq-body {
10170 padding-left: 22px;
10171 }
10172
10173 .spel-faq-read-more {
10174 display: inline-flex;
10175 align-items: center;
10176 gap: 5px;
10177 margin-top: 14px;
10178 font-size: 13px;
10179 font-weight: 600;
10180 color: var(--accent, #c2410c);
10181 text-decoration: none;
10182 transition: gap 0.2s, color 0.2s;
10183 }
10184
10185 .spel-faq-read-more svg {
10186 flex-shrink: 0;
10187 transition: transform 0.2s;
10188 }
10189
10190 .spel-faq-read-more:hover {
10191 color: var(--accent-deep, #9a2f08);
10192 gap: 8px;
10193 }
10194
10195 .spel-faq-read-more:hover svg {
10196 transform: translateX(2px);
10197 }
10198
10199 .spel-faq-reply {
10200 display: flex;
10201 align-items: center;
10202 gap: 8px;
10203 margin-top: 14px;
10204 font-size: 12.5px;
10205 color: var(--ink-mute, #a08674);
10206 flex-wrap: wrap;
10207 }
10208
10209 .spel-avatar-stack {
10210 display: flex;
10211 align-items: center;
10212 flex-shrink: 0;
10213 }
10214
10215 .spel-avatar-stack span {
10216 display: inline-block;
10217 width: 22px;
10218 height: 22px;
10219 border-radius: 50%;
10220 border: 2px solid #fff;
10221 margin-left: -6px;
10222 background-size: cover;
10223 background-position: center;
10224 background-color: var(--line, #ecdfc9);
10225 box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.04);
10226 }
10227
10228 .spel-avatar-stack span:first-child {
10229 margin-left: 0;
10230 }
10231
10232 @media (max-width: 960px) {
10233 .spel-faq-body {
10234 padding-left: 22px;
10235 }
10236 }
10237
10238 @media (max-width: 480px) {
10239 .spel-faq-summary {
10240 gap: 12px;
10241 padding: 16px;
10242 }
10243 .spel-faq-body {
10244 padding: 0 16px 18px;
10245 }
10246 .spel-faq-summary-text h3 {
10247 font-size: 14.5px;
10248 }
10249 }
10250 /*============ End dynamic faq css ==========*/
10251
10252 /*# sourceMappingURL=main.css.map */
10253