PluginProbe
WP Courses LMS – Online Courses Builder, eLearning Courses, Courses Solution, Education Courses / trunk
WP Courses LMS – Online Courses Builder, eLearning Courses, Courses Solution, Education Courses vtrunk
3.2.30 trunk 3.1.40 3.1.41 3.1.42 3.1.43 3.2.0 3.2.1 3.2.10 3.2.11 3.2.12 3.2.13 3.2.14 3.2.15 3.2.16 3.2.17 3.2.18 3.2.19 3.2.2 3.2.20 3.2.21 3.2.22 3.2.23 3.2.24 3.2.25 All 36 releases
wp-courses / css / style.css

style.css in WP Courses LMS – Online Courses Builder, eLearning Courses, Courses Solution, Education Courses trunk, at css/style.css

3,289 lines 63.2 KB
No matching file
Up and down to move Enter to open Esc to close
Raw Download Zip
1 :root {
2 --green: #3adfa9; /* wpc_primary_color */
3 --blue: #019ee5; /* wpc_secondary_color */
4 --wpcbg: #ffffff; /* wpc_primary_bg_color */
5 --lblue: #e0f4ff;
6 --lgreen: #def9ea;
7 --lred: #f0acac;
8 --gray1: #f5f5f5;
9 --gray2: #e9e9e9;
10 --gray3: #c1c1c1;
11 --gray4: #797979;
12 --black: #333739;
13 }
14
15 /********** FLEX GRID **********/
16
17 .wpc-wrapper {
18 margin: 0 auto;
19 }
20
21 .wpc-main {
22 background-color: var(--wpcbg);
23 margin: 0 auto;
24 }
25
26 .wpc-flex-container {
27 display: flex;
28 flex-wrap: wrap;
29 align-items: flex-start;
30 justify-content: flex-start;
31 }
32
33 .wpc-flex-full {
34 width: 100%;
35 }
36
37 .wpc-flex-center {
38 align-items: center;
39 }
40
41 .wpc-flex-content,
42 .wpc-flex-sidebar {
43 box-sizing: border-box;
44 }
45
46 .wpc-flex-content {
47 flex-grow: 0;
48 flex-shrink: 0;
49 flex-basis: 70%;
50 }
51
52 .wpc-flex-sidebar {
53 flex-grow: 1;
54 flex-shrink: 0;
55 flex-basis: 30%;
56 }
57
58 .wpc-flex-content-right {
59 flex-basis: 68%;
60 margin-left: 2%;
61 }
62
63 .wpc-flex-content-left {
64 flex-basis: 68%;
65 margin-right: 2%;
66 }
67
68 .wpc-flex-content-fw:has(.wpc-flex-cards-wrapper) {
69 flex-basis: 100% !important;
70 margin: 0 !important;
71 }
72
73 .wpc-flex-toolbar .wpc-btn, .wpc-flex-toolbar .wpc-select {
74 margin-left: 10px;
75 }
76
77 .wpc-toolbar-dark {
78 background-color: #c7c7c7 !important;
79 }
80
81 .wpc-toolbar-dark label {
82 color: #fff;
83 }
84
85 .wpc-flex-toolbar .wpc-range-input {
86 min-width: 240px;
87 position: relative;
88 top: -1px;
89 }
90
91 .wpc-ajax-course-toolbar>div {
92 margin-bottom: 0;
93 }
94
95 .wpc-flex-cards-wrapper {
96 padding: 3% 2%;
97 }
98
99 .wpc-metabox-toolbar {
100 padding: 20px;
101 overflow: hidden;
102 margin: -6px -12px 0;
103 background-color: #c7c7c7 !important;
104 }
105
106 .wpc-metabox-toolbar .wpc-btn-soft {
107 color: #fff;
108 }
109
110 .wpc-metabox-container {
111 padding: 20px;
112 background: var(--gray1);
113 margin: -6px -12px -12px;
114 width: auto !important;
115 }
116
117 .wpc-metabox-content {
118 padding: 20px;
119 }
120
121 .wpc-metabox-item {
122 padding: 10px 0;
123 }
124
125 .wpc-metabox-label {
126 margin: 5px 0;
127 display: inline-block;
128 }
129
130 .wpc-flex-2,.wpc-flex-3, .wpc-flex-4, .wpc-flex-6, .wpc-flex-8, .wpc-flex-10, .wpc-flex-12 {
131 box-sizing: border-box;
132 flex-grow: 0;
133 flex-shrink: 0;
134 margin: 0% 1% 2% 1%;
135 }
136
137 .wpc-flex-2 {
138 flex-basis: 14.66%;
139 }
140
141 .wpc-flex-3 {
142 flex-basis: 23%;
143 }
144
145 .wpc-flex-4 {
146 flex-basis: 31.33%;
147 }
148
149 .wpc-flex-4.wpc-flex-no-margin {
150 flex-basis: 33.33%;
151 }
152
153 .wpc-flex-6 {
154 flex-basis: 48%;
155 }
156
157 .wpc-flex-8 {
158 flex-basis: 64.66%;
159 }
160
161 .wpc-flex-8.wpc-flex-no-margin {
162 flex-basis: 66.66%;
163 }
164
165 .wpc-flex-10 {
166 flex-basis: 78%;
167 }
168
169 .wpc-flex-12 {
170 flex-basis: 98%;
171 }
172
173 .wpc-flex-loader {
174 border-radius: 12px;
175 width: calc(100% - 40px);
176 margin: 20px auto;
177 padding: 240px 0;
178 text-align: center;
179 }
180
181 .wpc-flex-sidebar .wpc-material,
182 .wpc-option-row /* Legacy */ {
183 margin-bottom: 2%;
184 }
185
186 .wpc-flex-no-margin {
187 margin: 0;
188 }
189
190 .wpc-flex-2.wpc-flex-no-margin {
191 flex-basis: 16.66%;
192 }
193
194 .wpc-flex-3.wpc-flex-no-margin {
195 flex-basis: 25%;
196 }
197
198 .wpc-flex-4.wpc-flex-no-margin {
199 flex-basis: 33.33%;
200 }
201
202 .wpc-flex-6.wpc-flex-no-margin {
203 flex-basis: 50%;
204 }
205
206 .wpc-flex-8.wpc-flex-no-margin {
207 flex-basis: 66.66%;
208 }
209
210 .wpc-flex-10.wpc-flex-no-margin {
211 flex-basis: 80%;
212 }
213
214 .wpc-flex-12.wpc-flex-no-margin {
215 flex-basis: 100%;
216 }
217
218 @media screen and (max-width: 500px) {
219 .wpc-material .wpc-btn:first-of-type {
220 margin-bottom: 10px;
221 }
222 }
223
224 @media screen and (max-width: 400px) {
225 .wpc-material .wpc-btn:first-of-type {
226 margin-bottom: 0;
227 }
228 }
229
230 /********** MODAL **********/
231
232 .wpc-modal-tools {
233 text-align: center;
234 padding: 20px;
235 }
236
237 .wpc-lightbox {
238 max-height: 85%;
239 position: relative;
240 overflow-y: auto;
241 background-color: #fff;
242 margin: 5% auto;
243 width: 80%;
244 max-width: 1140px;
245 height: auto;
246 border: 1px solid #e6e6e6;
247 box-shadow: 3px 3px 10px rgba(0, 0, 0, 0.3);
248 }
249
250 .wpc-lightbox-featured-img {
251 width: 100%;
252 height: auto;
253 border-radius: 8px;
254 }
255
256 .wpc-lightbox-content-wrapper {
257 position: relative;
258 }
259
260 .wpc-lightbox-content {
261 padding: 40px;
262 overflow: hidden;
263 }
264
265 .wpc-lightbox-content .bx-viewport {
266 overflow: visible !important;
267 }
268
269 .wpc-modal-full-featured {
270 margin: -40px -40px 0;
271 }
272
273 .wpc-modal-full-featured img {
274 width: 100%;
275 }
276
277 .wpc-lightbox-title {
278 max-width: 80%;
279 margin: 0 20px;
280 min-height: 24px;
281 font-size: 22px;
282 line-height: 22px;
283 padding: 0;
284 }
285
286 .wpc-lightbox-title img {
287 max-height: 34px;
288 }
289
290 .wpc-lightbox-close {
291 cursor: pointer;
292 position: absolute;
293 top: 5px;
294 right: 40px;
295 font-size: 24px;
296 line-height: 34px;
297 }
298
299 .wpc-lightbox-close-wrapper {
300 position: relative;
301 overflow: hidden;
302 border-bottom: 1px solid #e6e6e6;
303 padding: 10px 20px;
304 background: var(--gray1);
305 }
306
307 .wpc-lightbox-wrapper {
308 width: 100%;
309 height: 100%;
310 position: fixed;
311 background: rgba(0, 0, 0, 0.5);
312 top: 0;
313 left: 0;
314 z-index: 999999;
315 }
316
317 .wpc-lightbox-wrapper .bx-wrapper {
318 box-shadow: none;
319 -webkit-box-shadow: none;
320 -moz-box-shadow: none;
321 }
322
323 .wpc-lightbox-wrapper .bx-viewport {
324 margin: 20px 0;
325 }
326
327 .wpc-lightbox-pagination {
328 padding: 0 40px 40px 0;
329 margin-top: -40px !important;
330 }
331
332 @media screen and (max-width: 767px) {
333 .wpc-lightbox {
334 margin: 2% auto;
335 width: 96%;
336 }
337 .wpc-lightbox-content {
338 padding: 20px;
339 }
340 .wpc-lightbox-close-wrapper {
341 padding: 20px 5px;
342 }
343 }
344
345 /********** NAVIGATION **********/
346
347 .wpc-transition-nav li {
348 transition: 0.3s;
349 -webkit-transition: 0.3s;
350 -moz-transition: 0.3s;
351 }
352
353 .wpc-nav-list {
354 margin: 0;
355 list-style: none !important;
356 padding: 0 !important;
357 background-color: transparent;
358 overflow: hidden;
359 }
360
361 .wpc-admin-nav-list {
362 list-style: none;
363 }
364
365 .wpc-nav-list li, .wpc-admin-nav-list li {
366 font-size: 16px;
367 padding: 15px 25px;
368 color: #686868;
369 }
370
371 .wpc-nav-list.ui-sortable li {
372 cursor: grab !important;
373 }
374
375 .wpc-nav-list-contained {
376 border-top: 1px solid #e6e6e6;
377 border-left: 1px solid #e6e6e6;
378 overflow: hidden;
379 }
380
381 .wpc-nav-list-profile.wpc-nav-list-contained {
382 border-right: 1px solid #e6e6e6;
383 }
384
385 .wpc-nav-list li:not(.wpc-nav-list-header), .wpc-admin-nav-list li:not(.wpc-nav-list-header) {
386 cursor: pointer;
387 border-bottom: 1px solid #e6e6e6;
388 background-color: #fff;
389 margin-bottom: 0;
390 position: relative;
391 z-index: 1;
392 }
393
394 .wpc-nav-list li:not(.wpc-nav-list-header, .wpc-order-lesson-list-lesson, .wpc-course-list-li) {
395 transition: 0.3s;
396 }
397
398 .wpc-nav-list-section {
399 overflow: hidden;
400 }
401
402 .wpc-nav-list li i {
403 margin-right: 10px;
404 }
405
406 .wpc-nav-list li>a {
407 color: #686868;
408 display: block;
409 text-decoration: none;
410 margin: -15px -25px;
411 padding: 15px;
412 color: var(--black);
413 }
414
415 .wpc-active-admin-nav-item {
416 z-index: 2 !important;
417 }
418
419 #wpc-course-app .wpc-nav-list li:hover:not( .wpc-nav-list-header ),
420 .wpc-nav-list li:hover:not( .wpc-nav-list-header ) {
421 background-color: var(--gray1) !important;
422 }
423
424 .wpc-nav-list .wpc-nav-item-highlight {
425 background-color: white !important;
426 }
427
428 .wpc-nav-list .wpc-nav-item-success {
429 background-color: white !important;
430 }
431
432 .wpc-nav-list-header {
433 cursor: pointer;
434 background-color: var(--gray2);
435 border-bottom: 1px solid #cecece;
436 margin-bottom: 0;
437 position: relative;
438 z-index: 1;
439 }
440
441 .wpc-nav-list-header:hover {
442 background-color: #aeaeae;
443 }
444
445 #wpc-course-app .wpc-active-nav-item:not(.ui-sortable-handle),
446 .wpc-active-nav-item:not(.ui-sortable-handle) {
447 z-index: 0 !important;
448 transition: 0.3s;
449 }
450
451 a.wpc-active-nav-item {
452 margin-left: 0 !important;
453 }
454
455 .wpc-nav-list li .fa-check {
456 color: #3adfa9;
457 }
458
459 .wpc-nav-list li .fa-play {
460 color: #009ee5;
461 }
462
463 .wpc-nav-list li button {
464 margin-left: 10px;
465 }
466
467 /********** ALERTS **********/
468
469 .wpc-error-message {
470 background-color: #f8d7da;
471 padding: 20px;
472 }
473
474 .wpc-success-message {
475 background-color: #d4edda;
476 padding: 20px;
477 }
478
479 .wpc-alert-message {
480 background-color: #f4f1c2;
481 padding: 20px;
482 }
483
484 /********** FORMS **********/
485
486 .wpc-form {
487 padding: 20px;
488 background: var(--gray1);
489 border-radius: 4px;
490 border: 1px solid #e6e6e6;
491 }
492
493 .wpc-form label {
494 font-weight: bold;
495 }
496
497 .wpc-form p {
498 margin: 0;
499 }
500
501 .wpc-form-section {
502 padding: 20px 0;
503 background: var(--gray1);
504 border-bottom: 1px solid #e6e6e6;
505 margin: 0;
506 }
507
508 .wpc-form-item {
509 padding-bottom: 10px;
510 }
511
512 .wpc-form-item:last-of-type {
513 padding-bottom: 0;
514 }
515
516 .wpc-form-section:first-of-type {
517 padding-top: 0;
518 }
519
520 .wpc-form-section:last-of-type {
521 padding-bottom: 0;
522 border-bottom: 0;
523 }
524
525 .wpc-form input[type="text"],
526 .wpc-lightbox-content input[type="text"],
527 .wpc-lightbox-content input[type="password"] {
528 width: 100%;
529 max-width: 100% !important;
530 margin-top: 10px;
531 border: 1px solid #e6e6e6;
532 padding: 5px 10px;
533 }
534
535 .wpc-form input[type="checkbox"] {
536 border: 1px solid #e6e6e6;
537 }
538
539 .wpc-select {
540 cursor: pointer;
541 color: var(--gray4) !important;
542 background-color: white;
543 border-radius: 4px !important;
544 height: auto;
545 border: 1px solid var(--gray3) !important;
546 font-size: 16px;
547 vertical-align: initial !important;
548 padding: 6px 12px;
549 position: relative;
550 top: 1px;
551 }
552
553 .wpc-input {
554 border: 1px solid #e6e6e6 !important;
555 }
556
557 .wpc-input-fw {
558 width: 100%;
559 }
560
561 .wpc-form textarea, .wpc-textarea {
562 width: 100%;
563 min-height: 140px;
564 border: 1px solid #e6e6e6;
565 margin-top: 10px;
566 }
567
568 .wpc-form-text {
569 font-size: 18px;
570 }
571
572 .wpc-form-select {
573 border: 1px solid #e6e6e6 !important;
574 margin-top: 10px;
575 }
576
577 .wpc-form-range, .wpc-form-range-labels {
578 width: calc(100% - 140px);
579 overflow: hidden;
580 }
581
582 .wpc-form-range {
583 cursor: pointer;
584 }
585
586 .wpc-form-range-labels {
587 position: relative;
588 top: -15px;
589 }
590
591 .wpc-range-left {
592 float: left;
593 }
594
595 .wpc-range-right {
596 float: right;
597 }
598
599 .wpc-form-range-val {
600 width: 120px;
601 padding: 10px;
602 box-sizing: border-box;
603 display: inline-block;
604 background: #f4f1c2;
605 margin-left: 10px;
606 font-size: 16px;
607 position: relative;
608 top: -3px;
609 }
610
611 .wpc-flex-toolbar .wp-picker-container {
612 position: relative;
613 top: -5px;
614 }
615
616 .wpc-switch {
617 display: inline-block;
618 height: 34px;
619 position: relative;
620 width: 60px;
621 color: #4e4e4e;
622 }
623
624 .wpc-switch input {
625 display: none;
626 }
627
628 .wpc-switch+label {
629 cursor: default;
630 color: #4e4e4e;
631 }
632
633 .wpc-slider {
634 background-color: #ccc;
635 bottom: 0;
636 cursor: pointer;
637 left: 0;
638 position: absolute;
639 right: 0;
640 top: 0;
641 transition: 0.4s;
642 }
643
644 .wpc-slider:before {
645 background-color: #fff;
646 bottom: 4px;
647 content: "";
648 height: 26px;
649 left: 4px;
650 position: absolute;
651 transition: 0.4s;
652 width: 26px;
653 }
654
655 input:checked+.wpc-slider {
656 background-color: #24d19f;
657 }
658
659 input:checked+.wpc-slider:before {
660 transform: translateX(26px);
661 }
662
663 .wpc-slider.wpc-round {
664 border-radius: 34px;
665 }
666
667 .wpc-slider.wpc-round:before {
668 border-radius: 50%;
669 }
670
671
672
673 /********** LOADERS **********/
674
675 #wpc-full-screen-loader {
676 background-color: rgba(0, 0, 0, 0.7);
677 width: 100%;
678 height: 100%;
679 position: fixed;
680 top: 0;
681 left: 0;
682 z-index: 999999;
683 display: flex;
684 align-content: space-around;
685 align-items: center;
686 justify-content: flex-start;
687 }
688
689 #wpc-full-screen-loader>div {
690 width: 100%;
691 flex-basis: 100%;
692 text-align: center;
693 }
694
695 /********** TOOLBARS **********/
696
697 .wpc-flex-toolbar {
698 flex-grow: 0;
699 flex-shrink: 0;
700 flex-basis: 100%;
701 background-color: #fff;
702 padding: 20px;
703 overflow: hidden;
704 z-index: 1;
705 position: relative;
706 }
707
708 #wpc-right-toggle-sidebar {
709 background-color: var(--gray1);
710 border-left: 1px solid #e6e6e6;
711 box-shadow: -3px 3px 9px rgba(0, 0, 0, 0.2);
712 position: fixed;
713 background: white;
714 width: 320px;
715 height: 100%;
716 right: -320px;
717 top: 0;
718 z-index: 99999;
719 }
720
721 .wpc-toggle-sidebar-header {
722 background-color: var(--gray1);
723 border-bottom: 1px solid #e6e6e6;
724 padding: 20px;
725 position: relative;
726 z-index: 1;
727 }
728
729 .wpc-toggle-sidebar {
730 cursor: pointer;
731 }
732
733 .wpc-content-toolbar {
734 padding: 20px 0;
735 text-align: center;
736 }
737
738 .wpc-content-toolbar .wpc-btn {
739 margin-right: 10px;
740 }
741
742 #wpc-bottom-toggle-sidebar {
743 overflow-y: auto;
744 background-color: var(--gray1);
745 border-left: 1px solid #e6e6e6;
746 border-right: 1px solid #e6e6e6;
747 border-top: 1px solid #e6e6e6;
748 box-shadow: -3px 3px 9px rgba(0, 0, 0, 0.2);
749 position: fixed;
750 background: white;
751 width: 100%;
752 height: 80%;
753 bottom: -80%;
754 left: 0;
755 z-index: 9999;
756 }
757
758 .wpc-bottom-toggle-sidebar-header {
759 padding: 20px;
760 font-weight: bold;
761 background-color: var(--gray2);
762 border-bottom: var(--gray3);
763 font-size: 18px;
764 }
765
766 #wpc-toolbar-bottom {
767 background-color: transparent;
768 }
769
770 .wpc-toolbar-buttons {
771 float: right;
772 }
773
774 .wpc-bottom-toggle-sidebar-header {
775 cursor: pointer;
776 }
777 .wpc-ajax-filters-wrapper {
778 flex-basis: 33.33%;
779 margin: 0;
780 }
781 .wpc-ajax-search-wrapper {
782 flex-basis: 66.66%;
783 margin: 0;
784 }
785
786 #wpc-toolbar-top {
787 border: 1px solid #e8e6e6;
788 z-index: 1;
789 position: relative;
790 }
791
792 #wpc-toolbar-bottom {
793 border: 0;
794 }
795
796 /********** TABLES **********/
797
798 .wpc-table {
799 margin-top: 0;
800 border-collapse: collapse;
801 width: 100%;
802 background-color: #fff;
803 margin-bottom: 0;
804 border-top: 1px solid #e6e6e6;
805 border-right: 1px solid #e6e6e6;
806 border-left: 1px solid #e6e6e6;
807 }
808
809 .wpc-table ul,
810 .wpc-table ol {
811 list-style: none;
812 margin: 0;
813 padding: 0;
814 }
815
816 .wpc-table tr:nth-child(even) {
817 background-color: var(--gray1);
818 }
819
820 .wpc-table th {
821 background-color: var(--gray1);
822 padding: 10px;
823 }
824
825 .wpc-table td,
826 .wpc-table th {
827 padding: 10px;
828 border-bottom: 1px solid #e6e6e6;
829 border-left: 0;
830 border-right: 0;
831 border-top: 0;
832 }
833
834 .wpc-table th {
835 text-align: left;
836 }
837
838 /********** VIDEO AND IMAGES **********/
839
840 .wpc-img-wrapper {
841 max-height: 460px;
842 overflow: hidden;
843 }
844
845 .wpc-img-wrapper, .wpc-vid-wrapper {
846 margin: -20px -20px 0 -20px;
847 width: calc(100% + 40px);
848 height: auto;
849 }
850
851 .wpc-single-course-vid-wrapper {
852 margin: 0;
853 width: 100%;
854 }
855
856 .wpc-img-wrapper img {
857 width: 100%;
858 }
859
860 .wpc-video-wrapper {
861 margin-bottom: 20px;
862 }
863
864 /********** COMPONENTS **********/
865
866 .wpc-pagination {
867 padding: 20px;
868 width: 100%;
869 text-align: right;
870 }
871
872 .wpc-ajax-course-sort-wrapper {
873 float: right;
874 }
875
876 .wpc-ajax-tool input[type="text"] {
877 border: 0;
878 padding: 10px 20px;
879 font-family: 'helvetica';
880 }
881
882 .wpc-ajax-tool #wpc-course-ajax-search, #wpc-course-search {
883 border-radius: 40px;
884 color: var(--gray4);
885 width: 100%;
886 padding: 7px 14px;
887 border: 1px solid var(--gray3) !important;
888 max-width: 767px;
889 font-size: 16px;
890 }
891
892 .wpc-center {
893 text-align: center;
894 }
895
896 .wpc-hide {
897 display: none;
898 }
899
900 .wpc-sorting-block {
901 width: 100%;
902 padding: 20px;
903 background-color: rgba(58, 223, 169, 0.3);
904 }
905
906 /********** PROGRESS BARS **********/
907
908 .wpc-progress-wrapper {
909 width: 100%;
910 background-color: #cccccc;
911 border-radius: 50px;
912 overflow: hidden;
913 }
914
915 .wpc-progress-inner {
916 background-color: #4f646d;
917 }
918
919 .wpc-progress-text {
920 color: #fff;
921 font-size: 16px;
922 margin-left: 10px;
923 white-space: nowrap;
924 }
925
926 .wpc-material-meta-item .wpc-progress-wrapper {
927 margin-top: -10px;
928 }
929
930 .wpc-material-meta-item .wpc-progress-wrapper:last-of-type {
931 margin-bottom: 10px;
932 }
933
934 /********** PROFILE **********/
935
936 #wpc-profile-nav {
937 margin-bottom: 20px;
938 }
939
940 .wpc-profile-option .wpc-option {
941 float: right;
942 }
943
944 /********** BUTTONS **********/
945
946 .wpc-btn-nav {
947 margin-bottom: 20px;
948 }
949
950 .wpc-btn,
951 .wpc-button,
952 .wpc-material-content .pmpro_content_message a,
953 .wpc-lightbox-content input[type="submit"] {
954 height: auto;
955 font-size: 14px;
956 background: transparent;
957 display: inline-block;
958 line-height: 14px;
959 font-family: "helvetica";
960 display: inline-block;
961 cursor: pointer;
962 padding: 8px 12px;
963 border-radius: 4px;
964 text-decoration: none !important;
965 transition: 0.5s;
966 -webkit-transition: 0.5s;
967 -moz-transition: 0.5s;
968 }
969
970 .wpc-btn:hover,
971 .wpc-button:hover,
972 .wpc-material-content .pmpro_content_message a:hover {
973 transition: 0.5s;
974 -webkit-transition: 0.5s;
975 -moz-transition: 0.5s;
976 }
977
978 .wpc-btn-icon i {
979 margin: 0 !important;
980 }
981
982 .wpc-mobile-btn {
983 display: none;
984 }
985
986 .wpc-btn-pagination,
987 .wpc-course-archive-pagination a {
988 margin-top: 10px;
989 margin-top: 10px;
990 border: 1px solid var(--gray3);
991 color: var(--gray4);
992 margin-left: 5px;
993 background-color: #fff;
994 line-height: 14px;
995 font-size: 14px;
996 box-shadow: none !important;
997 display: inline;
998 }
999
1000 .wpc-course-archive-pagination {
1001 text-align: right;
1002 }
1003
1004 .wpc-btn-pagination:hover,
1005 .wpc-course-archive-pagination a:hover {
1006 background-color: var(--gray4);
1007 color: #fff;
1008 border: 1px solid var(--gray4) !important;
1009 }
1010
1011 .wpc-course-archive-pagination a,
1012 .wpc-course-archive-pagination span {
1013 padding: 6px;
1014 display: inline-block;
1015 border-radius: 4px;
1016 text-align: right;
1017 }
1018
1019 .wpc-btn-pagination.wpc-active-nav-item {
1020 color: #333333;
1021 }
1022
1023 .wpc-button-soft {
1024 background-color: #fff;
1025 border: 3px solid #e6e6e6;
1026 }
1027
1028 .wpc-btn-sm {
1029 font-size: 14px;
1030 padding: 6px;
1031 line-height: 14px !important;
1032 line-height: 0;
1033 height: auto;
1034 transition: 0.5s;
1035 -webkit-transition: 0.5s;
1036 -moz-transition: 0.5s;
1037 }
1038
1039 .wpc-btn-circle {
1040 padding: 7px;
1041 border-radius: 50px;
1042 }
1043
1044 .wpc-btn-favorite {
1045 background-color: #48c3d7;
1046 transition: 0.5s;
1047 -webkit-transition: 0.5s;
1048 -moz-transition: 0.5s;
1049 }
1050
1051 .wpc-btn-favorite:hover {
1052 color: red;
1053 background-color: transparent;
1054 transition: 0.5s;
1055 -webkit-transition: 0.5s;
1056 -moz-transition: 0.5s;
1057 }
1058
1059 .wpc-btn-round {
1060 border-radius: 50px;
1061 }
1062
1063 .wpc-question-btn {
1064 background-color: var(--gray3);
1065 border: 0 !important;
1066 border-radius: 100%;
1067 padding: 5px 9px !important;
1068 font-size: 10px;
1069 color: white;
1070 }
1071
1072 .wpc-question-btn:hover {
1073 border: 3px solid #919191;
1074 background-color: #919191;
1075 color: #fff;
1076 }
1077
1078 .postbox .wpc-question-btn, .column-restriction .wpc-question-btn {
1079 margin-left: 0;
1080 margin-right: 10px;
1081 }
1082
1083 .wpc-btn-input-action {
1084 padding: 10px;
1085 margin: 0 10px;
1086 }
1087
1088 .wpc-mark-completed {
1089 color: var(--green) !important;
1090 border: 2px solid var(--green) !important;
1091 }
1092
1093 .wpc-mark-completed:hover {
1094 border-color: var(--gray2) !important;
1095 background-color: var(--gray2) !important;
1096 }
1097
1098 .wpc-btn-soft {
1099 border: 2px solid var(--gray3);
1100 color: var(--gray4);
1101 }
1102
1103 .wpc-btn-soft button:hover {
1104 color: var(--blue);
1105 background-color: var(--gray1);
1106 border-color: var(--gray1);
1107 }
1108
1109 .wpc-btn-soft:focus {
1110 background: #fff;
1111 border: 2px solid #fff;
1112 color: #434446;
1113 }
1114
1115 .wpc-btn-text {
1116 border: 3px solid transparent !important;
1117 color :var(--blue);
1118 background-color: transparent;
1119 }
1120
1121 .wpc-crumb-link, .wpc-ajax-link {
1122 cursor: pointer;
1123 }
1124
1125 .wpc-crumb-link:hover {
1126 cursor: pointer;
1127 }
1128
1129 @media screen and (max-width: 600px) {
1130 .wpc-btn {
1131 padding: 6px 8px;
1132 font-size: 12px;
1133 }
1134 }
1135
1136 /********** ICONS **********/
1137
1138 .wpc-grab {
1139 cursor: grab;
1140 padding: 15px;
1141 margin: -15px 0 -15px -15px;
1142 }
1143
1144 /********** CARDS **********/
1145
1146 .wpc-material,
1147 .wpc-option-row /* Legacy */ {
1148 background-color: #fff;
1149 padding: 20px;
1150 overflow: hidden;
1151 box-shadow: 3px 3px 9px rgba(0,0,0,0.2);
1152 border-radius: 4px;
1153 }
1154
1155 .wpc-material-tools {
1156 overflow: hidden;
1157 margin-bottom: 10px;
1158 margin-top: 10px;
1159 }
1160
1161 .wpc-material-item {
1162 padding: 2% 0 0;
1163 border-bottom: 1px solid #e6e6e6;
1164 }
1165
1166 .wpc-material-item:first-of-type {
1167 padding-top: 0;
1168 }
1169
1170 .wpc-material-item:last-of-type {
1171 border-bottom: 0;
1172 }
1173
1174 .wpc-material-content {
1175 padding: 40px !important;
1176 box-shadow: none;
1177 border-radius: 0;
1178 }
1179
1180 .wpc-material-meta {
1181 font-family: "helvetica";
1182 color: #5e5d5d;
1183 border-top: 1px solid #e6e6e6;
1184 margin: 20px -20px -20px -20px;
1185 background: var(--gray1);
1186 padding: 20px 10px;
1187 }
1188
1189 .wpc-material-meta-item {
1190 margin: 0;
1191 padding: 10px;
1192 }
1193
1194 .wpc-material-meta-item-lg {
1195 border-right: 1px solid var(--gray2);
1196 }
1197
1198 .wpc-material-meta-item-lg:last-of-type {
1199 border: 0;
1200 }
1201
1202 @media screen and (max-width: 400px) {
1203 .wpc-material-meta-item-lg {
1204 border: 0;
1205 }
1206 }
1207
1208 .wpc-material-meta-item-lg .wpc-material-meta-icon {
1209 font-size: 46px;
1210 }
1211
1212 .wpc-meta-container-lg {
1213 margin: 60px 0 40px;
1214 }
1215
1216 .wpc-meta-key {
1217 font-weight: bold;
1218 font-size: 14px;
1219 }
1220
1221 .wpc-meta-value {
1222 font-size: 14px;
1223 }
1224
1225 .wpc-material-heading {
1226 font-family: "helvetica";
1227 color: #606060;
1228 font-size: 18px;
1229 padding: 10px 20px;
1230 margin: -20px -20px 20px -20px;
1231 border-bottom: 1px solid #e6e6e6;
1232 }
1233
1234 .wpc-material-text {
1235 font-size: 14px;
1236 font-family: "helvetica";
1237 color: #8e8e8e;
1238 margin-bottom: 20px !important;
1239 }
1240
1241 .wpc-material-meta-icon {
1242 border-radius: 100%;
1243 font-size: 22px;
1244 }
1245
1246 .wpc-meta-lg {
1247 font-size: 32px;
1248 }
1249
1250 /********** HORIZONTAL MENUS **********/
1251
1252 #wpc-admin-main-menu {
1253 margin: 0px 0 20px -20px;
1254 }
1255
1256 .wpc-nav-menu {
1257 margin-right: 20px;
1258 }
1259
1260 .wpc-menu-item,
1261 .wpc-admin-menu-item {
1262 display: inline-block;
1263 margin-bottom: 0;
1264 padding: 0 5px;
1265 margin-top: 5px;
1266 }
1267
1268 #wpc-logo-sm-wrapper {
1269 padding: 13px;
1270 display: inline-block;
1271 }
1272
1273 .wpc-menu-item>span,
1274 .wpc-menu-item>span {
1275 cursor: pointer;
1276 padding-bottom: 13px !important;
1277 }
1278
1279 .wpc-menu-item a, .wpc-menu-item>span,
1280 .wpc-menu-item a, .wpc-menu-item>span {
1281 display: block;
1282 font-size: 16px;
1283 padding: 15px;
1284 text-decoration: none;
1285 color: #434446;
1286 }
1287
1288 .wpc-submenu-toggle {
1289 margin-bottom: -2px;
1290 }
1291
1292 .wpc-menu-item:not(:first-child),
1293 .wpc-menu-item:not(:first-child) {
1294 margin-left: -4px;
1295 }
1296
1297 .wpc-menu-item:hover>span, .wpc-menu-item:hover>a,
1298 .wpc-menu-item:hover>span, .wpc-menu-item:hover>a {
1299 color: #696b6f;
1300 }
1301
1302 .wpc-main-wrapper {
1303 margin-right: 20px;
1304 }
1305
1306 .wpc-menu-wrapper {
1307 padding: 0 2%;
1308 background-color: #fff;
1309 overflow: hidden;
1310 box-shadow: 3px 3px 15px rgb(0 0 0 / 20%);
1311 }
1312
1313 .wpc-alt-menu {
1314 margin: 0;
1315 overflow: hidden;
1316 float: right;
1317 }
1318
1319 .wpc-alt-menu-separator {
1320 border-left: 1px solid #434446 !important;
1321 }
1322
1323 .wpc-menu-item:last-child {
1324 border-right: 1px solid #434446 !important;
1325 }
1326
1327 .wpc-premium-upgrade {
1328 position: relative;
1329 bottom: 7px;
1330 left: 10px;
1331 }
1332
1333 .wpc-premium-upgrade:active,
1334 .wpc-premium-upgrade:focus {
1335 color: white;
1336 }
1337
1338 .wpc-submenu {
1339 position: absolute;
1340 z-index: 9999;
1341 background: #fff;
1342 box-shadow: 3px 5px 10px rgb(0 0 0 / 10%);
1343 border-bottom-right-radius: 4px;
1344 border-bottom-left-radius: 4px;
1345 margin-top: 5px;
1346 margin-left: -5px;
1347 }
1348
1349 .wpc-submenu li:hover a {
1350 color: #696b6f;
1351 }
1352
1353 .wpc-submenu li a {
1354 color: #434446;
1355 }
1356
1357 .wpc-submenu li {
1358 margin-bottom: 0;
1359 }
1360
1361 .wpc-submenu li:last-of-type {
1362 border: 0;
1363 }
1364
1365 .wpc-menu-item-active {
1366 background-color: #434446 !important;
1367 }
1368
1369 .wpc-menu-item-active>a, .wpc-menu-item-active>span {
1370 color: #fff !important;
1371 }
1372
1373 /********** OPTIONS **********/
1374
1375 .wpc-single-option-header {
1376 margin-top: 0;
1377 }
1378
1379 /********** QUIZZES **********/
1380
1381 #wpc-fe-quiz-container .wpc-load-profile {
1382 display: none;
1383 }
1384
1385 .wpc-answer {
1386 min-width: 50%;
1387 max-width: 70%;
1388 }
1389
1390 .wpc-correct-i,
1391 .wpc-incorrect-i {
1392 font-size: 32px;
1393 }
1394
1395
1396 .wpc-correct-i {
1397 color: #3adfa9;
1398 }
1399
1400 .wpc-incorrect-i {
1401 color: #cc545f;
1402 }
1403
1404 .wpc-quiz-question-img {
1405 max-width: 240px;
1406 border: 5px solid #e6e6e6;
1407 border-radius: 4px;
1408 }
1409
1410 .wpc-quiz-meta {
1411 margin-top: 10px;
1412 padding: 10px 0;
1413 border-top: 1px solid #e6e6e6;
1414 overflow: hidden;
1415 }
1416
1417 .wpcq-nav-top {
1418 margin-bottom: 20px;
1419 }
1420
1421 .wpcq-nav-bottom {
1422 margin-top: 20px;
1423 }
1424
1425 .wpcq-nav-prev {
1426 margin-right: 10px;
1427 }
1428
1429 .wpc-single-answer label {
1430 padding-left: 10px;
1431 }
1432
1433 .wpc-single-answer input, .wpc-single-answer label {
1434 cursor: pointer;
1435 }
1436
1437 .wpc-fe-quiz-question h3 {
1438 margin-top: 0;
1439 font-weight: 700;
1440 font-size: 16px;
1441 }
1442
1443 .wpc-fe-quiz-question {
1444 margin-bottom: 20px;
1445 }
1446
1447 .wpc-fe-quiz-question img {
1448 max-width: 100%;
1449 }
1450
1451 .wpc-quiz-question-list {
1452 margin: 0 0 20px 0 !important;
1453 padding: 0 !important;
1454 list-style: none !important;
1455 border-right: 1px solid #e6e6e6;
1456 }
1457
1458 .wpc-quiz-question-list>li>i {
1459 margin-right: 10px;
1460 }
1461
1462 #wpc-fe-quiz-container .wpc-progress-wrapper {
1463 margin-bottom: 20px;
1464 }
1465
1466 .wpcq-submit-quiz {
1467 float: right;
1468 }
1469
1470 .wpc-fe-quiz-question-wrapper {
1471 margin-top: 20px;
1472 }
1473
1474 /********** REQUIREMENTS **********/
1475
1476 .wpc-requirement {
1477 border-bottom: 1px solid #e6e6e6;
1478 padding-top: 20px;
1479 }
1480
1481 .wpc-requirement:first-of-type {
1482 padding-top: 0;
1483 }
1484
1485 .wpc-requirement:last-of-type {
1486 border-bottom: 0;
1487 padding-bottom: 0;
1488 }
1489
1490 .wpc-requirement-courses-select {
1491 max-width: 240px !important;
1492 }
1493
1494 /********** BADGES **********/
1495
1496 .wpc-save-badge-design {
1497 position: relative;
1498 top: 3px;
1499 }
1500
1501 .wpc-badge-rules-list {
1502 margin: 0;
1503 padding: 0;
1504 list-style: none;
1505 border: 1px solid var(--gray3);
1506 }
1507
1508 .wpc-badge-rules-list li {
1509 padding: 15px;
1510 border-bottom: 1px solid var(--gray3);
1511 }
1512
1513 .wpc-badge-rules-list li:last-of-type {
1514 border-bottom: 0;
1515 }
1516
1517 .wpc-badge-rules-list .wpc-rule-true {
1518 background-color: var(--lgreen);
1519 }
1520
1521 .wpc-badge-rules-list .wpc-rule-false {
1522 background-color: var(--lred);
1523 }
1524
1525 #wpc-badge-editor-container {
1526 width: 100%;
1527 padding: 180px 0;
1528 }
1529
1530 .wpc-badge-title {
1531 color: #444;
1532 font-size: 14px !important;
1533 margin: 10px 0 0;
1534 text-align: center;
1535 line-height: initial;
1536 }
1537
1538 .wpc-badge-container {
1539 position: relative;
1540 top: 0;
1541 cursor: pointer;
1542 background-color: #fff;
1543 border: 1px solid #e6e6e6;
1544 box-shadow: 3px 3px 10px #e6e6e6;
1545 padding: 20px;
1546 border-radius: 60px;
1547 max-width: 80px;
1548 box-sizing: content-box;
1549 }
1550
1551 .wpc-badge-wrapper {
1552 display: block;
1553 margin: 0 auto;
1554 width: 120px;
1555 vertical-align: top;
1556 }
1557
1558 .wpc-badge {
1559 border: 1px solid white; /* fixes border lines showing for wiggle animation */
1560 -webkit-mask-size: cover;
1561 mask-size: cover;
1562 mask-position: center;
1563 -webkit-mask-position: center;
1564 }
1565
1566 .wpc-badge i {
1567 font-size: 40px;
1568 }
1569
1570 .wpc-badge span {
1571 text-align: center;
1572 height: 80px;
1573 width: 80px;
1574 vertical-align: middle;
1575 display: table-cell;
1576 }
1577
1578 .wpc-no-badge {
1579 opacity: 0.3;
1580 }
1581
1582 .wpc-circle {
1583 -webkit-mask-image: url("../../wp-courses-premium/svg/circle.svg");
1584 mask-image: url("../../wp-courses-premium/svg/circle.svg");
1585 }
1586
1587 .wpc-circle-outline {
1588 -webkit-mask-image: url("../../wp-courses-premium/svg/circle-outline.svg");
1589 mask-image: url("../../wp-courses-premium/svg/circle-outline.svg");
1590 }
1591
1592 .wpc-award {
1593 -webkit-mask-image: url("../../wp-courses-premium/svg/award.svg");
1594 mask-image: url("../../wp-courses-premium/svg/award.svg");
1595 }
1596
1597 .wpc-heart {
1598 -webkit-mask-image: url("../../wp-courses-premium/svg/heart.svg");
1599 mask-image: url("../../wp-courses-premium/svg/heart.svg");
1600 }
1601
1602 .wpc-pentagon {
1603 -webkit-mask-image: url("../../wp-courses-premium/svg/pentagon.svg");
1604 mask-image: url("../../wp-courses-premium/svg/pentagon.svg");
1605 }
1606
1607 .wpc-wave {
1608 -webkit-mask-image: url("../../wp-courses-premium/svg/wave.svg");
1609 mask-image: url("../../wp-courses-premium/svg/wave.svg");
1610 }
1611
1612 .wpc-24-badge {
1613 -webkit-mask-image: url("../../wp-courses-premium/svg/24-point-badge.svg");
1614 mask-image: url("../../wp-courses-premium/svg/wave.svg");
1615 }
1616
1617 .wpc-24-ribbon {
1618 -webkit-mask-image: url("../../wp-courses-premium/svg/24-point-ribbon.svg");
1619 mask-image: url("../../wp-courses-premium/svg/wave.svg");
1620 }
1621
1622 .wpc-24-ribbon i {
1623 position: relative;
1624 top: -7px;
1625 }
1626
1627 .wpc-sun {
1628 -webkit-mask-image: url("../../wp-courses-premium/svg/sun.svg");
1629 mask-image: url("../../wp-courses-premium/svg/wave.svg");
1630 }
1631
1632 .non-semantic-protector {
1633 position: relative;
1634 z-index: 1;
1635 }
1636
1637 .wpc-sorting-block {
1638 height: 20px;
1639 width: 100%;
1640 background: #e6e6e6;
1641 }
1642
1643 .wpc-ribbon {
1644 font-size: 16px !important;
1645 width: 180px;
1646 position: relative;
1647 background: #ba89b6;
1648 color: #fff;
1649 text-align: center;
1650 padding: 10px 10px !important;
1651 margin: -25px auto 40px auto !important;
1652 }
1653
1654 .wpc-ribbon:before, .wpc-ribbon:after {
1655 content: "";
1656 position: absolute;
1657 display: block;
1658 bottom: -1em;
1659 border: 1.5em solid #986794;
1660 z-index: -1;
1661 }
1662
1663 .wpc-ribbon:before {
1664 left: -2em;
1665 border-right-width: 1.5em;
1666 border-left-color: transparent;
1667 }
1668
1669 .wpc-ribbon:after {
1670 right: -2em;
1671 border-left-width: 1.5em;
1672 border-right-color: transparent;
1673 }
1674
1675 .wpc-ribbon .wpc-ribbon-content:before, .wpc-ribbon .wpc-ribbon-content:after {
1676 content: "";
1677 position: absolute;
1678 display: block;
1679 border-style: solid;
1680 border-color: #804f7c transparent transparent transparent;
1681 bottom: -1em;
1682 }
1683
1684 .wpc-ribbon .wpc-ribbon-content:before {
1685 left: 0;
1686 border-width: 1em 0 0 1em;
1687 }
1688
1689 .wpc-ribbon .wpc-ribbon-content:after {
1690 right: 0;
1691 border-width: 1em 1em 0 0;
1692 }
1693
1694 /********** SPECIFICS **********/
1695
1696 .wpc-single-course-archive .wpc-btn {
1697 margin-right: 10px;
1698 }
1699
1700 #wpc-results-empty {
1701 text-align: center;
1702 padding: 30%;
1703 }
1704
1705 #wpc-ajax-save {
1706 line-height: 1em;
1707 display: inline-block;
1708 position: fixed;
1709 bottom: 20px;
1710 right: 20px;
1711 padding: 10px;
1712 background: #12ad80;
1713 color: #fff;
1714 border-radius: 4px;
1715 box-shadow: 0px 5px 9px rgba(0, 0, 0, 0.2);
1716 z-index: 999;
1717 }
1718
1719 #wpc-lesson-restriction-container {
1720 overflow: hidden;
1721 }
1722
1723 #wpc-lesson-restriction-overlay {
1724 padding: 20px;
1725 position: absolute;
1726 height: 100%;
1727 background: rgba(200, 17, 17, 0.8);
1728 margin: -6px -12px 0;
1729 color: white;
1730 font-size: 16px;
1731 z-index: 1;
1732 text-shadow: 1px 1px 1px black;
1733 }
1734
1735 .select2-container--default .select2-selection--multiple .select2-selection__choice {
1736 padding-left: 20px !important;
1737 }
1738
1739 .select2-container .select2-search--inline {
1740 float: none !important;
1741 }
1742
1743 .column-course .select2-container {
1744 max-width: 100%;
1745 }
1746
1747 /********** BUILDER **********/
1748
1749 .wpc-element-settings-icons {
1750 position: absolute;
1751 top: 0;
1752 right: 0;
1753 display: none;
1754 }
1755
1756 .wpc-element-settings-icons i {
1757 background-color: #4a4a4a;
1758 color: #fff;
1759 padding: 10px;
1760 }
1761
1762 .wpc-element-settings-icons i:hover {
1763 background-color: #5f5f5f;
1764 }
1765
1766 .wpc-element-settings-icons i:first-of-type {
1767 border-bottom-left-radius: 4px;
1768 }
1769
1770 .wpc-row-settings-icons,
1771 .wpc-container-settings-icons {
1772 position: absolute;
1773 top: 0;
1774 left: 0;
1775 display: none;
1776 z-index: 2;
1777 }
1778
1779 .wpc-row-settings-icons i {
1780 background-color: #12c795;
1781 color: #fff;
1782 padding: 10px;
1783 }
1784
1785 .wpc-row-settings-icons i:hover {
1786 background-color: #1ad6a2;
1787 }
1788
1789 .wpc-row-settings-icons:last-of-type {
1790 border-bottom-right-radius: 4px;
1791 }
1792
1793 .wpc-settings-icons .fa-arrows {
1794 cursor: move;
1795 }
1796
1797 .wpc-container-settings-icons i {
1798 background-color: #e21772;
1799 color: #fff;
1800 padding: 10px;
1801 }
1802
1803 .wpc-container-settings-icons i:hover {
1804 background-color: #fb308b;
1805 }
1806
1807 .wpc-container-settings-icons i:last-of-type {
1808 border-bottom-right-radius: 4px;
1809 }
1810
1811 .wpc-row-empty-icon, .wpc-element-empty-icon {
1812 text-align: center;
1813 }
1814
1815 .wpc-row-empty-icon i {
1816 border-radius: 100%;
1817 color: #fff;
1818 background-color: #12c795;
1819 padding: 20px;
1820 }
1821
1822 .wpc-element-empty-icon i {
1823 border-radius: 100%;
1824 color: #fff;
1825 background-color: #4a4a4a;
1826 padding: 20px;
1827 }
1828
1829 .wpc-element-empty-icon i:hover {
1830 background-color: #5f5f5f;
1831 }
1832
1833 .wpc-row-empty-icon i:hover {
1834 background-color: #1ad6a2;
1835 }
1836
1837 .wpc-builder-container:hover {
1838 outline: 3px solid #e21772;
1839 }
1840
1841 .wpc-builder-row:hover,
1842 .wpc-builder-grabbed-row {
1843 outline: 3px solid #12c795;
1844 }
1845
1846 .wpc-builder-selectable {
1847 cursor: pointer;
1848 position: relative;
1849 overflow: hidden;
1850 }
1851
1852 .wpc-builder-element:hover,
1853 .wpc-builder-grabbed-element {
1854 outline: 3px solid #4a4a4a;
1855 }
1856
1857 .wpc-builder-element:hover .wpc-element-settings-icons,
1858 .wpc-builder-row:hover .wpc-row-settings-icons,
1859 .wpc-builder-container:hover .wpc-container-settings-icons {
1860 display: block;
1861 font-size: 18px;
1862 }
1863
1864 .wpc-element-type-toolbar {
1865 display: none;
1866 top: 0;
1867 left: 0;
1868 }
1869
1870 .wpc-element-type-toolbar:before {
1871 width: 0;
1872 height: 0;
1873 border-left: 5px solid transparent;
1874 border-right: 5px solid transparent;
1875 border-bottom: 5px solid #5b296a;
1876 }
1877
1878 .wpc-element-type-toolbar-content {
1879 padding: 20px;
1880 overflow: hidden;
1881 }
1882
1883 .wpc-element-type-header {
1884 background-color: #5b296a;
1885 padding: 20px 10px;
1886 color: #fff;
1887 font-size: 18px;
1888 margin: 0;
1889 }
1890
1891 .wpc-element-type-header .fa-times {
1892 cursor: pointer;
1893 }
1894
1895 .wpc-add-element {
1896 width: 100%;
1897 box-sizing: border-box;
1898 padding: 20px 10px;
1899 background: white;
1900 border: 0;
1901 border-radius: 4px;
1902 cursor: pointer;
1903 color: #636363;
1904 }
1905
1906 .wpc-builder-button-select,
1907 .wpc-builder-button-toggle {
1908 background-color: #e8e6e6;
1909 color: #636363;
1910 border: 0;
1911 padding: 8px 11px;
1912 border-radius: 4px;
1913 cursor: pointer;
1914 }
1915
1916 .wpc-add-element:hover,
1917 .wpc-builder-button-select:hover,
1918 .wpc-builder-button-toggle:hover {
1919 background-color: #e8e6e6;
1920 }
1921
1922 .wpc-builder-selected-button {
1923 background-color: #e21772 !important;
1924 color: #fff;
1925 }
1926
1927 .wpc-floating-toolbar,
1928 .wpc-element-type-toolbar {
1929 width: 480px;
1930 background: var(--gray1);
1931 position: absolute;
1932 border-radius: 4px;
1933 overflow: hidden;
1934 z-index: 9999;
1935 box-shadow: rgb(0 0 0 / 20%) 3px 3px 15px;
1936 }
1937
1938 .wpc-tools-tab {
1939 background-color: #e21772;
1940 color: #fff;
1941 font-size: 14px;
1942 cursor: pointer;
1943 margin: 0;
1944 width: 50%;
1945 display: inline-block;
1946 box-sizing: border-box;
1947 -moz-box-sizing: border-box;
1948 -webkit-box-sizing: border-box;
1949 float: left;
1950 text-align: center;
1951 padding: 10px;
1952 }
1953
1954 .wpc-tools-tab-active {
1955 background-color: #ff308d;
1956 }
1957
1958 .wpc-toolbar-textarea {
1959 width: 100%;
1960 min-height: 240px;
1961 width: calc(100% - 1px);
1962 background-color: var(--gray1);
1963 border: 0;
1964 padding: 10px;
1965 }
1966
1967 .wpc-tools-tabs {
1968 margin: 0;
1969 overflow: hidden;
1970 }
1971
1972 .wpc-builder-img {
1973 display: inline;
1974 max-width: 100%;
1975 }
1976
1977 .wpc-option-tabs {
1978 overflow: hidden;
1979 margin: 0 0 10px 0;
1980 }
1981
1982 .wpc-option-tabs li {
1983 width: 25%;
1984 box-sizing: border-box;
1985 float: left;
1986 list-style: none;
1987 text-align: center;
1988 padding: 5px;
1989 border: 1px solid lightgray;
1990 margin-left: -1px;
1991 cursor: pointer;
1992 font-size: 14px;
1993 }
1994
1995 .wpc-option-tabs li:first-of-type {
1996 margin-left: 0;
1997 }
1998
1999 .wpc-option-tabs li:hover, .wpc-option-tab-active {
2000 background-color: var(--gray1);
2001 }
2002
2003 .wpc-accordion-option-header {
2004 background: #434446;
2005 padding: 20px 10px;
2006 cursor: pointer;
2007 color: #fff !important;
2008 font-size: 18px !important;
2009 margin: 0 !important;
2010 }
2011
2012 .wpc-accordion-option-content input[type="text"],
2013 .wpc-accordion-option-content input[type="number"],
2014 .wpc-option-row input /* Legacy */ {
2015 background-color: #e6e6e6;
2016 padding: 5px;
2017 border: 0;
2018 width: 100%;
2019 }
2020
2021 .wpc-builder-range {
2022 width: calc(100% - 104px);
2023 }
2024
2025 .wpc-builder-range-input {
2026 max-width: 96px !important;
2027 }
2028
2029 .tool-toggle {
2030 display: inline-block;
2031 }
2032
2033 .tool-toggle i {
2034 padding: 5px;
2035 margin: 0 10px 10px 0;
2036 background: #23d19f;
2037 border: 1px solid #12ad80;
2038 border-radius: 4px;
2039 color: #fff;
2040 }
2041
2042 .tool-toggle i:hover {
2043 cursor: pointer;
2044 }
2045
2046 .tools-container {
2047 margin-top: 10px;
2048 margin-bottom: 20px;
2049 }
2050
2051 .toolbar-content {
2052 margin: 10px 0;
2053 display: none;
2054 max-height: 184px;
2055 overflow-y: scroll;
2056 }
2057
2058 .wpc-toolbar-close,
2059 .wpc-toolbar-save {
2060 width: 50%;
2061 float: left;
2062 padding: 10px;
2063 font-size: 14px;
2064 border: 0;
2065 color: #fff;
2066 cursor: pointer;
2067 }
2068
2069 .wpc-toolbar-close {
2070 background-color: rgb(222, 60, 98);
2071 }
2072
2073 .wpc-toolbar-save {
2074 background-color: #12c795;
2075 }
2076
2077 .wpc-toolbar-save:hover {
2078 background: rgb(24 224 169);
2079 }
2080
2081 .wpc-toolbar-close:hover {
2082 background-color: rgb(255 68 112);
2083 }
2084
2085 .wpc-accordion-option-content label {
2086 font-weight: 700;
2087 font-size: 14px;
2088 display: inline-block;
2089 }
2090
2091 .wpcb-center-label {
2092 text-align: left !important;
2093 padding-left: 5px;
2094 margin: 0 auto;
2095 display: block !important;
2096 font-weight: 400 !important;
2097 line-height: 14px;
2098 }
2099
2100 .wpc-accordion-option-content select {
2101 width: calc(100% - 2px);
2102 background-color: var(--gray1);
2103 border: 0;
2104 padding: 10px;
2105 }
2106
2107 .wpc-toolbar-section .iris-picker {
2108 position: absolute;
2109 z-index: 2;
2110 }
2111
2112 .wpc-toolbar-section {
2113 float: left;
2114 clear: right;
2115 padding: 5px 10px;
2116 border-right: 1px solid #e6e6e6;
2117 }
2118
2119 .wpc-accordion-option-content {
2120 padding: 10px;
2121 background-color: #fff;
2122 }
2123
2124 .wpc-accordion-single-option {
2125 border-bottom: 1px solid var(--gray1);
2126 padding-bottom: 10px;
2127 padding-top: 10px;
2128 overflow: hidden;
2129 }
2130
2131 .wpc-accordion-single-option:first-of-type {
2132 padding-top: 0;
2133 }
2134
2135 .wpc-accordion-single-option:last-of-type {
2136 padding-bottom: 0;
2137 border: 0;
2138 }
2139
2140 .wpc-accordion-single-option,
2141 .wpc-accordion-single-option input,
2142 .wpc-option-row input /* Legacy */ {
2143 color: #636363;
2144 }
2145
2146 .wpc-accordion-single-option .wpc-tools-tab {
2147 margin-bottom: 10px;
2148 border: 1px solid lightgray;
2149 color: #636363;
2150 background-color: #fff;
2151 }
2152
2153 .wpc-accordion-single-option .wpc-tools-tab-active {
2154 background-color: var(--gray1);
2155 }
2156
2157 .wpc-tools-tab:first-of-type {
2158 border-right: 0;
2159 }
2160
2161 .wpc-builder-add-media-button {
2162 border-radius: 100%;
2163 border: 0;
2164 height: 42px;
2165 width: 42px;
2166 text-align: center;
2167 background-color: #14c795;
2168 color: white;
2169 cursor: pointer;
2170 }
2171
2172 .wpc-builder-button {
2173 padding: 9px 12px;
2174 border: 0;
2175 border-radius: 4px;
2176 background-color: var(--gray1);
2177 color: #636363;
2178 cursor: pointer;
2179 }
2180
2181 .wpc-builder-button-positive {
2182 background-color: #12c795;
2183 color: white;
2184 }
2185
2186 .wpc-builder-button-positive:hover {
2187 background-color: rgb(24 224 169);
2188 }
2189
2190 .wpc-builder-button-negative {
2191 background-color: rgb(222, 60, 98);
2192 color: #fff;
2193 }
2194
2195 .wpc-builder-button-negative:hover {
2196 background-color: rgb(255 68 112);
2197 }
2198
2199 .wpc-builder-bg-img-wrapper {
2200 width: 100%;
2201 background-color: var(--gray1);
2202 border-radius: 4px;
2203 background-size: cover;
2204 padding: 157px 20px;
2205 text-align: center;
2206 box-sizing: border-box;
2207 overflow: hidden;
2208 position: relative;
2209 }
2210
2211 .wpc-builder-bg-tools {
2212 position: absolute;
2213 top: 0;
2214 right: 0;
2215 border-bottom-left-radius: 4px;
2216 overflow: hidden;
2217 }
2218
2219 .wpc-builder-bg-tools i {
2220 padding: 10px;
2221 background-color: #12c795;
2222 color: white;
2223 cursor: pointer;
2224 }
2225
2226 .wpc-builder-bg-tools .fa-trash {
2227 background-color: rgb(222, 60, 98);
2228 }
2229
2230 .wpc-builder-row {
2231 line-height: 1.1;
2232 }
2233
2234 /********** CERTIFICATES **********/
2235
2236 #wpc-certificate-preview .wpc-certificate {
2237 margin: 0 auto !important;
2238 }
2239
2240 .wpc-certificate-tools {
2241 margin-top: 20px;
2242 text-align: center;
2243 }
2244
2245 .wpc-certificate-header {
2246 text-align: center;
2247 }
2248
2249 .certificate-bg {
2250 background-size: contain;
2251 background-repeat: no-repeat;
2252 }
2253
2254 .wpc-certificate {
2255 position: relative;
2256 width: 11in;
2257 height: 8.5in;
2258 margin: 0 auto;
2259 box-shadow: 0px 0px 9px rgba(0,0,0,0.3);
2260 }
2261
2262 .wpc-award-archive-wrapper {
2263 display: flex;
2264 flex-wrap: wrap;
2265 align-items: start;
2266 align-content: center;
2267 justify-content: flex-start;
2268 }
2269
2270 .wpc-certificate-wrapper {
2271 position: relative;
2272 max-width: 219px;
2273 height: 166px;
2274 display: flex;
2275 align-content: space-around;
2276 justify-content: center;
2277 align-items: center;
2278 text-align: center;
2279 border: 1px solid lightgray;
2280 border-radius: 4px;
2281 margin-bottom: 20px;
2282 background-color: #fff;
2283 box-shadow: 3px 3px 10px #e6e6e6;
2284 margin: 0 auto 20px auto;
2285 }
2286
2287 .wpc-certificate-wrapper .wpc-button {
2288 margin: 0;
2289 }
2290
2291 .wpc-certificate-title {
2292 margin-bottom: 10px;
2293 }
2294
2295 .wpc-single-certificate-wrapper {
2296 overflow-x: auto;
2297 text-align: center;
2298 }
2299
2300 .wpc-single-certificate-wrapper .wpc-single-certificate {
2301 margin: 0 auto;
2302 }
2303
2304 .wpc-single-certificate {
2305 display: inline-block;
2306 position: relative;
2307 }
2308
2309 .wpc-unawarded-certificate-overlay {
2310 position: absolute;
2311 top: 0;
2312 left: 0;
2313 width: 100%;
2314 height: 100%;
2315 padding: 20px;
2316 box-sizing: border-box;
2317 -webkit-box-sizing: border-box;
2318 -moz-box-sizing: border-box;
2319 background: rgba(0,0,0,0.8);
2320 color: #fff;
2321 display: flex;
2322 flex-flow: row;
2323 align-content: space-around;
2324 flex-wrap: wrap;
2325 align-items: center;
2326 text-align: center;
2327 font-size: 16px;
2328 line-height: 22px;
2329 justify-content: center;
2330 z-index: 10;
2331 }
2332
2333 .wpc-cert-row {
2334 position: relative;
2335 z-index: 1;
2336 line-height: 1.1;
2337 }
2338
2339 .wpc-cert-img {
2340 z-index: 0;
2341 max-height: 8.5in;
2342 }
2343
2344 .wpc-certificate-title {
2345 font-size: 32px;
2346 }
2347
2348 .wpc-certificate-user {
2349 font-size: 48px;
2350 margin: 0;
2351 }
2352
2353 .wpc-certificate-text {
2354 font-size: 18px;
2355 }
2356
2357 /********** NOTICES **********/
2358
2359 #wpc-feature-upgrade-notice {
2360 text-align: center;
2361 }
2362
2363 #wpc-feature-upgrade-notice img {
2364 border: none;
2365 max-width: 240px;
2366 display: block;
2367 margin: 0 auto;
2368 }
2369
2370 #wpc-feature-upgrade-notice p {
2371 font-size: 18px;
2372 text-align: center;
2373 margin: 0 0 40px;
2374 }
2375
2376 /********** WOOCOMMERCE **********/
2377
2378 .wpc-course-price {
2379 float: right;
2380 font-size: 18px;
2381 color: var(--gray4);
2382 }
2383
2384 .wpc-woo-courses-table {
2385 border-collapse: collapse;
2386 }
2387
2388 .wpc-woo-courses-table td {
2389 padding: 20px !important;
2390 border: 1px solid #e6e6e6;
2391 }
2392
2393 .wpc-woo-courses-table td:nth-of-type(even) {
2394 background-color: var(--gray1);
2395 }
2396
2397 .wpc-woo-courses-table p {
2398 margin-bottom: 0;
2399 }
2400
2401 .wpc-woo-courses-table h3 {
2402 margin-top: 0;
2403 margin-bottom: 10px;
2404 line-height: auto;
2405 }
2406
2407 /********** LESSONS **********/
2408
2409 .wpc-content-title {
2410 margin: 20px 0;
2411 }
2412
2413 /********** COURSES **********/
2414
2415 #wpc-courses-classic {
2416 width: 100%;
2417 }
2418
2419 .wpc-module-list {
2420 list-style: none;
2421 margin: 0;
2422 padding: 0;
2423 }
2424
2425 .wpc-module-list-section {
2426 list-style: none;
2427 margin: 0;
2428 margin-bottom: 30px;
2429 }
2430
2431 .wpc-module-list-lesson {
2432 padding: 10px 0;
2433 border-bottom: 3px dotted var(--gray3);
2434 font-size: 16px;
2435 }
2436
2437 .wpc-module-list-lesson>a {
2438 text-decoration: none;
2439 }
2440
2441 .wpc-module-list-count {
2442 color: var(--gray4);
2443 font-size: 42px;
2444 font-weight: bold;
2445 margin-right: 20px;
2446 }
2447
2448 .wpc-module-list-lesson-count {
2449 margin-right: 10px;
2450 font-weight: bold;
2451 }
2452
2453 .wpc-module-list-header {
2454 margin-bottom: 0;
2455 margin-top: 20px;
2456 }
2457
2458 .wpc-single-course-details-header {
2459 margin: 60px 0;
2460 font-size: 36px;
2461 font-weight: bold;
2462 }
2463
2464 .wpc-single-course-title {
2465 margin-bottom: 0;
2466 margin-top: 60px;
2467 text-align: center;
2468 font-size: 42px;
2469 font-weight: bold;
2470 }
2471
2472 @media screen and (max-width: 767px) {
2473 .wpc-course-archive-excerpt {
2474 display: none;
2475 }
2476 }
2477
2478 /********** FRONT END STYLE EDITOR **********/
2479
2480 .wpc-fe-options-wrapper {
2481 position: fixed;
2482 z-index: 999999;
2483 bottom: 0;
2484 left: -360px;
2485 height: 80%;
2486 background-color: #fff;
2487 box-shadow: 3px 3px 10px rgba(0,0,0,30%);
2488 width: 360px;
2489 }
2490
2491 .wpc-range {
2492 width: 60% !important;
2493 }
2494
2495 .wpc-range-input {
2496 width: 25% !important;
2497 }
2498
2499 .wpc-spacing-wrapper {
2500 display: flex;
2501 }
2502
2503 #wpc-fe-setting-icon {
2504 cursor: pointer;
2505 position: fixed;
2506 bottom: 20px;
2507 left: 20px;
2508 background: rgb(58, 223, 169);
2509 z-index: 9999999;
2510 border-radius: 100%;
2511 color: #fff;
2512 display: flex;
2513 flex-wrap: wrap;
2514 align-items: center;
2515 justify-content: flex-start;
2516 width: 40px;
2517 height: 40px;
2518 }
2519
2520 #wpc-fe-setting-icon i {
2521 flex-basis: 100%;
2522 text-align: center;
2523 }
2524
2525 .wpc-spacing-wrapper {
2526 padding-top: 5px;
2527 display: inline-block;
2528 width: calc(25% - 4px);
2529 box-sizing: border-box;
2530 -moz-box-sizing: border-box;
2531 -webkit-box-sizing: border-box;
2532 }
2533
2534 .wpc-spacing-wrapper label {
2535 display: block;
2536 padding-left: 5px;
2537 margin-top: 5px;
2538 }
2539
2540 .wpc-spacing-input {
2541 width: 100%;
2542 }
2543
2544 #wpc-options-page-wrapper input:focus {
2545 outline: none;
2546 box-shadow: none;
2547 }
2548
2549 /********** COMMENTS **********/
2550
2551 .wpc-comments-header {
2552 margin-top: 20px;
2553 }
2554
2555 .wpc-comments {
2556 list-style: none;
2557 padding: 0 !important;
2558 margin: 0 !important;
2559 }
2560
2561 .wpc-comment {
2562 padding: 20px;
2563 margin-top: 20px !important;
2564 border: 1px solid var(--gray2);
2565 }
2566
2567 .wpc-comment-content {
2568 margin-top: 20px;
2569 }
2570
2571 #wpc-comment-textarea {
2572 max-width: 100%;
2573 width: 100%;
2574 min-height: 180px;
2575 border: 1px solid var(--gray2);
2576 }
2577
2578 #wpc-submit-comment {
2579 margin-top: 10px;
2580 margin-bottom: 20px;
2581 }
2582
2583 .wpc-comment-author {
2584 font-size: 22px;
2585 font-weight: bold;
2586 display: inline-block;
2587 height: 32px;
2588 position: relative;
2589 top: -7px;
2590 }
2591
2592 .wpc-comment-avatar {
2593 display: inline-block;
2594 margin-right: 10px;
2595 }
2596
2597 .wpc-comment-date {
2598 font-size: 14px;
2599 line-height: 14px;
2600 }
2601
2602 #wpc-comment-name, #wpc-comment-email, #wpc-comment-url {
2603 width: 100%;
2604 }
2605
2606 /********** ANIMATIONS AND TRANSITIONS **********/
2607
2608 /* The animation code */
2609 @keyframes wpc-fade {
2610 0% {opacity: 0;}
2611 100% {opacity: 1;}
2612 }
2613
2614 /* The element to apply the animation to */
2615 .wpc-fade {
2616 animation-name: wpc-fade;
2617 animation-duration: 1s;
2618 }
2619
2620 .wpc-left {
2621 position: relative;
2622 }
2623
2624 /* The animation code */
2625 @keyframes wpcLeft {
2626 0% {left: 100%;}
2627 100% {left: 0;}
2628 }
2629
2630 /* The element to apply the animation to */
2631 .wpc-left {
2632 animation-timing-function: ease-in-out;
2633 animation-name: wpcLeft;
2634 animation-duration: 1s;
2635 }
2636
2637 @keyframes wpc-top-small {
2638 0% {
2639 top : -20px;
2640 }
2641 100% {
2642 top : 0;
2643 }
2644 }
2645
2646 .wpc-top-small {
2647 position: relative;
2648 animation-timing-function: ease-in-out;
2649 animation-name: wpc-top-small;
2650 animation-duration: 0.8s;
2651 }
2652
2653 /********** MEDIA QUERIES **********/
2654
2655 @media screen and (max-width: 767px) {
2656 .wpc-material-heading {
2657 font-size: 16px !important;
2658 padding: 10px;
2659 margin: -10px -10px 20px -10px;
2660 }
2661
2662 .wpc-material-content {
2663 border-right: 0;
2664 }
2665
2666 .wpc-mobile-btn {
2667 display: inline-block !important;
2668 }
2669
2670 .wpc-flex-toolbar-left {
2671 display: none;
2672 }
2673
2674 .wpc-flex-toolbar-right {
2675 flex-basis: 100% !important;
2676 margin: 0;
2677 }
2678
2679 #wpc-course-ajax-search,
2680 #wpc-course-search {
2681 width: 100% !important;
2682 }
2683
2684 #wpc-right-sidebar,
2685 #wpc-left-sidebar {
2686 display: none !important;
2687 }
2688
2689 .wpc-material-content {
2690 border-right: 0;
2691 }
2692
2693 #wpc-toolbar-top .wpc-progress-wrapper {
2694 display: none;
2695 }
2696
2697 .wpc-toolbar-buttons {
2698 float: none;
2699 text-align: center;
2700 float: none !important;
2701 }
2702
2703 .wpc-btn-next>span, .wpc-btn-prev>span {
2704 display: none;
2705 }
2706
2707 .wpc-btn:hover i{
2708 padding-left: 0 !important;
2709 padding-right: 0 !important;
2710 }
2711
2712 .wpc-ajax-course-sort-wrapper {
2713 float: none !important;
2714 margin-top: 10px;
2715 }
2716 .wpc-meta-value {
2717 font-size: 12px;
2718 }
2719 .wpc-material-meta-icon {
2720 font-size: 20px;
2721 }
2722 .wpc-material {
2723 padding: 10px;
2724 }
2725 .wpc-ajax-search-wrapper,
2726 .wpc-ajax-filters-wrapper,
2727 .wpc-classic-search-wrapper,
2728 .wpc-classic-filters-wrapper {
2729 flex-basis: 100% !important;
2730 margin: 0;
2731 }
2732 .wpc-ajax-filters-wrapper-right,
2733 .wpc-classic-filters-wrapper-right {
2734 float: right !important;
2735 }
2736 #wpc-ajax-course-sort {
2737 padding: 6px;
2738 }
2739 .wpc-lightbox-close {
2740 right: 20px;
2741 }
2742 }
2743
2744 @media screen and (max-width: 400px) {
2745 .wpc-flex-2, .wpc-flex-3, .wpc-flex-4 {
2746 flex-basis: 100%;
2747 margin: 0 0 2% 0;
2748 }
2749 .wpc-single-course-title {
2750 font-size: 26px;
2751 }
2752 .wpc-lightbox {
2753 width: 96% !important;
2754 }
2755 }
2756
2757 /********** FIREWORKS **********/
2758
2759 .wpc-pyro {
2760 position: absolute;
2761 top: 0;
2762 width: calc(100% - 80px);
2763 overflow: hidden;
2764 height: 100%;
2765 pointer-events: none;
2766 }
2767
2768 .wpc-pyro > .wpc-before, .wpc-pyro > .wpc-after {
2769 position: absolute;
2770 width: 5px;
2771 height: 5px;
2772 border-radius: 50%;
2773 box-shadow: -120px -218.66667px blue, 248px -16.66667px #00ff84, 190px 16.33333px #002bff, -113px -308.66667px #ff009d, -109px -287.66667px #ffb300, -50px -313.66667px #ff006e, 226px -31.66667px #ff4000, 180px -351.66667px #ff00d0, -12px -338.66667px #00f6ff, 220px -388.66667px #99ff00, -69px -27.66667px #ff0400, -111px -339.66667px #6200ff, 155px -237.66667px #00ddff, -152px -380.66667px #00ffd0, -50px -37.66667px #00ffdd, -95px -175.66667px #a6ff00, -88px 10.33333px #0d00ff, 112px -309.66667px #005eff, 69px -415.66667px #ff00a6, 168px -100.66667px #ff004c, -244px 24.33333px #ff6600, 97px -325.66667px #ff0066, -211px -182.66667px #00ffa2, 236px -126.66667px #b700ff, 140px -196.66667px #9000ff, 125px -175.66667px #00bbff, 118px -381.66667px #ff002f, 144px -111.66667px #ffae00, 36px -78.66667px #f600ff, -63px -196.66667px #c800ff, -218px -227.66667px #d4ff00, -134px -377.66667px #ea00ff, -36px -412.66667px #ff00d4, 209px -106.66667px #00fff2, 91px -278.66667px #000dff, -22px -191.66667px #9dff00, 139px -392.66667px #a6ff00, 56px -2.66667px #0099ff, -156px -276.66667px #ea00ff, -163px -233.66667px #00fffb, -238px -346.66667px #00ff73, 62px -363.66667px #0088ff, 244px -170.66667px #0062ff, 224px -142.66667px #b300ff, 141px -208.66667px #9000ff, 211px -285.66667px #ff6600, 181px -128.66667px #1e00ff, 90px -123.66667px #c800ff, 189px 70.33333px #00ffc8, -18px -383.66667px #00ff33, 100px -6.66667px #ff008c;
2774 -moz-animation: 1s bang ease-out infinite backwards, 1s gravity ease-in infinite backwards, 5s position linear infinite backwards;
2775 -webkit-animation: 1s bang ease-out infinite backwards, 1s gravity ease-in infinite backwards, 5s position linear infinite backwards;
2776 -o-animation: 1s bang ease-out infinite backwards, 1s gravity ease-in infinite backwards, 5s position linear infinite backwards;
2777 -ms-animation: 1s bang ease-out infinite backwards, 1s gravity ease-in infinite backwards, 5s position linear infinite backwards;
2778 animation: 1s bang ease-out infinite backwards, 1s gravity ease-in infinite backwards, 5s position linear infinite backwards; }
2779
2780 .wpc-pyro > .after {
2781 -moz-animation-delay: 1.25s, 1.25s, 1.25s;
2782 -webkit-animation-delay: 1.25s, 1.25s, 1.25s;
2783 -o-animation-delay: 1.25s, 1.25s, 1.25s;
2784 -ms-animation-delay: 1.25s, 1.25s, 1.25s;
2785 animation-delay: 1.25s, 1.25s, 1.25s;
2786 -moz-animation-duration: 1.25s, 1.25s, 6.25s;
2787 -webkit-animation-duration: 1.25s, 1.25s, 6.25s;
2788 -o-animation-duration: 1.25s, 1.25s, 6.25s;
2789 -ms-animation-duration: 1.25s, 1.25s, 6.25s;
2790 animation-duration: 1.25s, 1.25s, 6.25s; }
2791
2792 @-webkit-keyframes bang {
2793 from {
2794 box-shadow: 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white; } }
2795 @-moz-keyframes bang {
2796 from {
2797 box-shadow: 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white; } }
2798 @-o-keyframes bang {
2799 from {
2800 box-shadow: 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white; } }
2801 @-ms-keyframes bang {
2802 from {
2803 box-shadow: 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white; } }
2804 @keyframes bang {
2805 from {
2806 box-shadow: 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white; } }
2807 @-webkit-keyframes gravity {
2808 to {
2809 transform: translateY(200px);
2810 -moz-transform: translateY(200px);
2811 -webkit-transform: translateY(200px);
2812 -o-transform: translateY(200px);
2813 -ms-transform: translateY(200px);
2814 opacity: 0; } }
2815 @-moz-keyframes gravity {
2816 to {
2817 transform: translateY(200px);
2818 -moz-transform: translateY(200px);
2819 -webkit-transform: translateY(200px);
2820 -o-transform: translateY(200px);
2821 -ms-transform: translateY(200px);
2822 opacity: 0; } }
2823 @-o-keyframes gravity {
2824 to {
2825 transform: translateY(200px);
2826 -moz-transform: translateY(200px);
2827 -webkit-transform: translateY(200px);
2828 -o-transform: translateY(200px);
2829 -ms-transform: translateY(200px);
2830 opacity: 0; } }
2831 @-ms-keyframes gravity {
2832 to {
2833 transform: translateY(200px);
2834 -moz-transform: translateY(200px);
2835 -webkit-transform: translateY(200px);
2836 -o-transform: translateY(200px);
2837 -ms-transform: translateY(200px);
2838 opacity: 0; } }
2839 @keyframes gravity {
2840 to {
2841 transform: translateY(200px);
2842 -moz-transform: translateY(200px);
2843 -webkit-transform: translateY(200px);
2844 -o-transform: translateY(200px);
2845 -ms-transform: translateY(200px);
2846 opacity: 0; } }
2847 @-webkit-keyframes position {
2848 0%, 19.9% {
2849 margin-top: 10%;
2850 margin-left: 40%; }
2851
2852 20%, 39.9% {
2853 margin-top: 40%;
2854 margin-left: 30%; }
2855
2856 40%, 59.9% {
2857 margin-top: 20%;
2858 margin-left: 70%; }
2859
2860 60%, 79.9% {
2861 margin-top: 30%;
2862 margin-left: 20%; }
2863
2864 80%, 99.9% {
2865 margin-top: 30%;
2866 margin-left: 80%; } }
2867 @-moz-keyframes position {
2868 0%, 19.9% {
2869 margin-top: 10%;
2870 margin-left: 40%; }
2871
2872 20%, 39.9% {
2873 margin-top: 40%;
2874 margin-left: 30%; }
2875
2876 40%, 59.9% {
2877 margin-top: 20%;
2878 margin-left: 70%; }
2879
2880 60%, 79.9% {
2881 margin-top: 30%;
2882 margin-left: 20%; }
2883
2884 80%, 99.9% {
2885 margin-top: 30%;
2886 margin-left: 80%; } }
2887 @-o-keyframes position {
2888 0%, 19.9% {
2889 margin-top: 10%;
2890 margin-left: 40%; }
2891
2892 20%, 39.9% {
2893 margin-top: 40%;
2894 margin-left: 30%; }
2895
2896 40%, 59.9% {
2897 margin-top: 20%;
2898 margin-left: 70%; }
2899
2900 60%, 79.9% {
2901 margin-top: 30%;
2902 margin-left: 20%; }
2903
2904 80%, 99.9% {
2905 margin-top: 30%;
2906 margin-left: 80%; } }
2907 @-ms-keyframes position {
2908 0%, 19.9% {
2909 margin-top: 10%;
2910 margin-left: 40%; }
2911
2912 20%, 39.9% {
2913 margin-top: 40%;
2914 margin-left: 30%; }
2915
2916 40%, 59.9% {
2917 margin-top: 20%;
2918 margin-left: 70%; }
2919
2920 60%, 79.9% {
2921 margin-top: 30%;
2922 margin-left: 20%; }
2923
2924 80%, 99.9% {
2925 margin-top: 30%;
2926 margin-left: 80%; } }
2927 @keyframes position {
2928 0%, 19.9% {
2929 margin-top: 10%;
2930 margin-left: 40%; }
2931
2932 20%, 39.9% {
2933 margin-top: 40%;
2934 margin-left: 30%; }
2935
2936 40%, 59.9% {
2937 margin-top: 20%;
2938 margin-left: 70%; }
2939
2940 60%, 79.9% {
2941 margin-top: 30%;
2942 margin-left: 20%; }
2943
2944 80%, 99.9% {
2945 margin-top: 30%;
2946 margin-left: 80%; } }
2947
2948 /********** ADMIN MENU **********/
2949
2950 #toplevel_page_wpc_settings > ul > li:has(.wpc-admin-separator) {
2951 border-top: 1px solid rgba(240,246,252,.7);
2952 }
2953
2954 #toplevel_page_wpc_settings > ul > li:last-child {
2955 border-bottom: 1px solid rgba(240,246,252,.7);
2956 }
2957
2958 #toplevel_page_wpc_settings > ul > li:has(.wpc-admin-hide) {
2959 display: none;
2960 }
2961
2962 /********** FACELIFT **********/
2963
2964 .wpc-flex-content-large {
2965 flex-basis: 100% !important;
2966 }
2967
2968 .wpc-description {
2969 font-size: 1rem;
2970 margin-bottom: 5px;
2971 margin-top: 5px;
2972 }
2973
2974 .wpc-description-sub {
2975 font-weight: bold;
2976 margin-top: 1.5em;
2977 margin-bottom: 0;
2978 }
2979
2980 .wpc-description-main {
2981 font-size: 2rem;
2982 font-weight: bold;
2983 line-height: 1;
2984 margin: 0.5em 0;
2985 }
2986
2987 .wpc-image-anchor {
2988 position: relative;
2989 }
2990
2991 .waving-hand {
2992 width: 50px;
2993 position: absolute;
2994 top: -5px;
2995 }
2996
2997 #wpcontent a:focus {
2998 box-shadow: none;
2999 }
3000
3001 .wpc-connected-courses-list {
3002 margin: 0 0 0 15px;
3003 }
3004
3005 .wpc-connected-courses-list li {
3006 margin-bottom: 0;
3007 }
3008
3009 .wpc-admin-box-content {
3010 padding-right: 20px;
3011 }
3012
3013 .wpc-counter-container {
3014 justify-content: center;
3015 }
3016
3017 .wpc-single-course-archive .wpc-hide-viewed {
3018 display: none;
3019 }
3020
3021 #wpc-courses-ajax {
3022 border-left: 1px solid #e8e6e6;
3023 border-bottom: 1px solid #e8e6e6;
3024 border-right: 1px solid #e8e6e6;
3025 }
3026
3027 #wpc-right-sidebar {
3028 border-left: 1px solid #e8e6e6;
3029 margin-bottom: -1px;
3030 }
3031
3032 .wpc-load-lesson,
3033 .wpc-load-quiz,
3034 .wpc-module-title {
3035 word-break: break-word;
3036 }
3037
3038 #wpc-profile-page {
3039 min-width: 50%;
3040 }
3041
3042 .interface-navigable-region .select2-selection__choice__display {
3043 display: inline-block;
3044 max-width: 200px;
3045 }
3046
3047 .select2.select2-container.select2-container--default {
3048 min-width: 150px;
3049 }
3050
3051 .wpc-wrap-generic {
3052 margin-top: 30px;
3053 }
3054
3055 .wpc-premium-images {
3056 border: 1px solid #e6e6e6;
3057 }
3058
3059 .wpc-premium-upgrade-small {
3060 margin-top: 10px;
3061 }
3062
3063 .wpc-premium-upgrade-small:active,
3064 .wpc-premium-upgrade-small:focus {
3065 color: white;
3066 }
3067
3068 .wpc-premium-upgrade-small.wpc-premium-upgrade-all {
3069 margin-top: 5px;
3070 }
3071
3072 .wpc-mark-completed:has(.fa-graduation-cap) {
3073 padding-left: 9.375px;
3074 padding-right: 9.375px;
3075 }
3076
3077 #wpc-course-ajax-search:focus-visible,
3078 #wpc-ajax-course-sort:focus-visible {
3079 outline: none;
3080 }
3081
3082 .wpc-btn.wpc-add-to-cart {
3083 color: var(--blue);
3084 }
3085
3086 li.wpc-load-lesson.wpc-load-lesson-toolbar {
3087 line-height: 25px;
3088 }
3089
3090 .wpc-material.wpc-material-content {
3091 background-color: var(--wpcbg);
3092 }
3093
3094 .wpc-fe-options-wrapper input:focus-visible {
3095 outline: none;
3096 }
3097
3098 .wpc-fe-options-wrapper input {
3099 box-sizing: border-box;
3100 }
3101
3102 .wpc-nav-list li.wpc-order-lesson-list-lesson.ui-sortable-handle[data-post-type="lesson"],
3103 .wpc-nav-list li.wpc-order-lesson-list-lesson.ui-sortable-handle[data-post-type="wpc-quiz"] {
3104 padding-left: 40px;
3105 }
3106
3107 .wpc-lightbox-wrapper .wpc-pagination.wpc-lightbox-pagination,
3108 #wpc-course-app .wpc-wrapper .wpc-pagination {
3109 width: auto;
3110 }
3111
3112 .wpc-load-courses.wpc-btn-sm.wpc-btn-pagination:hover {
3113 cursor: pointer;
3114 }
3115
3116 /* Redesign color customization */
3117
3118 /* wpc_toolbar_buttons_color */
3119
3120 #wpc-toolbar-top button.wpc-load-category-list {
3121 background-color: var(--tool);
3122 border-color: var(--tool);
3123 }
3124
3125 #wpc-toolbar-top button.wpc-load-category-list:hover {
3126 background-color: white;
3127 color: var(--tool) !important;
3128 }
3129
3130 #wpc-toolbar-top .wpc-load-login,
3131 #wpc-toolbar-top #wpc-ajax-course-sort,
3132 #wpc-toolbar-top button.wpc-btn-next,
3133 #wpc-toolbar-top button.wpc-mark-completed,
3134 #wpc-toolbar-top button.wpc-load-profile-nav {
3135 background-color: white !important;
3136 border-color: var(--tool) !important;
3137 color: var(--tool) !important;
3138 border-width: 2px !important;
3139 }
3140
3141 #wpc-toolbar-top .wpc-load-login:hover,
3142 #wpc-toolbar-top button.wpc-btn-next:hover,
3143 #wpc-toolbar-top button.wpc-mark-completed:hover,
3144 #wpc-toolbar-top button.wpc-load-profile-nav:hover {
3145 background-color: var(--tool) !important;
3146 color: white !important;
3147 }
3148
3149 #wpc-toolbar-top button.wpc-btn-next:disabled,
3150 #wpc-toolbar-top button.wpc-mark-completed:disabled {
3151 background-color: #e6e6e6 !important;
3152 cursor: inherit;
3153 color: var(--tool) !important;
3154 }
3155
3156 /* wpc_selected_bg_color */
3157
3158 #wpc-course-app .wpc-active-nav-item:not(.ui-sortable-handle),
3159 .wpc-active-nav-item:not(.ui-sortable-handle),
3160 .wpc-active-admin-nav-item {
3161 background-color: var(--sele) !important;
3162 }
3163
3164 /* wpc_link_color */
3165
3166 .wpc-crumb-link,
3167 .wpc-ajax-link,
3168 .wpc-crumb-link:hover,
3169 .wcp-ajax-link:hover,
3170 .wpc-link,
3171 .wpc-link:hover {
3172 color: var(--link) !important;
3173 text-decoration: none;
3174 }
3175
3176 /* wpc_standard_button_color */
3177
3178 .wpc-btn,
3179 .wpc-button,
3180 .wpc-material-content .pmpro_content_message a,
3181 .wpc-lightbox-content input[type="submit"],
3182 .wpc-btn.wpc-woo-view-course,
3183 #wpcontent #wpc-profile-content .wpc-btn {
3184 background: white;
3185 color: var(--stand);
3186 border: 2px solid var(--stand);
3187 }
3188
3189 .wpc-btn:hover,
3190 .wpc-button:hover,
3191 .wpc-material-content .pmpro_content_message a:hover,
3192 #wpcontent #wpc-profile-content .wpc-btn:hover {
3193 background-color: var(--stand);
3194 color: white !important;
3195 border: 2px solid var(--stand);
3196 }
3197
3198 .wpc-btn-solid {
3199 background-color: var(--stand);
3200 border-color: var(--stand);
3201 color: white;
3202 }
3203
3204 .wpc-btn-solid:hover {
3205 background-color: white;
3206 border-color: var(--stand);
3207 color: var(--stand) !important;
3208 }
3209
3210 /* wpc_primary_color */
3211
3212 .wpc-material-tools .wpc-btn.wpc-btn-solid,
3213 .wpc-table.wpc-fade .wpc-btn.wpc-btn-solid,
3214 #wpcontent #wpc-profile-content .wpc-table.wpc-fade .wpc-btn.wpc-btn-solid {
3215 background-color: var(--green);
3216 border-color: var(--green);
3217 color: white;
3218 }
3219
3220 .wpc-material-tools .wpc-btn.wpc-btn-solid:hover,
3221 .wpc-table.wpc-fade .wpc-btn.wpc-btn-solid:hover,
3222 #wpcontent #wpc-profile-content .wpc-table.wpc-fade .wpc-btn.wpc-btn-solid:hover {
3223 background-color: white;
3224 border-color: var(--green);
3225 color: var(--green) !important;
3226 }
3227
3228 /* wpc_secondary_color */
3229
3230 .wpc-add-to-cart,
3231 .wpc-start-course {
3232 color: var(--blue);
3233 border: 2px solid var(--blue);
3234 }
3235
3236 .wpc-add-to-cart:hover,
3237 .wpc-start-course:hover {
3238 background-color: var(--blue);
3239 color: white !important;
3240 border: 2px solid var(--blue);
3241 }
3242
3243 /* WP Admin Backend */
3244
3245 #wpcontent .wpc-btn,
3246 #wpcontent .wpc-btn.wpc-btn-soft {
3247 color: #2271b1;
3248 border: 2px solid #2271b1;
3249 background-color: white;
3250 }
3251
3252 #wpcontent .wpc-btn:hover,
3253 #wpcontent .wpc-btn.wpc-btn-soft:hover {
3254 color: #2271b1 !important;
3255 border: 2px solid #2271b1;
3256 background-color: white;
3257 }
3258
3259 #wpcontent .wpc-btn.wpc-btn-solid {
3260 color: white;
3261 border: 2px solid #2271b1;
3262 background-color: #2271b1;
3263 }
3264
3265 #wpcontent .wpc-btn.wpc-btn-solid:hover {
3266 color: #2271b1 !important;
3267 border: 2px solid #2271b1;
3268 background-color: white;
3269 }
3270
3271 .wpc-rating-title {
3272 position: relative;
3273 }
3274
3275 .wpc-woo-content-drip-days {
3276 width: 70px;
3277 }
3278
3279 .wpc-metabox-item-content-drip {
3280 padding-top: 0;
3281 }
3282
3283 .wpc-hide-element {
3284 display: none !important;
3285 }
3286
3287 .wpc-admin-box-content .tablenav {
3288 height: auto;
3289 }