PluginProbe ʕ •ᴥ•ʔ
EmbedPress – PDF Embedder, Embed PDF viewer, YouTube Videos, 3D FlipBook, Social feeds & more / 4.4.3
EmbedPress – PDF Embedder, Embed PDF viewer, YouTube Videos, 3D FlipBook, Social feeds & more v4.4.3
4.5.6 4.5.5 4.5.4 4.5.3 4.5.2 trunk 1.0.0 1.1.0 1.1.1 1.1.2 1.1.3 1.2.0 1.3.0 1.3.1 1.4.0 1.4.1 1.4.2 1.4.3 1.4.4 1.5.0 1.6.0 1.6.1 1.6.2 1.6.3 1.7.0 1.7.1 1.7.2 1.7.3 1.7.4 1.7.5 2.0.0 2.0.1 2.0.2 2.0.3 2.1.0 2.1.1 2.1.2 2.1.3 2.1.4 2.1.5 2.1.6 2.2.0 2.2.1 2.2.2 2.3.0 2.3.1 2.3.2 2.3.3 2.4.0 2.4.1 2.5.0 2.5.1 2.5.2 2.5.3 2.5.4 2.5.5 2.6.0 2.6.1 2.6.2 2.7.0 2.7.1 2.7.2 2.7.3 2.7.4 2.7.5 2.7.6 2.7.7 3.0.0 3.0.1 3.0.2 3.0.3 3.0.4 3.1.0 3.1.1 3.1.2 3.1.3 3.2.0 3.2.1 3.3.0 3.3.1 3.3.2 3.3.3 3.3.4 3.3.5 3.3.6 3.3.7 3.4.0 3.4.1 3.4.2 3.4.3 3.5.0 3.5.1 3.5.2 3.5.3 3.6.0 3.6.1 3.6.2 3.6.3 3.6.4 3.6.5 3.6.6 3.6.7 3.6.8 3.7.0 3.7.1 3.7.2 3.7.3 3.8.0 3.8.1 3.8.2 3.8.3 3.8.4 3.8.5 3.9.0 3.9.1 3.9.10 3.9.11 3.9.12 3.9.13 3.9.14 3.9.15 3.9.16 3.9.17 3.9.2 3.9.3 3.9.4 3.9.5 3.9.6 3.9.7 3.9.8 3.9.9 4.0.0 4.0.1 4.0.10 4.0.11 4.0.12 4.0.13 4.0.14 4.0.2 4.0.3 4.0.4 4.0.5 4.0.6 4.0.7 4.0.8 4.0.9 4.1.0 4.1.1 4.1.10 4.1.2 4.1.3 4.1.4 4.1.5 4.1.6 4.1.7 4.1.8 4.1.9 4.2.0 4.2.1 4.2.2 4.2.3 4.2.4 4.2.5 4.2.6 4.2.7 4.2.8 4.2.9 4.3.0 4.3.1 4.4.0 4.4.1 4.4.10 4.4.11 4.4.2 4.4.3 4.4.4 4.4.5 4.4.6 4.4.7 4.4.8 4.4.9 4.5.0 4.5.1
embedpress / assets / css / settings.css
embedpress / assets / css Last commit date
fonts 9 months ago vendor 8 months ago admin-notices.css 1 year ago admin.css 9 months ago analytics.build.css 9 months ago blocks.build.css 9 months ago carousel.min.css 2 years ago el-icon.css 3 years ago embedpress-elementor.css 2 years ago embedpress.css 8 months ago font.css 7 years ago glider.min.css 2 years ago index.html 7 years ago meetup-events.css 8 months ago modal.css 8 months ago plyr.css 9 months ago preview.css 6 years ago settings-icons.css 9 months ago settings.css 9 months ago
settings.css
6228 lines
1 /* @import url("https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;700&display=swap"); */
2
3 @font-face {
4 font-family: 'DMSans-Regular';
5 src: url('./fonts/DMSans-Regular.svg#DMSans-Regular') format('svg'),
6 url('./fonts/DMSans-Regular.ttf') format('truetype'),
7 url('./fonts/DMSans-Regular.woff') format('woff');
8 font-weight: normal;
9 font-style: normal;
10 }
11
12 @font-face {
13 font-family: 'DMSans';
14 src: url('./fonts/DMSans.eot');
15 src: url('./fonts/DMSans.eot?#iefix') format('embedded-opentype'),
16 url('./fonts/DMSans.woff2') format('woff2');
17 font-weight: normal;
18 font-style: normal;
19 }
20
21 :root {
22 --base-gutter: 30px;
23 --md-gutter: 50px;
24 --lg-gutter: 70px;
25 --xl-gutter: 100px;
26 --base-spacer-x: 16px;
27 --base-spacer-y: 16px;
28 --b-radius-6: 25px;
29 --calendly-event-color: #3664ae;
30 --pro-upgrade-margin-bottom: 20px;
31 }
32
33 @media (max-width: 1600px) {
34 :root {
35 --base-gutter: 20px;
36 --md-gutter: 30px;
37 --lg-gutter: 50px;
38 --xl-gutter: 70px;
39 }
40 }
41
42 @media (max-width: 1399px) {
43 :root {
44 --base-gutter: 20px;
45 --md-gutter: 30px;
46 --lg-gutter: 40px;
47 --xl-gutter: 50px;
48 }
49 }
50
51 @media (max-width: 1199px) {
52 :root {
53 --base-spacer-x: 10px;
54 --base-spacer-y: 10px;
55 --md-gutter: 20px;
56 --lg-gutter: 30px;
57 --xl-gutter: 40px;
58 }
59 }
60
61 @media (max-width: 991px) {
62 :root {
63 --base-spacer-x: 5px;
64 --base-spacer-y: 5px;
65 --md-gutter: 20px;
66 --lg-gutter: 30px;
67 --xl-gutter: 40px;
68 }
69 }
70
71 ::-moz-selection {
72 color: #ffffff;
73 background: rgba(91, 78, 150, 0.6);
74 }
75
76 ::selection {
77 color: #ffffff;
78 background: rgba(91, 78, 150, 0.6);
79 }
80
81 .template__wrapper {
82 /* font-family: 'DMSans'; */
83 font-family: 'DMSans';
84 line-height: 1.7;
85 font-weight: 400;
86 min-height: 100vh;
87 background: #ffffff;
88 color: #000000;
89 -webkit-font-smoothing: antialiased;
90 -moz-font-smoothing: antialiased;
91 -ms-font-smoothing: antialiased;
92 -o-font-smoothing: antialiased;
93 font-smoothing: antialiased;
94 -webkit-text-rendering: optimizeLegibility;
95 -moz-text-rendering: optimizeLegibility;
96 -ms-text-rendering: optimizeLegibility;
97 -o-text-rendering: optimizeLegibility;
98 text-rendering: optimizeLegibility;
99 -webkit-scroll-behavior: smooth;
100 -moz-scroll-behavior: smooth;
101 -ms-scroll-behavior: smooth;
102 -o-scroll-behavior: smooth;
103 scroll-behavior: smooth;
104 font-size: 16px;
105 }
106
107 @media (max-width: 1399px) {
108 .template__wrapper {
109 font-size: 14px;
110 }
111 }
112
113 @media (max-width: 991px) {
114 .template__wrapper {
115 font-size: .9rem;
116 }
117 }
118
119 .template__wrapper * {
120 margin: 0;
121 padding: 0;
122 outline: none;
123 border: none;
124 -webkit-box-sizing: border-box;
125 box-sizing: border-box;
126 }
127
128 .template__wrapper a {
129 color: inherit;
130 -webkit-transition: all 0.3s ease;
131 transition: all 0.3s ease;
132 text-decoration: none;
133 display: inline-block;
134 }
135
136 .template__wrapper a:focus {
137 outline: none;
138 -webkit-box-shadow: none;
139 box-shadow: none;
140 }
141
142 .template__wrapper label {
143 margin-bottom: 0;
144 }
145
146 .template__wrapper h1,
147 .template__wrapper h2,
148 .template__wrapper h3,
149 .template__wrapper h4,
150 .template__wrapper h5,
151 .template__wrapper h6,
152 .template__wrapper p {
153 margin: 0;
154 padding: 0;
155 }
156
157 .template__wrapper h1,
158 .template__wrapper h2,
159 .template__wrapper h3,
160 .template__wrapper h4,
161 .template__wrapper h5,
162 .template__wrapper h6 {
163 /* font-family: 'DMSans'; */
164 font-family: 'DMSans';
165 font-weight: 700;
166 line-height: 1.3;
167 }
168
169 .template__wrapper ul,
170 .template__wrapper ol {
171 padding: 0;
172 margin: 0;
173 list-style: none;
174 }
175
176 .template__wrapper img,
177 .template__wrapper video {
178 max-width: 100%;
179 }
180
181 .m50 {
182 margin: 50px;
183 }
184
185 .p50 {
186 padding: 50px;
187 }
188
189 .mt50 {
190 margin-top: 50px;
191 }
192
193 .pt50 {
194 padding-top: 50px;
195 }
196
197 .mb50 {
198 margin-bottom: 50px;
199 }
200
201 .pb50 {
202 padding-bottom: 50px;
203 }
204
205 .ml50 {
206 margin-left: 50px;
207 }
208
209 .pl50 {
210 padding-left: 50px;
211 }
212
213 .mr50 {
214 margin-right: 50px;
215 }
216
217 .pr50 {
218 padding-right: 50px;
219 }
220
221 .m40 {
222 margin: 40px;
223 }
224
225 .p-24 {
226 padding: 24px;
227 }
228
229 .p-32 {
230 padding: 32px;
231 }
232
233 .p40 {
234 padding: 40px;
235 }
236
237 .mt40 {
238 margin-top: 40px;
239 }
240
241 .pt40 {
242 padding-top: 40px;
243 }
244
245 .mb40 {
246 margin-bottom: 40px;
247 }
248
249 .pb40 {
250 padding-bottom: 40px;
251 }
252
253 .ml40 {
254 margin-left: 40px;
255 }
256
257 .pl40 {
258 padding-left: 40px;
259 }
260
261 .mr40 {
262 margin-right: 40px;
263 }
264
265 .pr40 {
266 padding-right: 40px;
267 }
268
269 .m30 {
270 margin: 30px;
271 }
272
273 .p30 {
274 padding: 30px;
275 }
276
277 .mt30 {
278 margin-top: 30px;
279 }
280
281 .pt30 {
282 padding-top: 30px;
283 }
284
285 .mb-20 {
286 margin-bottom: 20px;
287 }
288
289 .mb30 {
290 margin-bottom: 30px;
291 }
292
293 .pb30 {
294 padding-bottom: 30px;
295 }
296
297 .ml30 {
298 margin-left: 30px;
299 }
300
301 .pl30 {
302 padding-left: 30px;
303 }
304
305 .mr30 {
306 margin-right: 30px;
307 }
308
309 .pr30 {
310 padding-right: 30px;
311 }
312
313 .m10 {
314 margin: 10px;
315 }
316
317 .p10 {
318 padding: 10px;
319 }
320
321 .mt10 {
322 margin-top: 10px;
323 }
324
325 .pt10 {
326 padding-top: 10px;
327 }
328
329 .mb10 {
330 margin-bottom: 10px;
331 }
332
333 .pb10 {
334 padding-bottom: 10px;
335 }
336
337 .ml10 {
338 margin-left: 10px;
339 }
340
341 .pl10 {
342 padding-left: 10px;
343 }
344
345 .mr10 {
346 margin-right: 10px;
347 }
348
349 .pr10 {
350 padding-right: 10px;
351 }
352
353 .m5 {
354 margin: 5px;
355 }
356
357 .p5 {
358 padding: 5px;
359 }
360
361 .mt5 {
362 margin-top: 5px;
363 }
364
365 .pt5 {
366 padding-top: 5px;
367 }
368
369 .mb5 {
370 margin-bottom: 5px;
371 }
372
373 .pb5 {
374 padding-bottom: 5px;
375 }
376
377 .ml5 {
378 margin-left: 5px;
379 }
380
381 .pl5 {
382 padding-left: 5px;
383 }
384
385 .mr5 {
386 margin-right: 5px;
387 }
388
389 .pr5 {
390 padding-right: 5px;
391 }
392
393 .embedpress-tab .nav__menu ul .nav__item,
394 .template__wrapper label,
395 .iframe__size__control__form .form__group .frame__unit,
396 .iframe__size__control__wrap h3,
397 .embedpress__settings__form .form__group .form__label,
398 .embedpress__settings__form .form__group .form__control__wrap p,
399 .upgrade__card .card__content h4,
400 .upgrade__card .card__content p,
401 .upgrage__card__tab__style h3,
402 .upgrage__card__tab__style p,
403 .embedpress-license__details .license__content .thumb__area h2,
404 .embedpress-license__details .license__content p,
405 .embedpress-license__details .license__content ol li,
406 .embedpress-card h3,
407 .embedpress-card p,
408 .element__item h5,
409 .element__item .pro__item,
410 .embedpress--elements__wrap h3 {
411 /* font-family: 'DMSans'; */
412 font-family: 'DMSans';
413 }
414
415 .color__themeColor {
416 color: #5B4E96;
417 }
418
419 a.color__themeColor:hover,
420 a.color__themeColor:focus {
421 color: #473d74;
422 -webkit-box-shadow: none;
423 box-shadow: none;
424 }
425
426 .color__primary {
427 color: #00CC76;
428 }
429
430 a.color__primary:hover,
431 a.color__primary:focus {
432 color: #009959;
433 -webkit-box-shadow: none;
434 box-shadow: none;
435 }
436
437 .color__danger {
438 color: #FE504F;
439 }
440
441 a.color__danger:hover,
442 a.color__danger:focus {
443 color: #fe1e1c;
444 -webkit-box-shadow: none;
445 box-shadow: none;
446 }
447
448 .color__warning {
449 color: #FFA53C;
450 }
451
452 a.color__warning:hover,
453 a.color__warning:focus {
454 color: #ff8d09;
455 -webkit-box-shadow: none;
456 box-shadow: none;
457 }
458
459 .color__white {
460 color: #ffffff;
461 }
462
463 a.color__white:hover,
464 a.color__white:focus {
465 color: #e6e6e6;
466 -webkit-box-shadow: none;
467 box-shadow: none;
468 }
469
470 .color__dark {
471 color: #222222;
472 }
473
474 a.color__dark:hover,
475 a.color__dark:focus {
476 color: #090909;
477 -webkit-box-shadow: none;
478 box-shadow: none;
479 }
480
481 .color__grey {
482 color: #7C8DB5;
483 }
484
485 a.color__grey:hover,
486 a.color__grey:focus {
487 color: #5c71a2;
488 -webkit-box-shadow: none;
489 box-shadow: none;
490 }
491
492 .color__liteGrey {
493 color: #F5F7FD;
494 }
495
496 a.color__liteGrey:hover,
497 a.color__liteGrey:focus {
498 color: #cbd5f5;
499 -webkit-box-shadow: none;
500 box-shadow: none;
501 }
502
503 .color__black {
504 color: #000000;
505 }
506
507 .color__twitter {
508 color: #1da1f2;
509 }
510
511 a.color__twitter:hover,
512 a.color__twitter:focus {
513 color: #0c85d0;
514 -webkit-box-shadow: none;
515 box-shadow: none;
516 }
517
518 .color__linkedin {
519 color: #0077b5;
520 }
521
522 a.color__linkedin:hover,
523 a.color__linkedin:focus {
524 color: #005582;
525 -webkit-box-shadow: none;
526 box-shadow: none;
527 }
528
529 .color__instagram {
530 color: #e1306c;
531 }
532
533 a.color__instagram:hover,
534 a.color__instagram:focus {
535 color: #c21c54;
536 -webkit-box-shadow: none;
537 box-shadow: none;
538 }
539
540 .background__themeColor {
541 background-color: #5B4E96;
542 }
543
544 .background__primary {
545 background-color: #00CC76;
546 }
547
548 .background__danger {
549 background-color: #FE504F;
550 }
551
552 .background__warning {
553 background-color: #FFA53C;
554 }
555
556 .background__white {
557 background-color: #ffffff;
558 overflow-x: hidden;
559 }
560
561 .background__dark {
562 background-color: #222222;
563 }
564
565 .background__grey {
566 background-color: #7C8DB5;
567 }
568
569 .background__liteGrey {
570 background-color: #F5F7FD;
571 }
572
573 .background__black {
574 background-color: #000000;
575 }
576
577 .background__twitter {
578 background-color: #1da1f2;
579 }
580
581 .background__linkedin {
582 background-color: #0077b5;
583 }
584
585 .background__instagram {
586 background-color: #e1306c;
587 }
588
589 .gradient__themeColor {
590 background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(91, 78, 150, 0.3)), to(rgba(91, 78, 150, 0.05)));
591 background-image: linear-gradient(180deg, rgba(91, 78, 150, 0.3), rgba(91, 78, 150, 0.05));
592 color: #5B4E96;
593 }
594
595 .gradient__primary {
596 background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 204, 118, 0.3)), to(rgba(0, 204, 118, 0.05)));
597 background-image: linear-gradient(180deg, rgba(0, 204, 118, 0.3), rgba(0, 204, 118, 0.05));
598 color: #00CC76;
599 }
600
601 .gradient__danger {
602 background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(254, 80, 79, 0.3)), to(rgba(254, 80, 79, 0.05)));
603 background-image: linear-gradient(180deg, rgba(254, 80, 79, 0.3), rgba(254, 80, 79, 0.05));
604 color: #FE504F;
605 }
606
607 .gradient__warning {
608 background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(255, 165, 60, 0.3)), to(rgba(255, 165, 60, 0.05)));
609 background-image: linear-gradient(180deg, rgba(255, 165, 60, 0.3), rgba(255, 165, 60, 0.05));
610 color: #FFA53C;
611 }
612
613 .gradient__white {
614 background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(255, 255, 255, 0.3)), to(rgba(255, 255, 255, 0.05)));
615 background-image: linear-gradient(180deg, rgba(255, 255, 255, 0.3), rgba(255, 255, 255, 0.05));
616 color: #ffffff;
617 }
618
619 .gradient__dark {
620 background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(34, 34, 34, 0.3)), to(rgba(34, 34, 34, 0.05)));
621 background-image: linear-gradient(180deg, rgba(34, 34, 34, 0.3), rgba(34, 34, 34, 0.05));
622 color: #222222;
623 }
624
625 .gradient__grey {
626 background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(124, 141, 181, 0.3)), to(rgba(124, 141, 181, 0.05)));
627 background-image: linear-gradient(180deg, rgba(124, 141, 181, 0.3), rgba(124, 141, 181, 0.05));
628 color: #7C8DB5;
629 }
630
631 .gradient__liteGrey {
632 background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(245, 247, 253, 0.3)), to(rgba(245, 247, 253, 0.05)));
633 background-image: linear-gradient(180deg, rgba(245, 247, 253, 0.3), rgba(245, 247, 253, 0.05));
634 color: #F5F7FD;
635 }
636
637 .gradient__black {
638 background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0.3)), to(rgba(0, 0, 0, 0.05)));
639 background-image: linear-gradient(180deg, rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.05));
640 color: #000000;
641 }
642
643 .gradient__twitter {
644 background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(29, 161, 242, 0.3)), to(rgba(29, 161, 242, 0.05)));
645 background-image: linear-gradient(180deg, rgba(29, 161, 242, 0.3), rgba(29, 161, 242, 0.05));
646 color: #1da1f2;
647 }
648
649 .gradient__linkedin {
650 background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 119, 181, 0.3)), to(rgba(0, 119, 181, 0.05)));
651 background-image: linear-gradient(180deg, rgba(0, 119, 181, 0.3), rgba(0, 119, 181, 0.05));
652 color: #0077b5;
653 }
654
655 .gradient__instagram {
656 background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(225, 48, 108, 0.3)), to(rgba(225, 48, 108, 0.05)));
657 background-image: linear-gradient(180deg, rgba(225, 48, 108, 0.3), rgba(225, 48, 108, 0.05));
658 color: #e1306c;
659 }
660
661 .button__themeColor:not(.hover__highlight) {
662 background: #5B4E96;
663 color: white;
664 border-color: #5B4E96;
665 -webkit-transition-property: background, color, box-shadow, border;
666 -webkit-transition-property: background, color, border, -webkit-box-shadow;
667 transition-property: background, color, border, -webkit-box-shadow;
668 transition-property: background, color, box-shadow, border;
669 transition-property: background, color, box-shadow, border, -webkit-box-shadow;
670 }
671
672 .button__themeColor:not(.hover__highlight):disabled {
673 cursor: not-allowed;
674 background: #FE504F;
675 border-color: #FE504F;
676 }
677
678 .button__themeColor:not(.hover__highlight) .icon {
679 color: #5B4E96;
680 background: white;
681 }
682
683 .button__themeColor.hover__highlight {
684 color: #5B4E96;
685 border-color: transparent;
686 background: rgba(91, 78, 150, 0.1);
687 }
688
689 .button__themeColor.hover__highlight .icon {
690 background: #00CC76;
691 color: #ffffff;
692 }
693
694 .button__themeColor.hover__highlight:hover {
695 border-color: transparent;
696 }
697
698 .button__themeColor.button__shadow {
699 -webkit-box-shadow: 0 10px 10px rgba(91, 78, 150, 0.2);
700 box-shadow: 0 10px 10px rgba(91, 78, 150, 0.2);
701 }
702
703 a.button__themeColor.active,
704 a.button__themeColor:hover,
705 button.button__themeColor.active,
706 button.button__themeColor:hover {
707 background: #514585;
708 color: white;
709 border-color: #514585;
710 }
711
712 a.button__themeColor.active:disabled,
713 a.button__themeColor:hover:disabled,
714 button.button__themeColor.active:disabled,
715 button.button__themeColor:hover:disabled {
716 cursor: not-allowed;
717 background: #FE504F;
718 -webkit-box-shadow: none;
719 box-shadow: none;
720 }
721
722 a.button__themeColor.hover__highlight:hover .icon,
723 button.button__themeColor.hover__highlight:hover .icon {
724 background: white;
725 color: #5B4E96;
726 }
727
728 .button__primary:not(.hover__highlight) {
729 background: #00CC76;
730 color: white;
731 border-color: #00CC76;
732 -webkit-transition-property: background, color, box-shadow, border;
733 -webkit-transition-property: background, color, border, -webkit-box-shadow;
734 transition-property: background, color, border, -webkit-box-shadow;
735 transition-property: background, color, box-shadow, border;
736 transition-property: background, color, box-shadow, border, -webkit-box-shadow;
737 }
738
739 .button__primary:not(.hover__highlight):disabled {
740 cursor: not-allowed;
741 background: #FE504F;
742 border-color: #FE504F;
743 }
744
745 .button__primary:not(.hover__highlight) .icon {
746 color: #00CC76;
747 background: white;
748 }
749
750 .button__primary.hover__highlight {
751 color: #00CC76;
752 border-color: transparent;
753 background: rgba(0, 204, 118, 0.1);
754 }
755
756 .button__primary.hover__highlight .icon {
757 background: #00CC76;
758 color: #ffffff;
759 }
760
761 .button__primary.hover__highlight:hover {
762 border-color: transparent;
763 }
764
765 .button__primary.button__shadow {
766 -webkit-box-shadow: 0 10px 10px rgba(0, 204, 118, 0.2);
767 box-shadow: 0 10px 10px rgba(0, 204, 118, 0.2);
768 }
769
770 a.button__primary.active,
771 a.button__primary:hover,
772 button.button__primary.active,
773 button.button__primary:hover {
774 background: #00b367;
775 color: white;
776 border-color: #00b367;
777 }
778
779 a.button__primary.active:disabled,
780 a.button__primary:hover:disabled,
781 button.button__primary.active:disabled,
782 button.button__primary:hover:disabled {
783 cursor: not-allowed;
784 background: #FE504F;
785 -webkit-box-shadow: none;
786 box-shadow: none;
787 }
788
789 a.button__primary.hover__highlight:hover .icon,
790 button.button__primary.hover__highlight:hover .icon {
791 background: white;
792 color: #00CC76;
793 }
794
795 .button__danger:not(.hover__highlight) {
796 background: #FE504F;
797 color: white;
798 border-color: #FE504F;
799 -webkit-transition-property: background, color, box-shadow, border;
800 -webkit-transition-property: background, color, border, -webkit-box-shadow;
801 transition-property: background, color, border, -webkit-box-shadow;
802 transition-property: background, color, box-shadow, border;
803 transition-property: background, color, box-shadow, border, -webkit-box-shadow;
804 }
805
806 .button__danger:not(.hover__highlight):disabled {
807 cursor: not-allowed;
808 background: #FE504F;
809 border-color: #FE504F;
810 }
811
812 .button__danger:not(.hover__highlight) .icon {
813 color: #FE504F;
814 background: white;
815 }
816
817 .button__danger.hover__highlight {
818 color: #FE504F;
819 border-color: transparent;
820 background: rgba(254, 80, 79, 0.1);
821 }
822
823 .button__danger.hover__highlight .icon {
824 background: #00CC76;
825 color: #ffffff;
826 }
827
828 .button__danger.hover__highlight:hover {
829 border-color: transparent;
830 }
831
832 .button__danger.button__shadow {
833 -webkit-box-shadow: 0 10px 10px rgba(254, 80, 79, 0.2);
834 box-shadow: 0 10px 10px rgba(254, 80, 79, 0.2);
835 }
836
837 a.button__danger.active,
838 a.button__danger:hover,
839 button.button__danger.active,
840 button.button__danger:hover {
841 background: #fe3736;
842 color: white;
843 border-color: #fe3736;
844 }
845
846 a.button__danger.active:disabled,
847 a.button__danger:hover:disabled,
848 button.button__danger.active:disabled,
849 button.button__danger:hover:disabled {
850 cursor: not-allowed;
851 background: #FE504F;
852 -webkit-box-shadow: none;
853 box-shadow: none;
854 }
855
856 a.button__danger.hover__highlight:hover .icon,
857 button.button__danger.hover__highlight:hover .icon {
858 background: white;
859 color: #FE504F;
860 }
861
862 .button__warning:not(.hover__highlight) {
863 background: #FFA53C;
864 color: white;
865 border-color: #FFA53C;
866 -webkit-transition-property: background, color, box-shadow, border;
867 -webkit-transition-property: background, color, border, -webkit-box-shadow;
868 transition-property: background, color, border, -webkit-box-shadow;
869 transition-property: background, color, box-shadow, border;
870 transition-property: background, color, box-shadow, border, -webkit-box-shadow;
871 }
872
873 .button__warning:not(.hover__highlight):disabled {
874 cursor: not-allowed;
875 background: #FE504F;
876 border-color: #FE504F;
877 }
878
879 .button__warning:not(.hover__highlight) .icon {
880 color: #FFA53C;
881 background: white;
882 }
883
884 .button__warning.hover__highlight {
885 color: #FFA53C;
886 border-color: transparent;
887 background: rgba(255, 165, 60, 0.1);
888 }
889
890 .button__warning.hover__highlight .icon {
891 background: #00CC76;
892 color: #ffffff;
893 }
894
895 .button__warning.hover__highlight:hover {
896 border-color: transparent;
897 }
898
899 .button__warning.button__shadow {
900 -webkit-box-shadow: 0 10px 10px rgba(255, 165, 60, 0.2);
901 box-shadow: 0 10px 10px rgba(255, 165, 60, 0.2);
902 }
903
904 a.button__warning.active,
905 a.button__warning:hover,
906 button.button__warning.active,
907 button.button__warning:hover {
908 background: #ff9923;
909 color: white;
910 border-color: #ff9923;
911 }
912
913 a.button__warning.active:disabled,
914 a.button__warning:hover:disabled,
915 button.button__warning.active:disabled,
916 button.button__warning:hover:disabled {
917 cursor: not-allowed;
918 background: #FE504F;
919 -webkit-box-shadow: none;
920 box-shadow: none;
921 }
922
923 a.button__warning.hover__highlight:hover .icon,
924 button.button__warning.hover__highlight:hover .icon {
925 background: white;
926 color: #FFA53C;
927 }
928
929 .button__white:not(.hover__highlight) {
930 background: #ffffff;
931 color: #5b4e96;
932 border-color: #ffffff;
933 -webkit-transition-property: background, color, box-shadow, border;
934 -webkit-transition-property: background, color, border, -webkit-box-shadow;
935 transition-property: background, color, border, -webkit-box-shadow;
936 transition-property: background, color, box-shadow, border;
937 transition-property: background, color, box-shadow, border, -webkit-box-shadow;
938 }
939
940 .button__white:not(.hover__highlight):disabled {
941 cursor: not-allowed;
942 background: #FE504F;
943 border-color: #FE504F;
944 }
945
946 .button__white:not(.hover__highlight) .icon {
947 color: #ffffff;
948 background: #5b4e96;
949 }
950
951 .button__white.hover__highlight {
952 color: #ffffff;
953 border-color: transparent;
954 background: rgba(255, 255, 255, 0.1);
955 }
956
957 .button__white.hover__highlight .icon {
958 background: #00CC76;
959 color: #ffffff;
960 }
961
962 .button__white.hover__highlight:hover {
963 border-color: transparent;
964 }
965
966 .button__white.button__shadow {
967 -webkit-box-shadow: 0 10px 10px rgba(255, 255, 255, 0.2);
968 box-shadow: 0 10px 10px rgba(255, 255, 255, 0.2);
969 }
970
971 a.button__white.active,
972 a.button__white:hover,
973 button.button__white.active,
974 button.button__white:hover {
975 background: #f2f2f2;
976 color: #5b4e96;
977 border-color: #f2f2f2;
978 }
979
980 a.button__white.active:disabled,
981 a.button__white:hover:disabled,
982 button.button__white.active:disabled,
983 button.button__white:hover:disabled {
984 cursor: not-allowed;
985 background: #FE504F;
986 -webkit-box-shadow: none;
987 box-shadow: none;
988 }
989
990 a.button__white.hover__highlight:hover .icon,
991 button.button__white.hover__highlight:hover .icon {
992 background: #5b4e96;
993 color: #ffffff;
994 }
995
996 .button__dark:not(.hover__highlight) {
997 background: #222222;
998 color: white;
999 border-color: #222222;
1000 -webkit-transition-property: background, color, box-shadow, border;
1001 -webkit-transition-property: background, color, border, -webkit-box-shadow;
1002 transition-property: background, color, border, -webkit-box-shadow;
1003 transition-property: background, color, box-shadow, border;
1004 transition-property: background, color, box-shadow, border, -webkit-box-shadow;
1005 }
1006
1007 .button__dark:not(.hover__highlight):disabled {
1008 cursor: not-allowed;
1009 background: #FE504F;
1010 border-color: #FE504F;
1011 }
1012
1013 .button__dark:not(.hover__highlight) .icon {
1014 color: #222222;
1015 background: white;
1016 }
1017
1018 .button__dark.hover__highlight {
1019 color: #222222;
1020 border-color: transparent;
1021 background: rgba(34, 34, 34, 0.1);
1022 }
1023
1024 .button__dark.hover__highlight .icon {
1025 background: #00CC76;
1026 color: #ffffff;
1027 }
1028
1029 .button__dark.hover__highlight:hover {
1030 border-color: transparent;
1031 }
1032
1033 .button__dark.button__shadow {
1034 -webkit-box-shadow: 0 10px 10px rgba(34, 34, 34, 0.2);
1035 box-shadow: 0 10px 10px rgba(34, 34, 34, 0.2);
1036 }
1037
1038 a.button__dark.active,
1039 a.button__dark:hover,
1040 button.button__dark.active,
1041 button.button__dark:hover {
1042 background: #151515;
1043 color: white;
1044 border-color: #151515;
1045 }
1046
1047 a.button__dark.active:disabled,
1048 a.button__dark:hover:disabled,
1049 button.button__dark.active:disabled,
1050 button.button__dark:hover:disabled {
1051 cursor: not-allowed;
1052 background: #FE504F;
1053 -webkit-box-shadow: none;
1054 box-shadow: none;
1055 }
1056
1057 a.button__dark.hover__highlight:hover .icon,
1058 button.button__dark.hover__highlight:hover .icon {
1059 background: white;
1060 color: #222222;
1061 }
1062
1063 .button__grey:not(.hover__highlight) {
1064 background: #7C8DB5;
1065 color: white;
1066 border-color: #7C8DB5;
1067 -webkit-transition-property: background, color, box-shadow, border;
1068 -webkit-transition-property: background, color, border, -webkit-box-shadow;
1069 transition-property: background, color, border, -webkit-box-shadow;
1070 transition-property: background, color, box-shadow, border;
1071 transition-property: background, color, box-shadow, border, -webkit-box-shadow;
1072 }
1073
1074 .button__grey:not(.hover__highlight):disabled {
1075 cursor: not-allowed;
1076 background: #FE504F;
1077 border-color: #FE504F;
1078 }
1079
1080 .button__grey:not(.hover__highlight) .icon {
1081 color: #7C8DB5;
1082 background: white;
1083 }
1084
1085 .button__grey.hover__highlight {
1086 color: #7C8DB5;
1087 border-color: transparent;
1088 background: rgba(124, 141, 181, 0.1);
1089 }
1090
1091 .button__grey.hover__highlight .icon {
1092 background: #00CC76;
1093 color: #ffffff;
1094 }
1095
1096 .button__grey.hover__highlight:hover {
1097 border-color: transparent;
1098 }
1099
1100 .button__grey.button__shadow {
1101 -webkit-box-shadow: 0 10px 10px rgba(124, 141, 181, 0.2);
1102 box-shadow: 0 10px 10px rgba(124, 141, 181, 0.2);
1103 }
1104
1105 a.button__grey.active,
1106 a.button__grey:hover,
1107 button.button__grey.active,
1108 button.button__grey:hover {
1109 background: #6c7fac;
1110 color: white;
1111 border-color: #6c7fac;
1112 }
1113
1114 a.button__grey.active:disabled,
1115 a.button__grey:hover:disabled,
1116 button.button__grey.active:disabled,
1117 button.button__grey:hover:disabled {
1118 cursor: not-allowed;
1119 background: #FE504F;
1120 -webkit-box-shadow: none;
1121 box-shadow: none;
1122 }
1123
1124 a.button__grey.hover__highlight:hover .icon,
1125 button.button__grey.hover__highlight:hover .icon {
1126 background: white;
1127 color: #7C8DB5;
1128 }
1129
1130 .button__liteGrey:not(.hover__highlight) {
1131 background: #F5F7FD;
1132 color: #5b4e96;
1133 border-color: #F5F7FD;
1134 -webkit-transition-property: background, color, box-shadow, border;
1135 -webkit-transition-property: background, color, border, -webkit-box-shadow;
1136 transition-property: background, color, border, -webkit-box-shadow;
1137 transition-property: background, color, box-shadow, border;
1138 transition-property: background, color, box-shadow, border, -webkit-box-shadow;
1139 }
1140
1141 .button__liteGrey:not(.hover__highlight):disabled {
1142 cursor: not-allowed;
1143 background: #FE504F;
1144 border-color: #FE504F;
1145 }
1146
1147 .button__liteGrey:not(.hover__highlight) .icon {
1148 color: #F5F7FD;
1149 background: #5b4e96;
1150 }
1151
1152 .button__liteGrey.hover__highlight {
1153 color: #F5F7FD;
1154 border-color: transparent;
1155 background: rgba(245, 247, 253, 0.1);
1156 }
1157
1158 .button__liteGrey.hover__highlight .icon {
1159 background: #00CC76;
1160 color: #ffffff;
1161 }
1162
1163 .button__liteGrey.hover__highlight:hover {
1164 border-color: transparent;
1165 }
1166
1167 .button__liteGrey.button__shadow {
1168 -webkit-box-shadow: 0 10px 10px rgba(245, 247, 253, 0.2);
1169 box-shadow: 0 10px 10px rgba(245, 247, 253, 0.2);
1170 }
1171
1172 a.button__liteGrey.active,
1173 a.button__liteGrey:hover,
1174 button.button__liteGrey.active,
1175 button.button__liteGrey:hover {
1176 background: #e0e6f9;
1177 color: #5b4e96;
1178 border-color: #e0e6f9;
1179 }
1180
1181 a.button__liteGrey.active:disabled,
1182 a.button__liteGrey:hover:disabled,
1183 button.button__liteGrey.active:disabled,
1184 button.button__liteGrey:hover:disabled {
1185 cursor: not-allowed;
1186 background: #FE504F;
1187 -webkit-box-shadow: none;
1188 box-shadow: none;
1189 }
1190
1191 a.button__liteGrey.hover__highlight:hover .icon,
1192 button.button__liteGrey.hover__highlight:hover .icon {
1193 background: #5b4e96;
1194 color: #F5F7FD;
1195 }
1196
1197 .button__black:not(.hover__highlight) {
1198 background: #000000;
1199 color: white;
1200 border-color: #000000;
1201 -webkit-transition-property: background, color, box-shadow, border;
1202 -webkit-transition-property: background, color, border, -webkit-box-shadow;
1203 transition-property: background, color, border, -webkit-box-shadow;
1204 transition-property: background, color, box-shadow, border;
1205 transition-property: background, color, box-shadow, border, -webkit-box-shadow;
1206 }
1207
1208 .button__black:not(.hover__highlight):disabled {
1209 cursor: not-allowed;
1210 background: #FE504F;
1211 border-color: #FE504F;
1212 }
1213
1214 .button__black:not(.hover__highlight) .icon {
1215 color: #000000;
1216 background: white;
1217 }
1218
1219 .button__black.hover__highlight {
1220 color: #000000;
1221 border-color: transparent;
1222 background: rgba(0, 0, 0, 0.1);
1223 }
1224
1225 .button__black.hover__highlight .icon {
1226 background: #00CC76;
1227 color: #ffffff;
1228 }
1229
1230 .button__black.hover__highlight:hover {
1231 border-color: transparent;
1232 }
1233
1234 .button__black.button__shadow {
1235 -webkit-box-shadow: 0 10px 10px rgba(0, 0, 0, 0.2);
1236 box-shadow: 0 10px 10px rgba(0, 0, 0, 0.2);
1237 }
1238
1239 a.button__black.active:disabled,
1240 a.button__black:hover:disabled,
1241 button.button__black.active:disabled,
1242 button.button__black:hover:disabled {
1243 cursor: not-allowed;
1244 background: #FE504F;
1245 -webkit-box-shadow: none;
1246 box-shadow: none;
1247 }
1248
1249 a.button__black.hover__highlight:hover .icon,
1250 button.button__black.hover__highlight:hover .icon {
1251 background: white;
1252 color: #000000;
1253 }
1254
1255 .button__twitter:not(.hover__highlight) {
1256 background: #1da1f2;
1257 color: white;
1258 border-color: #1da1f2;
1259 -webkit-transition-property: background, color, box-shadow, border;
1260 -webkit-transition-property: background, color, border, -webkit-box-shadow;
1261 transition-property: background, color, border, -webkit-box-shadow;
1262 transition-property: background, color, box-shadow, border;
1263 transition-property: background, color, box-shadow, border, -webkit-box-shadow;
1264 }
1265
1266 .button__twitter:not(.hover__highlight):disabled {
1267 cursor: not-allowed;
1268 background: #FE504F;
1269 border-color: #FE504F;
1270 }
1271
1272 .button__twitter:not(.hover__highlight) .icon {
1273 color: #1da1f2;
1274 background: white;
1275 }
1276
1277 .button__twitter.hover__highlight {
1278 color: #1da1f2;
1279 border-color: transparent;
1280 background: rgba(29, 161, 242, 0.1);
1281 }
1282
1283 .button__twitter.hover__highlight .icon {
1284 background: #00CC76;
1285 color: #ffffff;
1286 }
1287
1288 .button__twitter.hover__highlight:hover {
1289 border-color: transparent;
1290 }
1291
1292 .button__twitter.button__shadow {
1293 -webkit-box-shadow: 0 10px 10px rgba(29, 161, 242, 0.2);
1294 box-shadow: 0 10px 10px rgba(29, 161, 242, 0.2);
1295 }
1296
1297 a.button__twitter.active,
1298 a.button__twitter:hover,
1299 button.button__twitter.active,
1300 button.button__twitter:hover {
1301 background: #0d95e8;
1302 color: white;
1303 border-color: #0d95e8;
1304 }
1305
1306 a.button__twitter.active:disabled,
1307 a.button__twitter:hover:disabled,
1308 button.button__twitter.active:disabled,
1309 button.button__twitter:hover:disabled {
1310 cursor: not-allowed;
1311 background: #FE504F;
1312 -webkit-box-shadow: none;
1313 box-shadow: none;
1314 }
1315
1316 a.button__twitter.hover__highlight:hover .icon,
1317 button.button__twitter.hover__highlight:hover .icon {
1318 background: white;
1319 color: #1da1f2;
1320 }
1321
1322 .button__linkedin:not(.hover__highlight) {
1323 background: #0077b5;
1324 color: white;
1325 border-color: #0077b5;
1326 -webkit-transition-property: background, color, box-shadow, border;
1327 -webkit-transition-property: background, color, border, -webkit-box-shadow;
1328 transition-property: background, color, border, -webkit-box-shadow;
1329 transition-property: background, color, box-shadow, border;
1330 transition-property: background, color, box-shadow, border, -webkit-box-shadow;
1331 }
1332
1333 .button__linkedin:not(.hover__highlight):disabled {
1334 cursor: not-allowed;
1335 background: #FE504F;
1336 border-color: #FE504F;
1337 }
1338
1339 .button__linkedin:not(.hover__highlight) .icon {
1340 color: #0077b5;
1341 background: white;
1342 }
1343
1344 .button__linkedin.hover__highlight {
1345 color: #0077b5;
1346 border-color: transparent;
1347 background: rgba(0, 119, 181, 0.1);
1348 }
1349
1350 .button__linkedin.hover__highlight .icon {
1351 background: #00CC76;
1352 color: #ffffff;
1353 }
1354
1355 .button__linkedin.hover__highlight:hover {
1356 border-color: transparent;
1357 }
1358
1359 .button__linkedin.button__shadow {
1360 -webkit-box-shadow: 0 10px 10px rgba(0, 119, 181, 0.2);
1361 box-shadow: 0 10px 10px rgba(0, 119, 181, 0.2);
1362 }
1363
1364 a.button__linkedin.active,
1365 a.button__linkedin:hover,
1366 button.button__linkedin.active,
1367 button.button__linkedin:hover {
1368 background: #00669c;
1369 color: white;
1370 border-color: #00669c;
1371 }
1372
1373 a.button__linkedin.active:disabled,
1374 a.button__linkedin:hover:disabled,
1375 button.button__linkedin.active:disabled,
1376 button.button__linkedin:hover:disabled {
1377 cursor: not-allowed;
1378 background: #FE504F;
1379 -webkit-box-shadow: none;
1380 box-shadow: none;
1381 }
1382
1383 a.button__linkedin.hover__highlight:hover .icon,
1384 button.button__linkedin.hover__highlight:hover .icon {
1385 background: white;
1386 color: #0077b5;
1387 }
1388
1389 .button__instagram:not(.hover__highlight) {
1390 background: #e1306c;
1391 color: white;
1392 border-color: #e1306c;
1393 -webkit-transition-property: background, color, box-shadow, border;
1394 -webkit-transition-property: background, color, border, -webkit-box-shadow;
1395 transition-property: background, color, border, -webkit-box-shadow;
1396 transition-property: background, color, box-shadow, border;
1397 transition-property: background, color, box-shadow, border, -webkit-box-shadow;
1398 }
1399
1400 .button__instagram:not(.hover__highlight):disabled {
1401 cursor: not-allowed;
1402 background: #FE504F;
1403 border-color: #FE504F;
1404 }
1405
1406 .button__instagram:not(.hover__highlight) .icon {
1407 color: #e1306c;
1408 background: white;
1409 }
1410
1411 .button__instagram.hover__highlight {
1412 color: #e1306c;
1413 border-color: transparent;
1414 background: rgba(225, 48, 108, 0.1);
1415 }
1416
1417 .button__instagram.hover__highlight .icon {
1418 background: #00CC76;
1419 color: #ffffff;
1420 }
1421
1422 .button__instagram.hover__highlight:hover {
1423 border-color: transparent;
1424 }
1425
1426 .button__instagram.button__shadow {
1427 -webkit-box-shadow: 0 10px 10px rgba(225, 48, 108, 0.2);
1428 box-shadow: 0 10px 10px rgba(225, 48, 108, 0.2);
1429 }
1430
1431 a.button__instagram.active,
1432 a.button__instagram:hover,
1433 button.button__instagram.active,
1434 button.button__instagram:hover {
1435 background: #d81f5e;
1436 color: white;
1437 border-color: #d81f5e;
1438 }
1439
1440 a.button__instagram.active:disabled,
1441 a.button__instagram:hover:disabled,
1442 button.button__instagram.active:disabled,
1443 button.button__instagram:hover:disabled {
1444 cursor: not-allowed;
1445 background: #FE504F;
1446 -webkit-box-shadow: none;
1447 box-shadow: none;
1448 }
1449
1450 a.button__instagram.hover__highlight:hover .icon,
1451 button.button__instagram.hover__highlight:hover .icon {
1452 background: white;
1453 color: #e1306c;
1454 }
1455
1456 .template__wrapper .button.button-pro-upgrade {
1457 font-weight: 700;
1458 color: #fff;
1459 background-color: #FF7369;
1460 border-color: #FF7369;
1461 }
1462
1463 .template__wrapper .button {
1464 display: inline-flex;
1465 align-items: center;
1466 justify-content: center;
1467 gap: 8px;
1468 text-align: center;
1469 padding: 16px 30px;
1470 line-height: 1;
1471 color: #594E91;
1472 background: rgba(91, 78, 150, 0.1);
1473 border: 1px solid rgba(91, 78, 150, 0.1);
1474 font-size: 16px;
1475 font-weight: 500;
1476 font-family: 'DMSans';
1477 cursor: pointer;
1478 -webkit-transition: all 0.3s ease-in-out 0s;
1479 transition: all 0.3s ease-in-out 0s;
1480 border-radius: 8px;
1481 }
1482
1483 @media (max-width: 767px) {
1484 .template__wrapper .button {
1485 padding: 16px 25px;
1486 }
1487 }
1488
1489 .template__wrapper .button:hover {
1490 background: #5B4E96 !important;
1491 color: #ffffff !important;
1492 border-color: #5B4E96 !important;
1493 }
1494
1495 .template__wrapper .button:focus {
1496 outline: none;
1497 -webkit-box-shadow: none;
1498 box-shadow: none;
1499 border-color: #5B4E96;
1500 background-color: #5B4E96;
1501 color: #ffffff;
1502 }
1503
1504 .template__wrapper .button .ss-icon {
1505 font-size: 14px;
1506 margin-right: 5px;
1507 }
1508
1509 .template__wrapper .button--lg {
1510 padding: 20px 30px;
1511 }
1512
1513 .template__wrapper .button__flex {
1514 display: -webkit-inline-box;
1515 display: -ms-inline-flexbox;
1516 display: inline-flex;
1517 -webkit-box-align: center;
1518 -ms-flex-align: center;
1519 align-items: center;
1520 }
1521
1522 .button__group .button {
1523 margin-right: 13px;
1524 margin-bottom: 15px;
1525 }
1526
1527 .button__group .button:last-child {
1528 margin-right: 0;
1529 }
1530
1531 .template__wrapper .radius-10 {
1532 border-radius: 10px;
1533 }
1534
1535 .template__wrapper .radius-12 {
1536 border-radius: 12px;
1537 }
1538
1539 .template__wrapper .radius-16 {
1540 border-radius: 16px;
1541 overflow-x: hidden;
1542 }
1543
1544 .template__wrapper .radius-20 {
1545 border-radius: 20px;
1546 }
1547
1548 .template__wrapper .radius-24 {
1549 border-radius: 24px;
1550 }
1551
1552 .template__wrapper .radius-25 {
1553 border-radius: 25px;
1554 }
1555
1556 .template__wrapper .radius-50 {
1557 border-radius: 50px;
1558 }
1559
1560 .template__wrapper {
1561 /* overflow: hidden; */
1562 min-height: 100vh;
1563 -webkit-display: flex;
1564 -moz-display: flex;
1565 -ms-display: flex;
1566 -o-display: flex;
1567 display: -webkit-box;
1568 display: flex;
1569 -moz-flex-direction: column;
1570 -ms-flex-direction: column;
1571 -o-flex-direction: column;
1572 -webkit-box-orient: vertical;
1573 -webkit-box-direction: normal;
1574 flex-direction: column;
1575 }
1576
1577 @media (max-width: 991px) {
1578 .template__wrapper.p30 {
1579 padding: 15px;
1580 }
1581 }
1582
1583 .embedpress__container {
1584 width: 100%;
1585 margin: 0 auto;
1586 max-width: 1700px;
1587 overflow-x: hidden;
1588 }
1589
1590 .o-hidden {
1591 overflow: hidden;
1592 }
1593
1594 .text-center {
1595 text-align: center;
1596 }
1597
1598 .h-100 {
1599 height: 100%;
1600 }
1601
1602 .embedpress-body {
1603 display: -webkit-box;
1604 display: -ms-flexbox;
1605 display: flex;
1606 }
1607
1608 @media (max-width: 991px) {
1609 .embedpress-body {
1610 display: block;
1611 }
1612 }
1613
1614 /*
1615 .embedpress-body .embedpress-sidebar-wrapper {
1616 display: flex;
1617 flex-direction: column;
1618 }
1619
1620 .embedpress-body .embedpress-sidebar-wrapper .sticky-sibling {
1621 flex-grow: 1;
1622 } */
1623
1624 .embedpress-sidebar-wrapper {
1625 position: relative;
1626 z-index: 1;
1627 }
1628
1629
1630 .embedpress-body .embedpress-sidebar {
1631 -webkit-box-flex: 0;
1632 -ms-flex: 0 0 240px;
1633 flex: 0 0 240px;
1634 min-width: 240px;
1635 margin-right: 24px;
1636 position: sticky;
1637 top: 40px;
1638 max-width: 240px;
1639 overflow: unset;
1640 }
1641
1642 .embedpress-body .embedpress-content {
1643 -webkit-box-flex: 1;
1644 -ms-flex-positive: 1;
1645 flex-grow: 1;
1646 }
1647
1648 .embedpress__row {
1649 display: -ms-grid;
1650 display: grid;
1651 gap: 20px;
1652 }
1653
1654 .embedpress__row.grid__3 {
1655 -ms-grid-columns: 1fr 1fr 1fr;
1656 grid-template-columns: repeat(3, 1fr);
1657 }
1658
1659 @media (max-width: 1199px) {
1660 .embedpress__row.grid__3 {
1661 -ms-grid-columns: 1fr 1fr;
1662 grid-template-columns: repeat(2, 1fr);
1663 }
1664 }
1665
1666 @media (max-width: 575px) {
1667 .embedpress__row.grid__3 {
1668 -ms-grid-columns: 1fr;
1669 grid-template-columns: repeat(1, 1fr);
1670 }
1671 }
1672
1673 .embedpress__row.grid__4 {
1674 -ms-grid-columns: 1fr 1fr 1fr 1fr;
1675 grid-template-columns: repeat(4, 1fr);
1676 }
1677
1678 @media (max-width: 1199px) {
1679 .embedpress__row.grid__4 {
1680 -ms-grid-columns: 1fr 1fr 1fr;
1681 grid-template-columns: repeat(3, 1fr);
1682 }
1683 }
1684
1685 .embedpress__notification {
1686 position: fixed;
1687 bottom: 50px;
1688 right: 50px;
1689 padding: 15px 25px;
1690 border-radius: 10px;
1691 max-width: 400px;
1692 z-index: 9999;
1693 }
1694
1695 .embedpress__notification--success {
1696 background: #00CC76;
1697 }
1698
1699 .embedpress__notification--error {
1700 background-color: #FE504F;
1701 }
1702
1703 .embedpress__notification p {
1704 color: #ffffff;
1705 font-size: 14px;
1706 }
1707
1708 #wpcontent {
1709 padding-left: 0;
1710 }
1711
1712 @media all and (max-width: 782px) {
1713 .auto-fold #wpcontent {
1714 padding-left: 0;
1715 }
1716 }
1717
1718 @media (max-width: 1199px) {
1719
1720 .p50,
1721 .p40 {
1722 padding: 25px;
1723 }
1724 }
1725
1726 .embedpress-header {
1727 display: flex;
1728 justify-content: space-between;
1729 align-items: center;
1730 column-gap: 15px;
1731 row-gap: 10px;
1732 background: #fff;
1733 padding: 15px 30px;
1734 margin-bottom: 15px;
1735 border-radius: 16px;
1736 }
1737
1738
1739 @media all and (max-width: 767px) {
1740 .embedpress-header {
1741 flex-direction: column;
1742 align-items: baseline;
1743
1744 }
1745 }
1746
1747 header.embedpress-header img {
1748 width: 150px;
1749 min-width: 150px;
1750 }
1751
1752 header.embedpress-header p {
1753 font-size: 16px;
1754 color: #25396F;
1755 line-height: 1.1;
1756 text-align: center;
1757 }
1758
1759 header.embedpress-header a {
1760 color: #FF7369 !important;
1761 }
1762
1763 header.embedpress-header a.comunity-link {
1764 text-decoration: underline;
1765 color: #5B4E96 !important;
1766 font-size: .9rem;
1767 }
1768
1769 header.embedpress-header a.upgrade-link {
1770 background: #5B4E96;
1771 color: #ffffff !important;
1772 padding: 12px 30px;
1773 border-radius: 8px;
1774 text-decoration: none;
1775 display: inline-flex;
1776 align-items: center;
1777 gap: 8px;
1778 font-weight: 600;
1779 font-size: 14px;
1780 transition: background-color 0.3s ease;
1781 flex-wrap: nowrap;
1782 }
1783
1784 header.embedpress-header a.upgrade-link:hover {
1785 background: #4a3f7a;
1786 }
1787
1788 header.embedpress-header a.upgrade-link .ep-icon {
1789 font-size: 16px;
1790 }
1791
1792 a.site__logo {
1793 display: inline-flex;
1794 }
1795
1796 .embedpress-sidebar {
1797 padding: 10px;
1798 background: #ffffff;
1799 border-radius: 16px;
1800 position: relative;
1801 }
1802
1803 .embedpress-version-wrapper li {
1804 font-size: 14px;
1805 font-weight: 600;
1806 color: #7C8DB5;
1807 text-align: right;
1808 line-height: 1.2;
1809 white-space: nowrap;
1810 }
1811
1812 @media all and (max-width: 767px) {
1813 .embedpress-version-wrapper li {
1814 font-size: 14px;
1815 text-align: left;
1816 margin-bottom: 5px;
1817 }
1818 }
1819
1820
1821 @media all and (max-width: 575px) {
1822 .embedpress-header {
1823 display: block;
1824 }
1825
1826 .embedpress-header .embedpress-version-wrapper {
1827 margin-top: 10px;
1828 }
1829
1830 .embedpress-version-wrapper li {
1831 text-align: left;
1832 }
1833 }
1834
1835 @media (max-width: 991px) {
1836 .embedpress-sidebar {
1837 padding: 0;
1838 border-radius: 5px;
1839 margin-bottom: 30px;
1840 }
1841 }
1842
1843 .embedpress-sidebar .sidebar__toggler {
1844 display: none;
1845 }
1846
1847 @media (max-width: 991px) {
1848 .embedpress-sidebar .sidebar__toggler {
1849 display: block;
1850 font-size: 24px;
1851 padding: 5px 10px;
1852 text-align: center;
1853 }
1854 }
1855
1856 @media (max-width: 991px) {
1857 .embedpress-sidebar .sidebar__menu {
1858 display: none;
1859 position: absolute;
1860 top: calc(100% + 10px);
1861 z-index: 90;
1862 left: 0;
1863 background: #ffffff;
1864 min-width: 220px;
1865 border-radius: 10px;
1866 padding: 10px;
1867 -webkit-box-shadow: 3px 3px 5px 0px rgba(0, 0, 0, 0.2);
1868 box-shadow: 3px 3px 5px 0px rgba(0, 0, 0, 0.2);
1869 }
1870 }
1871
1872 li.sidebar__item.elements-item {
1873 border-bottom: 1px solid #D9D9D9;
1874 padding-bottom: 12px;
1875 }
1876
1877 .embedpress-sidebar .sidebar__menu .sidebar__item:not(:last-child) {
1878 margin-bottom: 10px;
1879 }
1880
1881 .embedpress-sidebar .sidebar__menu .sidebar__item:hover .sidebar__link {
1882 background: #5B4E96;
1883 color: #ffffff;
1884 }
1885
1886 .embedpress-sidebar .sidebar__menu .sidebar__item.show .sidebar__link {
1887 background: #5B4E96;
1888 color: #ffffff;
1889 }
1890
1891 .embedpress-sidebar .sidebar__menu .sidebar__item.show .sidebar__link--toggler:before {
1892 -webkit-transform: rotate(180deg);
1893 transform: rotate(180deg);
1894 }
1895
1896 .embedpress-sidebar .sidebar__menu .sidebar__item .sidebar__link {
1897 padding: 10px 20px;
1898 width: 100%;
1899 font-size: 16px;
1900 font-weight: 500;
1901 color: #988FBD;
1902 border-radius: 8px;
1903 position: relative;
1904 display: flex;
1905 align-items: center;
1906 gap: 15px;
1907
1908 }
1909
1910 .embedpress-sidebar .sidebar__menu .sidebar__item.settings-item .sidebar__link:hover svg {
1911 fill: #fff;
1912
1913 }
1914
1915 .embedpress-sidebar .sidebar__menu .sidebar__item.settings-item.show .sidebar__link svg {
1916 fill: #fff;
1917 }
1918
1919
1920
1921 .embedpress-sidebar .sidebar__menu li.sidebar__item a svg {
1922 height: 20px;
1923 margin-top: -2px;
1924 }
1925
1926 .embedpress-sidebar .sidebar__menu li.sidebar__item {
1927 position: relative;
1928 }
1929
1930 .embedpress-sidebar .sidebar__menu li.sidebar__item span.embedpress-font-m.embedpress-tag {
1931 width: auto;
1932 right: 18px;
1933 top: 14px;
1934 display: flex;
1935 align-items: center;
1936
1937 }
1938
1939 .embedpress-sidebar .sidebar__menu .sidebar__item .sidebar__link--toggler:before {
1940 content: '\e906';
1941 font-family: icomoon;
1942 position: absolute;
1943 top: 18px;
1944 right: 15px;
1945 font-size: .8rem;
1946 -webkit-transition: rotate .3s ease;
1947 transition: rotate .3s ease;
1948 }
1949
1950 .embedpress-sidebar .sidebar__menu .sidebar__item .sidebar__link.active+.dropdown__menu {
1951 display: block;
1952 }
1953
1954 a.sidebar__link.active.general svg path,
1955 a.sidebar__link.active.elements svg path,
1956 a.sidebar__link.active.branding svg path {
1957 stroke: #fff;
1958 }
1959
1960 .general.sidebar__link:hover svg path,
1961 .elements.sidebar__link:hover svg path,
1962 .branding.sidebar__link:hover svg path {
1963 stroke: #fff;
1964 }
1965
1966 a.sidebar__link.active.sources svg path,
1967 a.sidebar__link.active.shortcode svg path {
1968 fill: #fff;
1969 }
1970
1971 .sources.sidebar__link:hover svg path,
1972 .shortcode.sidebar__link:hover svg path {
1973 fill: #fff;
1974 }
1975
1976 a.sidebar__link.ads-icon.active svg path {
1977 stroke: #fff;
1978 }
1979
1980 a.sidebar__link.ads-icon svg path {
1981 stroke: #988FBD;
1982 }
1983
1984 a.sidebar__link.ads-icon:hover svg path {
1985 stroke: #fff;
1986 }
1987
1988 .embedpress-sidebar .sidebar__menu .sidebar__item .sidebar__link span {
1989 display: inline-block;
1990 width: 20px;
1991 height: 19px;
1992 text-align: center;
1993 }
1994
1995 a.sidebar__link.ads-icon span {
1996 display: flex !important;
1997 }
1998
1999 a.sidebar__link.ads-icon {
2000 display: flex;
2001 align-items: center;
2002 }
2003
2004 a.sidebar__link.ads-icon.active span svg path,
2005 a.sidebar__link.ads-icon:hover span svg path {
2006 fill: #fff;
2007 }
2008
2009 .embedpress-sidebar .sidebar__menu .sidebar__item .dropdown__menu {
2010 margin-left: 35px;
2011 display: none;
2012 }
2013
2014 .embedpress-sidebar .sidebar__menu .sidebar__item .dropdown__menu .dropdown__item:not(:last-child) {
2015 margin-bottom: 5px;
2016 }
2017
2018 .embedpress-sidebar .sidebar__menu .sidebar__item .dropdown__menu .dropdown__item .dropdown__link {
2019 padding: 5px;
2020 /* display : block; */
2021 font-size: 16px;
2022 font-weight: 400;
2023 color: #7C8DB5;
2024 display: flex;
2025 }
2026
2027 .embedpress-sidebar .sidebar__menu .sidebar__item .dropdown__menu .dropdown__item .dropdown__link img {
2028 max-width: 16px;
2029 margin-right: 7px;
2030 }
2031
2032 .embedpress-sidebar .sidebar__menu .sidebar__item .dropdown__menu .dropdown__item .dropdown__link:hover {
2033 color: #5B4E96;
2034 }
2035
2036 .embedpress-sidebar .sidebar__menu .sidebar__item .dropdown__menu .dropdown__item .dropdown__link.active {
2037 color: #5B4E96;
2038 font-weight: 500;
2039 }
2040
2041 .embedpress-tab .nav__menu ul {
2042 display: -webkit-box;
2043 display: -ms-flexbox;
2044 display: flex;
2045 }
2046
2047 .embedpress-tab .nav__menu ul.menu__grow .nav__item {
2048 -webkit-box-flex: 1;
2049 -ms-flex-positive: 1;
2050 flex-grow: 1;
2051 text-align: center;
2052 }
2053
2054 .embedpress-tab .nav__menu ul.menu__grow .nav__item span {
2055 width: 100%;
2056 }
2057
2058 @media (max-width: 767px) {
2059 .embedpress-tab .nav__menu ul.menu__grow .nav__item span {
2060 padding: 10px;
2061 }
2062 }
2063
2064 @media (max-width: 479px) {
2065 .embedpress-tab .nav__menu ul:not(.menu__grow) {
2066 display: block;
2067 }
2068
2069 .embedpress-tab .nav__menu ul:not(.menu__grow) .nav__item:not(:last-child) {
2070 margin-right: 0;
2071 }
2072
2073 .embedpress-tab .nav__menu ul:not(.menu__grow) .nav__item:first-child span {
2074 border-top-right-radius: 10px;
2075 }
2076
2077 .embedpress-tab .nav__menu ul:not(.menu__grow) .nav__item:last-child span {
2078 border-top-right-radius: 0;
2079 }
2080 }
2081
2082 @media (max-width: 479px) and (max-width: 479px) {
2083 .embedpress-tab .nav__menu ul:not(.menu__grow) .nav__item span {
2084 width: 100%;
2085 }
2086 }
2087
2088 .embedpress-tab .nav__menu ul .nav__item {
2089 margin-bottom: 5px;
2090 font-size: 20px;
2091 font-weight: 400;
2092 color: #5B4E96;
2093 display: -webkit-box;
2094 display: -ms-flexbox;
2095 display: flex;
2096 -webkit-box-pack: center;
2097 -ms-flex-pack: center;
2098 justify-content: center;
2099 -webkit-box-align: center;
2100 -ms-flex-align: center;
2101 align-items: center;
2102 }
2103
2104 @media (max-width: 767px) {
2105 .embedpress-tab .nav__menu ul .nav__item {
2106 font-size: 16px;
2107 }
2108 }
2109
2110 @media (max-width: 575px) {
2111 .embedpress-tab .nav__menu ul .nav__item {
2112 font-size: 14px;
2113 }
2114 }
2115
2116 .embedpress-tab .nav__menu ul .nav__item i {
2117 margin-right: 10px;
2118 }
2119
2120 .embedpress-tab .nav__menu ul .nav__item.active span {
2121 background: #5B4E96;
2122 color: #ffffff;
2123 }
2124
2125 .embedpress-tab .nav__menu ul .nav__item span {
2126 padding: 16px 20px;
2127 cursor: pointer;
2128 background: #ffffff;
2129 }
2130
2131 .embedpress-tab .nav__menu ul .nav__item:not(:last-child) {
2132 margin-right: 5px;
2133 }
2134
2135 .embedpress-tab .nav__menu ul .nav__item:first-child span {
2136 border-top-left-radius: 10px;
2137 }
2138
2139 .embedpress-tab .nav__menu ul .nav__item:last-child span {
2140 border-top-right-radius: 10px;
2141 }
2142
2143 .embedpress-tab .tab__item {
2144 display: none;
2145 border-radius: 20px;
2146 border-top-left-radius: 0;
2147 overflow: hidden;
2148 }
2149
2150 .embedpress-tab .tab__item.active {
2151 display: block;
2152 }
2153
2154 .embedpress__settings {
2155 min-height: 100%;
2156 }
2157
2158 .upgrade__card+.embedpress__settings {
2159 min-height: auto;
2160 }
2161
2162 .embedpress__settings h3 {
2163 font-size: 24px;
2164 font-weight: 700;
2165 color: #131F4D;
2166 padding-bottom: 16px;
2167 margin-bottom: 24px;
2168 border-bottom: 1px solid #F5F7FC;
2169 }
2170
2171 @media (max-width: 767px) {
2172 .embedpress__settings h3 {
2173 font-size: 24px;
2174 }
2175 }
2176
2177 @media (max-width: 575px) {
2178 .embedpress__settings h3 {
2179 font-size: 20px;
2180 }
2181 }
2182
2183 .template__wrapper input:focus,
2184 .template__wrapper select:focus {
2185 border-color: #E6EFFB;
2186 -webkit-box-shadow: none;
2187 box-shadow: none;
2188 outline: none;
2189 }
2190
2191 .template__wrapper .form__control {
2192 height: 40px;
2193 padding: 0 20px;
2194 border-radius: 5px;
2195 border: 1px solid #E6EFFB;
2196 color: #25396F;
2197 width: 100%;
2198 outline: none;
2199 -webkit-box-shadow: none;
2200 box-shadow: none;
2201 }
2202
2203 .template__wrapper .form__control::-webkit-input-placeholder {
2204 color: #7C8DB5;
2205 }
2206
2207 .template__wrapper .form__control:-moz-placeholder {
2208 color: #7C8DB5;
2209 }
2210
2211 .template__wrapper .form__control::-moz-placeholder {
2212 color: #7C8DB5;
2213 }
2214
2215 .template__wrapper .form__control:-ms-input-placeholder {
2216 color: #7C8DB5;
2217 }
2218
2219 .template__wrapper textarea.form__control {
2220 height: 120px;
2221 padding-top: 15px;
2222 }
2223
2224 .template__wrapper .embedpress__select select[disabled] {
2225 background-image: none;
2226 }
2227
2228 .template__wrapper label {
2229 font-size: 16px;
2230 font-weight: 400;
2231 color: #7C8DB5;
2232 margin-bottom: 8px;
2233 }
2234
2235 .embedpress__select {
2236 position: relative;
2237 }
2238
2239 .embedpress__select span {
2240 position: absolute;
2241 top: 12px;
2242 right: 15px;
2243 font-size: .85rem;
2244 color: #25396F;
2245 pointer-events: none;
2246 }
2247
2248 .embedpress__select select {
2249 height: 40px;
2250 padding: 0 20px;
2251 border-radius: 5px;
2252 background: #ffffff;
2253 border: 1px solid #E6EFFB;
2254 color: #25396F;
2255 width: 100%;
2256 -webkit-appearance: none;
2257 -moz-appearance: none;
2258 appearance: none;
2259 }
2260
2261 .input__radio {
2262 position: relative;
2263 padding-left: 25px;
2264 }
2265
2266 .input__radio input {
2267 display: none;
2268 }
2269
2270 .input__radio input:checked~span:after {
2271 opacity: 1;
2272 }
2273
2274 .input__radio span {
2275 cursor: pointer;
2276 }
2277
2278 .input__radio span:before {
2279 position: absolute;
2280 top: 5px;
2281 left: 0;
2282 height: 16px;
2283 width: 16px;
2284 border-radius: 50%;
2285 border: 1px solid rgba(91, 78, 150, 0.1);
2286 content: '';
2287 }
2288
2289 .input__radio span:after {
2290 position: absolute;
2291 top: 8px;
2292 left: 3px;
2293 height: 12px;
2294 width: 12px;
2295 border-radius: 50%;
2296 background: #5B4E96;
2297 content: '';
2298 opacity: 0;
2299 }
2300
2301 .template__wrapper .input__switch {
2302 font-size: 0;
2303 cursor: pointer;
2304 }
2305
2306 .template__wrapper .input__switch input {
2307 display: none;
2308 }
2309
2310 .template__wrapper .input__switch input:checked~span {
2311 background: #5B4E96;
2312 }
2313
2314 .template__wrapper .input__switch input:checked~span:before {
2315 left: 15px;
2316 }
2317
2318 .template__wrapper .input__switch span {
2319 height: 17px;
2320 width: 30px;
2321 background: rgba(91, 78, 150, 0.3);
2322 display: inline-block;
2323 border-radius: 15px;
2324 position: relative;
2325 -webkit-transition: all .3s ease;
2326 transition: all .3s ease;
2327 }
2328
2329 .template__wrapper .input__switch span:before {
2330 position: absolute;
2331 top: 2px;
2332 left: 2px;
2333 height: 13px;
2334 width: 13px;
2335 border-radius: 50%;
2336 background: #ffffff;
2337 content: '';
2338 -webkit-transition: all .3s ease;
2339 transition: all .3s ease;
2340 }
2341
2342 .template__wrapper .input__switch.switch__text {
2343 border: 1px solid #E6EFFB;
2344 display: inline-block;
2345 padding: 10px 50px;
2346 border-radius: 5px;
2347 position: relative;
2348 }
2349
2350 .template__wrapper .input__switch.switch__text:before,
2351 .template__wrapper .input__switch.switch__text:after {
2352 font-size: 14px;
2353 font-weight: 400;
2354 color: #25396F;
2355 position: absolute;
2356 top: 7px;
2357 }
2358
2359 .template__wrapper .input__switch.switch__text:before {
2360 content: 'OFF';
2361 left: 10px;
2362 }
2363
2364 .template__wrapper .input__switch.switch__text:after {
2365 content: 'ON';
2366 right: 10px;
2367 }
2368
2369 .input__file {
2370 display: block;
2371 border: 1px solid #E6EFFB;
2372 padding: 5px 20px;
2373 border-radius: 5px;
2374 cursor: pointer;
2375 }
2376
2377 .input__file .form__control {
2378 display: none;
2379 }
2380
2381 .form__group {
2382 margin-bottom: 25px;
2383 }
2384
2385 .form__group.mb0 {
2386 margin-bottom: 0;
2387 }
2388
2389 .iframe__size__control__form .form__group {
2390 display: -webkit-box;
2391 display: -ms-flexbox;
2392 display: flex;
2393 -webkit-box-align: center;
2394 -ms-flex-align: center;
2395 align-items: center;
2396 }
2397
2398 @media (max-width: 575px) {
2399 .iframe__size__control__form .form__group {
2400 display: block;
2401 }
2402 }
2403
2404 .iframe__size__control__form .form__group:last-child {
2405 margin-bottom: 0;
2406 }
2407
2408 .iframe__size__control__form .form__group label {
2409 -webkit-box-flex: 0;
2410 -ms-flex: 0 0 240px;
2411 flex: 0 0 240px;
2412 margin-bottom: 0;
2413 }
2414
2415 @media (max-width: 575px) {
2416 .iframe__size__control__form .form__group label {
2417 margin-bottom: 10px;
2418 font-weight: 700;
2419 margin-right: 15px;
2420 }
2421
2422 .iframe__size__control__form .form__group label:after {
2423 content: ':';
2424 }
2425 }
2426
2427 @media (max-width: 479px) {
2428 .iframe__size__control__form .form__group label {
2429 display: block;
2430 }
2431 }
2432
2433 .iframe__size__control__form .form__group .form__control {
2434 width: 80px;
2435 padding: 0 15px;
2436 margin-right: 20px;
2437 }
2438
2439 .iframe__size__control__form .form__group .frame__unit {
2440 font-size: 16px;
2441 font-weight: 400;
2442 color: #7C8DB5;
2443 }
2444
2445 .iframe__size__control__wrap {
2446 -webkit-box-flex: 0;
2447 -ms-flex: 0 0 40%;
2448 flex: 0 0 40%;
2449 }
2450
2451 .iframe__size__control__wrap h3 {
2452 font-size: 30px;
2453 font-weight: 700;
2454 color: #131F4D;
2455 margin-bottom: 25px;
2456 }
2457
2458 @media (max-width: 767px) {
2459 .iframe__size__control__wrap h3 {
2460 font-size: 24px;
2461 }
2462 }
2463
2464 @media (max-width: 575px) {
2465 .iframe__size__control__wrap h3 {
2466 font-size: 20px;
2467 }
2468 }
2469
2470 .embedpress__settings__form .form__group {
2471 display: -webkit-box;
2472 display: -ms-flexbox;
2473 display: flex;
2474 -webkit-box-align: start;
2475 -ms-flex-align: start;
2476 align-items: flex-start;
2477 }
2478
2479 .embedpress__settings__form .form__group .form__label {
2480 -webkit-box-flex: 0;
2481 -ms-flex: 0 0 410px;
2482 flex: 0 0 410px;
2483 font-size: 16px;
2484 font-weight: 400;
2485 color: #7C8DB5;
2486 }
2487
2488 .embedpress__settings__form .form__group .form__label .isPro {
2489 font-size: .8rem;
2490 font-weight: 400;
2491 color: #ffffff;
2492 background: #5B4E96;
2493 border-radius: 20px;
2494 padding: 2px 5px;
2495 margin-left: 10px;
2496 text-transform: uppercase;
2497 }
2498
2499 @media (max-width: 1399px) {
2500 .embedpress__settings__form .form__group .form__label {
2501 -webkit-box-flex: 0;
2502 -ms-flex: 0 0 300px;
2503 flex: 0 0 300px;
2504 }
2505 }
2506
2507 @media (max-width: 1199px) {
2508 .embedpress__settings__form .form__group .form__label {
2509 -webkit-box-flex: 0;
2510 -ms-flex: 0 0 250px;
2511 flex: 0 0 250px;
2512 }
2513 }
2514
2515 @media (max-width: 767px) {
2516 .embedpress__settings__form .form__group .form__label {
2517 margin-bottom: 10px;
2518 font-weight: 700;
2519 }
2520
2521 .embedpress__settings__form .form__group .form__label:after {
2522 content: ':';
2523 }
2524 }
2525
2526 .embedpress__settings__form .form__group .form__control__wrap {
2527 -webkit-box-flex: 1;
2528 -ms-flex-positive: 1;
2529 flex-grow: 1;
2530 }
2531
2532 .embedpress__settings__form .form__group .form__control__wrap--flex {
2533 display: -webkit-box;
2534 display: -ms-flexbox;
2535 display: flex;
2536 }
2537
2538 .embedpress__settings__form .form__group .form__control__wrap .input__flex {
2539 display: -webkit-box;
2540 display: -ms-flexbox;
2541 display: flex;
2542 -webkit-box-align: center;
2543 -ms-flex-align: center;
2544 align-items: center;
2545 }
2546
2547 .embedpress__settings__form .form__group .form__control__wrap .input__flex label:not(:last-child) {
2548 margin-right: 20px;
2549 }
2550
2551 .embedpress__settings__form .form__group .form__control__wrap .input__flex .form__control[type="number"] {
2552 width: 80px;
2553 margin-right: 20px;
2554 padding: 0 15px;
2555 }
2556
2557 .embedpress__settings__form .form__group .form__control__wrap .input__flex .frame__unit {
2558 line-height: 1;
2559 }
2560
2561 .embedpress__settings__form .form__group .form__control__wrap .input__file,
2562 .embedpress__settings__form .form__group .form__control__wrap .form__control,
2563 .embedpress__settings__form .form__group .form__control__wrap .embedpress__select {
2564 max-width: 300px;
2565 }
2566
2567 .embedpress__settings__form .form__group .form__control__wrap p {
2568 font-size: 14px;
2569 font-weight: 400;
2570 color: #7C8DB5;
2571 margin-top: 10px;
2572 }
2573
2574 .embedpress__settings__form .form__group .form__control__wrap p.ep-note {
2575 font-size: .85rem;
2576 }
2577
2578 .embedpress__settings__form .form__group .form__control__wrap .isPro:not(.embedpress__select) {
2579 opacity: 0.3;
2580 }
2581
2582 .embedpress-genral-settings-page {
2583 display: flex;
2584 }
2585
2586 .embedpress_general_settings__form:not(:last-child),
2587 .embedpress__shortcode {
2588 margin-right: 24px;
2589 width: calc(100% - 300px);
2590 }
2591
2592 .embedpress_general_settings__form:last-child {
2593 width: 100%;
2594 }
2595
2596 .embedpress-upgrade-pro-sidebar {
2597 width: 300px;
2598 border-radius: 16px;
2599 background: linear-gradient(192deg, #FFE3E1 4%, #E9E4FF 98.26%);
2600 padding: 8px;
2601 margin-top: -70px;
2602 }
2603
2604 .shortcode-settings-wrapper {
2605 display: flex;
2606
2607 }
2608
2609
2610 .embedpress-upgrade-pro-sidebar .gradient-color {
2611 border-radius: 12px;
2612 background: white;
2613 padding: 15px;
2614
2615
2616 }
2617
2618 .embedpress-upgrade-pro-sidebar img.embedpress-banner {
2619 margin-bottom: var(--pro-upgrade-margin-bottom);
2620 width: 100%;
2621 }
2622
2623 .embedpress-upgrade-pro-sidebar h3 {
2624 color: #25396F;
2625 font-family: DMSans;
2626 font-size: 16px;
2627 font-style: normal;
2628 font-weight: 700;
2629 line-height: 120%;
2630 margin-bottom: var(--pro-upgrade-margin-bottom);
2631 }
2632
2633 .embedpress-upgrade-pro-sidebar h3 span {
2634 color: #FF7369;
2635 }
2636
2637 ul.feature-list {
2638 margin-bottom: var(--pro-upgrade-margin-bottom);
2639 }
2640
2641 ul.feature-list li {
2642 display: flex;
2643 align-items: start;
2644 gap: 5px;
2645 margin-bottom: 6px;
2646 color: #25396fde;
2647 font-family: DMSans;
2648 font-size: 14px;
2649 font-style: normal;
2650 font-weight: 500;
2651 line-height: 18px;
2652 }
2653
2654 ul.feature-list img {
2655 margin-top: 0px;
2656 width: 18px;
2657 height: 20px;
2658 }
2659
2660 p.embedpress-tagline {
2661 color: #707070;
2662 font-family: DMSans;
2663 font-size: .85rem;
2664 font-style: normal;
2665 font-weight: 400;
2666 line-height: 140%;
2667 text-align: center;
2668 margin-bottom: var(--pro-upgrade-margin-bottom);
2669 }
2670
2671 .pro-upgrade-button {
2672 border-radius: 8px;
2673 background: #FF7369;
2674 padding: 12px 0px;
2675 color: #fff !important;
2676 text-align: center;
2677 font-size: 16px;
2678 font-style: normal;
2679 line-height: 120%;
2680 width: 100%;
2681 display: flex !important;
2682 gap: 5px;
2683 align-items: center;
2684 justify-content: center;
2685 }
2686
2687 .frame__size__wrap {
2688 display: -webkit-box;
2689 display: -ms-flexbox;
2690 display: flex;
2691 }
2692
2693 .template__wrapper .button.ep-settings-form-changed {
2694 background: #f11d1d;
2695 color: #fff;
2696 }
2697
2698 @media (max-width: 1199px) {
2699 .frame__size__wrap {
2700 display: block;
2701 }
2702 }
2703
2704 .form__inline .form-inner-field {
2705 display: -webkit-box;
2706 display: -ms-flexbox;
2707 display: flex;
2708 gap: 15px;
2709 }
2710
2711 .form-inner-field button {
2712 height: 60px;
2713 }
2714
2715 .form__inline .form__group {
2716 margin-bottom: 0;
2717 margin-right: 30px;
2718 }
2719
2720 .logo__adjust__wrap {
2721 margin-top: 20px;
2722 display: none;
2723 }
2724
2725 .form__control__wrap .input__switch .logo__adjust__toggler {
2726 position: absolute;
2727 top: 2px;
2728 left: calc(100% + 15px);
2729 background: #5B4E96;
2730 color: #fff;
2731 border-radius: 5px;
2732 padding: 5px 30px 5px 10px;
2733 font-size: 14px;
2734 opacity: 0;
2735 visibility: hidden;
2736 transition: all .3s ease;
2737 }
2738
2739 .form__control__wrap .input__switch .logo__adjust__toggler i {
2740 font-size: .8rem;
2741 margin-left: 8px;
2742 position: absolute;
2743 top: 11px;
2744 right: 10px;
2745 transition: all .3s ease;
2746 transform: rotate(0);
2747 }
2748
2749 .form__control__wrap .input__switch .logo__adjust__toggler.show i {
2750 transform: rotate(-180deg);
2751 }
2752
2753 .form__control__wrap .input__switch input[type="checkbox"]:checked~.logo__adjust__toggler {
2754 opacity: 1;
2755 visibility: visible;
2756 }
2757
2758 .logo__adjust__wrap .logo__upload__wrap {
2759 display: flex;
2760 align-items: center;
2761 }
2762
2763 .logo__adjust__wrap .logo__upload,
2764 .logo__adjust__wrap .logo__upload__preview {
2765 display: inline-block;
2766 width: 100%;
2767 max-width: 255px;
2768 border-radius: 10px;
2769 border: 2px dashed rgba(124, 141, 181, 0.3);
2770 background: #F5F7FD;
2771 padding: 40px 15px;
2772 text-align: center;
2773 position: relative;
2774 margin-bottom: 0;
2775 height: 172px;
2776 }
2777
2778 #valid-license-key-message {
2779 font-weight: 500;
2780 }
2781
2782 div#valid-license-key-message {
2783 margin-top: 10px;
2784 margin-bottom: 30px;
2785 }
2786
2787 span#email-placeholder {
2788 font-weight: 700;
2789 }
2790
2791 .form__inline .hidden,
2792 #otp-varify-form.hidden {
2793 display: none !important;
2794 }
2795
2796 .short-description {
2797 margin-top: 10px;
2798 padding: 10px 15px;
2799 background: #f2f2f2;
2800 margin-bottom: 10px;
2801 border-radius: 5px;
2802 }
2803
2804 div#invalid-license-key-message,
2805 #invalid-verification-key-message {
2806 padding: 10px;
2807 background: #f2f2f2;
2808 border-radius: 5px;
2809 margin-top: 10px;
2810 }
2811
2812 .short-description a {
2813 color: #5b4e96;
2814 }
2815
2816 div#resend-verification-key-message {
2817 margin-top: 10px;
2818 }
2819
2820 div#resend-verification-key-message a {
2821 color: #5b4e96;
2822 }
2823
2824 .show-toast {
2825 visibility: visible !important;
2826 opacity: 1 !important;
2827 }
2828
2829 div#resend-verification-key-message span {
2830 font-weight: bold;
2831 color: #5b4e96;
2832 cursor: pointer;
2833 }
2834
2835 div#resend-verification-key-message a {
2836 font-weight: 600;
2837 }
2838
2839 .form-inner-field .form__group {
2840 margin-right: 0;
2841 }
2842
2843 @media (max-width: 479px) {
2844 .logo__adjust__wrap .logo__upload {
2845 width: 225px;
2846 }
2847 }
2848
2849 .logo__adjust__wrap .logo__upload .icon {
2850 margin-bottom: 10px;
2851 display: block;
2852 }
2853
2854 .logo__adjust__wrap .logo__upload .icon i {
2855 font-size: 50px;
2856 opacity: .3;
2857 }
2858
2859 .logo__adjust__wrap .logo__upload .text {
2860 display: block;
2861 font-size: 14px;
2862 }
2863
2864 .logo__adjust__wrap .logo__upload input {
2865 opacity: 0;
2866 position: absolute;
2867 top: 0;
2868 left: 0;
2869 height: 100%;
2870 width: 100%;
2871 z-index: 9;
2872 cursor: pointer;
2873 }
2874
2875 .logo__adjust__wrap .logo__upload__preview .instant__preview {
2876 position: absolute;
2877 top: 50%;
2878 left: 50%;
2879 transform: translate(-50%, -50%);
2880 font-size: 0;
2881 }
2882
2883 .logo__adjust__wrap .logo__upload__preview .instant__preview .preview__remove {
2884 position: absolute;
2885 bottom: 100%;
2886 left: 100%;
2887 font-size: 7px;
2888 height: 20px;
2889 width: 20px;
2890 background: #5B4E96;
2891 color: #fff;
2892 line-height: 22px;
2893 border-radius: 50%;
2894 }
2895
2896 .logo__adjust__wrap .logo__adjust {
2897 margin-top: 20px;
2898 display: -webkit-box;
2899 display: -ms-flexbox;
2900 display: flex;
2901 -ms-flex-wrap: wrap;
2902 flex-wrap: wrap;
2903 }
2904
2905 @media (max-width: 1399px) {
2906 .logo__adjust__wrap .logo__adjust {
2907 display: block;
2908 }
2909 }
2910
2911 .logo__adjust__wrap .logo__adjust .logo__adjust__controller {
2912 -webkit-box-flex: 0;
2913 -ms-flex: 0 0 300px;
2914 flex: 0 0 300px;
2915 margin-right: 30px;
2916 }
2917
2918 @media (max-width: 1399px) {
2919 .logo__adjust__wrap .logo__adjust .logo__adjust__controller {
2920 width: 100%;
2921 margin-right: 0;
2922 }
2923 }
2924
2925 @media (max-width: 479px) {
2926 .logo__adjust__wrap .logo__adjust .logo__adjust__controller {
2927 -webkit-box-flex: 0;
2928 -ms-flex: 0 0 225px;
2929 flex: 0 0 225px;
2930 margin-right: 0;
2931 }
2932 }
2933
2934 .logo__adjust__wrap .logo__adjust .logo__adjust__controller .logo__adjust__controller__item:not(:last-child) {
2935 margin-bottom: 25px;
2936 }
2937
2938 .logo__adjust__wrap .logo__adjust .logo__adjust__controller .logo__adjust__controller__item .controller__label {
2939 font-size: 16px;
2940 font-weight: 400;
2941 color: #7C8DB5;
2942 display: inline-block;
2943 }
2944
2945 .logo__adjust__wrap .logo__adjust .logo__adjust__controller .logo__adjust__controller__item .logo__adjust__controller__inputs {
2946 display: -webkit-box;
2947 display: -ms-flexbox;
2948 display: flex;
2949 -webkit-box-align: center;
2950 -ms-flex-align: center;
2951 align-items: center;
2952 }
2953
2954 .logo__adjust__wrap .logo__adjust .logo__adjust__controller .logo__adjust__controller__item .logo__adjust__controller__inputs input[type="range"] {
2955 margin-right: 20px;
2956 width: 200px;
2957 }
2958
2959 @media (max-width: 1199px) {
2960 .logo__adjust__wrap .logo__adjust .logo__adjust__controller .logo__adjust__controller__item .logo__adjust__controller__inputs input[type="range"] {
2961 width: 145px;
2962 }
2963 }
2964
2965 .logo__adjust__wrap .logo__adjust .logo__adjust__controller .logo__adjust__controller__item .logo__adjust__controller__inputs .form__control[type="number"] {
2966 width: 80px;
2967 padding: 0 15px;
2968 }
2969
2970 @media (max-width: 1199px) {
2971 .logo__adjust__wrap .logo__adjust .logo__adjust__controller .logo__adjust__controller__item .logo__adjust__controller__inputs .form__control[type="number"] {
2972 width: 55px;
2973 padding: 0 12px;
2974 }
2975 }
2976
2977 .logo__adjust__wrap .logo__adjust .logo__adjust__preview {
2978 -webkit-box-flex: 0;
2979 -ms-flex: 0 0 500px;
2980 flex: 0 0 500px;
2981 }
2982
2983 @media (max-width: 1399px) {
2984 .logo__adjust__wrap .logo__adjust .logo__adjust__preview {
2985 width: 100%;
2986 max-width: 400px;
2987 margin-top: 20px;
2988 }
2989 }
2990
2991 .logo__adjust__wrap .logo__adjust .logo__adjust__preview .title {
2992 font-size: 16px;
2993 font-weight: 400;
2994 color: #7C8DB5;
2995 display: inline-block;
2996 margin-bottom: 10px;
2997 }
2998
2999 .logo__adjust__wrap .logo__adjust .logo__adjust__preview .preview__box {
3000 position: relative;
3001 min-height: 300px;
3002 }
3003
3004 .logo__adjust__wrap .logo__adjust .logo__adjust__preview .preview__box iframe {
3005 width: 100%;
3006 height: 100%;
3007 min-height: 300px;
3008 }
3009
3010 .logo__adjust__wrap .logo__adjust .logo__adjust__preview .preview__box img {
3011 position: absolute;
3012 bottom: 10%;
3013 right: 6%;
3014 max-height: 40px;
3015 }
3016
3017 .pro__alert__wrap,
3018 .tips__alert__wrap {
3019 position: fixed;
3020 top: 0;
3021 left: 0;
3022 height: 100%;
3023 width: 100%;
3024 background: rgb(0, 0, 0, 30%);
3025 z-index: 99999;
3026 display: none;
3027 }
3028
3029 .pro__alert__wrap .pro__alert__card,
3030 .tips__alert__wrap .tips__alert__card {
3031 width: calc(100% - 30px);
3032 max-width: 500px;
3033 margin: 7% auto 0;
3034 background: #fff;
3035 border-radius: 20px;
3036 padding: 30px;
3037 display: flex;
3038 flex-direction: column;
3039 align-items: center;
3040 text-align: center;
3041 }
3042
3043 .pro__alert__wrap .pro__alert__card img,
3044 .tips__alert__wrap .tips__alert__card img {
3045 height: 100px;
3046 margin-bottom: 20px;
3047 }
3048
3049 .pro__alert__wrap .pro__alert__card h2,
3050 .tips__alert__wrap .tips__alert__card h2 {
3051 font-size: 32px;
3052 font-weight: 500;
3053 color: #131F4D;
3054 margin-bottom: 15px;
3055 }
3056
3057 .pro__alert__wrap .pro__alert__card p,
3058 .tips__alert__wrap .tips__alert__card p {
3059 font-size: 14px;
3060 font-weight: 400;
3061 color: #7C8DB5;
3062 margin-bottom: 15px;
3063 }
3064
3065 .pro__alert__wrap .pro__alert__card p a,
3066 .tips__alert__wrap .tips__alert__card a {
3067 text-decoration: underline;
3068 font-weight: 700;
3069 color: #131F4D;
3070 }
3071
3072 .pro__alert__wrap .pro__alert__card .button,
3073 .tips__alert__wrap .tips__alert__card button {
3074 align-self: flex-end;
3075 margin-top: 20px;
3076 padding: 11px 30px;
3077 }
3078
3079 .template__wrapper input[type=range] {
3080 height: 24px;
3081 -webkit-appearance: none;
3082 margin: 10px 0;
3083 width: 100%;
3084 }
3085
3086 .template__wrapper input[type=range]:focus {
3087 outline: none;
3088 }
3089
3090 .template__wrapper input[type=range]::-webkit-slider-runnable-track {
3091 width: 100%;
3092 height: 10px;
3093 cursor: pointer;
3094 animate: 0.2s;
3095 -webkit-box-shadow: 0px 0px 0px #000000;
3096 box-shadow: 0px 0px 0px #000000;
3097 background: #5B4E96;
3098 border-radius: 5px;
3099 border: 2px solid #F5F7FD;
3100 }
3101
3102 .template__wrapper input[type=range]::-webkit-slider-thumb {
3103 -webkit-box-shadow: 0px 0px 0px #000000;
3104 box-shadow: 0px 0px 0px #000000;
3105 border: 2px solid #5B4E96;
3106 height: 16px;
3107 width: 16px;
3108 border-radius: 8px;
3109 background: #FFFFFF;
3110 cursor: pointer;
3111 -webkit-appearance: none;
3112 margin-top: -5px;
3113 }
3114
3115 .template__wrapper input[type=range]:focus::-webkit-slider-runnable-track {
3116 background: #5B4E96;
3117 }
3118
3119 .template__wrapper input[type=range]::-moz-range-track {
3120 width: 100%;
3121 height: 10px;
3122 cursor: pointer;
3123 animate: 0.2s;
3124 box-shadow: 0px 0px 0px #000000;
3125 background: #5B4E96;
3126 border-radius: 5px;
3127 border: 2px solid #F5F7FD;
3128 }
3129
3130 .template__wrapper input[type=range]::-moz-range-thumb {
3131 box-shadow: 0px 0px 0px #000000;
3132 border: 2px solid #5B4E96;
3133 height: 16px;
3134 width: 16px;
3135 border-radius: 8px;
3136 background: #FFFFFF;
3137 cursor: pointer;
3138 }
3139
3140 .template__wrapper input[type=range]::-ms-track {
3141 width: 100%;
3142 height: 10px;
3143 cursor: pointer;
3144 animate: 0.2s;
3145 background: transparent;
3146 border-color: transparent;
3147 color: transparent;
3148 }
3149
3150 .template__wrapper input[type=range]::-ms-fill-lower {
3151 background: #5B4E96;
3152 border: 2px solid #F5F7FD;
3153 border-radius: 10px;
3154 box-shadow: 0px 0px 0px #000000;
3155 }
3156
3157 .template__wrapper input[type=range]::-ms-fill-upper {
3158 background: #5B4E96;
3159 border: 2px solid #F5F7FD;
3160 border-radius: 10px;
3161 box-shadow: 0px 0px 0px #000000;
3162 }
3163
3164 .template__wrapper input[type=range]::-ms-thumb {
3165 margin-top: 1px;
3166 box-shadow: 0px 0px 0px #000000;
3167 border: 2px solid #5B4E96;
3168 height: 16px;
3169 width: 16px;
3170 border-radius: 8px;
3171 background: #FFFFFF;
3172 cursor: pointer;
3173 }
3174
3175 .template__wrapper input[type=range]:focus::-ms-fill-lower {
3176 background: #5B4E96;
3177 }
3178
3179 .template__wrapper input[type=range]:focus::-ms-fill-upper {
3180 background: #5B4E96;
3181 }
3182
3183 .upgrade__card {
3184 display: -webkit-box;
3185 display: -ms-flexbox;
3186 display: flex;
3187 -webkit-box-align: center;
3188 -ms-flex-align: center;
3189 align-items: center;
3190 background: #5B4E96;
3191 border-radius: 25px;
3192 padding: 40px;
3193 }
3194
3195 @media (max-width: 1199px) {
3196 .upgrade__card {
3197 padding: 50px;
3198 }
3199 }
3200
3201 .upgrade__card .icon {
3202 margin-right: 40px;
3203 min-width: 90px;
3204 }
3205
3206 @media (max-width: 767px) {
3207 .upgrade__card .icon {
3208 margin-right: 0;
3209 margin-bottom: 20px;
3210 }
3211 }
3212
3213 .upgrade__card .card__content {
3214 margin-right: 30px;
3215 }
3216
3217 @media (max-width: 767px) {
3218 .upgrade__card .card__content {
3219 margin-bottom: 20px;
3220 margin-right: 0;
3221 }
3222 }
3223
3224 .upgrade__card .card__content h4 {
3225 font-size: 26px;
3226 font-weight: 500;
3227 color: #ffffff;
3228 margin-bottom: 15px;
3229 }
3230
3231 @media (max-width: 767px) {
3232 .upgrade__card .card__content h4 {
3233 font-size: 22px;
3234 }
3235 }
3236
3237 .upgrade__card .card__content p {
3238 font-size: 14px;
3239 font-weight: 400;
3240 color: rgba(255, 255, 255, 0.5);
3241 max-width: 700px;
3242 }
3243
3244 .upgrade__card .button {
3245 margin-left: auto;
3246 min-width: 177px;
3247 text-align: center;
3248 }
3249
3250 @media (max-width: 767px) {
3251 .upgrade__card {
3252 display: block;
3253 padding: 25px;
3254 }
3255 }
3256
3257 .upgrage__card__tab__list {
3258 max-width: 650px;
3259 width: 100%;
3260 display: grid;
3261 -ms-grid-columns: 1fr 1fr;
3262 grid-template-columns: repeat(2, 1fr);
3263 gap: 16px;
3264 margin-bottom: 50px !important;
3265 }
3266
3267 .upgrage__card__tab__list .upgrage__card__tab__list__item {
3268 color: #5B4E96;
3269 font-size: 16px;
3270 font-weight: 500;
3271 line-height: 18px;
3272 display: inline-flex;
3273 align-items: center;
3274 gap: 8px;
3275 }
3276
3277 @media (max-width: 575px) {
3278 .upgrage__card__tab__list {
3279 -ms-grid-columns: 1fr;
3280 grid-template-columns: repeat(1, 1fr);
3281 }
3282 }
3283
3284 .upgrage__card__tab__list .upgrage__card__tab__list__item:before {
3285 content: "\e910";
3286 font-family: 'icomoon';
3287 color: #4AD750;
3288 }
3289
3290 .upgrage__card__tab__style h3 {
3291 font-size: 30px;
3292 font-weight: 700;
3293 color: #131F4D;
3294 margin-bottom: 25px;
3295 }
3296
3297 @media (max-width: 767px) {
3298 .upgrage__card__tab__style h3 {
3299 font-size: 24px;
3300 }
3301 }
3302
3303 @media (max-width: 575px) {
3304 .upgrage__card__tab__style h3 {
3305 font-size: 20px;
3306 }
3307 }
3308
3309 .upgrage__card__tab__style p {
3310 font-size: 14px;
3311 font-weight: 400;
3312 color: #7C8DB5;
3313 margin-bottom: 30px;
3314 max-width: 1320px;
3315 line-height: 1.85;
3316 }
3317
3318 .embedpress-license__details {
3319 display: -ms-grid;
3320 display: grid;
3321 -ms-grid-columns: 3.5fr 2fr;
3322 grid-template-columns: 3.5fr 2fr;
3323 gap: 5px;
3324 }
3325
3326 @media (max-width: 991px) {
3327 .embedpress-license__details {
3328 display: block;
3329 }
3330 }
3331
3332 .embedpress-license__details .license__content {
3333 background: #ffffff;
3334 padding: 40px 100px 50px 50px;
3335
3336 }
3337
3338 @media (max-width: 1199px) {
3339 .embedpress-license__details .license__content {
3340 padding: 30px;
3341 }
3342 }
3343
3344 @media (max-width: 991px) {
3345 .embedpress-license__details .license__content {
3346 margin-bottom: 5px;
3347 }
3348 }
3349
3350 @media (max-width: 767px) {
3351 .embedpress-license__details .license__content {
3352 padding: 40px 30px;
3353 }
3354 }
3355
3356 @media (max-width: 575px) {
3357 .embedpress-license__details .license__content .form__inline {
3358 display: block;
3359 }
3360
3361 .embedpress-license__details .license__content .form__inline .form__group {
3362 margin-bottom: 25px;
3363 margin-right: 0;
3364 }
3365 }
3366
3367 .embedpress-license__details .license__content .thumb__area {
3368 /* max-width: 350px; */
3369 /* text-align: center; */
3370 margin-bottom: 30px;
3371 }
3372
3373 .embedpress-license__details .license__content .thumb__area img {
3374 max-width: 320px;
3375 }
3376
3377 .embedpress-license__details .license__content .thumb__area h2 {
3378 font-size: 30px;
3379 font-weight: 400;
3380 color: #25396F;
3381 margin-top: 10px;
3382 }
3383
3384 @media (max-width: 767px) {
3385 .embedpress-license__details .license__content .thumb__area h2 {
3386 font-size: 24px;
3387 }
3388 }
3389
3390 .embedpress-license__details .license__content p {
3391 font-size: 16px;
3392 font-weight: 400;
3393 color: #25396F;
3394 margin-bottom: 30px;
3395 }
3396
3397 @media (max-width: 767px) {
3398 .embedpress-license__details .license__content p {
3399 font-size: 16px;
3400 }
3401 }
3402
3403 .embedpress-license__details .license__content p a {
3404 color: #5B4E96;
3405 text-decoration: underline;
3406 }
3407
3408 .embedpress-license__details .license__content ol {
3409 list-style: decimal;
3410 padding-left: 19px;
3411 margin-bottom: 50px;
3412 }
3413
3414 .embedpress-license__details .license__content ol li {
3415 font-size: 18px;
3416 font-weight: 400;
3417 color: #25396F;
3418 }
3419
3420 .embedpress-license__details .license__content ol li:not(:last-child) {
3421 margin-bottom: 15px;
3422 }
3423
3424 @media (max-width: 767px) {
3425 .embedpress-license__details .license__content ol li {
3426 font-size: 16px;
3427 }
3428 }
3429
3430 .embedpress-license__details .license__content ol li a {
3431 color: #5B4E96;
3432 text-decoration: underline;
3433 }
3434
3435 .embedpress-license__details .license__content .form__group {
3436 -webkit-box-flex: 1;
3437 -ms-flex-positive: 1;
3438 flex-grow: 1;
3439 position: relative;
3440 }
3441
3442
3443
3444 .embedpress-license__details .license__content .form__group .input__icon {
3445 position: absolute;
3446 top: 20px;
3447 left: 20px;
3448 color: #7C8DB5;
3449 pointer-events: none;
3450 width: 20px;
3451 }
3452
3453 .embedpress-license__details .license__content .form__group .input__icon i {
3454 font-size: 20px;
3455 }
3456
3457 @media (max-width: 767px) {
3458 .embedpress-license__details .license__content .form__group .input__icon {
3459 top: 15px;
3460 left: 15px;
3461 }
3462
3463 .embedpress-license__details .license__content .form__group .input__icon i {
3464 font-size: 16px;
3465 }
3466 }
3467
3468 .embedpress-license__details .license__content .form__group .form__control {
3469 height: 60px;
3470 background: #F5F7FD;
3471 color: #7C8DB5;
3472 font-size: 20px;
3473 padding-left: 50px;
3474 }
3475
3476 input#embedpress-pro-license-key::placeholder {
3477 font-size: 18px;
3478 }
3479
3480 .embedpress-license__details .license__content .form__group .form__control::-webkit-input-placeholder {
3481 color: #7C8DB5;
3482 }
3483
3484 .embedpress-license__details .license__content .form__group .form__control:-moz-placeholder {
3485 color: #7C8DB5;
3486 }
3487
3488 .embedpress-license__details .license__content .form__group .form__control::-moz-placeholder {
3489 color: #7C8DB5;
3490 }
3491
3492 .embedpress-license__details .license__content .form__group .form__control:-ms-input-placeholder {
3493 color: #7C8DB5;
3494 }
3495
3496 @media (max-width: 1399px) {
3497 .embedpress-license__details .license__content .form__group .form__control {
3498 font-size: 16px;
3499 }
3500 }
3501
3502 @media (max-width: 767px) {
3503 .embedpress-license__details .license__content .form__group .form__control {
3504 height: 50px;
3505 padding-left: 35px;
3506 font-size: 14px;
3507 }
3508
3509 .form-inner-field button {
3510 height: 60px;
3511 }
3512
3513 }
3514
3515 .embedpress-license__details .license__manage {
3516 background: #ffffff;
3517 padding: 30px;
3518 display: -webkit-box;
3519 display: -ms-flexbox;
3520 display: flex;
3521 -webkit-box-pack: center;
3522 -ms-flex-pack: center;
3523 justify-content: center;
3524 -webkit-box-align: center;
3525 -ms-flex-align: center;
3526 align-items: center;
3527 -webkit-box-orient: vertical;
3528 -webkit-box-direction: normal;
3529 -ms-flex-direction: column;
3530 flex-direction: column;
3531 }
3532
3533 .embedpress-license__details .license__manage .button {
3534 margin-top: 30px;
3535 }
3536
3537 .embedpress-card {
3538 background: #F5F7FD;
3539 border-radius: 16px;
3540 padding: 24px;
3541 padding-left: 100px;
3542 border: 2px solid rgba(91, 78, 150, 0.1);
3543 position: relative;
3544 }
3545
3546 @media (min-width: 1199px) and (max-width: 1399px) {
3547 .embedpress-card {
3548 padding-left: 24px !important;
3549 }
3550 }
3551
3552 @media (max-width: 767px) {
3553 .embedpress-card {
3554 padding-left: 20px;
3555 padding: 20px;
3556 }
3557 }
3558
3559 .embedpress-card .icon {
3560 position: absolute;
3561 top: 30px;
3562 left: 30px;
3563 height: 50px;
3564 width: 50px;
3565 border-radius: 10px;
3566 background: #F0EFF6;
3567 text-align: center;
3568 display: flex;
3569 align-items: center;
3570 justify-content: center;
3571 }
3572
3573 @media (min-width: 1199px) and (max-width: 1399px) {
3574 .embedpress-card .icon {
3575 position: static;
3576 margin-bottom: 20px;
3577 }
3578 }
3579
3580 @media (max-width: 767px) {
3581 .embedpress-card .icon {
3582 position: static;
3583 margin-bottom: 20px;
3584 }
3585 }
3586
3587 .embedpress-card .icon i {
3588 color: #ffffff;
3589 font-size: 20px;
3590 line-height: 50px;
3591 }
3592
3593 .embedpress-card h3 {
3594 font-size: 25px;
3595 font-weight: 5;
3596 color: #131F4D;
3597 margin-bottom: 10px;
3598 margin-top: 5px;
3599 }
3600
3601 @media (max-width: 767px) {
3602 .embedpress-card h3 {
3603 font-size: 22px;
3604 }
3605 }
3606
3607 .embedpress-card p {
3608 font-size: 14px;
3609 font-weight: 400;
3610 color: #7C8DB5;
3611 margin-bottom: 20px;
3612 }
3613
3614 .element__item {
3615 background: #F5F7FD;
3616 border-radius: 10px;
3617 min-height: 80px;
3618 padding: 10px 24px;
3619 border: 2px solid rgba(91, 78, 150, 0.1);
3620 display: -webkit-box;
3621 display: -ms-flexbox;
3622 display: flex;
3623 -webkit-box-align: center;
3624 -ms-flex-align: center;
3625 align-items: center;
3626 /* overflow : hidden; */
3627 }
3628
3629 @media (max-width: 767px) {
3630 .element__item {
3631 padding: 20px;
3632 padding-right: 15px;
3633 }
3634 }
3635
3636 /* .element__item.isPro .pro__item {
3637 display: block; }*/
3638
3639 .element__item h5 {
3640 font-size: 18px;
3641 font-weight: 700;
3642 color: #25396F;
3643 margin-right: 15px;
3644 }
3645
3646 @media (max-width: 767px) {
3647 .element__item h5 {
3648 font-size: 16px;
3649 }
3650 }
3651
3652 .element__item .has__question {
3653 color: rgba(124, 141, 181, 0.5);
3654 line-height: 1;
3655 margin-top: 2px;
3656 margin-right: 10px;
3657 position: relative;
3658 }
3659
3660 .element__item .has__question .element__tooltip {
3661 position: absolute;
3662 bottom: calc(100% + 12px);
3663 left: -20px;
3664 /* transform : translateX(-50%); */
3665 background: #5B4E96;
3666 color: #fff;
3667 padding: 20px;
3668 min-width: 200px;
3669 border-radius: 5px;
3670 font-size: 16px;
3671 transition: all .3s ease;
3672 opacity: 0;
3673 visibility: hidden;
3674 z-index: 9;
3675 }
3676
3677 .element__item .has__question:hover .element__tooltip {
3678 visibility: visible;
3679 opacity: 1;
3680 }
3681
3682 .element__item .has__question .element__tooltip:before {
3683 position: absolute;
3684 top: 100%;
3685 left: 18px;
3686 /* transform: translateX(-50%); */
3687 border-left: 10px solid transparent;
3688 border-right: 10px solid transparent;
3689 border-top: 10px solid #5B4E96;
3690 content: '';
3691 }
3692
3693 .element__item .input__switch {
3694 margin-left: auto;
3695 margin-bottom: 0;
3696 }
3697
3698 .element__item .pro__item {
3699 position: absolute;
3700 top: 5px;
3701 left: -16px;
3702 -webkit-transform: rotate(-45deg);
3703 transform: rotate(-45deg);
3704 font-size: .85rem;
3705 font-weight: 400;
3706 color: #ffffff;
3707 background: #5B4E96;
3708 padding: 0 20px;
3709 text-transform: uppercase;
3710 display: none;
3711 }
3712
3713 @media (max-width: 767px) {
3714 .element__item .pro__item {
3715 font-size: 9px;
3716 }
3717 }
3718
3719 .embedpress--elements__wrap h3 {
3720 font-size: 24px;
3721 font-weight: 700;
3722 color: #131F4D;
3723 padding-bottom: 16px;
3724 margin-bottom: 24px;
3725 border-bottom: 1px solid #F5F7FC;
3726 }
3727
3728 @media (max-width: 767px) {
3729 .embedpress--elements__wrap h3 {
3730 font-size: 24px;
3731 }
3732 }
3733
3734 @media (max-width: 575px) {
3735 .embedpress--elements__wrap h3 {
3736 font-size: 20px;
3737 }
3738 }
3739
3740 @media (max-width: 991px) {
3741 .embedpress--elements__wrap .embedpress__row.grid__4 {
3742 -ms-grid-columns: 1fr 1fr;
3743 grid-template-columns: repeat(2, 1fr);
3744 }
3745 }
3746
3747 @media (max-width: 575px) {
3748 .embedpress--elements__wrap .embedpress__row.grid__4 {
3749 -ms-grid-columns: 1fr;
3750 grid-template-columns: repeat(1, 1fr);
3751 }
3752 }
3753
3754 .valid-license-icon {
3755 max-width: 100%;
3756 width: 1.5rem;
3757 }
3758
3759
3760
3761 .embedpress-toast__message {
3762 position: fixed;
3763 bottom: 50px;
3764 right: 50px;
3765 padding: 15px 25px;
3766 border-radius: 10px;
3767 max-width: 400px;
3768 z-index: 9999;
3769 display: flex;
3770 align-items: center;
3771 opacity: 0;
3772 visibility: hidden;
3773 transition: all .3s ease;
3774 }
3775
3776 .embedpress-toast__message.show {
3777 opacity: 1;
3778 visibility: visible;
3779 }
3780
3781 .embedpress-toast__message.toast__message--error {
3782 background: #FE504F;
3783 }
3784
3785 .embedpress-toast__message.toast__message--attention {
3786 background: #FFA53C
3787 }
3788
3789 .embedpress-toast__message.toast__message--success {
3790 background: #00CC76;
3791 }
3792
3793 .embedpress-toast__message img {
3794 height: 40px;
3795 margin-right: 20px;
3796 }
3797
3798 .embedpress-toast__message p {
3799 color: #ffffff;
3800 font-size: 14px;
3801 }
3802
3803 .template__wrapper .wp-color-result-text {
3804 padding: 0 5px;
3805 }
3806
3807 @media all and (max-width: 1600px) {
3808 .embedpress-license__details .license__content .form__inline {
3809 display: block;
3810 }
3811
3812 .embedpress-license__details .license__content .form__group {
3813 margin-bottom: 25px;
3814 margin-right: 0;
3815 }
3816
3817 .embedpress-license__details .license__content .form__group .form__control {
3818 height: 60px;
3819 font-size: 14px;
3820 }
3821
3822 .embedpress-license__details .license__content .form__group .input__icon {
3823 width: 18px;
3824 top: 16px;
3825 }
3826 }
3827
3828 .ep-coming-soon {
3829 color: #5b4e96;
3830 font-size: .85rem;
3831 font-weight: 900;
3832 }
3833
3834 .embedpress-card a,
3835 .template__wrapper .ep-link {
3836 color: #5b4e96;
3837 }
3838
3839 .template__wrapper .ep-link {
3840 font-weight: 600;
3841 }
3842
3843 .proOverlay {
3844 opacity: .3;
3845 position: relative;
3846 }
3847
3848 .proOverlay::after {
3849 position: absolute;
3850 top: 0;
3851 left: 0;
3852 bottom: 0;
3853 content: '';
3854 width: 100%;
3855 height: 100%;
3856 display: block;
3857 }
3858
3859 .embedpress__shortcode .shortcode__text {
3860 margin-bottom: 40px;
3861 font-size: 16px;
3862 line-height: 1.6;
3863 color: #25396F;
3864 }
3865
3866 .embedpress__shortcode .shortcode__form {
3867 width: 100%;
3868 max-width: 750px;
3869 box-sizing: border-box;
3870 background-color: #F5F7FC;
3871 border: 1px solid #D7DEEE;
3872 border-radius: 8px;
3873 padding: 12px;
3874 display: flex;
3875 }
3876
3877 .embedpress__shortcode .shortcode__form .form__group {
3878 flex-grow: 1;
3879 }
3880
3881 .embedpress__shortcode .shortcode__form .form__group .form__control {
3882 height: 50px;
3883 background-color: transparent;
3884 border: none;
3885 }
3886
3887 .embedpress__shortcode .shortcode__form .button__redColor {
3888 background-color: #FF7369;
3889 border-color: #FF7369;
3890 color: #fff;
3891 }
3892
3893 .embedpress__shortcode .shortcode__form .copy__button {
3894 background-color: #5B4E96;
3895 border-color: #5B4E96;
3896 color: #fff;
3897 }
3898
3899
3900 /* source page css */
3901 .source-settings-page {
3902 background: #fff;
3903 padding: 24px;
3904 border-radius: 16px;
3905 }
3906
3907 .source-settings-page.page-premium {
3908 padding: 24px 0;
3909 }
3910
3911 .source-settings-page.page-premium .page-premium-text {
3912 margin-bottom: 20px;
3913 font-size: 16px;
3914 line-height: 1.6;
3915 color: #25396F;
3916 max-width: 80%;
3917 }
3918
3919 h1.page-heading {
3920 color: #25396F;
3921 font-family: 'DMSans';
3922 font-size: 24px;
3923 font-style: normal;
3924 font-weight: 600;
3925 line-height: 120%;
3926 padding-bottom: 16px;
3927 border-bottom: 1px solid #F5F7FC;
3928 }
3929
3930 .upgrage__card__tab__style h3 {
3931 color: #25396F;
3932 font-family: 'DMSans';
3933 font-size: 20px;
3934 font-style: normal;
3935 font-weight: 600;
3936 line-height: 1;
3937 /* 24px */
3938 }
3939
3940 .upgrage__card__tab__style p {
3941 color: #707070;
3942 font-family: 'DMSans';
3943 font-size: 16px;
3944 font-style: normal;
3945 font-weight: 400;
3946 line-height: 160%;
3947 /* 25.6px */
3948 }
3949
3950 a.button.button__themeColor {
3951 border-radius: 8px;
3952 background: #EEEDF4;
3953 border: none;
3954 }
3955
3956 ul.source-tab {
3957 margin-top: 10px;
3958 width: 100%;
3959 padding-right: 15px;
3960 padding-left: 15px;
3961 margin-top: 10px;
3962 max-height: 185px;
3963 overflow-y: scroll;
3964 }
3965
3966 ul.source-tab::-webkit-scrollbar {
3967 width: 5px;
3968 }
3969
3970 ul.source-tab::-webkit-scrollbar-track {
3971 background: #f5f7fd;
3972 border-radius: 5px;
3973 }
3974
3975 ul.source-tab::-webkit-scrollbar-thumb {
3976 background: #988FBD;
3977 border-radius: 5px;
3978 }
3979
3980 li.tab-button {
3981 display: inline-flex;
3982 align-items: center;
3983 gap: 5px;
3984 background-color: transparent;
3985 padding: 8px 15px;
3986 border-radius: 15px;
3987 cursor: pointer;
3988 width: 100%;
3989 font-size: 14px;
3990 margin-bottom: 2px;
3991 }
3992
3993 li.tab-button:hover {
3994 background: #f5f7fd;
3995 }
3996
3997 li.tab-button.active {
3998 background: #f5f7fd;
3999 }
4000
4001 img.source-image {
4002 width: 14px;
4003 height: 14px;
4004 }
4005
4006 .tab-content-section {
4007 display: grid;
4008 -ms-grid-columns: 1fr 1fr 1fr;
4009 grid-template-columns: repeat(3, 1fr);
4010 /* Three items per row */
4011 gap: 30px;
4012 /* Adjust the gap between items as needed */
4013 }
4014
4015 @media (max-width: 1199px) {
4016 .tab-content-section {
4017 -ms-grid-columns: 1fr 1fr;
4018 grid-template-columns: repeat(2, 1fr);
4019 }
4020 }
4021
4022 .source-item {
4023 padding: 15px;
4024 text-align: center;
4025 display: flex;
4026 align-items: center;
4027 justify-content: space-between;
4028 background: #f5f7fd;
4029 border-radius: 8px;
4030 position: relative;
4031 }
4032
4033 .tab-button-section {
4034 display: none;
4035 }
4036
4037 li.sidebar__item.show .tab-button-section {
4038 display: block;
4039 }
4040
4041 .source-item div {
4042 display: flex;
4043 align-items: center;
4044 gap: 5px;
4045 color: #404040;
4046 font-family: 'DMSans';
4047 font-size: 14px;
4048 font-style: normal;
4049 font-weight: 600;
4050 line-height: 120%;
4051 /* 16.8px */
4052 letter-spacing: -0.28px;
4053 }
4054
4055 .ribbon-container {
4056 position: absolute;
4057 top: -12px;
4058 left: 45px;
4059 background: #524cff;
4060 padding: 5px;
4061 border-radius: 4px;
4062 height: 22px;
4063 display: flex;
4064 align-items: center;
4065 justify-content: center;
4066 color: #fff !important;
4067 font-size: 12px !important;
4068 text-transform: capitalize;
4069 }
4070
4071 .ribbon-container.new {
4072 background-color: #059862;
4073 }
4074
4075 .ribbon-container.popular {
4076 background-color: #0064FF;
4077 }
4078
4079 .ribbon-container.updated {
4080 background-color: #6C757D;
4081 border: none;
4082 }
4083
4084 .source-left .icon {
4085 width: 32px;
4086 height: 32px;
4087 background: #fff;
4088 border-radius: 5px;
4089 display: flex;
4090 align-items: center;
4091 justify-content: center;
4092 }
4093
4094 .source-left .icon img {
4095 width: 16px;
4096 height: auto;
4097 }
4098
4099 .source-right a {
4100 width: 28px;
4101 height: 28px;
4102 background: #fff;
4103 border-radius: 5px;
4104 display: flex;
4105 align-items: center;
4106 justify-content: center;
4107 }
4108
4109 .source-right a svg g {
4110 transition: 0.2s;
4111
4112 }
4113
4114 .source-right a svg {
4115 width: 18px;
4116 height: 18px;
4117 }
4118
4119 .source-right a:hover svg g {
4120 stroke: #5B4E96;
4121 }
4122
4123 .premium-button {
4124 text-align: center;
4125 display: flex;
4126 align-items: center;
4127 justify-content: center;
4128 width: 100%;
4129 margin-top: 20px;
4130 }
4131
4132 .premium-button a {
4133 display: flex !important;
4134 align-items: center;
4135 gap: 8px;
4136 background: #EEEDF4;
4137 padding: 10px 25px;
4138 border-radius: 8px;
4139 width: 100%;
4140 justify-content: center;
4141 }
4142
4143 .premium-button span {
4144 display: flex;
4145 align-items: center;
4146 justify-content: center;
4147 }
4148
4149 .premium-button svg {
4150 width: 18px;
4151 height: 18px;
4152 }
4153
4154
4155 @media only screen and (max-width: 991px) {
4156 .tab-content-section {
4157 -ms-grid-columns: 1fr 1fr;
4158 grid-template-columns: repeat(2, 1fr);
4159 }
4160 }
4161
4162 /* Instagram setting css */
4163 /* Reset default table styles */
4164 table {
4165 border-collapse: collapse;
4166 width: 100%;
4167 }
4168
4169 table,
4170 th,
4171 td {
4172 border: 1px solid #ccc;
4173 }
4174
4175 /* Apply custom styles for the 'emebedpress' class */
4176 .emebedpress {
4177 border-collapse: collapse;
4178 width: 100%;
4179 }
4180
4181 .emebedpress thead {
4182 background-color: #F5F7FD;
4183 }
4184
4185 .emebedpress th,
4186 .emebedpress td {
4187 padding: 12px;
4188 text-align: left;
4189 position: relative;
4190 text-align: center;
4191 }
4192
4193 table.emebedpress th {
4194 white-space: nowrap;
4195 width: 150px;
4196 font-weight: bold;
4197
4198 }
4199
4200 .emebedpress tbody tr:nth-child(even) {
4201 background-color: #f9f9f9;
4202 }
4203
4204 .emebedpress img.user-avatar {
4205 width: 50px;
4206 height: 50px;
4207 border-radius: 50%;
4208 object-fit: cover;
4209 }
4210
4211 .emebedpress input[type="text"] {
4212 width: 60%;
4213 box-sizing: border-box;
4214 border: none;
4215 background-color: transparent;
4216 margin: 0;
4217 padding: 0;
4218 }
4219
4220 .emebedpress .button {
4221 background-color: #0073aa;
4222 color: #fff;
4223 border: none;
4224 padding: 6px;
4225 cursor: pointer;
4226 border-radius: 4px;
4227 }
4228
4229 .emebedpress .button i {
4230 font-size: 18px;
4231
4232 }
4233
4234 .emebedpress .button-primary {
4235 background-color: #5b4e96;
4236 position: absolute;
4237 right: 20px;
4238 align-items: center;
4239 justify-content: center;
4240 }
4241
4242 .emebedpress .button-secondary {
4243 background-color: #f44336 !important;
4244 }
4245
4246 .emebedpress .button-secondary:focus i {
4247 color: white;
4248 }
4249
4250 /* Styles for the account-section */
4251 /* .account-wrap {
4252 max-width: 1200px;
4253 margin: 0 auto;
4254 } */
4255
4256 .user-image {
4257 display: flex;
4258 align-items: center;
4259 justify-content: center;
4260 width: 50px;
4261 }
4262
4263 td.instagram-user-account .username {
4264 text-align: left;
4265 font-size: 16px;
4266 line-height: 1.4rem;
4267 }
4268
4269 td.instagram-user-account .userid {
4270 text-align: left;
4271 font-size: .9rem;
4272 line-height: 1.4rem;
4273
4274 }
4275
4276 .account-section p {
4277 margin-bottom: 10px;
4278 }
4279
4280 .account-button {
4281 text-decoration: none !important;
4282 background-color: #0073aa !important;
4283 color: #fff !important;
4284 border: none;
4285 padding: 10px 15px;
4286 border-radius: 4px;
4287 margin-right: 10px;
4288 display: inline-flex !important;
4289 align-items: center;
4290 gap: 5px;
4291 font-size: 14px;
4292 cursor: pointer;
4293 margin-bottom: 15px;
4294 }
4295
4296 .account-button svg {
4297 fill: currentColor;
4298 width: 20px;
4299 height: 20px;
4300 }
4301
4302 .personal-account {
4303 background-color: #4caf50;
4304 }
4305
4306 .business-account {
4307 background-color: #f44336;
4308 }
4309
4310 .account-link {
4311 margin-left: 10px;
4312 color: #0073aa;
4313 text-decoration: none;
4314 }
4315
4316 .premium-field {
4317 display: inline-block;
4318 margin-left: 10px;
4319 color: #999;
4320 }
4321
4322 .premium-field small {
4323 font-size: .85rem;
4324 }
4325
4326 .description.hidden {
4327 display: none;
4328 }
4329
4330 /* delete alrert box */
4331 .custom-dialog {
4332 position: fixed;
4333 top: 50%;
4334 left: 50%;
4335 transform: translate(-50%, -50%);
4336 background-color: #fff;
4337 padding: 20px;
4338 box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
4339 z-index: 9999;
4340 }
4341
4342 .custom-dialog p {
4343 margin: 0 0 10px;
4344 }
4345
4346 .custom-dialog button {
4347 margin-right: 10px;
4348 padding: 5px 10px;
4349 background-color: #007bff;
4350 color: #fff;
4351 border: none;
4352 cursor: pointer;
4353 }
4354
4355 .custom-dialog button:hover {
4356 background-color: #0056b3;
4357 }
4358
4359 .custom-dialog button:last-child {
4360 margin-right: 0;
4361 background-color: #ccc;
4362 }
4363
4364 /* Optional: To make the buttons the same width */
4365 .custom-dialog button {
4366 width: 80px;
4367 }
4368
4369 .premium-button {
4370 margin-top: 10px !important;
4371 padding: 0 4px 0 0;
4372 }
4373
4374
4375 @media only screen and (max-width: 767px) {
4376 .tab-content-section {
4377 -ms-grid-columns: 1fr;
4378 grid-template-columns: repeat(1, 1fr);
4379 }
4380
4381 header.embedpress-header p {
4382 margin: 10px 0;
4383 text-align: left;
4384 }
4385 }
4386
4387
4388 /* // Calendly settings page design */
4389 .calendly-embedpress-authorize-button {
4390 display: flex;
4391 justify-content: space-between;
4392 margin-bottom: 15px;
4393 }
4394
4395 .calendly-settings-title {
4396 margin-bottom: 30px !important;
4397 }
4398
4399 a.calendly-connect-button {
4400 display: inline-flex;
4401 align-items: center;
4402 font-size: 15px;
4403 color: rgb(54, 100, 174);
4404 gap: 6px;
4405 border-width: 1px;
4406 border-style: solid;
4407 border-color: rgb(54, 100, 174);
4408 border-image: initial;
4409 padding: 8px 20px;
4410 border-radius: 10px;
4411 }
4412
4413 a.calendly-connect-button:hover {
4414 color: #fff;
4415 background: rgb(54, 100, 174);
4416 }
4417
4418 a.calendly-connected {
4419 /* pointer-events: none !important; */
4420 background: rgba(54, 100, 174, 0.08);
4421 border-width: 1px;
4422 border-style: solid;
4423 border-color: rgba(54, 100, 174, 0.08);
4424 border-image: initial;
4425 }
4426
4427 a.calendly-connect-button img {
4428 width: 20px;
4429 }
4430
4431
4432 /* Apply styles to the event-type-list container */
4433 .event-type-list {
4434 font-family: Arial, sans-serif;
4435 }
4436
4437 /* Apply styles to the list-header */
4438 .list-header {
4439 background-color: #3664ae;
4440 color: #fff;
4441 padding: 10px;
4442 display: flex;
4443 align-items: center;
4444 gap: 10px;
4445 border-radius: 10px;
4446 }
4447
4448
4449 /* Apply styles to the user's avatar */
4450 .calendly-user .bqa3nmp img {
4451 width: 50px;
4452 height: 50px;
4453 border-radius: 50%;
4454 margin-right: 10px;
4455 }
4456
4457 /* Apply styles to the user's name */
4458 .calendly-user .name p {
4459 font-weight: bold;
4460 font-size: 18px;
4461 }
4462
4463
4464 /* Apply styles to the event-type-card */
4465 .event-type-card-list {
4466 display: grid;
4467 grid-template-columns: repeat(3, 1fr);
4468 gap: 20px;
4469 margin-top: 15px;
4470 }
4471
4472 .calendly-data-placeholder .event-type-card-list {
4473 padding: 0 20px 20px;
4474 }
4475
4476 .event-type-card-list-item {
4477 background-color: #ffffff;
4478 border: 1px solid #faf4f4;
4479 border-radius: 5px;
4480 border-top: 6px solid var(--calendly-event-color);
4481 }
4482
4483 .event-type-card {
4484 padding: 10px;
4485 }
4486
4487 .calendly-profile-avatar {
4488 width: 50px;
4489 height: 50px;
4490 }
4491
4492 .calendly-profile-avatar img {
4493 border-radius: 50px;
4494 }
4495
4496 .event-type-card-top {
4497 border-bottom: 1px solid #ebe1e1;
4498 padding-bottom: 10px;
4499 }
4500
4501 .event-type-card-top h2 {
4502 font-size: 15px;
4503 font-weight: 500;
4504 margin-bottom: 8px;
4505 }
4506
4507 .event-type-card-top p {
4508 font-size: 11px;
4509 color: #b19999;
4510 margin-bottom: 12px;
4511 }
4512
4513 .event-type-card-top a {
4514 color: #3664ae;
4515 font-size: .85rem;
4516 }
4517
4518 .event-type-card-bottom {
4519 display: flex;
4520 align-items: center;
4521 justify-content: space-between;
4522 padding-top: 10px;
4523 }
4524
4525 .event-status {
4526 font-size: 14px;
4527 }
4528
4529 .event-status.Active {
4530 color: #008000c9;
4531 }
4532
4533 .event-status.In-active {
4534 color: gray;
4535 }
4536
4537 .calendly-event-copy-link {
4538 display: flex;
4539 align-items: center;
4540 gap: 5px;
4541 font-size: 14px;
4542 color: #3664ae;
4543 cursor: pointer;
4544 }
4545
4546 [data-event-status="In-active"] .event-type-card-top a,
4547 [data-event-status="In-active"] .calendly-event-copy-link {
4548 color: gray;
4549 }
4550
4551 [data-event-status="In-active"].event-type-card-list-item {
4552 border-top-color: #b2b2b2 !important;
4553 }
4554
4555 [data-event-status="In-active"] .calendly-event-copy-link svg path {
4556 fill: gray;
4557 }
4558
4559 .calendly-event-copy-link svg {
4560 width: 14px;
4561 height: 14px;
4562 }
4563
4564
4565 /* scheduled list table css */
4566
4567
4568 .rwd-table {
4569 max-width: 100%;
4570 width: 100%;
4571
4572 }
4573
4574 .rwd-table tr:first-child {
4575 border-top: none;
4576 background: #3664ae;
4577 color: #fff;
4578 }
4579
4580 .rwd-table tr {
4581 border-top: 1px dotted red;
4582 border-bottom: 1px dotted red;
4583 }
4584
4585
4586 .rwd-table th {
4587 display: none;
4588 }
4589
4590 .rwd-table td {
4591 display: block;
4592
4593 }
4594
4595 .rwd-table td:before {
4596 content: attr(data-th) ": ";
4597 width: 120px;
4598 display: inline-block;
4599 color: #000;
4600 }
4601
4602 .rwd-table th,
4603 .rwd-table td {
4604 padding-left: 30px !important;
4605 }
4606
4607 .rwd-table {
4608 color: #333;
4609 border-radius: .4em;
4610 width: 100%;
4611 /* Set the table width to 100% */
4612 /* table-layout: fixed; */
4613 }
4614
4615 .rwd-table tr {
4616 border-color: red;
4617 }
4618
4619
4620 .rwd-table td:before {
4621 display: none;
4622 }
4623
4624 .rwd-table th,
4625 .rwd-table td {
4626 display: table-cell;
4627 padding: .5em .5em;
4628 text-align: left;
4629 font-family: Arial, sans-serif;
4630 font-size: 14px;
4631 white-space: nowrap;
4632 /* width : 25%; */
4633 /* Divide the width evenly among the columns */
4634
4635 }
4636
4637 .rwd-table th {
4638 font-size: 15px;
4639 padding: 1em .5em;
4640 font-weight: 500;
4641 }
4642
4643 .rwd-table th:first-child {
4644 border-top-left-radius: 10px;
4645 border-bottom-left-radius: 10px;
4646 }
4647
4648 .rwd-table th:last-child {
4649 border-top-right-radius: 10px;
4650 border-bottom-right-radius: 10px;
4651 }
4652
4653 .rwd-table td {
4654 border-bottom: 1px dotted #ddd;
4655 /* border-radius: 10px; */
4656 /* border-right : 1px dotted #ddd; */
4657 }
4658
4659 /* .rwd-table td:first-child {
4660 border-left: 1px dotted #ddd;
4661 } */
4662
4663
4664 /* Tab container */
4665 .tab-container {
4666 display: flex;
4667 gap: 5px;
4668 background: #fff7f7;
4669 padding: 8px 10px;
4670 border-radius: 10px;
4671 }
4672
4673 /* Individual tab */
4674 .tab-container .tab {
4675 padding: 8px 20px;
4676 cursor: pointer;
4677 background-color: #fff7f7;
4678 border-radius: 10px;
4679 font-size: 15px;
4680
4681 }
4682
4683 /* Active tab */
4684 .tab-container .active-tab {
4685 background-color: #3664ae;
4686 color: #fff;
4687 }
4688
4689 /* Content container */
4690 .tab-content {
4691 display: none;
4692 width: 100%;
4693 }
4694
4695 /* Show the active tab content */
4696 .tab-content.active {
4697 display: block;
4698 }
4699
4700 .calendly-data-placeholder {
4701 position: relative;
4702 margin-top: 15px;
4703 }
4704
4705 .calendly-data-placeholder img {
4706 pointer-events: none;
4707 }
4708
4709 .calendly-data-placeholder {
4710 position: relative;
4711 margin-top: 5px;
4712 padding-top: 5px;
4713 }
4714
4715 .overlay {
4716 position: absolute;
4717 top: 0;
4718 left: 0;
4719 width: 100%;
4720 height: 100%;
4721 background-color: #3664ae26;
4722 text-align: center;
4723 display: flex;
4724 flex-direction: column;
4725 justify-content: center;
4726 border-radius: 10px;
4727 align-items: center;
4728 }
4729
4730 .overlay-button {
4731 background-color: #006bff;
4732 color: #fff !important;
4733 padding: 10px 20px;
4734 border: none;
4735 cursor: pointer;
4736 max-width: 300px;
4737 font-weight: 500;
4738 border-radius: 10px;
4739 }
4740
4741 .calendly-connector-container {
4742 display: flex;
4743 align-items: end;
4744 gap: 5px;
4745 }
4746
4747 @media only screen and (max-width: 768px) {
4748 .calendly-connector-container {
4749 margin-bottom: 15px;
4750 }
4751
4752 .calendly-embedpress-authorize-button {
4753 flex-direction: column;
4754 justify-content: center;
4755 }
4756
4757 .tab-container {
4758 width: 100%;
4759 align-items: center;
4760 justify-content: center;
4761 }
4762
4763 .tab-container .tab {
4764 padding: 8px 10px;
4765 font-size: 14px;
4766 width: 50%;
4767 text-align: center;
4768 }
4769
4770 .calendly-data {
4771 overflow: auto;
4772 }
4773
4774 .event-type-card-list {
4775 grid-template-columns: repeat(2, 1fr);
4776 }
4777
4778 .rwd-table {
4779 min-width: 700px;
4780 overflow: auto;
4781 table-layout: auto;
4782 }
4783
4784 .rwd-table th,
4785 .rwd-table td {
4786 padding: 10px;
4787 font-size: .9rem;
4788 }
4789
4790 .rwd-table th,
4791 .rwd-table td {
4792 padding-left: 20px !important;
4793 width: auto;
4794 }
4795 }
4796
4797
4798 @media only screen and (max-width: 480px) {
4799 .event-type-card-list {
4800 grid-template-columns: repeat(1, 1fr);
4801 }
4802
4803 .tab-container {
4804 padding: 8px 6px;
4805 }
4806
4807 .tab-container .tab {
4808 white-space: nowrap;
4809 padding: 8px 5px;
4810 font-size: .85rem;
4811 text-align: center;
4812 }
4813 }
4814
4815 form#instagram-form {
4816 width: 400px;
4817 padding: 20px;
4818 border-radius: 15px;
4819 }
4820
4821 form#instagram-form select#account-option,
4822 form#instagram-form input#instagram-access-token {
4823 width: 100%;
4824 height: 45px;
4825 margin-bottom: 10px;
4826 border-radius: 5px;
4827 }
4828
4829 /* Styling for overlay background */
4830 .account-section .modal-overlay {
4831 position: fixed;
4832 top: 0;
4833 left: 0;
4834 width: 100%;
4835 height: 100%;
4836 background-color: rgba(0, 0, 0, 0.8);
4837 /* Semi-transparent black */
4838 z-index: 9999;
4839 /* Ensure it's on top of everything */
4840 display: none;
4841 /* Hide by default */
4842 }
4843
4844 /* Styling for the modal itself */
4845 .account-section .modal {
4846 position: fixed;
4847 top: 50%;
4848 left: 50%;
4849 transform: translate(-50%, -50%);
4850 background-color: #fff;
4851 padding: 20px;
4852 border-radius: 8px;
4853 box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
4854 /* Drop shadow effect */
4855 z-index: 10000;
4856 /* Ensure it's on top of the overlay */
4857 max-width: 80%;
4858 /* Adjust the maximum width as needed */
4859 max-height: 80%;
4860 /* Adjust the maximum height as needed */
4861 overflow-y: auto;
4862 /* Enable vertical scrolling if content overflows */
4863 }
4864
4865 /* Styling for close button */
4866 form#instagram-form .close-btn {
4867 position: absolute;
4868 top: 5px;
4869 right: 5px;
4870 cursor: pointer;
4871 background: #f2f2f2;
4872 width: 25px;
4873 height: 25px;
4874 display: flex;
4875 align-items: center;
4876 justify-content: center;
4877 border-radius: 5px;
4878 }
4879
4880 form#instagram-form button {
4881 background-color: #594E91;
4882 color: #fff;
4883 }
4884
4885 .form-footer {
4886 display: flex;
4887 align-items: center;
4888 justify-content: space-between;
4889 margin-top: 10px;
4890 }
4891
4892 form#instagram-form label {
4893 display: inline-block;
4894 }
4895
4896 a.for-business,
4897 a.for-personal {
4898 display: inline-block;
4899 text-decoration: underline;
4900 font-size: 14px;
4901 font-weight: normal;
4902 color: inherit;
4903 margin-bottom: 10px;
4904 color: #2271b1;
4905 }
4906
4907 .no-account-connected {
4908 text-align: center;
4909 margin: 45px;
4910 }
4911
4912 #instagram-form .form-group {
4913 position: relative;
4914 }
4915
4916 #instagram-form .form-group a {
4917 position: absolute;
4918 background: #f5f6ff;
4919 width: 20px;
4920 height: 20px;
4921 display: flex;
4922 align-items: center;
4923 justify-content: center;
4924 text-align: center;
4925 right: 0;
4926 top: 12px;
4927 right: 12px;
4928 border-radius: 5px;
4929 }
4930
4931 .user-profile-link {
4932 padding: 5px 10px;
4933 background-color: #007bff;
4934 color: #fff;
4935 border: none;
4936 border-radius: 4px;
4937 cursor: pointer;
4938 transition: background-color 0.3s;
4939 font-size: 14px;
4940 cursor: pointer;
4941 }
4942
4943 .user-profile-link:hover {
4944 background-color: #0056b3;
4945 }
4946
4947 .emebedpress img.user-avatar {
4948 border: 2px solid #037bff;
4949 }
4950
4951 td.instagram-user-account {
4952 display: flex;
4953 align-items: center;
4954 gap: 10px;
4955 }
4956
4957 td.instagram-sync-data {
4958 cursor: pointer;
4959 }
4960
4961 .sync-spin {
4962 animation: spin 1s linear infinite;
4963 /* Apply the spin animation */
4964 }
4965
4966
4967
4968 /* leon css */
4969 h3.cart-title {
4970 font-size: 18px;
4971 font-weight: 700px;
4972 }
4973
4974 ul.feature-list li {
4975 color: #25396F;
4976 }
4977
4978 @keyframes spin {
4979 to {
4980 transform: rotate(360deg);
4981 /* Rotate the element 360 degrees */
4982 }
4983 }
4984
4985
4986 @media (max-width: 1450px) {
4987
4988 .pdf_custom_color_settings .form__control__wrap .input__switch .logo__adjust__toggler {
4989 top: calc(100% + 5px);
4990 left: 0;
4991 }
4992
4993 .template__wrapper label {
4994 margin-bottom: 20px;
4995 }
4996
4997 }
4998
4999 @media (max-width: 1350px) {
5000
5001 .embedpress_general_settings__form:not(:last-child),
5002 .embedpress__shortcode {
5003 width: 100%;
5004 margin-right: 0;
5005 }
5006
5007
5008
5009 }
5010
5011 @media (min-width: 991px) and (max-width:1120px) {
5012
5013 .shortcode-settings-wrapper,
5014 .embedpress_general_settings__form:not(:last-child),
5015 .embedpress__shortcode {
5016 width: 100%;
5017 /* display: block; */
5018 }
5019
5020 .embedpress-upgrade-pro-sidebar {
5021 display: none;
5022 }
5023
5024
5025 }
5026
5027 @media (max-width: 767px) {
5028 .embedpress_general_settings__form:not(:last-child) {
5029 width: 100%;
5030 margin-right: 0;
5031 }
5032
5033 .embedpress-upgrade-pro-sidebar {
5034 display: none;
5035 }
5036
5037 }
5038
5039
5040 /* Leon your Style write here */
5041 /* base */
5042
5043 .embedpress-flex {
5044 display: flex;
5045 }
5046
5047 .embedpress-flex-wrap {
5048 flex-wrap: wrap;
5049 }
5050
5051 .embedpress-hub-section .embedpress-row {
5052 display: flex;
5053 width: 100%;
5054 gap: 12px;
5055 flex-wrap: wrap;
5056 justify-content: space-between;
5057 }
5058
5059
5060
5061 .embdpress-porsition-relative {
5062 position: relative;
5063 }
5064
5065 .embedpress-hub-section .new-tag {
5066 background-color: #059862;
5067 padding: 1px 4px;
5068 color: #FFFFFF;
5069 font-weight: 600;
5070 font-size: 8px;
5071 border-radius: 4px;
5072 position: absolute;
5073 top: -7px;
5074 right: -12px;
5075 }
5076
5077 .embedpress-item-center {
5078 align-items: center;
5079 }
5080
5081 .embedpress-justify-between {
5082 justify-content: space-between;
5083 }
5084
5085 .embedpress-justify-content-center {
5086 justify-content: center;
5087 }
5088
5089 .embedpress-font-family-dmsans {
5090 font-family: 'DMSans';
5091 }
5092
5093 .embedpress-line-height-0 {
5094 line-height: 0;
5095 }
5096
5097 .embdpress-hilight-text {
5098 font-weight: 700;
5099 text-decoration: underline;
5100 }
5101
5102 .embedpress-mr-4 {
5103 margin-right: 4px;
5104 }
5105
5106 .embedpress-mb-16 {
5107 margin-bottom: 16px;
5108 }
5109
5110 .embedpress-font-xl {
5111 font-size: 24px;
5112 font-weight: 600;
5113 color: #000000;
5114 }
5115
5116 .embedpress-font-l {
5117 font-size: 20px;
5118 font-weight: 600;
5119 color: #000000;
5120 }
5121
5122 .embedpress-font-m {
5123 font-weight: 400;
5124 font-size: .8rem;
5125 color: #000000;
5126
5127 }
5128
5129 .embdpress-underline {
5130 text-decoration: underline !important;
5131 }
5132
5133 .embedpress-btn {
5134 padding: 10px 13px;
5135 border-radius: 6px;
5136 }
5137
5138 .embedpress-banner-wrapper {
5139 margin-bottom: 58px;
5140 }
5141
5142 .embedpress-hub-section .banner-icon {
5143 height: 25px;
5144 width: 25px;
5145 }
5146
5147 .embedpress-hub-section .banner-icon-l {
5148 height: 20px;
5149 width: auto;
5150 }
5151
5152 .embedpress-hub-section .banner-icon-l img {
5153 width: 100%;
5154 height: 100%;
5155 object-fit: cover;
5156 filter: brightness(0);
5157 }
5158
5159 .embedpress-hub-section .error-msg {
5160 color: #FF0000 !important;
5161 }
5162
5163 .embedpress-hub-section .valid-msg {
5164 color: #5B4E96 !important;
5165 }
5166
5167 .embedpress-hub-section .banner-icon img {
5168 width: auto;
5169 height: 25px;
5170 margin-top: -2px;
5171 }
5172
5173 .embedPress-introduction-panel-wrapper .embedpress-cancel-button {
5174 background: transparent;
5175 padding: 0;
5176 color: #595092;
5177 cursor: pointer;
5178 text-decoration: underline;
5179 margin-top: -25px;
5180 }
5181
5182 .embedPress-introduction-panel-wrapper {
5183 max-width: 100%;
5184 /* max-width : 1277px; */
5185 margin: 54px 40px;
5186 background-color: #FFF9EF;
5187 border-radius: 6px;
5188 box-sizing: border-box;
5189 overflow: hidden;
5190 box-shadow: 0px 0px 2px 0px #59509233;
5191 display: flex;
5192 justify-content: space-between;
5193 /* display : none; */
5194 }
5195
5196 .embedPress-introduction-panel-wrapper .embedPress-introduction-left-panel {
5197 width: 55%;
5198 padding: 33px 26px 33px 26px;
5199 border-top-right-radius: 6px;
5200 border-bottom-right-radius: 6px;
5201 position: relative;
5202 display: flex;
5203 align-items: center;
5204 clip-path: polygon(0 0, 95% 0, 100% 100%, 0% 100%);
5205 background-color: #fff;
5206 justify-content: space-between;
5207 padding-right: 70px;
5208 }
5209
5210
5211 .embedPress-introduction-panel-wrapper .embedPress-left-panel-header {
5212 margin-bottom: 10px;
5213 line-height: 1.2;
5214 }
5215
5216
5217 .embedPress-introduction-panel-wrapper .embedpress-progress-container {
5218 width: 100%;
5219 max-width: 290px;
5220 height: 5px;
5221 background-color: #D9D9D9;
5222 border-radius: 8px;
5223 overflow: hidden;
5224 position: relative;
5225 margin-bottom: 18px;
5226 }
5227
5228 .embedPress-introduction-panel-wrapper .embedpress-progress-bar {
5229 position: absolute;
5230 bottom: 0;
5231 width: calc(var(--progress) * 100%);
5232 height: 100%;
5233 background: #059862;
5234 display: flex;
5235 align-items: flex-end;
5236 justify-content: center;
5237 color: #fff;
5238 font-weight: bold;
5239 transition: height 0.5s ease;
5240 border-radius: 8px;
5241 }
5242
5243 .embedPress-introduction-panel-wrapper .embedpress-follow-steps-header {
5244 margin-bottom: 8px;
5245 }
5246
5247 .embedPress-introduction-panel-wrapper .embedpress-follow-steps-list {
5248 list-style: decimal;
5249 width: 100%;
5250 max-width: 350px;
5251 padding-left: 20px;
5252 }
5253
5254 .embedPress-introduction-panel-wrapper .embedpress-follow-steps-list .embedpress-follow-steps-list-item a {
5255 color: #5a5092;
5256 }
5257
5258 .embedPress-introduction-panel-wrapper .embedpress-follow-steps-list .embedpress-follow-steps-list-item a:hover {
5259 text-decoration: underline;
5260 }
5261
5262 .embedPress-introduction-panel-wrapper .embedPess-img-wrapper {
5263 width: auto;
5264 margin-bottom: -20px;
5265 }
5266
5267 .embedPress-introduction-panel-wrapper .embedPess-img-wrapper .embedPress-img-wrapper-left {
5268 max-width: 145px;
5269 width: 100%;
5270 margin-bottom: -180px;
5271 }
5272
5273 .embedPress-introduction-panel-wrapper .embedPess-img-wrapper .embedPress-img-wrapper-right {
5274 max-width: 145px;
5275 width: 100%;
5276 margin-left: 92px;
5277 margin-top: 30px;
5278 }
5279
5280 .embedPress-introduction-panel-wrapper .embedPess-img-wrapper img {
5281 object-fit: cover;
5282 }
5283
5284 .embedPress-introduction-panel-wrapper .embedPress-introduction-right-panel {
5285 padding: 33px 26px 33px 26px;
5286 width: 45%;
5287 }
5288
5289 .embedPress-introduction-panel-wrapper .embedPress-introduction-right-panel .embedPress-text-header-wrapper {
5290 width: 100%;
5291 margin-bottom: 18px;
5292 }
5293
5294 .embedPress-introduction-panel-wrapper .embedPress-introduction-right-panel .embedpress-left-content {
5295 width: 70%;
5296 }
5297
5298 .embedpress-premium-features-list {
5299 display: flex;
5300 flex-wrap: wrap;
5301 margin-bottom: 20px !important;
5302 }
5303
5304 .embedpress-premium-features-list-item {
5305 width: 50%;
5306 position: relative;
5307 padding-left: 20px;
5308 font-size: 0.75rem;
5309 }
5310
5311 .embedpress-premium-features-list-item::after {
5312 content: '';
5313 position: absolute;
5314 width: 9px;
5315 height: 9px;
5316 top: 5px;
5317 left: 5px;
5318 background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 10'%3E%3Cpath d='M8.91675 0.916077L3.66675 7.99941L0.916748 5.91608L0.166748 6.91608L3.91675 9.74941L9.91675 1.66608L8.91675 0.916077Z' fill='%23FCA108'/%3E%3C/svg%3E");
5319
5320 }
5321
5322 .embedPress-introduction-panel-wrapper .embdpress-compare-btn {
5323 background-color: #595092;
5324 color: #FFFFFF;
5325 }
5326
5327 .embedPress-introduction-panel-wrapper .embedPress-introduction-right-panel .embedpress-right-content {
5328 width: 30%;
5329 }
5330
5331 .embedPress-introduction-panel-wrapper .embedpress-right-content .embedPess-img-wrapper {
5332 height: 131px;
5333 width: auto;
5334 }
5335
5336 .embedPress-introduction-panel-wrapper .embedpress-right-content .embedPess-img-wrapper img {
5337 height: 100%;
5338 width: auto;
5339 object-fit: cover;
5340 }
5341
5342 .embedpress-hub-section .embedpress-banner {
5343 display: none;
5344 }
5345
5346 .embedpress-hub-section .embedpress-banner-active {
5347 display: block !important;
5348 }
5349
5350 .embedpress-hub-section .embedpress-banner-box {
5351 width: 100%;
5352 height: 100%;
5353 border-radius: 6px;
5354 background-color: #FFFFFF;
5355 justify-content: space-between;
5356 border: 0.5px solid #ffffff;
5357 }
5358
5359 .embedpress-brand-wrapper {
5360 background-color: #F6F3FF;
5361 border: 0.5px dashed #595092;
5362 height: 100%;
5363 border-radius: 6px;
5364 }
5365
5366 .embedpress-hub-section .embedpress-banner-header {
5367 font-weight: 500;
5368 }
5369
5370
5371 .embedpress-hub-section .embedpress-banner .embedpress-left-content {
5372 width: 65%;
5373 padding-left: 25px;
5374 }
5375
5376 .embedpress-hub-section .embedpress-banner .embedpress-banner-sub-header {
5377 color: #5B4E96;
5378 /* max-width : 243px; */
5379 padding-left: 30px;
5380 font-size: .9rem;
5381
5382 }
5383
5384 .embedpress-hub-section .embedpress-banner .embedpress-right-content {
5385 padding: 2px;
5386 border-radius: 6px;
5387 width: 200px;
5388 display: flex;
5389 justify-content: center;
5390 }
5391
5392 .pro-plugin-active .embedpress-banner .embedpress-right-content {
5393 width: auto !important;
5394 }
5395
5396 .embedpress-right-content.embedpress-branding-preview-wrapper {
5397 flex-direction: column;
5398 }
5399
5400 .embedpress-right-content.embedpress-branding-preview-wrapper .brand-preview-area {
5401 display: flex;
5402 justify-content: center;
5403 }
5404
5405 .preview-actions-button {
5406 display: flex;
5407 justify-content: center;
5408 gap: 10px;
5409 margin-top: 10px;
5410 }
5411
5412 .embedpress-flex.embedpress-item-center.embedpress-banner-box.embedpress-plan-wrapper .embedpress-right-content {
5413 justify-content: right;
5414 }
5415
5416 .embedpress-hub-section .embedpress-banner .embedpress-right-content .embedpress-img-wrapper {
5417 display: flex;
5418 justify-content: right;
5419
5420 }
5421
5422 .embedpress-hub-section .embedpress-banner .embedpress-right-content .embedpress-img-wrapper img {
5423 height: 100%;
5424 width: auto;
5425 object-fit: cover;
5426 max-width: 220px;
5427 }
5428
5429 /* .embedpress-hub-section .embedpress-brand-wrapper .embedpress-right-content {
5430 padding: 27px 32px;
5431 } */
5432
5433 .embedpress-hub-section .embedpress-brand-wrapper .embedpress-right-content .embedpress-img-wrapper {
5434 height: 101px;
5435 width: 165px;
5436 }
5437
5438
5439 .embedpress-license-wrapper .embedpress-banner-secondary-header {
5440 text-decoration: none;
5441 font-size: 15px;
5442 color: #5B4E96;
5443 padding-left: 27px;
5444 margin-bottom: 8px;
5445 }
5446
5447 .embedpress-license-wrapper {
5448 padding: 32px;
5449 background: red;
5450 }
5451
5452 .embedpress-license-wrapper .embedpress-activate-license-btn {
5453 background-color: #059862;
5454 color: #FFFFFF;
5455 font-weight: 600;
5456 margin-top: 19px;
5457 margin-left: 27px;
5458 font-size: .85rem;
5459 }
5460
5461 .embedpress-license-wrapper .embedpress-manages-license-btn {
5462 background-color: #EDEDF4;
5463 color: #000000;
5464 font-weight: 500;
5465 margin-top: 19px;
5466 margin-left: 27px;
5467 font-size: .85rem;
5468 }
5469
5470 .embedpress-license-wrapper .embedpress-license-btn span {
5471 width: 12px;
5472 height: 12px;
5473 display: inline-block;
5474 margin-right: 6px;
5475 margin-top: 2px;
5476 }
5477
5478 .embedpress-license-wrapper .embedpress-license-btn span img {
5479 width: 100%;
5480 height: 100%;
5481 }
5482
5483 .embedpress-branding-options-btn {
5484 background-color: #EAE6FD;
5485 margin-top: 19px;
5486 margin-left: 30px;
5487 font-size: .85rem;
5488 }
5489
5490 .embedpress-upload-brand-wrapper {
5491 padding: 32px 32px 32px 0px;
5492 }
5493
5494 .embedpress-upload-brand-wrapper .embedpress-right-content {
5495 text-align: center;
5496 }
5497
5498 .embedpress-preview-area {
5499 width: 140px;
5500 height: 100px;
5501 background-color: #F5F6FD;
5502 border-radius: 8px;
5503 border: 0.5px dashed #EAE6FD;
5504 display: flex;
5505 justify-content: center;
5506 align-items: center;
5507 position: relative;
5508 border: 1px dashed #ddd;
5509 }
5510
5511 .embedpress-preview-area.embedpress-height-95 {
5512 height: 95px;
5513 }
5514
5515 .embedpress-tag {
5516 position: absolute;
5517 font-size: 8px;
5518 font-weight: 600;
5519 right: -22px;
5520 top: -9px;
5521 background-color: #FCA108;
5522 padding: 2px 5px;
5523 border-radius: 4px;
5524 }
5525
5526 .embedpress-preview-area img {
5527 width: 60px;
5528 height: 60px;
5529 object-fit: contain;
5530 opacity: 0.2;
5531 }
5532
5533 .embedpress-global-brand-preview-img {
5534 width: 60px !important;
5535 height: 60px !important;
5536 object-fit: contain !important;
5537 opacity: 1 !important;
5538 border-radius: 4px;
5539 }
5540
5541 .embedpress-global-brand-indicator {
5542 background-color: #4CAF50;
5543 color: white;
5544 padding: 2px 6px;
5545 border-radius: 3px;
5546 font-size: .8rem;
5547 font-weight: 500;
5548 margin-left: 8px;
5549 display: inline-block;
5550 cursor: help;
5551 }
5552
5553 .embedpress-file-input {
5554 display: none;
5555 }
5556
5557 /* if upload img remove it */
5558
5559 .embedpress-upload-brand-wrapper .embedpress-upload-btn {
5560 color: #000000;
5561 text-decoration: underline;
5562 cursor: pointer;
5563 font-size: .75rem;
5564 background: none;
5565 }
5566
5567 .embedpress-upload-brand-wrapper .embedpress-upload-btn.remove-btn {
5568 color: #FF0000;
5569 }
5570
5571 /* if upload img active it */
5572 .embedpress-another-btns {
5573 gap: 12px;
5574 }
5575
5576 .embedpress-license-wrapper .embedpress-manage-license-btn {
5577 color: #000000;
5578 background-color: #EDEDF4;
5579 font-weight: 400;
5580 }
5581
5582 .embedpress-license-wrapper .embedpress-manage-license-btn svg {
5583 fill: #000000;
5584 }
5585
5586 .embedpress-license-wrapper .embedpress-license-input-wrapper {
5587
5588 border: 2px solid #EDEDF4;
5589 border-radius: 6px;
5590 background-color: #ffffff;
5591 margin-top: 14px;
5592 padding: 5px 14px;
5593 margin-right: 23px;
5594 margin-left: 27px;
5595 display: flex;
5596 align-items: center;
5597 justify-content: space-between;
5598 }
5599
5600 .embedpress-license-wrapper .embedpress-license-input-wrapper .embedpress-license-input {
5601 border: none;
5602 outline: none;
5603 box-shadow: none;
5604 width: calc(100% - 50px);
5605 display: inline;
5606 }
5607
5608 .embedpress-license-wrapper .embedpress-license-input-wrapper .embedpress-active-btn {
5609 display: flex!important;
5610 gap: 8px;
5611 align-items: center;
5612 background: none;
5613 border: none;
5614 color: #059862;
5615 display: inline;
5616 }
5617
5618 .embedpress-license-wrapper .embedpress-license-input-wrapper .embedpress-active-btn svg {
5619 fill: #059862;
5620
5621 }
5622
5623 .embedpress-license-wrapper .embedpress-license-input-wrapper .embedpress-active-btn.embedpress-manage-license-btn-enable {
5624 color: #FF0000;
5625 }
5626
5627 .embedpress-license-wrapper .embedpress-license-input-wrapper .embedpress-active-btn.embedpress-manage-license-btn-enable svg {
5628 fill: #FF0000;
5629 }
5630
5631 .embedpress-popular-content-wrapper {
5632 background-color: #ffffff;
5633 padding: 27px 33px;
5634 border-radius: 6px;
5635 }
5636
5637 .embedpress-popular-types-header {
5638 font-weight: 500;
5639 }
5640
5641 .embedpress-popular-content-header {
5642 margin-bottom: 20px;
5643 }
5644
5645 .embedpress-popular-content-header span.embedpress-flex.embedpress-item-center {
5646 gap: 10px;
5647 }
5648
5649 .embedpress-popular-content-body {
5650 padding: 25px;
5651 background: linear-gradient(to right, #F5F7FD, #F5F7FD);
5652
5653 }
5654
5655 .embedpress-card-header-wrapper {
5656 margin-bottom: 24px;
5657 gap: 5px;
5658 }
5659
5660 .embedpress-content-card-header {
5661 font-weight: 600;
5662 }
5663
5664
5665 .embedpress-popular-content-list .embedpress-popular-content-list-item {
5666 background-color: #ffffff;
5667 /* max-width : 199px; */
5668 width: 100%;
5669 border-radius: 4px;
5670 box-shadow: 0px 0px 10px 0px #0000001A;
5671 padding: 11px;
5672 display: flex;
5673 align-items: center;
5674 justify-content: space-between;
5675 margin-bottom: 20px;
5676
5677 }
5678
5679 .embedpress-flex.embedpress-item-center.content-item-wrapper {
5680 gap: 8px;
5681 }
5682
5683 .embedpress-flex.embedpress-item-center.content-item-wrapper span.embedpress-font-m {
5684 font-size: .85rem;
5685 }
5686
5687 .embedpress-popular-content-list .embedpress-popular-content-list-item:last-child {
5688 margin-bottom: 0px;
5689 }
5690
5691 .embedpress-hub-item-link {
5692 line-height: 0;
5693 cursor: pointer;
5694 }
5695
5696 .popular-content-icon {
5697 width: 24px;
5698 height: 24px;
5699 display: flex;
5700 justify-content: center;
5701 align-items: center;
5702 }
5703
5704 span.embedpress-line-height-0.popular-content-icon.wistia img, span.embedpress-line-height-0.popular-content-icon.instagram img, span.embedpress-line-height-0.popular-content-icon.pdf img, span.embedpress-line-height-0.popular-content-icon.vimeo img, span.embedpress-line-height-0.popular-content-icon.spotify img {
5705 height: 20px;
5706 }
5707
5708 span.embedpress-line-height-0.popular-content-icon.google-maps img {
5709 height: 22px;
5710 }
5711
5712 .popular-content-icon img {
5713 height: 24px;
5714 max-width: 24px;
5715 max-height: 24px;
5716 object-fit: contain;
5717 }
5718
5719
5720 .embedpress-pop-up {
5721 position: fixed;
5722 top: 0;
5723 left: 0;
5724 width: 100vw;
5725 height: 100vh;
5726 background: #BFBFBF94;
5727 z-index: 9999;
5728 display: none;
5729 opacity: 0;
5730 transition: opacity 0.3s ease-in-out;
5731 }
5732
5733 .embedpress-pop-up.show {
5734 display: block;
5735 opacity: 1;
5736 }
5737
5738 /* Banner dismiss functionality */
5739 .embedPress-introduction-panel-wrapper.dismissed {
5740 display: none !important;
5741 }
5742
5743 .embedpress-pop-up-content {
5744 position: absolute;
5745 z-index: 997;
5746 width: 750px;
5747 height: 320px;
5748 left: 50%;
5749 top: 50%;
5750 transform: translate(-50%, -50%);
5751 max-width: calc(100% - 30px);
5752 max-height: 100%;
5753 background: linear-gradient(249.39deg, #F6F3FF 0%, #EAE6FD 62.5%);
5754 box-shadow: 0px 0px 25px 0px #59509240;
5755
5756 }
5757
5758 .embedpress-pop-up-content .pop-up-left-content {
5759 padding: 0 40px;
5760 width: 70%;
5761 clip-path: polygon(0 0, 100% 0, 80% 100%, 0% 100%);
5762 background: #fff;
5763 display: flex;
5764 flex-direction: column;
5765 align-items: baseline;
5766 justify-content: center;
5767 }
5768
5769
5770
5771 .embedpress-pop-up-content .pop-up-right-content {
5772 width: 30%;
5773 display: flex;
5774 flex-direction: column;
5775 align-items: end;
5776 justify-content: center;
5777 margin-right: 15px;
5778 }
5779
5780
5781
5782 .embedpress-img-wrapper img {
5783 max-width: 265px;
5784 }
5785
5786 .premium-tag {
5787 font-size: 8px;
5788 font-weight: 600;
5789 color: #000000;
5790 padding: 1px 5px;
5791 border-radius: 4px;
5792 background-color: #FCA108;
5793 display: inline-block;
5794 }
5795
5796 .embedpress-pop-up .embedpress-pop-up-header {
5797 font-weight: 600;
5798 margin: 8px 0;
5799 }
5800
5801 .embedpress-pop-up .embedpress-pop-up-sub-header {
5802 margin-bottom: 10px;
5803 }
5804
5805 .embedpress-pop-up .embedpress-pop-up-btn {
5806 color: #FFFFFF;
5807 background-color: #595092;
5808 font-weight: 600;
5809 color: #FFFFFF;
5810 display: flex;
5811 align-items: center;
5812 max-width: 240px;
5813 margin-bottom: 13px;
5814 }
5815
5816 .embedpress-pop-up a.embedpress-btn.embedpress-btn-primary.embedpress-pop-up-btn span {
5817 font-size: .85rem;
5818 line-height: 0;
5819 }
5820
5821 .pop-up-btn-icon {
5822 height: 20px;
5823
5824 }
5825
5826 .pop-up-btn-icon img {
5827 width: 100%;
5828 height: 100%;
5829 object-fit: cover;
5830 margin-top: -2px;
5831 }
5832
5833 .embedpress-guarantee {
5834 color: #666666;
5835 font-size: .8rem;
5836 }
5837
5838 /* .embedpress-img-wrapper {
5839 margin-left: -55px;
5840 } */
5841
5842 .embedpress-pop-up .embedress-text-wrapper {
5843 margin-left: -45px;
5844 }
5845
5846 .embedpress-pop-up .embedress-text-wrapper p {
5847 font-size: .8rem;
5848 }
5849
5850 .embedress-text-wrapper p.embedpress-font-m.embedpress-font-family-dmsans {
5851 font-size: 0.625rem;
5852 }
5853
5854 p.embedpress-font-m.embedpress-font-family-dmsans.embedpress-pop-up-sub-header {
5855 font-size: 0.75rem;
5856 }
5857
5858 .embedpress-pop-up .embedpress-cancel-button {
5859 text-align: right;
5860 text-decoration: underline;
5861 background: transparent;
5862 cursor: pointer;
5863 font-size: .75rem;
5864 color: #7f78ad;
5865 margin-right: 15px;
5866 padding-bottom: 10px;
5867 }
5868
5869
5870
5871 @media only screen and (max-width: 1500px) {
5872
5873
5874 .embedPress-introduction-panel-wrapper .embedPress-introduction-left-panel {
5875 width: 50%;
5876 background-size: contain;
5877 background-color: #ffffff;
5878 clip-path: none;
5879 }
5880
5881 .embedPress-introduction-left-panel::after {
5882 rotate: 0deg;
5883 right: 0;
5884 }
5885
5886 .embedPress-introduction-panel-wrapper .embedPress-introduction-left-panel {
5887 width: 50%;
5888 }
5889
5890 .embedpress-banner-box {
5891 padding: 32px;
5892 }
5893
5894 .embedpress-hub-section .embedpress-banner .embedpress-left-content {
5895 padding-left: 0px;
5896 padding-right: 0px;
5897 }
5898
5899 .embedpress-flex.embedpress-item-center.embedpress-brand-wrapper {
5900 padding: 12px 0 12px 12px;
5901 min-height: 140px;
5902 justify-content: space-between;
5903 }
5904
5905 /* .embedpress-hub-section .embedpress-brand-wrapper .embedpress-right-content {
5906 padding: 12px;
5907 } */
5908
5909 .embedpress-preview-area.embedpress-height-95 {
5910 height: 80px;
5911 width: 105px;
5912 margin: 0;
5913 padding: 0;
5914
5915 }
5916
5917 .embedpress-hub-section .embedpress-banner .embedpress-right-content .embedpress-img-wrapper img {
5918 max-height: 120px;
5919 }
5920
5921 .embedpress-hub-section .embedpress-banner .embedpress-banner-sub-header {
5922 font-size: .85rem;
5923 }
5924
5925 }
5926
5927 @media only screen and (max-width: 1300px) {
5928
5929 /* .embedPress-introduction-panel-wrapper .embedPress-introduction-right-panel .embedpress-right-content {
5930 width: 50%;
5931 }
5932
5933 .embedPress-introduction-panel-wrapper .embedPress-introduction-right-panel .embedpress-left-content {
5934 width: 70%;
5935 }
5936
5937 .embedPess-img-wrapper,
5938 .embedPress-text-wrapper {
5939 width: 50%;
5940 } */
5941
5942 .embedPress-introduction-panel-wrapper .embedpress-cancel-button {
5943 margin-top: 0;
5944 }
5945
5946 .embedpress-brand-wrapper {
5947 margin-bottom: 2px;
5948 }
5949
5950 .embedpress-banner-wrapper {
5951 margin-bottom: 25px;
5952 }
5953
5954 .embedpress-popular-content-cards {
5955 margin-bottom: 30px;
5956 }
5957
5958 .embedPress-introduction-panel-wrapper {
5959 flex-wrap: wrap;
5960 position: relative;
5961 }
5962
5963 .embedpress-cancel-button {
5964 position: absolute;
5965 top: 20px;
5966 right: 20px;
5967 }
5968
5969 .embedPress-introduction-panel-wrapper .embedPress-introduction-right-panel,
5970 .embedPress-introduction-panel-wrapper .embedPress-introduction-left-panel {
5971 width: 100%;
5972 }
5973
5974 .embedpress-font-xl {
5975 font-size: 20px;
5976 }
5977
5978 .embedpress-font-l {
5979 font-size: 16px;
5980 }
5981
5982 .embedpress-popular-content-wrapper {
5983 padding: 12px;
5984 }
5985
5986 .embedpress-popular-content-list {
5987 padding-right: 0px !important;
5988 }
5989
5990 .embedpress-pop-up-content .pop-up-left-content {
5991 width: 100%;
5992 }
5993
5994
5995 /* .embedpress-pop-up-content .pop-up-right-content {
5996 width: 100%;
5997 padding: 12px;
5998 display: flex;
5999 flex-direction: column;
6000 align-items: center;
6001 justify-content: center;
6002 } */
6003
6004 .embedpress-img-wrapper {
6005 margin-left: 0px;
6006 }
6007
6008 .embedpress-pop-up .embedress-text-wrapper {
6009 margin-left: 0px;
6010 }
6011
6012 }
6013
6014 /* Grid system */
6015 .embdpress-col-1 {
6016 flex: 0 0 calc(8.33% - 12px);
6017 }
6018
6019 .embdpress-col-2 {
6020 flex: 0 0 calc(16.66% - 12px);
6021 }
6022
6023 .embdpress-col-3 {
6024 flex: 0 0 calc(25% - 12px);
6025 }
6026
6027 .embdpress-col-4 {
6028 flex: 0 0 calc(33.33% - 12px);
6029 }
6030
6031 .embdpress-col-5 {
6032 flex: 0 0 calc(41.66% - 12px);
6033 }
6034
6035 .embdpress-col-6 {
6036 flex: 0 0 calc(50% - 12px);
6037 }
6038
6039 .embdpress-col-7 {
6040 flex: 0 0 calc(58.33% - 12px);
6041 }
6042
6043 .embdpress-col-8 {
6044 flex: 0 0 calc(66.66% - 12px);
6045 }
6046
6047 .embdpress-col-9 {
6048 flex: 0 0 calc(75% - 12px);
6049 }
6050
6051 .embdpress-col-10 {
6052 flex: 0 0 calc(83.33% - 12px);
6053 }
6054
6055 .embdpress-col-11 {
6056 flex: 0 0 calc(91.66% - 12px);
6057 }
6058
6059 .embdpress-col-12 {
6060 flex: 0 0 100%;
6061 }
6062
6063 .embdpress-col-1,
6064 .embdpress-col-2,
6065 .embdpress-col-3,
6066 .embdpress-col-4,
6067 .embdpress-col-5,
6068 .embdpress-col-6,
6069 .embdpress-col-7,
6070 .embdpress-col-8,
6071 .embdpress-col-9,
6072 .embdpress-col-10,
6073 .embdpress-col-11,
6074 .embdpress-col-12 {
6075 box-sizing: border-box;
6076 }
6077
6078
6079
6080 @media (max-width: 1420px) {
6081
6082 .embdpress-col-4,
6083 .embdpress-col-3 {
6084 flex: 1 1 calc(33.333% - 12px);
6085 }
6086 }
6087
6088 @media (max-width: 1400px) {
6089
6090 .embdpress-col-6,
6091 .embdpress-col-5 {
6092 flex: 1 1 50%;
6093 }
6094 }
6095
6096 @media (max-width: 1100px) {
6097
6098 .embdpress-col-4,
6099 .embdpress-col-3 {
6100 flex: 1 1 calc(50% - 12px);
6101 }
6102 }
6103
6104 @media (max-width: 768px) {
6105
6106 .embdpress-col-4,
6107 .embdpress-col-3 {
6108 flex: 0 0 100%;
6109
6110 }
6111 }
6112
6113 /* Hub specific styles for docs icon and status badges */
6114 .embedpress-popular-content-list-item {
6115 position: relative;
6116 }
6117
6118 .embedpress-hub-item-actions {
6119 display: flex;
6120 align-items: center;
6121 gap: 12px;
6122 }
6123
6124 /* .embedpress-hub-item-actions .embedpress-hub-item-link {
6125 width: 24px;
6126 height: 24px;
6127 background: #f5f7fd;
6128 border-radius: 4px;
6129 display: flex;
6130 align-items: center;
6131 justify-content: center;
6132 transition: all 0.2s ease;
6133 }
6134
6135 .embedpress-hub-item-actions .embedpress-hub-item-link:hover {
6136 background: #e8ecf7;
6137 } */
6138
6139 .embedpress-hub-item-actions .embedpress-hub-item-link svg {
6140 width: 16px;
6141 height: 16px;
6142 }
6143
6144 /* .embedpress-hub-item-actions .embedpress-hub-item-link:hover svg g {
6145 stroke: #5B4E96;
6146 } */
6147
6148 /* Status badge positioning for hub items */
6149 .embedpress-popular-content-list-item .ribbon-container {
6150 position: absolute;
6151 top: -8px;
6152 right: -8px;
6153 left: auto;
6154 font-size: 10px;
6155 padding: 2px 6px;
6156 height: 18px;
6157 min-width: 40px;
6158 z-index: 2;
6159 }
6160
6161 /* Responsive adjustments */
6162 @media (max-width: 768px) {
6163 .embedpress-hub-item-actions {
6164 gap: 4px;
6165 }
6166
6167 .embedpress-hub-item-actions .embedpress-hub-item-link {
6168 width: 20px;
6169 height: 20px;
6170 }
6171
6172 /* .embedpress-hub-item-actions .embedpress-hub-item-link svg {
6173 width: 12px;
6174 height: 12px;
6175 } */
6176 }
6177
6178 /* Introduction Tab Styles */
6179 .embedpress-intro-tab-container {
6180 margin-top: 20px;
6181 }
6182
6183 .embedpress-intro-tab-nav {
6184 display: flex;
6185 gap: 5px;
6186 background: #F5F7FD;
6187 padding: 6px;
6188 border-radius: 10px;
6189 margin-bottom: 20px;
6190 justify-content: center;
6191 }
6192
6193 .embedpress-intro-tab-btn {
6194 padding: 6px 20px;
6195 cursor: pointer;
6196 background-color: transparent;
6197 border: none;
6198 border-radius: 8px;
6199 font-size: 14px;
6200 font-weight: 500;
6201 color: #5B4E96;
6202 }
6203
6204 .embedpress-intro-tab-btn:hover {
6205 background-color: #E8ECFF;
6206 }
6207
6208 /* .embedpress-intro-tab-btn.active {
6209 background-color: #5B4E96;
6210 color: #FFFFFF;
6211 } */
6212
6213 .embedpress-intro-tab-btn.active {
6214 background-color: #FFFFFF;
6215 }
6216
6217 .embedpress-intro-tab-content {
6218 width: 100%;
6219 }
6220
6221 .embedpress-intro-tab-panel {
6222 display: none;
6223 width: 100%;
6224 }
6225
6226 .embedpress-intro-tab-panel.active {
6227 display: block;
6228 }