PluginProbe ʕ •ᴥ•ʔ
EmbedPress – PDF Embedder, Embed PDF viewer, YouTube Videos, 3D FlipBook, Social feeds & more / trunk
EmbedPress – PDF Embedder, Embed PDF viewer, YouTube Videos, 3D FlipBook, Social feeds & more vtrunk
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 2 months ago admin.build.css 2 months ago admin.css 7 months ago analytics.build.css 1 month ago blocks.build.css 1 week ago carousel.min.css 2 years ago custom-player.build.css 1 month ago el-icon.css 2 months ago embedpress-elementor.css 2 years ago embedpress.css 1 week ago ep-pdf-lightbox.css 2 months ago feature-notices.css 7 months ago font.css 7 years ago glider.min.css 2 years ago index.html 7 years ago instagram-shortcode-generator.css 1 month ago lazy-load.css 6 months ago meetup-events.css 7 months ago modal.css 8 months ago onboarding.build.css 2 months ago pdf-gallery.css 2 months ago plyr.css 9 months ago preview.css 6 years ago settings-icons.css 9 months ago settings.css 1 month ago
settings.css
6333 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.embedpress-gcalendar-settings__form .form__control {
2527 max-width: 100% !important;
2528 }
2529
2530 .embedpress__settings__form .form__group .form__control__wrap {
2531 -webkit-box-flex: 1;
2532 -ms-flex-positive: 1;
2533 flex-grow: 1;
2534 }
2535
2536 .embedpress__settings__form .form__group .form__control__wrap--flex {
2537 display: -webkit-box;
2538 display: -ms-flexbox;
2539 display: flex;
2540 }
2541
2542 .embedpress__settings__form .form__group .form__control__wrap .input__flex {
2543 display: -webkit-box;
2544 display: -ms-flexbox;
2545 display: flex;
2546 -webkit-box-align: center;
2547 -ms-flex-align: center;
2548 align-items: center;
2549 }
2550
2551 .embedpress__settings__form .form__group .form__control__wrap .input__flex label:not(:last-child) {
2552 margin-right: 20px;
2553 }
2554
2555 .embedpress__settings__form .form__group .form__control__wrap .input__flex .form__control[type="number"] {
2556 width: 80px;
2557 margin-right: 20px;
2558 padding: 0 15px;
2559 }
2560
2561 .embedpress__settings__form .form__group .form__control__wrap .input__flex .frame__unit {
2562 line-height: 1;
2563 }
2564
2565 .embedpress__settings__form .form__group .form__control__wrap .input__file,
2566 .embedpress__settings__form .form__group .form__control__wrap .form__control,
2567 .embedpress__settings__form .form__group .form__control__wrap .embedpress__select {
2568 max-width: 300px;
2569 }
2570
2571 .embedpress__settings__form .form__group .form__control__wrap p {
2572 font-size: 14px;
2573 font-weight: 400;
2574 color: #7C8DB5;
2575 margin-top: 10px;
2576 }
2577
2578 .embedpress__settings__form .form__group .form__control__wrap p.ep-note {
2579 font-size: .85rem;
2580 }
2581
2582 .embedpress__settings__form .form__group .form__control__wrap .isPro:not(.embedpress__select) {
2583 opacity: 0.3;
2584 }
2585
2586 .embedpress-genral-settings-page {
2587 display: flex;
2588 }
2589
2590 .embedpress_general_settings__form:not(:last-child),
2591 .embedpress__shortcode {
2592 margin-right: 24px;
2593 width: calc(100% - 300px);
2594 }
2595
2596 .embedpress_general_settings__form:last-child {
2597 width: 100%;
2598 }
2599
2600 .embedpress-upgrade-pro-sidebar {
2601 width: 300px;
2602 border-radius: 16px;
2603 background: linear-gradient(192deg, #FFE3E1 4%, #E9E4FF 98.26%);
2604 padding: 8px;
2605 margin-top: -70px;
2606 }
2607
2608 .shortcode-settings-wrapper {
2609 display: flex;
2610
2611 }
2612
2613
2614 .embedpress-upgrade-pro-sidebar .gradient-color {
2615 border-radius: 12px;
2616 background: white;
2617 padding: 15px;
2618
2619
2620 }
2621
2622 .embedpress-upgrade-pro-sidebar img.embedpress-banner {
2623 margin-bottom: var(--pro-upgrade-margin-bottom);
2624 width: 100%;
2625 }
2626
2627 .embedpress-upgrade-pro-sidebar h3 {
2628 color: #25396F;
2629 font-family: DMSans;
2630 font-size: 16px;
2631 font-style: normal;
2632 font-weight: 700;
2633 line-height: 120%;
2634 margin-bottom: var(--pro-upgrade-margin-bottom);
2635 }
2636
2637 .embedpress-upgrade-pro-sidebar h3 span {
2638 color: #FF7369;
2639 }
2640
2641 ul.feature-list {
2642 margin-bottom: var(--pro-upgrade-margin-bottom);
2643 }
2644
2645 ul.feature-list li {
2646 display: flex;
2647 align-items: start;
2648 gap: 5px;
2649 margin-bottom: 6px;
2650 color: #25396fde;
2651 font-family: DMSans;
2652 font-size: 14px;
2653 font-style: normal;
2654 font-weight: 500;
2655 line-height: 18px;
2656 }
2657
2658 ul.feature-list img {
2659 margin-top: 0px;
2660 width: 18px;
2661 height: 20px;
2662 }
2663
2664 p.embedpress-tagline {
2665 color: #707070;
2666 font-family: DMSans;
2667 font-size: .85rem;
2668 font-style: normal;
2669 font-weight: 400;
2670 line-height: 140%;
2671 text-align: center;
2672 margin-bottom: var(--pro-upgrade-margin-bottom);
2673 }
2674
2675 .pro-upgrade-button {
2676 border-radius: 8px;
2677 background: #FF7369;
2678 padding: 12px 0px;
2679 color: #fff !important;
2680 text-align: center;
2681 font-size: 16px;
2682 font-style: normal;
2683 line-height: 120%;
2684 width: 100%;
2685 display: flex !important;
2686 gap: 5px;
2687 align-items: center;
2688 justify-content: center;
2689 }
2690
2691 .frame__size__wrap {
2692 display: -webkit-box;
2693 display: -ms-flexbox;
2694 display: flex;
2695 }
2696
2697 .template__wrapper .button.ep-settings-form-changed {
2698 background: #f11d1d;
2699 color: #fff;
2700 }
2701
2702 @media (max-width: 1199px) {
2703 .frame__size__wrap {
2704 display: block;
2705 }
2706 }
2707
2708 .form__inline .form-inner-field {
2709 display: -webkit-box;
2710 display: -ms-flexbox;
2711 display: flex;
2712 gap: 15px;
2713 }
2714
2715 .form-inner-field button {
2716 height: 60px;
2717 }
2718
2719 .form__inline .form__group {
2720 margin-bottom: 0;
2721 margin-right: 30px;
2722 }
2723
2724 .logo__adjust__wrap {
2725 margin-top: 20px;
2726 display: none;
2727 }
2728
2729 .form__control__wrap .input__switch .logo__adjust__toggler {
2730 position: absolute;
2731 top: 2px;
2732 left: calc(100% + 15px);
2733 background: #5B4E96;
2734 color: #fff;
2735 border-radius: 5px;
2736 padding: 5px 30px 5px 10px;
2737 font-size: 14px;
2738 opacity: 0;
2739 visibility: hidden;
2740 transition: all .3s ease;
2741 }
2742
2743 .form__control__wrap .input__switch .logo__adjust__toggler i {
2744 font-size: .8rem;
2745 margin-left: 8px;
2746 position: absolute;
2747 top: 11px;
2748 right: 10px;
2749 transition: all .3s ease;
2750 transform: rotate(0);
2751 }
2752
2753 .form__control__wrap .input__switch .logo__adjust__toggler.show i {
2754 transform: rotate(-180deg);
2755 }
2756
2757 .form__control__wrap .input__switch input[type="checkbox"]:checked~.logo__adjust__toggler {
2758 opacity: 1;
2759 visibility: visible;
2760 }
2761
2762 .logo__adjust__wrap .logo__upload__wrap {
2763 display: flex;
2764 align-items: center;
2765 }
2766
2767 .logo__adjust__wrap .logo__upload,
2768 .logo__adjust__wrap .logo__upload__preview {
2769 display: inline-block;
2770 width: 100%;
2771 max-width: 255px;
2772 border-radius: 10px;
2773 border: 2px dashed rgba(124, 141, 181, 0.3);
2774 background: #F5F7FD;
2775 padding: 40px 15px;
2776 text-align: center;
2777 position: relative;
2778 margin-bottom: 0;
2779 height: 172px;
2780 }
2781
2782 #valid-license-key-message {
2783 font-weight: 500;
2784 }
2785
2786 div#valid-license-key-message {
2787 margin-top: 10px;
2788 margin-bottom: 30px;
2789 }
2790
2791 span#email-placeholder {
2792 font-weight: 700;
2793 }
2794
2795 .form__inline .hidden,
2796 #otp-varify-form.hidden {
2797 display: none !important;
2798 }
2799
2800 .short-description {
2801 margin-top: 10px;
2802 padding: 10px 15px;
2803 background: #f2f2f2;
2804 margin-bottom: 10px;
2805 border-radius: 5px;
2806 }
2807
2808 div#invalid-license-key-message,
2809 #invalid-verification-key-message {
2810 padding: 10px;
2811 background: #f2f2f2;
2812 border-radius: 5px;
2813 margin-top: 10px;
2814 }
2815
2816 .short-description a {
2817 color: #5b4e96;
2818 }
2819
2820 div#resend-verification-key-message {
2821 margin-top: 10px;
2822 }
2823
2824 div#resend-verification-key-message a {
2825 color: #5b4e96;
2826 }
2827
2828 .show-toast {
2829 visibility: visible !important;
2830 opacity: 1 !important;
2831 }
2832
2833 div#resend-verification-key-message span {
2834 font-weight: bold;
2835 color: #5b4e96;
2836 cursor: pointer;
2837 }
2838
2839 div#resend-verification-key-message a {
2840 font-weight: 600;
2841 }
2842
2843 .form-inner-field .form__group {
2844 margin-right: 0;
2845 }
2846
2847 @media (max-width: 479px) {
2848 .logo__adjust__wrap .logo__upload {
2849 width: 225px;
2850 }
2851 }
2852
2853 .logo__adjust__wrap .logo__upload .icon {
2854 margin-bottom: 10px;
2855 display: block;
2856 }
2857
2858 .logo__adjust__wrap .logo__upload .icon i {
2859 font-size: 50px;
2860 opacity: .3;
2861 }
2862
2863 .logo__adjust__wrap .logo__upload .text {
2864 display: block;
2865 font-size: 14px;
2866 }
2867
2868 .logo__adjust__wrap .logo__upload input {
2869 opacity: 0;
2870 position: absolute;
2871 top: 0;
2872 left: 0;
2873 height: 100%;
2874 width: 100%;
2875 z-index: 9;
2876 cursor: pointer;
2877 }
2878
2879 .logo__adjust__wrap .logo__upload__preview .instant__preview {
2880 position: absolute;
2881 top: 50%;
2882 left: 50%;
2883 transform: translate(-50%, -50%);
2884 font-size: 0;
2885 }
2886
2887 .logo__adjust__wrap .logo__upload__preview .instant__preview .preview__remove {
2888 position: absolute;
2889 bottom: 100%;
2890 left: 100%;
2891 font-size: 7px;
2892 height: 20px;
2893 width: 20px;
2894 background: #5B4E96;
2895 color: #fff;
2896 line-height: 22px;
2897 border-radius: 50%;
2898 }
2899
2900 .logo__adjust__wrap .logo__adjust {
2901 margin-top: 20px;
2902 display: -webkit-box;
2903 display: -ms-flexbox;
2904 display: flex;
2905 -ms-flex-wrap: wrap;
2906 flex-wrap: wrap;
2907 }
2908
2909 @media (max-width: 1399px) {
2910 .logo__adjust__wrap .logo__adjust {
2911 display: block;
2912 }
2913 }
2914
2915 .logo__adjust__wrap .logo__adjust .logo__adjust__controller {
2916 -webkit-box-flex: 0;
2917 -ms-flex: 0 0 300px;
2918 flex: 0 0 300px;
2919 margin-right: 30px;
2920 }
2921
2922 @media (max-width: 1399px) {
2923 .logo__adjust__wrap .logo__adjust .logo__adjust__controller {
2924 width: 100%;
2925 margin-right: 0;
2926 }
2927 }
2928
2929 @media (max-width: 479px) {
2930 .logo__adjust__wrap .logo__adjust .logo__adjust__controller {
2931 -webkit-box-flex: 0;
2932 -ms-flex: 0 0 225px;
2933 flex: 0 0 225px;
2934 margin-right: 0;
2935 }
2936 }
2937
2938 .logo__adjust__wrap .logo__adjust .logo__adjust__controller .logo__adjust__controller__item:not(:last-child) {
2939 margin-bottom: 25px;
2940 }
2941
2942 .logo__adjust__wrap .logo__adjust .logo__adjust__controller .logo__adjust__controller__item .controller__label {
2943 font-size: 16px;
2944 font-weight: 400;
2945 color: #7C8DB5;
2946 display: inline-block;
2947 }
2948
2949 .logo__adjust__wrap .logo__adjust .logo__adjust__controller .logo__adjust__controller__item .logo__adjust__controller__inputs {
2950 display: -webkit-box;
2951 display: -ms-flexbox;
2952 display: flex;
2953 -webkit-box-align: center;
2954 -ms-flex-align: center;
2955 align-items: center;
2956 }
2957
2958 .logo__adjust__wrap .logo__adjust .logo__adjust__controller .logo__adjust__controller__item .logo__adjust__controller__inputs input[type="range"] {
2959 margin-right: 20px;
2960 width: 200px;
2961 }
2962
2963 @media (max-width: 1199px) {
2964 .logo__adjust__wrap .logo__adjust .logo__adjust__controller .logo__adjust__controller__item .logo__adjust__controller__inputs input[type="range"] {
2965 width: 145px;
2966 }
2967 }
2968
2969 .logo__adjust__wrap .logo__adjust .logo__adjust__controller .logo__adjust__controller__item .logo__adjust__controller__inputs .form__control[type="number"] {
2970 width: 80px;
2971 padding: 0 15px;
2972 }
2973
2974 @media (max-width: 1199px) {
2975 .logo__adjust__wrap .logo__adjust .logo__adjust__controller .logo__adjust__controller__item .logo__adjust__controller__inputs .form__control[type="number"] {
2976 width: 55px;
2977 padding: 0 12px;
2978 }
2979 }
2980
2981 .logo__adjust__wrap .logo__adjust .logo__adjust__preview {
2982 -webkit-box-flex: 0;
2983 -ms-flex: 0 0 500px;
2984 flex: 0 0 500px;
2985 }
2986
2987 @media (max-width: 1399px) {
2988 .logo__adjust__wrap .logo__adjust .logo__adjust__preview {
2989 width: 100%;
2990 max-width: 400px;
2991 margin-top: 20px;
2992 }
2993 }
2994
2995 .logo__adjust__wrap .logo__adjust .logo__adjust__preview .title {
2996 font-size: 16px;
2997 font-weight: 400;
2998 color: #7C8DB5;
2999 display: inline-block;
3000 margin-bottom: 10px;
3001 }
3002
3003 .logo__adjust__wrap .logo__adjust .logo__adjust__preview .preview__box {
3004 position: relative;
3005 min-height: 300px;
3006 }
3007
3008 .logo__adjust__wrap .logo__adjust .logo__adjust__preview .preview__box iframe {
3009 width: 100%;
3010 height: 100%;
3011 min-height: 300px;
3012 }
3013
3014 .logo__adjust__wrap .logo__adjust .logo__adjust__preview .preview__box img {
3015 position: absolute;
3016 bottom: 10%;
3017 right: 6%;
3018 max-height: 40px;
3019 }
3020
3021 .pro__alert__wrap,
3022 .tips__alert__wrap {
3023 position: fixed;
3024 top: 0;
3025 left: 0;
3026 height: 100%;
3027 width: 100%;
3028 background: rgb(0, 0, 0, 30%);
3029 z-index: 99999;
3030 display: none;
3031 }
3032
3033 .pro__alert__wrap .pro__alert__card,
3034 .tips__alert__wrap .tips__alert__card {
3035 width: calc(100% - 30px);
3036 max-width: 500px;
3037 margin: 7% auto 0;
3038 background: #fff;
3039 border-radius: 20px;
3040 padding: 30px;
3041 display: flex;
3042 flex-direction: column;
3043 align-items: center;
3044 text-align: center;
3045 }
3046
3047 .pro__alert__wrap .pro__alert__card img,
3048 .tips__alert__wrap .tips__alert__card img {
3049 height: 100px;
3050 margin-bottom: 20px;
3051 }
3052
3053 .pro__alert__wrap .pro__alert__card h2,
3054 .tips__alert__wrap .tips__alert__card h2 {
3055 font-size: 32px;
3056 font-weight: 500;
3057 color: #131F4D;
3058 margin-bottom: 15px;
3059 }
3060
3061 .pro__alert__wrap .pro__alert__card p,
3062 .tips__alert__wrap .tips__alert__card p {
3063 font-size: 14px;
3064 font-weight: 400;
3065 color: #7C8DB5;
3066 margin-bottom: 15px;
3067 }
3068
3069 .pro__alert__wrap .pro__alert__card p a,
3070 .tips__alert__wrap .tips__alert__card a {
3071 text-decoration: underline;
3072 font-weight: 700;
3073 color: #131F4D;
3074 }
3075
3076 .pro__alert__wrap .pro__alert__card .button,
3077 .tips__alert__wrap .tips__alert__card button {
3078 align-self: flex-end;
3079 margin-top: 20px;
3080 padding: 11px 30px;
3081 }
3082
3083 .template__wrapper input[type=range] {
3084 height: 24px;
3085 -webkit-appearance: none;
3086 margin: 10px 0;
3087 width: 100%;
3088 }
3089
3090 .template__wrapper input[type=range]:focus {
3091 outline: none;
3092 }
3093
3094 .template__wrapper input[type=range]::-webkit-slider-runnable-track {
3095 width: 100%;
3096 height: 10px;
3097 cursor: pointer;
3098 animate: 0.2s;
3099 -webkit-box-shadow: 0px 0px 0px #000000;
3100 box-shadow: 0px 0px 0px #000000;
3101 background: #5B4E96;
3102 border-radius: 5px;
3103 border: 2px solid #F5F7FD;
3104 }
3105
3106 .template__wrapper input[type=range]::-webkit-slider-thumb {
3107 -webkit-box-shadow: 0px 0px 0px #000000;
3108 box-shadow: 0px 0px 0px #000000;
3109 border: 2px solid #5B4E96;
3110 height: 16px;
3111 width: 16px;
3112 border-radius: 8px;
3113 background: #FFFFFF;
3114 cursor: pointer;
3115 -webkit-appearance: none;
3116 margin-top: -5px;
3117 }
3118
3119 .template__wrapper input[type=range]:focus::-webkit-slider-runnable-track {
3120 background: #5B4E96;
3121 }
3122
3123 .template__wrapper input[type=range]::-moz-range-track {
3124 width: 100%;
3125 height: 10px;
3126 cursor: pointer;
3127 animate: 0.2s;
3128 box-shadow: 0px 0px 0px #000000;
3129 background: #5B4E96;
3130 border-radius: 5px;
3131 border: 2px solid #F5F7FD;
3132 }
3133
3134 .template__wrapper input[type=range]::-moz-range-thumb {
3135 box-shadow: 0px 0px 0px #000000;
3136 border: 2px solid #5B4E96;
3137 height: 16px;
3138 width: 16px;
3139 border-radius: 8px;
3140 background: #FFFFFF;
3141 cursor: pointer;
3142 }
3143
3144 .template__wrapper input[type=range]::-ms-track {
3145 width: 100%;
3146 height: 10px;
3147 cursor: pointer;
3148 animate: 0.2s;
3149 background: transparent;
3150 border-color: transparent;
3151 color: transparent;
3152 }
3153
3154 .template__wrapper input[type=range]::-ms-fill-lower {
3155 background: #5B4E96;
3156 border: 2px solid #F5F7FD;
3157 border-radius: 10px;
3158 box-shadow: 0px 0px 0px #000000;
3159 }
3160
3161 .template__wrapper input[type=range]::-ms-fill-upper {
3162 background: #5B4E96;
3163 border: 2px solid #F5F7FD;
3164 border-radius: 10px;
3165 box-shadow: 0px 0px 0px #000000;
3166 }
3167
3168 .template__wrapper input[type=range]::-ms-thumb {
3169 margin-top: 1px;
3170 box-shadow: 0px 0px 0px #000000;
3171 border: 2px solid #5B4E96;
3172 height: 16px;
3173 width: 16px;
3174 border-radius: 8px;
3175 background: #FFFFFF;
3176 cursor: pointer;
3177 }
3178
3179 .template__wrapper input[type=range]:focus::-ms-fill-lower {
3180 background: #5B4E96;
3181 }
3182
3183 .template__wrapper input[type=range]:focus::-ms-fill-upper {
3184 background: #5B4E96;
3185 }
3186
3187 .upgrade__card {
3188 display: -webkit-box;
3189 display: -ms-flexbox;
3190 display: flex;
3191 -webkit-box-align: center;
3192 -ms-flex-align: center;
3193 align-items: center;
3194 background: #5B4E96;
3195 border-radius: 25px;
3196 padding: 40px;
3197 }
3198
3199 @media (max-width: 1199px) {
3200 .upgrade__card {
3201 padding: 50px;
3202 }
3203 }
3204
3205 .upgrade__card .icon {
3206 margin-right: 40px;
3207 min-width: 90px;
3208 }
3209
3210 @media (max-width: 767px) {
3211 .upgrade__card .icon {
3212 margin-right: 0;
3213 margin-bottom: 20px;
3214 }
3215 }
3216
3217 .upgrade__card .card__content {
3218 margin-right: 30px;
3219 }
3220
3221 @media (max-width: 767px) {
3222 .upgrade__card .card__content {
3223 margin-bottom: 20px;
3224 margin-right: 0;
3225 }
3226 }
3227
3228 .upgrade__card .card__content h4 {
3229 font-size: 26px;
3230 font-weight: 500;
3231 color: #ffffff;
3232 margin-bottom: 15px;
3233 }
3234
3235 @media (max-width: 767px) {
3236 .upgrade__card .card__content h4 {
3237 font-size: 22px;
3238 }
3239 }
3240
3241 .upgrade__card .card__content p {
3242 font-size: 14px;
3243 font-weight: 400;
3244 color: rgba(255, 255, 255, 0.5);
3245 max-width: 700px;
3246 }
3247
3248 .upgrade__card .button {
3249 margin-left: auto;
3250 min-width: 177px;
3251 text-align: center;
3252 }
3253
3254 @media (max-width: 767px) {
3255 .upgrade__card {
3256 display: block;
3257 padding: 25px;
3258 }
3259 }
3260
3261 .upgrage__card__tab__list {
3262 max-width: 650px;
3263 width: 100%;
3264 display: grid;
3265 -ms-grid-columns: 1fr 1fr;
3266 grid-template-columns: repeat(2, 1fr);
3267 gap: 16px;
3268 margin-bottom: 50px !important;
3269 }
3270
3271 .upgrage__card__tab__list .upgrage__card__tab__list__item {
3272 color: #5B4E96;
3273 font-size: 16px;
3274 font-weight: 500;
3275 line-height: 18px;
3276 display: inline-flex;
3277 align-items: center;
3278 gap: 8px;
3279 }
3280
3281 @media (max-width: 575px) {
3282 .upgrage__card__tab__list {
3283 -ms-grid-columns: 1fr;
3284 grid-template-columns: repeat(1, 1fr);
3285 }
3286 }
3287
3288 .upgrage__card__tab__list .upgrage__card__tab__list__item:before {
3289 content: "\e910";
3290 font-family: 'icomoon';
3291 color: #4AD750;
3292 }
3293
3294 .upgrage__card__tab__style h3 {
3295 font-size: 30px;
3296 font-weight: 700;
3297 color: #131F4D;
3298 margin-bottom: 25px;
3299 }
3300
3301 @media (max-width: 767px) {
3302 .upgrage__card__tab__style h3 {
3303 font-size: 24px;
3304 }
3305 }
3306
3307 @media (max-width: 575px) {
3308 .upgrage__card__tab__style h3 {
3309 font-size: 20px;
3310 }
3311 }
3312
3313 .upgrage__card__tab__style p {
3314 font-size: 14px;
3315 font-weight: 400;
3316 color: #7C8DB5;
3317 margin-bottom: 30px;
3318 max-width: 1320px;
3319 line-height: 1.85;
3320 }
3321
3322 .embedpress-license__details {
3323 display: -ms-grid;
3324 display: grid;
3325 -ms-grid-columns: 3.5fr 2fr;
3326 grid-template-columns: 3.5fr 2fr;
3327 gap: 5px;
3328 }
3329
3330 @media (max-width: 991px) {
3331 .embedpress-license__details {
3332 display: block;
3333 }
3334 }
3335
3336 .embedpress-license__details .license__content {
3337 background: #ffffff;
3338 padding: 40px 100px 50px 50px;
3339
3340 }
3341
3342 @media (max-width: 1199px) {
3343 .embedpress-license__details .license__content {
3344 padding: 30px;
3345 }
3346 }
3347
3348 @media (max-width: 991px) {
3349 .embedpress-license__details .license__content {
3350 margin-bottom: 5px;
3351 }
3352 }
3353
3354 @media (max-width: 767px) {
3355 .embedpress-license__details .license__content {
3356 padding: 40px 30px;
3357 }
3358 }
3359
3360 @media (max-width: 575px) {
3361 .embedpress-license__details .license__content .form__inline {
3362 display: block;
3363 }
3364
3365 .embedpress-license__details .license__content .form__inline .form__group {
3366 margin-bottom: 25px;
3367 margin-right: 0;
3368 }
3369 }
3370
3371 .embedpress-license__details .license__content .thumb__area {
3372 /* max-width: 350px; */
3373 /* text-align: center; */
3374 margin-bottom: 30px;
3375 }
3376
3377 .embedpress-license__details .license__content .thumb__area img {
3378 max-width: 320px;
3379 }
3380
3381 .embedpress-license__details .license__content .thumb__area h2 {
3382 font-size: 30px;
3383 font-weight: 400;
3384 color: #25396F;
3385 margin-top: 10px;
3386 }
3387
3388 @media (max-width: 767px) {
3389 .embedpress-license__details .license__content .thumb__area h2 {
3390 font-size: 24px;
3391 }
3392 }
3393
3394 .embedpress-license__details .license__content p {
3395 font-size: 16px;
3396 font-weight: 400;
3397 color: #25396F;
3398 margin-bottom: 30px;
3399 }
3400
3401 @media (max-width: 767px) {
3402 .embedpress-license__details .license__content p {
3403 font-size: 16px;
3404 }
3405 }
3406
3407 .embedpress-license__details .license__content p a {
3408 color: #5B4E96;
3409 text-decoration: underline;
3410 }
3411
3412 .embedpress-license__details .license__content ol {
3413 list-style: decimal;
3414 padding-left: 19px;
3415 margin-bottom: 50px;
3416 }
3417
3418 .embedpress-license__details .license__content ol li {
3419 font-size: 18px;
3420 font-weight: 400;
3421 color: #25396F;
3422 }
3423
3424 .embedpress-license__details .license__content ol li:not(:last-child) {
3425 margin-bottom: 15px;
3426 }
3427
3428 @media (max-width: 767px) {
3429 .embedpress-license__details .license__content ol li {
3430 font-size: 16px;
3431 }
3432 }
3433
3434 .embedpress-license__details .license__content ol li a {
3435 color: #5B4E96;
3436 text-decoration: underline;
3437 }
3438
3439 .embedpress-license__details .license__content .form__group {
3440 -webkit-box-flex: 1;
3441 -ms-flex-positive: 1;
3442 flex-grow: 1;
3443 position: relative;
3444 }
3445
3446
3447
3448 .embedpress-license__details .license__content .form__group .input__icon {
3449 position: absolute;
3450 top: 20px;
3451 left: 20px;
3452 color: #7C8DB5;
3453 pointer-events: none;
3454 width: 20px;
3455 }
3456
3457 .embedpress-license__details .license__content .form__group .input__icon i {
3458 font-size: 20px;
3459 }
3460
3461 @media (max-width: 767px) {
3462 .embedpress-license__details .license__content .form__group .input__icon {
3463 top: 15px;
3464 left: 15px;
3465 }
3466
3467 .embedpress-license__details .license__content .form__group .input__icon i {
3468 font-size: 16px;
3469 }
3470 }
3471
3472 .embedpress-license__details .license__content .form__group .form__control {
3473 height: 60px;
3474 background: #F5F7FD;
3475 color: #7C8DB5;
3476 font-size: 20px;
3477 padding-left: 50px;
3478 }
3479
3480 input#embedpress-pro-license-key::placeholder {
3481 font-size: 18px;
3482 }
3483
3484 .embedpress-license__details .license__content .form__group .form__control::-webkit-input-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::-moz-placeholder {
3493 color: #7C8DB5;
3494 }
3495
3496 .embedpress-license__details .license__content .form__group .form__control:-ms-input-placeholder {
3497 color: #7C8DB5;
3498 }
3499
3500 @media (max-width: 1399px) {
3501 .embedpress-license__details .license__content .form__group .form__control {
3502 font-size: 16px;
3503 }
3504 }
3505
3506 @media (max-width: 767px) {
3507 .embedpress-license__details .license__content .form__group .form__control {
3508 height: 50px;
3509 padding-left: 35px;
3510 font-size: 14px;
3511 }
3512
3513 .form-inner-field button {
3514 height: 60px;
3515 }
3516
3517 }
3518
3519 .embedpress-license__details .license__manage {
3520 background: #ffffff;
3521 padding: 30px;
3522 display: -webkit-box;
3523 display: -ms-flexbox;
3524 display: flex;
3525 -webkit-box-pack: center;
3526 -ms-flex-pack: center;
3527 justify-content: center;
3528 -webkit-box-align: center;
3529 -ms-flex-align: center;
3530 align-items: center;
3531 -webkit-box-orient: vertical;
3532 -webkit-box-direction: normal;
3533 -ms-flex-direction: column;
3534 flex-direction: column;
3535 }
3536
3537 .embedpress-license__details .license__manage .button {
3538 margin-top: 30px;
3539 }
3540
3541 .embedpress-card {
3542 background: #F5F7FD;
3543 border-radius: 16px;
3544 padding: 24px;
3545 padding-left: 100px;
3546 border: 2px solid rgba(91, 78, 150, 0.1);
3547 position: relative;
3548 }
3549
3550 @media (min-width: 1199px) and (max-width: 1399px) {
3551 .embedpress-card {
3552 padding-left: 24px !important;
3553 }
3554 }
3555
3556 @media (max-width: 767px) {
3557 .embedpress-card {
3558 padding-left: 20px;
3559 padding: 20px;
3560 }
3561 }
3562
3563 .embedpress-card .icon {
3564 position: absolute;
3565 top: 30px;
3566 left: 30px;
3567 height: 50px;
3568 width: 50px;
3569 border-radius: 10px;
3570 background: #F0EFF6;
3571 text-align: center;
3572 display: flex;
3573 align-items: center;
3574 justify-content: center;
3575 }
3576
3577 @media (min-width: 1199px) and (max-width: 1399px) {
3578 .embedpress-card .icon {
3579 position: static;
3580 margin-bottom: 20px;
3581 }
3582 }
3583
3584 @media (max-width: 767px) {
3585 .embedpress-card .icon {
3586 position: static;
3587 margin-bottom: 20px;
3588 }
3589 }
3590
3591 .embedpress-card .icon i {
3592 color: #ffffff;
3593 font-size: 20px;
3594 line-height: 50px;
3595 }
3596
3597 .embedpress-card h3 {
3598 font-size: 25px;
3599 font-weight: 5;
3600 color: #131F4D;
3601 margin-bottom: 10px;
3602 margin-top: 5px;
3603 }
3604
3605 @media (max-width: 767px) {
3606 .embedpress-card h3 {
3607 font-size: 22px;
3608 }
3609 }
3610
3611 .embedpress-card p {
3612 font-size: 14px;
3613 font-weight: 400;
3614 color: #7C8DB5;
3615 margin-bottom: 20px;
3616 }
3617
3618 .element__item {
3619 background: #F5F7FD;
3620 border-radius: 10px;
3621 min-height: 80px;
3622 padding: 10px 24px;
3623 border: 2px solid rgba(91, 78, 150, 0.1);
3624 display: -webkit-box;
3625 display: -ms-flexbox;
3626 display: flex;
3627 -webkit-box-align: center;
3628 -ms-flex-align: center;
3629 align-items: center;
3630 /* overflow : hidden; */
3631 }
3632
3633 @media (max-width: 767px) {
3634 .element__item {
3635 padding: 20px;
3636 padding-right: 15px;
3637 }
3638 }
3639
3640 /* .element__item.isPro .pro__item {
3641 display: block; }*/
3642
3643 .element__item h5 {
3644 font-size: 18px;
3645 font-weight: 700;
3646 color: #25396F;
3647 margin-right: 15px;
3648 }
3649
3650 @media (max-width: 767px) {
3651 .element__item h5 {
3652 font-size: 16px;
3653 }
3654 }
3655
3656 .element__item .has__question {
3657 color: rgba(124, 141, 181, 0.5);
3658 line-height: 1;
3659 margin-top: 2px;
3660 margin-right: 10px;
3661 position: relative;
3662 }
3663
3664 .element__item .has__question .element__tooltip {
3665 position: absolute;
3666 bottom: calc(100% + 12px);
3667 left: -20px;
3668 /* transform : translateX(-50%); */
3669 background: #5B4E96;
3670 color: #fff;
3671 padding: 20px;
3672 min-width: 200px;
3673 border-radius: 5px;
3674 font-size: 16px;
3675 transition: all .3s ease;
3676 opacity: 0;
3677 visibility: hidden;
3678 z-index: 9;
3679 }
3680
3681 .element__item .has__question:hover .element__tooltip {
3682 visibility: visible;
3683 opacity: 1;
3684 }
3685
3686 .element__item .has__question .element__tooltip:before {
3687 position: absolute;
3688 top: 100%;
3689 left: 18px;
3690 /* transform: translateX(-50%); */
3691 border-left: 10px solid transparent;
3692 border-right: 10px solid transparent;
3693 border-top: 10px solid #5B4E96;
3694 content: '';
3695 }
3696
3697 .element__item .input__switch {
3698 margin-left: auto;
3699 margin-bottom: 0;
3700 }
3701
3702 .element__item .pro__item {
3703 position: absolute;
3704 top: 5px;
3705 left: -16px;
3706 -webkit-transform: rotate(-45deg);
3707 transform: rotate(-45deg);
3708 font-size: .85rem;
3709 font-weight: 400;
3710 color: #ffffff;
3711 background: #5B4E96;
3712 padding: 0 20px;
3713 text-transform: uppercase;
3714 display: none;
3715 }
3716
3717 @media (max-width: 767px) {
3718 .element__item .pro__item {
3719 font-size: 9px;
3720 }
3721 }
3722
3723 .embedpress--elements__wrap h3 {
3724 font-size: 24px;
3725 font-weight: 700;
3726 color: #131F4D;
3727 padding-bottom: 16px;
3728 margin-bottom: 24px;
3729 border-bottom: 1px solid #F5F7FC;
3730 }
3731
3732 @media (max-width: 767px) {
3733 .embedpress--elements__wrap h3 {
3734 font-size: 24px;
3735 }
3736 }
3737
3738 @media (max-width: 575px) {
3739 .embedpress--elements__wrap h3 {
3740 font-size: 20px;
3741 }
3742 }
3743
3744 @media (max-width: 991px) {
3745 .embedpress--elements__wrap .embedpress__row.grid__4 {
3746 -ms-grid-columns: 1fr 1fr;
3747 grid-template-columns: repeat(2, 1fr);
3748 }
3749 }
3750
3751 @media (max-width: 575px) {
3752 .embedpress--elements__wrap .embedpress__row.grid__4 {
3753 -ms-grid-columns: 1fr;
3754 grid-template-columns: repeat(1, 1fr);
3755 }
3756 }
3757
3758 .valid-license-icon {
3759 max-width: 100%;
3760 width: 1.5rem;
3761 }
3762
3763
3764
3765 .embedpress-toast__message {
3766 position: fixed;
3767 bottom: 50px;
3768 right: 50px;
3769 padding: 15px 25px;
3770 border-radius: 10px;
3771 max-width: 400px;
3772 z-index: 9999;
3773 display: flex;
3774 align-items: center;
3775 opacity: 0;
3776 visibility: hidden;
3777 transition: all .3s ease;
3778 }
3779
3780 .embedpress-toast__message.show {
3781 opacity: 1;
3782 visibility: visible;
3783 }
3784
3785 .embedpress-toast__message.toast__message--error {
3786 background: #FE504F;
3787 }
3788
3789 .embedpress-toast__message.toast__message--attention {
3790 background: #FFA53C
3791 }
3792
3793 .embedpress-toast__message.toast__message--success {
3794 background: #00CC76;
3795 }
3796
3797 .embedpress-toast__message img {
3798 height: 40px;
3799 margin-right: 20px;
3800 }
3801
3802 .embedpress-toast__message p {
3803 color: #ffffff;
3804 font-size: 14px;
3805 }
3806
3807 .template__wrapper .wp-color-result-text {
3808 padding: 0 5px;
3809 }
3810
3811 @media all and (max-width: 1600px) {
3812 .embedpress-license__details .license__content .form__inline {
3813 display: block;
3814 }
3815
3816 .embedpress-license__details .license__content .form__group {
3817 margin-bottom: 25px;
3818 margin-right: 0;
3819 }
3820
3821 .embedpress-license__details .license__content .form__group .form__control {
3822 height: 60px;
3823 font-size: 14px;
3824 }
3825
3826 .embedpress-license__details .license__content .form__group .input__icon {
3827 width: 18px;
3828 top: 16px;
3829 }
3830 }
3831
3832 .ep-coming-soon {
3833 color: #5b4e96;
3834 font-size: .85rem;
3835 font-weight: 900;
3836 }
3837
3838 .embedpress-card a,
3839 .template__wrapper .ep-link {
3840 color: #5b4e96;
3841 }
3842
3843 .template__wrapper .ep-link {
3844 font-weight: 600;
3845 }
3846
3847 .proOverlay {
3848 opacity: .3;
3849 position: relative;
3850 }
3851
3852 .proOverlay::after {
3853 position: absolute;
3854 top: 0;
3855 left: 0;
3856 bottom: 0;
3857 content: '';
3858 width: 100%;
3859 height: 100%;
3860 display: block;
3861 }
3862
3863 .embedpress__shortcode .shortcode__text {
3864 margin-bottom: 40px;
3865 font-size: 16px;
3866 line-height: 1.6;
3867 color: #25396F;
3868 }
3869
3870 .embedpress__shortcode .shortcode__form {
3871 width: 100%;
3872 max-width: 750px;
3873 box-sizing: border-box;
3874 background-color: #F5F7FC;
3875 border: 1px solid #D7DEEE;
3876 border-radius: 8px;
3877 padding: 12px;
3878 display: flex;
3879 }
3880
3881 .embedpress__shortcode .shortcode__form .form__group {
3882 flex-grow: 1;
3883 }
3884
3885 .embedpress__shortcode .shortcode__form .form__group .form__control {
3886 height: 50px;
3887 background-color: transparent;
3888 border: none;
3889 }
3890
3891 .embedpress__shortcode .shortcode__form .button__redColor {
3892 background-color: #FF7369;
3893 border-color: #FF7369;
3894 color: #fff;
3895 }
3896
3897 .embedpress__shortcode .shortcode__form .copy__button {
3898 background-color: #5B4E96;
3899 border-color: #5B4E96;
3900 color: #fff;
3901 }
3902
3903
3904 /* source page css */
3905 .source-settings-page {
3906 background: #fff;
3907 padding: 24px;
3908 border-radius: 16px;
3909 }
3910
3911 .source-settings-page.page-premium {
3912 padding: 24px 0;
3913 }
3914
3915 .source-settings-page.page-premium .page-premium-text {
3916 margin-bottom: 20px;
3917 font-size: 16px;
3918 line-height: 1.6;
3919 color: #25396F;
3920 max-width: 80%;
3921 }
3922
3923 h1.page-heading {
3924 color: #25396F;
3925 font-family: 'DMSans';
3926 font-size: 24px;
3927 font-style: normal;
3928 font-weight: 600;
3929 line-height: 120%;
3930 padding-bottom: 16px;
3931 border-bottom: 1px solid #F5F7FC;
3932 }
3933
3934 .upgrage__card__tab__style h3 {
3935 color: #25396F;
3936 font-family: 'DMSans';
3937 font-size: 20px;
3938 font-style: normal;
3939 font-weight: 600;
3940 line-height: 1;
3941 /* 24px */
3942 }
3943
3944 .upgrage__card__tab__style p {
3945 color: #707070;
3946 font-family: 'DMSans';
3947 font-size: 16px;
3948 font-style: normal;
3949 font-weight: 400;
3950 line-height: 160%;
3951 /* 25.6px */
3952 }
3953
3954 a.button.button__themeColor {
3955 border-radius: 8px;
3956 background: #EEEDF4;
3957 border: none;
3958 }
3959
3960 ul.source-tab {
3961 margin-top: 10px;
3962 width: 100%;
3963 padding-right: 15px;
3964 padding-left: 15px;
3965 margin-top: 10px;
3966 max-height: 185px;
3967 overflow-y: scroll;
3968 }
3969
3970 ul.source-tab::-webkit-scrollbar {
3971 width: 5px;
3972 }
3973
3974 ul.source-tab::-webkit-scrollbar-track {
3975 background: #f5f7fd;
3976 border-radius: 5px;
3977 }
3978
3979 ul.source-tab::-webkit-scrollbar-thumb {
3980 background: #988FBD;
3981 border-radius: 5px;
3982 }
3983
3984 li.tab-button {
3985 display: inline-flex;
3986 align-items: center;
3987 gap: 5px;
3988 background-color: transparent;
3989 padding: 8px 15px;
3990 border-radius: 15px;
3991 cursor: pointer;
3992 width: 100%;
3993 font-size: 14px;
3994 margin-bottom: 2px;
3995 }
3996
3997 li.tab-button:hover {
3998 background: #f5f7fd;
3999 }
4000
4001 li.tab-button.active {
4002 background: #f5f7fd;
4003 }
4004
4005 img.source-image {
4006 width: 14px;
4007 height: 14px;
4008 }
4009
4010 .tab-content-section {
4011 display: grid;
4012 -ms-grid-columns: 1fr 1fr 1fr;
4013 grid-template-columns: repeat(3, 1fr);
4014 /* Three items per row */
4015 gap: 30px;
4016 /* Adjust the gap between items as needed */
4017 }
4018
4019 @media (max-width: 1199px) {
4020 .tab-content-section {
4021 -ms-grid-columns: 1fr 1fr;
4022 grid-template-columns: repeat(2, 1fr);
4023 }
4024 }
4025
4026 .source-item {
4027 padding: 15px;
4028 text-align: center;
4029 display: flex;
4030 align-items: center;
4031 justify-content: space-between;
4032 background: #f5f7fd;
4033 border-radius: 8px;
4034 position: relative;
4035 }
4036
4037 .tab-button-section {
4038 display: none;
4039 }
4040
4041 li.sidebar__item.show .tab-button-section {
4042 display: block;
4043 }
4044
4045 .source-item div {
4046 display: flex;
4047 align-items: center;
4048 gap: 5px;
4049 color: #404040;
4050 font-family: 'DMSans';
4051 font-size: 14px;
4052 font-style: normal;
4053 font-weight: 600;
4054 line-height: 120%;
4055 /* 16.8px */
4056 letter-spacing: -0.28px;
4057 }
4058
4059 .ribbon-container {
4060 position: absolute;
4061 top: -12px;
4062 left: 45px;
4063 background: #524cff;
4064 padding: 5px;
4065 border-radius: 4px;
4066 height: 22px;
4067 display: flex;
4068 align-items: center;
4069 justify-content: center;
4070 color: #fff !important;
4071 font-size: 12px !important;
4072 text-transform: capitalize;
4073 }
4074
4075 .ribbon-container.new {
4076 background-color: #059862;
4077 }
4078
4079 .ribbon-container.popular {
4080 background-color: #0064FF;
4081 }
4082
4083 .ribbon-container.updated {
4084 background-color: #6C757D;
4085 border: none;
4086 }
4087
4088 .source-left .icon {
4089 width: 32px;
4090 height: 32px;
4091 background: #fff;
4092 border-radius: 5px;
4093 display: flex;
4094 align-items: center;
4095 justify-content: center;
4096 }
4097
4098 .source-left .icon img {
4099 width: 16px;
4100 height: auto;
4101 }
4102
4103 .source-right a {
4104 width: 28px;
4105 height: 28px;
4106 background: #fff;
4107 border-radius: 5px;
4108 display: flex;
4109 align-items: center;
4110 justify-content: center;
4111 }
4112
4113 .source-right a svg g {
4114 transition: 0.2s;
4115
4116 }
4117
4118 .source-right a svg {
4119 width: 18px;
4120 height: 18px;
4121 }
4122
4123 .source-right a:hover svg g {
4124 stroke: #5B4E96;
4125 }
4126
4127 .premium-button {
4128 text-align: center;
4129 display: flex;
4130 align-items: center;
4131 justify-content: center;
4132 width: 100%;
4133 margin-top: 20px;
4134 }
4135
4136 .premium-button a {
4137 display: flex !important;
4138 align-items: center;
4139 gap: 8px;
4140 background: #EEEDF4;
4141 padding: 10px 25px;
4142 border-radius: 8px;
4143 width: 100%;
4144 justify-content: center;
4145 }
4146
4147 .premium-button span {
4148 display: flex;
4149 align-items: center;
4150 justify-content: center;
4151 }
4152
4153 .premium-button svg {
4154 width: 18px;
4155 height: 18px;
4156 }
4157
4158
4159 @media only screen and (max-width: 991px) {
4160 .tab-content-section {
4161 -ms-grid-columns: 1fr 1fr;
4162 grid-template-columns: repeat(2, 1fr);
4163 }
4164 }
4165
4166 /* Instagram setting css */
4167 /* Reset default table styles */
4168 table {
4169 border-collapse: collapse;
4170 width: 100%;
4171 }
4172
4173 table,
4174 th,
4175 td {
4176 border: 1px solid #ccc;
4177 }
4178
4179 /* Apply custom styles for the 'emebedpress' class */
4180 .emebedpress {
4181 border-collapse: collapse;
4182 width: 100%;
4183 }
4184
4185 .emebedpress thead {
4186 background-color: #F5F7FD;
4187 }
4188
4189 .emebedpress th,
4190 .emebedpress td {
4191 padding: 12px;
4192 text-align: left;
4193 position: relative;
4194 text-align: center;
4195 }
4196
4197 table.emebedpress th {
4198 white-space: nowrap;
4199 width: 150px;
4200 font-weight: bold;
4201
4202 }
4203
4204 .emebedpress tbody tr:nth-child(even) {
4205 background-color: #f9f9f9;
4206 }
4207
4208 .emebedpress img.user-avatar {
4209 width: 50px;
4210 height: 50px;
4211 border-radius: 50%;
4212 object-fit: cover;
4213 }
4214
4215 .emebedpress input[type="text"] {
4216 width: 60%;
4217 box-sizing: border-box;
4218 border: none;
4219 background-color: transparent;
4220 margin: 0;
4221 padding: 0;
4222 }
4223
4224 .emebedpress .button {
4225 background-color: #0073aa;
4226 color: #fff;
4227 border: none;
4228 padding: 6px;
4229 cursor: pointer;
4230 border-radius: 4px;
4231 }
4232
4233 .emebedpress .button i {
4234 font-size: 18px;
4235
4236 }
4237
4238 .emebedpress .button-primary {
4239 background-color: #5b4e96;
4240 position: absolute;
4241 right: 20px;
4242 align-items: center;
4243 justify-content: center;
4244 }
4245
4246 .emebedpress .button-secondary {
4247 background-color: #f44336 !important;
4248 }
4249
4250 .emebedpress .button-secondary:focus i {
4251 color: white;
4252 }
4253
4254 /* Styles for the account-section */
4255 /* .account-wrap {
4256 max-width: 1200px;
4257 margin: 0 auto;
4258 } */
4259
4260 .user-image {
4261 display: flex;
4262 align-items: center;
4263 justify-content: center;
4264 width: 50px;
4265 }
4266
4267 td.instagram-user-account .username {
4268 text-align: left;
4269 font-size: 16px;
4270 line-height: 1.4rem;
4271 }
4272
4273 td.instagram-user-account .userid {
4274 text-align: left;
4275 font-size: .9rem;
4276 line-height: 1.4rem;
4277
4278 }
4279
4280 .account-section p {
4281 margin-bottom: 10px;
4282 }
4283
4284 .account-button {
4285 text-decoration: none !important;
4286 background-color: #0073aa !important;
4287 color: #fff !important;
4288 border: none;
4289 padding: 10px 15px;
4290 border-radius: 4px;
4291 margin-right: 10px;
4292 display: inline-flex !important;
4293 align-items: center;
4294 gap: 5px;
4295 font-size: 14px;
4296 cursor: pointer;
4297 margin-bottom: 15px;
4298 }
4299
4300 .account-button svg {
4301 fill: currentColor;
4302 width: 20px;
4303 height: 20px;
4304 }
4305
4306 .personal-account {
4307 background-color: #4caf50;
4308 }
4309
4310 .business-account {
4311 background-color: #f44336;
4312 }
4313
4314 .account-link {
4315 margin-left: 10px;
4316 color: #0073aa;
4317 text-decoration: none;
4318 }
4319
4320 .premium-field {
4321 display: inline-block;
4322 margin-left: 10px;
4323 color: #999;
4324 }
4325
4326 .premium-field small {
4327 font-size: .85rem;
4328 }
4329
4330 .description.hidden {
4331 display: none;
4332 }
4333
4334 /* delete alrert box */
4335 .custom-dialog {
4336 position: fixed;
4337 top: 50%;
4338 left: 50%;
4339 transform: translate(-50%, -50%);
4340 background-color: #fff;
4341 padding: 20px;
4342 box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
4343 z-index: 9999;
4344 }
4345
4346 .custom-dialog p {
4347 margin: 0 0 10px;
4348 }
4349
4350 .custom-dialog button {
4351 margin-right: 10px;
4352 padding: 5px 10px;
4353 background-color: #007bff;
4354 color: #fff;
4355 border: none;
4356 cursor: pointer;
4357 }
4358
4359 .custom-dialog button:hover {
4360 background-color: #0056b3;
4361 }
4362
4363 .custom-dialog button:last-child {
4364 margin-right: 0;
4365 background-color: #ccc;
4366 }
4367
4368 /* Optional: To make the buttons the same width */
4369 .custom-dialog button {
4370 width: 80px;
4371 }
4372
4373 .premium-button {
4374 margin-top: 10px !important;
4375 padding: 0 4px 0 0;
4376 }
4377
4378
4379 @media only screen and (max-width: 767px) {
4380 .tab-content-section {
4381 -ms-grid-columns: 1fr;
4382 grid-template-columns: repeat(1, 1fr);
4383 }
4384
4385 header.embedpress-header p {
4386 margin: 10px 0;
4387 text-align: left;
4388 }
4389 }
4390
4391
4392 /* // Calendly settings page design */
4393 .calendly-embedpress-authorize-button {
4394 display: flex;
4395 justify-content: space-between;
4396 margin-bottom: 15px;
4397 }
4398
4399 .calendly-settings-title {
4400 margin-bottom: 30px !important;
4401 }
4402
4403 a.calendly-connect-button {
4404 display: inline-flex;
4405 align-items: center;
4406 font-size: 15px;
4407 color: rgb(54, 100, 174);
4408 gap: 6px;
4409 border-width: 1px;
4410 border-style: solid;
4411 border-color: rgb(54, 100, 174);
4412 border-image: initial;
4413 padding: 8px 20px;
4414 border-radius: 10px;
4415 }
4416
4417 a.calendly-connect-button:hover {
4418 color: #fff;
4419 background: rgb(54, 100, 174);
4420 }
4421
4422 a.calendly-connected {
4423 /* pointer-events: none !important; */
4424 background: rgba(54, 100, 174, 0.08);
4425 border-width: 1px;
4426 border-style: solid;
4427 border-color: rgba(54, 100, 174, 0.08);
4428 border-image: initial;
4429 }
4430
4431 a.calendly-connect-button img {
4432 width: 20px;
4433 }
4434
4435
4436 /* Apply styles to the event-type-list container */
4437 .event-type-list {
4438 font-family: Arial, sans-serif;
4439 }
4440
4441 /* Apply styles to the list-header */
4442 .list-header {
4443 background-color: #3664ae;
4444 color: #fff;
4445 padding: 10px;
4446 display: flex;
4447 align-items: center;
4448 gap: 10px;
4449 border-radius: 10px;
4450 }
4451
4452
4453 /* Apply styles to the user's avatar */
4454 .calendly-user .bqa3nmp img {
4455 width: 50px;
4456 height: 50px;
4457 border-radius: 50%;
4458 margin-right: 10px;
4459 }
4460
4461 /* Apply styles to the user's name */
4462 .calendly-user .name p {
4463 font-weight: bold;
4464 font-size: 18px;
4465 }
4466
4467
4468 /* Apply styles to the event-type-card */
4469 .event-type-card-list {
4470 display: grid;
4471 grid-template-columns: repeat(3, 1fr);
4472 gap: 20px;
4473 margin-top: 15px;
4474 }
4475
4476 .calendly-data-placeholder .event-type-card-list {
4477 padding: 0 20px 20px;
4478 }
4479
4480 .event-type-card-list-item {
4481 background-color: #ffffff;
4482 border: 1px solid #faf4f4;
4483 border-radius: 5px;
4484 border-top: 6px solid var(--calendly-event-color);
4485 }
4486
4487 .event-type-card {
4488 padding: 10px;
4489 }
4490
4491 .calendly-profile-avatar {
4492 width: 50px;
4493 height: 50px;
4494 }
4495
4496 .calendly-profile-avatar img {
4497 border-radius: 50px;
4498 }
4499
4500 .event-type-card-top {
4501 border-bottom: 1px solid #ebe1e1;
4502 padding-bottom: 10px;
4503 }
4504
4505 .event-type-card-top h2 {
4506 font-size: 15px;
4507 font-weight: 500;
4508 margin-bottom: 8px;
4509 }
4510
4511 .event-type-card-top p {
4512 font-size: 11px;
4513 color: #b19999;
4514 margin-bottom: 12px;
4515 }
4516
4517 .event-type-card-top a {
4518 color: #3664ae;
4519 font-size: .85rem;
4520 }
4521
4522 .event-type-card-bottom {
4523 display: flex;
4524 align-items: center;
4525 justify-content: space-between;
4526 padding-top: 10px;
4527 }
4528
4529 .event-status {
4530 font-size: 14px;
4531 }
4532
4533 .event-status.Active {
4534 color: #008000c9;
4535 }
4536
4537 .event-status.In-active {
4538 color: gray;
4539 }
4540
4541 .calendly-event-copy-link {
4542 display: flex;
4543 align-items: center;
4544 gap: 5px;
4545 font-size: 14px;
4546 color: #3664ae;
4547 cursor: pointer;
4548 }
4549
4550 [data-event-status="In-active"] .event-type-card-top a,
4551 [data-event-status="In-active"] .calendly-event-copy-link {
4552 color: gray;
4553 }
4554
4555 [data-event-status="In-active"].event-type-card-list-item {
4556 border-top-color: #b2b2b2 !important;
4557 }
4558
4559 [data-event-status="In-active"] .calendly-event-copy-link svg path {
4560 fill: gray;
4561 }
4562
4563 .calendly-event-copy-link svg {
4564 width: 14px;
4565 height: 14px;
4566 }
4567
4568
4569 /* scheduled list table css */
4570
4571
4572 .rwd-table {
4573 max-width: 100%;
4574 width: 100%;
4575
4576 }
4577
4578 .rwd-table tr:first-child {
4579 border-top: none;
4580 background: #3664ae;
4581 color: #fff;
4582 }
4583
4584 .rwd-table tr {
4585 border-top: 1px dotted red;
4586 border-bottom: 1px dotted red;
4587 }
4588
4589
4590 .rwd-table th {
4591 display: none;
4592 }
4593
4594 .rwd-table td {
4595 display: block;
4596
4597 }
4598
4599 .rwd-table td:before {
4600 content: attr(data-th) ": ";
4601 width: 120px;
4602 display: inline-block;
4603 color: #000;
4604 }
4605
4606 .rwd-table th,
4607 .rwd-table td {
4608 padding-left: 30px !important;
4609 }
4610
4611 .rwd-table {
4612 color: #333;
4613 border-radius: .4em;
4614 width: 100%;
4615 /* Set the table width to 100% */
4616 /* table-layout: fixed; */
4617 }
4618
4619 .rwd-table tr {
4620 border-color: red;
4621 }
4622
4623
4624 .rwd-table td:before {
4625 display: none;
4626 }
4627
4628 .rwd-table th,
4629 .rwd-table td {
4630 display: table-cell;
4631 padding: .5em .5em;
4632 text-align: left;
4633 font-family: Arial, sans-serif;
4634 font-size: 14px;
4635 white-space: nowrap;
4636 /* width : 25%; */
4637 /* Divide the width evenly among the columns */
4638
4639 }
4640
4641 .rwd-table th {
4642 font-size: 15px;
4643 padding: 1em .5em;
4644 font-weight: 500;
4645 }
4646
4647 .rwd-table th:first-child {
4648 border-top-left-radius: 10px;
4649 border-bottom-left-radius: 10px;
4650 }
4651
4652 .rwd-table th:last-child {
4653 border-top-right-radius: 10px;
4654 border-bottom-right-radius: 10px;
4655 }
4656
4657 .rwd-table td {
4658 border-bottom: 1px dotted #ddd;
4659 /* border-radius: 10px; */
4660 /* border-right : 1px dotted #ddd; */
4661 }
4662
4663 /* .rwd-table td:first-child {
4664 border-left: 1px dotted #ddd;
4665 } */
4666
4667
4668 /* Tab container */
4669 .tab-container {
4670 display: flex;
4671 gap: 5px;
4672 background: #fff7f7;
4673 padding: 8px 10px;
4674 border-radius: 10px;
4675 }
4676
4677 /* Individual tab */
4678 .tab-container .tab {
4679 padding: 8px 20px;
4680 cursor: pointer;
4681 background-color: #fff7f7;
4682 border-radius: 10px;
4683 font-size: 15px;
4684
4685 }
4686
4687 /* Active tab */
4688 .tab-container .active-tab {
4689 background-color: #3664ae;
4690 color: #fff;
4691 }
4692
4693 /* Content container */
4694 .tab-content {
4695 display: none;
4696 width: 100%;
4697 }
4698
4699 /* Show the active tab content */
4700 .tab-content.active {
4701 display: block;
4702 }
4703
4704 .calendly-data-placeholder {
4705 position: relative;
4706 margin-top: 15px;
4707 }
4708
4709 .calendly-data-placeholder img {
4710 pointer-events: none;
4711 }
4712
4713 .calendly-data-placeholder {
4714 position: relative;
4715 margin-top: 5px;
4716 padding-top: 5px;
4717 }
4718
4719 .overlay {
4720 position: absolute;
4721 top: 0;
4722 left: 0;
4723 width: 100%;
4724 height: 100%;
4725 background-color: #3664ae26;
4726 text-align: center;
4727 display: flex;
4728 flex-direction: column;
4729 justify-content: center;
4730 border-radius: 10px;
4731 align-items: center;
4732 }
4733
4734 .overlay-button {
4735 background-color: #006bff;
4736 color: #fff !important;
4737 padding: 10px 20px;
4738 border: none;
4739 cursor: pointer;
4740 max-width: 300px;
4741 font-weight: 500;
4742 border-radius: 10px;
4743 }
4744
4745 .calendly-connector-container {
4746 display: flex;
4747 align-items: end;
4748 gap: 5px;
4749 }
4750
4751 @media only screen and (max-width: 768px) {
4752 .calendly-connector-container {
4753 margin-bottom: 15px;
4754 }
4755
4756 .calendly-embedpress-authorize-button {
4757 flex-direction: column;
4758 justify-content: center;
4759 }
4760
4761 .tab-container {
4762 width: 100%;
4763 align-items: center;
4764 justify-content: center;
4765 }
4766
4767 .tab-container .tab {
4768 padding: 8px 10px;
4769 font-size: 14px;
4770 width: 50%;
4771 text-align: center;
4772 }
4773
4774 .calendly-data {
4775 overflow: auto;
4776 }
4777
4778 .event-type-card-list {
4779 grid-template-columns: repeat(2, 1fr);
4780 }
4781
4782 .rwd-table {
4783 min-width: 700px;
4784 overflow: auto;
4785 table-layout: auto;
4786 }
4787
4788 .rwd-table th,
4789 .rwd-table td {
4790 padding: 10px;
4791 font-size: .9rem;
4792 }
4793
4794 .rwd-table th,
4795 .rwd-table td {
4796 padding-left: 20px !important;
4797 width: auto;
4798 }
4799 }
4800
4801
4802 @media only screen and (max-width: 480px) {
4803 .event-type-card-list {
4804 grid-template-columns: repeat(1, 1fr);
4805 }
4806
4807 .tab-container {
4808 padding: 8px 6px;
4809 }
4810
4811 .tab-container .tab {
4812 white-space: nowrap;
4813 padding: 8px 5px;
4814 font-size: .85rem;
4815 text-align: center;
4816 }
4817 }
4818
4819 form#instagram-form {
4820 width: 400px;
4821 padding: 20px;
4822 border-radius: 15px;
4823 }
4824
4825 form#instagram-form select#account-option,
4826 form#instagram-form input#instagram-access-token {
4827 width: 100%;
4828 height: 45px;
4829 margin-bottom: 10px;
4830 border-radius: 5px;
4831 }
4832
4833 /* Styling for overlay background */
4834 .account-section .modal-overlay {
4835 position: fixed;
4836 top: 0;
4837 left: 0;
4838 width: 100%;
4839 height: 100%;
4840 background-color: rgba(0, 0, 0, 0.8);
4841 /* Semi-transparent black */
4842 z-index: 9999;
4843 /* Ensure it's on top of everything */
4844 display: none;
4845 /* Hide by default */
4846 }
4847
4848 /* Styling for the modal itself */
4849 .account-section .modal {
4850 position: fixed;
4851 top: 50%;
4852 left: 50%;
4853 transform: translate(-50%, -50%);
4854 background-color: #fff;
4855 padding: 20px;
4856 border-radius: 8px;
4857 box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
4858 /* Drop shadow effect */
4859 z-index: 10000;
4860 /* Ensure it's on top of the overlay */
4861 max-width: 80%;
4862 /* Adjust the maximum width as needed */
4863 max-height: 80%;
4864 /* Adjust the maximum height as needed */
4865 overflow-y: auto;
4866 /* Enable vertical scrolling if content overflows */
4867 }
4868
4869 /* Styling for close button */
4870 form#instagram-form .close-btn {
4871 position: absolute;
4872 top: 5px;
4873 right: 5px;
4874 cursor: pointer;
4875 background: #f2f2f2;
4876 width: 25px;
4877 height: 25px;
4878 display: flex;
4879 align-items: center;
4880 justify-content: center;
4881 border-radius: 5px;
4882 }
4883
4884 form#instagram-form button {
4885 background-color: #594E91;
4886 color: #fff;
4887 }
4888
4889 .form-footer {
4890 display: flex;
4891 align-items: center;
4892 justify-content: space-between;
4893 margin-top: 10px;
4894 }
4895
4896 form#instagram-form label {
4897 display: inline-block;
4898 }
4899
4900 a.for-business,
4901 a.for-personal {
4902 display: inline-block;
4903 text-decoration: underline;
4904 font-size: 14px;
4905 font-weight: normal;
4906 color: inherit;
4907 margin-bottom: 10px;
4908 color: #2271b1;
4909 }
4910
4911 .no-account-connected {
4912 text-align: center;
4913 margin: 45px;
4914 }
4915
4916 #instagram-form .form-group {
4917 position: relative;
4918 }
4919
4920 #instagram-form .form-group a {
4921 position: absolute;
4922 background: #f5f6ff;
4923 width: 20px;
4924 height: 20px;
4925 display: flex;
4926 align-items: center;
4927 justify-content: center;
4928 text-align: center;
4929 right: 0;
4930 top: 12px;
4931 right: 12px;
4932 border-radius: 5px;
4933 }
4934
4935 .user-profile-link {
4936 padding: 5px 10px;
4937 background-color: #007bff;
4938 color: #fff;
4939 border: none;
4940 border-radius: 4px;
4941 cursor: pointer;
4942 transition: background-color 0.3s;
4943 font-size: 14px;
4944 cursor: pointer;
4945 }
4946
4947 .user-profile-link:hover {
4948 background-color: #0056b3;
4949 }
4950
4951 .emebedpress img.user-avatar {
4952 border: 2px solid #037bff;
4953 }
4954
4955 td.instagram-user-account {
4956 display: flex;
4957 align-items: center;
4958 gap: 10px;
4959 }
4960
4961 td.instagram-sync-data {
4962 cursor: pointer;
4963 }
4964
4965 td.instagram-action-btns button, td.instagram-action-btns button .dashicons {
4966 color: #fff !important;
4967 }
4968
4969 .sync-spin {
4970 animation: spin 1s linear infinite;
4971 /* Apply the spin animation */
4972 }
4973
4974
4975
4976 /* leon css */
4977 h3.cart-title {
4978 font-size: 18px;
4979 font-weight: 700px;
4980 }
4981
4982 ul.feature-list li {
4983 color: #25396F;
4984 }
4985
4986 @keyframes spin {
4987 to {
4988 transform: rotate(360deg);
4989 /* Rotate the element 360 degrees */
4990 }
4991 }
4992
4993
4994 @media (max-width: 1450px) {
4995
4996 .pdf_custom_color_settings .form__control__wrap .input__switch .logo__adjust__toggler {
4997 top: calc(100% + 5px);
4998 left: 0;
4999 }
5000
5001 .template__wrapper label {
5002 margin-bottom: 20px;
5003 }
5004
5005 }
5006
5007 @media (max-width: 1350px) {
5008
5009 .embedpress_general_settings__form:not(:last-child),
5010 .embedpress__shortcode {
5011 width: 100%;
5012 margin-right: 0;
5013 }
5014
5015
5016
5017 }
5018
5019 @media (min-width: 991px) and (max-width:1120px) {
5020
5021 .shortcode-settings-wrapper,
5022 .embedpress_general_settings__form:not(:last-child),
5023 .embedpress__shortcode {
5024 width: 100%;
5025 /* display: block; */
5026 }
5027
5028 .embedpress-upgrade-pro-sidebar {
5029 display: none;
5030 }
5031
5032
5033 }
5034
5035 @media (max-width: 767px) {
5036 .embedpress_general_settings__form:not(:last-child) {
5037 width: 100%;
5038 margin-right: 0;
5039 }
5040
5041 .embedpress-upgrade-pro-sidebar {
5042 display: none;
5043 }
5044
5045 }
5046
5047
5048 /* Leon your Style write here */
5049 /* base */
5050
5051 .embedpress-flex {
5052 display: flex;
5053 }
5054
5055 .embedpress-flex-wrap {
5056 flex-wrap: wrap;
5057 }
5058
5059 .embedpress-hub-section .embedpress-row {
5060 display: flex;
5061 width: 100%;
5062 gap: 12px;
5063 flex-wrap: wrap;
5064 justify-content: space-between;
5065 }
5066
5067
5068
5069 .embdpress-porsition-relative {
5070 position: relative;
5071 }
5072
5073 .embedpress-hub-section .new-tag {
5074 background-color: #059862;
5075 padding: 1px 4px;
5076 color: #FFFFFF;
5077 font-weight: 600;
5078 font-size: 8px;
5079 border-radius: 4px;
5080 position: absolute;
5081 top: -7px;
5082 right: -12px;
5083 }
5084
5085 .embedpress-item-center {
5086 align-items: center;
5087 }
5088
5089 .embedpress-justify-between {
5090 justify-content: space-between;
5091 }
5092
5093 .embedpress-justify-content-center {
5094 justify-content: center;
5095 }
5096
5097 .embedpress-font-family-dmsans {
5098 font-family: 'DMSans';
5099 }
5100
5101 .embedpress-line-height-0 {
5102 line-height: 0;
5103 }
5104
5105 .embdpress-hilight-text {
5106 font-weight: 700;
5107 text-decoration: underline;
5108 }
5109
5110 .embedpress-mr-4 {
5111 margin-right: 4px;
5112 }
5113
5114 .embedpress-mb-16 {
5115 margin-bottom: 16px;
5116 }
5117
5118 .embedpress-font-xl {
5119 font-size: 24px;
5120 font-weight: 600;
5121 color: #000000;
5122 }
5123
5124 .embedpress-font-l {
5125 font-size: 20px;
5126 font-weight: 600;
5127 color: #000000;
5128 }
5129
5130 .embedpress-font-m {
5131 font-weight: 400;
5132 font-size: .8rem;
5133 color: #000000;
5134
5135 }
5136
5137 .embdpress-underline {
5138 text-decoration: underline !important;
5139 }
5140
5141 .embedpress-btn {
5142 padding: 10px 13px;
5143 border-radius: 6px;
5144 }
5145
5146 .embedpress-banner-wrapper {
5147 margin-bottom: 58px;
5148 }
5149
5150 .embedpress-hub-section .banner-icon {
5151 height: 25px;
5152 width: 25px;
5153 }
5154
5155 .embedpress-hub-section .banner-icon-l {
5156 height: 20px;
5157 width: auto;
5158 }
5159
5160 .embedpress-hub-section .banner-icon-l img {
5161 width: 100%;
5162 height: 100%;
5163 object-fit: cover;
5164 filter: brightness(0);
5165 }
5166
5167 .embedpress-hub-section .error-msg {
5168 color: #FF0000 !important;
5169 }
5170
5171 .embedpress-hub-section .valid-msg {
5172 color: #5B4E96 !important;
5173 }
5174
5175 .embedpress-hub-section .banner-icon img {
5176 width: auto;
5177 height: 25px;
5178 margin-top: -2px;
5179 }
5180
5181 .embedPress-introduction-panel-wrapper .embedpress-cancel-button {
5182 background: transparent;
5183 padding: 0;
5184 color: #595092;
5185 cursor: pointer;
5186 text-decoration: underline;
5187 margin-top: -25px;
5188 }
5189
5190 .embedPress-introduction-panel-wrapper {
5191 max-width: 100%;
5192 /* max-width : 1277px; */
5193 margin: 24px 0px;
5194 background-color: #FFF9EF;
5195 border-radius: 6px;
5196 box-sizing: border-box;
5197 overflow: hidden;
5198 box-shadow: 0px 0px 2px 0px #59509233;
5199 display: flex;
5200 /* display : none; */
5201 }
5202
5203 .embedPress-introduction-panel-wrapper .embedPress-introduction-left-panel {
5204 width: 65%;
5205 padding: 24px;
5206 border-top-right-radius: 6px;
5207 border-bottom-right-radius: 6px;
5208 position: relative;
5209 display: flex;
5210 align-items: center;
5211 clip-path: polygon(0 0, 95% 0, 100% 100%, 0% 100%);
5212 background-color: #fff;
5213 /* justify-content: space-between; */
5214 padding-right: 30px;
5215 gap: 20px;
5216 }
5217
5218
5219 .embedPress-introduction-panel-wrapper .embedPress-left-panel-header {
5220 margin-bottom: 10px;
5221 line-height: 1.2;
5222 }
5223
5224
5225 .embedPress-introduction-panel-wrapper .embedpress-progress-container {
5226 width: 100%;
5227 max-width: 290px;
5228 height: 5px;
5229 background-color: #D9D9D9;
5230 border-radius: 8px;
5231 overflow: hidden;
5232 position: relative;
5233 margin-bottom: 18px;
5234 }
5235
5236 .embedPress-introduction-panel-wrapper .embedpress-progress-bar {
5237 position: absolute;
5238 bottom: 0;
5239 width: calc(var(--progress) * 100%);
5240 height: 100%;
5241 background: #059862;
5242 display: flex;
5243 align-items: flex-end;
5244 justify-content: center;
5245 color: #fff;
5246 font-weight: bold;
5247 transition: height 0.5s ease;
5248 border-radius: 8px;
5249 }
5250
5251 .embedPress-introduction-panel-wrapper .embedpress-follow-steps-header {
5252 margin-bottom: 8px;
5253 }
5254
5255 .embedPress-introduction-panel-wrapper .embedpress-follow-steps-list {
5256 list-style: decimal;
5257 width: 100%;
5258 /* max-width: 350px; */
5259 padding-left: 20px;
5260 }
5261
5262 .embedPress-introduction-panel-wrapper .embedpress-follow-steps-list .embedpress-follow-steps-list-item a {
5263 color: #5a5092;
5264 }
5265
5266 .embedPress-introduction-panel-wrapper .embedpress-follow-steps-list .embedpress-follow-steps-list-item a:hover {
5267 text-decoration: underline;
5268 }
5269
5270 .embedPress-introduction-panel-wrapper .embedPess-img-wrapper {
5271 width: auto;
5272 margin-bottom: -50px;
5273 }
5274
5275 .embedPress-introduction-panel-wrapper .embedPess-img-wrapper .embedPress-img-wrapper-left {
5276 max-width: 145px;
5277 width: 100%;
5278 margin-bottom: -180px;
5279 }
5280
5281 .embedPress-introduction-panel-wrapper .embedPess-img-wrapper .embedPress-img-wrapper-right {
5282 max-width: 145px;
5283 width: 100%;
5284 margin-left: 92px;
5285 margin-top: 30px;
5286 }
5287
5288 .embedPress-introduction-panel-wrapper .embedPess-img-wrapper img {
5289 object-fit: cover;
5290 width: 100%;
5291 }
5292
5293 .embedPress-introduction-panel-wrapper .embedPess-img-wrapper.embedpress-video-trigger {
5294 position: relative;
5295 cursor: pointer;
5296 width: 200px;
5297 }
5298
5299 .embedPress-text-wrapper {
5300 width: calc(100% - 200px);
5301 }
5302
5303 .embedPress-introduction-panel-wrapper .embedpress-play-icon {
5304 position: absolute;
5305 top: 50%;
5306 left: 50%;
5307 transform: translate(-50%, -50%);
5308 z-index: 2;
5309 transition: transform 0.2s ease;
5310 display: flex;
5311 }
5312
5313 .embedPress-introduction-panel-wrapper .embedpress-video-trigger:hover .embedpress-play-icon {
5314 transform: translate(-50%, -50%) scale(1.1);
5315 }
5316
5317 /* Video Popup */
5318 .embedpress-video-popup-overlay {
5319 position: fixed;
5320 top: 0;
5321 left: 0;
5322 width: 100%;
5323 height: 100%;
5324 background: rgba(0, 0, 0, 0.8);
5325 z-index: 999999;
5326 display: flex;
5327 align-items: center;
5328 justify-content: center;
5329 }
5330
5331 .embedpress-video-popup {
5332 position: relative;
5333 width: 80%;
5334 }
5335
5336 .embedpress-video-popup-close {
5337 position: absolute;
5338 top: -40px;
5339 right: 0;
5340 background: none;
5341 border: none;
5342 color: #fff;
5343 font-size: 32px;
5344 cursor: pointer;
5345 line-height: 1;
5346 padding: 0;
5347 z-index: 1;
5348 }
5349
5350 .embedpress-video-popup-close:hover {
5351 color: #FF7369;
5352 }
5353
5354 .embedpress-video-popup-content {
5355 position: relative;
5356 padding-bottom: 56.25%;
5357 height: 0;
5358 overflow: hidden;
5359 border-radius: 8px;
5360 }
5361
5362 .embedpress-video-popup-content iframe {
5363 position: absolute;
5364 top: 0;
5365 left: 0;
5366 width: 100%;
5367 height: 100%;
5368 }
5369
5370 .embedPress-introduction-panel-wrapper .embedPress-introduction-right-panel {
5371 padding: 24px;
5372 /* width: 45%; */
5373 }
5374
5375 .embedPress-introduction-panel-wrapper .embedPress-introduction-right-panel .embedPress-text-header-wrapper {
5376 width: 100%;
5377 margin-bottom: 18px;
5378 }
5379
5380 .embedPress-introduction-panel-wrapper .embedPress-introduction-right-panel .embedpress-left-content {
5381 width: 70%;
5382 }
5383
5384 .embedpress-premium-features-list {
5385 display: flex;
5386 flex-wrap: wrap;
5387 margin-bottom: 20px !important;
5388 }
5389
5390 .embedpress-premium-features-list-item {
5391 width: 45%;
5392 position: relative;
5393 padding-left: 20px;
5394 font-size: 0.75rem;
5395 margin-bottom: 5px;
5396 }
5397
5398 .embedpress-premium-features-list-item:nth-child(even) {
5399 width: 55%;
5400 }
5401
5402 .embedpress-premium-features-list-item::after {
5403 content: '';
5404 position: absolute;
5405 width: 9px;
5406 height: 9px;
5407 top: 5px;
5408 left: 5px;
5409 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");
5410
5411 }
5412
5413 .embedPress-introduction-panel-wrapper .embdpress-compare-btn {
5414 background-color: #595092;
5415 color: #FFFFFF;
5416 }
5417
5418 .embedPress-introduction-panel-wrapper .embedPress-introduction-right-panel .embedpress-right-content {
5419 width: 40%;
5420 }
5421
5422 .embedPress-introduction-panel-wrapper .embedpress-right-content .embedPess-img-wrapper {
5423 height: 131px;
5424 width: auto;
5425 }
5426
5427 .embedPress-introduction-panel-wrapper .embedpress-right-content .embedPess-img-wrapper img {
5428 height: 100%;
5429 object-fit: cover;
5430 width: 230px;
5431 }
5432
5433 .embedpress-hub-section .embedpress-banner {
5434 display: none;
5435 }
5436
5437 .embedpress-hub-section .embedpress-banner-active {
5438 display: block !important;
5439 }
5440
5441 .embedpress-hub-section .embedpress-banner-box {
5442 width: 100%;
5443 height: 100%;
5444 border-radius: 6px;
5445 background-color: #FFFFFF;
5446 justify-content: space-between;
5447 border: 0.5px solid #ffffff;
5448 }
5449
5450 .embedpress-brand-wrapper {
5451 background-color: #F6F3FF;
5452 border: 0.5px dashed #595092;
5453 height: 100%;
5454 border-radius: 6px;
5455 }
5456
5457 .embedpress-hub-section .embedpress-banner-header {
5458 font-weight: 500;
5459 }
5460
5461
5462 .embedpress-hub-section .embedpress-banner .embedpress-left-content {
5463 width: 65%;
5464 padding-left: 25px;
5465 }
5466
5467 .embedpress-hub-section .embedpress-banner .embedpress-banner-sub-header {
5468 color: #5B4E96;
5469 /* max-width : 243px; */
5470 padding-left: 30px;
5471 font-size: .9rem;
5472
5473 }
5474
5475 .embedpress-hub-section .embedpress-banner .embedpress-right-content {
5476 padding: 2px;
5477 border-radius: 6px;
5478 width: 200px;
5479 display: flex;
5480 justify-content: center;
5481 }
5482
5483 .pro-plugin-active .embedpress-banner .embedpress-right-content {
5484 width: auto !important;
5485 }
5486
5487 .embedpress-right-content.embedpress-branding-preview-wrapper {
5488 flex-direction: column;
5489 }
5490
5491 .embedpress-right-content.embedpress-branding-preview-wrapper .brand-preview-area {
5492 display: flex;
5493 justify-content: center;
5494 }
5495
5496 .preview-actions-button {
5497 display: flex;
5498 justify-content: center;
5499 gap: 10px;
5500 margin-top: 10px;
5501 }
5502
5503 .embedpress-flex.embedpress-item-center.embedpress-banner-box.embedpress-plan-wrapper .embedpress-right-content {
5504 justify-content: right;
5505 }
5506
5507 .embedpress-hub-section .embedpress-banner .embedpress-right-content .embedpress-img-wrapper {
5508 display: flex;
5509 justify-content: right;
5510
5511 }
5512
5513 .embedpress-hub-section .embedpress-banner .embedpress-right-content .embedpress-img-wrapper img {
5514 height: 100%;
5515 width: auto;
5516 object-fit: cover;
5517 max-width: 220px;
5518 }
5519
5520 /* .embedpress-hub-section .embedpress-brand-wrapper .embedpress-right-content {
5521 padding: 27px 32px;
5522 } */
5523
5524 .embedpress-hub-section .embedpress-brand-wrapper .embedpress-right-content .embedpress-img-wrapper {
5525 height: 101px;
5526 width: 165px;
5527 }
5528
5529
5530 .embedpress-license-wrapper .embedpress-banner-secondary-header {
5531 text-decoration: none;
5532 font-size: 15px;
5533 color: #5B4E96;
5534 padding-left: 27px;
5535 margin-bottom: 8px;
5536 }
5537
5538 .embedpress-license-wrapper {
5539 padding: 32px;
5540 background: red;
5541 }
5542
5543 .embedpress-license-wrapper .embedpress-activate-license-btn {
5544 background-color: #059862;
5545 color: #FFFFFF;
5546 font-weight: 600;
5547 margin-top: 19px;
5548 margin-left: 27px;
5549 font-size: .85rem;
5550 }
5551
5552 .embedpress-license-wrapper .embedpress-manages-license-btn {
5553 background-color: #EDEDF4;
5554 color: #000000;
5555 font-weight: 500;
5556 margin-top: 19px;
5557 margin-left: 27px;
5558 font-size: .85rem;
5559 }
5560
5561 .embedpress-license-wrapper .embedpress-license-btn span {
5562 width: 12px;
5563 height: 12px;
5564 display: inline-block;
5565 margin-right: 6px;
5566 margin-top: 2px;
5567 }
5568
5569 .embedpress-license-wrapper .embedpress-license-btn span img {
5570 width: 100%;
5571 height: 100%;
5572 }
5573
5574 .embedpress-branding-options-btn {
5575 background-color: #EAE6FD;
5576 margin-top: 19px;
5577 margin-left: 30px;
5578 font-size: .85rem;
5579 }
5580
5581 .embedpress-upload-brand-wrapper {
5582 padding: 32px 32px 32px 0px;
5583 }
5584
5585 .embedpress-upload-brand-wrapper .embedpress-right-content {
5586 text-align: center;
5587 }
5588
5589 .embedpress-preview-area {
5590 width: 140px;
5591 height: 100px;
5592 background-color: #F5F6FD;
5593 border-radius: 8px;
5594 border: 0.5px dashed #EAE6FD;
5595 display: flex;
5596 justify-content: center;
5597 align-items: center;
5598 position: relative;
5599 border: 1px dashed #ddd;
5600 }
5601
5602 .embedpress-preview-area.embedpress-height-95 {
5603 height: 95px;
5604 }
5605
5606 .embedpress-tag {
5607 position: absolute;
5608 font-size: 8px;
5609 font-weight: 600;
5610 right: -22px;
5611 top: -9px;
5612 background-color: #FCA108;
5613 padding: 2px 5px;
5614 border-radius: 4px;
5615 }
5616
5617 .embedpress-preview-area img {
5618 width: 60px;
5619 height: 60px;
5620 object-fit: contain;
5621 opacity: 0.2;
5622 }
5623
5624 .embedpress-global-brand-preview-img {
5625 width: 60px !important;
5626 height: 60px !important;
5627 object-fit: contain !important;
5628 opacity: 1 !important;
5629 border-radius: 4px;
5630 }
5631
5632 .embedpress-global-brand-indicator {
5633 background-color: #4CAF50;
5634 color: white;
5635 padding: 2px 6px;
5636 border-radius: 3px;
5637 font-size: .8rem;
5638 font-weight: 500;
5639 margin-left: 8px;
5640 display: inline-block;
5641 cursor: help;
5642 }
5643
5644 .embedpress-file-input {
5645 display: none;
5646 }
5647
5648 /* if upload img remove it */
5649
5650 .embedpress-upload-brand-wrapper .embedpress-upload-btn {
5651 color: #000000;
5652 text-decoration: underline;
5653 cursor: pointer;
5654 font-size: .75rem;
5655 background: none;
5656 }
5657
5658 .embedpress-upload-brand-wrapper .embedpress-upload-btn.remove-btn {
5659 color: #FF0000;
5660 }
5661
5662 /* if upload img active it */
5663 .embedpress-another-btns {
5664 gap: 12px;
5665 }
5666
5667 .embedpress-license-wrapper .embedpress-manage-license-btn {
5668 color: #000000;
5669 background-color: #EDEDF4;
5670 font-weight: 400;
5671 }
5672
5673 .embedpress-license-wrapper .embedpress-manage-license-btn svg {
5674 fill: #000000;
5675 }
5676
5677 .embedpress-license-wrapper .embedpress-license-input-wrapper {
5678
5679 border: 2px solid #EDEDF4;
5680 border-radius: 6px;
5681 background-color: #ffffff;
5682 margin-top: 14px;
5683 padding: 5px 14px;
5684 margin-right: 23px;
5685 margin-left: 27px;
5686 display: flex;
5687 align-items: center;
5688 justify-content: space-between;
5689 }
5690
5691 .embedpress-license-wrapper .embedpress-license-input-wrapper .embedpress-license-input {
5692 border: none;
5693 outline: none;
5694 box-shadow: none;
5695 width: calc(100% - 50px);
5696 display: inline;
5697 }
5698
5699 .embedpress-license-wrapper .embedpress-license-input-wrapper .embedpress-active-btn {
5700 display: flex !important;
5701 gap: 8px;
5702 align-items: center;
5703 background: none;
5704 border: none;
5705 color: #059862;
5706 display: inline;
5707 }
5708
5709 .embedpress-license-wrapper .embedpress-license-input-wrapper .embedpress-active-btn svg {
5710 fill: #059862;
5711
5712 }
5713
5714 .embedpress-license-wrapper .embedpress-license-input-wrapper .embedpress-active-btn.embedpress-manage-license-btn-enable {
5715 color: #FF0000;
5716 }
5717
5718 .embedpress-license-wrapper .embedpress-license-input-wrapper .embedpress-active-btn.embedpress-manage-license-btn-enable svg {
5719 fill: #FF0000;
5720 }
5721
5722 .embedpress-popular-content-wrapper {
5723 background-color: #ffffff;
5724 padding: 27px 33px;
5725 border-radius: 6px;
5726 }
5727
5728 .embedpress-popular-types-header {
5729 font-weight: 500;
5730 }
5731
5732 .embedpress-popular-content-header {
5733 margin-bottom: 20px;
5734 }
5735
5736 .embedpress-popular-content-header span.embedpress-flex.embedpress-item-center {
5737 gap: 10px;
5738 }
5739
5740 .embedpress-popular-content-body {
5741 padding: 25px;
5742 background: linear-gradient(to right, #F5F7FD, #F5F7FD);
5743
5744 }
5745
5746 .embedpress-card-header-wrapper {
5747 margin-bottom: 24px;
5748 gap: 5px;
5749 }
5750
5751 .embedpress-content-card-header {
5752 font-weight: 600;
5753 }
5754
5755
5756 .embedpress-popular-content-list .embedpress-popular-content-list-item {
5757 background-color: #ffffff;
5758 /* max-width : 199px; */
5759 width: 100%;
5760 border-radius: 4px;
5761 box-shadow: 0px 0px 10px 0px #0000001A;
5762 padding: 11px;
5763 display: flex;
5764 align-items: center;
5765 justify-content: space-between;
5766 margin-bottom: 20px;
5767
5768 }
5769
5770 .embedpress-flex.embedpress-item-center.content-item-wrapper {
5771 gap: 8px;
5772 }
5773
5774 .embedpress-flex.embedpress-item-center.content-item-wrapper span.embedpress-font-m {
5775 font-size: .85rem;
5776 }
5777
5778 .embedpress-popular-content-list .embedpress-popular-content-list-item:last-child {
5779 margin-bottom: 0px;
5780 }
5781
5782 .embedpress-hub-item-link {
5783 line-height: 0;
5784 cursor: pointer;
5785 }
5786
5787 .popular-content-icon {
5788 width: 24px;
5789 height: 24px;
5790 display: flex;
5791 justify-content: center;
5792 align-items: center;
5793 }
5794
5795 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 {
5796 height: 20px;
5797 }
5798
5799 span.embedpress-line-height-0.popular-content-icon.google-maps img {
5800 height: 22px;
5801 }
5802
5803 .popular-content-icon img {
5804 height: 24px;
5805 max-width: 24px;
5806 max-height: 24px;
5807 object-fit: contain;
5808 }
5809
5810
5811 .embedpress-pop-up {
5812 position: fixed;
5813 top: 0;
5814 left: 0;
5815 width: 100vw;
5816 height: 100vh;
5817 background: #BFBFBF94;
5818 z-index: 9999;
5819 display: none;
5820 opacity: 0;
5821 transition: opacity 0.3s ease-in-out;
5822 }
5823
5824 .embedpress-pop-up.show {
5825 display: block;
5826 opacity: 1;
5827 }
5828
5829 /* Banner dismiss functionality */
5830 .embedPress-introduction-panel-wrapper.dismissed {
5831 display: none !important;
5832 }
5833
5834 .embedpress-pop-up-content {
5835 position: absolute;
5836 z-index: 997;
5837 width: 800px;
5838 min-height: 420px;
5839 left: 50%;
5840 top: 50%;
5841 transform: translate(-50%, -50%);
5842 max-width: calc(100% - 30px);
5843 max-height: 100%;
5844 background: linear-gradient(249.39deg, #F6F3FF 0%, #EAE6FD 62.5%);
5845 box-shadow: 0px 0px 25px 0px #59509240;
5846 }
5847
5848 .embedpress-pop-up-content .pop-up-left-content {
5849 padding: 20px 40px;
5850 width: 68%;
5851 clip-path: polygon(0 0, 100% 0, 80% 100%, 0% 100%);
5852 background: #fff;
5853 display: flex;
5854 flex-direction: column;
5855 align-items: baseline;
5856 justify-content: center;
5857 padding-left: 30px;
5858 }
5859
5860
5861
5862 .embedpress-pop-up-content .pop-up-right-content {
5863 width: 32%;
5864 display: flex;
5865 flex-direction: column;
5866 align-items: end;
5867 justify-content: center;
5868 margin-right: 15px;
5869 }
5870
5871 .embedpress-pop-up-content .pop-up-right-content .embedpress-img-wrapper {
5872 margin-left: -15px;
5873 position: relative;
5874 left: -15px;
5875 }
5876
5877 .embedpress-pop-up-content .bfriday-deal-campaign {
5878 margin-bottom: 10px;
5879 }
5880
5881 .embedpress-pop-up-content .bfriday-deal-campaign a:focus {
5882 outline: 0;
5883 box-shadow: none;
5884 }
5885
5886 .embedpress-img-wrapper img {
5887 max-width: 265px;
5888 }
5889
5890 .premium-tag {
5891 font-size: 8px;
5892 font-weight: 600;
5893 color: #000000;
5894 padding: 1px 5px;
5895 border-radius: 4px;
5896 background-color: #FCA108;
5897 display: inline-block;
5898 }
5899
5900 .embedpress-pop-up .embedpress-pop-up-header {
5901 font-weight: 600;
5902 margin: 8px 0;
5903 }
5904
5905 .embedpress-pop-up .embedpress-pop-up-sub-header {
5906 margin-bottom: 10px;
5907 }
5908
5909 .embedpress-pop-up .embedpress-pop-up-btn {
5910 color: #FFFFFF;
5911 background-color: #595092;
5912 font-weight: 600;
5913 color: #FFFFFF;
5914 display: flex;
5915 align-items: center;
5916 max-width: 240px;
5917 margin-bottom: 13px;
5918 }
5919
5920 .embedpress-pop-up a.embedpress-btn.embedpress-btn-primary.embedpress-pop-up-btn span {
5921 font-size: .85rem;
5922 line-height: 0;
5923 }
5924
5925 .pop-up-btn-icon {
5926 height: 20px;
5927
5928 }
5929
5930 .pop-up-btn-icon img {
5931 width: 100%;
5932 height: 100%;
5933 object-fit: cover;
5934 margin-top: -2px;
5935 }
5936
5937 .embedpress-guarantee {
5938 color: #666666;
5939 font-size: .8rem;
5940 }
5941
5942 /* .embedpress-img-wrapper {
5943 margin-left: -55px;
5944 } */
5945
5946 .embedpress-pop-up .embedress-text-wrapper {
5947 margin-left: -45px;
5948 position: relative;
5949 left: -25px;
5950 }
5951
5952 .embedpress-pop-up .embedress-text-wrapper p {
5953 font-size: .8rem;
5954 }
5955
5956 .embedress-text-wrapper p.embedpress-font-m.embedpress-font-family-dmsans {
5957 font-size: 0.625rem;
5958 }
5959
5960 p.embedpress-font-m.embedpress-font-family-dmsans.embedpress-pop-up-sub-header {
5961 font-size: 0.75rem;
5962 }
5963
5964 .embedpress-pop-up .embedpress-cancel-button {
5965 text-align: right;
5966 text-decoration: underline;
5967 background: transparent;
5968 cursor: pointer;
5969 font-size: .75rem;
5970 color: #7f78ad;
5971 margin-right: 15px;
5972 padding-bottom: 10px;
5973 position: absolute;
5974 top: 20px;
5975 right: 10px;
5976 }
5977
5978
5979
5980 @media only screen and (max-width: 1500px) {
5981
5982
5983 .embedPress-introduction-panel-wrapper .embedPress-introduction-left-panel {
5984 background-size: contain;
5985 background-color: #ffffff;
5986 clip-path: none;
5987 }
5988
5989 .embedPress-introduction-left-panel::after {
5990 rotate: 0deg;
5991 right: 0;
5992 }
5993
5994
5995 .embedpress-banner-box {
5996 padding: 32px;
5997 }
5998
5999 .embedpress-hub-section .embedpress-banner .embedpress-left-content {
6000 padding-left: 0px;
6001 padding-right: 0px;
6002 }
6003
6004 .embedpress-flex.embedpress-item-center.embedpress-brand-wrapper {
6005 padding: 12px 0 12px 12px;
6006 min-height: 140px;
6007 justify-content: space-between;
6008 }
6009
6010 /* .embedpress-hub-section .embedpress-brand-wrapper .embedpress-right-content {
6011 padding: 12px;
6012 } */
6013
6014 .embedpress-preview-area.embedpress-height-95 {
6015 height: 80px;
6016 width: 105px;
6017 margin: 0;
6018 padding: 0;
6019
6020 }
6021
6022 .embedpress-hub-section .embedpress-banner .embedpress-right-content .embedpress-img-wrapper img {
6023 max-height: 120px;
6024 }
6025
6026 .embedpress-hub-section .embedpress-banner .embedpress-banner-sub-header {
6027 font-size: .85rem;
6028 }
6029
6030 }
6031
6032 @media only screen and (max-width: 1300px) {
6033
6034 /* .embedPress-introduction-panel-wrapper .embedPress-introduction-right-panel .embedpress-right-content {
6035 width: 50%;
6036 }
6037
6038 .embedPress-introduction-panel-wrapper .embedPress-introduction-right-panel .embedpress-left-content {
6039 width: 70%;
6040 }
6041
6042 .embedPess-img-wrapper,
6043 .embedPress-text-wrapper {
6044 width: 50%;
6045 } */
6046
6047 .embedPress-introduction-panel-wrapper .embedpress-cancel-button {
6048 margin-top: 0;
6049 }
6050
6051 .embedpress-brand-wrapper {
6052 margin-bottom: 2px;
6053 }
6054
6055 .embedpress-banner-wrapper {
6056 margin-bottom: 25px;
6057 }
6058
6059 .embedpress-popular-content-cards {
6060 margin-bottom: 30px;
6061 }
6062
6063 .embedPress-introduction-panel-wrapper {
6064 flex-wrap: wrap;
6065 position: relative;
6066 }
6067
6068 .embedpress-cancel-button {
6069 position: absolute;
6070 top: 20px;
6071 right: 20px;
6072 }
6073
6074 .embedPress-introduction-panel-wrapper .embedPress-introduction-right-panel,
6075 .embedPress-introduction-panel-wrapper .embedPress-introduction-left-panel {
6076 width: 100%;
6077 }
6078
6079 .embedpress-font-xl {
6080 font-size: 20px;
6081 }
6082
6083 .embedpress-font-l {
6084 font-size: 16px;
6085 }
6086
6087 .embedpress-popular-content-wrapper {
6088 padding: 12px;
6089 }
6090
6091 .embedpress-popular-content-list {
6092 padding-right: 0px !important;
6093 }
6094
6095 .embedpress-pop-up-content .pop-up-left-content {
6096 width: 100%;
6097 }
6098
6099
6100 /* .embedpress-pop-up-content .pop-up-right-content {
6101 width: 100%;
6102 padding: 12px;
6103 display: flex;
6104 flex-direction: column;
6105 align-items: center;
6106 justify-content: center;
6107 } */
6108
6109 .embedpress-img-wrapper {
6110 margin-left: 0px;
6111 }
6112
6113 .embedpress-pop-up .embedress-text-wrapper {
6114 margin-left: 0px;
6115 }
6116
6117 }
6118
6119 /* Grid system */
6120 .embdpress-col-1 {
6121 flex: 0 0 calc(8.33% - 12px);
6122 }
6123
6124 .embdpress-col-2 {
6125 flex: 0 0 calc(16.66% - 12px);
6126 }
6127
6128 .embdpress-col-3 {
6129 flex: 0 0 calc(25% - 12px);
6130 }
6131
6132 .embdpress-col-4 {
6133 flex: 0 0 calc(33.33% - 12px);
6134 }
6135
6136 .embdpress-col-5 {
6137 flex: 0 0 calc(41.66% - 12px);
6138 }
6139
6140 .embdpress-col-6 {
6141 flex: 0 0 calc(50% - 12px);
6142 }
6143
6144 .embdpress-col-7 {
6145 flex: 0 0 calc(58.33% - 12px);
6146 }
6147
6148 .embdpress-col-8 {
6149 flex: 0 0 calc(66.66% - 12px);
6150 }
6151
6152 .embdpress-col-9 {
6153 flex: 0 0 calc(75% - 12px);
6154 }
6155
6156 .embdpress-col-10 {
6157 flex: 0 0 calc(83.33% - 12px);
6158 }
6159
6160 .embdpress-col-11 {
6161 flex: 0 0 calc(91.66% - 12px);
6162 }
6163
6164 .embdpress-col-12 {
6165 flex: 0 0 100%;
6166 }
6167
6168 .embdpress-col-1,
6169 .embdpress-col-2,
6170 .embdpress-col-3,
6171 .embdpress-col-4,
6172 .embdpress-col-5,
6173 .embdpress-col-6,
6174 .embdpress-col-7,
6175 .embdpress-col-8,
6176 .embdpress-col-9,
6177 .embdpress-col-10,
6178 .embdpress-col-11,
6179 .embdpress-col-12 {
6180 box-sizing: border-box;
6181 }
6182
6183
6184
6185 @media (max-width: 1420px) {
6186
6187 .embdpress-col-4,
6188 .embdpress-col-3 {
6189 flex: 1 1 calc(33.333% - 12px);
6190 }
6191 }
6192
6193 @media (max-width: 1400px) {
6194
6195 .embdpress-col-6,
6196 .embdpress-col-5 {
6197 flex: 1 1 50%;
6198 }
6199 }
6200
6201 @media (max-width: 1100px) {
6202
6203 .embdpress-col-4,
6204 .embdpress-col-3 {
6205 flex: 1 1 calc(50% - 12px);
6206 }
6207 }
6208
6209 @media (max-width: 768px) {
6210
6211 .embdpress-col-4,
6212 .embdpress-col-3 {
6213 flex: 0 0 100%;
6214
6215 }
6216 }
6217
6218 /* Hub specific styles for docs icon and status badges */
6219 .embedpress-popular-content-list-item {
6220 position: relative;
6221 }
6222
6223 .embedpress-hub-item-actions {
6224 display: flex;
6225 align-items: center;
6226 gap: 12px;
6227 }
6228
6229 /* .embedpress-hub-item-actions .embedpress-hub-item-link {
6230 width: 24px;
6231 height: 24px;
6232 background: #f5f7fd;
6233 border-radius: 4px;
6234 display: flex;
6235 align-items: center;
6236 justify-content: center;
6237 transition: all 0.2s ease;
6238 }
6239
6240 .embedpress-hub-item-actions .embedpress-hub-item-link:hover {
6241 background: #e8ecf7;
6242 } */
6243
6244 .embedpress-hub-item-actions .embedpress-hub-item-link svg {
6245 width: 16px;
6246 height: 16px;
6247 }
6248
6249 /* .embedpress-hub-item-actions .embedpress-hub-item-link:hover svg g {
6250 stroke: #5B4E96;
6251 } */
6252
6253 /* Status badge positioning for hub items */
6254 .embedpress-popular-content-list-item .ribbon-container {
6255 position: absolute;
6256 top: -8px;
6257 right: -8px;
6258 left: auto;
6259 font-size: 10px;
6260 padding: 2px 6px;
6261 height: 18px;
6262 min-width: 40px;
6263 z-index: 2;
6264 }
6265
6266 /* Responsive adjustments */
6267 @media (max-width: 768px) {
6268 .embedpress-hub-item-actions {
6269 gap: 4px;
6270 }
6271
6272 .embedpress-hub-item-actions .embedpress-hub-item-link {
6273 width: 20px;
6274 height: 20px;
6275 }
6276
6277 /* .embedpress-hub-item-actions .embedpress-hub-item-link svg {
6278 width: 12px;
6279 height: 12px;
6280 } */
6281 }
6282
6283 /* Introduction Tab Styles */
6284 .embedpress-intro-tab-container {
6285 margin-top: 20px;
6286 }
6287
6288 .embedpress-intro-tab-nav {
6289 display: inline-flex;
6290 gap: 5px;
6291 background: #F5F7FD;
6292 padding: 6px;
6293 border-radius: 10px;
6294 margin-bottom: 20px;
6295 justify-content: center;
6296 }
6297
6298 .embedpress-intro-tab-btn {
6299 padding: 6px 20px;
6300 cursor: pointer;
6301 background-color: transparent;
6302 border: none;
6303 border-radius: 8px;
6304 font-size: 14px;
6305 font-weight: 500;
6306 color: #5B4E96;
6307 }
6308
6309 .embedpress-intro-tab-btn:hover {
6310 background-color: #E8ECFF;
6311 }
6312
6313 /* .embedpress-intro-tab-btn.active {
6314 background-color: #5B4E96;
6315 color: #FFFFFF;
6316 } */
6317
6318 .embedpress-intro-tab-btn.active {
6319 background-color: #FFFFFF;
6320 }
6321
6322 .embedpress-intro-tab-content {
6323 width: 100%;
6324 }
6325
6326 .embedpress-intro-tab-panel {
6327 display: none;
6328 width: 100%;
6329 }
6330
6331 .embedpress-intro-tab-panel.active {
6332 display: block;
6333 }