PluginProbe
LearnPress – WordPress LMS Plugin for Create and Sell Online Courses / 4.4.8
LearnPress – WordPress LMS Plugin for Create and Sell Online Courses v4.4.8
4.4.8 4.4.7 4.4.6 4.4.5 4.4.4 4.4.3 4.4.2 4.4.1 4.4.0 4.3.9.1 4.3.9 4.3.8 4.3.7 4.1.6.9 4.1.6.9.1 4.1.6.9.2 4.1.6.9.3 4.1.6.9.4 4.1.7 4.1.7.1 4.1.7.2 4.1.7.3 4.1.7.3.1 4.1.7.3.2 4.2.0 All 139 releases
learnpress / assets / css / learnpress-block-rtl.css

learnpress-block-rtl.css in LearnPress – WordPress LMS Plugin for Create and Sell Online Courses 4.4.8, at assets/css/learnpress-block-rtl.css

2,225 lines 55.3 KB
No matching file
Up and down to move Enter to open Esc to close
Raw Download Zip
1 /**
2 * Mixin
3 */
4 @keyframes rotating4 {
5 from {
6 transform: rotate(0deg);
7 }
8 to {
9 transform: rotate(-360deg);
10 }
11 }
12 @keyframes animation4 {
13 from {
14 right: -40%;
15 width: 40%;
16 }
17 to {
18 right: 100%;
19 width: 10%;
20 }
21 }
22 :root {
23 --lp-cotainer-max-with: var(--lp-container-max-width);
24 }
25
26 .wp-block-group {
27 --lp-container-max-width: var(--wp--style--global--wide-size);
28 }
29
30 /**
31 * Style for the buttons
32 */
33 .lp-btn-edit-primary {
34 border: none;
35 background: #135e96;
36 color: #fff;
37 }
38 .lp-btn-edit-primary:not(.active) {
39 opacity: 0.5;
40 }
41 .lp-btn-edit-primary:hover, .lp-btn-edit-primary.active, .lp-btn-edit-primary.active:hover {
42 background: #135E96;
43 color: #fff;
44 opacity: 1;
45 }
46
47 /* 5. Minimal Bottom Line */
48 .btn-line::after {
49 content: "";
50 position: absolute;
51 bottom: 0;
52 right: 0;
53 height: 4px;
54 width: 0%;
55 background-color: #38bdf8;
56 animation: lineLoad 2s ease-in-out infinite;
57 }
58
59 @keyframes lineLoad {
60 0% {
61 width: 0%;
62 right: 0;
63 }
64 50% {
65 width: 100%;
66 right: 0;
67 }
68 100% {
69 width: 0%;
70 right: 100%;
71 }
72 }
73 .lp-button {
74 padding: 8px 16px;
75 border: 1px solid var(--lp-border-color, #E2E0DB);
76 border-radius: var(--lp-border-radius, 5px);
77 color: #374151;
78 font-weight: 500;
79 text-decoration: none;
80 cursor: pointer;
81 }
82 .lp-button.loading {
83 position: relative;
84 display: flex;
85 align-items: center;
86 justify-content: center;
87 pointer-events: none;
88 color: rgba(0, 0, 0, 0.2) !important;
89 }
90 .lp-button.loading:before {
91 position: absolute;
92 display: inline-block;
93 font-family: "lp-icon";
94 content: "\f110";
95 animation: lp-rotating 1s linear infinite;
96 font-variant: normal;
97 text-transform: none;
98 -webkit-font-smoothing: antialiased;
99 -moz-osx-font-smoothing: grayscale;
100 vertical-align: middle;
101 color: black;
102 }
103
104 .learn-press-message {
105 position: relative;
106 margin: 0 !important;
107 padding: 10px 20px;
108 border-radius: var(--lp-border-radius, 5px);
109 background-color: #E5F7FF;
110 color: #007AFF;
111 max-width: 100%;
112 }
113 .learn-press-message.error {
114 background-color: #FEE5E5;
115 color: #FF3B30;
116 border-right: none;
117 }
118 .learn-press-message.warning {
119 background-color: #FEF7E6;
120 color: #FF9500;
121 }
122 .learn-press-message.success {
123 background-color: #EBF8E5;
124 color: #3AB500;
125 }
126 .learn-press-message.info {
127 background-color: rgba(0, 122, 255, 0.1019607843);
128 color: #007AFF;
129 }
130 .learn-press-message a {
131 text-decoration: underline;
132 }
133
134 .lp-toast.toastify {
135 background: #EBF8E5;
136 color: #3AB500;
137 border-radius: var(--lp-border-radius, 5px);
138 box-shadow: 0 0 0;
139 display: flex;
140 align-items: center;
141 }
142 .lp-toast.toastify .toast-close {
143 background: transparent !important;
144 font-size: 0;
145 padding-right: 12px;
146 }
147 .lp-toast.toastify .toast-close:before {
148 content: "\f00d";
149 font-family: "lp-icon";
150 font-size: 16px;
151 color: #000;
152 line-height: 17px;
153 }
154 .lp-toast.toastify .toast-close:hover {
155 opacity: 1;
156 }
157 .lp-toast.toastify.error {
158 background-color: #FEE5E5;
159 color: #FF3B30;
160 padding: 12px 20px;
161 border: none;
162 margin: 0 auto;
163 }
164 .lp-toast.toastify.warning {
165 background-color: #FEF7E6;
166 color: #fb9422;
167 padding: 12px 20px;
168 border: none;
169 margin: 0 auto;
170 }
171 .lp-toast.toastify.info {
172 background-color: rgba(0, 122, 255, 0.1019607843);
173 color: #277afc;
174 padding: 12px 20px;
175 border: none;
176 margin: 0 auto;
177 }
178
179 @keyframes lp-rotating {
180 from {
181 -webkit-transform: rotate(0deg);
182 transform: rotate(0deg);
183 }
184 to {
185 -webkit-transform: rotate(-360deg);
186 transform: rotate(-360deg);
187 }
188 }
189 @-webkit-keyframes lp-rotating {
190 from {
191 -webkit-transform: rotate(0deg);
192 transform: rotate(0deg);
193 }
194 to {
195 -webkit-transform: rotate(-360deg);
196 transform: rotate(-360deg);
197 }
198 }
199 .lp-loading-change {
200 position: absolute;
201 width: 100%;
202 height: 100%;
203 background: rgba(255, 255, 255, 0.38);
204 top: 0;
205 }
206
207 .lp-load-ajax-element {
208 position: relative;
209 }
210
211 *,
212 :after,
213 :before {
214 box-sizing: border-box;
215 }
216
217 .learnpress-block-pagination,
218 .learn-press-pagination {
219 margin: 20px 0;
220 text-align: center;
221 }
222 .learnpress-block-pagination .page-numbers,
223 .learn-press-pagination .page-numbers {
224 display: inline-flex;
225 gap: 5px;
226 flex-wrap: wrap;
227 margin: 0;
228 padding: 0;
229 border: 0;
230 outline: 0;
231 background: transparent;
232 list-style: none;
233 }
234 .learnpress-block-pagination .page-numbers > li,
235 .learn-press-pagination .page-numbers > li {
236 display: inline-block;
237 margin: 0;
238 }
239 .learnpress-block-pagination .page-numbers > li .page-numbers,
240 .learn-press-pagination .page-numbers > li .page-numbers {
241 float: unset;
242 padding: 0 12px;
243 color: #666;
244 text-decoration: none;
245 }
246 .learnpress-block-pagination .page-numbers > li .page-numbers.current,
247 .learn-press-pagination .page-numbers > li .page-numbers.current {
248 color: var(--lp-primary-color);
249 font-weight: 400;
250 }
251 .learnpress-block-pagination .page-numbers > li .page-numbers:hover,
252 .learn-press-pagination .page-numbers > li .page-numbers:hover {
253 color: var(--lp-primary-color);
254 }
255
256 .social-share-toggle {
257 position: relative;
258 display: flex;
259 gap: 20px;
260 }
261 .social-share-toggle .share-toggle-icon {
262 cursor: pointer;
263 display: flex;
264 align-items: center;
265 gap: 8px;
266 }
267 .social-share-toggle .share-toggle-icon .share-label {
268 margin: 0;
269 cursor: pointer;
270 }
271 .social-share-toggle .share-toggle-icon:hover {
272 color: var(--lp-primary-color, #ffb606);
273 }
274 .social-share-toggle .content-widget-social-share {
275 padding: 20px;
276 background: #fff;
277 box-shadow: 0 1px 16px 0 rgba(0, 0, 0, 0.12);
278 }
279 .social-share-toggle .lp-social-media {
280 display: inline-flex;
281 padding: 0;
282 gap: 12px;
283 margin: 0;
284 }
285 .social-share-toggle .lp-social-media > li {
286 text-align: center;
287 list-style: none;
288 }
289 .social-share-toggle .lp-social-media > li span {
290 display: none;
291 }
292 .social-share-toggle .lp-social-media > li i {
293 width: 40px;
294 height: 40px;
295 display: inline-flex;
296 align-items: center;
297 justify-content: center;
298 border: 1px solid var(--lp-border-color, #E2E0DB);
299 border-radius: 50%;
300 }
301 .social-share-toggle .lp-social-media > li i:hover {
302 background-color: var(--lp-primary-color, #ffb606);
303 border-color: var(--lp-primary-color, #ffb606);
304 color: var(--lp-color-white, #fff);
305 }
306 .social-share-toggle .clipboard-post {
307 display: flex;
308 justify-content: space-between;
309 margin-bottom: 20px;
310 gap: 12px;
311 }
312 .social-share-toggle .btn-clipboard {
313 position: relative;
314 padding: 12px 20px;
315 white-space: nowrap;
316 }
317 .social-share-toggle .btn-clipboard .tooltip {
318 display: none;
319 position: absolute;
320 z-index: 2;
321 right: 50%;
322 left: auto;
323 bottom: 100%;
324 transform: translateX(50%);
325 width: max-content;
326 color: #fff;
327 font-size: 0.825em;
328 padding: 5px 10px;
329 background: rgba(0, 0, 0, 0.72);
330 border-radius: 3px;
331 margin-bottom: 10px;
332 }
333 .social-share-toggle .btn-clipboard .tooltip:before {
334 content: "";
335 position: absolute;
336 z-index: 2;
337 right: 50%;
338 bottom: -5px;
339 margin-right: -3px;
340 border-right: 5px solid transparent;
341 border-left: 5px solid transparent;
342 border-top: 5px solid rgba(0, 0, 0, 0.72);
343 }
344 .social-share-toggle .btn-clipboard:hover {
345 background-color: #eee;
346 }
347 .social-share-toggle .btn-clipboard:hover .tooltip {
348 display: block;
349 }
350 .social-share-toggle .clipboard-value {
351 border: 1px solid var(--lp-border-color, #E2E0DB);
352 padding: 12px 20px;
353 flex: 1;
354 }
355 @media (max-width: 600px) {
356 .social-share-toggle .clipboard-value {
357 width: 100%;
358 }
359 }
360 .social-share-toggle .wrapper-content-widget {
361 visibility: hidden;
362 text-align: right;
363 opacity: 0;
364 transition: all 0.27s ease;
365 position: absolute;
366 left: 0;
367 top: auto;
368 z-index: 9;
369 margin-top: 20px;
370 }
371 .social-share-toggle.social-share-toggle__open .wrapper-content-widget {
372 margin-top: 0;
373 visibility: visible;
374 opacity: 1;
375 }
376 @media (max-width: 768px) {
377 .social-share-toggle .wrapper-content-widget {
378 position: fixed;
379 top: 0;
380 right: 0;
381 left: 0;
382 bottom: 0;
383 background-color: rgba(0, 0, 0, 0.7);
384 }
385 .social-share-toggle .wrapper-content-widget .content-widget-social-share {
386 position: relative;
387 z-index: 1;
388 max-width: fit-content;
389 top: 50%;
390 min-width: 320px;
391 transform: translateY(-50%);
392 margin: 0 auto;
393 }
394 }
395
396 .lp-instructor-info {
397 display: flex;
398 gap: 30px;
399 margin-top: 30px;
400 margin-bottom: 30px;
401 }
402 @media (max-width: 600px) {
403 .lp-instructor-info {
404 flex-wrap: wrap;
405 }
406 }
407 .lp-instructor-info .lp-section-instructor {
408 flex: 1;
409 }
410 .lp-instructor-info .instructor-display-name {
411 font-size: 1.4rem;
412 }
413 .lp-instructor-info .instructor-avatar {
414 max-width: 200px;
415 }
416 .lp-instructor-info .lp-instructor-meta {
417 margin-top: 16px;
418 display: flex;
419 column-gap: 20px;
420 row-gap: 8px;
421 }
422 .lp-instructor-info .instructor-description {
423 margin-top: 16px;
424 }
425 .lp-instructor-info img {
426 max-width: 100%;
427 border-radius: var(--lp-border-radius, 5px);
428 }
429 .lp-instructor-info .instructor-social {
430 display: inline-flex;
431 padding: 0;
432 gap: 12px;
433 margin: 16px 0 0 0;
434 }
435 .lp-instructor-info .instructor-social > a {
436 text-align: center;
437 list-style: none;
438 }
439 .lp-instructor-info .instructor-social > a span {
440 display: none;
441 }
442 .lp-instructor-info .instructor-social > a i {
443 width: 40px;
444 height: 40px;
445 display: inline-flex;
446 align-items: center;
447 justify-content: center;
448 border: 1px solid var(--lp-border-color, #E2E0DB);
449 border-radius: 50%;
450 }
451 .lp-instructor-info .instructor-social > a i:hover {
452 background-color: var(--lp-primary-color, #ffb606);
453 border-color: var(--lp-primary-color, #ffb606);
454 color: var(--lp-color-white, #fff);
455 }
456
457 .instructor-display-name {
458 font-weight: var(--lp-font-weight-link, 600);
459 }
460
461 .instructor-item-meta {
462 display: inline-flex;
463 border-right: 1px solid var(--lp-border-color, #E2E0DB);
464 padding-right: 20px;
465 }
466
467 .lp-instructor-meta .instructor-item-meta:first-child {
468 border: none;
469 padding-right: 0;
470 }
471
472 .wrapper-instructor-total-students, .wrapper-instructor-total-courses {
473 display: flex;
474 gap: 4px;
475 align-items: center;
476 }
477
478 .course-extra-box {
479 margin-bottom: 16px;
480 border: 1px solid var(--lp-border-color, #E2E0DB);
481 border-radius: var(--lp-border-radius, 5px);
482 width: 100%;
483 }
484 .course-extra-box.active .course-extra-box__content {
485 height: auto;
486 }
487 .course-extra-box__title {
488 --extra-height: 50px;
489 display: flex;
490 align-items: center;
491 position: relative;
492 height: var(--extra-height);
493 margin: 0 !important;
494 padding: 0 20px 0 45px;
495 background: rgba(181, 187, 211, 0.15);
496 font-size: 1em;
497 font-weight: 700;
498 cursor: pointer;
499 }
500 @media (max-width: 767px) {
501 .course-extra-box__title {
502 padding-right: 16px;
503 }
504 }
505 .course-extra-box__title::after {
506 position: absolute;
507 top: 0;
508 left: 20px;
509 font-family: "lp-icon";
510 line-height: var(--extra-height);
511 content: "\f107";
512 }
513 .course-extra-box__content {
514 overflow: hidden;
515 transition: height 0.3s ease;
516 }
517 .course-extra-box__content-inner {
518 animation-name: course-extra-box__content-inner-transform;
519 animation-duration: 0.3s;
520 animation-timing-function: ease-in-out;
521 animation-iteration-count: 1;
522 animation-direction: normal;
523 }
524 .course-extra-box__content-inner > ul {
525 padding-right: 0 !important;
526 padding-bottom: 0 !important;
527 }
528 .course-extra-box__content ul,
529 .course-extra-box__content li {
530 list-style: none;
531 }
532 .course-extra-box__content ul {
533 margin: 0;
534 padding: 0;
535 }
536 .course-extra-box__content li {
537 margin: 0;
538 padding: 12px 20px;
539 border-bottom: 1px solid var(--lp-border-color, #E2E0DB);
540 }
541 @media (max-width: 767px) {
542 .course-extra-box__content li {
543 padding-right: 16px;
544 padding-left: 16px;
545 }
546 }
547 .course-extra-box__content li::before {
548 margin-left: 8px;
549 color: var(--lp-primary-color);
550 font-family: "lp-icon";
551 content: "\f00c";
552 }
553 .course-extra-box__content li:last-child {
554 border-bottom: 0;
555 }
556 .course-extra-box:last-child {
557 margin-bottom: 60px;
558 }
559 .course-extra-box.active .course-extra-box__title::after {
560 content: "\f106";
561 }
562 .course-extra-box + .comment-respond, .course-extra-box + .comments-area {
563 margin-top: 30px;
564 margin-bottom: 30px;
565 }
566 .course-extra-box + .course-tabs {
567 margin-top: 30px;
568 }
569
570 input[name=course-extra-box-ratio] {
571 display: none;
572 }
573 input[name=course-extra-box-ratio]:checked + .course-extra-box .course-extra-box__content {
574 display: block;
575 }
576 input[name=course-extra-box-ratio]:checked + .course-extra-box .course-extra-box__content .course-extra-box__content-inner {
577 transform: scale(1);
578 }
579
580 @-webkit-keyframes course-extra-box__content-inner-transform {
581 from {
582 opacity: 0;
583 -webkit-transform: translateX(-5%);
584 transform: translateX(-5%);
585 }
586 to {
587 opacity: 1;
588 -webkit-transform: translateX(0%);
589 transform: translateX(0%);
590 }
591 }
592 @keyframes course-extra-box__content-inner-transform {
593 from {
594 opacity: 0;
595 transform: translateX(-5%);
596 }
597 to {
598 opacity: 1;
599 transform: translateX(0%);
600 }
601 }
602 .course-tab-panel-faqs .course-faqs-box {
603 margin-bottom: 20px;
604 border: 1px solid rgba(204, 204, 204, 0.6);
605 border-radius: 5px;
606 }
607 .course-tab-panel-faqs .course-faqs-box__title {
608 display: block;
609 position: relative;
610 margin: 0;
611 padding: 12px 20px 12px 45px;
612 font-size: 1em;
613 line-height: 1.5;
614 font-weight: var(--lp-font-weight-link, 600);
615 cursor: pointer;
616 }
617 .course-tab-panel-faqs .course-faqs-box__title::after {
618 position: absolute;
619 top: 12px;
620 left: 20px;
621 font-family: "lp-icon";
622 content: "\f067";
623 }
624 .course-tab-panel-faqs .course-faqs-box:last-child {
625 margin-bottom: 40px;
626 }
627 .course-tab-panel-faqs .course-faqs-box:hover .course-faqs-box__title {
628 color: var(--lp-primary-color);
629 }
630 .course-tab-panel-faqs .course-faqs-box__content {
631 display: none;
632 }
633 .course-tab-panel-faqs .course-faqs-box__content-inner {
634 padding: 20px;
635 -webkit-animation-name: course-faqs-box__content-inner-transform;
636 animation-name: course-faqs-box__content-inner-transform;
637 -webkit-animation-duration: 0.3s;
638 animation-duration: 0.3s;
639 -webkit-animation-timing-function: ease-in-out;
640 animation-timing-function: ease-in-out;
641 -webkit-animation-iteration-count: 1;
642 animation-iteration-count: 1;
643 -webkit-animation-direction: normal;
644 animation-direction: normal;
645 }
646
647 input[name=course-faqs-box-ratio] {
648 display: none;
649 }
650 input[name=course-faqs-box-ratio]:checked + .course-faqs-box .course-faqs-box__content {
651 display: block;
652 }
653 input[name=course-faqs-box-ratio]:checked + .course-faqs-box .course-faqs-box__title {
654 color: var(--lp-primary-color);
655 background: rgba(241, 242, 248, 0.4);
656 }
657 input[name=course-faqs-box-ratio]:checked + .course-faqs-box .course-faqs-box__title::after {
658 content: "\f068";
659 }
660
661 @-webkit-keyframes course-faqs-box__content-inner-transform {
662 from {
663 opacity: 0;
664 -webkit-transform: translateY(-5%);
665 transform: translateY(-5%);
666 }
667 to {
668 opacity: 1;
669 -webkit-transform: translateY(0%);
670 transform: translateY(0%);
671 }
672 }
673 @keyframes course-faqs-box__content-inner-transform {
674 from {
675 opacity: 0;
676 -webkit-transform: translateY(-5%);
677 transform: translateY(-5%);
678 }
679 to {
680 opacity: 1;
681 -webkit-transform: translateY(0%);
682 transform: translateY(0%);
683 }
684 }
685 .extra-box__title, .course-faqs__title, .course-material__title {
686 margin-top: 0;
687 margin-bottom: 12px;
688 }
689
690 .edit-content {
691 margin-right: 5px;
692 }
693
694 .course-curriculum ul.curriculum-sections {
695 position: relative;
696 margin: 0;
697 padding: 0;
698 list-style: none;
699 }
700 .course-curriculum ul.curriculum-sections .closed .section-item__loadmore {
701 display: none;
702 }
703 .course-curriculum ul.curriculum-sections .section {
704 margin: 0;
705 padding: 0;
706 flex-wrap: wrap;
707 }
708 .course-curriculum ul.curriculum-sections .section:last-child {
709 padding: 0;
710 }
711 .course-curriculum ul.curriculum-sections .section.section-empty .section-header {
712 margin-bottom: 20px;
713 }
714 .course-curriculum ul.curriculum-sections .section.section-empty .learn-press-message {
715 margin-left: 15px;
716 margin-right: 15px;
717 }
718 .course-curriculum ul.curriculum-sections .section-title.c + .section-desc {
719 display: block;
720 }
721 .course-curriculum ul.curriculum-sections .section-title.c span.show-desc::before {
722 -webkit-transform: rotate(-180deg);
723 transform: rotate(-180deg);
724 top: 0;
725 }
726 .course-curriculum ul.curriculum-sections .item-meta.duration {
727 background: #d9e0f1;
728 }
729 .course-curriculum .section-item__loadmore {
730 display: flex;
731 justify-content: center;
732 align-items: center;
733 }
734 .course-curriculum .section-item__loadmore button {
735 margin-top: 10px;
736 border: 1px solid var(--lp-border-color, #E2E0DB);
737 border-radius: var(--lp-border-radius, 5px);
738 padding: 8px 16px;
739 box-shadow: none;
740 outline: none;
741 }
742 .course-curriculum .section-item__loadmore.loading button:before {
743 position: absolute;
744 display: inline-block;
745 font-family: "lp-icon";
746 content: "\f110";
747 animation: lp-rotating 1s linear infinite;
748 font-variant: normal;
749 text-transform: none;
750 -webkit-font-smoothing: antialiased;
751 -moz-osx-font-smoothing: grayscale;
752 vertical-align: middle;
753 color: black;
754 }
755 .course-curriculum .section-header {
756 display: table;
757 width: 100%;
758 padding: 20px 0;
759 border-bottom: 0;
760 border-bottom: 1px solid #d9e0f1;
761 cursor: pointer;
762 -webkit-box-sizing: border-box;
763 box-sizing: border-box;
764 }
765 .course-curriculum .section-header .section-title, .course-curriculum .section-header .section-desc {
766 margin: 0;
767 }
768 .course-curriculum .section-header span.show-desc {
769 display: inline-block;
770 position: absolute;
771 top: 50%;
772 left: 30px;
773 width: 20px;
774 height: 20px;
775 transform: translate(0, -50%);
776 }
777 .course-curriculum .section-header span.show-desc::before {
778 font-family: "lp-icon";
779 font-size: 1.125em;
780 content: "\f107";
781 }
782 .course-curriculum .section-header span.show-desc:hover::before {
783 border-top-color: #ccc;
784 }
785 .course-curriculum .section-header .section-desc {
786 margin-top: 10px;
787 font-size: calc(var(--lp-font-size-base, 1em) * 0.925);
788 color: var(--lp-color-accent);
789 font-style: italic;
790 line-height: 1.3;
791 }
792 .course-curriculum .section-header .section-meta {
793 display: block;
794 padding-top: 17px;
795 padding-bottom: 15px;
796 font-size: 0.8em;
797 text-align: left;
798 vertical-align: middle;
799 white-space: nowrap;
800 }
801 .course-curriculum .section-item {
802 width: 100%;
803 }
804 .course-curriculum .section-content {
805 margin: 0;
806 padding: 0;
807 list-style: none;
808 }
809 .course-curriculum .section-content .course-item-meta {
810 display: table-cell;
811 text-align: left;
812 vertical-align: middle;
813 white-space: nowrap;
814 }
815 .course-curriculum .section-content .course-item-meta .item-meta {
816 display: inline-block;
817 color: #fff;
818 }
819 .course-curriculum .section-content .course-item-meta .item-meta.final-quiz {
820 background: #14c4ff;
821 }
822 .course-curriculum .section-content .course-item-meta .item-meta.trans {
823 padding: 0;
824 }
825 .course-curriculum .section-content .course-item-meta .count-questions {
826 background: #9672cf;
827 }
828 .course-curriculum .section-content .course-item-meta .duration {
829 background: #c0c0c0;
830 }
831 .course-curriculum .section-content .course-item-meta .course-item-status {
832 padding: 0;
833 color: #999;
834 }
835 .course-curriculum .section-content .course-item-meta .course-item-status::before {
836 font-family: "lp-icon";
837 content: "\f00c";
838 }
839 .course-curriculum .section-content .course-item-preview {
840 font-style: normal;
841 padding: 0;
842 }
843 .course-curriculum .section-content .course-item-preview::before {
844 font-family: "lp-icon";
845 content: "\f06e";
846 color: #999;
847 }
848 .course-curriculum .course-item {
849 display: flex;
850 position: relative;
851 margin: 0 0 2px 0;
852 padding: 0 16px;
853 background: rgba(241, 242, 248, 0.4);
854 transition: padding-right linear 0.15s;
855 }
856 .course-curriculum .course-item > span {
857 display: flex;
858 width: 28px;
859 color: #666;
860 font-weight: 300;
861 align-items: center;
862 }
863 .course-curriculum .course-item .section-item-link {
864 display: flex;
865 align-items: flex-start;
866 justify-content: space-between;
867 width: 100%;
868 padding: 12px 0;
869 color: inherit;
870 outline: none;
871 gap: 12px;
872 }
873 .course-curriculum .course-item .section-item-link:hover .item-name {
874 color: var(--lp-primary-color);
875 }
876 .course-curriculum .course-item .section-item-link::before {
877 color: var(--lp-primary-color);
878 font-family: "lp-icon";
879 }
880 .course-curriculum .course-item .section-item-link .course-item-info {
881 width: 100%;
882 }
883 .course-curriculum .course-item .section-item-link .course-item-info .course-item-info-pre {
884 display: flex;
885 flex-flow: row-reverse;
886 justify-content: flex-end;
887 gap: 16px;
888 align-items: center;
889 font-size: calc(var(--lp-font-size-base, 1em) * 0.925);
890 }
891 .course-curriculum .course-item .section-item-link .course-item-info .course-item-info-pre .item-meta.duration {
892 background: transparent;
893 }
894 .course-curriculum .course-item .item-name {
895 font-weight: 600;
896 }
897 .course-curriculum .course-item.course-item-lp_quiz .section-item-link::before {
898 content: "\f059";
899 }
900 .course-curriculum .course-item.course-item-lp_assignment .section-item-link::before {
901 content: "\e929" !important;
902 }
903 .course-curriculum .course-item.course-item.course-item-lp_h5p .section-item-link::before {
904 content: "\e92a" !important;
905 }
906 .course-curriculum .course-item.course-item-lp_lesson .section-item-link::before {
907 content: "\f15b";
908 }
909 .course-curriculum .course-item.course-item-lp_lesson.course-item-type-video .section-item-link::before {
910 content: "\f03d";
911 }
912 .course-curriculum .course-item.course-item-lp_lesson.course-item-type-audio .section-item-link::before {
913 content: "\f028";
914 }
915 .course-curriculum .course-item.item-locked .course-item-status::before {
916 color: var(--lp-secondary-color);
917 content: "\f023";
918 }
919 .course-curriculum .course-item.has-status {
920 padding-top: 1px;
921 }
922 .course-curriculum .course-item.has-status.status-completed .course-item-status::before, .course-curriculum .course-item.has-status.status-evaluated .course-item-status::before {
923 color: #3bb54a;
924 }
925 .course-curriculum .course-item.has-status.item-failed .course-item-status::before, .course-curriculum .course-item.has-status.failed .course-item-status::before {
926 border-color: #f02425;
927 color: #f02425;
928 content: "\f00d";
929 }
930 .course-curriculum .course-item::before {
931 position: absolute;
932 top: 50%;
933 right: 0;
934 width: 3px;
935 height: 0;
936 background: #00adff;
937 content: "";
938 transition: height linear 0.15s, top linear 0.15s;
939 }
940 .course-curriculum .course-item.current {
941 background: #f9f9f9;
942 }
943 .course-curriculum .course-item.current a::before {
944 right: 10px;
945 }
946 .course-curriculum .course-item.current::before {
947 top: 0;
948 height: 100%;
949 }
950 .course-curriculum .section-left {
951 vertical-align: top;
952 }
953 .course-curriculum .section-left .section-title {
954 font-weight: 700;
955 font-size: calc(var(--lp-font-size-base, 1em) * 1.25);
956 text-transform: capitalize;
957 display: block;
958 }
959 .course-curriculum .curriculum-more__button {
960 border: 1px solid var(--lp-border-color, #E2E0DB);
961 border-radius: var(--lp-border-radius, 5px);
962 padding: 8px 16px;
963 box-shadow: none;
964 outline: none;
965 width: 100%;
966 margin-top: 20px;
967 margin-bottom: 20px;
968 }
969 .course-curriculum .curriculum-more__button.loading:before {
970 position: absolute;
971 display: inline-block;
972 font-family: "lp-icon";
973 content: "\f110";
974 animation: lp-rotating 1s linear infinite;
975 font-variant: normal;
976 text-transform: none;
977 -webkit-font-smoothing: antialiased;
978 -moz-osx-font-smoothing: grayscale;
979 vertical-align: middle;
980 color: black;
981 }
982
983 body .content-item-summary .form-button-finish-course, body .lp-quiz-buttons .form-button-finish-course {
984 float: left;
985 }
986
987 #wpadminbar #wp-admin-bar-edit-lp_quiz .ab-item::before, #wpadminbar #wp-admin-bar-edit-lp_lesson .ab-item::before, #wpadminbar #wp-admin-bar-edit-lp_question .ab-item::before {
988 top: 2px;
989 font-family: "lp-icon";
990 }
991 #wpadminbar #wp-admin-bar-edit-lp_quiz .ab-item::before {
992 content: "\f017";
993 }
994 #wpadminbar #wp-admin-bar-edit-lp_lesson .ab-item::before {
995 content: "\f15c";
996 }
997 #wpadminbar #wp-admin-bar-edit-lp_question .ab-item::before {
998 content: "\f29c";
999 }
1000
1001 .course-remaining-time .label-enrolled {
1002 font-size: inherit;
1003 }
1004
1005 .lp-course-progress {
1006 position: relative;
1007 }
1008 .lp-course-progress .lp-passing-conditional {
1009 position: absolute;
1010 top: 0;
1011 width: 3px;
1012 height: 6px;
1013 margin-right: -1px;
1014 background: var(--lp-secondary-color);
1015 }
1016
1017 .viewing-course-item .section-header .section-desc {
1018 display: none;
1019 }
1020
1021 .lp-course-curriculum ul, .lp-course-curriculum li {
1022 list-style: none;
1023 margin: 0;
1024 padding: 0;
1025 }
1026 .lp-course-curriculum .course-curriculum-info {
1027 display: flex;
1028 justify-content: space-between;
1029 gap: 20px;
1030 margin-bottom: 20px;
1031 }
1032 .lp-course-curriculum .course-curriculum-info__left {
1033 display: flex;
1034 align-items: center;
1035 flex-wrap: wrap;
1036 gap: 8px;
1037 }
1038 .lp-course-curriculum .course-curriculum-info__left li {
1039 display: inline-flex;
1040 align-items: center;
1041 gap: 8px;
1042 }
1043 .lp-course-curriculum .course-curriculum-info__left li::after {
1044 content: "";
1045 width: 4px;
1046 height: 4px;
1047 background-color: var(--lp-border-color, #E2E0DB);
1048 display: inline-block;
1049 }
1050 .lp-course-curriculum .course-curriculum-info__left li:last-child::after {
1051 content: none;
1052 }
1053 .lp-course-curriculum .course-curriculum-info__right {
1054 font-weight: var(--lp-font-weight-link, 600);
1055 text-align: left;
1056 text-transform: capitalize;
1057 }
1058 .lp-course-curriculum .course-toggle-all-sections {
1059 cursor: pointer;
1060 }
1061 .lp-course-curriculum .course-section {
1062 margin-bottom: 8px;
1063 border: 1px solid var(--lp-border-color, #E2E0DB);
1064 border-radius: var(--lp-border-radius, 5px);
1065 cursor: pointer;
1066 overflow: hidden;
1067 }
1068 .lp-course-curriculum .course-section.lp-collapse .course-section__items {
1069 display: none;
1070 animation: ease-in-out;
1071 }
1072 .lp-course-curriculum .course-section.lp-collapse .lp-icon-angle-up {
1073 display: none;
1074 }
1075 .lp-course-curriculum .course-section.lp-collapse .lp-icon-angle-down {
1076 display: block;
1077 }
1078 .lp-course-curriculum .course-section .lp-icon-angle-down {
1079 display: none;
1080 }
1081 .lp-course-curriculum .course-section:last-child {
1082 margin-bottom: 0;
1083 }
1084 .lp-course-curriculum .course-section .course-section-header {
1085 background-color: var(--lp-white-grey, #F7F7FB);
1086 padding: 20px;
1087 column-gap: 12px;
1088 display: flex;
1089 justify-content: space-between;
1090 }
1091 .lp-course-curriculum .course-section__title {
1092 font-weight: 600;
1093 font-size: 1.1em;
1094 line-height: 1.3em;
1095 }
1096 .lp-course-curriculum .course-section__description {
1097 margin: 4px 0 0 0;
1098 }
1099 .lp-course-curriculum .course-section .section-toggle {
1100 line-height: 1;
1101 }
1102 .lp-course-curriculum .course-section .section-toggle i {
1103 font-size: 24px;
1104 }
1105 .lp-course-curriculum .course-section .course-section-info {
1106 margin-right: 0;
1107 margin-left: auto;
1108 }
1109 .lp-course-curriculum .course-section .section-count-items {
1110 min-width: 24px;
1111 font-weight: 600;
1112 text-align: center;
1113 line-height: 1.3;
1114 white-space: nowrap;
1115 }
1116 .lp-course-curriculum .course-section .course-item {
1117 background-color: transparent;
1118 border-top: 1px solid var(--lp-border-color, #E2E0DB);
1119 padding: 12px 20px;
1120 margin: 0;
1121 }
1122 .lp-course-curriculum .course-section .course-item__link {
1123 display: flex;
1124 justify-content: space-between;
1125 width: 100%;
1126 column-gap: 12px;
1127 row-gap: 8px;
1128 position: relative;
1129 align-items: flex-start;
1130 color: inherit;
1131 }
1132 .lp-course-curriculum .course-section .course-item__info {
1133 display: flex;
1134 column-gap: 12px;
1135 row-gap: 8px;
1136 }
1137 .lp-course-curriculum .course-section .course-item__info .course-item-ico {
1138 min-width: 16px;
1139 }
1140 .lp-course-curriculum .course-section .course-item__content {
1141 display: flex;
1142 justify-content: space-between;
1143 column-gap: 12px;
1144 row-gap: 8px;
1145 align-items: baseline;
1146 flex: 1;
1147 }
1148 @media (max-width: 1024px) {
1149 .lp-course-curriculum .course-section .course-item__content {
1150 flex-wrap: wrap;
1151 }
1152 }
1153 .lp-course-curriculum .course-section .course-item__left:hover {
1154 color: var(--lp-primary-color, #ffb606);
1155 }
1156 .lp-course-curriculum .course-section .course-item__right {
1157 display: flex;
1158 column-gap: 12px;
1159 row-gap: 8px;
1160 align-items: center;
1161 flex: none;
1162 color: var(--lp-color-meta, #8a8a8a);
1163 flex-wrap: wrap;
1164 flex-direction: row-reverse;
1165 justify-content: flex-end;
1166 }
1167 @media (max-width: 1024px) {
1168 .lp-course-curriculum .course-section .course-item__right {
1169 width: 100%;
1170 order: 3;
1171 }
1172 }
1173 .lp-course-curriculum .course-section .course-item__status .course-item-ico {
1174 width: 24px;
1175 display: flex;
1176 justify-content: center;
1177 }
1178 .lp-course-curriculum .course-section .course-item-ico::before {
1179 content: "";
1180 display: inline-block;
1181 font-family: "lp-icon";
1182 font-weight: normal;
1183 }
1184 .lp-course-curriculum .course-section .course-item-ico.lp_lesson::before {
1185 content: "\f15b";
1186 }
1187 .lp-course-curriculum .course-section .course-item-ico.lp_quiz::before {
1188 content: "\f12e";
1189 }
1190 .lp-course-curriculum .course-section .course-item-ico.lp_assignment::before {
1191 content: "\e929";
1192 }
1193 .lp-course-curriculum .course-section .course-item-ico.lp_h5p::before {
1194 content: "\e92a";
1195 }
1196 .lp-course-curriculum .course-section .course-item-ico.preview::before {
1197 content: "\f06e";
1198 color: #999;
1199 }
1200 .lp-course-curriculum .course-section .course-item-ico.locked::before {
1201 content: "\f023";
1202 color: #999;
1203 }
1204 .lp-course-curriculum .course-section .course-item-ico.passed.completed::before {
1205 content: "\f00c";
1206 color: #3bb54a;
1207 }
1208 .lp-course-curriculum .course-section .course-item-ico.in-progress::before, .lp-course-curriculum .course-section .course-item-ico.completed::before {
1209 content: "\f00c";
1210 color: #999;
1211 }
1212 .lp-course-curriculum .course-section .course-item-ico.failed.completed::before {
1213 content: "\f00d";
1214 color: #f02425;
1215 }
1216 .lp-course-curriculum .course-section .course-item-ico.started::before {
1217 content: "\f00c";
1218 color: #999;
1219 }
1220 .lp-course-curriculum .course-section .course-item-ico.doing::before {
1221 content: "\e921";
1222 color: #999;
1223 }
1224
1225 .info-learning .course-progress > div {
1226 margin-bottom: 8px;
1227 }
1228 .info-learning .course-progress__line {
1229 width: 100%;
1230 background: #ccc;
1231 height: 5px;
1232 border-radius: 5px;
1233 position: relative;
1234 }
1235 .info-learning .course-progress__line__active {
1236 background: var(--lp-primary-color);
1237 height: 100%;
1238 border-radius: 5px;
1239 position: absolute;
1240 top: 0;
1241 right: 0;
1242 }
1243 .info-learning .course-progress__line__active {
1244 background: var(--lp-primary-color);
1245 height: 100%;
1246 border-radius: 5px;
1247 position: absolute;
1248 top: 0;
1249 right: 0;
1250 }
1251 .info-learning .course-progress__line__point {
1252 position: absolute;
1253 top: 0;
1254 width: 2px;
1255 height: 100%;
1256 background: var(--lp-secondary-color);
1257 }
1258 .info-learning .start-date, .info-learning .end-date {
1259 margin-bottom: 8px;
1260 }
1261
1262 .lp-single-course .comment-form .comment-form-url,
1263 .lp-single-course .comment-form .comment-form-email,
1264 .lp-single-course .comment-form .comment-form-author,
1265 .lp-single-course .comment-form .comment-form-comment, .wp-block-learnpress-course-comment .comment-form .comment-form-url,
1266 .wp-block-learnpress-course-comment .comment-form .comment-form-email,
1267 .wp-block-learnpress-course-comment .comment-form .comment-form-author,
1268 .wp-block-learnpress-course-comment .comment-form .comment-form-comment {
1269 display: flex;
1270 flex-direction: column;
1271 gap: 1rem;
1272 }
1273 .lp-single-course .comment-form input[type=url],
1274 .lp-single-course .comment-form input[type=text],
1275 .lp-single-course .comment-form input[type=email],
1276 .lp-single-course .comment-form textarea, .wp-block-learnpress-course-comment .comment-form input[type=url],
1277 .wp-block-learnpress-course-comment .comment-form input[type=text],
1278 .wp-block-learnpress-course-comment .comment-form input[type=email],
1279 .wp-block-learnpress-course-comment .comment-form textarea {
1280 padding: 12px 20px;
1281 outline: none;
1282 border: 1px solid var(--lp-border-color, #E2E0DB);
1283 border-radius: var(--lp-border-radius, 5px);
1284 }
1285 .lp-single-course .comment-form input[type=submit], .wp-block-learnpress-course-comment .comment-form input[type=submit] {
1286 border-radius: var(--lp-border-radius, 5px);
1287 }
1288
1289 /*
1290 Css for Block of Gutenberg
1291 */
1292 /**
1293 * Styles for all page of Block LP
1294 *
1295 * @since 4.2.3
1296 * @version 1.0.0
1297 */
1298 .lp-ico svg {
1299 width: 20px;
1300 height: 20px;
1301 }
1302
1303 .lp-hidden {
1304 display: none !important;
1305 }
1306
1307 .course-price .origin-price {
1308 text-decoration: line-through;
1309 margin-left: 4px;
1310 font-size: calc(var(--lp-font-size-base, 1em) * 0.925);
1311 opacity: 0.6;
1312 }
1313
1314 [class*=wp-block-learnpress] img,
1315 .block-editor-block-list__block img {
1316 max-width: 100%;
1317 height: auto;
1318 }
1319 [class*=wp-block-learnpress] .info-meta-item,
1320 .block-editor-block-list__block .info-meta-item {
1321 display: flex;
1322 gap: 4px;
1323 flex-wrap: wrap;
1324 }
1325 [class*=wp-block-learnpress] .info-meta-item i,
1326 .block-editor-block-list__block .info-meta-item i {
1327 color: var(--lp-primary-color, #ffb606);
1328 }
1329 [class*=wp-block-learnpress] .info-meta-left,
1330 .block-editor-block-list__block .info-meta-left {
1331 display: flex;
1332 gap: 8px;
1333 align-items: center;
1334 letter-spacing: 0;
1335 }
1336 [class*=wp-block-learnpress] a,
1337 .block-editor-block-list__block a {
1338 text-decoration: none;
1339 }
1340
1341 .wp-block-learnpress-course-image {
1342 overflow: hidden;
1343 }
1344
1345 .wp-block-learnpress-course-instructor > div > *,
1346 .wp-block-learnpress-course-categories > div > * {
1347 display: inline;
1348 vertical-align: middle;
1349 }
1350
1351 /*
1352 Breadcrumb
1353 */
1354 .wp-block-learnpress-breadcrumb ul {
1355 margin: 0 auto;
1356 list-style: none;
1357 padding: 0;
1358 }
1359 .wp-block-learnpress-breadcrumb li {
1360 display: inline-block;
1361 margin: 0;
1362 }
1363 .wp-block-learnpress-breadcrumb i {
1364 margin: 0 8px;
1365 }
1366 .wp-block-learnpress-breadcrumb a {
1367 color: inherit;
1368 }
1369
1370 .courses-btn-load-more {
1371 padding: 8px 24px;
1372 border-radius: var(--lp-border-radius, 5px);
1373 color: var(--lp-color-base, #333);
1374 border: 1px solid var(--lp-color-base, #333);
1375 font-size: var(--lp-font-size-base, 1em);
1376 transition: all 0.3s;
1377 display: block;
1378 background: transparent;
1379 text-decoration: none;
1380 text-align: center;
1381 cursor: pointer;
1382 margin: 20px auto;
1383 }
1384 .courses-btn-load-more:hover {
1385 background: var(--lp-primary-color, #ffb606);
1386 color: var(--lp-color-white, #fff);
1387 border-color: var(--lp-primary-color, #ffb606);
1388 }
1389
1390 .lp-overlay {
1391 display: none;
1392 position: fixed;
1393 z-index: 99999;
1394 top: 0;
1395 left: 0;
1396 bottom: 0;
1397 right: 0;
1398 width: 100%;
1399 height: 100%;
1400 background-color: rgba(209, 213, 219, 0.8);
1401 transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
1402 transition-duration: 150ms;
1403 transition-property: opacity;
1404 }
1405
1406 .lp-modal-dialog {
1407 display: flex;
1408 position: fixed;
1409 z-index: 9999;
1410 top: 0;
1411 left: 0;
1412 right: 0;
1413 width: 100%;
1414 min-height: 100vh;
1415 text-align: center;
1416 align-items: center;
1417 justify-content: center;
1418 /*.lp-button {
1419 cursor: pointer;
1420 border: 1px solid $border-color;
1421 border-radius: $border-radius-global;
1422 padding: $spacing-base-2x $spacing-base-4x;
1423
1424 &.loading {
1425 pointer-events: none;
1426 opacity: 0.8;
1427 @include loading();
1428 }
1429
1430 &:hover {
1431 border-color: $color-primary;
1432 color: #fff;
1433 background: $color-primary;
1434 }
1435 }*/
1436 }
1437 .lp-modal-dialog .learn-press-message {
1438 width: auto;
1439 margin: 0 !important;
1440 }
1441 .lp-modal-dialog .lp-modal-content {
1442 display: inline-block;
1443 overflow: hidden;
1444 z-index: 2;
1445 width: auto;
1446 max-width: 600px;
1447 border-radius: 8px;
1448 text-align: right;
1449 vertical-align: middle;
1450 background: white;
1451 color: black;
1452 }
1453 .lp-modal-dialog .lp-modal-content h2,
1454 .lp-modal-dialog .lp-modal-content h3 {
1455 margin: 0;
1456 }
1457 .lp-modal-dialog .lp-modal-content .lp-group-step h3 {
1458 border-bottom: 1px solid #eee;
1459 }
1460 .lp-modal-dialog .lp-modal-content .main-content .terms-upgrade .pd-2em {
1461 padding: 0 1em;
1462 }
1463 .lp-modal-dialog .lp-modal-header {
1464 background: #7c60d9;
1465 border-bottom: 1px solid #eee;
1466 padding: 1em;
1467 }
1468 .lp-modal-dialog .lp-modal-header h3 {
1469 margin: 0;
1470 color: white;
1471 font-weight: 400;
1472 }
1473 .lp-modal-dialog .lp-modal-body .main-content {
1474 max-height: 500px;
1475 overflow: auto;
1476 overscroll-behavior: contain;
1477 }
1478 .lp-modal-dialog .lp-modal-body .main-content h3,
1479 .lp-modal-dialog .lp-modal-body .main-content h2,
1480 .lp-modal-dialog .lp-modal-body .main-content .pd-2em {
1481 padding: 1em;
1482 }
1483 .lp-modal-dialog .lp-modal-footer {
1484 padding: 20px;
1485 background-color: #f9fafb;
1486 text-align: left;
1487 }
1488 .lp-modal-dialog .btn-yes {
1489 color: #fff;
1490 background-color: #7c60d9;
1491 }
1492 .lp-modal-dialog .lp_allow_repurchase_select {
1493 padding: 20px;
1494 background: #f7f7f7;
1495 }
1496 .lp-modal-dialog .lp_allow_repurchase_select > ul {
1497 margin: 0;
1498 padding: 0;
1499 list-style: none;
1500 }
1501 .lp-modal-dialog .lp_allow_repurchase_select > ul li label {
1502 display: flex;
1503 align-items: center;
1504 gap: 10px;
1505 }
1506
1507 .lp-button.btn-finish-course {
1508 cursor: pointer;
1509 width: 100%;
1510 padding: 12px 24px;
1511 background-color: var(--lp-primary-color, #ffb606);
1512 border-width: 0;
1513 border-radius: var(--lp-border-radius, 5px);
1514 border-color: var(--lp-primary-color, #ffb606);
1515 color: var(--lp-color-white, #fff);
1516 font-size: var(--lp-font-size-base, 1em);
1517 text-align: center;
1518 text-decoration: none;
1519 -webkit-transition: all 0.25s;
1520 transition: all 0.25s;
1521 }
1522 .lp-button.btn-finish-course:hover {
1523 background-color: var(--lp-secondary-color, #442e66);
1524 border-color: var(--lp-secondary-color, #442e66);
1525 }
1526
1527 /**
1528 * Mixin
1529 */
1530 @keyframes rotating4 {
1531 from {
1532 transform: rotate(0deg);
1533 }
1534 to {
1535 transform: rotate(-360deg);
1536 }
1537 }
1538 @keyframes animation4 {
1539 from {
1540 right: -40%;
1541 width: 40%;
1542 }
1543 to {
1544 right: 100%;
1545 width: 10%;
1546 }
1547 }
1548 :root {
1549 --lp-cotainer-max-with: var(--lp-container-max-width);
1550 }
1551
1552 .wp-block-group {
1553 --lp-container-max-width: var(--wp--style--global--wide-size);
1554 }
1555
1556 .c-gap-4 {
1557 column-gap: 4px;
1558 }
1559
1560 .wp-block-learnpress-course-feature-review .featured-review__title {
1561 font-weight: var(--lp-font-weight-link, 600);
1562 font-size: calc(var(--lp-font-size-base, 1em) * 1.25);
1563 }
1564
1565 [class^=wp-block-learnpress] .extra-box ul {
1566 margin: 0 20px 0 0;
1567 padding: 0;
1568 }
1569
1570 .wp-block-learnpress-course-button-read-more,
1571 .wp-block-learnpress-course-button {
1572 cursor: pointer;
1573 padding: 12px 24px;
1574 background-color: var(--lp-primary-color, #ffb606);
1575 border-width: 0;
1576 border-radius: var(--lp-border-radius, 5px);
1577 border-color: var(--lp-primary-color, #ffb606);
1578 color: var(--lp-color-white, #fff);
1579 font-size: var(--lp-font-size-base, 1em);
1580 text-align: center;
1581 text-decoration: none;
1582 -webkit-transition: all 0.25s;
1583 transition: all 0.25s;
1584 }
1585 .wp-block-learnpress-course-button-read-more:hover,
1586 .wp-block-learnpress-course-button:hover {
1587 background-color: var(--lp-secondary-color, #442e66);
1588 border-color: var(--lp-secondary-color, #442e66);
1589 }
1590 .wp-block-learnpress-course-button-read-more.loading,
1591 .wp-block-learnpress-course-button.loading {
1592 pointer-events: none;
1593 opacity: 0.8;
1594 }
1595 .wp-block-learnpress-course-button-read-more.loading:before,
1596 .wp-block-learnpress-course-button.loading:before {
1597 position: absolute;
1598 display: inline-block;
1599 font-family: "lp-icon";
1600 content: "\f110";
1601 animation: lp-rotating 1s linear infinite;
1602 font-variant: normal;
1603 text-transform: none;
1604 -webkit-font-smoothing: antialiased;
1605 -moz-osx-font-smoothing: grayscale;
1606 vertical-align: middle;
1607 color: black;
1608 }
1609
1610 @media (min-width: 992px) {
1611 .lp-block-course-sidebar {
1612 margin-top: -260px;
1613 margin-block-start: -260px !important;
1614 }
1615 }
1616 .wp-block-learnpress-item-search .search-course {
1617 display: flex;
1618 position: relative;
1619 height: 70px;
1620 background: var(--lp-white-grey, #F7F7FB);
1621 }
1622 .wp-block-learnpress-item-search .search-course input[name=s] {
1623 display: block;
1624 width: 100%;
1625 margin-right: 30px;
1626 border: none;
1627 color: var(--lp-color-base, #333);
1628 background: transparent;
1629 box-shadow: none;
1630 height: auto;
1631 -webkit-box-sizing: border-box;
1632 box-sizing: border-box;
1633 }
1634 .wp-block-learnpress-item-search .search-course input[name=s]::placeholder {
1635 color: #999;
1636 }
1637 .wp-block-learnpress-item-search .search-course input[name=s]::placeholder {
1638 font-style: italic;
1639 }
1640 .wp-block-learnpress-item-search .search-course input[name=s]:focus {
1641 outline: 0;
1642 }
1643 .wp-block-learnpress-item-search .search-course button {
1644 position: absolute;
1645 top: 0;
1646 left: 10px;
1647 height: 70px;
1648 padding: 0 16px;
1649 border: 0;
1650 background: transparent;
1651 line-height: 1px;
1652 box-shadow: none;
1653 }
1654 .wp-block-learnpress-item-search .search-course button:focus {
1655 outline: none;
1656 }
1657 .wp-block-learnpress-item-search .search-course button i {
1658 color: var(--lp-color-accent, #666);
1659 }
1660 .wp-block-learnpress-item-search .search-course button.clear {
1661 display: none;
1662 }
1663 .wp-block-learnpress-item-search .search-course button.clear::before {
1664 content: "\f00d";
1665 }
1666
1667 .wp-block-learnpress-course-material .lp-button {
1668 padding: 12px 24px;
1669 border: 1px solid var(--lp-border-color, #E2E0DB);
1670 color: var(--lp-color-base, #333);
1671 background: transparent;
1672 box-shadow: unset;
1673 font-family: inherit;
1674 font-weight: 400;
1675 text-align: center;
1676 text-transform: capitalize;
1677 border-radius: var(--lp-border-radius, 5px);
1678 margin-top: 20px;
1679 -webkit-transition: all 0.25s;
1680 transition: all 0.25s;
1681 }
1682 .wp-block-learnpress-course-material .course-material-table {
1683 width: 100%;
1684 display: table;
1685 border-spacing: 0;
1686 border-collapse: collapse;
1687 }
1688 .wp-block-learnpress-course-material .course-material-table tbody tr:nth-child(even) td,
1689 .wp-block-learnpress-course-material .course-material-table .learnpress table tfoot tr:nth-child(even) td {
1690 background: var(--tb-even-color, #fafafa);
1691 }
1692 .wp-block-learnpress-course-material .course-material-table thead {
1693 box-sizing: border-box;
1694 border: 1px solid var(--lp-border-color, #e2e0db);
1695 }
1696 .wp-block-learnpress-course-material .course-material-table th,
1697 .wp-block-learnpress-course-material .course-material-table td {
1698 padding: 0.7em 1em;
1699 border: 1px solid var(--lp-border-color, #e2e0db);
1700 background: #fff;
1701 }
1702 .wp-block-learnpress-course-material .course-material-table th {
1703 border-bottom: none;
1704 background: var(--lp-white-grey, #f7f7fb);
1705 font-weight: 600;
1706 text-align: center;
1707 }
1708 .wp-block-learnpress-course-material .course-material-table th:first-child {
1709 text-align: right;
1710 }
1711 .wp-block-learnpress-course-material .course-material-table tr td {
1712 border: 1px solid var(--lp-border-color, #e2e0db);
1713 line-height: 1.4;
1714 }
1715 .wp-block-learnpress-course-material .course-material-table tr td:not(:first-child) {
1716 text-align: center;
1717 }
1718 .wp-block-learnpress-course-material .course-material-table tfoot td {
1719 text-align: right;
1720 font-weight: bold;
1721 }
1722 .wp-block-learnpress-course-material .course-material-table.searching button:before {
1723 display: inline-block;
1724 content: "\f110";
1725 animation: lp-rotating 1s linear infinite;
1726 }
1727
1728 .wp-block-learnpress-item-hidden-sidebar .section-toggle {
1729 justify-content: flex-end;
1730 flex: 0;
1731 }
1732 .wp-block-learnpress-item-hidden-sidebar .section-toggle i {
1733 color: var(--lp-color-accent, #666);
1734 }
1735
1736 .wp-block-learnpress-item-close .back-course {
1737 padding: 24px;
1738 line-height: 70px;
1739 background: rgba(255, 255, 255, 0.1);
1740 color: #fff;
1741 }
1742 .wp-block-learnpress-item-close .back-course:hover {
1743 background: rgba(255, 255, 255, 0.15);
1744 }
1745 @media (max-width: 768px) {
1746 .wp-block-learnpress-item-close .back-course {
1747 background: transparent;
1748 opacity: 0.6;
1749 padding-right: 15px;
1750 padding-left: 15px;
1751 }
1752 .wp-block-learnpress-item-close .back-course:hover {
1753 background: transparent;
1754 opacity: 1;
1755 }
1756 }
1757
1758 .wp-block-learnpress-item-hidden-sidebar #sidebar-toggle {
1759 display: inline-block;
1760 width: 32px;
1761 min-width: 32px;
1762 line-height: 70px;
1763 height: unset;
1764 margin: 0;
1765 background: rgba(255, 255, 255, 0.1);
1766 color: var(--lp-color-white, #fff);
1767 font-size: 1.4em;
1768 cursor: pointer;
1769 transition: 0.25s;
1770 -webkit-appearance: none;
1771 border: none;
1772 text-align: center;
1773 }
1774 .wp-block-learnpress-item-hidden-sidebar #sidebar-toggle:after {
1775 display: none;
1776 }
1777 .wp-block-learnpress-item-hidden-sidebar #sidebar-toggle::before {
1778 display: inline-block;
1779 position: static;
1780 margin: 0;
1781 width: auto;
1782 height: auto;
1783 font-family: "lp-icon";
1784 content: "\f0d9";
1785 }
1786 .wp-block-learnpress-item-hidden-sidebar #sidebar-toggle:focus {
1787 border: 0;
1788 outline: 0;
1789 }
1790
1791 .wp-block-learnpress-item-progress .items-progress {
1792 display: flex;
1793 justify-content: center;
1794 align-items: center;
1795 column-gap: 10px;
1796 white-space: nowrap;
1797 }
1798 .wp-block-learnpress-item-progress .number {
1799 padding-left: 10px;
1800 font-size: calc(var(--lp-font-size-base, 1em) * 0.86);
1801 }
1802 .wp-block-learnpress-item-progress .learn-press-progress {
1803 overflow: hidden;
1804 position: relative;
1805 width: 80px;
1806 height: 6px;
1807 border-radius: 3px;
1808 }
1809 .wp-block-learnpress-item-progress .learn-press-progress .progress-bg {
1810 overflow: hidden;
1811 position: relative;
1812 height: 6px;
1813 background: #ccc;
1814 border-radius: 5px;
1815 }
1816 .wp-block-learnpress-item-progress .learn-press-progress .progress-bg .progress-active {
1817 position: absolute;
1818 right: 50%;
1819 width: 100%;
1820 height: 100%;
1821 margin-right: -100%;
1822 background: var(--lp-primary-color, #ffb606);
1823 border-radius: 5px;
1824 }
1825 .wp-block-learnpress-item-progress .learn-press-progress .learn-press-progress__active {
1826 position: absolute;
1827 z-index: 1;
1828 right: -100%;
1829 width: 100%;
1830 height: 100%;
1831 border-radius: 3px;
1832 background: var(--lp-primary-color, #ffb606);
1833 -webkit-transition: 0.5s;
1834 transition: 0.5s;
1835 }
1836 .wp-block-learnpress-item-progress .learn-press-progress::before {
1837 display: block;
1838 position: absolute;
1839 z-index: 0;
1840 top: 0;
1841 width: 100%;
1842 height: 100%;
1843 background: #ccc;
1844 content: "";
1845 }
1846
1847 .wp-block-learnpress-item-navigation .course-item-nav {
1848 display: flex;
1849 justify-content: space-between;
1850 }
1851 .wp-block-learnpress-item-navigation .course-item-nav .prev,
1852 .wp-block-learnpress-item-navigation .course-item-nav .next {
1853 display: flex;
1854 line-height: 3.125em;
1855 flex: 1;
1856 position: relative;
1857 }
1858 .wp-block-learnpress-item-navigation .course-item-nav .prev span,
1859 .wp-block-learnpress-item-navigation .course-item-nav .next span {
1860 display: block;
1861 font-weight: bold;
1862 }
1863 .wp-block-learnpress-item-navigation .course-item-nav .prev a,
1864 .wp-block-learnpress-item-navigation .course-item-nav .next a {
1865 display: block;
1866 color: var(--lp-color-accent, #666);
1867 color: #999;
1868 }
1869 .wp-block-learnpress-item-navigation .course-item-nav .prev::before,
1870 .wp-block-learnpress-item-navigation .course-item-nav .next::before {
1871 color: #999;
1872 font-family: "lp-icon";
1873 }
1874 .wp-block-learnpress-item-navigation .course-item-nav .prev:hover a, .wp-block-learnpress-item-navigation .course-item-nav .prev:hover::before,
1875 .wp-block-learnpress-item-navigation .course-item-nav .next:hover a,
1876 .wp-block-learnpress-item-navigation .course-item-nav .next:hover::before {
1877 color: var(--lp-primary-color, #ffb606);
1878 }
1879 .wp-block-learnpress-item-navigation .course-item-nav .prev:hover .course-item-nav__name,
1880 .wp-block-learnpress-item-navigation .course-item-nav .next:hover .course-item-nav__name {
1881 display: block;
1882 }
1883 .wp-block-learnpress-item-navigation .course-item-nav .next {
1884 text-align: left;
1885 flex-direction: row-reverse;
1886 }
1887 .wp-block-learnpress-item-navigation .course-item-nav .next::before {
1888 margin-right: 10px;
1889 content: "\f0da";
1890 }
1891 .wp-block-learnpress-item-navigation .course-item-nav .next[data-nav=next] {
1892 justify-content: flex-end;
1893 }
1894 .wp-block-learnpress-item-navigation .prev::before {
1895 margin-left: 10px;
1896 content: "\f0d9";
1897 }
1898 .wp-block-learnpress-item-navigation .prev .course-item-nav__name {
1899 left: auto;
1900 right: -30px;
1901 }
1902 .wp-block-learnpress-item-navigation .prev .course-item-nav__name::before {
1903 left: auto;
1904 right: 5px;
1905 }
1906 @media (max-width: 1024px) {
1907 .wp-block-learnpress-item-navigation .prev .course-item-nav__name {
1908 right: 15px;
1909 }
1910 }
1911 .wp-block-learnpress-item-navigation .course-item-nav__name {
1912 display: none;
1913 position: absolute;
1914 top: -20px;
1915 left: -30px;
1916 width: auto;
1917 padding: 10px 15px;
1918 color: var(--lp-color-accent, #666);
1919 background: #ccc;
1920 font-size: calc(var(--lp-font-size-base, 1em) * 0.925);
1921 line-height: 1;
1922 }
1923 @media (max-width: 1024px) {
1924 .wp-block-learnpress-item-navigation .course-item-nav__name {
1925 top: -25px;
1926 left: 15px;
1927 right: auto;
1928 }
1929 }
1930
1931 .wp-block-learnpress-item-curriculum .lp-course-curriculum__title,
1932 .wp-block-learnpress-item-curriculum .course-curriculum-info,
1933 .wp-block-learnpress-item-curriculum .course-section__description {
1934 display: none;
1935 }
1936
1937 .wp-block-learnpress-item-content .content-item-wrap {
1938 padding: 0;
1939 }
1940
1941 .wp-block-learnpress-item-curriculum .lp-course-curriculum .course-section .course-item__content {
1942 display: flex;
1943 justify-content: space-between;
1944 column-gap: 12px;
1945 row-gap: 8px;
1946 align-items: baseline;
1947 flex: 1;
1948 flex-direction: row;
1949 }
1950
1951 .wp-block-learnpress-list-courses .learn-press-courses .course {
1952 width: unset;
1953 padding: 0;
1954 }
1955
1956 .wp-block-learnpress-course-featured .course-featured {
1957 margin-bottom: 0;
1958 background-color: inherit;
1959 color: inherit;
1960 padding: 0;
1961 }
1962
1963 .courses-order-by,
1964 .block-courses-order-by {
1965 border: 1px solid var(--lp-border-color, #E2E0DB);
1966 border-radius: var(--lp-border-radius, 5px);
1967 padding: 8px 16px;
1968 height: inherit;
1969 font-size: inherit;
1970 line-height: 1.1;
1971 box-shadow: none;
1972 padding-left: 30px;
1973 background-image: url(data:image/svg+xml;base64,Cjxzdmcgd2lkdGg9IjE4cHgiIGhlaWdodD0iMTBweCIgdmlld0JveD0iMCAwIDE4IDEwIiB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiPgogICAgPGcgaWQ9IlBhZ2UtMSIgc3Ryb2tlPSJub25lIiBzdHJva2Utd2lkdGg9IjEiIGZpbGw9Im5vbmUiIGZpbGwtcnVsZT0iZXZlbm9kZCIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIj4KICAgICAgICA8ZyBpZD0iVmVjdG9yLSgxKSIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMS4wMDAwMDAsIDEuMDAwMDAwKSIgc3Ryb2tlPSIjMzMzMzMzIiBzdHJva2Utd2lkdGg9IjIiPgogICAgICAgICAgICA8cG9seWxpbmUgaWQ9IlBhdGgiIHBvaW50cz0iMCAwIDggOCAxNiAwIj48L3BvbHlsaW5lPgogICAgICAgIDwvZz4KICAgIDwvZz4KPC9zdmc+);
1974 background-size: 0.8em;
1975 background-position: calc(100% - (100% - 0.5em)) center;
1976 background-repeat: no-repeat;
1977 -webkit-appearance: none;
1978 appearance: none;
1979 line-height: 1.1;
1980 }
1981 .woocommerce-js .courses-order-by,
1982 .woocommerce-js .block-courses-order-by {
1983 background-position-x: calc(100% - (100% - 10px));
1984 }
1985 .courses-order-by:focus,
1986 .block-courses-order-by:focus {
1987 border-color: var(--lp-primary-color);
1988 outline: 0;
1989 }
1990
1991 .course-img img {
1992 display: block;
1993 }
1994
1995 .block-search-courses {
1996 display: flex;
1997 flex: 1;
1998 margin-bottom: 0;
1999 }
2000 .block-search-courses input {
2001 width: 100%;
2002 max-width: 240px;
2003 margin: 0 0 0 4px;
2004 border: 1px solid var(--lp-border-color, #E2E0DB);
2005 border-radius: var(--lp-border-radius, 5px);
2006 padding: 8px 16px;
2007 height: inherit;
2008 font-size: inherit;
2009 line-height: 1.1;
2010 box-shadow: none;
2011 }
2012 .block-search-courses input::placeholder {
2013 color: #999;
2014 }
2015 .block-search-courses input:focus {
2016 border-color: var(--lp-primary-color);
2017 outline: 0;
2018 }
2019 .block-search-courses button {
2020 border: 1px solid var(--lp-border-color, #E2E0DB);
2021 border-radius: var(--lp-border-radius, 5px);
2022 padding: 8px 16px;
2023 height: inherit;
2024 font-size: inherit;
2025 line-height: 1.1;
2026 box-shadow: none;
2027 box-shadow: 0 0 0;
2028 margin-bottom: 0;
2029 }
2030 .block-search-courses button i {
2031 font-size: 1.2em;
2032 line-height: 1.2;
2033 }
2034 .block-search-courses button:focus {
2035 outline: 0;
2036 }
2037 .block-search-courses button.loading > i:before {
2038 display: inline-block;
2039 content: "\f110";
2040 animation: lp-rotating 1s linear infinite;
2041 }
2042
2043 @media (max-width: 767px) {
2044 .wp-block-learnpress-course-search {
2045 width: 100%;
2046 }
2047 .wp-block-learnpress-course-search input {
2048 min-width: 240px;
2049 max-width: unset;
2050 }
2051 }
2052 .course-filter-btn-mobile {
2053 display: inline-flex;
2054 align-items: center;
2055 }
2056 @media (min-width: 769px) {
2057 .course-filter-btn-mobile {
2058 display: none;
2059 }
2060 }
2061
2062 ul.wp-block-learn-press-courses {
2063 list-style: none;
2064 margin: 0;
2065 max-width: 100%;
2066 padding: 0;
2067 }
2068 ul.wp-block-learn-press-courses[data-layout=grid] {
2069 --columns: 3;
2070 --gap: 1.25em;
2071 --min-width: 200px;
2072 grid-gap: var(--gap);
2073 display: grid;
2074 grid-template-columns: repeat(auto-fill, minmax(max(var(--min-width), 100% / var(--columns) - var(--gap) * (var(--columns) - 1) / var(--columns)), 1fr));
2075 margin-bottom: 2.25em;
2076 }
2077 @media (max-width: 768px) {
2078 ul.wp-block-learn-press-courses .wp-block-learn-press-courses[data-layout=grid] {
2079 --columns: min(var(--columns), 2);
2080 }
2081 }
2082 @media (max-width: 480px) {
2083 ul.wp-block-learn-press-courses .wp-block-learn-press-courses[data-layout=grid] {
2084 --columns: 1;
2085 }
2086 }
2087
2088 .wp-block-learnpress-course-price .course-price .free,
2089 .wp-block-learnpress-course-price .course-price .price {
2090 font-size: calc(var(--lp-font-size-base, 1em) * 1.25);
2091 font-weight: var(--lp-font-weight-link, 600);
2092 }
2093 .wp-block-learnpress-course-price .course-price .origin-price {
2094 margin-left: 8px;
2095 opacity: 0.8;
2096 font-size: calc(var(--lp-font-size-base, 1em) * 0.925);
2097 text-decoration: line-through;
2098 }
2099
2100 .wp-block-learnpress-course-button-read-more button {
2101 padding: 8px 24px;
2102 border-radius: var(--lp-border-radius, 5px);
2103 color: var(--lp-color-base, #333);
2104 border: 1px solid var(--lp-color-base, #333);
2105 transition: all 0.3s;
2106 display: block;
2107 background: transparent;
2108 text-decoration: none;
2109 text-align: center;
2110 }
2111 .wp-block-learnpress-course-button-read-more button:hover {
2112 background: var(--lp-primary-color, #ffb606);
2113 color: var(--lp-color-white, #fff);
2114 border-color: var(--lp-primary-color, #ffb606);
2115 }
2116
2117 .wp-block-learnpress-course-button .course-readmore a {
2118 padding: 8px 24px;
2119 border-radius: var(--lp-border-radius, 5px);
2120 color: var(--lp-color-base, #333);
2121 border: 1px solid var(--lp-color-base, #333);
2122 transition: all 0.3s;
2123 display: block;
2124 background: transparent;
2125 text-decoration: none;
2126 text-align: center;
2127 }
2128 .wp-block-learnpress-course-button .course-readmore a:hover {
2129 background: var(--lp-primary-color, #ffb606);
2130 color: var(--lp-color-white, #fff);
2131 border-color: var(--lp-primary-color, #ffb606);
2132 }
2133
2134 .courses-order-by-wrapper .courses-order-by {
2135 border: 1px solid var(--lp-border-color, #E2E0DB);
2136 border-radius: var(--lp-border-radius, 5px);
2137 padding: 8px 16px;
2138 height: inherit;
2139 font-size: inherit;
2140 line-height: 1.1;
2141 box-shadow: none;
2142 padding-left: 30px;
2143 background-image: url(data:image/svg+xml;base64,Cjxzdmcgd2lkdGg9IjE4cHgiIGhlaWdodD0iMTBweCIgdmlld0JveD0iMCAwIDE4IDEwIiB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiPgogICAgPGcgaWQ9IlBhZ2UtMSIgc3Ryb2tlPSJub25lIiBzdHJva2Utd2lkdGg9IjEiIGZpbGw9Im5vbmUiIGZpbGwtcnVsZT0iZXZlbm9kZCIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIj4KICAgICAgICA8ZyBpZD0iVmVjdG9yLSgxKSIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMS4wMDAwMDAsIDEuMDAwMDAwKSIgc3Ryb2tlPSIjMzMzMzMzIiBzdHJva2Utd2lkdGg9IjIiPgogICAgICAgICAgICA8cG9seWxpbmUgaWQ9IlBhdGgiIHBvaW50cz0iMCAwIDggOCAxNiAwIj48L3BvbHlsaW5lPgogICAgICAgIDwvZz4KICAgIDwvZz4KPC9zdmc+);
2144 background-size: 0.8em;
2145 background-position: calc(100% - (100% - 0.5em)) center;
2146 background-repeat: no-repeat;
2147 -webkit-appearance: none;
2148 appearance: none;
2149 line-height: 1.1;
2150 }
2151 .woocommerce-js .courses-order-by-wrapper .courses-order-by {
2152 background-position-x: calc(100% - (100% - 10px));
2153 }
2154 .courses-order-by-wrapper .courses-order-by:focus {
2155 border-color: var(--lp-primary-color, #ffb606);
2156 outline: 0;
2157 }
2158
2159 .wp-block-learnpress-instructor-social .instructor-social {
2160 display: flex;
2161 gap: 12px;
2162 font-size: calc(var(--lp-font-size-base, 1em) * 0.925);
2163 }
2164 .wp-block-learnpress-instructor-social .instructor-social i {
2165 width: 40px;
2166 height: 40px;
2167 display: inline-flex;
2168 align-items: center;
2169 justify-content: center;
2170 border: 1px solid var(--lp-border-color, #e2e0db);
2171 border-radius: 50%;
2172 }
2173
2174 .wp-block-learnpress-instructor-background img {
2175 opacity: 0;
2176 visibility: hidden;
2177 }
2178
2179 .wp-block-learnpress-instructor-avatar {
2180 overflow: hidden;
2181 aspect-ratio: 1;
2182 }
2183
2184 .wp-block-learnpress-instructor-background {
2185 position: relative;
2186 }
2187 .wp-block-learnpress-instructor-background:hover .lp-btn-to-edit-cover-image {
2188 opacity: 1;
2189 visibility: visible;
2190 }
2191 .wp-block-learnpress-instructor-background .lp-btn-to-edit-cover-image {
2192 position: absolute;
2193 bottom: 0;
2194 left: 0;
2195 background: var(--lp-white-grey, #F7F7FB);
2196 padding: 12px 20px;
2197 border-radius: 0 var(--lp-border-radius, 5px) 0 var(--lp-border-radius, 5px);
2198 text-transform: capitalize;
2199 cursor: pointer;
2200 color: var(--lp-primary-color, #ffb606);
2201 text-decoration: none;
2202 opacity: 0;
2203 visibility: hidden;
2204 }
2205 @media (max-width: 767px) {
2206 .wp-block-learnpress-instructor-background .lp-btn-to-edit-cover-image {
2207 font-size: 0;
2208 padding: 4px 12px;
2209 opacity: 1;
2210 visibility: visible;
2211 }
2212 .wp-block-learnpress-instructor-background .lp-btn-to-edit-cover-image:before {
2213 font-family: "lp-icon";
2214 content: "\f044";
2215 font-size: 16px;
2216 }
2217 }
2218
2219 .lp-sidebar-toggle__close .js-block-sidebar {
2220 display: none;
2221 }
2222
2223 .lp-sidebar-toggle__open .js-block-sidebar {
2224 display: block;
2225 }