PluginProbe ʕ •ᴥ•ʔ
Spider Elements – Premium Elementor Widgets & Addons Library / 1.6.7
Spider Elements – Premium Elementor Widgets & Addons Library v1.6.7
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.css 8 months ago admin.css.map 8 months ago elementor-editor.css 8 months ago extension.css 8 months ago extension.css.map 8 months ago main.css 8 months ago main.css.map 8 months ago rtl.css 8 months ago rtl.css.map 8 months ago
main.css
12557 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 {
4984 height: 74px;
4985 }
4986 .ycp .belah .luhur span.about {
4987 display: none;
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 {
5996 background-color: #fff;
5997 height: 5px;
5998 }
5999 .modal_slider_css .modal-dialog .modal-content .modal-body .posting .video_item .video-js .vjs-progress-control .vjs-play-progress:before {
6000 display: none;
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: rgb(29, 39, 70);
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: #ffffff;
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 .before-after-banner {
9213 position: relative;
9214 }
9215 @media (min-width: 1080px) {
9216 .before-after-banner {
9217 max-height: 100vh;
9218 }
9219 }
9220 .before-after-banner #beforeAfter {
9221 height: 100%;
9222 }
9223 .before-after-banner img {
9224 max-width: inherit;
9225 width: 100%;
9226 }
9227 @media (min-width: 1080px) {
9228 .before-after-banner img {
9229 max-height: 100vh;
9230 }
9231 }
9232 .before-after-banner .indicator {
9233 font-size: 16px;
9234 font-weight: 500;
9235 line-height: 28px;
9236 color: #17161a;
9237 background-color: #fff;
9238 padding: 6px 20px;
9239 border-radius: 4px;
9240 display: inline-block;
9241 position: absolute;
9242 bottom: 30px;
9243 z-index: 1;
9244 }
9245 .before-after-banner .indicator.after {
9246 right: 60px;
9247 }
9248 .before-after-banner .indicator.before {
9249 left: 60px;
9250 }
9251
9252 .timeline-widget {
9253 list-style: none;
9254 padding: 0;
9255 position: relative;
9256 }
9257 .timeline-widget::before {
9258 top: 0;
9259 bottom: 0;
9260 position: absolute;
9261 content: " ";
9262 width: 5px;
9263 background-color: #f5f5f5;
9264 left: 50%;
9265 margin-left: -1.5px;
9266 border-radius: 2.5px;
9267 }
9268
9269 .timeline-wrapper {
9270 display: block;
9271 margin-bottom: 40px;
9272 position: relative;
9273 width: 100%;
9274 padding-right: 90px;
9275 }
9276 .timeline-wrapper.timeline-inverted {
9277 padding-right: 0;
9278 padding-left: 90px;
9279 }
9280 .timeline-wrapper.timeline-inverted .timeline-panel {
9281 margin-left: auto;
9282 margin-right: 10%;
9283 text-align: left;
9284 }
9285 .timeline-wrapper.timeline-inverted .timeline-panel p::after {
9286 left: inherit;
9287 right: calc(100% + 75px);
9288 }
9289 .timeline-wrapper.timeline-inverted .timestamp {
9290 left: inherit;
9291 right: calc(50% + 30px);
9292 }
9293 .timeline-wrapper.timeline-inverted .timestamp::after {
9294 right: inherit;
9295 left: 100%;
9296 border-right: none;
9297 border-left: 11px solid #f5f5f5;
9298 }
9299 .timeline-wrapper::after {
9300 content: "";
9301 width: 15px;
9302 height: 15px;
9303 position: absolute;
9304 top: 16px;
9305 left: calc(50% - 7px);
9306 z-index: 0;
9307 border-radius: 50%;
9308 border: 3px solid #3d3d4e;
9309 }
9310 .timeline-wrapper .timeline-panel {
9311 position: relative;
9312 width: 40%;
9313 text-align: right;
9314 margin-left: 10%;
9315 }
9316 .timeline-wrapper .timeline-panel h3 {
9317 font-family: "IBM Plex Sans", sans-serif;
9318 font-size: 24px;
9319 font-weight: 500;
9320 line-height: 30px;
9321 color: #17161a;
9322 }
9323 .timeline-wrapper .timeline-panel span,
9324 .timeline-wrapper .timeline-panel p {
9325 font-family: "IBM Plex Sans", sans-serif;
9326 font-size: 16px;
9327 font-weight: 400;
9328 line-height: 28px;
9329 color: #3d3d4e;
9330 }
9331 .timeline-wrapper .timeline-panel p {
9332 margin-top: 20px;
9333 position: relative;
9334 }
9335 .timeline-wrapper .timeline-panel p::after {
9336 content: "";
9337 width: 100%;
9338 height: 100%;
9339 background-image: url("../images/timeline-bg.png");
9340 background-position: center;
9341 background-size: cover;
9342 position: absolute;
9343 left: calc(100% + 75px);
9344 top: 0;
9345 }
9346 .timeline-wrapper .timestamp {
9347 position: absolute;
9348 top: 9px;
9349 left: calc(50% + 30px);
9350 z-index: 0;
9351 background: #f5f5f5;
9352 border-radius: 3px;
9353 padding: 2px 9px;
9354 font-family: "IBM Plex Sans", sans-serif;
9355 font-size: 12px;
9356 font-weight: 400;
9357 }
9358 .timeline-wrapper .timestamp::after {
9359 position: absolute;
9360 right: 100%;
9361 content: "";
9362 width: 0;
9363 height: 0;
9364 border-top: 7px solid transparent;
9365 border-bottom: 7px solid transparent;
9366 border-right: 11px solid #f5f5f5;
9367 top: 50%;
9368 transform: translateY(-50%);
9369 }
9370
9371 .timeline-roadmap .icon {
9372 position: relative;
9373 z-index: 1;
9374 height: 100%;
9375 display: inline-block;
9376 overflow: hidden;
9377 }
9378 .timeline-roadmap .icon.animated::after {
9379 transform: scaleY(1);
9380 }
9381 .timeline-roadmap .icon.no-line::after {
9382 display: none;
9383 }
9384 .timeline-roadmap .icon img {
9385 border-radius: 50%;
9386 padding: 15px;
9387 border: 1px solid #ccccce;
9388 background: #f5f5f5;
9389 display: inline-flex;
9390 overflow: hidden;
9391 }
9392 .timeline-roadmap .icon::after {
9393 content: "";
9394 position: absolute;
9395 border-left: 1px solid #ccccce;
9396 z-index: -1;
9397 height: 100%;
9398 left: 50%;
9399 top: 10%;
9400 transform: scaleY(0);
9401 transform-origin: top;
9402 transition: transform 1s linear;
9403 }
9404 .timeline-roadmap h4 {
9405 margin-bottom: 30px;
9406 margin-top: 15px;
9407 }
9408 .timeline-roadmap h4 a {
9409 font-family: "IBM Plex Sans", sans-serif;
9410 color: #17161a;
9411 }
9412 .timeline-roadmap .timeline div {
9413 padding: 0;
9414 height: 40px;
9415 }
9416 .timeline-roadmap .curve {
9417 display: flex;
9418 overflow: hidden;
9419 }
9420 .timeline-roadmap .corner {
9421 border: 1px solid #ccccce;
9422 width: 100%;
9423 position: relative;
9424 border-radius: 10px;
9425 transform: scaleX(0);
9426 transform-origin: left;
9427 transition: transform 1s linear;
9428 }
9429 .timeline-roadmap .corner.top-right {
9430 left: 43px;
9431 top: -50%;
9432 transition-delay: 1s;
9433 }
9434 .timeline-roadmap .corner.top-left {
9435 right: 42px;
9436 top: -50%;
9437 transform-origin: right;
9438 transition-delay: 1s;
9439 }
9440 .timeline-roadmap .corner.right-bottom {
9441 left: 43px;
9442 top: calc(50% - 1px);
9443 transform-origin: right;
9444 transition-delay: 4s;
9445 }
9446 .timeline-roadmap .corner.left-bottom {
9447 right: 43px;
9448 top: calc(50% - 1px);
9449 transition-delay: 4s;
9450 }
9451 .timeline-roadmap .animated hr {
9452 transform: scale(1);
9453 transition-delay: 2s;
9454 }
9455 .timeline-roadmap .animated .corner {
9456 transform: scale(1);
9457 }
9458 .timeline-roadmap hr {
9459 border-top: 1px solid #ccccce;
9460 margin: 0;
9461 top: 19px;
9462 position: relative;
9463 opacity: 1;
9464 transform: scaleX(0);
9465 transform-origin: left;
9466 transition: transform 2s linear;
9467 }
9468 .timeline-roadmap .animate-reverse hr {
9469 transform-origin: right;
9470 }
9471
9472 .keyword-tag {
9473 display: flex;
9474 gap: 10px;
9475 flex-wrap: wrap;
9476 margin-bottom: 30px;
9477 }
9478 .keyword-tag a {
9479 display: inline-block;
9480 color: #17161a;
9481 padding: 1px 10px;
9482 background-color: #fff;
9483 box-shadow: 0 1px 5px 0 rgba(0, 0, 0, 0.0509803922);
9484 color: #17161a;
9485 border-radius: 3px;
9486 }
9487 .keyword-tag a:hover {
9488 background-color: var(--e-global-color-accent);
9489 color: #fff;
9490 box-shadow: none;
9491 }
9492
9493 .scroll-down-one {
9494 display: inline-block;
9495 }
9496 .scroll-down-one .circle {
9497 height: 25px;
9498 width: 18px;
9499 border-radius: 9px;
9500 position: relative;
9501 border: 1px solid #fff;
9502 box-sizing: border-box;
9503 }
9504 .scroll-down-one .circle::after {
9505 content: "";
9506 position: absolute;
9507 top: 50%;
9508 left: 50%;
9509 transform: translate(-50%, -50%);
9510 height: 6px;
9511 width: 1px;
9512 background-color: #fff;
9513 }
9514 .scroll-down-one .arrow-cont {
9515 cursor: pointer;
9516 position: relative;
9517 display: inline-block;
9518 height: 20px;
9519 width: 20px;
9520 }
9521 .scroll-down-one .arrow-cont i {
9522 position: absolute;
9523 bottom: 0;
9524 background-size: contain;
9525 top: 2px;
9526 left: 0%;
9527 font-size: 17px;
9528 color: #fff;
9529 }
9530 .scroll-down-one .arrow-cont i:nth-child(2) {
9531 margin-top: 5.5px;
9532 }
9533 .scroll-down-one .arrow-cont i:nth-child(3) {
9534 margin-top: 11.5px;
9535 }
9536 .scroll-down-one:hover i {
9537 animation-name: bounceAlphaUpper;
9538 animation-duration: 1.4s;
9539 animation-iteration-count: infinite;
9540 animation-timing-function: linear;
9541 }
9542 .scroll-down-one:hover i:nth-child(1) {
9543 animation-delay: 0.4s;
9544 }
9545 .scroll-down-one:hover i:nth-child(2) {
9546 animation-delay: 0.2s;
9547 }
9548
9549 .banner-content-typing h1 {
9550 font-family: "Playfair Display", serif;
9551 font-size: 68px;
9552 color: #e6e6e6;
9553 letter-spacing: 0;
9554 font-weight: 700;
9555 }
9556 .banner-content-typing p {
9557 color: #b9b9ba;
9558 font-size: 36px;
9559 font-weight: 500;
9560 margin-top: 15px;
9561 font-family: "IBM Plex Sans", sans-serif;
9562 }
9563 .banner-content-typing .allfolio-btn-group {
9564 margin-top: 65px;
9565 }
9566 .banner-content-typing .allfolio-btn-group .theme-btn {
9567 font-family: "IBM Plex Sans", sans-serif;
9568 font-weight: 600;
9569 font-size: 18px;
9570 letter-spacing: 0.01em;
9571 text-transform: capitalize;
9572 }
9573 .banner-content-typing .allfolio-btn-group .theme-btn + .theme-btn {
9574 margin-left: 20px;
9575 }
9576
9577 .single-headline {
9578 position: relative;
9579 display: inline-block;
9580 vertical-align: top;
9581 font-size: 68px;
9582 line-height: 1.2;
9583 font-family: "Playfair Display", serif;
9584 font-weight: 700;
9585 text-transform: capitalize;
9586 margin-bottom: 0;
9587 }
9588 .single-headline:after {
9589 position: absolute;
9590 content: "";
9591 width: 2px;
9592 height: 100%;
9593 top: 0;
9594 right: 0;
9595 background: #fff;
9596 }
9597 .single-headline span {
9598 opacity: 0;
9599 display: inline-block;
9600 position: absolute;
9601 white-space: nowrap;
9602 left: 0;
9603 top: 0;
9604 font-style: normal;
9605 }
9606 .single-headline span b {
9607 color: #e86a42;
9608 }
9609 .single-headline span.is-visible {
9610 position: relative;
9611 opacity: 1;
9612 visibility: visible;
9613 }
9614
9615 @media (max-width: 1300px) {
9616 .banner-content-typing h1,
9617 .banner-content-typing .single-headline {
9618 font-size: 50px;
9619 line-height: 1.2;
9620 }
9621 }
9622 @media (max-width: 575px) {
9623 .banner-content-typing h1,
9624 .banner-content-typing .single-headline {
9625 font-size: 45px;
9626 line-height: 50px;
9627 }
9628 }
9629 /*======== video popup 1 ========*/
9630 .video-icon {
9631 width: 120px;
9632 height: 120px;
9633 line-height: 120px;
9634 color: #fff;
9635 font-size: 35px;
9636 background: var(--e-global-color-accent);
9637 display: inline-flex;
9638 align-items: center;
9639 justify-content: center;
9640 z-index: 1;
9641 }
9642 .video-icon:hover {
9643 text-decoration: none !important;
9644 }
9645
9646 /*======== video popup 1========*/
9647 @keyframes pulse-white {
9648 0% {
9649 box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.8);
9650 }
9651 70% {
9652 box-shadow: 0 0 0 10px rgba(204, 169, 44, 0);
9653 }
9654 100% {
9655 box-shadow: 0 0 0 0 rgba(204, 169, 44, 0);
9656 }
9657 }
9658 @keyframes pulse-red {
9659 0% {
9660 box-shadow: 0 0 0 0 rgb(217, 44, 10);
9661 }
9662 80% {
9663 box-shadow: 0 0 0 10px rgba(204, 169, 44, 0);
9664 }
9665 100% {
9666 box-shadow: 0 0 0 0 rgba(204, 169, 44, 0);
9667 }
9668 }
9669 /*======== video popup 1(with wave) ========*/
9670 .wave a::before {
9671 animation: pulse-red 2s infinite;
9672 width: 110px;
9673 height: 110px;
9674 }
9675 .wave a {
9676 width: 90px;
9677 transition: 0.3s ease-out;
9678 }
9679 .wave a::before {
9680 content: "";
9681 width: 110px;
9682 height: 110px;
9683 top: -10px;
9684 left: -10px;
9685 position: absolute;
9686 border-radius: 50%;
9687 }
9688
9689 /*======== video popup 1(with hover wave) ========*/
9690 .hover_wave a {
9691 width: 90px;
9692 height: 90px;
9693 line-height: 90px;
9694 border-radius: 50%;
9695 color: var(--e-global-color-accent);
9696 background: #fff;
9697 display: block;
9698 text-align: center;
9699 font-size: 40px;
9700 padding-top: 5px;
9701 transition: 0.3s ease-out;
9702 }
9703 .hover_wave a::before {
9704 content: "";
9705 width: 110px;
9706 height: 110px;
9707 top: -10px;
9708 left: -10px;
9709 position: absolute;
9710 border-radius: 50%;
9711 }
9712 .hover_wave a:hover::before {
9713 animation: pulse-white 2s infinite;
9714 }
9715
9716 /*======== video popup 2========*/
9717 .play-button2 .video2-icon {
9718 display: flex;
9719 justify-content: center;
9720 align-items: center;
9721 background: #fff;
9722 color: var(--e-global-color-accent);
9723 width: 50px;
9724 height: 50px;
9725 font-size: 25px;
9726 z-index: 1;
9727 position: relative;
9728 border-radius: 50%;
9729 transition: 0.3s ease-out;
9730 text-decoration: none !important;
9731 }
9732 @media screen and (min-width: 768px) {
9733 .play-button2 .video2-icon {
9734 width: 78px;
9735 height: 78px;
9736 }
9737 }
9738 .play-button2 .video2-icon::before {
9739 content: "";
9740 position: absolute;
9741 border-radius: 50%;
9742 background: rgba(255, 255, 255, 0.3);
9743 z-index: -1;
9744 top: -15px;
9745 left: -15px;
9746 width: calc(100% + 30px);
9747 height: calc(100% + 30px);
9748 animation: pulse-white 2s infinite;
9749 }
9750 @media screen and (min-width: 768px) {
9751 .play-button2 .video2-icon::before {
9752 width: calc(100% + 28px);
9753 height: calc(100% + 28px);
9754 }
9755 }
9756 .play-button2 .video2-icon::after {
9757 content: "";
9758 position: absolute;
9759 border-radius: 50%;
9760 background: rgba(255, 255, 255, 0.3);
9761 z-index: -1;
9762 top: -30px;
9763 left: -30px;
9764 width: calc(100% + 60px);
9765 height: calc(100% + 60px);
9766 animation: pulse-white 2s infinite;
9767 animation-delay: 1.3s;
9768 }
9769 @media screen and (min-width: 768px) {
9770 .play-button2 .video2-icon::after {
9771 width: calc(100% + 58px);
9772 height: calc(100% + 58px);
9773 }
9774 }
9775
9776 @keyframes rotate {
9777 from {
9778 transform: rotate(360deg);
9779 -webkit-filter: blur(0.2px);
9780 }
9781 to {
9782 transform: rotate(0);
9783 -webkit-filter: blur(0);
9784 }
9785 }
9786 svg.radial-progress {
9787 height: auto;
9788 padding: 0.5em;
9789 transform: rotate(-90deg);
9790 }
9791
9792 svg.radial-progress circle {
9793 fill: transparent;
9794 stroke-dashoffset: 219.9114857513;
9795 stroke-width: 6px;
9796 }
9797
9798 svg.radial-progress circle.complete {
9799 stroke-dasharray: 219.9114857513;
9800 }
9801
9802 svg.radial-progress text {
9803 font-size: 16px;
9804 font-weight: 500;
9805 text-anchor: middle;
9806 }
9807
9808 svg .complete {
9809 stroke: var(--e-global-color-accent);
9810 stroke-linecap: round;
9811 }
9812
9813 svg .incomplete {
9814 stroke: rgba(213, 166, 166, 0.431372549);
9815 }
9816
9817 .skill_item_two .radial-progress {
9818 background: linear-gradient(rgb(79, 248, 186) 0%, rgb(0, 204, 255) 100%);
9819 border-radius: 50%;
9820 }
9821 .skill_item_two .radial-progress circle {
9822 stroke-width: 4px;
9823 }
9824 .skill_item_two .radial-progress circle.incomplete {
9825 stroke: rgba(255, 255, 255, 0.5);
9826 }
9827 .skill_item_two .radial-progress circle.complete {
9828 stroke: #fff;
9829 }
9830 .skill_item_two .skill_pr {
9831 position: relative;
9832 }
9833 .skill_item_two .skill_pr .counter2-wrap {
9834 display: flex;
9835 align-items: center;
9836 justify-content: center;
9837 color: #fff;
9838 font-size: 28px;
9839 top: 50%;
9840 left: 0;
9841 width: 100%;
9842 position: absolute;
9843 transform: translateY(-50%);
9844 }
9845
9846 .counters-container {
9847 text-align: center;
9848 }
9849 .counters-container .skill_item {
9850 position: relative;
9851 }
9852 .counters-container .skill_item .counter-wrap {
9853 display: flex;
9854 align-items: center;
9855 justify-content: center;
9856 color: #000000;
9857 font-size: 18px;
9858 top: 50%;
9859 width: 100%;
9860 position: absolute;
9861 transform: translateY(-50%);
9862 }
9863 .counters-container h6 {
9864 margin: 0;
9865 }
9866
9867 .instagram-area {
9868 transform: translateY(-50%);
9869 position: relative;
9870 z-index: 1;
9871 }
9872
9873 .instagram-feed-item {
9874 position: relative;
9875 z-index: 1;
9876 height: 196px;
9877 }
9878 .instagram-feed-item img {
9879 width: 100%;
9880 height: 100%;
9881 object-fit: cover;
9882 }
9883 .instagram-feed-item .icon-link {
9884 inset: 0;
9885 position: absolute;
9886 width: 100%;
9887 height: 100%;
9888 font-size: 35px;
9889 color: #fff;
9890 background: rgba(0, 0, 0, 0.4);
9891 display: flex;
9892 align-items: center;
9893 justify-content: center;
9894 opacity: 0;
9895 visibility: hidden;
9896 }
9897
9898 .instagram-wrapper {
9899 position: relative;
9900 }
9901 .instagram-wrapper :is(.swiper-button-prev, .swiper-button-next) {
9902 opacity: 0;
9903 visibility: hidden;
9904 width: 36px;
9905 height: 36px;
9906 line-height: 36px;
9907 text-align: center;
9908 border-radius: 50%;
9909 background: #fff;
9910 -webkit-transition: 0.3s ease-out;
9911 transition: 0.3s ease-out;
9912 }
9913 .instagram-wrapper :is(.swiper-button-prev, .swiper-button-next)::after {
9914 font-size: 12px;
9915 color: #838586;
9916 -webkit-transition: 0.3s ease-out;
9917 transition: 0.3s ease-out;
9918 font-family: "Font Awesome 5 Free";
9919 font-weight: 900;
9920 display: block;
9921 width: 36px;
9922 height: 36px;
9923 line-height: 36px;
9924 text-align: center;
9925 border-radius: 50%;
9926 box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.04), 0 4px 8px 0 rgba(0, 0, 0, 0.2);
9927 }
9928
9929 .banner-area-2 {
9930 position: relative;
9931 z-index: 1;
9932 background-image: url(../img/home_two/banner-bg.png);
9933 background-size: cover;
9934 background-position: center;
9935 }
9936 .banner-area-2 .banner-shapes img {
9937 position: absolute;
9938 bottom: 0;
9939 left: 0;
9940 z-index: -1;
9941 }
9942 .banner-area-2 .banner-shapes img:nth-child(2) {
9943 right: 0;
9944 }
9945 .banner-area-2 .banner-content p {
9946 font-size: 18px;
9947 font-weight: 400;
9948 line-height: 36px;
9949 color: #fff;
9950 }
9951 .banner-area-2 .banner-img {
9952 display: inline-block;
9953 position: relative;
9954 }
9955 .banner-area-2 .banner-img .shape img {
9956 max-width: inherit;
9957 }
9958 .banner-area-2 .banner-img .shape + .shape {
9959 position: absolute;
9960 }
9961 .banner-area-2 .banner-img .shape:nth-child(2) {
9962 left: 77px;
9963 top: -134px;
9964 }
9965 .banner-area-2 .banner-img .shape:nth-child(3) {
9966 right: -15px;
9967 top: 56px;
9968 z-index: -1;
9969 }
9970 .banner-area-2 .banner-img .shape:nth-child(4) {
9971 right: 0;
9972 bottom: -130px;
9973 }
9974 .banner-area-2 .banner-img .shape:nth-child(5) {
9975 top: -110px;
9976 left: 25px;
9977 }
9978 .banner-area-2 .banner-img .shape:nth-child(6) {
9979 top: -130px;
9980 left: -100px;
9981 background-color: #fff;
9982 height: 24px;
9983 width: 24px;
9984 }
9985 .banner-area-2 .banner-img .shape:nth-child(7) {
9986 height: 28px;
9987 width: 28px;
9988 background-color: #fff;
9989 top: 0;
9990 left: -65px;
9991 }
9992 .banner-area-2 .banner-img .shape:nth-child(8) {
9993 top: -127px;
9994 left: 115px;
9995 height: 12px;
9996 background-color: #fff;
9997 width: 12px;
9998 }
9999 .banner-area-2 .banner-img .shape:nth-child(9) {
10000 top: -25px;
10001 right: 40px;
10002 height: 10px;
10003 background-color: #ffb4a5;
10004 width: 10px;
10005 }
10006 .banner-area-2 .banner-img .shape:nth-child(10) {
10007 top: -50px;
10008 left: -165px;
10009 height: 17px;
10010 background-color: #ffb4a5;
10011 width: 17px;
10012 }
10013 .banner-area-2 .banner-img .shape:nth-child(11) {
10014 top: -100px;
10015 right: -25px;
10016 height: 30px;
10017 background-color: #fff;
10018 width: 30px;
10019 }
10020 .banner-area-2 .banner-img .shape:nth-child(12) {
10021 top: -25px;
10022 right: -45px;
10023 height: 15px;
10024 background-color: #ffb4a5;
10025 width: 15px;
10026 }
10027 .banner-area-2 .banner-img .shape:nth-child(13) {
10028 border-radius: 50%;
10029 bottom: -35px;
10030 right: 110px;
10031 height: 25px;
10032 background-color: #fff;
10033 width: 25px;
10034 }
10035 .banner-area-2 .banner-img .shape:nth-child(14) {
10036 border-radius: 50%;
10037 bottom: -65px;
10038 right: 85px;
10039 height: 19px;
10040 background-color: #ffb4a5;
10041 width: 19px;
10042 }
10043
10044 .banner-area-6 {
10045 position: relative;
10046 z-index: 1;
10047 background: rgba(24, 9, 48, 0.2);
10048 }
10049 .banner-area-6 .swiper-slide {
10050 height: 100vh;
10051 display: flex;
10052 align-items: center;
10053 justify-content: center;
10054 position: relative;
10055 z-index: 1;
10056 }
10057 .banner-area-6 .banner-thumbnails {
10058 width: 600px;
10059 height: 70px;
10060 }
10061 .banner-area-6 .banner-thumbnails .swiper-slide {
10062 height: 70px;
10063 transform: translateY(17px);
10064 }
10065
10066 .theme-btn {
10067 font-size: 16px;
10068 font-weight: 500;
10069 color: #fff;
10070 font-family: IBM Plex Sans;
10071 border-radius: 5px;
10072 background: var(--e-global-color-accent);
10073 display: inline-block;
10074 padding: 10px 25px;
10075 text-transform: uppercase;
10076 text-decoration: none;
10077 transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.18s ease-in-out;
10078 border: 1px solid rgba(249, 249, 249, 0.2588235294);
10079 margin-top: 20px;
10080 }
10081 .theme-btn:hover {
10082 background-color: #eb3a17;
10083 border-color: #eb3a17;
10084 color: #fff;
10085 }
10086 .theme-btn:hover i:not(.left-icon) {
10087 transform: translateX(4px);
10088 }
10089 .theme-btn.btn-small {
10090 padding: 6px 20px;
10091 }
10092 .theme-btn.btn-small-two {
10093 padding: 5px 10px;
10094 }
10095 .theme-btn.btn-big {
10096 padding: 12.5px 30px;
10097 }
10098 .theme-btn.btn-big-two {
10099 padding: 20px 25px;
10100 }
10101 .theme-btn.theme-btn-outline {
10102 border-color: #ebebeb;
10103 border-radius: 5px;
10104 background-color: transparent;
10105 color: #17161a;
10106 }
10107 .theme-btn.theme-btn-outline.btn-outline-black {
10108 border-color: #bbc0c4;
10109 }
10110 .theme-btn.theme-btn-outline:hover {
10111 background-color: var(--black_800);
10112 color: #fff;
10113 }
10114 .theme-btn.theme-btn-outline-white {
10115 border-color: rgba(249, 249, 249, 0.26);
10116 border-radius: 5px;
10117 background-color: transparent;
10118 color: #fff;
10119 }
10120 .theme-btn.theme-btn-outline-white:hover {
10121 background-color: #fff;
10122 color: #17161A;
10123 border-color: #fff;
10124 text-decoration: none;
10125 }
10126 .theme-btn i {
10127 font-size: 16px;
10128 transition: all 0.3s ease;
10129 display: inline-block;
10130 vertical-align: middle;
10131 padding-left: 5px;
10132 }
10133 .theme-btn.theme-btn-alt {
10134 background-color: #fff;
10135 color: rgba(249, 249, 249, 0.26);
10136 border-color: #fff;
10137 }
10138 .theme-btn.theme-btn-alt:hover {
10139 background-color: rgba(249, 249, 249, 0.26);
10140 color: #fff;
10141 border-color: rgba(249, 249, 249, 0.26);
10142 }
10143
10144 .banner-area-6 .banner-main .swiper-slide::before {
10145 content: "";
10146 inset: 0;
10147 position: absolute;
10148 background: rgba(0, 0, 0, 0.4);
10149 z-index: -1;
10150 }
10151
10152 .banner-area-2 .banner-content p {
10153 font-size: 20px;
10154 font-weight: 400;
10155 line-height: 36px;
10156 color: #fff;
10157 font-family: IBM Plex Sans;
10158 margin-top: 70px;
10159 }
10160
10161 .banner-content h1 {
10162 font-size: 90px;
10163 line-height: 1.2;
10164 padding: 10px 30px;
10165 font-family: Playfair Display;
10166 font-weight: 700;
10167 letter-spacing: 1px;
10168 color: #fff;
10169 }
10170 .banner-content .text-stroke {
10171 color: black;
10172 -webkit-text-stroke: 1px #fff;
10173 -webkit-text-fill-color: transparent;
10174 }
10175
10176 .spel_icon_box {
10177 transition: 0.3s;
10178 background-color: #fff;
10179 border: 1px solid #F0E9FC;
10180 border-radius: 6px;
10181 overflow: hidden;
10182 }
10183 .spel_icon_box:hover {
10184 background-color: #7460FF;
10185 border-color: transparent;
10186 }
10187 .spel_icon_box:hover .box_icon .box_main_icon {
10188 color: #fff;
10189 }
10190 .spel_icon_box:hover .box_title {
10191 color: #fff;
10192 }
10193 .spel_icon_box:hover .icon_box_description {
10194 color: #fff;
10195 }
10196 .spel_icon_box:hover .icon_box_button .button_items {
10197 color: #fff;
10198 }
10199 .spel_icon_box:hover .icon_box_button {
10200 color: #fff;
10201 }
10202 .spel_icon_box .box_bg_shape {
10203 display: flex;
10204 transition: 0.3s;
10205 background-repeat: no-repeat;
10206 padding: 20px 20px 20px 55px;
10207 text-decoration: none !important;
10208 }
10209 .spel_icon_box .box_title {
10210 font-weight: 500;
10211 line-height: 28px;
10212 color: #00000E;
10213 transition: 0.3s;
10214 margin: 0;
10215 }
10216 .spel_icon_box .icon_box_description {
10217 font-size: 14px;
10218 font-weight: 400;
10219 line-height: 28px;
10220 color: #6A737C;
10221 transition: 0.3s;
10222 margin: 0;
10223 padding: 0;
10224 }
10225 .spel_icon_box .box_icon {
10226 line-height: normal;
10227 height: 100%;
10228 }
10229 .spel_icon_box .box_icon .box_main_icon {
10230 font-size: 50px;
10231 transition: 0.3s;
10232 color: #69727d;
10233 }
10234 .spel_icon_box .box_icon .box_main_icon svg path {
10235 transition: 0.3s;
10236 }
10237 .spel_icon_box .box_button {
10238 transition: 0.3s;
10239 line-height: 18px;
10240 }
10241 .spel_icon_box .icon_box_button {
10242 display: flex;
10243 align-items: center;
10244 gap: 3px;
10245 color: #E9336B;
10246 font-size: 14px;
10247 font-weight: 500;
10248 line-height: 28px;
10249 text-decoration: none;
10250 }
10251 .spel_icon_box .icon_box_button:hover {
10252 text-decoration: none;
10253 }
10254 .spel_icon_box .icon_box_button .box_button {
10255 transition: 0.3s;
10256 }
10257 .spel_icon_box .icon_box_button i {
10258 transition: 0.3s;
10259 }
10260
10261 .icon_box_two {
10262 border-radius: 8px;
10263 transition: 0.3s;
10264 overflow: hidden;
10265 box-shadow: 0 1.6px 3.6px 0 rgba(51, 77, 114, 0.2078431373);
10266 }
10267 .icon_box_two:hover {
10268 background-color: #9A6FFF;
10269 box-shadow: 0 20px 45px 0 rgba(51, 77, 114, 0.1450980392);
10270 }
10271 .icon_box_two:hover .box_main_icon {
10272 background: rgba(255, 255, 255, 0.1254901961);
10273 color: #fff;
10274 }
10275 .icon_box_two:hover .box_two_title {
10276 color: #fff;
10277 }
10278 .icon_box_two .box2_bg_shape {
10279 padding: 32px;
10280 transition: 0.3s;
10281 background-repeat: no-repeat;
10282 }
10283 .icon_box_two .box2_bg_shape svg path {
10284 transition: 0.3s;
10285 }
10286 .icon_box_two .box2_url {
10287 display: block;
10288 text-decoration: none !important;
10289 }
10290 .icon_box_two .box_main_icon {
10291 display: inline-flex;
10292 padding: 14px 12px;
10293 background: #F0E9FC;
10294 border-radius: 100px;
10295 color: #cf7272;
10296 font-size: 45px;
10297 transition: 0.3s;
10298 }
10299 .icon_box_two .box_pro_icon {
10300 color: #FAA629;
10301 position: absolute;
10302 top: 25px;
10303 right: 25px;
10304 }
10305 .icon_box_two .box_two_title {
10306 transition: 0.3s;
10307 margin: 0;
10308 }
10309 .icon_box_two a {
10310 text-decoration: none !important;
10311 }
10312
10313 .pricing-area.section-padding {
10314 padding-top: 6.25rem;
10315 padding-bottom: 0;
10316 }
10317 @media screen and (min-width: 768px) {
10318 .pricing-area.section-padding {
10319 padding-top: 7.8125rem;
10320 padding-bottom: 4.375rem;
10321 }
10322 }
10323 .pricing-area.section-padding-2 {
10324 padding: 5rem 0 4.6875rem;
10325 }
10326 @media screen and (min-width: 576px) {
10327 .pricing-area.section-padding-2 {
10328 padding: 7.5rem 0 7.1875rem;
10329 }
10330 }
10331 @media screen and (min-width: 992px) {
10332 .pricing-area.section-padding-2 {
10333 padding: 8.75rem 0 8.4375rem;
10334 }
10335 }
10336 .pricing-area .section-title-center {
10337 padding-bottom: 4.0625rem;
10338 }
10339 @media screen and (min-width: 992px) {
10340 .pricing-area .section-title-center h2 {
10341 font-size: 2.5rem;
10342 line-height: 1.2;
10343 max-width: 52%;
10344 margin-left: auto;
10345 margin-right: auto;
10346 }
10347 }
10348 .pricing-area .tex {
10349 font-size: 1.125rem;
10350 color: #5d5d66;
10351 margin-top: 3.75rem;
10352 }
10353 .pricing-area .nav-item {
10354 width: 100%;
10355 }
10356 @media screen and (min-width: 576px) {
10357 .pricing-area .nav-item {
10358 width: auto;
10359 }
10360 }
10361 .pricing-area .nav-item .nav-link {
10362 width: 100%;
10363 }
10364 @media screen and (min-width: 576px) {
10365 .pricing-area .nav-item .nav-link {
10366 width: auto;
10367 }
10368 }
10369
10370 .pricing-area-two {
10371 position: relative;
10372 }
10373 .pricing-area-two .section-title-center {
10374 padding-bottom: 50px;
10375 }
10376 .pricing-area-two .section-title-center p {
10377 font-size: 20px;
10378 line-height: 1.6;
10379 padding-top: 15px;
10380 width: 100%;
10381 }
10382 @media screen and (min-width: 992px) {
10383 .pricing-area-two .section-title-center p {
10384 width: 50%;
10385 }
10386 }
10387 @media screen and (min-width: 992px) {
10388 .pricing-area-two .ps-28 {
10389 padding-left: 28px;
10390 }
10391 .pricing-area-two .pe-28 {
10392 padding-right: 28px;
10393 }
10394 }
10395 .pricing-area-two .tab-pane {
10396 padding-top: 80px;
10397 }
10398
10399 .pricing-currency {
10400 border: 1px solid #a0a1a3;
10401 font-size: 1rem;
10402 text-transform: uppercase;
10403 color: #6d6d6d;
10404 border-radius: 0.625rem;
10405 float: right;
10406 padding: 15px;
10407 position: relative;
10408 width: auto;
10409 }
10410 .pricing-currency:focus {
10411 border: 1px solid #a0a1a3;
10412 }
10413 .pricing-currency .icon {
10414 width: 15px;
10415 height: 100%;
10416 background: red;
10417 }
10418
10419 .pricing-tabs {
10420 border: none;
10421 padding: 0.625rem;
10422 border-radius: 0.625rem;
10423 background: #f9f9f9;
10424 display: inline-flex;
10425 }
10426 .pricing-tabs .nav-link {
10427 padding: 0.3125rem 1.125rem;
10428 border-radius: 0.375rem;
10429 font-size: 1rem;
10430 color: #6d6d6d;
10431 border-color: transparent;
10432 background: transparent;
10433 line-height: 25px;
10434 }
10435 .pricing-tabs .nav-link.active {
10436 border-color: transparent;
10437 background-color: #ec595a !important;
10438 color: #fff;
10439 font-weight: 600;
10440 }
10441 .pricing-tabs .nav-link:hover {
10442 border-color: transparent;
10443 color: unset;
10444 }
10445
10446 .pricing-tabs-two {
10447 display: inline-flex;
10448 border-radius: 18px;
10449 overflow: hidden;
10450 border: 1px solid #676099;
10451 }
10452 .pricing-tabs-two li {
10453 display: inline-block;
10454 }
10455 .pricing-tabs-two li:first-child .nav-link {
10456 padding-left: 40px;
10457 }
10458 .pricing-tabs-two li:first-child .nav-link::before {
10459 transform-origin: right;
10460 border-top-right-radius: 0;
10461 border-bottom-right-radius: 0;
10462 border-top-left-radius: 18px;
10463 border-bottom-left-radius: 18px;
10464 }
10465 .pricing-tabs-two li:last-child .nav-link {
10466 padding-right: 40px;
10467 }
10468 .pricing-tabs-two li .nav-link {
10469 padding: 10px 29px;
10470 font-family: "Inter", sans-serif;
10471 font-size: 16px;
10472 font-weight: 400;
10473 line-height: 16px;
10474 color: #4f4f4f;
10475 border: none;
10476 border-radius: 0;
10477 position: relative;
10478 z-index: 1;
10479 }
10480 .pricing-tabs-two li .nav-link::before {
10481 content: "";
10482 position: absolute;
10483 left: 0;
10484 top: 0;
10485 height: 100%;
10486 width: 100%;
10487 transform: scaleX(0);
10488 transform-origin: left;
10489 background-color: transparent;
10490 z-index: -1;
10491 transition: all 0.2s linear;
10492 border-top-right-radius: 18px;
10493 border-bottom-right-radius: 18px;
10494 }
10495 .pricing-tabs-two li .nav-link.active {
10496 font-weight: 600;
10497 color: #ffffff;
10498 border-radius: 0;
10499 background-color: transparent;
10500 }
10501 .pricing-tabs-two li .nav-link.active::before {
10502 background-color: #473d8d;
10503 transform: scaleX(1);
10504 }
10505
10506 .pricing-tabs-content {
10507 display: block;
10508 }
10509 .pricing-tabs-content .tab-pane {
10510 position: relative;
10511 }
10512 .pricing-tabs-content .tab-pane .popular {
10513 top: -40px;
10514 right: 35%;
10515 position: absolute;
10516 }
10517 @media screen and (min-width: 992px) {
10518 .pricing-tabs-content .tab-pane {
10519 padding-top: 0.25rem;
10520 }
10521 }
10522
10523 .pricing-item {
10524 background: #fafafa;
10525 border-radius: 1.25rem;
10526 padding: 3.75rem 1.375rem 2.5rem;
10527 margin-top: 1.875rem;
10528 position: relative;
10529 border: 2px solid transparent;
10530 text-align: center;
10531 transition: 0.3s ease-out;
10532 }
10533 .pricing-item p {
10534 margin: 0;
10535 font-size: 17px;
10536 }
10537
10538 .pricing-item:hover {
10539 background: rgba(255, 227, 218, 0.5);
10540 border-color: #171717;
10541 }
10542
10543 @media screen and (min-width: 576px) {
10544 .pricing-item {
10545 text-align: left;
10546 }
10547 }
10548 @media screen and (min-width: 992px) {
10549 .pricing-item {
10550 text-align: center;
10551 }
10552 }
10553 @media screen and (min-width: 1200px) {
10554 .pricing-item {
10555 text-align: left;
10556 }
10557 }
10558 .pricing-item .badge {
10559 top: -2px;
10560 right: 0;
10561 left: 0;
10562 position: absolute;
10563 width: 7.8125rem;
10564 margin: 0 auto;
10565 border-radius: 0;
10566 border-bottom-left-radius: 0.625rem;
10567 border-bottom-right-radius: 0.625rem;
10568 padding: 8px 25px;
10569 background: #ec595a;
10570 color: #fff;
10571 font-size: 1rem;
10572 font-weight: 600;
10573 line-height: 1;
10574 height: 30px;
10575 text-align: center;
10576 }
10577 .pricing-item .pricing-title {
10578 margin: 0;
10579 font-size: 1.625rem;
10580 font-weight: 500;
10581 }
10582 .pricing-item .price {
10583 font-size: 1.875rem;
10584 color: #ec595a;
10585 margin-top: 0.9375rem;
10586 }
10587 .pricing-item .price .dollar {
10588 display: inline-block;
10589 }
10590 .pricing-item .price .euro {
10591 display: none;
10592 }
10593 .pricing-item .price sup {
10594 font-size: 0.875rem;
10595 color: #171717;
10596 font-weight: 400;
10597 }
10598 .pricing-item .pricing-item-user {
10599 font-size: 0.875rem;
10600 display: block;
10601 margin-top: 0.625rem;
10602 }
10603 .pricing-item .pricing-btn {
10604 display: inline-block;
10605 border: 2px solid #ec595a;
10606 background: #ffe3da;
10607 color: #ec595a;
10608 border-radius: 0.375rem;
10609 text-decoration: none;
10610 font-size: 1.125rem;
10611 font-weight: 500;
10612 padding: 0.8125rem 1.875rem;
10613 margin-top: 2.1875rem;
10614 transition: 0.3s ease-out;
10615 margin-bottom: 20px;
10616 }
10617 .pricing-item .pricing-btn:hover {
10618 background: #ec595a;
10619 color: #fff;
10620 border-color: #2c2c2c;
10621 text-decoration: none;
10622 }
10623 .pricing-item ul {
10624 padding-top: 20px;
10625 list-style: none;
10626 padding-left: 0;
10627 }
10628 .pricing-item ul li {
10629 font-size: 0.9375rem;
10630 padding-top: 15px;
10631 font-weight: 500;
10632 }
10633 .pricing-item ul li.text-gray-100 {
10634 color: #999;
10635 }
10636 .pricing-item.active {
10637 background: rgba(255, 227, 218, 0.5);
10638 border-color: #171717;
10639 }
10640 .pricing-item.active .pricing-item-user {
10641 color: #ec595a;
10642 }
10643 .pricing-item.active .pricing-btn {
10644 background: #ec595a;
10645 color: #fff;
10646 border: 2px solid #2c2c2c;
10647 }
10648 .pricing-item.bg-yellow-200 {
10649 background: #fff7dd;
10650 }
10651
10652 .tab-content .fade {
10653 transition: opacity 0.15s linear;
10654 opacity: 1;
10655 }
10656
10657 .current-price {
10658 font-weight: 700;
10659 font-size: 28px;
10660 line-height: 44px;
10661 display: inline-block;
10662 vertical-align: middle;
10663 }
10664
10665 .saving-price {
10666 background-color: #fff;
10667 border-radius: 1px;
10668 color: #171717;
10669 display: inline-block;
10670 font-size: 14px;
10671 line-height: 14px;
10672 padding: 6px 8px;
10673 }
10674
10675 .price-format {
10676 font-family: "Inter", sans-serif;
10677 font-size: 12px;
10678 line-height: 12px;
10679 margin-bottom: 25px;
10680 }
10681
10682 .subscribe-btn {
10683 border-radius: 2px;
10684 display: inline-block;
10685 font-weight: 500;
10686 font-size: 20px;
10687 line-height: 20px;
10688 background-color: #ec595a;
10689 padding: 12px 24px;
10690 margin-bottom: 8px;
10691 transition: all 0.3s ease-in-out;
10692 }
10693 .subscribe-btn:hover {
10694 background-color: #171717;
10695 color: #ec595a;
10696 }
10697
10698 .price-note {
10699 font-family: "Inter", sans-serif;
10700 font-size: 14px;
10701 line-height: 22px;
10702 width: 60%;
10703 }
10704
10705 .pricing-compare-table > table {
10706 margin: 0;
10707 }
10708 .pricing-compare-table .table-bg {
10709 background: #2c3563;
10710 }
10711 .pricing-compare-table .table-bg2 {
10712 background: #202647;
10713 }
10714 .pricing-compare-table .table-title-bg {
10715 background: #252c53;
10716 }
10717 .pricing-compare-table .red-top {
10718 border-top: 1px solid #ec595a;
10719 }
10720 .pricing-compare-table .red-bottom {
10721 border-bottom: 1px solid #ec595a;
10722 }
10723 .pricing-compare-table .gray-bottom {
10724 border-bottom: 1px solid #c6c6c6;
10725 }
10726 .pricing-compare-table .plan-title {
10727 color: #fff;
10728 font-weight: 600;
10729 font-size: 20px;
10730 line-height: 32px;
10731 margin-bottom: 30px;
10732 }
10733 .pricing-compare-table .nav-tabs {
10734 border-bottom: none;
10735 justify-content: center;
10736 }
10737 .pricing-compare-table .nav-tabs .nav-link {
10738 border: 1px solid #c6c6c6;
10739 border-radius: 2px;
10740 color: #fff;
10741 font-weight: 700;
10742 font-size: 14px;
10743 line-height: 22px;
10744 padding: 4px 5px;
10745 margin: 0 5px;
10746 }
10747 .pricing-compare-table .nav-tabs .nav-link.active {
10748 color: #171717;
10749 }
10750 .pricing-compare-table .tab-pane {
10751 padding-top: 8px;
10752 }
10753 .pricing-compare-table .old-price {
10754 font-size: 14px;
10755 font-weight: 700;
10756 line-height: 22px;
10757 color: #c6c6c6;
10758 }
10759 .pricing-compare-table .current-price {
10760 font-size: 14px;
10761 line-height: 22px;
10762 margin: 10px 0;
10763 }
10764 .pricing-compare-table .current-price span {
10765 font-size: 18px;
10766 }
10767 .pricing-compare-table .price-format {
10768 margin-bottom: 10px;
10769 }
10770 .pricing-compare-table .saving-price {
10771 margin-bottom: 15px;
10772 }
10773 .pricing-compare-table .subscribe-btn {
10774 background-color: #fff;
10775 color: #171717;
10776 display: block;
10777 font-size: 16px;
10778 line-height: 26px;
10779 padding: 5px 24px;
10780 margin-bottom: 20px;
10781 }
10782 .pricing-compare-table .subscribe-btn:hover {
10783 background-color: #ec595a;
10784 color: #fff;
10785 }
10786 .pricing-compare-table .price-note {
10787 color: #c6c6c6;
10788 width: 100%;
10789 }
10790 .pricing-compare-table .feature-title {
10791 width: 45%;
10792 padding: 25px 0;
10793 box-shadow: -10px 5px 30px 0 #191e38;
10794 }
10795 .pricing-compare-table .feature {
10796 width: 25%;
10797 text-align: center;
10798 }
10799 .pricing-compare-table .feature .feature-text p {
10800 color: #fff;
10801 font-size: 14px;
10802 line-height: 20px;
10803 padding: 0 32px;
10804 }
10805 .pricing-compare-table .feature .feature-text i {
10806 color: #fff;
10807 font-size: 27px;
10808 }
10809 .pricing-compare-table .feature-btn {
10810 color: #fff;
10811 font-size: 20px;
10812 line-height: 30px;
10813 text-align: left;
10814 padding-left: 60px;
10815 position: relative;
10816 }
10817 .pricing-compare-table .feature-btn:before {
10818 content: "L";
10819 font-family: "ElegantIcons";
10820 font-weight: 400;
10821 position: absolute;
10822 left: 15px;
10823 }
10824 .pricing-compare-table .feature-btn.collapsed:before {
10825 content: "K";
10826 }
10827
10828 .pricing-compare-table .feature-title {
10829 padding: 15px 20px;
10830 background: #f7f7f7;
10831 color: #333;
10832 font-size: 24px;
10833 font-weight: 700;
10834 text-align: center;
10835 position: relative;
10836 box-shadow: 0 5px 20px rgba(0, 0, 0, 0.05);
10837 }
10838 .pricing-compare-table .feature-row {
10839 display: flex;
10840 flex-direction: row;
10841 align-items: center;
10842 justify-content: center;
10843 border-bottom: 1px solid #eee;
10844 position: relative;
10845 }
10846 .pricing-compare-table .feature-row:last-of-type {
10847 border-bottom: none;
10848 }
10849 .pricing-compare-table .feature-row .feature-type {
10850 text-align: center;
10851 }
10852 .pricing-compare-table .feature-row .feature-type .section-text {
10853 color: #ec595a;
10854 text-align: center;
10855 font-weight: 600;
10856 font-size: 22px;
10857 line-height: 30px;
10858 letter-spacing: 0.5px;
10859 transform: rotate(180deg);
10860 writing-mode: tb-rl;
10861 }
10862 .pricing-compare-table .feature-row .feature-body {
10863 display: flex;
10864 flex-direction: row;
10865 align-items: center;
10866 justify-content: center;
10867 flex-wrap: wrap;
10868 width: 100%;
10869 }
10870 .pricing-compare-table .feature-row .feature-body p {
10871 color: #fff;
10872 font-size: 14px;
10873 line-height: 20px;
10874 padding: 12px 65px 0 60px;
10875 }
10876 .pricing-compare-table .feature-row .feature-body:last-of-type p {
10877 padding-bottom: 12px;
10878 }
10879 .pricing-compare-table .feature-row .feature-btn {
10880 position: absolute;
10881 right: 20px;
10882 top: 50%;
10883 transform: translateY(-50%);
10884 padding-left: 40px;
10885 }
10886 .pricing-compare-table .feature-row .feature-btn:before {
10887 content: "";
10888 position: absolute;
10889 left: -20px;
10890 top: 50%;
10891 transform: translateY(-50%);
10892 width: 10px;
10893 height: 10px;
10894 border-radius: 50%;
10895 background-color: #ec595a;
10896 }
10897 .pricing-compare-table.mobile .feature-title {
10898 width: 100%;
10899 padding: 5px 0;
10900 box-shadow: none;
10901 text-align: left;
10902 }
10903 .pricing-compare-table.mobile .sub-padding {
10904 padding: 20px 25px 15px;
10905 }
10906 .pricing-compare-table.mobile .product-plan {
10907 margin-bottom: 30px;
10908 }
10909 .pricing-compare-table.mobile .feature-body p {
10910 padding: 12px 0 0 20px;
10911 }
10912 .pricing-compare-table.mobile .feature-btn {
10913 padding-left: 20px;
10914 }
10915 .pricing-compare-table.mobile .feature-btn:before {
10916 left: 0;
10917 }
10918
10919 .ezd-tab-box {
10920 display: none;
10921 }
10922 .ezd-tab-box.active {
10923 display: block;
10924 }
10925
10926 @media (min-width: 768px) {
10927 .nav .nav-link {
10928 font-size: 1.375rem;
10929 padding: 0.625rem 1.875rem;
10930 font-family: "Poppins", sans-serif;
10931 font-weight: 500;
10932 }
10933 }
10934 .section-title-center {
10935 padding-bottom: 45px;
10936 text-align: center;
10937 }
10938 .section-title-center .title {
10939 margin: 0;
10940 font-size: 50px;
10941 font-family: "Poppins", sans-serif;
10942 color: #171717;
10943 font-weight: 700;
10944 line-height: 1.4;
10945 }
10946
10947 button {
10948 border: none;
10949 background: transparent;
10950 outline: none;
10951 cursor: pointer;
10952 }
10953
10954 .cloud-pricing-wrapp .nav .nav-link {
10955 font-family: "Inter", sans-serif;
10956 font-size: 17px;
10957 font-weight: 400;
10958 line-height: 28px;
10959 border: transparent;
10960 background-color: transparent;
10961 padding: 0;
10962 margin-right: 30px;
10963 margin-bottom: 40px;
10964 color: #848d95;
10965 }
10966 .cloud-pricing-wrapp .nav .nav-link.active {
10967 color: #171717;
10968 }
10969 .cloud-pricing-wrapp .nav .nav-link span {
10970 width: 12px;
10971 height: 12px;
10972 border: 1px solid #848d95;
10973 border-radius: 50%;
10974 display: inline-block;
10975 position: relative;
10976 margin-right: 5px;
10977 }
10978 .cloud-pricing-wrapp .nav .nav-link span:before {
10979 content: "";
10980 width: 0;
10981 height: 9px;
10982 border-radius: 50%;
10983 background-color: #ec595a;
10984 position: absolute;
10985 left: 50%;
10986 top: 50%;
10987 transform: translate(-50%, -50%);
10988 }
10989 .cloud-pricing-wrapp .nav .nav-link.active span:before {
10990 width: 9px;
10991 }
10992 .cloud-pricing-wrapp .tab-pane {
10993 padding-top: 0;
10994 }
10995 .cloud-pricing-wrapp-item {
10996 cursor: pointer;
10997 background-color: #fff;
10998 border-radius: 10px;
10999 display: flex;
11000 flex-wrap: wrap;
11001 align-items: center;
11002 padding: 30px 40px;
11003 margin-bottom: 15px;
11004 transition: all 0.3s linear;
11005 }
11006 .cloud-pricing-wrapp-item .plan {
11007 width: 25%;
11008 }
11009 .cloud-pricing-wrapp-item .label {
11010 font-size: 15px;
11011 line-height: 27px;
11012 color: #171717;
11013 margin-bottom: 0;
11014 font-family: "inter", sans-serif;
11015 font-family: 15px;
11016 }
11017 .cloud-pricing-wrapp-item .space {
11018 color: #171717;
11019 font-family: "Poppins", sans-serif;
11020 font-size: 22px;
11021 font-weight: 600;
11022 line-height: 30px;
11023 letter-spacing: 0.5px;
11024 }
11025 .cloud-pricing-wrapp-item .price {
11026 width: 25%;
11027 padding-left: 60px;
11028 }
11029 .cloud-pricing-wrapp-item .type {
11030 font-family: "inter", sans-serif;
11031 font-size: 17px;
11032 color: #171717;
11033 font-weight: 700;
11034 line-height: 30px;
11035 margin-bottom: 0;
11036 }
11037 .cloud-pricing-wrapp-item .btn-purchase {
11038 border-radius: 5px;
11039 background-color: #ec595a;
11040 color: #fff;
11041 transition: all 0.4s ease-in-out;
11042 font-size: 15px;
11043 font-weight: 500;
11044 line-height: 22px;
11045 padding: 4px 21px;
11046 margin-top: 6px;
11047 font-family: "inter", sans-serif;
11048 }
11049 .cloud-pricing-wrapp-item .btn-purchase:hover {
11050 background-color: #171717;
11051 color: #ec595a;
11052 text-decoration: none;
11053 }
11054
11055 .cloud-heading-2 {
11056 font-size: 50px;
11057 line-height: 1.24;
11058 margin-top: 0;
11059 font-family: "poppins", sans-serif;
11060 }
11061
11062 .app-pricing-area .pricing-title span {
11063 position: relative;
11064 }
11065 .app-pricing-area .pricing-title span .border-shape {
11066 bottom: -2px;
11067 left: 50%;
11068 position: absolute;
11069 width: 110px;
11070 }
11071 .app-pricing-area .title-text {
11072 margin-top: 0;
11073 font-size: 17px;
11074 font-family: "inter", sans-serif;
11075 color: #5d5d66;
11076 }
11077 .app-pricing-area .title-text .offer {
11078 font-family: "Kalam", cursive;
11079 font-weight: 700;
11080 color: #ec595a;
11081 }
11082 .app-pricing-area .pricing-switcher.nav .nav-link {
11083 font-size: 16px;
11084 font-weight: 600;
11085 border-radius: 22.5px;
11086 border: 1px solid;
11087 padding: 3px 16px;
11088 margin: 0 10px;
11089 color: #848d95;
11090 }
11091 .app-pricing-area .pricing-switcher.nav .nav-link.active {
11092 color: #171717;
11093 font-weight: 600;
11094 }
11095
11096 .app-pricing-item {
11097 background: #fff;
11098 border-radius: 10px;
11099 border: 1px solid #f0f0f0;
11100 text-align: center;
11101 transition: all 0.3s ease-in-out;
11102 padding: 38px 35px 50px;
11103 }
11104
11105 .app-pricing-item.active {
11106 position: relative;
11107 }
11108
11109 .app-pricing-item.active .popular-shape {
11110 top: -13%;
11111 right: -18%;
11112 position: absolute;
11113 z-index: 1;
11114 }
11115
11116 .app-pricing-item:hover {
11117 box-shadow: 0 20px 50px 0 rgba(23, 23, 23, 0.08);
11118 }
11119
11120 .app-pricing-item .item-title {
11121 font-size: 30px;
11122 line-height: 36px;
11123 margin-bottom: 14px;
11124 }
11125
11126 .app-pricing-item .item-label {
11127 font-size: 20px;
11128 line-height: 1.2;
11129 margin-bottom: 18px;
11130 }
11131
11132 .app-pricing-item .item-price {
11133 margin-bottom: 33px;
11134 }
11135
11136 .app-pricing-item .item-price .dollar {
11137 color: #ec595a;
11138 font-size: 30px;
11139 line-height: 36px;
11140 font-weight: 700;
11141 position: relative;
11142 }
11143
11144 .app-pricing-item .item-price .dollar svg {
11145 bottom: 0;
11146 left: 0;
11147 position: absolute;
11148 }
11149
11150 .app-pricing-item .item-price .time {
11151 color: #9199a1;
11152 font-size: 18px;
11153 line-height: 36px;
11154 }
11155
11156 .app-pricing-item .item-price .border-shape {
11157 bottom: 0;
11158 left: 0;
11159 position: absolute;
11160 width: 41px;
11161 }
11162
11163 .app-pricing-item ul {
11164 border-top: 1px solid #f0f0f0;
11165 padding-top: 33px;
11166 margin-bottom: 45px;
11167 }
11168
11169 .app-pricing-item ul li {
11170 font-size: 15px;
11171 line-height: 40px;
11172 }
11173
11174 .app-pricing-item .btn {
11175 border-color: #ec595a;
11176 color: #ec595a;
11177 }
11178
11179 .app-pricing-item .btn:hover {
11180 background: #ec595a;
11181 color: #fff;
11182 text-decoration: none;
11183 }
11184
11185 .app-pricing-question .question-title {
11186 font-size: 22px;
11187 font-weight: 600;
11188 line-height: 30px;
11189 letter-spacing: 0.5px;
11190 }
11191
11192 .app-pricing-question .question-text {
11193 color: #171717;
11194 padding: 0 15px;
11195 }
11196
11197 .app-pricing-question .question-text a {
11198 color: #ec595a;
11199 text-decoration: underline;
11200 }
11201
11202 .choose-plan-area-three .pricing-switcher {
11203 padding-bottom: 80px;
11204 }
11205
11206 .choose-plan-area-three .pricing-switcher .nav-link::after {
11207 background: #435bcc;
11208 }
11209
11210 .choose-plan-area-three .tab-pane {
11211 padding-top: 0;
11212 }
11213
11214 .choose-plan-area-three .pricing-item {
11215 border-radius: 15px;
11216 background-color: #fff;
11217 box-shadow: 0 5px 16px 0 rgba(32, 32, 32, 0.1);
11218 padding: 65px 50px 70px;
11219 margin-top: 0;
11220 border: none;
11221 transition: all 0.3s linear;
11222 }
11223
11224 .choose-plan-area-three .pricing-item.active,
11225 .choose-plan-area-three .pricing-item:hover {
11226 box-shadow: 0 50px 80px 0 rgba(53, 42, 67, 0.1);
11227 transform: translateY(-20px);
11228 border: none;
11229 }
11230
11231 .choose-plan-area-three .pricing-item.active h4,
11232 .choose-plan-area-three .pricing-item:hover h4 {
11233 color: #3c73f0;
11234 }
11235
11236 .choose-plan-area-three .pricing-item.active .btn,
11237 .choose-plan-area-three .pricing-item:hover .btn {
11238 color: #fff;
11239 background-color: #356eef;
11240 }
11241
11242 .choose-plan-area-three .pricing-item h4 {
11243 font-size: 24px;
11244 font-weight: 600;
11245 line-height: 1.25;
11246 letter-spacing: 0.5px;
11247 margin-bottom: 20px;
11248 transition: all 0.3s linear;
11249 }
11250
11251 .choose-plan-area-three .pricing-item .price {
11252 font-size: 40px;
11253 font-family: "Poppins", sans-serif;
11254 font-weight: 500;
11255 line-height: 1.2;
11256 margin-bottom: 40px;
11257 margin-top: 0;
11258 color: #171717;
11259 }
11260
11261 .choose-plan-area-three .pricing-item .price span {
11262 color: #8d8d8d;
11263 font-size: 20px;
11264 }
11265
11266 .choose-plan-area-three .pricing-item .list-wrapp {
11267 margin-bottom: 50px;
11268 }
11269
11270 .choose-plan-area-three .pricing-item .list-wrapp .list-title {
11271 font-size: 18px;
11272 line-height: 160%;
11273 font-weight: 700;
11274 color: #171717;
11275 margin-bottom: 20px;
11276 }
11277
11278 .choose-plan-area-three .pricing-item .list-wrapp ul {
11279 padding-top: 0;
11280 }
11281
11282 .choose-plan-area-three .pricing-item .list-wrapp ul li {
11283 display: flex;
11284 font-size: 17px;
11285 line-height: 1;
11286 text-align: left;
11287 padding: 0;
11288 margin-bottom: 20px;
11289 }
11290
11291 .choose-plan-area-three .pricing-item .list-wrapp ul li.disable {
11292 color: rgba(23, 23, 23, 0.5);
11293 }
11294
11295 .choose-plan-area-three .pricing-item .list-wrapp ul li .icon-check {
11296 color: #45c260;
11297 margin-right: 10px;
11298 font-size: 20px;
11299 }
11300
11301 .choose-plan-area-three .pricing-item .list-wrapp ul li .icon-close {
11302 color: #c1c1c1;
11303 margin-right: 10px;
11304 font-size: 20px;
11305 }
11306
11307 .choose-plan-area-three .pricing-item .btn {
11308 border: 1px solid #356eef;
11309 border-radius: 26px;
11310 padding: 10px 0;
11311 font-family: "Poppins", sans-serif;
11312 color: #171717;
11313 font-size: 20px;
11314 font-weight: 600;
11315 line-height: 30px;
11316 letter-spacing: 0.5px;
11317 display: block;
11318 height: 52px;
11319 width: 190px;
11320 margin: 0 auto;
11321 text-align: center;
11322 transition: all 0.3s linear;
11323 }
11324
11325 .choose-plan-area-three .pricing-item .btn:hover {
11326 color: #fff;
11327 background-color: #356eef;
11328 text-decoration: none;
11329 }
11330
11331 .pricing-tabs .nav-link {
11332 padding: 0.3125rem 1.125rem;
11333 border-radius: 0.375rem;
11334 font-size: 1rem;
11335 color: #6d6d6d;
11336 }
11337
11338 .pricing-tabs .nav-link.active {
11339 border-color: transparent;
11340 background: #ec595a;
11341 color: #fff;
11342 }
11343
11344 .pricing-tabs .nav-link:hover {
11345 border-color: transparent;
11346 }
11347
11348 @media (max-width: 480px) {
11349 .cloud-pricing-wrapp .nav .nav-link {
11350 margin-right: 15px;
11351 margin-bottom: 15px;
11352 }
11353 }
11354 .tab-content .fade {
11355 transition: opacity 0.1s linear;
11356 }
11357
11358 .pricing-item-2 {
11359 box-shadow: 0 10px 25px 0 rgba(191, 191, 191, 0.2509803922);
11360 background-color: #fff;
11361 border-radius: 20px;
11362 padding: 40px;
11363 transition: all 0.3s linear;
11364 }
11365 .pricing-item-2.active, .pricing-item-2:hover {
11366 box-shadow: 0 20px 50px 0 rgba(191, 191, 191, 0.5019607843);
11367 transform: translateY(-30px);
11368 }
11369 .pricing-item-2 h4 {
11370 font-family: "Poppins", sans-serif;
11371 font-size: 32px;
11372 font-weight: 500;
11373 line-height: 32px;
11374 letter-spacing: 0.5px;
11375 color: #171717;
11376 margin-top: 45px;
11377 margin-bottom: 20px;
11378 }
11379 .pricing-item-2 p {
11380 font-family: "Inter", sans-serif;
11381 font-size: 16px;
11382 font-weight: 400;
11383 line-height: 26px;
11384 letter-spacing: 0.5px;
11385 color: #70717b;
11386 margin-bottom: 72px;
11387 }
11388 .pricing-item-2 .price {
11389 font-family: "Poppins", sans-serif;
11390 font-size: 20px;
11391 font-weight: 500;
11392 line-height: 26px;
11393 letter-spacing: 0.5px;
11394 color: #333;
11395 margin-bottom: 10px;
11396 }
11397 .pricing-item-2 .pack-feature {
11398 font-family: "Inter", sans-serif;
11399 font-size: 16px;
11400 font-weight: 400;
11401 line-height: 16px;
11402 letter-spacing: 0.5px;
11403 color: #828282;
11404 }
11405 .pricing-item-2 .btn {
11406 border-radius: 5px;
11407 padding: 17px 0;
11408 width: 95%;
11409 margin-top: 33px;
11410 }
11411 .pricing-item-2 .btn:hover {
11412 color: #fff;
11413 background-color: #eb5757;
11414 border-color: #eb5757;
11415 text-decoration: none;
11416 }
11417
11418 .pricing-item-3 {
11419 box-shadow: 0 20px 50px 0 rgba(0, 0, 0, 0.0509803922);
11420 border-radius: 20px;
11421 overflow: hidden;
11422 background-color: #fff;
11423 transition: all 0.3s ease-out;
11424 }
11425 .pricing-item-3:hover {
11426 box-shadow: 0 50px 80px 0 rgba(53, 42, 67, 0.1019607843);
11427 }
11428 .pricing-item-3 .price-body {
11429 display: flex;
11430 justify-content: center;
11431 flex-direction: column;
11432 }
11433 .pricing-item-3 .price-body p {
11434 margin-bottom: 0;
11435 font-size: 17px;
11436 font-family: "inter", sans-serif;
11437 }
11438 .pricing-item-3.middle .price {
11439 padding-top: 71px;
11440 }
11441 .pricing-item-3 h5 {
11442 font-family: "Inter", sans-serif;
11443 font-size: 22px;
11444 line-height: 18px;
11445 text-align: center;
11446 padding: 36px 0;
11447 box-shadow: 0 1px 1px 0 rgba(71, 61, 141, 0.1019607843);
11448 margin-bottom: 0;
11449 margin-top: 0;
11450 text-transform: capitalize;
11451 }
11452 .pricing-item-3 .price {
11453 font-family: "Inter", sans-serif;
11454 font-size: 25px;
11455 font-weight: 700;
11456 line-height: 18px;
11457 color: #473d8d;
11458 padding-top: 44px;
11459 padding-bottom: 58px;
11460 text-align: center;
11461 }
11462 .pricing-item-3 .price span {
11463 color: #c6c6c6;
11464 font-size: 18px;
11465 font-weight: 700;
11466 line-height: 18px;
11467 }
11468 .pricing-item-3 .price span:first-child {
11469 color: #473d8d;
11470 }
11471 .pricing-item-3 ul {
11472 margin-left: auto;
11473 margin-right: auto;
11474 }
11475 .pricing-item-3 ul li {
11476 font-family: "Inter", sans-serif;
11477 font-size: 17px;
11478 font-weight: 400;
11479 line-height: 28px;
11480 color: #8d8d8d;
11481 margin-top: 15px;
11482 }
11483 .pricing-item-3 ul li:first-child {
11484 margin-top: 0;
11485 }
11486 .pricing-item-3 ul li span {
11487 width: 22px;
11488 height: 22px;
11489 font-size: 9px;
11490 color: #a0a1a3;
11491 border: 1px solid #a0a1a3;
11492 border-radius: 50%;
11493 background-color: transparent;
11494 margin-right: 20px;
11495 display: inline-flex;
11496 align-items: center;
11497 justify-content: center;
11498 }
11499 .pricing-item-3 ul li span i {
11500 display: inline-block;
11501 }
11502 .pricing-item-3 ul li.checked {
11503 color: #171717;
11504 }
11505 .pricing-item-3 ul li.checked span {
11506 background-color: #473d8d;
11507 border-color: #473d8d;
11508 color: #fff;
11509 }
11510 .pricing-item-3 .btn {
11511 margin-left: auto;
11512 margin-right: auto;
11513 padding: 10px 76px;
11514 border: 1px solid #473d8d;
11515 border-radius: 25px;
11516 font-family: "Inter", sans-serif;
11517 font-size: 16px;
11518 font-weight: 500;
11519 margin-bottom: 42px;
11520 margin-top: 33px;
11521 line-height: 1.5;
11522 text-transform: capitalize;
11523 position: relative;
11524 text-decoration: none;
11525 display: inline-block;
11526 overflow: hidden;
11527 text-align: center;
11528 cursor: pointer;
11529 transition: 0.3s ease-out;
11530 color: #212529;
11531 }
11532 .pricing-item-3 .btn:hover {
11533 background-color: #473d8d;
11534 font-weight: 700;
11535 color: #fff;
11536 text-decoration: none;
11537 }
11538
11539 .pricing-switcher {
11540 position: relative;
11541 z-index: 99;
11542 justify-content: space-between;
11543 text-align: center;
11544 }
11545 .pricing-switcher .nav-link {
11546 color: #828282;
11547 text-transform: capitalize;
11548 padding: 5px 10px;
11549 display: inline-block;
11550 position: relative;
11551 font-family: "Poppins", sans-serif;
11552 font-size: 16px;
11553 font-weight: 600;
11554 }
11555 .pricing-switcher .nav-link:hover {
11556 color: unset;
11557 }
11558 .pricing-switcher .nav-link:before {
11559 position: absolute;
11560 content: "";
11561 border: 1px solid rgba(79, 79, 79, 0.2);
11562 width: 100px;
11563 height: 40px;
11564 background: transparent;
11565 border-radius: 25px;
11566 right: -51px;
11567 top: 50%;
11568 margin-top: -20px;
11569 }
11570 .pricing-switcher .nav-link:after {
11571 position: absolute;
11572 content: "";
11573 width: 31px;
11574 height: 31px;
11575 background: #eb5757;
11576 border-radius: 50%;
11577 margin-top: -15.5px;
11578 z-index: 1;
11579 top: 50%;
11580 right: -47px;
11581 transition: all ease 0.3s;
11582 animation-name: fadeInLeft;
11583 animation-duration: 0.3s;
11584 }
11585 .pricing-switcher .nav-link:after.fadeInLeft {
11586 animation-name: fadeInLeft;
11587 animation-duration: 0.3s;
11588 }
11589 .pricing-switcher .nav-link:nth-child(odd) {
11590 padding-right: 80px;
11591 }
11592 .pricing-switcher .nav-link:nth-child(even) {
11593 text-align: right;
11594 padding-left: 80px;
11595 }
11596 .pricing-switcher .nav-link:nth-child(even):before {
11597 left: -49px;
11598 right: auto;
11599 }
11600 .pricing-switcher .nav-link:nth-child(even):after {
11601 right: auto;
11602 left: -45px;
11603 animation-name: fadeInRight;
11604 animation-duration: 0.3s;
11605 }
11606 .pricing-switcher .nav-link:nth-child(even):after.fadeInRight {
11607 animation-name: fadeInRight;
11608 animation-duration: 0.3s;
11609 }
11610 .pricing-switcher .nav-link.active {
11611 color: #333333;
11612 font-weight: 600;
11613 }
11614 .pricing-switcher .nav-link.active::after, .pricing-switcher .nav-link.active::before {
11615 display: none;
11616 z-index: -9;
11617 }
11618
11619 /*================================================
11620 Pricing Two CSS
11621 =================================================*/
11622 .bg-price {
11623 background-color: #f7f7f7;
11624 }
11625
11626 .pricing-menu {
11627 position: static;
11628 background-color: #fff;
11629 }
11630 .pricing-menu.navbar_fixed {
11631 position: fixed;
11632 }
11633
11634 .pricing-banner-2 .pricing-switcher-2 {
11635 background-color: #ec595a;
11636 border-radius: 23px;
11637 border: none;
11638 display: inline-flex;
11639 padding: 4px;
11640 position: relative;
11641 z-index: 1;
11642 width: fit-content;
11643 }
11644 .pricing-banner-2 .pricing-switcher-2 .switcher-bg {
11645 content: "";
11646 width: 50%;
11647 height: auto;
11648 background: #fff;
11649 position: absolute;
11650 display: inline-block;
11651 left: 3px;
11652 top: 3px;
11653 bottom: 3px;
11654 border-radius: 23px;
11655 z-index: -1;
11656 transition: all 0.4s ease-out;
11657 }
11658 .pricing-banner-2 .pricing-switcher-2 .switcher-bg.right {
11659 left: 48%;
11660 }
11661 .pricing-banner-2 .pricing-switcher-2 .nav-link {
11662 border-radius: 23px;
11663 font-weight: 700;
11664 font-size: 16px;
11665 line-height: 16px;
11666 border: none;
11667 color: #fff;
11668 padding: 6px 23px;
11669 }
11670 .pricing-banner-2 .pricing-switcher-2 .nav-link.active {
11671 background-color: transparent;
11672 color: #171717;
11673 }
11674 .pricing-banner-2 .tab-pane {
11675 padding-top: 20px;
11676 }
11677
11678 .old-price,
11679 .current-price,
11680 .price-format,
11681 .subscribe-btn,
11682 .price-note {
11683 color: #fff;
11684 font-family: "Poppins", sans-serif;
11685 }
11686
11687 .old-price {
11688 font-size: 22px;
11689 line-height: 36px;
11690 text-decoration: line-through;
11691 }
11692
11693 .current-price {
11694 font-weight: 700;
11695 font-size: 28px;
11696 line-height: 44px;
11697 display: inline-block;
11698 vertical-align: middle;
11699 }
11700
11701 .saving-price {
11702 background-color: #fff;
11703 border-radius: 1px;
11704 color: #171717;
11705 display: inline-block;
11706 font-size: 14px;
11707 line-height: 14px;
11708 padding: 6px 8px;
11709 }
11710
11711 .price-format {
11712 font-family: "Inter", sans-serif;
11713 font-size: 12px;
11714 line-height: 12px;
11715 margin-bottom: 25px;
11716 }
11717
11718 .subscribe-btn {
11719 border-radius: 2px;
11720 display: inline-block;
11721 font-weight: 500;
11722 font-size: 20px;
11723 line-height: 20px;
11724 background-color: #ec595a;
11725 padding: 12px 24px;
11726 margin-bottom: 8px;
11727 transition: all 0.3s ease-in-out;
11728 }
11729 .subscribe-btn:hover {
11730 background-color: #171717;
11731 color: #ec595a;
11732 }
11733
11734 .price-note {
11735 font-family: "Inter", sans-serif;
11736 font-size: 14px;
11737 line-height: 22px;
11738 width: 60%;
11739 }
11740
11741 .pricing-compare-table > table {
11742 margin: 0;
11743 }
11744
11745 .pricing-compare-table .table-bg {
11746 background: #2c3563;
11747 }
11748 .pricing-compare-table .table-bg2 {
11749 background: #202647;
11750 }
11751 .pricing-compare-table .table-title-bg {
11752 background: #252c53;
11753 }
11754 .pricing-compare-table .red-top {
11755 border-top: 1px solid #ec595a;
11756 }
11757 .pricing-compare-table .red-bottom {
11758 border-bottom: 1px solid #ec595a;
11759 }
11760 .pricing-compare-table .gray-bottom {
11761 border-bottom: 1px solid #c6c6c6;
11762 }
11763 .pricing-compare-table .plan-title {
11764 color: #fff;
11765 font-weight: 600;
11766 font-size: 20px;
11767 line-height: 32px;
11768 margin-bottom: 30px;
11769 }
11770 .pricing-compare-table .nav-tabs {
11771 border-bottom: none;
11772 justify-content: center;
11773 }
11774 .pricing-compare-table .nav-tabs .nav-link {
11775 border: 1px solid #c6c6c6;
11776 border-radius: 2px;
11777 color: #fff;
11778 font-weight: 700;
11779 font-size: 14px;
11780 line-height: 22px;
11781 padding: 4px 5px;
11782 margin: 0 5px;
11783 }
11784 .pricing-compare-table .nav-tabs .nav-link.active {
11785 color: #171717;
11786 }
11787 .pricing-compare-table .tab-pane {
11788 padding-top: 8px;
11789 }
11790 .pricing-compare-table .old-price {
11791 font-size: 14px;
11792 font-weight: 700;
11793 line-height: 22px;
11794 color: #c6c6c6;
11795 margin-bottom: 0;
11796 }
11797 .pricing-compare-table .current-price {
11798 font-size: 14px;
11799 line-height: 22px;
11800 margin: 10px 0;
11801 }
11802 .pricing-compare-table .current-price span {
11803 font-size: 18px;
11804 }
11805 .pricing-compare-table .price-format {
11806 margin-bottom: 10px;
11807 }
11808 .pricing-compare-table .saving-price {
11809 margin-bottom: 15px;
11810 }
11811 .pricing-compare-table .subscribe-btn {
11812 background-color: #fff;
11813 color: #171717;
11814 display: block;
11815 font-size: 16px;
11816 line-height: 26px;
11817 padding: 5px 24px;
11818 margin-bottom: 20px;
11819 }
11820 .pricing-compare-table .subscribe-btn:hover {
11821 background-color: #ec595a;
11822 color: #fff;
11823 }
11824
11825 .pricing-compare-table .price-note {
11826 color: #c6c6c6;
11827 width: 100%;
11828 }
11829 .pricing-compare-table .feature-title {
11830 width: 45%;
11831 padding: 25px 0;
11832 box-shadow: -10px 5px 30px 0 #191e38;
11833 }
11834 .pricing-compare-table .feature {
11835 width: 25%;
11836 text-align: center;
11837 }
11838 .pricing-compare-table .feature-text p {
11839 color: #fff;
11840 font-size: 14px;
11841 line-height: 20px;
11842 padding: 0 32px;
11843 }
11844 .pricing-compare-table .feature-text i {
11845 color: #fff;
11846 font-size: 27px;
11847 }
11848 .pricing-compare-table .feature-btn {
11849 color: #fff;
11850 font-size: 20px;
11851 line-height: 30px;
11852 text-align: left;
11853 padding-left: 60px;
11854 position: relative;
11855 }
11856 .pricing-compare-table .feature-btn:before {
11857 content: "L";
11858 font-family: "ElegantIcons";
11859 font-weight: 400;
11860 position: absolute;
11861 left: 15px;
11862 }
11863 .pricing-compare-table .feature-btn.collapsed:before {
11864 content: "K";
11865 }
11866 .pricing-compare-table .feature-body p {
11867 color: #fff;
11868 font-size: 14px;
11869 line-height: 20px;
11870 padding: 12px 65px 0 60px;
11871 }
11872 .pricing-compare-table .feature-row .feature-type {
11873 text-align: center;
11874 }
11875 .pricing-compare-table .feature-row .feature-type .section-text {
11876 color: #ec595a;
11877 text-align: center;
11878 font-weight: 600;
11879 font-size: 22px;
11880 line-height: 30px;
11881 letter-spacing: 0.5px;
11882 transform: rotate(180deg);
11883 writing-mode: tb-rl;
11884 }
11885 .pricing-compare-table.mobile .feature-title {
11886 width: 100%;
11887 padding: 5px 0;
11888 box-shadow: none;
11889 text-align: left;
11890 }
11891 .pricing-compare-table.mobile .sub-padding {
11892 padding: 20px 25px 15px;
11893 }
11894 .pricing-compare-table.mobile .product-plan {
11895 margin-bottom: 30px;
11896 }
11897 .pricing-compare-table.mobile .feature-body p {
11898 padding: 12px 0 0 20px;
11899 }
11900 .pricing-compare-table.mobile .feature-btn {
11901 padding-left: 20px;
11902 }
11903 .pricing-compare-table.mobile .feature-btn:before {
11904 left: 0;
11905 }
11906
11907 /*================================================
11908 Pricing Two CSS
11909 =================================================*/
11910 .bg-price {
11911 background-color: #f7f7f7;
11912 }
11913
11914 .pricing-menu {
11915 position: static;
11916 background-color: #fff;
11917 }
11918 .pricing-menu.navbar_fixed {
11919 position: fixed;
11920 }
11921
11922 .pricing-compare-table .feature-title {
11923 padding: 15px 20px;
11924 background: #f7f7f7;
11925 color: #333;
11926 font-size: 24px;
11927 font-weight: 700;
11928 text-align: center;
11929 position: relative;
11930 box-shadow: 0 5px 20px rgba(0, 0, 0, 0.05);
11931 }
11932 .pricing-compare-table .feature-row {
11933 display: flex;
11934 flex-direction: row;
11935 align-items: center;
11936 justify-content: center;
11937 border-bottom: 1px solid #eee;
11938 position: relative;
11939 }
11940 .pricing-compare-table .feature-row:last-of-type {
11941 border-bottom: none;
11942 }
11943 .pricing-compare-table .feature-row .feature-type {
11944 text-align: center;
11945 }
11946 .pricing-compare-table .feature-row .feature-type .section-text {
11947 color: #ec595a;
11948 text-align: center;
11949 font-weight: 600;
11950 font-size: 22px;
11951 line-height: 30px;
11952 letter-spacing: 0.5px;
11953 transform: rotate(180deg);
11954 writing-mode: tb-rl;
11955 }
11956 .pricing-compare-table .feature-row .feature-body {
11957 display: flex;
11958 flex-direction: row;
11959 align-items: center;
11960 justify-content: center;
11961 flex-wrap: wrap;
11962 width: 100%;
11963 }
11964 .pricing-compare-table .feature-row .feature-body p {
11965 color: #fff;
11966 font-size: 14px;
11967 line-height: 20px;
11968 padding: 12px 65px 0 60px;
11969 }
11970 .pricing-compare-table .feature-row .feature-body:last-of-type p {
11971 padding-bottom: 12px;
11972 }
11973 .pricing-compare-table .feature-row .feature-btn {
11974 position: absolute;
11975 right: 20px;
11976 top: 50%;
11977 transform: translateY(-50%);
11978 padding-left: 40px;
11979 }
11980 .pricing-compare-table .feature-row .feature-btn:before {
11981 content: "";
11982 position: absolute;
11983 left: -20px;
11984 top: 50%;
11985 transform: translateY(-50%);
11986 width: 10px;
11987 height: 10px;
11988 border-radius: 50%;
11989 background-color: #ec595a;
11990 }
11991 .pricing-compare-table.mobile .feature-title {
11992 width: 100%;
11993 padding: 5px 0;
11994 box-shadow: none;
11995 text-align: left;
11996 }
11997 .pricing-compare-table.mobile .sub-padding {
11998 padding: 20px 25px 15px;
11999 }
12000 .pricing-compare-table.mobile .product-plan {
12001 margin-bottom: 30px;
12002 }
12003 .pricing-compare-table.mobile .feature-body p {
12004 padding: 12px 0 0 20px;
12005 }
12006 .pricing-compare-table.mobile .feature-btn {
12007 padding-left: 20px;
12008 }
12009 .pricing-compare-table.mobile .feature-btn:before {
12010 left: 0;
12011 }
12012
12013 .pricing-item-2 .btn {
12014 position: relative;
12015 font-size: 1.125rem;
12016 font-weight: 500;
12017 line-height: 1.5;
12018 text-transform: capitalize;
12019 text-decoration: none;
12020 border: 2px solid #171717;
12021 border-radius: 0.375rem;
12022 padding: 0.8125rem 2rem;
12023 margin: 0 0;
12024 display: inline-block;
12025 overflow: hidden;
12026 text-align: center;
12027 cursor: pointer;
12028 transition: 0.3s ease-out;
12029 color: #212529;
12030 font-family: "Inter", sans-serif;
12031 margin-top: 30px;
12032 }
12033
12034 .cloud-pricing-wrapp .nav {
12035 border: none;
12036 }
12037 .cloud-pricing-wrapp .nav .nav-link {
12038 font-family: "Inter", sans-serif;
12039 font-size: 17px;
12040 font-weight: 400;
12041 line-height: 28px;
12042 border: transparent;
12043 background-color: transparent;
12044 padding: 0;
12045 margin-right: 30px;
12046 margin-bottom: 40px;
12047 color: #848d95;
12048 }
12049 .cloud-pricing-wrapp .nav .nav-link.active {
12050 color: #171717;
12051 }
12052 .cloud-pricing-wrapp .nav .nav-link span {
12053 width: 12px;
12054 height: 12px;
12055 border: 1px solid #848d95;
12056 border-radius: 50%;
12057 display: inline-block;
12058 position: relative;
12059 margin-right: 5px;
12060 }
12061 .cloud-pricing-wrapp .nav .nav-link span:before {
12062 content: "";
12063 width: 0;
12064 height: 9px;
12065 border-radius: 50%;
12066 background-color: #ec595a;
12067 position: absolute;
12068 left: 50%;
12069 top: 50%;
12070 transform: translate(-50%, -50%);
12071 }
12072 .cloud-pricing-wrapp .nav .nav-link.active span:before {
12073 width: 9px;
12074 }
12075 .cloud-pricing-wrapp .tab-pane {
12076 padding-top: 0;
12077 }
12078 .cloud-pricing-wrapp-item {
12079 cursor: pointer;
12080 background-color: #fff;
12081 border-radius: 10px;
12082 display: flex;
12083 flex-wrap: wrap;
12084 align-items: center;
12085 padding: 30px 40px;
12086 margin-bottom: 15px;
12087 transition: all 0.3s linear;
12088 }
12089 .cloud-pricing-wrapp-item .plan {
12090 width: 25%;
12091 }
12092 .cloud-pricing-wrapp-item .label {
12093 font-size: 15px;
12094 line-height: 27px;
12095 color: #171717;
12096 margin-bottom: 0;
12097 font-family: "inter", sans-serif;
12098 font-family: 15px;
12099 }
12100 .cloud-pricing-wrapp-item .space {
12101 color: #171717;
12102 font-family: "Poppins", sans-serif;
12103 font-size: 22px;
12104 font-weight: 600;
12105 line-height: 30px;
12106 letter-spacing: 0.5px;
12107 }
12108 .cloud-pricing-wrapp-item .price {
12109 width: 25%;
12110 padding-left: 60px;
12111 }
12112 .cloud-pricing-wrapp-item .type {
12113 font-family: "inter", sans-serif;
12114 font-size: 17px;
12115 color: #171717;
12116 font-weight: 700;
12117 line-height: 30px;
12118 margin-bottom: 0;
12119 }
12120 .cloud-pricing-wrapp-item .btn-purchase {
12121 border-radius: 5px;
12122 background-color: #ec595a;
12123 color: #fff;
12124 transition: all 0.4s ease-in-out;
12125 font-size: 15px;
12126 font-weight: 500;
12127 line-height: 22px;
12128 padding: 4px 21px;
12129 margin-top: 6px;
12130 font-family: "inter", sans-serif;
12131 }
12132 .cloud-pricing-wrapp-item .btn-purchase:hover {
12133 background-color: #171717;
12134 color: #ec595a;
12135 text-decoration: none;
12136 }
12137
12138 .cloud-heading-2 {
12139 font-size: 50px;
12140 line-height: 1.24;
12141 margin-top: 0;
12142 font-family: "poppins", sans-serif;
12143 }
12144
12145 .cloud-pricing-wrapp .nav .nav-link span {
12146 width: 12px;
12147 height: 12px;
12148 border: 1px solid #848d95;
12149 border-radius: 50%;
12150 display: inline-block;
12151 position: relative;
12152 margin-right: 5px;
12153 }
12154
12155 .cloud-pricing-wrapp .nav .nav-link span:before {
12156 content: "";
12157 width: 0;
12158 height: 9px;
12159 border-radius: 50%;
12160 background-color: #ec595a;
12161 position: absolute;
12162 left: 50%;
12163 top: 50%;
12164 transform: translate(-50%, -50%);
12165 }
12166
12167 .cloud-pricing-wrapp .nav .nav-link.active span {
12168 border-color: #171717;
12169 }
12170
12171 .cloud-pricing-wrapp .nav .nav-link.active {
12172 background-color: transparent;
12173 }
12174
12175 .cloud-pricing-wrapp .nav .nav-link.active span:before {
12176 width: 9px;
12177 }
12178
12179 .cloud-pricing-wrapp .tab-pane {
12180 padding-top: 0;
12181 width: 100%;
12182 }
12183
12184 .cloud-pricing-item {
12185 cursor: pointer;
12186 background-color: #fff;
12187 border-radius: 10px;
12188 display: flex;
12189 flex-wrap: wrap;
12190 align-items: center;
12191 padding: 30px 40px;
12192 margin-bottom: 15px;
12193 transition: all 0.3s linear;
12194 }
12195
12196 .cloud-pricing-item .plan {
12197 width: 25%;
12198 }
12199
12200 .cloud-pricing-item .content {
12201 width: 50%;
12202 }
12203
12204 .cloud-pricing-item .price {
12205 width: 25%;
12206 padding-left: 60px;
12207 }
12208
12209 .cloud-pricing-item .label {
12210 font-size: 15px;
12211 line-height: 27px;
12212 color: #171717;
12213 margin-bottom: 0;
12214 font-family: "inter", sans-serif;
12215 }
12216
12217 .cloud-pricing-item .label .tag {
12218 color: #ec595a;
12219 margin-left: 8px;
12220 }
12221
12222 .cloud-pricing-item .space {
12223 color: #171717;
12224 font-family: "Poppins", sans-serif;
12225 font-size: 22px;
12226 font-weight: 600;
12227 line-height: 30px;
12228 letter-spacing: 0.5px;
12229 margin-bottom: 0;
12230 }
12231
12232 .cloud-pricing-item .plan-text {
12233 font-size: 15px;
12234 line-height: 22px;
12235 }
12236
12237 .cloud-pricing-item .type {
12238 color: #171717;
12239 font-weight: 700;
12240 line-height: 30px;
12241 margin-bottom: 5px;
12242 font-family: "inter", sans-serif;
12243 font-size: 17px;
12244 }
12245
12246 .cloud-pricing-item .btn-purchase {
12247 border-radius: 5px;
12248 background-color: #ec595a;
12249 color: #fff;
12250 transition: all 0.4s ease-in-out;
12251 font-size: 15px;
12252 font-family: "inter", sans-serif;
12253 font-weight: 500;
12254 line-height: 22px;
12255 padding: 4px 21px;
12256 margin-top: 6px;
12257 }
12258
12259 .cloud-pricing-item .btn-purchase:hover {
12260 background-color: #171717;
12261 color: #ec595a;
12262 text-decoration: none;
12263 }
12264
12265 .cloud-pricing-item:hover {
12266 box-shadow: 0 15px 35px 0 rgba(0, 0, 0, 0.1);
12267 }
12268
12269 .app-pricing-area .pricing-title span {
12270 position: relative;
12271 }
12272 .app-pricing-area .pricing-title span .border-shape {
12273 bottom: -2px;
12274 left: 50%;
12275 position: absolute;
12276 width: 110px;
12277 }
12278 .app-pricing-area .title-text {
12279 margin-top: 0;
12280 font-size: 17px;
12281 font-family: "inter", sans-serif;
12282 color: #5d5d66;
12283 }
12284 .app-pricing-area .title-text .offer {
12285 font-family: "Kalam", cursive;
12286 font-weight: 700;
12287 color: #ec595a;
12288 }
12289 .app-pricing-area .pricing-switcher.nav .nav-link {
12290 font-size: 16px;
12291 font-weight: 600;
12292 border-radius: 22.5px;
12293 border: 1px solid;
12294 padding: 3px 16px;
12295 margin: 0 10px;
12296 color: #848d95;
12297 }
12298 .app-pricing-area .pricing-switcher.nav .nav-link.active {
12299 color: #171717;
12300 font-weight: 600;
12301 }
12302
12303 .app-pricing-switcher.nav .nav-link {
12304 font-size: 16px;
12305 font-weight: 600;
12306 border-radius: 22.5px;
12307 border: 1px solid;
12308 padding: 3px 16px;
12309 margin: 0 10px;
12310 color: #848d95;
12311 font-family: "poppins", sans-serif;
12312 }
12313
12314 .app-pricing-switcher.nav .nav-link.active {
12315 color: #171717;
12316 }
12317
12318 .app-pricing-item {
12319 background: #fff;
12320 border-radius: 10px;
12321 border: 1px solid #f0f0f0;
12322 text-align: center;
12323 transition: all 0.3s ease-in-out;
12324 padding: 38px 35px 50px;
12325 }
12326
12327 .app-pricing-item .btn {
12328 position: relative;
12329 font-size: 1.125rem;
12330 font-weight: 500;
12331 line-height: 1.5;
12332 text-transform: capitalize;
12333 text-decoration: none;
12334 border: 2px solid #171717;
12335 border-radius: 0.375rem;
12336 padding: 0.8125rem 2rem;
12337 margin: 0 0;
12338 display: inline-block;
12339 overflow: hidden;
12340 text-align: center;
12341 cursor: pointer;
12342 transition: 0.3s ease-out;
12343 color: #212529;
12344 font-family: "Inter", sans-serif;
12345 }
12346
12347 .app-pricing-item.active {
12348 position: relative;
12349 }
12350 .app-pricing-item.active .popular-shape {
12351 top: -13%;
12352 right: -18%;
12353 position: absolute;
12354 z-index: 1;
12355 }
12356
12357 .app-pricing-item:hover {
12358 box-shadow: 0 20px 50px 0 rgba(23, 23, 23, 0.08);
12359 }
12360 .app-pricing-item .item-title {
12361 font-size: 30px;
12362 line-height: 36px;
12363 margin-bottom: 14px;
12364 }
12365 .app-pricing-item .item-label {
12366 font-size: 20px;
12367 line-height: 1.2;
12368 margin-bottom: 18px;
12369 }
12370 .app-pricing-item .item-price {
12371 margin-bottom: 33px;
12372 }
12373 .app-pricing-item .item-price .dollar {
12374 color: #ec595a;
12375 font-size: 30px;
12376 line-height: 36px;
12377 font-weight: 700;
12378 position: relative;
12379 }
12380 .app-pricing-item .item-price .dollar svg {
12381 bottom: 0;
12382 left: 0;
12383 position: absolute;
12384 }
12385 .app-pricing-item .item-price .time {
12386 color: #9199a1;
12387 font-size: 18px;
12388 line-height: 36px;
12389 }
12390 .app-pricing-item .item-price .border-shape {
12391 bottom: 0;
12392 left: 0;
12393 position: absolute;
12394 width: 41px;
12395 }
12396 .app-pricing-item ul {
12397 border-top: 1px solid #f0f0f0;
12398 padding-top: 33px;
12399 margin-bottom: 45px;
12400 }
12401 .app-pricing-item ul li {
12402 font-size: 15px;
12403 line-height: 40px;
12404 }
12405 .app-pricing-item .btn {
12406 border-color: #ec595a;
12407 color: #ec595a;
12408 }
12409 .app-pricing-item .btn:hover {
12410 background: #ec595a;
12411 color: #fff;
12412 text-decoration: none;
12413 }
12414
12415 .choose-plan-area-three .pricing-switcher {
12416 padding-bottom: 80px;
12417 }
12418 .choose-plan-area-three .pricing-switcher .nav-link::after {
12419 background: #435bcc;
12420 }
12421 .choose-plan-area-three .tab-pane {
12422 padding-top: 0;
12423 }
12424 .choose-plan-area-three .pricing-item {
12425 border-radius: 15px;
12426 background-color: #fff;
12427 box-shadow: 0 5px 16px 0 rgba(32, 32, 32, 0.1);
12428 padding: 65px 50px 70px;
12429 margin-top: 0;
12430 border: none;
12431 transition: all 0.3s linear;
12432 }
12433 .choose-plan-area-three .pricing-item:hover {
12434 box-shadow: 0 50px 80px 0 rgba(53, 42, 67, 0.1);
12435 transform: translateY(-20px);
12436 border: none;
12437 }
12438 .choose-plan-area-three .pricing-item:hover h4 {
12439 color: #3c73f0;
12440 }
12441 .choose-plan-area-three .pricing-item:hover .btn {
12442 color: #fff;
12443 background-color: #356eef;
12444 }
12445 .choose-plan-area-three .pricing-item h4 {
12446 font-size: 24px;
12447 font-weight: 600;
12448 line-height: 1.25;
12449 letter-spacing: 0.5px;
12450 margin-bottom: 20px;
12451 transition: all 0.3s linear;
12452 font-family: "poppins", sans-serif;
12453 }
12454 .choose-plan-area-three .pricing-item .price {
12455 font-size: 40px;
12456 font-family: "Poppins", sans-serif;
12457 font-weight: 500;
12458 line-height: 1.2;
12459 margin-bottom: 40px;
12460 margin-top: 0;
12461 color: #171717;
12462 }
12463 .choose-plan-area-three .pricing-item .price span {
12464 color: #8d8d8d;
12465 font-size: 20px;
12466 }
12467 .choose-plan-area-three .pricing-item .list-wrapp {
12468 margin-bottom: 50px;
12469 }
12470 .choose-plan-area-three .pricing-item .list-wrapp ul {
12471 padding-left: 0;
12472 }
12473 .choose-plan-area-three .pricing-item .list-wrapp .list-title {
12474 font-size: 18px;
12475 line-height: 160%;
12476 font-weight: 700;
12477 color: #171717;
12478 margin-bottom: 20px;
12479 }
12480 .choose-plan-area-three .pricing-item .list-wrapp ul {
12481 padding-top: 0;
12482 }
12483 .choose-plan-area-three .pricing-item .list-wrapp ul li {
12484 display: flex;
12485 font-size: 17px;
12486 line-height: 1;
12487 text-align: left;
12488 padding: 0;
12489 margin-bottom: 20px;
12490 }
12491 .choose-plan-area-three .pricing-item .list-wrapp ul li .icon-check {
12492 color: #45c260;
12493 margin-right: 10px;
12494 font-size: 20px;
12495 }
12496 .choose-plan-area-three .pricing-item .list-wrapp ul li .icon-close {
12497 color: #c1c1c1;
12498 margin-right: 10px;
12499 font-size: 20px;
12500 }
12501 .choose-plan-area-three .pricing-item .list-wrapp ul li.disable {
12502 color: rgba(23, 23, 23, 0.5);
12503 }
12504 .choose-plan-area-three .pricing-item .btn {
12505 border: 1px solid #356eef;
12506 border-radius: 26px;
12507 padding: 10px 0;
12508 font-family: "Poppins", sans-serif;
12509 color: #171717;
12510 font-size: 20px;
12511 font-weight: 600;
12512 line-height: 30px;
12513 letter-spacing: 0.5px;
12514 display: block;
12515 height: 52px;
12516 width: 190px;
12517 margin: 0 auto;
12518 text-align: center;
12519 transition: all 0.3s linear;
12520 }
12521 .choose-plan-area-three .pricing-item .btn:hover {
12522 color: #fff;
12523 background-color: #356eef;
12524 text-decoration: none;
12525 }
12526 .choose-plan-area-three .pricing-item.active {
12527 box-shadow: 0 50px 80px 0 rgba(53, 42, 67, 0.1);
12528 transform: translateY(-20px);
12529 border: none;
12530 }
12531 .choose-plan-area-three .pricing-item.active h4 {
12532 color: #3c73f0;
12533 }
12534 .choose-plan-area-three .pricing-item.active .btn {
12535 color: #fff;
12536 background-color: #356eef;
12537 }
12538
12539 @media (max-width: 991px) {
12540 .cloud-pricing-wrapp .nav {
12541 justify-content: center;
12542 }
12543 }
12544 @media (max-width: 480px) {
12545 .pricing-switcher .nav-link:nth-child(odd) {
12546 padding-right: 60px;
12547 }
12548 .pricing-switcher .nav-link:nth-child(even) {
12549 padding-left: 60px;
12550 }
12551 .pricing-banner-2 .current-price {
12552 font-size: 24px;
12553 }
12554 }
12555
12556 /*# sourceMappingURL=main.css.map */
12557