PluginProbe ʕ •ᴥ•ʔ
EmbedPress – PDF Embedder, 3D PDF FlipBook, Google Reviews, YouTube Videos, Upload & Embed PDF documents / 4.0.5
EmbedPress – PDF Embedder, 3D PDF FlipBook, Google Reviews, YouTube Videos, Upload & Embed PDF documents v4.0.5
4.6.0 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 / EmbedPress / Ends / Back / Settings / assets / css / style.css
embedpress / EmbedPress / Ends / Back / Settings / assets / css Last commit date
fonts 3 years ago icon 2 years ago style.css 2 years ago
style.css
4802 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: "DM Sans", sans-serif; */
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: 13px;
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: "DM Sans", sans-serif; */
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, .template__wrapper label, .iframe__size__control__form .form__group .frame__unit, .iframe__size__control__wrap h3, .embedpress__settings__form .form__group .form__label, .embedpress__settings__form .form__group .form__control__wrap p, .upgrade__card .card__content h4, .upgrade__card .card__content p, .upgrage__card__tab__style h3, .upgrage__card__tab__style p, .embedpress-license__details .license__content .thumb__area h2, .embedpress-license__details .license__content p, .embedpress-license__details .license__content ol li, .embedpress-card h3, .embedpress-card p, .element__item h5, .element__item .pro__item, .embedpress--elements__wrap h3 {
394 /* font-family: "DM Sans", sans-serif; */
395 font-family: 'DMSans';
396 }
397
398 .color__themeColor {
399 color: #5B4E96;
400 }
401
402 a.color__themeColor:hover, a.color__themeColor:focus {
403 color: #473d74;
404 -webkit-box-shadow: none;
405 box-shadow: none;
406 }
407
408 .color__primary {
409 color: #00CC76;
410 }
411
412 a.color__primary:hover, a.color__primary:focus {
413 color: #009959;
414 -webkit-box-shadow: none;
415 box-shadow: none;
416 }
417
418 .color__danger {
419 color: #FE504F;
420 }
421
422 a.color__danger:hover, a.color__danger:focus {
423 color: #fe1e1c;
424 -webkit-box-shadow: none;
425 box-shadow: none;
426 }
427
428 .color__warning {
429 color: #FFA53C;
430 }
431
432 a.color__warning:hover, a.color__warning:focus {
433 color: #ff8d09;
434 -webkit-box-shadow: none;
435 box-shadow: none;
436 }
437
438 .color__white {
439 color: #ffffff;
440 }
441
442 a.color__white:hover, a.color__white:focus {
443 color: #e6e6e6;
444 -webkit-box-shadow: none;
445 box-shadow: none;
446 }
447
448 .color__dark {
449 color: #222222;
450 }
451
452 a.color__dark:hover, a.color__dark:focus {
453 color: #090909;
454 -webkit-box-shadow: none;
455 box-shadow: none;
456 }
457
458 .color__grey {
459 color: #7C8DB5;
460 }
461
462 a.color__grey:hover, a.color__grey:focus {
463 color: #5c71a2;
464 -webkit-box-shadow: none;
465 box-shadow: none;
466 }
467
468 .color__liteGrey {
469 color: #F5F7FD;
470 }
471
472 a.color__liteGrey:hover, a.color__liteGrey:focus {
473 color: #cbd5f5;
474 -webkit-box-shadow: none;
475 box-shadow: none;
476 }
477
478 .color__black {
479 color: #000000;
480 }
481
482 .color__twitter {
483 color: #1da1f2;
484 }
485
486 a.color__twitter:hover, a.color__twitter:focus {
487 color: #0c85d0;
488 -webkit-box-shadow: none;
489 box-shadow: none;
490 }
491
492 .color__linkedin {
493 color: #0077b5;
494 }
495
496 a.color__linkedin:hover, a.color__linkedin:focus {
497 color: #005582;
498 -webkit-box-shadow: none;
499 box-shadow: none;
500 }
501
502 .color__instagram {
503 color: #e1306c;
504 }
505
506 a.color__instagram:hover, a.color__instagram:focus {
507 color: #c21c54;
508 -webkit-box-shadow: none;
509 box-shadow: none;
510 }
511
512 .background__themeColor {
513 background-color: #5B4E96;
514 }
515
516 .background__primary {
517 background-color: #00CC76;
518 }
519
520 .background__danger {
521 background-color: #FE504F;
522 }
523
524 .background__warning {
525 background-color: #FFA53C;
526 }
527
528 .background__white {
529 background-color: #ffffff;
530 }
531
532 .background__dark {
533 background-color: #222222;
534 }
535
536 .background__grey {
537 background-color: #7C8DB5;
538 }
539
540 .background__liteGrey {
541 background-color: #F5F7FD;
542 }
543
544 .background__black {
545 background-color: #000000;
546 }
547
548 .background__twitter {
549 background-color: #1da1f2;
550 }
551
552 .background__linkedin {
553 background-color: #0077b5;
554 }
555
556 .background__instagram {
557 background-color: #e1306c;
558 }
559
560 .gradient__themeColor {
561 background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(91, 78, 150, 0.3)), to(rgba(91, 78, 150, 0.05)));
562 background-image: linear-gradient(180deg, rgba(91, 78, 150, 0.3), rgba(91, 78, 150, 0.05));
563 color: #5B4E96;
564 }
565
566 .gradient__primary {
567 background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 204, 118, 0.3)), to(rgba(0, 204, 118, 0.05)));
568 background-image: linear-gradient(180deg, rgba(0, 204, 118, 0.3), rgba(0, 204, 118, 0.05));
569 color: #00CC76;
570 }
571
572 .gradient__danger {
573 background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(254, 80, 79, 0.3)), to(rgba(254, 80, 79, 0.05)));
574 background-image: linear-gradient(180deg, rgba(254, 80, 79, 0.3), rgba(254, 80, 79, 0.05));
575 color: #FE504F;
576 }
577
578 .gradient__warning {
579 background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(255, 165, 60, 0.3)), to(rgba(255, 165, 60, 0.05)));
580 background-image: linear-gradient(180deg, rgba(255, 165, 60, 0.3), rgba(255, 165, 60, 0.05));
581 color: #FFA53C;
582 }
583
584 .gradient__white {
585 background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(255, 255, 255, 0.3)), to(rgba(255, 255, 255, 0.05)));
586 background-image: linear-gradient(180deg, rgba(255, 255, 255, 0.3), rgba(255, 255, 255, 0.05));
587 color: #ffffff;
588 }
589
590 .gradient__dark {
591 background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(34, 34, 34, 0.3)), to(rgba(34, 34, 34, 0.05)));
592 background-image: linear-gradient(180deg, rgba(34, 34, 34, 0.3), rgba(34, 34, 34, 0.05));
593 color: #222222;
594 }
595
596 .gradient__grey {
597 background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(124, 141, 181, 0.3)), to(rgba(124, 141, 181, 0.05)));
598 background-image: linear-gradient(180deg, rgba(124, 141, 181, 0.3), rgba(124, 141, 181, 0.05));
599 color: #7C8DB5;
600 }
601
602 .gradient__liteGrey {
603 background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(245, 247, 253, 0.3)), to(rgba(245, 247, 253, 0.05)));
604 background-image: linear-gradient(180deg, rgba(245, 247, 253, 0.3), rgba(245, 247, 253, 0.05));
605 color: #F5F7FD;
606 }
607
608 .gradient__black {
609 background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0.3)), to(rgba(0, 0, 0, 0.05)));
610 background-image: linear-gradient(180deg, rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.05));
611 color: #000000;
612 }
613
614 .gradient__twitter {
615 background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(29, 161, 242, 0.3)), to(rgba(29, 161, 242, 0.05)));
616 background-image: linear-gradient(180deg, rgba(29, 161, 242, 0.3), rgba(29, 161, 242, 0.05));
617 color: #1da1f2;
618 }
619
620 .gradient__linkedin {
621 background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 119, 181, 0.3)), to(rgba(0, 119, 181, 0.05)));
622 background-image: linear-gradient(180deg, rgba(0, 119, 181, 0.3), rgba(0, 119, 181, 0.05));
623 color: #0077b5;
624 }
625
626 .gradient__instagram {
627 background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(225, 48, 108, 0.3)), to(rgba(225, 48, 108, 0.05)));
628 background-image: linear-gradient(180deg, rgba(225, 48, 108, 0.3), rgba(225, 48, 108, 0.05));
629 color: #e1306c;
630 }
631
632 .button__themeColor:not(.hover__highlight) {
633 background: #5B4E96;
634 color: white;
635 border-color: #5B4E96;
636 -webkit-transition-property: background, color, box-shadow, border;
637 -webkit-transition-property: background, color, border, -webkit-box-shadow;
638 transition-property: background, color, border, -webkit-box-shadow;
639 transition-property: background, color, box-shadow, border;
640 transition-property: background, color, box-shadow, border, -webkit-box-shadow;
641 }
642
643 .button__themeColor:not(.hover__highlight):disabled {
644 cursor: not-allowed;
645 background: #FE504F;
646 border-color: #FE504F;
647 }
648
649 .button__themeColor:not(.hover__highlight) .icon {
650 color: #5B4E96;
651 background: white;
652 }
653
654 .button__themeColor.hover__highlight {
655 color: #5B4E96;
656 border-color: transparent;
657 background: rgba(91, 78, 150, 0.1);
658 }
659
660 .button__themeColor.hover__highlight .icon {
661 background: #00CC76;
662 color: #ffffff;
663 }
664
665 .button__themeColor.hover__highlight:hover {
666 border-color: transparent;
667 }
668
669 .button__themeColor.button__shadow {
670 -webkit-box-shadow: 0 10px 10px rgba(91, 78, 150, 0.2);
671 box-shadow: 0 10px 10px rgba(91, 78, 150, 0.2);
672 }
673
674 a.button__themeColor.active, a.button__themeColor:hover,
675 button.button__themeColor.active,
676 button.button__themeColor:hover {
677 background: #514585;
678 color: white;
679 border-color: #514585;
680 }
681
682 a.button__themeColor.active:disabled, a.button__themeColor:hover:disabled,
683 button.button__themeColor.active:disabled,
684 button.button__themeColor:hover:disabled {
685 cursor: not-allowed;
686 background: #FE504F;
687 -webkit-box-shadow: none;
688 box-shadow: none;
689 }
690
691 a.button__themeColor.hover__highlight:hover .icon,
692 button.button__themeColor.hover__highlight:hover .icon {
693 background: white;
694 color: #5B4E96;
695 }
696
697 .button__primary:not(.hover__highlight) {
698 background: #00CC76;
699 color: white;
700 border-color: #00CC76;
701 -webkit-transition-property: background, color, box-shadow, border;
702 -webkit-transition-property: background, color, border, -webkit-box-shadow;
703 transition-property: background, color, border, -webkit-box-shadow;
704 transition-property: background, color, box-shadow, border;
705 transition-property: background, color, box-shadow, border, -webkit-box-shadow;
706 }
707
708 .button__primary:not(.hover__highlight):disabled {
709 cursor: not-allowed;
710 background: #FE504F;
711 border-color: #FE504F;
712 }
713
714 .button__primary:not(.hover__highlight) .icon {
715 color: #00CC76;
716 background: white;
717 }
718
719 .button__primary.hover__highlight {
720 color: #00CC76;
721 border-color: transparent;
722 background: rgba(0, 204, 118, 0.1);
723 }
724
725 .button__primary.hover__highlight .icon {
726 background: #00CC76;
727 color: #ffffff;
728 }
729
730 .button__primary.hover__highlight:hover {
731 border-color: transparent;
732 }
733
734 .button__primary.button__shadow {
735 -webkit-box-shadow: 0 10px 10px rgba(0, 204, 118, 0.2);
736 box-shadow: 0 10px 10px rgba(0, 204, 118, 0.2);
737 }
738
739 a.button__primary.active, a.button__primary:hover,
740 button.button__primary.active,
741 button.button__primary:hover {
742 background: #00b367;
743 color: white;
744 border-color: #00b367;
745 }
746
747 a.button__primary.active:disabled, a.button__primary:hover:disabled,
748 button.button__primary.active:disabled,
749 button.button__primary:hover:disabled {
750 cursor: not-allowed;
751 background: #FE504F;
752 -webkit-box-shadow: none;
753 box-shadow: none;
754 }
755
756 a.button__primary.hover__highlight:hover .icon,
757 button.button__primary.hover__highlight:hover .icon {
758 background: white;
759 color: #00CC76;
760 }
761
762 .button__danger:not(.hover__highlight) {
763 background: #FE504F;
764 color: white;
765 border-color: #FE504F;
766 -webkit-transition-property: background, color, box-shadow, border;
767 -webkit-transition-property: background, color, border, -webkit-box-shadow;
768 transition-property: background, color, border, -webkit-box-shadow;
769 transition-property: background, color, box-shadow, border;
770 transition-property: background, color, box-shadow, border, -webkit-box-shadow;
771 }
772
773 .button__danger:not(.hover__highlight):disabled {
774 cursor: not-allowed;
775 background: #FE504F;
776 border-color: #FE504F;
777 }
778
779 .button__danger:not(.hover__highlight) .icon {
780 color: #FE504F;
781 background: white;
782 }
783
784 .button__danger.hover__highlight {
785 color: #FE504F;
786 border-color: transparent;
787 background: rgba(254, 80, 79, 0.1);
788 }
789
790 .button__danger.hover__highlight .icon {
791 background: #00CC76;
792 color: #ffffff;
793 }
794
795 .button__danger.hover__highlight:hover {
796 border-color: transparent;
797 }
798
799 .button__danger.button__shadow {
800 -webkit-box-shadow: 0 10px 10px rgba(254, 80, 79, 0.2);
801 box-shadow: 0 10px 10px rgba(254, 80, 79, 0.2);
802 }
803
804 a.button__danger.active, a.button__danger:hover,
805 button.button__danger.active,
806 button.button__danger:hover {
807 background: #fe3736;
808 color: white;
809 border-color: #fe3736;
810 }
811
812 a.button__danger.active:disabled, a.button__danger:hover:disabled,
813 button.button__danger.active:disabled,
814 button.button__danger:hover:disabled {
815 cursor: not-allowed;
816 background: #FE504F;
817 -webkit-box-shadow: none;
818 box-shadow: none;
819 }
820
821 a.button__danger.hover__highlight:hover .icon,
822 button.button__danger.hover__highlight:hover .icon {
823 background: white;
824 color: #FE504F;
825 }
826
827 .button__warning:not(.hover__highlight) {
828 background: #FFA53C;
829 color: white;
830 border-color: #FFA53C;
831 -webkit-transition-property: background, color, box-shadow, border;
832 -webkit-transition-property: background, color, border, -webkit-box-shadow;
833 transition-property: background, color, border, -webkit-box-shadow;
834 transition-property: background, color, box-shadow, border;
835 transition-property: background, color, box-shadow, border, -webkit-box-shadow;
836 }
837
838 .button__warning:not(.hover__highlight):disabled {
839 cursor: not-allowed;
840 background: #FE504F;
841 border-color: #FE504F;
842 }
843
844 .button__warning:not(.hover__highlight) .icon {
845 color: #FFA53C;
846 background: white;
847 }
848
849 .button__warning.hover__highlight {
850 color: #FFA53C;
851 border-color: transparent;
852 background: rgba(255, 165, 60, 0.1);
853 }
854
855 .button__warning.hover__highlight .icon {
856 background: #00CC76;
857 color: #ffffff;
858 }
859
860 .button__warning.hover__highlight:hover {
861 border-color: transparent;
862 }
863
864 .button__warning.button__shadow {
865 -webkit-box-shadow: 0 10px 10px rgba(255, 165, 60, 0.2);
866 box-shadow: 0 10px 10px rgba(255, 165, 60, 0.2);
867 }
868
869 a.button__warning.active, a.button__warning:hover,
870 button.button__warning.active,
871 button.button__warning:hover {
872 background: #ff9923;
873 color: white;
874 border-color: #ff9923;
875 }
876
877 a.button__warning.active:disabled, a.button__warning:hover:disabled,
878 button.button__warning.active:disabled,
879 button.button__warning:hover:disabled {
880 cursor: not-allowed;
881 background: #FE504F;
882 -webkit-box-shadow: none;
883 box-shadow: none;
884 }
885
886 a.button__warning.hover__highlight:hover .icon,
887 button.button__warning.hover__highlight:hover .icon {
888 background: white;
889 color: #FFA53C;
890 }
891
892 .button__white:not(.hover__highlight) {
893 background: #ffffff;
894 color: #5b4e96;
895 border-color: #ffffff;
896 -webkit-transition-property: background, color, box-shadow, border;
897 -webkit-transition-property: background, color, border, -webkit-box-shadow;
898 transition-property: background, color, border, -webkit-box-shadow;
899 transition-property: background, color, box-shadow, border;
900 transition-property: background, color, box-shadow, border, -webkit-box-shadow;
901 }
902
903 .button__white:not(.hover__highlight):disabled {
904 cursor: not-allowed;
905 background: #FE504F;
906 border-color: #FE504F;
907 }
908
909 .button__white:not(.hover__highlight) .icon {
910 color: #ffffff;
911 background: #5b4e96;
912 }
913
914 .button__white.hover__highlight {
915 color: #ffffff;
916 border-color: transparent;
917 background: rgba(255, 255, 255, 0.1);
918 }
919
920 .button__white.hover__highlight .icon {
921 background: #00CC76;
922 color: #ffffff;
923 }
924
925 .button__white.hover__highlight:hover {
926 border-color: transparent;
927 }
928
929 .button__white.button__shadow {
930 -webkit-box-shadow: 0 10px 10px rgba(255, 255, 255, 0.2);
931 box-shadow: 0 10px 10px rgba(255, 255, 255, 0.2);
932 }
933
934 a.button__white.active, a.button__white:hover,
935 button.button__white.active,
936 button.button__white:hover {
937 background: #f2f2f2;
938 color: #5b4e96;
939 border-color: #f2f2f2;
940 }
941
942 a.button__white.active:disabled, a.button__white:hover:disabled,
943 button.button__white.active:disabled,
944 button.button__white:hover:disabled {
945 cursor: not-allowed;
946 background: #FE504F;
947 -webkit-box-shadow: none;
948 box-shadow: none;
949 }
950
951 a.button__white.hover__highlight:hover .icon,
952 button.button__white.hover__highlight:hover .icon {
953 background: #5b4e96;
954 color: #ffffff;
955 }
956
957 .button__dark:not(.hover__highlight) {
958 background: #222222;
959 color: white;
960 border-color: #222222;
961 -webkit-transition-property: background, color, box-shadow, border;
962 -webkit-transition-property: background, color, border, -webkit-box-shadow;
963 transition-property: background, color, border, -webkit-box-shadow;
964 transition-property: background, color, box-shadow, border;
965 transition-property: background, color, box-shadow, border, -webkit-box-shadow;
966 }
967
968 .button__dark:not(.hover__highlight):disabled {
969 cursor: not-allowed;
970 background: #FE504F;
971 border-color: #FE504F;
972 }
973
974 .button__dark:not(.hover__highlight) .icon {
975 color: #222222;
976 background: white;
977 }
978
979 .button__dark.hover__highlight {
980 color: #222222;
981 border-color: transparent;
982 background: rgba(34, 34, 34, 0.1);
983 }
984
985 .button__dark.hover__highlight .icon {
986 background: #00CC76;
987 color: #ffffff;
988 }
989
990 .button__dark.hover__highlight:hover {
991 border-color: transparent;
992 }
993
994 .button__dark.button__shadow {
995 -webkit-box-shadow: 0 10px 10px rgba(34, 34, 34, 0.2);
996 box-shadow: 0 10px 10px rgba(34, 34, 34, 0.2);
997 }
998
999 a.button__dark.active, a.button__dark:hover,
1000 button.button__dark.active,
1001 button.button__dark:hover {
1002 background: #151515;
1003 color: white;
1004 border-color: #151515;
1005 }
1006
1007 a.button__dark.active:disabled, a.button__dark:hover:disabled,
1008 button.button__dark.active:disabled,
1009 button.button__dark:hover:disabled {
1010 cursor: not-allowed;
1011 background: #FE504F;
1012 -webkit-box-shadow: none;
1013 box-shadow: none;
1014 }
1015
1016 a.button__dark.hover__highlight:hover .icon,
1017 button.button__dark.hover__highlight:hover .icon {
1018 background: white;
1019 color: #222222;
1020 }
1021
1022 .button__grey:not(.hover__highlight) {
1023 background: #7C8DB5;
1024 color: white;
1025 border-color: #7C8DB5;
1026 -webkit-transition-property: background, color, box-shadow, border;
1027 -webkit-transition-property: background, color, border, -webkit-box-shadow;
1028 transition-property: background, color, border, -webkit-box-shadow;
1029 transition-property: background, color, box-shadow, border;
1030 transition-property: background, color, box-shadow, border, -webkit-box-shadow;
1031 }
1032
1033 .button__grey:not(.hover__highlight):disabled {
1034 cursor: not-allowed;
1035 background: #FE504F;
1036 border-color: #FE504F;
1037 }
1038
1039 .button__grey:not(.hover__highlight) .icon {
1040 color: #7C8DB5;
1041 background: white;
1042 }
1043
1044 .button__grey.hover__highlight {
1045 color: #7C8DB5;
1046 border-color: transparent;
1047 background: rgba(124, 141, 181, 0.1);
1048 }
1049
1050 .button__grey.hover__highlight .icon {
1051 background: #00CC76;
1052 color: #ffffff;
1053 }
1054
1055 .button__grey.hover__highlight:hover {
1056 border-color: transparent;
1057 }
1058
1059 .button__grey.button__shadow {
1060 -webkit-box-shadow: 0 10px 10px rgba(124, 141, 181, 0.2);
1061 box-shadow: 0 10px 10px rgba(124, 141, 181, 0.2);
1062 }
1063
1064 a.button__grey.active, a.button__grey:hover,
1065 button.button__grey.active,
1066 button.button__grey:hover {
1067 background: #6c7fac;
1068 color: white;
1069 border-color: #6c7fac;
1070 }
1071
1072 a.button__grey.active:disabled, a.button__grey:hover:disabled,
1073 button.button__grey.active:disabled,
1074 button.button__grey:hover:disabled {
1075 cursor: not-allowed;
1076 background: #FE504F;
1077 -webkit-box-shadow: none;
1078 box-shadow: none;
1079 }
1080
1081 a.button__grey.hover__highlight:hover .icon,
1082 button.button__grey.hover__highlight:hover .icon {
1083 background: white;
1084 color: #7C8DB5;
1085 }
1086
1087 .button__liteGrey:not(.hover__highlight) {
1088 background: #F5F7FD;
1089 color: #5b4e96;
1090 border-color: #F5F7FD;
1091 -webkit-transition-property: background, color, box-shadow, border;
1092 -webkit-transition-property: background, color, border, -webkit-box-shadow;
1093 transition-property: background, color, border, -webkit-box-shadow;
1094 transition-property: background, color, box-shadow, border;
1095 transition-property: background, color, box-shadow, border, -webkit-box-shadow;
1096 }
1097
1098 .button__liteGrey:not(.hover__highlight):disabled {
1099 cursor: not-allowed;
1100 background: #FE504F;
1101 border-color: #FE504F;
1102 }
1103
1104 .button__liteGrey:not(.hover__highlight) .icon {
1105 color: #F5F7FD;
1106 background: #5b4e96;
1107 }
1108
1109 .button__liteGrey.hover__highlight {
1110 color: #F5F7FD;
1111 border-color: transparent;
1112 background: rgba(245, 247, 253, 0.1);
1113 }
1114
1115 .button__liteGrey.hover__highlight .icon {
1116 background: #00CC76;
1117 color: #ffffff;
1118 }
1119
1120 .button__liteGrey.hover__highlight:hover {
1121 border-color: transparent;
1122 }
1123
1124 .button__liteGrey.button__shadow {
1125 -webkit-box-shadow: 0 10px 10px rgba(245, 247, 253, 0.2);
1126 box-shadow: 0 10px 10px rgba(245, 247, 253, 0.2);
1127 }
1128
1129 a.button__liteGrey.active, a.button__liteGrey:hover,
1130 button.button__liteGrey.active,
1131 button.button__liteGrey:hover {
1132 background: #e0e6f9;
1133 color: #5b4e96;
1134 border-color: #e0e6f9;
1135 }
1136
1137 a.button__liteGrey.active:disabled, a.button__liteGrey:hover:disabled,
1138 button.button__liteGrey.active:disabled,
1139 button.button__liteGrey:hover:disabled {
1140 cursor: not-allowed;
1141 background: #FE504F;
1142 -webkit-box-shadow: none;
1143 box-shadow: none;
1144 }
1145
1146 a.button__liteGrey.hover__highlight:hover .icon,
1147 button.button__liteGrey.hover__highlight:hover .icon {
1148 background: #5b4e96;
1149 color: #F5F7FD;
1150 }
1151
1152 .button__black:not(.hover__highlight) {
1153 background: #000000;
1154 color: white;
1155 border-color: #000000;
1156 -webkit-transition-property: background, color, box-shadow, border;
1157 -webkit-transition-property: background, color, border, -webkit-box-shadow;
1158 transition-property: background, color, border, -webkit-box-shadow;
1159 transition-property: background, color, box-shadow, border;
1160 transition-property: background, color, box-shadow, border, -webkit-box-shadow;
1161 }
1162
1163 .button__black:not(.hover__highlight):disabled {
1164 cursor: not-allowed;
1165 background: #FE504F;
1166 border-color: #FE504F;
1167 }
1168
1169 .button__black:not(.hover__highlight) .icon {
1170 color: #000000;
1171 background: white;
1172 }
1173
1174 .button__black.hover__highlight {
1175 color: #000000;
1176 border-color: transparent;
1177 background: rgba(0, 0, 0, 0.1);
1178 }
1179
1180 .button__black.hover__highlight .icon {
1181 background: #00CC76;
1182 color: #ffffff;
1183 }
1184
1185 .button__black.hover__highlight:hover {
1186 border-color: transparent;
1187 }
1188
1189 .button__black.button__shadow {
1190 -webkit-box-shadow: 0 10px 10px rgba(0, 0, 0, 0.2);
1191 box-shadow: 0 10px 10px rgba(0, 0, 0, 0.2);
1192 }
1193
1194 a.button__black.active:disabled, a.button__black:hover:disabled,
1195 button.button__black.active:disabled,
1196 button.button__black:hover:disabled {
1197 cursor: not-allowed;
1198 background: #FE504F;
1199 -webkit-box-shadow: none;
1200 box-shadow: none;
1201 }
1202
1203 a.button__black.hover__highlight:hover .icon,
1204 button.button__black.hover__highlight:hover .icon {
1205 background: white;
1206 color: #000000;
1207 }
1208
1209 .button__twitter:not(.hover__highlight) {
1210 background: #1da1f2;
1211 color: white;
1212 border-color: #1da1f2;
1213 -webkit-transition-property: background, color, box-shadow, border;
1214 -webkit-transition-property: background, color, border, -webkit-box-shadow;
1215 transition-property: background, color, border, -webkit-box-shadow;
1216 transition-property: background, color, box-shadow, border;
1217 transition-property: background, color, box-shadow, border, -webkit-box-shadow;
1218 }
1219
1220 .button__twitter:not(.hover__highlight):disabled {
1221 cursor: not-allowed;
1222 background: #FE504F;
1223 border-color: #FE504F;
1224 }
1225
1226 .button__twitter:not(.hover__highlight) .icon {
1227 color: #1da1f2;
1228 background: white;
1229 }
1230
1231 .button__twitter.hover__highlight {
1232 color: #1da1f2;
1233 border-color: transparent;
1234 background: rgba(29, 161, 242, 0.1);
1235 }
1236
1237 .button__twitter.hover__highlight .icon {
1238 background: #00CC76;
1239 color: #ffffff;
1240 }
1241
1242 .button__twitter.hover__highlight:hover {
1243 border-color: transparent;
1244 }
1245
1246 .button__twitter.button__shadow {
1247 -webkit-box-shadow: 0 10px 10px rgba(29, 161, 242, 0.2);
1248 box-shadow: 0 10px 10px rgba(29, 161, 242, 0.2);
1249 }
1250
1251 a.button__twitter.active, a.button__twitter:hover,
1252 button.button__twitter.active,
1253 button.button__twitter:hover {
1254 background: #0d95e8;
1255 color: white;
1256 border-color: #0d95e8;
1257 }
1258
1259 a.button__twitter.active:disabled, a.button__twitter:hover:disabled,
1260 button.button__twitter.active:disabled,
1261 button.button__twitter:hover:disabled {
1262 cursor: not-allowed;
1263 background: #FE504F;
1264 -webkit-box-shadow: none;
1265 box-shadow: none;
1266 }
1267
1268 a.button__twitter.hover__highlight:hover .icon,
1269 button.button__twitter.hover__highlight:hover .icon {
1270 background: white;
1271 color: #1da1f2;
1272 }
1273
1274 .button__linkedin:not(.hover__highlight) {
1275 background: #0077b5;
1276 color: white;
1277 border-color: #0077b5;
1278 -webkit-transition-property: background, color, box-shadow, border;
1279 -webkit-transition-property: background, color, border, -webkit-box-shadow;
1280 transition-property: background, color, border, -webkit-box-shadow;
1281 transition-property: background, color, box-shadow, border;
1282 transition-property: background, color, box-shadow, border, -webkit-box-shadow;
1283 }
1284
1285 .button__linkedin:not(.hover__highlight):disabled {
1286 cursor: not-allowed;
1287 background: #FE504F;
1288 border-color: #FE504F;
1289 }
1290
1291 .button__linkedin:not(.hover__highlight) .icon {
1292 color: #0077b5;
1293 background: white;
1294 }
1295
1296 .button__linkedin.hover__highlight {
1297 color: #0077b5;
1298 border-color: transparent;
1299 background: rgba(0, 119, 181, 0.1);
1300 }
1301
1302 .button__linkedin.hover__highlight .icon {
1303 background: #00CC76;
1304 color: #ffffff;
1305 }
1306
1307 .button__linkedin.hover__highlight:hover {
1308 border-color: transparent;
1309 }
1310
1311 .button__linkedin.button__shadow {
1312 -webkit-box-shadow: 0 10px 10px rgba(0, 119, 181, 0.2);
1313 box-shadow: 0 10px 10px rgba(0, 119, 181, 0.2);
1314 }
1315
1316 a.button__linkedin.active, a.button__linkedin:hover,
1317 button.button__linkedin.active,
1318 button.button__linkedin:hover {
1319 background: #00669c;
1320 color: white;
1321 border-color: #00669c;
1322 }
1323
1324 a.button__linkedin.active:disabled, a.button__linkedin:hover:disabled,
1325 button.button__linkedin.active:disabled,
1326 button.button__linkedin:hover:disabled {
1327 cursor: not-allowed;
1328 background: #FE504F;
1329 -webkit-box-shadow: none;
1330 box-shadow: none;
1331 }
1332
1333 a.button__linkedin.hover__highlight:hover .icon,
1334 button.button__linkedin.hover__highlight:hover .icon {
1335 background: white;
1336 color: #0077b5;
1337 }
1338
1339 .button__instagram:not(.hover__highlight) {
1340 background: #e1306c;
1341 color: white;
1342 border-color: #e1306c;
1343 -webkit-transition-property: background, color, box-shadow, border;
1344 -webkit-transition-property: background, color, border, -webkit-box-shadow;
1345 transition-property: background, color, border, -webkit-box-shadow;
1346 transition-property: background, color, box-shadow, border;
1347 transition-property: background, color, box-shadow, border, -webkit-box-shadow;
1348 }
1349
1350 .button__instagram:not(.hover__highlight):disabled {
1351 cursor: not-allowed;
1352 background: #FE504F;
1353 border-color: #FE504F;
1354 }
1355
1356 .button__instagram:not(.hover__highlight) .icon {
1357 color: #e1306c;
1358 background: white;
1359 }
1360
1361 .button__instagram.hover__highlight {
1362 color: #e1306c;
1363 border-color: transparent;
1364 background: rgba(225, 48, 108, 0.1);
1365 }
1366
1367 .button__instagram.hover__highlight .icon {
1368 background: #00CC76;
1369 color: #ffffff;
1370 }
1371
1372 .button__instagram.hover__highlight:hover {
1373 border-color: transparent;
1374 }
1375
1376 .button__instagram.button__shadow {
1377 -webkit-box-shadow: 0 10px 10px rgba(225, 48, 108, 0.2);
1378 box-shadow: 0 10px 10px rgba(225, 48, 108, 0.2);
1379 }
1380
1381 a.button__instagram.active, a.button__instagram:hover,
1382 button.button__instagram.active,
1383 button.button__instagram:hover {
1384 background: #d81f5e;
1385 color: white;
1386 border-color: #d81f5e;
1387 }
1388
1389 a.button__instagram.active:disabled, a.button__instagram:hover:disabled,
1390 button.button__instagram.active:disabled,
1391 button.button__instagram:hover:disabled {
1392 cursor: not-allowed;
1393 background: #FE504F;
1394 -webkit-box-shadow: none;
1395 box-shadow: none;
1396 }
1397
1398 a.button__instagram.hover__highlight:hover .icon,
1399 button.button__instagram.hover__highlight:hover .icon {
1400 background: white;
1401 color: #e1306c;
1402 }
1403
1404 .template__wrapper .button.button-pro-upgrade {
1405 font-weight: 700;
1406 color: #fff;
1407 background-color: #FF7369;
1408 border-color: #FF7369;
1409 }
1410
1411 .template__wrapper .button {
1412 display: inline-flex;
1413 align-items: center;
1414 justify-content: center;
1415 gap: 8px;
1416 text-align: center;
1417 padding: 16px 30px;
1418 line-height: 1;
1419 color: #594E91;
1420 background: rgba(91, 78, 150, 0.1);
1421 border: 1px solid rgba(91, 78, 150, 0.1);
1422 font-size: 16px;
1423 font-weight: 500;
1424 font-family: 'DMSans';
1425 cursor: pointer;
1426 -webkit-transition: all 0.3s ease-in-out 0s;
1427 transition: all 0.3s ease-in-out 0s;
1428 border-radius: 8px;
1429 }
1430
1431 @media (max-width: 767px) {
1432 .template__wrapper .button {
1433 padding: 16px 25px;
1434 }
1435 }
1436
1437 .template__wrapper .button:hover {
1438 background: #5B4E96 !important;
1439 color: #ffffff !important;
1440 border-color: #5B4E96 !important;
1441 }
1442
1443 .template__wrapper .button:focus {
1444 outline: none;
1445 -webkit-box-shadow: none;
1446 box-shadow: none;
1447 border-color: #5B4E96;
1448 background-color: #5B4E96;
1449 color: #ffffff;
1450 }
1451
1452 .template__wrapper .button .ss-icon {
1453 font-size: 14px;
1454 margin-right: 5px;
1455 }
1456
1457 .template__wrapper .button--lg {
1458 padding: 20px 30px;
1459 }
1460
1461 .template__wrapper .button__flex {
1462 display: -webkit-inline-box;
1463 display: -ms-inline-flexbox;
1464 display: inline-flex;
1465 -webkit-box-align: center;
1466 -ms-flex-align: center;
1467 align-items: center;
1468 }
1469
1470 .button__group .button {
1471 margin-right: 13px;
1472 margin-bottom: 15px;
1473 }
1474
1475 .button__group .button:last-child {
1476 margin-right: 0;
1477 }
1478
1479 .template__wrapper .radius-10 {
1480 border-radius: 10px;
1481 }
1482
1483 .template__wrapper .radius-12 {
1484 border-radius: 12px;
1485 }
1486
1487 .template__wrapper .radius-16 {
1488 border-radius: 16px;
1489 }
1490
1491 .template__wrapper .radius-20 {
1492 border-radius: 20px;
1493 }
1494
1495 .template__wrapper .radius-24 {
1496 border-radius: 24px;
1497 }
1498
1499 .template__wrapper .radius-25 {
1500 border-radius: 25px;
1501 }
1502
1503 .template__wrapper .radius-50 {
1504 border-radius: 50px;
1505 }
1506
1507 .template__wrapper {
1508 /* overflow: hidden; */
1509 min-height: 100vh;
1510 -webkit-display: flex;
1511 -moz-display: flex;
1512 -ms-display: flex;
1513 -o-display: flex;
1514 display: -webkit-box;
1515 display: flex;
1516 -moz-flex-direction: column;
1517 -ms-flex-direction: column;
1518 -o-flex-direction: column;
1519 -webkit-box-orient: vertical;
1520 -webkit-box-direction: normal;
1521 flex-direction: column;
1522 }
1523
1524 @media (max-width: 991px) {
1525 .template__wrapper.p30 {
1526 padding: 15px;
1527 }
1528 }
1529
1530 .embedpress__container {
1531 width: 100%;
1532 margin: 0 auto;
1533 max-width: 1700px;
1534 }
1535
1536 .o-hidden {
1537 overflow: hidden;
1538 }
1539
1540 .text-center {
1541 text-align: center;
1542 }
1543
1544 .h-100 {
1545 height: 100%;
1546 }
1547
1548 .embedpress-body {
1549 display: -webkit-box;
1550 display: -ms-flexbox;
1551 display: flex;
1552 }
1553
1554 @media (max-width: 991px) {
1555 .embedpress-body {
1556 display: block;
1557 }
1558 }
1559
1560 /*
1561 .embedpress-body .embedpress-sidebar-wrapper {
1562 display: flex;
1563 flex-direction: column;
1564 }
1565
1566 .embedpress-body .embedpress-sidebar-wrapper .sticky-sibling {
1567 flex-grow: 1;
1568 } */
1569
1570 .embedpress-body .embedpress-sidebar {
1571 -webkit-box-flex: 0;
1572 -ms-flex: 0 0 240px;
1573 flex: 0 0 240px;
1574 min-width: 240px;
1575 margin-right: 24px;
1576 position: sticky;
1577 top: 40px;
1578 max-width: 240px;
1579 overflow: unset;
1580 }
1581
1582 .embedpress-body .embedpress-content {
1583 -webkit-box-flex: 1;
1584 -ms-flex-positive: 1;
1585 flex-grow: 1;
1586 }
1587
1588 .embedpress__row {
1589 display: -ms-grid;
1590 display: grid;
1591 gap: 20px;
1592 }
1593
1594 .embedpress__row.grid__3 {
1595 -ms-grid-columns: 1fr 1fr 1fr;
1596 grid-template-columns: repeat(3, 1fr);
1597 }
1598
1599 @media (max-width: 1199px) {
1600 .embedpress__row.grid__3 {
1601 -ms-grid-columns: 1fr 1fr;
1602 grid-template-columns: repeat(2, 1fr);
1603 }
1604 }
1605
1606 @media (max-width: 575px) {
1607 .embedpress__row.grid__3 {
1608 -ms-grid-columns: 1fr;
1609 grid-template-columns: repeat(1, 1fr);
1610 }
1611 }
1612
1613 .embedpress__row.grid__4 {
1614 -ms-grid-columns: 1fr 1fr 1fr 1fr;
1615 grid-template-columns: repeat(4, 1fr);
1616 }
1617
1618 @media (max-width: 1199px) {
1619 .embedpress__row.grid__4 {
1620 -ms-grid-columns: 1fr 1fr 1fr;
1621 grid-template-columns: repeat(3, 1fr);
1622 }
1623 }
1624
1625 .embedpress__notification {
1626 position: fixed;
1627 bottom: 50px;
1628 right: 50px;
1629 padding: 15px 25px;
1630 border-radius: 10px;
1631 max-width: 400px;
1632 z-index: 9999;
1633 }
1634
1635 .embedpress__notification--success {
1636 background: #00CC76;
1637 }
1638
1639 .embedpress__notification--error {
1640 background-color: #FE504F;
1641 }
1642
1643 .embedpress__notification p {
1644 color: #ffffff;
1645 font-size: 14px;
1646 }
1647
1648 #wpcontent {
1649 padding-left: 0;
1650 }
1651
1652 @media all and (max-width: 782px) {
1653 .auto-fold #wpcontent {
1654 padding-left: 0;
1655 }
1656 }
1657
1658 @media (max-width: 1199px) {
1659 .p50, .p40 {
1660 padding: 25px;
1661 }
1662 }
1663
1664 .embedpress-header {
1665 display: flex;
1666 justify-content: space-between;
1667 align-items: center;
1668 column-gap: 15px;
1669 row-gap: 10px;
1670 background: #fff;
1671 padding: 15px 15px;
1672 margin-bottom: 15px;
1673 border-radius: 16px;
1674 }
1675
1676
1677 @media all and (max-width: 767px) {
1678 .embedpress-header {
1679 flex-direction: column;
1680 align-items: baseline;
1681
1682 }
1683 }
1684
1685 header.embedpress-header img {
1686 width: 150px;
1687 min-width: 150px;
1688 }
1689
1690 header.embedpress-header p {
1691 font-size: 16px;
1692 color: #25396F;
1693 line-height: 1.1;
1694 text-align: center;
1695 }
1696
1697 header.embedpress-header a {
1698 color: #FF7369 !important;
1699 }
1700
1701 a.site__logo {
1702 display: inline-flex;
1703 }
1704
1705 .embedpress-sidebar {
1706 padding: 10px;
1707 background: #ffffff;
1708 border-radius: 16px;
1709 position: relative;
1710 }
1711
1712 .embedpress-version-wrapper li {
1713 font-size: 14px;
1714 font-weight: 600;
1715 color: #7C8DB5;
1716 text-align: right;
1717 line-height: 1.2;
1718 white-space: nowrap;
1719 }
1720
1721 @media all and (max-width: 767px) {
1722 .embedpress-version-wrapper li {
1723 font-size: 14px;
1724 }
1725 }
1726
1727
1728 @media all and (max-width: 575px) {
1729 .embedpress-header {
1730 display: block;
1731 }
1732
1733 .embedpress-header .embedpress-version-wrapper {
1734 margin-top: 10px;
1735 }
1736
1737 .embedpress-version-wrapper li {
1738 text-align: left;
1739 }
1740 }
1741
1742 @media (max-width: 991px) {
1743 .embedpress-sidebar {
1744 padding: 0;
1745 border-radius: 5px;
1746 margin-bottom: 30px;
1747 }
1748 }
1749
1750 .embedpress-sidebar .sidebar__toggler {
1751 display: none;
1752 }
1753
1754 @media (max-width: 991px) {
1755 .embedpress-sidebar .sidebar__toggler {
1756 display: block;
1757 font-size: 24px;
1758 padding: 5px 10px;
1759 text-align: center;
1760 }
1761 }
1762
1763 @media (max-width: 991px) {
1764 .embedpress-sidebar .sidebar__menu {
1765 display: none;
1766 position: absolute;
1767 top: calc(100% + 10px);
1768 z-index: 90;
1769 left: 0;
1770 background: #ffffff;
1771 min-width: 220px;
1772 border-radius: 10px;
1773 padding: 10px;
1774 -webkit-box-shadow: 3px 3px 5px 0px rgba(0, 0, 0, 0.2);
1775 box-shadow: 3px 3px 5px 0px rgba(0, 0, 0, 0.2);
1776 }
1777 }
1778
1779 .embedpress-sidebar .sidebar__menu .sidebar__item:not(:last-child) {
1780 margin-bottom: 10px;
1781 }
1782
1783 .embedpress-sidebar .sidebar__menu .sidebar__item:hover .sidebar__link {
1784 background: #5B4E96;
1785 color: #ffffff;
1786 }
1787
1788 .embedpress-sidebar .sidebar__menu .sidebar__item.show .sidebar__link {
1789 background: #5B4E96;
1790 color: #ffffff;
1791 }
1792
1793 .embedpress-sidebar .sidebar__menu .sidebar__item.show .sidebar__link--toggler:before {
1794 -webkit-transform: rotate(180deg);
1795 transform: rotate(180deg);
1796 }
1797
1798 .embedpress-sidebar .sidebar__menu .sidebar__item .sidebar__link {
1799 padding: 10px 20px;
1800 width: 100%;
1801 font-size: 16px;
1802 font-weight: 500;
1803 color: #25396F;
1804 border-radius: 8px;
1805 position: relative;
1806 }
1807
1808 .embedpress-sidebar .sidebar__menu .sidebar__item .sidebar__link--toggler:before {
1809 content: '\e906';
1810 font-family: icomoon;
1811 position: absolute;
1812 top: 18px;
1813 right: 15px;
1814 font-size: 10px;
1815 -webkit-transition: rotate .3s ease;
1816 transition: rotate .3s ease;
1817 }
1818
1819 .embedpress-sidebar .sidebar__menu .sidebar__item .sidebar__link.active+.dropdown__menu {
1820 display: block;
1821 }
1822
1823 .embedpress-sidebar .sidebar__menu .sidebar__item .sidebar__link span {
1824 display: inline-block;
1825 margin-right: 10px;
1826 width: 20px;
1827 text-align: center;
1828 }
1829
1830 a.sidebar__link.ads-icon span {
1831 display: flex !important;
1832 }
1833
1834 a.sidebar__link.ads-icon {
1835 display: flex;
1836 align-items: center;
1837 }
1838
1839 a.sidebar__link.ads-icon.active span svg path, a.sidebar__link.ads-icon:hover span svg path {
1840 fill: #fff;
1841 }
1842
1843 .embedpress-sidebar .sidebar__menu .sidebar__item .dropdown__menu {
1844 margin-left: 35px;
1845 display: none;
1846 }
1847
1848 .embedpress-sidebar .sidebar__menu .sidebar__item .dropdown__menu .dropdown__item:not(:last-child) {
1849 margin-bottom: 5px;
1850 }
1851
1852 .embedpress-sidebar .sidebar__menu .sidebar__item .dropdown__menu .dropdown__item .dropdown__link {
1853 padding: 5px;
1854 /* display: block; */
1855 font-size: 16px;
1856 font-weight: 400;
1857 color: #7C8DB5;
1858 display: flex;
1859 }
1860
1861 .embedpress-sidebar .sidebar__menu .sidebar__item .dropdown__menu .dropdown__item .dropdown__link img {
1862 max-width: 16px;
1863 margin-right: 7px;
1864 }
1865
1866 .embedpress-sidebar .sidebar__menu .sidebar__item .dropdown__menu .dropdown__item .dropdown__link:hover {
1867 color: #5B4E96;
1868 }
1869
1870 .embedpress-sidebar .sidebar__menu .sidebar__item .dropdown__menu .dropdown__item .dropdown__link.active {
1871 color: #5B4E96;
1872 font-weight: 500;
1873 }
1874
1875 .embedpress-tab .nav__menu ul {
1876 display: -webkit-box;
1877 display: -ms-flexbox;
1878 display: flex;
1879 }
1880
1881 .embedpress-tab .nav__menu ul.menu__grow .nav__item {
1882 -webkit-box-flex: 1;
1883 -ms-flex-positive: 1;
1884 flex-grow: 1;
1885 text-align: center;
1886 }
1887
1888 .embedpress-tab .nav__menu ul.menu__grow .nav__item span {
1889 width: 100%;
1890 }
1891
1892 @media (max-width: 767px) {
1893 .embedpress-tab .nav__menu ul.menu__grow .nav__item span {
1894 padding: 10px;
1895 }
1896 }
1897
1898 @media (max-width: 479px) {
1899 .embedpress-tab .nav__menu ul:not(.menu__grow) {
1900 display: block;
1901 }
1902
1903 .embedpress-tab .nav__menu ul:not(.menu__grow) .nav__item:not(:last-child) {
1904 margin-right: 0;
1905 }
1906
1907 .embedpress-tab .nav__menu ul:not(.menu__grow) .nav__item:first-child span {
1908 border-top-right-radius: 10px;
1909 }
1910
1911 .embedpress-tab .nav__menu ul:not(.menu__grow) .nav__item:last-child span {
1912 border-top-right-radius: 0;
1913 }
1914 }
1915
1916 @media (max-width: 479px) and (max-width: 479px) {
1917 .embedpress-tab .nav__menu ul:not(.menu__grow) .nav__item span {
1918 width: 100%;
1919 }
1920 }
1921
1922 .embedpress-tab .nav__menu ul .nav__item {
1923 margin-bottom: 5px;
1924 font-size: 20px;
1925 font-weight: 400;
1926 color: #5B4E96;
1927 display: -webkit-box;
1928 display: -ms-flexbox;
1929 display: flex;
1930 -webkit-box-pack: center;
1931 -ms-flex-pack: center;
1932 justify-content: center;
1933 -webkit-box-align: center;
1934 -ms-flex-align: center;
1935 align-items: center;
1936 }
1937
1938 @media (max-width: 767px) {
1939 .embedpress-tab .nav__menu ul .nav__item {
1940 font-size: 16px;
1941 }
1942 }
1943
1944 @media (max-width: 575px) {
1945 .embedpress-tab .nav__menu ul .nav__item {
1946 font-size: 14px;
1947 }
1948 }
1949
1950 .embedpress-tab .nav__menu ul .nav__item i {
1951 margin-right: 10px;
1952 }
1953
1954 .embedpress-tab .nav__menu ul .nav__item.active span {
1955 background: #5B4E96;
1956 color: #ffffff;
1957 }
1958
1959 .embedpress-tab .nav__menu ul .nav__item span {
1960 padding: 16px 20px;
1961 cursor: pointer;
1962 background: #ffffff;
1963 }
1964
1965 .embedpress-tab .nav__menu ul .nav__item:not(:last-child) {
1966 margin-right: 5px;
1967 }
1968
1969 .embedpress-tab .nav__menu ul .nav__item:first-child span {
1970 border-top-left-radius: 10px;
1971 }
1972
1973 .embedpress-tab .nav__menu ul .nav__item:last-child span {
1974 border-top-right-radius: 10px;
1975 }
1976
1977 .embedpress-tab .tab__item {
1978 display: none;
1979 border-radius: 20px;
1980 border-top-left-radius: 0;
1981 overflow: hidden;
1982 }
1983
1984 .embedpress-tab .tab__item.active {
1985 display: block;
1986 }
1987
1988 .embedpress__settings {
1989 min-height: 100%;
1990 }
1991
1992 .upgrade__card+.embedpress__settings {
1993 min-height: auto;
1994 }
1995
1996 .embedpress__settings h3 {
1997 font-size: 24px;
1998 font-weight: 700;
1999 color: #131F4D;
2000 padding-bottom: 16px;
2001 margin-bottom: 24px;
2002 border-bottom: 1px solid #F5F7FC;
2003 }
2004
2005 @media (max-width: 767px) {
2006 .embedpress__settings h3 {
2007 font-size: 24px;
2008 }
2009 }
2010
2011 @media (max-width: 575px) {
2012 .embedpress__settings h3 {
2013 font-size: 20px;
2014 }
2015 }
2016
2017 .template__wrapper input:focus,
2018 .template__wrapper select:focus {
2019 border-color: #E6EFFB;
2020 -webkit-box-shadow: none;
2021 box-shadow: none;
2022 outline: none;
2023 }
2024
2025 .template__wrapper .form__control {
2026 height: 40px;
2027 padding: 0 20px;
2028 border-radius: 5px;
2029 border: 1px solid #E6EFFB;
2030 color: #25396F;
2031 width: 100%;
2032 outline: none;
2033 -webkit-box-shadow: none;
2034 box-shadow: none;
2035 }
2036
2037 .template__wrapper .form__control::-webkit-input-placeholder {
2038 color: #7C8DB5;
2039 }
2040
2041 .template__wrapper .form__control:-moz-placeholder {
2042 color: #7C8DB5;
2043 }
2044
2045 .template__wrapper .form__control::-moz-placeholder {
2046 color: #7C8DB5;
2047 }
2048
2049 .template__wrapper .form__control:-ms-input-placeholder {
2050 color: #7C8DB5;
2051 }
2052
2053 .template__wrapper textarea.form__control {
2054 height: 120px;
2055 padding-top: 15px;
2056 }
2057
2058 .template__wrapper .embedpress__select select[disabled] {
2059 background-image: none;
2060 }
2061
2062 .template__wrapper label {
2063 font-size: 16px;
2064 font-weight: 400;
2065 color: #7C8DB5;
2066 margin-bottom: 8px;
2067 }
2068
2069 .embedpress__select {
2070 position: relative;
2071 }
2072
2073 .embedpress__select span {
2074 position: absolute;
2075 top: 12px;
2076 right: 15px;
2077 font-size: 12px;
2078 color: #25396F;
2079 pointer-events: none;
2080 }
2081
2082 .embedpress__select select {
2083 height: 40px;
2084 padding: 0 20px;
2085 border-radius: 5px;
2086 background: #ffffff;
2087 border: 1px solid #E6EFFB;
2088 color: #25396F;
2089 width: 100%;
2090 -webkit-appearance: none;
2091 -moz-appearance: none;
2092 appearance: none;
2093 }
2094
2095 .input__radio {
2096 position: relative;
2097 padding-left: 25px;
2098 }
2099
2100 .input__radio input {
2101 display: none;
2102 }
2103
2104 .input__radio input:checked~span:after {
2105 opacity: 1;
2106 }
2107
2108 .input__radio span {
2109 cursor: pointer;
2110 }
2111
2112 .input__radio span:before {
2113 position: absolute;
2114 top: 5px;
2115 left: 0;
2116 height: 16px;
2117 width: 16px;
2118 border-radius: 50%;
2119 border: 1px solid rgba(91, 78, 150, 0.1);
2120 content: '';
2121 }
2122
2123 .input__radio span:after {
2124 position: absolute;
2125 top: 8px;
2126 left: 3px;
2127 height: 12px;
2128 width: 12px;
2129 border-radius: 50%;
2130 background: #5B4E96;
2131 content: '';
2132 opacity: 0;
2133 }
2134
2135 .template__wrapper .input__switch {
2136 font-size: 0;
2137 cursor: pointer;
2138 }
2139
2140 .template__wrapper .input__switch input {
2141 display: none;
2142 }
2143
2144 .template__wrapper .input__switch input:checked~span {
2145 background: #5B4E96;
2146 }
2147
2148 .template__wrapper .input__switch input:checked~span:before {
2149 left: 15px;
2150 }
2151
2152 .template__wrapper .input__switch span {
2153 height: 17px;
2154 width: 30px;
2155 background: rgba(91, 78, 150, 0.3);
2156 display: inline-block;
2157 border-radius: 15px;
2158 position: relative;
2159 -webkit-transition: all .3s ease;
2160 transition: all .3s ease;
2161 }
2162
2163 .template__wrapper .input__switch span:before {
2164 position: absolute;
2165 top: 2px;
2166 left: 2px;
2167 height: 13px;
2168 width: 13px;
2169 border-radius: 50%;
2170 background: #ffffff;
2171 content: '';
2172 -webkit-transition: all .3s ease;
2173 transition: all .3s ease;
2174 }
2175
2176 .template__wrapper .input__switch.switch__text {
2177 border: 1px solid #E6EFFB;
2178 display: inline-block;
2179 padding: 10px 50px;
2180 border-radius: 5px;
2181 position: relative;
2182 }
2183
2184 .template__wrapper .input__switch.switch__text:before, .template__wrapper .input__switch.switch__text:after {
2185 font-size: 14px;
2186 font-weight: 400;
2187 color: #25396F;
2188 position: absolute;
2189 top: 7px;
2190 }
2191
2192 .template__wrapper .input__switch.switch__text:before {
2193 content: 'OFF';
2194 left: 10px;
2195 }
2196
2197 .template__wrapper .input__switch.switch__text:after {
2198 content: 'ON';
2199 right: 10px;
2200 }
2201
2202 .input__file {
2203 display: block;
2204 border: 1px solid #E6EFFB;
2205 padding: 5px 20px;
2206 border-radius: 5px;
2207 cursor: pointer;
2208 }
2209
2210 .input__file .form__control {
2211 display: none;
2212 }
2213
2214 .form__group {
2215 margin-bottom: 25px;
2216 }
2217
2218 .form__group.mb0 {
2219 margin-bottom: 0;
2220 }
2221
2222 .iframe__size__control__form .form__group {
2223 display: -webkit-box;
2224 display: -ms-flexbox;
2225 display: flex;
2226 -webkit-box-align: center;
2227 -ms-flex-align: center;
2228 align-items: center;
2229 }
2230
2231 @media (max-width: 575px) {
2232 .iframe__size__control__form .form__group {
2233 display: block;
2234 }
2235 }
2236
2237 .iframe__size__control__form .form__group:last-child {
2238 margin-bottom: 0;
2239 }
2240
2241 .iframe__size__control__form .form__group label {
2242 -webkit-box-flex: 0;
2243 -ms-flex: 0 0 240px;
2244 flex: 0 0 240px;
2245 margin-bottom: 0;
2246 }
2247
2248 @media (max-width: 575px) {
2249 .iframe__size__control__form .form__group label {
2250 margin-bottom: 10px;
2251 font-weight: 700;
2252 margin-right: 15px;
2253 }
2254
2255 .iframe__size__control__form .form__group label:after {
2256 content: ':';
2257 }
2258 }
2259
2260 @media (max-width: 479px) {
2261 .iframe__size__control__form .form__group label {
2262 display: block;
2263 }
2264 }
2265
2266 .iframe__size__control__form .form__group .form__control {
2267 width: 80px;
2268 padding: 0 15px;
2269 margin-right: 20px;
2270 }
2271
2272 .iframe__size__control__form .form__group .frame__unit {
2273 font-size: 16px;
2274 font-weight: 400;
2275 color: #7C8DB5;
2276 }
2277
2278 .iframe__size__control__wrap {
2279 -webkit-box-flex: 0;
2280 -ms-flex: 0 0 40%;
2281 flex: 0 0 40%;
2282 }
2283
2284 .iframe__size__control__wrap h3 {
2285 font-size: 30px;
2286 font-weight: 700;
2287 color: #131F4D;
2288 margin-bottom: 25px;
2289 }
2290
2291 @media (max-width: 767px) {
2292 .iframe__size__control__wrap h3 {
2293 font-size: 24px;
2294 }
2295 }
2296
2297 @media (max-width: 575px) {
2298 .iframe__size__control__wrap h3 {
2299 font-size: 20px;
2300 }
2301 }
2302
2303 .embedpress__settings__form .form__group {
2304 display: -webkit-box;
2305 display: -ms-flexbox;
2306 display: flex;
2307 -webkit-box-align: start;
2308 -ms-flex-align: start;
2309 align-items: flex-start;
2310 }
2311
2312 .embedpress__settings__form .form__group .form__label {
2313 -webkit-box-flex: 0;
2314 -ms-flex: 0 0 410px;
2315 flex: 0 0 410px;
2316 font-size: 16px;
2317 font-weight: 400;
2318 color: #7C8DB5;
2319 }
2320
2321 .embedpress__settings__form .form__group .form__label .isPro {
2322 font-size: 10px;
2323 font-weight: 400;
2324 color: #ffffff;
2325 background: #5B4E96;
2326 border-radius: 20px;
2327 padding: 2px 5px;
2328 margin-left: 10px;
2329 text-transform: uppercase;
2330 }
2331
2332 @media (max-width: 1399px) {
2333 .embedpress__settings__form .form__group .form__label {
2334 -webkit-box-flex: 0;
2335 -ms-flex: 0 0 300px;
2336 flex: 0 0 300px;
2337 }
2338 }
2339
2340 @media (max-width: 1199px) {
2341 .embedpress__settings__form .form__group .form__label {
2342 -webkit-box-flex: 0;
2343 -ms-flex: 0 0 250px;
2344 flex: 0 0 250px;
2345 }
2346 }
2347
2348 @media (max-width: 767px) {
2349 .embedpress__settings__form .form__group .form__label {
2350 margin-bottom: 10px;
2351 font-weight: 700;
2352 }
2353
2354 .embedpress__settings__form .form__group .form__label:after {
2355 content: ':';
2356 }
2357 }
2358
2359 .embedpress__settings__form .form__group .form__control__wrap {
2360 -webkit-box-flex: 1;
2361 -ms-flex-positive: 1;
2362 flex-grow: 1;
2363 }
2364
2365 .embedpress__settings__form .form__group .form__control__wrap--flex {
2366 display: -webkit-box;
2367 display: -ms-flexbox;
2368 display: flex;
2369 }
2370
2371 .embedpress__settings__form .form__group .form__control__wrap .input__flex {
2372 display: -webkit-box;
2373 display: -ms-flexbox;
2374 display: flex;
2375 -webkit-box-align: center;
2376 -ms-flex-align: center;
2377 align-items: center;
2378 }
2379
2380 .embedpress__settings__form .form__group .form__control__wrap .input__flex label:not(:last-child) {
2381 margin-right: 20px;
2382 }
2383
2384 .embedpress__settings__form .form__group .form__control__wrap .input__flex .form__control[type="number"] {
2385 width: 80px;
2386 margin-right: 20px;
2387 padding: 0 15px;
2388 }
2389
2390 .embedpress__settings__form .form__group .form__control__wrap .input__flex .frame__unit {
2391 line-height: 1;
2392 }
2393
2394 .embedpress__settings__form .form__group .form__control__wrap .input__file,
2395 .embedpress__settings__form .form__group .form__control__wrap .form__control,
2396 .embedpress__settings__form .form__group .form__control__wrap .embedpress__select {
2397 max-width: 300px;
2398 }
2399
2400 .embedpress__settings__form .form__group .form__control__wrap p {
2401 font-size: 14px;
2402 font-weight: 400;
2403 color: #7C8DB5;
2404 margin-top: 10px;
2405 }
2406
2407 .embedpress__settings__form .form__group .form__control__wrap p.ep-note {
2408 font-size: 12px;
2409 }
2410
2411 .embedpress__settings__form .form__group .form__control__wrap .isPro:not(.embedpress__select) {
2412 opacity: 0.3;
2413 }
2414
2415 .embedpress-genral-settings-page {
2416 display: flex;
2417 }
2418
2419 .embedpress_general_settings__form:not(:last-child), .embedpress__shortcode {
2420 margin-right: 24px;
2421 width: calc(100% - 300px);
2422 }
2423
2424 .embedpress_general_settings__form:last-child {
2425 width: 100%;
2426 }
2427
2428 .embedpress-upgrade-pro-sidebar {
2429 width: 300px;
2430 border-radius: 16px;
2431 background: linear-gradient(192deg, #FFE3E1 4%, #E9E4FF 98.26%);
2432 padding: 8px;
2433 margin-top: -70px;
2434 }
2435
2436 .shortcode-settings-wrapper {
2437 display: flex;
2438
2439 }
2440
2441
2442 @media (min-width: 992px) and (max-width: 1199px) {
2443 .embedpress_general_settings__form:not(:last-child), .embedpress__shortcode {
2444 width: 100%;
2445 margin-right: 0;
2446 }
2447
2448 }
2449
2450 @media (max-width:1024px) {
2451 .shortcode-settings-wrapper, .embedpress_general_settings__form:not(:last-child), .embedpress__shortcode {
2452 width: 100%;
2453 display: block;
2454 }
2455
2456 .embedpress-upgrade-pro-sidebar {
2457 display: none;
2458 }
2459
2460 }
2461
2462 @media (max-width: 767px) {
2463 .embedpress_general_settings__form:not(:last-child) {
2464 width: 100%;
2465 margin-right: 0;
2466 }
2467
2468 }
2469
2470 .embedpress-upgrade-pro-sidebar .gradient-color {
2471 border-radius: 12px;
2472 background: white;
2473 padding: 15px;
2474
2475
2476 }
2477
2478 .embedpress-upgrade-pro-sidebar img.embedpress-banner {
2479 margin-bottom: var(--pro-upgrade-margin-bottom);
2480 width: 100%;
2481 }
2482
2483 .embedpress-upgrade-pro-sidebar h3 {
2484 color: #25396F;
2485 font-family: DMSans;
2486 font-size: 16px;
2487 font-style: normal;
2488 font-weight: 700;
2489 line-height: 120%;
2490 margin-bottom: var(--pro-upgrade-margin-bottom);
2491 }
2492
2493 .embedpress-upgrade-pro-sidebar h3 span {
2494 color: #FF7369;
2495 }
2496
2497 ul.feature-list {
2498 margin-bottom: var(--pro-upgrade-margin-bottom);
2499 }
2500
2501 ul.feature-list li {
2502 display: flex;
2503 align-items: start;
2504 gap: 5px;
2505 margin-bottom: 6px;
2506 color: #25396fde;
2507 font-family: DMSans;
2508 font-size: 14px;
2509 font-style: normal;
2510 font-weight: 500;
2511 line-height: 18px;
2512 }
2513
2514 ul.feature-list img {
2515 margin-top: 0px;
2516 width: 18px;
2517 height: 20px;
2518 }
2519
2520 p.embedpress-tagline {
2521 color: #707070;
2522 font-family: DMSans;
2523 font-size: 12px;
2524 font-style: normal;
2525 font-weight: 400;
2526 line-height: 140%;
2527 text-align: center;
2528 margin-bottom: var(--pro-upgrade-margin-bottom);
2529 }
2530
2531 .pro-upgrade-button {
2532 border-radius: 8px;
2533 background: #FF7369;
2534 padding: 16px 20px;
2535 color: #fff !important;
2536 text-align: center;
2537 font-size: 16px;
2538 font-style: normal;
2539 line-height: 120%;
2540 width: 100%;
2541 display: flex !important;
2542 gap: 5px;
2543 align-items: center;
2544 justify-content: center;
2545 }
2546
2547 .frame__size__wrap {
2548 display: -webkit-box;
2549 display: -ms-flexbox;
2550 display: flex;
2551 }
2552
2553 .template__wrapper .button.ep-settings-form-changed {
2554 background: #f11d1d;
2555 color: #fff;
2556 }
2557
2558 @media (max-width: 1199px) {
2559 .frame__size__wrap {
2560 display: block;
2561 }
2562 }
2563
2564 .form__inline .form-inner-field {
2565 display: -webkit-box;
2566 display: -ms-flexbox;
2567 display: flex;
2568 gap: 15px;
2569 }
2570
2571 .form-inner-field button {
2572 height: 60px;
2573 }
2574
2575 .form__inline .form__group {
2576 margin-bottom: 0;
2577 margin-right: 30px;
2578 }
2579
2580 .logo__adjust__wrap {
2581 margin-top: 20px;
2582 display: none;
2583 }
2584
2585 .form__control__wrap .input__switch .logo__adjust__toggler {
2586 position: absolute;
2587 top: 2px;
2588 left: calc(100% + 15px);
2589 background: #5B4E96;
2590 color: #fff;
2591 border-radius: 5px;
2592 padding: 5px 30px 5px 10px;
2593 font-size: 14px;
2594 opacity: 0;
2595 visibility: hidden;
2596 transition: all .3s ease;
2597 }
2598
2599 .form__control__wrap .input__switch .logo__adjust__toggler i {
2600 font-size: 10px;
2601 margin-left: 8px;
2602 position: absolute;
2603 top: 11px;
2604 right: 10px;
2605 transition: all .3s ease;
2606 transform: rotate(0);
2607 }
2608
2609 .form__control__wrap .input__switch .logo__adjust__toggler.show i {
2610 transform: rotate(-180deg);
2611 }
2612
2613 .form__control__wrap .input__switch input[type="checkbox"]:checked~.logo__adjust__toggler {
2614 opacity: 1;
2615 visibility: visible;
2616 }
2617
2618 .logo__adjust__wrap .logo__upload__wrap {
2619 display: flex;
2620 align-items: center;
2621 }
2622
2623 .logo__adjust__wrap .logo__upload,
2624 .logo__adjust__wrap .logo__upload__preview {
2625 display: inline-block;
2626 width: 100%;
2627 max-width: 255px;
2628 border-radius: 10px;
2629 border: 2px dashed rgba(124, 141, 181, 0.3);
2630 background: #F5F7FD;
2631 padding: 40px 15px;
2632 text-align: center;
2633 position: relative;
2634 margin-bottom: 0;
2635 height: 172px;
2636 }
2637
2638 #valid-license-key-message {
2639 font-weight: 500;
2640 }
2641
2642 div#valid-license-key-message {
2643 margin-top: 10px;
2644 margin-bottom: 30px;
2645 }
2646
2647 span#email-placeholder {
2648 font-weight: 700;
2649 }
2650
2651 .form__inline .hidden, #otp-varify-form.hidden {
2652 display: none !important;
2653 }
2654
2655 .short-description {
2656 margin-top: 10px;
2657 padding: 10px 15px;
2658 background: #f2f2f2;
2659 margin-bottom: 10px;
2660 border-radius: 5px;
2661 }
2662
2663 div#invalid-license-key-message, #invalid-verification-key-message {
2664 padding: 10px;
2665 background: #f2f2f2;
2666 border-radius: 5px;
2667 margin-top: 10px;
2668 }
2669
2670 .short-description a {
2671 color: #5b4e96;
2672 }
2673
2674 div#resend-verification-key-message {
2675 margin-top: 10px;
2676 }
2677
2678 div#resend-verification-key-message a {
2679 color: #5b4e96;
2680 }
2681
2682 .show-toast {
2683 visibility: visible !important;
2684 opacity: 1 !important;
2685 }
2686
2687 div#resend-verification-key-message span {
2688 font-weight: bold;
2689 color: #5b4e96;
2690 cursor: pointer;
2691 }
2692
2693 div#resend-verification-key-message a {
2694 font-weight: 600;
2695 }
2696
2697 .form-inner-field .form__group {
2698 margin-right: 0;
2699 }
2700
2701 @media (max-width: 479px) {
2702 .logo__adjust__wrap .logo__upload {
2703 width: 225px;
2704 }
2705 }
2706
2707 .logo__adjust__wrap .logo__upload .icon {
2708 margin-bottom: 10px;
2709 display: block;
2710 }
2711
2712 .logo__adjust__wrap .logo__upload .icon i {
2713 font-size: 50px;
2714 opacity: .3;
2715 }
2716
2717 .logo__adjust__wrap .logo__upload .text {
2718 display: block;
2719 font-size: 14px;
2720 }
2721
2722 .logo__adjust__wrap .logo__upload input {
2723 opacity: 0;
2724 position: absolute;
2725 top: 0;
2726 left: 0;
2727 height: 100%;
2728 width: 100%;
2729 z-index: 9;
2730 cursor: pointer;
2731 }
2732
2733 .logo__adjust__wrap .logo__upload__preview .instant__preview {
2734 position: absolute;
2735 top: 50%;
2736 left: 50%;
2737 transform: translate(-50%, -50%);
2738 font-size: 0;
2739 }
2740
2741 .logo__adjust__wrap .logo__upload__preview .instant__preview .preview__remove {
2742 position: absolute;
2743 bottom: 100%;
2744 left: 100%;
2745 font-size: 7px;
2746 height: 20px;
2747 width: 20px;
2748 background: #5B4E96;
2749 color: #fff;
2750 line-height: 22px;
2751 border-radius: 50%;
2752 }
2753
2754 .logo__adjust__wrap .logo__adjust {
2755 margin-top: 20px;
2756 display: -webkit-box;
2757 display: -ms-flexbox;
2758 display: flex;
2759 -ms-flex-wrap: wrap;
2760 flex-wrap: wrap;
2761 }
2762
2763 @media (max-width: 1399px) {
2764 .logo__adjust__wrap .logo__adjust {
2765 display: block;
2766 }
2767 }
2768
2769 .logo__adjust__wrap .logo__adjust .logo__adjust__controller {
2770 -webkit-box-flex: 0;
2771 -ms-flex: 0 0 300px;
2772 flex: 0 0 300px;
2773 margin-right: 30px;
2774 }
2775
2776 @media (max-width: 1399px) {
2777 .logo__adjust__wrap .logo__adjust .logo__adjust__controller {
2778 width: 100%;
2779 margin-right: 0;
2780 }
2781 }
2782
2783 @media (max-width: 479px) {
2784 .logo__adjust__wrap .logo__adjust .logo__adjust__controller {
2785 -webkit-box-flex: 0;
2786 -ms-flex: 0 0 225px;
2787 flex: 0 0 225px;
2788 margin-right: 0;
2789 }
2790 }
2791
2792 .logo__adjust__wrap .logo__adjust .logo__adjust__controller .logo__adjust__controller__item:not(:last-child) {
2793 margin-bottom: 25px;
2794 }
2795
2796 .logo__adjust__wrap .logo__adjust .logo__adjust__controller .logo__adjust__controller__item .controller__label {
2797 font-size: 16px;
2798 font-weight: 400;
2799 color: #7C8DB5;
2800 display: inline-block;
2801 }
2802
2803 .logo__adjust__wrap .logo__adjust .logo__adjust__controller .logo__adjust__controller__item .logo__adjust__controller__inputs {
2804 display: -webkit-box;
2805 display: -ms-flexbox;
2806 display: flex;
2807 -webkit-box-align: center;
2808 -ms-flex-align: center;
2809 align-items: center;
2810 }
2811
2812 .logo__adjust__wrap .logo__adjust .logo__adjust__controller .logo__adjust__controller__item .logo__adjust__controller__inputs input[type="range"] {
2813 margin-right: 20px;
2814 width: 200px;
2815 }
2816
2817 @media (max-width: 1199px) {
2818 .logo__adjust__wrap .logo__adjust .logo__adjust__controller .logo__adjust__controller__item .logo__adjust__controller__inputs input[type="range"] {
2819 width: 145px;
2820 }
2821 }
2822
2823 .logo__adjust__wrap .logo__adjust .logo__adjust__controller .logo__adjust__controller__item .logo__adjust__controller__inputs .form__control[type="number"] {
2824 width: 80px;
2825 padding: 0 15px;
2826 }
2827
2828 @media (max-width: 1199px) {
2829 .logo__adjust__wrap .logo__adjust .logo__adjust__controller .logo__adjust__controller__item .logo__adjust__controller__inputs .form__control[type="number"] {
2830 width: 55px;
2831 padding: 0 12px;
2832 }
2833 }
2834
2835 .logo__adjust__wrap .logo__adjust .logo__adjust__preview {
2836 -webkit-box-flex: 0;
2837 -ms-flex: 0 0 500px;
2838 flex: 0 0 500px;
2839 }
2840
2841 @media (max-width: 1399px) {
2842 .logo__adjust__wrap .logo__adjust .logo__adjust__preview {
2843 width: 100%;
2844 max-width: 400px;
2845 margin-top: 20px;
2846 }
2847 }
2848
2849 .logo__adjust__wrap .logo__adjust .logo__adjust__preview .title {
2850 font-size: 16px;
2851 font-weight: 400;
2852 color: #7C8DB5;
2853 display: inline-block;
2854 margin-bottom: 10px;
2855 }
2856
2857 .logo__adjust__wrap .logo__adjust .logo__adjust__preview .preview__box {
2858 position: relative;
2859 min-height: 300px;
2860 }
2861
2862 .logo__adjust__wrap .logo__adjust .logo__adjust__preview .preview__box iframe {
2863 width: 100%;
2864 height: 100%;
2865 min-height: 300px;
2866 }
2867
2868 .logo__adjust__wrap .logo__adjust .logo__adjust__preview .preview__box img {
2869 position: absolute;
2870 bottom: 10%;
2871 right: 6%;
2872 max-height: 40px;
2873 }
2874
2875 .pro__alert__wrap, .tips__alert__wrap {
2876 position: fixed;
2877 top: 0;
2878 left: 0;
2879 height: 100%;
2880 width: 100%;
2881 background: rgb(0, 0, 0, 30%);
2882 z-index: 99999;
2883 display: none;
2884 }
2885
2886 .pro__alert__wrap .pro__alert__card, .tips__alert__wrap .tips__alert__card {
2887 width: calc(100% - 30px);
2888 max-width: 500px;
2889 margin: 7% auto 0;
2890 background: #fff;
2891 border-radius: 20px;
2892 padding: 30px;
2893 display: flex;
2894 flex-direction: column;
2895 align-items: center;
2896 text-align: center;
2897 }
2898
2899 .pro__alert__wrap .pro__alert__card img, .tips__alert__wrap .tips__alert__card img {
2900 height: 100px;
2901 margin-bottom: 20px;
2902 }
2903
2904 .pro__alert__wrap .pro__alert__card h2, .tips__alert__wrap .tips__alert__card h2 {
2905 font-size: 32px;
2906 font-weight: 500;
2907 color: #131F4D;
2908 margin-bottom: 15px;
2909 }
2910
2911 .pro__alert__wrap .pro__alert__card p, .tips__alert__wrap .tips__alert__card p {
2912 font-size: 14px;
2913 font-weight: 400;
2914 color: #7C8DB5;
2915 margin-bottom: 15px;
2916 }
2917
2918 .pro__alert__wrap .pro__alert__card p a, .tips__alert__wrap .tips__alert__card a {
2919 text-decoration: underline;
2920 font-weight: 700;
2921 color: #131F4D;
2922 }
2923
2924 .pro__alert__wrap .pro__alert__card .button, .tips__alert__wrap .tips__alert__card button {
2925 align-self: flex-end;
2926 margin-top: 20px;
2927 padding: 11px 30px;
2928 }
2929
2930 .template__wrapper input[type=range] {
2931 height: 24px;
2932 -webkit-appearance: none;
2933 margin: 10px 0;
2934 width: 100%;
2935 }
2936
2937 .template__wrapper input[type=range]:focus {
2938 outline: none;
2939 }
2940
2941 .template__wrapper input[type=range]::-webkit-slider-runnable-track {
2942 width: 100%;
2943 height: 10px;
2944 cursor: pointer;
2945 animate: 0.2s;
2946 -webkit-box-shadow: 0px 0px 0px #000000;
2947 box-shadow: 0px 0px 0px #000000;
2948 background: #5B4E96;
2949 border-radius: 5px;
2950 border: 2px solid #F5F7FD;
2951 }
2952
2953 .template__wrapper input[type=range]::-webkit-slider-thumb {
2954 -webkit-box-shadow: 0px 0px 0px #000000;
2955 box-shadow: 0px 0px 0px #000000;
2956 border: 2px solid #5B4E96;
2957 height: 16px;
2958 width: 16px;
2959 border-radius: 8px;
2960 background: #FFFFFF;
2961 cursor: pointer;
2962 -webkit-appearance: none;
2963 margin-top: -5px;
2964 }
2965
2966 .template__wrapper input[type=range]:focus::-webkit-slider-runnable-track {
2967 background: #5B4E96;
2968 }
2969
2970 .template__wrapper input[type=range]::-moz-range-track {
2971 width: 100%;
2972 height: 10px;
2973 cursor: pointer;
2974 animate: 0.2s;
2975 box-shadow: 0px 0px 0px #000000;
2976 background: #5B4E96;
2977 border-radius: 5px;
2978 border: 2px solid #F5F7FD;
2979 }
2980
2981 .template__wrapper input[type=range]::-moz-range-thumb {
2982 box-shadow: 0px 0px 0px #000000;
2983 border: 2px solid #5B4E96;
2984 height: 16px;
2985 width: 16px;
2986 border-radius: 8px;
2987 background: #FFFFFF;
2988 cursor: pointer;
2989 }
2990
2991 .template__wrapper input[type=range]::-ms-track {
2992 width: 100%;
2993 height: 10px;
2994 cursor: pointer;
2995 animate: 0.2s;
2996 background: transparent;
2997 border-color: transparent;
2998 color: transparent;
2999 }
3000
3001 .template__wrapper input[type=range]::-ms-fill-lower {
3002 background: #5B4E96;
3003 border: 2px solid #F5F7FD;
3004 border-radius: 10px;
3005 box-shadow: 0px 0px 0px #000000;
3006 }
3007
3008 .template__wrapper input[type=range]::-ms-fill-upper {
3009 background: #5B4E96;
3010 border: 2px solid #F5F7FD;
3011 border-radius: 10px;
3012 box-shadow: 0px 0px 0px #000000;
3013 }
3014
3015 .template__wrapper input[type=range]::-ms-thumb {
3016 margin-top: 1px;
3017 box-shadow: 0px 0px 0px #000000;
3018 border: 2px solid #5B4E96;
3019 height: 16px;
3020 width: 16px;
3021 border-radius: 8px;
3022 background: #FFFFFF;
3023 cursor: pointer;
3024 }
3025
3026 .template__wrapper input[type=range]:focus::-ms-fill-lower {
3027 background: #5B4E96;
3028 }
3029
3030 .template__wrapper input[type=range]:focus::-ms-fill-upper {
3031 background: #5B4E96;
3032 }
3033
3034 .upgrade__card {
3035 display: -webkit-box;
3036 display: -ms-flexbox;
3037 display: flex;
3038 -webkit-box-align: center;
3039 -ms-flex-align: center;
3040 align-items: center;
3041 background: #5B4E96;
3042 border-radius: 25px;
3043 padding: 40px;
3044 }
3045
3046 @media (max-width: 1199px) {
3047 .upgrade__card {
3048 padding: 50px;
3049 }
3050 }
3051
3052 .upgrade__card .icon {
3053 margin-right: 40px;
3054 min-width: 90px;
3055 }
3056
3057 @media (max-width: 767px) {
3058 .upgrade__card .icon {
3059 margin-right: 0;
3060 margin-bottom: 20px;
3061 }
3062 }
3063
3064 .upgrade__card .card__content {
3065 margin-right: 30px;
3066 }
3067
3068 @media (max-width: 767px) {
3069 .upgrade__card .card__content {
3070 margin-bottom: 20px;
3071 margin-right: 0;
3072 }
3073 }
3074
3075 .upgrade__card .card__content h4 {
3076 font-size: 26px;
3077 font-weight: 500;
3078 color: #ffffff;
3079 margin-bottom: 15px;
3080 }
3081
3082 @media (max-width: 767px) {
3083 .upgrade__card .card__content h4 {
3084 font-size: 22px;
3085 }
3086 }
3087
3088 .upgrade__card .card__content p {
3089 font-size: 14px;
3090 font-weight: 400;
3091 color: rgba(255, 255, 255, 0.5);
3092 max-width: 700px;
3093 }
3094
3095 .upgrade__card .button {
3096 margin-left: auto;
3097 min-width: 177px;
3098 text-align: center;
3099 }
3100
3101 @media (max-width: 767px) {
3102 .upgrade__card {
3103 display: block;
3104 padding: 25px;
3105 }
3106 }
3107
3108 .upgrage__card__tab__list {
3109 max-width: 650px;
3110 width: 100%;
3111 display: grid;
3112 -ms-grid-columns: 1fr 1fr;
3113 grid-template-columns: repeat(2, 1fr);
3114 gap: 16px;
3115 margin-bottom: 50px !important;
3116 }
3117
3118 .upgrage__card__tab__list .upgrage__card__tab__list__item {
3119 color: #5B4E96;
3120 font-size: 16px;
3121 font-weight: 500;
3122 line-height: 18px;
3123 display: inline-flex;
3124 align-items: center;
3125 gap: 8px;
3126 }
3127
3128 @media (max-width: 575px) {
3129 .upgrage__card__tab__list {
3130 -ms-grid-columns: 1fr;
3131 grid-template-columns: repeat(1, 1fr);
3132 }
3133 }
3134
3135 .upgrage__card__tab__list .upgrage__card__tab__list__item:before {
3136 content: "\e910";
3137 font-family: 'icomoon';
3138 color: #4AD750;
3139 }
3140
3141 .upgrage__card__tab__style h3 {
3142 font-size: 30px;
3143 font-weight: 700;
3144 color: #131F4D;
3145 margin-bottom: 25px;
3146 }
3147
3148 @media (max-width: 767px) {
3149 .upgrage__card__tab__style h3 {
3150 font-size: 24px;
3151 }
3152 }
3153
3154 @media (max-width: 575px) {
3155 .upgrage__card__tab__style h3 {
3156 font-size: 20px;
3157 }
3158 }
3159
3160 .upgrage__card__tab__style p {
3161 font-size: 14px;
3162 font-weight: 400;
3163 color: #7C8DB5;
3164 margin-bottom: 30px;
3165 max-width: 1320px;
3166 line-height: 1.85;
3167 }
3168
3169 .embedpress-license__details {
3170 display: -ms-grid;
3171 display: grid;
3172 -ms-grid-columns: 3.5fr 2fr;
3173 grid-template-columns: 3.5fr 2fr;
3174 gap: 5px;
3175 }
3176
3177 @media (max-width: 991px) {
3178 .embedpress-license__details {
3179 display: block;
3180 }
3181 }
3182
3183 .embedpress-license__details .license__content {
3184 background: #ffffff;
3185 padding: 40px 100px 50px 50px;
3186
3187 }
3188
3189 @media (max-width: 1199px) {
3190 .embedpress-license__details .license__content {
3191 padding: 30px;
3192 }
3193 }
3194
3195 @media (max-width: 991px) {
3196 .embedpress-license__details .license__content {
3197 margin-bottom: 5px;
3198 }
3199 }
3200
3201 @media (max-width: 767px) {
3202 .embedpress-license__details .license__content {
3203 padding: 40px 30px;
3204 }
3205 }
3206
3207 @media (max-width: 575px) {
3208 .embedpress-license__details .license__content .form__inline {
3209 display: block;
3210 }
3211
3212 .embedpress-license__details .license__content .form__inline .form__group {
3213 margin-bottom: 25px;
3214 margin-right: 0;
3215 }
3216 }
3217
3218 .embedpress-license__details .license__content .thumb__area {
3219 /* max-width: 350px; */
3220 /* text-align: center; */
3221 margin-bottom: 30px;
3222 }
3223
3224 .embedpress-license__details .license__content .thumb__area img {
3225 max-width: 320px;
3226 }
3227
3228 .embedpress-license__details .license__content .thumb__area h2 {
3229 font-size: 30px;
3230 font-weight: 400;
3231 color: #25396F;
3232 margin-top: 10px;
3233 }
3234
3235 @media (max-width: 767px) {
3236 .embedpress-license__details .license__content .thumb__area h2 {
3237 font-size: 24px;
3238 }
3239 }
3240
3241 .embedpress-license__details .license__content p {
3242 font-size: 16px;
3243 font-weight: 400;
3244 color: #25396F;
3245 margin-bottom: 30px;
3246 }
3247
3248 @media (max-width: 767px) {
3249 .embedpress-license__details .license__content p {
3250 font-size: 16px;
3251 }
3252 }
3253
3254 .embedpress-license__details .license__content p a {
3255 color: #5B4E96;
3256 text-decoration: underline;
3257 }
3258
3259 .embedpress-license__details .license__content ol {
3260 list-style: decimal;
3261 padding-left: 19px;
3262 margin-bottom: 50px;
3263 }
3264
3265 .embedpress-license__details .license__content ol li {
3266 font-size: 18px;
3267 font-weight: 400;
3268 color: #25396F;
3269 }
3270
3271 .embedpress-license__details .license__content ol li:not(:last-child) {
3272 margin-bottom: 15px;
3273 }
3274
3275 @media (max-width: 767px) {
3276 .embedpress-license__details .license__content ol li {
3277 font-size: 16px;
3278 }
3279 }
3280
3281 .embedpress-license__details .license__content ol li a {
3282 color: #5B4E96;
3283 text-decoration: underline;
3284 }
3285
3286 .embedpress-license__details .license__content .form__group {
3287 -webkit-box-flex: 1;
3288 -ms-flex-positive: 1;
3289 flex-grow: 1;
3290 position: relative;
3291 }
3292
3293
3294
3295 .embedpress-license__details .license__content .form__group .input__icon {
3296 position: absolute;
3297 top: 20px;
3298 left: 20px;
3299 color: #7C8DB5;
3300 pointer-events: none;
3301 width: 20px;
3302 }
3303
3304 .embedpress-license__details .license__content .form__group .input__icon i {
3305 font-size: 20px;
3306 }
3307
3308 @media (max-width: 767px) {
3309 .embedpress-license__details .license__content .form__group .input__icon {
3310 top: 15px;
3311 left: 15px;
3312 }
3313
3314 .embedpress-license__details .license__content .form__group .input__icon i {
3315 font-size: 16px;
3316 }
3317 }
3318
3319 .embedpress-license__details .license__content .form__group .form__control {
3320 height: 60px;
3321 background: #F5F7FD;
3322 color: #7C8DB5;
3323 font-size: 20px;
3324 padding-left: 50px;
3325 }
3326
3327 input#embedpress-pro-license-key::placeholder {
3328 font-size: 18px;
3329 }
3330
3331 .embedpress-license__details .license__content .form__group .form__control::-webkit-input-placeholder {
3332 color: #7C8DB5;
3333 }
3334
3335 .embedpress-license__details .license__content .form__group .form__control:-moz-placeholder {
3336 color: #7C8DB5;
3337 }
3338
3339 .embedpress-license__details .license__content .form__group .form__control::-moz-placeholder {
3340 color: #7C8DB5;
3341 }
3342
3343 .embedpress-license__details .license__content .form__group .form__control:-ms-input-placeholder {
3344 color: #7C8DB5;
3345 }
3346
3347 @media (max-width: 1399px) {
3348 .embedpress-license__details .license__content .form__group .form__control {
3349 font-size: 16px;
3350 }
3351 }
3352
3353 @media (max-width: 767px) {
3354 .embedpress-license__details .license__content .form__group .form__control {
3355 height: 50px;
3356 padding-left: 35px;
3357 font-size: 14px;
3358 }
3359
3360 .form-inner-field button {
3361 height: 60px;
3362 }
3363
3364 }
3365
3366 .embedpress-license__details .license__manage {
3367 background: #ffffff;
3368 padding: 30px;
3369 display: -webkit-box;
3370 display: -ms-flexbox;
3371 display: flex;
3372 -webkit-box-pack: center;
3373 -ms-flex-pack: center;
3374 justify-content: center;
3375 -webkit-box-align: center;
3376 -ms-flex-align: center;
3377 align-items: center;
3378 -webkit-box-orient: vertical;
3379 -webkit-box-direction: normal;
3380 -ms-flex-direction: column;
3381 flex-direction: column;
3382 }
3383
3384 .embedpress-license__details .license__manage .button {
3385 margin-top: 30px;
3386 }
3387
3388 .embedpress-card {
3389 background: #F5F7FD;
3390 border-radius: 16px;
3391 padding: 24px;
3392 padding-left: 100px;
3393 border: 2px solid rgba(91, 78, 150, 0.1);
3394 position: relative;
3395 }
3396
3397 @media (min-width: 1199px) and (max-width: 1399px) {
3398 .embedpress-card {
3399 padding-left: 24px;
3400 }
3401 }
3402
3403 @media (max-width: 767px) {
3404 .embedpress-card {
3405 padding-left: 20px;
3406 padding: 20px;
3407 }
3408 }
3409
3410 .embedpress-card .icon {
3411 position: absolute;
3412 top: 30px;
3413 left: 30px;
3414 height: 50px;
3415 width: 50px;
3416 border-radius: 10px;
3417 background: #5B4E96;
3418 text-align: center;
3419 }
3420
3421 @media (min-width: 1199px) and (max-width: 1399px) {
3422 .embedpress-card .icon {
3423 position: static;
3424 margin-bottom: 20px;
3425 }
3426 }
3427
3428 @media (max-width: 767px) {
3429 .embedpress-card .icon {
3430 position: static;
3431 margin-bottom: 20px;
3432 }
3433 }
3434
3435 .embedpress-card .icon i {
3436 color: #ffffff;
3437 font-size: 20px;
3438 line-height: 50px;
3439 }
3440
3441 .embedpress-card h3 {
3442 font-size: 26px;
3443 font-weight: 500;
3444 color: #131F4D;
3445 margin-bottom: 10px;
3446 }
3447
3448 @media (max-width: 767px) {
3449 .embedpress-card h3 {
3450 font-size: 22px;
3451 }
3452 }
3453
3454 .embedpress-card p {
3455 font-size: 14px;
3456 font-weight: 400;
3457 color: #7C8DB5;
3458 margin-bottom: 20px;
3459 }
3460
3461 .element__item {
3462 background: #F5F7FD;
3463 border-radius: 10px;
3464 min-height: 80px;
3465 padding: 10px 24px;
3466 border: 2px solid rgba(91, 78, 150, 0.1);
3467 display: -webkit-box;
3468 display: -ms-flexbox;
3469 display: flex;
3470 -webkit-box-align: center;
3471 -ms-flex-align: center;
3472 align-items: center;
3473 /* overflow: hidden; */
3474 }
3475
3476 @media (max-width: 767px) {
3477 .element__item {
3478 padding: 20px;
3479 padding-right: 15px;
3480 }
3481 }
3482
3483 .element__item.isPro .pro__item {
3484 /* display: block; */
3485 }
3486
3487 .element__item h5 {
3488 font-size: 18px;
3489 font-weight: 700;
3490 color: #25396F;
3491 margin-right: 15px;
3492 }
3493
3494 @media (max-width: 767px) {
3495 .element__item h5 {
3496 font-size: 16px;
3497 }
3498 }
3499
3500 .element__item .has__question {
3501 color: rgba(124, 141, 181, 0.5);
3502 line-height: 1;
3503 margin-top: 2px;
3504 margin-right: 10px;
3505 position: relative;
3506 }
3507
3508 .element__item .has__question .element__tooltip {
3509 position: absolute;
3510 bottom: calc(100% + 12px);
3511 left: -20px;
3512 /* transform: translateX(-50%); */
3513 background: #5B4E96;
3514 color: #fff;
3515 padding: 20px;
3516 min-width: 200px;
3517 border-radius: 5px;
3518 font-size: 16px;
3519 transition: all .3s ease;
3520 opacity: 0;
3521 visibility: hidden;
3522 z-index: 9;
3523 }
3524
3525 .element__item .has__question:hover .element__tooltip {
3526 visibility: visible;
3527 opacity: 1;
3528 }
3529
3530 .element__item .has__question .element__tooltip:before {
3531 position: absolute;
3532 top: 100%;
3533 left: 18px;
3534 /* transform: translateX(-50%); */
3535 border-left: 10px solid transparent;
3536 border-right: 10px solid transparent;
3537 border-top: 10px solid #5B4E96;
3538 content: '';
3539 }
3540
3541 .element__item .input__switch {
3542 margin-left: auto;
3543 margin-bottom: 0;
3544 }
3545
3546 .element__item .pro__item {
3547 position: absolute;
3548 top: 5px;
3549 left: -16px;
3550 -webkit-transform: rotate(-45deg);
3551 transform: rotate(-45deg);
3552 font-size: 12px;
3553 font-weight: 400;
3554 color: #ffffff;
3555 background: #5B4E96;
3556 padding: 0 20px;
3557 text-transform: uppercase;
3558 display: none;
3559 }
3560
3561 @media (max-width: 767px) {
3562 .element__item .pro__item {
3563 font-size: 9px;
3564 }
3565 }
3566
3567 .embedpress--elements__wrap h3 {
3568 font-size: 24px;
3569 font-weight: 700;
3570 color: #131F4D;
3571 padding-bottom: 16px;
3572 margin-bottom: 24px;
3573 border-bottom: 1px solid #F5F7FC;
3574 }
3575
3576 @media (max-width: 767px) {
3577 .embedpress--elements__wrap h3 {
3578 font-size: 24px;
3579 }
3580 }
3581
3582 @media (max-width: 575px) {
3583 .embedpress--elements__wrap h3 {
3584 font-size: 20px;
3585 }
3586 }
3587
3588 @media (max-width: 991px) {
3589 .embedpress--elements__wrap .embedpress__row.grid__4 {
3590 -ms-grid-columns: 1fr 1fr;
3591 grid-template-columns: repeat(2, 1fr);
3592 }
3593 }
3594
3595 @media (max-width: 575px) {
3596 .embedpress--elements__wrap .embedpress__row.grid__4 {
3597 -ms-grid-columns: 1fr;
3598 grid-template-columns: repeat(1, 1fr);
3599 }
3600 }
3601
3602 .valid-license-icon {
3603 max-width: 100%;
3604 width: 1.5rem;
3605 }
3606
3607
3608
3609 .embedpress-toast__message {
3610 position: fixed;
3611 bottom: 50px;
3612 right: 50px;
3613 padding: 15px 25px;
3614 border-radius: 10px;
3615 max-width: 400px;
3616 z-index: 9999;
3617 display: flex;
3618 align-items: center;
3619 opacity: 0;
3620 visibility: hidden;
3621 transition: all .3s ease;
3622 }
3623
3624 .embedpress-toast__message.show {
3625 opacity: 1;
3626 visibility: visible;
3627 }
3628
3629 .embedpress-toast__message.toast__message--error {
3630 background: #FE504F;
3631 }
3632
3633 .embedpress-toast__message.toast__message--attention {
3634 background: #FFA53C
3635 }
3636
3637 .embedpress-toast__message.toast__message--success {
3638 background: #00CC76;
3639 }
3640
3641 .embedpress-toast__message img {
3642 height: 40px;
3643 margin-right: 20px;
3644 }
3645
3646 .embedpress-toast__message p {
3647 color: #ffffff;
3648 font-size: 14px;
3649 }
3650
3651 .template__wrapper .wp-color-result-text {
3652 padding: 0 5px;
3653 }
3654
3655 @media all and (max-width: 1600px) {
3656 .embedpress-license__details .license__content .form__inline {
3657 display: block;
3658 }
3659
3660 .embedpress-license__details .license__content .form__group {
3661 margin-bottom: 25px;
3662 margin-right: 0;
3663 }
3664
3665 .embedpress-license__details .license__content .form__group .form__control {
3666 height: 60px;
3667 font-size: 14px;
3668 }
3669
3670 .embedpress-license__details .license__content .form__group .input__icon {
3671 width: 18px;
3672 top: 16px;
3673 }
3674 }
3675
3676 .ep-coming-soon {
3677 color: #5b4e96;
3678 font-size: 12px;
3679 font-weight: 900;
3680 }
3681
3682 .embedpress-card a, .template__wrapper .ep-link {
3683 color: #5b4e96;
3684 }
3685
3686 .template__wrapper .ep-link {
3687 font-weight: 600;
3688 }
3689
3690 .proOverlay {
3691 opacity: .3;
3692 position: relative;
3693 }
3694
3695 .proOverlay::after {
3696 position: absolute;
3697 top: 0;
3698 left: 0;
3699 bottom: 0;
3700 content: '';
3701 width: 100%;
3702 height: 100%;
3703 display: block;
3704 }
3705
3706 .embedpress__shortcode .shortcode__text {
3707 margin-bottom: 40px;
3708 font-size: 16px;
3709 line-height: 1.6;
3710 color: #25396F;
3711 }
3712
3713 .embedpress__shortcode .shortcode__form {
3714 width: 100%;
3715 max-width: 750px;
3716 box-sizing: border-box;
3717 background-color: #F5F7FC;
3718 border: 1px solid #D7DEEE;
3719 border-radius: 8px;
3720 padding: 12px;
3721 display: flex;
3722 }
3723
3724 .embedpress__shortcode .shortcode__form .form__group {
3725 flex-grow: 1;
3726 }
3727
3728 .embedpress__shortcode .shortcode__form .form__group .form__control {
3729 height: 50px;
3730 background-color: transparent;
3731 border: none;
3732 }
3733
3734 .embedpress__shortcode .shortcode__form .button__redColor {
3735 background-color: #FF7369;
3736 border-color: #FF7369;
3737 color: #fff;
3738 }
3739
3740 .embedpress__shortcode .shortcode__form .copy__button {
3741 background-color: #5B4E96;
3742 border-color: #5B4E96;
3743 color: #fff;
3744 }
3745
3746
3747 /* source page css */
3748 .source-settings-page {
3749 background: #fff;
3750 padding: 24px;
3751 border-radius: 16px;
3752 }
3753
3754 .source-settings-page.page-premium {
3755 padding: 24px 0;
3756 }
3757
3758 .source-settings-page.page-premium .page-premium-text {
3759 margin-bottom: 20px;
3760 font-size: 16px;
3761 line-height: 1.6;
3762 color: #25396F;
3763 max-width: 80%;
3764 }
3765
3766 h1.page-heading {
3767 color: #25396F;
3768 font-family: 'DMSans';
3769 font-size: 24px;
3770 font-style: normal;
3771 font-weight: 600;
3772 line-height: 120%;
3773 padding-bottom: 16px;
3774 border-bottom: 1px solid #F5F7FC;
3775 }
3776
3777 .upgrage__card__tab__style h3 {
3778 color: #25396F;
3779 font-family: 'DMSans';
3780 font-size: 20px;
3781 font-style: normal;
3782 font-weight: 600;
3783 line-height: 1;
3784 /* 24px */
3785 }
3786
3787 .upgrage__card__tab__style p {
3788 color: #707070;
3789 font-family: 'DMSans';
3790 font-size: 16px;
3791 font-style: normal;
3792 font-weight: 400;
3793 line-height: 160%;
3794 /* 25.6px */
3795 }
3796
3797 a.button.button__themeColor {
3798 border-radius: 8px;
3799 background: #EEEDF4;
3800 border: none;
3801 }
3802
3803 ul.source-tab {
3804 margin-top: 10px;
3805 width: 100%;
3806 padding-right: 15px;
3807 padding-left: 15px;
3808 margin-top: 10px;
3809 max-height: 185px;
3810 overflow-y: scroll;
3811 }
3812
3813 ul.source-tab::-webkit-scrollbar {
3814 width: 5px;
3815 }
3816
3817 ul.source-tab::-webkit-scrollbar-track {
3818 background: #f5f7fd;
3819 border-radius: 5px;
3820 }
3821
3822 ul.source-tab::-webkit-scrollbar-thumb {
3823 background: #988FBD;
3824 border-radius: 5px;
3825 }
3826
3827 li.tab-button {
3828 display: inline-flex;
3829 align-items: center;
3830 gap: 5px;
3831 background-color: transparent;
3832 padding: 8px 15px;
3833 border-radius: 15px;
3834 cursor: pointer;
3835 width: 100%;
3836 font-size: 14px;
3837 margin-bottom: 2px;
3838 }
3839
3840 li.tab-button:hover {
3841 background: #f5f7fd;
3842 }
3843
3844 li.tab-button.active {
3845 background: #f5f7fd;
3846 }
3847
3848 img.source-image {
3849 width: 14px;
3850 height: 14px;
3851 }
3852
3853 .tab-content-section {
3854 display: grid;
3855 -ms-grid-columns: 1fr 1fr 1fr;
3856 grid-template-columns: repeat(3, 1fr);
3857 /* Three items per row */
3858 gap: 30px;
3859 /* Adjust the gap between items as needed */
3860 }
3861
3862 @media (max-width: 1199px) {
3863 .tab-content-section {
3864 -ms-grid-columns: 1fr 1fr;
3865 grid-template-columns: repeat(2, 1fr);
3866 }
3867 }
3868
3869 .source-item {
3870 padding: 15px;
3871 text-align: center;
3872 display: flex;
3873 align-items: center;
3874 justify-content: space-between;
3875 background: #f5f7fd;
3876 border-radius: 8px;
3877 position: relative;
3878 }
3879
3880 .tab-button-section {
3881 display: none;
3882 }
3883
3884 li.sidebar__item.show .tab-button-section {
3885 display: block;
3886 }
3887
3888 .source-item div {
3889 display: flex;
3890 align-items: center;
3891 gap: 5px;
3892 color: #404040;
3893 font-family: 'DMSans';
3894 font-size: 14px;
3895 font-style: normal;
3896 font-weight: 600;
3897 line-height: 120%;
3898 /* 16.8px */
3899 letter-spacing: -0.28px;
3900 }
3901
3902 .ribbon-container {
3903 position: absolute;
3904 top: -12px;
3905 left: 45px;
3906 background: #524cff;
3907 padding: 5px;
3908 border-radius: 4px;
3909 height: 22px;
3910 display: flex;
3911 align-items: center;
3912 justify-content: center;
3913 color: #fff!important;
3914 font-size: 12px!important;
3915 text-transform: capitalize;
3916 }
3917 .ribbon-container.new {
3918 background-color: #059862;
3919 }
3920 .ribbon-container.popular {
3921 background-color: #0064FF;
3922 }
3923 .ribbon-container.updated {
3924 background-color: #6C757D;
3925 border: none;
3926 }
3927
3928 .source-left .icon {
3929 width: 32px;
3930 height: 32px;
3931 background: #fff;
3932 border-radius: 5px;
3933 display: flex;
3934 align-items: center;
3935 justify-content: center;
3936 }
3937
3938 .source-left .icon img {
3939 width: 16px;
3940 height: auto;
3941 }
3942
3943 .source-right a {
3944 width: 28px;
3945 height: 28px;
3946 background: #fff;
3947 border-radius: 5px;
3948 display: flex;
3949 align-items: center;
3950 justify-content: center;
3951 }
3952
3953 .source-right a svg g {
3954 transition: 0.2s;
3955
3956 }
3957
3958 .source-right a svg {
3959 width: 18px;
3960 height: 18px;
3961 }
3962
3963 .source-right a:hover svg g {
3964 stroke: #5B4E96;
3965 }
3966
3967 .premium-button {
3968 text-align: center;
3969 display: flex;
3970 align-items: center;
3971 justify-content: center;
3972 width: 100%;
3973 margin-top: 20px;
3974 }
3975
3976 .premium-button a {
3977 display: flex !important;
3978 align-items: center;
3979 gap: 8px;
3980 background: #EEEDF4;
3981 padding: 10px 25px;
3982 border-radius: 8px;
3983 width: 100%;
3984 justify-content: center;
3985 }
3986
3987 .premium-button span {
3988 display: flex;
3989 align-items: center;
3990 justify-content: center;
3991 }
3992
3993 .premium-button svg {
3994 width: 18px;
3995 height: 18px;
3996 }
3997
3998
3999 @media only screen and (max-width: 991px) {
4000 .tab-content-section {
4001 -ms-grid-columns: 1fr 1fr;
4002 grid-template-columns: repeat(2, 1fr);
4003 }
4004 }
4005
4006 /* Instagram setting css */
4007 /* Reset default table styles */
4008 table {
4009 border-collapse: collapse;
4010 width: 100%;
4011 }
4012
4013 table, th, td {
4014 border: 1px solid #ccc;
4015 }
4016
4017 /* Apply custom styles for the 'emebedpress' class */
4018 .emebedpress {
4019 border-collapse: collapse;
4020 width: 100%;
4021 }
4022
4023 .emebedpress thead {
4024 background-color: #F5F7FD;
4025 }
4026
4027 .emebedpress th, .emebedpress td {
4028 padding: 12px;
4029 text-align: left;
4030 position: relative;
4031 text-align: center;
4032 }
4033
4034 table.emebedpress th {
4035 white-space: nowrap;
4036 width: 150px;
4037 font-weight: bold;
4038
4039 }
4040
4041 .emebedpress tbody tr:nth-child(even) {
4042 background-color: #f9f9f9;
4043 }
4044
4045 .emebedpress img.user-avatar {
4046 width: 50px;
4047 height: 50px;
4048 border-radius: 50%;
4049 object-fit: cover;
4050 }
4051
4052 .emebedpress input[type="text"] {
4053 width: 60%;
4054 box-sizing: border-box;
4055 border: none;
4056 background-color: transparent;
4057 margin: 0;
4058 padding: 0;
4059 }
4060
4061 .emebedpress .button {
4062 background-color: #0073aa;
4063 color: #fff;
4064 border: none;
4065 padding: 6px;
4066 cursor: pointer;
4067 border-radius: 4px;
4068 }
4069
4070 .emebedpress .button i {
4071 font-size: 18px;
4072
4073 }
4074
4075 .emebedpress .button-primary {
4076 background-color: #5b4e96;
4077 position: absolute;
4078 right: 20px;
4079 align-items: center;
4080 justify-content: center;
4081 }
4082
4083 .emebedpress .button-secondary {
4084 background-color: #f44336 !important;
4085 }
4086
4087 .emebedpress .button-secondary:focus i {
4088 color: white;
4089 }
4090
4091 /* Styles for the account-section */
4092 /* .account-wrap {
4093 max-width: 1200px;
4094 margin: 0 auto;
4095 } */
4096
4097 .user-image {
4098 display: flex;
4099 align-items: center;
4100 justify-content: center;
4101 width: 50px;
4102 }
4103 td.instagram-user-account .username {
4104 text-align: left;
4105 font-size: 16px;
4106 line-height: 1.4rem;
4107 }
4108 td.instagram-user-account .userid {
4109 text-align: left;
4110 font-size: 13px;
4111 line-height: 1.4rem;
4112
4113 }
4114
4115 .account-section p {
4116 margin-bottom: 10px;
4117 }
4118
4119 .account-button {
4120 text-decoration: none !important;
4121 background-color: #0073aa !important;
4122 color: #fff !important;
4123 border: none;
4124 padding: 10px 15px;
4125 border-radius: 4px;
4126 margin-right: 10px;
4127 display: inline-flex !important;
4128 align-items: center;
4129 gap: 5px;
4130 font-size: 14px;
4131 cursor: pointer;
4132 margin-bottom: 15px;
4133 }
4134
4135 .account-button svg {
4136 fill: currentColor;
4137 width: 20px;
4138 height: 20px;
4139 }
4140
4141 .personal-account {
4142 background-color: #4caf50;
4143 }
4144
4145 .business-account {
4146 background-color: #f44336;
4147 }
4148
4149 .account-link {
4150 margin-left: 10px;
4151 color: #0073aa;
4152 text-decoration: none;
4153 }
4154
4155 .premium-field {
4156 display: inline-block;
4157 margin-left: 10px;
4158 color: #999;
4159 }
4160
4161 .premium-field small {
4162 font-size: 12px;
4163 }
4164
4165 .description.hidden {
4166 display: none;
4167 }
4168
4169 /* delete alrert box */
4170 .custom-dialog {
4171 position: fixed;
4172 top: 50%;
4173 left: 50%;
4174 transform: translate(-50%, -50%);
4175 background-color: #fff;
4176 padding: 20px;
4177 box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
4178 z-index: 9999;
4179 }
4180
4181 .custom-dialog p {
4182 margin: 0 0 10px;
4183 }
4184
4185 .custom-dialog button {
4186 margin-right: 10px;
4187 padding: 5px 10px;
4188 background-color: #007bff;
4189 color: #fff;
4190 border: none;
4191 cursor: pointer;
4192 }
4193
4194 .custom-dialog button:hover {
4195 background-color: #0056b3;
4196 }
4197
4198 .custom-dialog button:last-child {
4199 margin-right: 0;
4200 background-color: #ccc;
4201 }
4202
4203 /* Optional: To make the buttons the same width */
4204 .custom-dialog button {
4205 width: 80px;
4206 }
4207
4208 .premium-button {
4209 margin-top: 0px !important;
4210 padding: 0 4px 0 0;
4211 }
4212
4213
4214 @media only screen and (max-width: 767px) {
4215 .tab-content-section {
4216 -ms-grid-columns: 1fr;
4217 grid-template-columns: repeat(1, 1fr);
4218 }
4219
4220 header.embedpress-header p {
4221 margin: 10px 0;
4222 text-align: left;
4223 }
4224 }
4225
4226
4227 /* // Calendly settings page design */
4228 .calendly-embedpress-authorize-button {
4229 display: flex;
4230 justify-content: space-between;
4231 margin-bottom: 15px;
4232 }
4233
4234 .calendly-settings-title {
4235 margin-bottom: 30px !important;
4236 }
4237
4238 a.calendly-connect-button {
4239 display: inline-flex;
4240 align-items: center;
4241 font-size: 15px;
4242 color: rgb(54, 100, 174);
4243 gap: 6px;
4244 border-width: 1px;
4245 border-style: solid;
4246 border-color: rgb(54, 100, 174);
4247 border-image: initial;
4248 padding: 8px 20px;
4249 border-radius: 10px;
4250 }
4251
4252 a.calendly-connect-button:hover {
4253 color: #fff;
4254 background: rgb(54, 100, 174);
4255 }
4256
4257 a.calendly-connected {
4258 /* pointer-events: none !important; */
4259 background: rgba(54, 100, 174, 0.08);
4260 border-width: 1px;
4261 border-style: solid;
4262 border-color: rgba(54, 100, 174, 0.08);
4263 border-image: initial;
4264 }
4265
4266 a.calendly-connect-button img {
4267 width: 20px;
4268 }
4269
4270
4271 /* Apply styles to the event-type-list container */
4272 .event-type-list {
4273 font-family: Arial, sans-serif;
4274 }
4275
4276 /* Apply styles to the list-header */
4277 .list-header {
4278 background-color: #3664ae;
4279 color: #fff;
4280 padding: 10px;
4281 display: flex;
4282 align-items: center;
4283 gap: 10px;
4284 border-radius: 10px;
4285 }
4286
4287
4288 /* Apply styles to the user's avatar */
4289 .calendly-user .bqa3nmp img {
4290 width: 50px;
4291 height: 50px;
4292 border-radius: 50%;
4293 margin-right: 10px;
4294 }
4295
4296 /* Apply styles to the user's name */
4297 .calendly-user .name p {
4298 font-weight: bold;
4299 font-size: 18px;
4300 }
4301
4302
4303 /* Apply styles to the event-type-card */
4304 .event-type-card-list {
4305 display: grid;
4306 grid-template-columns: repeat(3, 1fr);
4307 gap: 20px;
4308 margin-top: 15px;
4309 }
4310
4311 .calendly-data-placeholder .event-type-card-list {
4312 padding: 0 20px 20px;
4313 }
4314
4315 .event-type-card-list-item {
4316 background-color: #ffffff;
4317 border: 1px solid #faf4f4;
4318 border-radius: 5px;
4319 border-top: 6px solid var(--calendly-event-color);
4320 }
4321
4322 .event-type-card {
4323 padding: 10px;
4324 }
4325
4326 .calendly-profile-avatar {
4327 width: 50px;
4328 height: 50px;
4329 }
4330
4331 .calendly-profile-avatar img {
4332 border-radius: 50px;
4333 }
4334
4335 .event-type-card-top {
4336 border-bottom: 1px solid #ebe1e1;
4337 padding-bottom: 10px;
4338 }
4339
4340 .event-type-card-top h2 {
4341 font-size: 15px;
4342 font-weight: 500;
4343 margin-bottom: 8px;
4344 }
4345
4346 .event-type-card-top p {
4347 font-size: 11px;
4348 color: #b19999;
4349 margin-bottom: 12px;
4350 }
4351
4352 .event-type-card-top a {
4353 color: #3664ae;
4354 font-size: 12px;
4355 }
4356
4357 .event-type-card-bottom {
4358 display: flex;
4359 align-items: center;
4360 justify-content: space-between;
4361 padding-top: 10px;
4362 }
4363
4364 .event-status {
4365 font-size: 14px;
4366 }
4367
4368 .event-status.Active {
4369 color: #008000c9;
4370 }
4371
4372 .event-status.In-active {
4373 color: gray;
4374 }
4375
4376 .calendly-event-copy-link {
4377 display: flex;
4378 align-items: center;
4379 gap: 5px;
4380 font-size: 14px;
4381 color: #3664ae;
4382 cursor: pointer;
4383 }
4384
4385 [data-event-status="In-active"] .event-type-card-top a, [data-event-status="In-active"] .calendly-event-copy-link {
4386 color: gray;
4387 }
4388
4389 [data-event-status="In-active"].event-type-card-list-item {
4390 border-top-color: #b2b2b2 !important;
4391 }
4392
4393 [data-event-status="In-active"] .calendly-event-copy-link svg path {
4394 fill: gray;
4395 }
4396
4397 .calendly-event-copy-link svg {
4398 width: 14px;
4399 height: 14px;
4400 }
4401
4402
4403 /* scheduled list table css */
4404
4405
4406 .rwd-table {
4407 max-width: 100%;
4408 width: 100%;
4409
4410 }
4411
4412 .rwd-table tr:first-child {
4413 border-top: none;
4414 background: #3664ae;
4415 color: #fff;
4416 }
4417
4418 .rwd-table tr {
4419 border-top: 1px dotted red;
4420 border-bottom: 1px dotted red;
4421 }
4422
4423
4424 .rwd-table th {
4425 display: none;
4426 }
4427
4428 .rwd-table td {
4429 display: block;
4430
4431 }
4432
4433 .rwd-table td:before {
4434 content: attr(data-th) ": ";
4435 width: 120px;
4436 display: inline-block;
4437 color: #000;
4438 }
4439
4440 .rwd-table th, .rwd-table td {
4441 padding-left: 30px !important;
4442 }
4443
4444 .rwd-table {
4445 color: #333;
4446 border-radius: .4em;
4447 width: 100%;
4448 /* Set the table width to 100% */
4449 /* table-layout: fixed; */
4450 }
4451
4452 .rwd-table tr {
4453 border-color: red;
4454 }
4455
4456
4457 .rwd-table td:before {
4458 display: none;
4459 }
4460
4461 .rwd-table th, .rwd-table td {
4462 display: table-cell;
4463 padding: .5em .5em;
4464 text-align: left;
4465 font-family: Arial, sans-serif;
4466 font-size: 14px;
4467 white-space: nowrap;
4468 /* width: 25%; */
4469 /* Divide the width evenly among the columns */
4470
4471 }
4472
4473 .rwd-table th {
4474 font-size: 15px;
4475 padding: 1em .5em;
4476 font-weight: 500;
4477 }
4478
4479 .rwd-table th:first-child {
4480 border-top-left-radius: 10px;
4481 border-bottom-left-radius: 10px;
4482 }
4483
4484 .rwd-table th:last-child {
4485 border-top-right-radius: 10px;
4486 border-bottom-right-radius: 10px;
4487 }
4488
4489 .rwd-table td {
4490 border-bottom: 1px dotted #ddd;
4491 /* border-radius: 10px; */
4492 /* border-right: 1px dotted #ddd; */
4493 }
4494
4495 /* .rwd-table td:first-child {
4496 border-left: 1px dotted #ddd;
4497 } */
4498
4499
4500 /* Tab container */
4501 .tab-container {
4502 display: flex;
4503 gap: 5px;
4504 background: #fff7f7;
4505 padding: 8px 10px;
4506 border-radius: 10px;
4507 }
4508
4509 /* Individual tab */
4510 .tab-container .tab {
4511 padding: 8px 20px;
4512 cursor: pointer;
4513 background-color: #fff7f7;
4514 border-radius: 10px;
4515 font-size: 15px;
4516
4517 }
4518
4519 /* Active tab */
4520 .tab-container .active-tab {
4521 background-color: #3664ae;
4522 color: #fff;
4523 }
4524
4525 /* Content container */
4526 .tab-content {
4527 display: none;
4528 width: 100%;
4529 }
4530
4531 /* Show the active tab content */
4532 .tab-content.active {
4533 display: block;
4534 }
4535
4536 .calendly-data-placeholder {
4537 position: relative;
4538 margin-top: 15px;
4539 }
4540
4541 .calendly-data-placeholder img {
4542 pointer-events: none;
4543 }
4544
4545 .calendly-data-placeholder {
4546 position: relative;
4547 margin-top: 5px;
4548 padding-top: 5px;
4549 }
4550
4551 .overlay {
4552 position: absolute;
4553 top: 0;
4554 left: 0;
4555 width: 100%;
4556 height: 100%;
4557 background-color: #3664ae26;
4558 text-align: center;
4559 display: flex;
4560 flex-direction: column;
4561 justify-content: center;
4562 border-radius: 10px;
4563 align-items: center;
4564 }
4565
4566 .overlay-button {
4567 background-color: #006bff;
4568 color: #fff !important;
4569 padding: 10px 20px;
4570 border: none;
4571 cursor: pointer;
4572 max-width: 300px;
4573 font-weight: 500;
4574 border-radius: 10px;
4575 }
4576
4577 .calendly-connector-container {
4578 display: flex;
4579 align-items: end;
4580 gap: 5px;
4581 }
4582
4583 @media only screen and (max-width: 768px) {
4584 .calendly-connector-container {
4585 margin-bottom: 15px;
4586 }
4587
4588 .calendly-embedpress-authorize-button {
4589 flex-direction: column;
4590 justify-content: center;
4591 }
4592
4593 .tab-container {
4594 width: 100%;
4595 align-items: center;
4596 justify-content: center;
4597 }
4598
4599 .tab-container .tab {
4600 padding: 8px 10px;
4601 font-size: 14px;
4602 width: 50%;
4603 text-align: center;
4604 }
4605
4606 .calendly-data {
4607 overflow: auto;
4608 }
4609
4610 .event-type-card-list {
4611 grid-template-columns: repeat(2, 1fr);
4612 }
4613
4614 .rwd-table {
4615 min-width: 700px;
4616 overflow: auto;
4617 table-layout: auto;
4618 }
4619
4620 .rwd-table th, .rwd-table td {
4621 padding: 10px;
4622 font-size: 13px;
4623 }
4624
4625 .rwd-table th, .rwd-table td {
4626 padding-left: 20px !important;
4627 width: auto;
4628 }
4629 }
4630
4631
4632 @media only screen and (max-width: 480px) {
4633 .event-type-card-list {
4634 grid-template-columns: repeat(1, 1fr);
4635 }
4636
4637 .tab-container {
4638 padding: 8px 6px;
4639 }
4640
4641 .tab-container .tab {
4642 white-space: nowrap;
4643 padding: 8px 5px;
4644 font-size: 12px;
4645 text-align: center;
4646 }
4647 }
4648
4649 form#instagram-form {
4650 width: 400px;
4651 padding: 20px;
4652 border-radius: 15px;
4653 }
4654
4655 form#instagram-form select#account-option, form#instagram-form input#instagram-access-token {
4656 width: 100%;
4657 height: 45px;
4658 margin-bottom: 10px;
4659 border-radius: 5px;
4660 }
4661
4662 /* Styling for overlay background */
4663 .account-section .modal-overlay {
4664 position: fixed;
4665 top: 0;
4666 left: 0;
4667 width: 100%;
4668 height: 100%;
4669 background-color: rgba(0, 0, 0, 0.8);
4670 /* Semi-transparent black */
4671 z-index: 9999;
4672 /* Ensure it's on top of everything */
4673 display: none;
4674 /* Hide by default */
4675 }
4676
4677 /* Styling for the modal itself */
4678 .account-section .modal {
4679 position: fixed;
4680 top: 50%;
4681 left: 50%;
4682 transform: translate(-50%, -50%);
4683 background-color: #fff;
4684 padding: 20px;
4685 border-radius: 8px;
4686 box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
4687 /* Drop shadow effect */
4688 z-index: 10000;
4689 /* Ensure it's on top of the overlay */
4690 max-width: 80%;
4691 /* Adjust the maximum width as needed */
4692 max-height: 80%;
4693 /* Adjust the maximum height as needed */
4694 overflow-y: auto;
4695 /* Enable vertical scrolling if content overflows */
4696 }
4697
4698 /* Styling for close button */
4699 form#instagram-form .close-btn {
4700 position: absolute;
4701 top: 5px;
4702 right: 5px;
4703 cursor: pointer;
4704 background: #f2f2f2;
4705 width: 25px;
4706 height: 25px;
4707 display: flex;
4708 align-items: center;
4709 justify-content: center;
4710 border-radius: 5px;
4711 }
4712
4713 form#instagram-form button {
4714 background-color: #594E91;
4715 color: #fff;
4716 }
4717
4718 .form-footer {
4719 display: flex;
4720 align-items: center;
4721 justify-content: space-between;
4722 margin-top: 10px;
4723 }
4724
4725 form#instagram-form label {
4726 display: inline-block;
4727 }
4728
4729 a.for-business, a.for-personal{
4730 display: inline-block;
4731 text-decoration: underline;
4732 font-size: 14px;
4733 font-weight: normal;
4734 color: inherit;
4735 margin-bottom: 10px;
4736 color: #2271b1;
4737 }
4738
4739 .no-account-connected {
4740 text-align: center;
4741 margin: 45px;
4742 }
4743
4744 #instagram-form .form-group {
4745 position: relative;
4746 }
4747
4748 #instagram-form .form-group a {
4749 position: absolute;
4750 background: #f5f6ff;
4751 width: 20px;
4752 height: 20px;
4753 display: flex;
4754 align-items: center;
4755 justify-content: center;
4756 text-align: center;
4757 right: 0;
4758 top: 12px;
4759 right: 12px;
4760 border-radius: 5px;
4761 }
4762
4763 .user-profile-link {
4764 padding: 5px 10px;
4765 background-color: #007bff;
4766 color: #fff;
4767 border: none;
4768 border-radius: 4px;
4769 cursor: pointer;
4770 transition: background-color 0.3s;
4771 font-size: 14px;
4772 cursor: pointer;
4773 }
4774
4775 .user-profile-link:hover {
4776 background-color: #0056b3;
4777 }
4778
4779 .emebedpress img.user-avatar{
4780 border: 2px solid #037bff;
4781 }
4782
4783 td.instagram-user-account {
4784 display: flex;
4785 align-items: center;
4786 gap: 10px;
4787 }
4788
4789 td.instagram-sync-data{
4790 cursor: pointer;
4791 }
4792
4793 .sync-spin {
4794 animation: spin 1s linear infinite; /* Apply the spin animation */
4795 }
4796
4797 @keyframes spin {
4798 to {
4799 transform: rotate(360deg); /* Rotate the element 360 degrees */
4800 }
4801 }
4802