PluginProbe
Better Payment – Instant Payments, Donations, Fundraising with Subscriptions & More / 2.1.1
Better Payment – Instant Payments, Donations, Fundraising with Subscriptions & More v2.1.1
2.4.1 2.4.0 2.3.4 2.3.3 2.3.2 2.3.1 2.3.0 2.2.2 2.2.1 2.2.0 2.1.2 2.1.1 trunk 0.0.1 0.0.2 0.0.3 0.0.4 0.0.5 0.0.6 0.0.7 1.0.0 1.0.1 1.0.2 1.0.3 1.0.4 All 68 releases
better-payment / assets / css / common.css

common.css in Better Payment – Instant Payments, Donations, Fundraising with Subscriptions & More 2.1.1, at assets/css/common.css

3,959 lines 90.5 KB
No matching file
Up and down to move Enter to open Esc to close
Raw Download Zip
1 /*!****************************************************************************************************************************************************************************************************************!*\
2 !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[6].use[1]!./node_modules/postcss-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[6].use[3]!./src/css/common.scss ***!
3 \****************************************************************************************************************************************************************************************************************/
4 .better-payment .width-100 {
5 display: inline-block;
6 width: 100%;
7 max-height: 465px;
8 min-height: 465px;
9 overflow: hidden;
10 border-radius: 16px;
11 }
12 .better-payment .width-100.height-auto {
13 min-height: auto;
14 }
15 .better-payment .width-100 img {
16 object-fit: cover;
17 height: 100%;
18 }
19 .better-payment .payment-form-layout-1 .field-payment_method .bp-radio-box,
20 .better-payment .payment-form-layout-1 .field-payment_method .bp-radio-box label,
21 .better-payment .payment-form-layout-2 .field-payment_method .bp-radio-box,
22 .better-payment .payment-form-layout-2 .field-payment_method .bp-radio-box label {
23 display: flex;
24 align-items: center;
25 }
26 .better-payment .payment-form-layout-1 .bp-three-items-enabled-wrap.field-payment_method .bp-radio-box,
27 .better-payment .payment-form-layout-2 .bp-three-items-enabled-wrap.field-payment_method .bp-radio-box {
28 display: flex;
29 justify-content: space-between;
30 align-items: center;
31 }
32 .better-payment .bp-three-items-enabled.pr-6 {
33 padding-right: unset !important;
34 }
35
36 .better-payment .bp-radio-box input[type=radio]:checked {
37 border: 2px solid #006AFF;
38 }
39
40 .better-payment .bp-radio-box input[type=radio] {
41 width: 20px;
42 height: 20px;
43 outline: 0;
44 border-radius: 50%;
45 position: relative;
46 border: 2px solid #CBC9DA;
47 background: #fff;
48 margin-bottom: -3px;
49 margin-right: 10px;
50 }
51
52 .better-payment .bp-radio-box input[type=radio]:after {
53 content: "";
54 opacity: 0;
55 display: block;
56 left: 4px;
57 top: 4px;
58 position: absolute;
59 width: 8px;
60 height: 8px;
61 border-radius: 50%;
62 background: #006AFF;
63 }
64
65 .better-payment .form-content-section-fields .payment-method-checkbox input[type=radio]:after {
66 width: 12px;
67 height: 12px;
68 }
69
70 .better-payment .bp-radio-box input[type=radio]:checked:after {
71 opacity: 1;
72 }
73
74 .better-payment .control {
75 box-sizing: border-box;
76 clear: both;
77 font-size: 1rem;
78 position: relative;
79 text-align: inherit;
80 }
81
82 .better-payment .control.has-icons-right .input,
83 .better-payment .control.has-icons-right .select select {
84 padding-right: 2.5em;
85 }
86
87 .better-payment .control.has-icons-left .input,
88 .better-payment .control.has-icons-left .select select {
89 padding-left: 2.5em;
90 }
91
92 .better-payment .is-large.input,
93 .better-payment .is-large.textarea {
94 font-size: 1.5rem;
95 }
96
97 .better-payment .control.has-icons-left .input.is-large ~ .icon,
98 .better-payment .control.has-icons-left .select.is-large ~ .icon,
99 .better-payment .control.has-icons-right .input.is-large ~ .icon,
100 .better-payment .control.has-icons-right .select.is-large ~ .icon {
101 font-size: 1.5rem;
102 }
103
104 .better-payment .control.has-icons-left .icon.is-left {
105 left: 0;
106 }
107
108 .better-payment .control.has-icons-left .icon,
109 .better-payment .control.has-icons-right .icon {
110 color: #dbdbdb;
111 height: 2.5em;
112 pointer-events: none;
113 position: absolute;
114 top: 0;
115 width: 2.5em;
116 z-index: 4;
117 }
118
119 .better-payment .icon.is-medium {
120 height: 2rem;
121 width: 2rem;
122 }
123
124 .better-payment .icon {
125 align-items: center;
126 display: inline-flex;
127 justify-content: center;
128 height: 1.5rem;
129 width: 1.5rem;
130 }
131
132 .better-payment .control.has-icons-right .icon.is-right {
133 right: 0;
134 }
135
136 .better-payment .control.has-icons-left .icon,
137 .better-payment .control.has-icons-right .icon {
138 color: #dbdbdb;
139 height: 2.5em;
140 pointer-events: none;
141 position: absolute;
142 top: 0;
143 width: 2.5em;
144 z-index: 4;
145 }
146
147 .better-payment .input:active,
148 .better-payment .input:focus,
149 .better-payment .is-active.input,
150 .better-payment .is-active.textarea,
151 .better-payment .is-focused.input,
152 .better-payment .is-focused.textarea,
153 .better-payment .select select.is-active,
154 .better-payment .select select.is-focused,
155 .better-payment .select select:active,
156 .better-payment .select select:focus,
157 .better-payment .textarea:active,
158 .better-payment .textarea:focus {
159 border-color: #485fc7;
160 box-shadow: 0 0 0 0.125em rgba(72, 95, 199, 0.25);
161 }
162
163 .better-payment .input:hover,
164 .better-payment .is-hovered.input,
165 .better-payment .is-hovered.textarea,
166 .better-payment .select select.is-hovered,
167 .better-payment .select select:hover,
168 .better-payment .textarea:hover {
169 border-color: #b5b5b5;
170 }
171
172 .better-payment .input,
173 .better-payment .textarea {
174 box-shadow: inset 0 0.0625em 0.125em rgba(10, 10, 10, 0.05);
175 max-width: 100%;
176 width: 100%;
177 }
178
179 .better-payment .is-medium.input,
180 .better-payment .is-medium.textarea {
181 font-size: 1.25rem;
182 }
183
184 .better-payment .control.has-icons-left .input.is-medium ~ .icon,
185 .better-payment .control.has-icons-left .select.is-medium ~ .icon,
186 .better-payment .control.has-icons-right .input.is-medium ~ .icon,
187 .better-payment .control.has-icons-right .select.is-medium ~ .icon {
188 font-size: 1.25rem;
189 }
190
191 /* FontAwesome icon styling to match BP custom icons */
192 .better-payment .control.has-icons-left .icon svg,
193 .better-payment .control.has-icons-right .icon svg {
194 width: 20px;
195 }
196
197 .better-payment .control.has-icons-left .icon svg path,
198 .better-payment .control.has-icons-right .icon svg path {
199 fill: #b0b7d6;
200 stroke: #b0b7d6;
201 }
202
203 /* Helper Classes */
204 .better-payment .columns.is-mobile {
205 display: flex;
206 }
207
208 .better-payment .columns:not(:last-child) {
209 margin-bottom: 0.75rem;
210 }
211
212 .better-payment .columns {
213 margin-left: -0.75rem;
214 margin-right: -0.75rem;
215 margin-top: -0.75rem;
216 }
217
218 .better-payment .column {
219 display: block;
220 flex-basis: 0;
221 flex-grow: 1;
222 flex-shrink: 1;
223 padding: 0.75rem;
224 }
225
226 .better-payment .is-size-1 {
227 font-size: 3rem !important;
228 }
229
230 .better-payment .is-size-1-fix {
231 font-size: 3rem;
232 }
233
234 .better-payment .is-size-2 {
235 font-size: 2.5rem !important;
236 }
237
238 .better-payment .is-size-2-fix {
239 font-size: 2.5rem;
240 }
241
242 .better-payment .is-size-3 {
243 font-size: 2rem !important;
244 }
245
246 .better-payment .is-size-3-fix {
247 font-size: 2rem;
248 }
249
250 .better-payment .is-size-4 {
251 font-size: 1.5rem !important;
252 }
253
254 .better-payment .is-size-4-fix {
255 font-size: 1.5rem;
256 }
257
258 .better-payment .is-size-5 {
259 font-size: 1.25rem !important;
260 }
261
262 .better-payment .is-size-5-fix {
263 font-size: 1.25rem;
264 }
265
266 .better-payment .is-size-6 {
267 font-size: 1rem !important;
268 }
269
270 .better-payment .is-size-6-fix {
271 font-size: 1rem;
272 }
273
274 .better-payment .is-size-7 {
275 font-size: 0.75rem !important;
276 }
277
278 .better-payment .is-size-7-fix {
279 font-size: 0.75rem;
280 }
281
282 .better-payment .has-text-white {
283 color: #fff !important;
284 }
285
286 .better-payment .has-text-white-fix {
287 color: #fff;
288 }
289
290 .better-payment .has-text-black {
291 color: #000 !important;
292 }
293
294 .better-payment .has-text-black-fix {
295 color: #000;
296 }
297
298 .better-payment .has-text-light {
299 color: #f5f5f5 !important;
300 }
301
302 .better-payment .has-text-light-fix {
303 color: #f5f5f5;
304 }
305
306 .better-payment .has-text-dark {
307 color: #363636 !important;
308 }
309
310 .better-payment .has-text-dark-fix {
311 color: #363636;
312 }
313
314 .better-payment .has-text-primary {
315 color: #00d1b2 !important;
316 }
317
318 .better-payment .has-text-primary-fix {
319 color: #00d1b2;
320 }
321
322 .better-payment .has-text-link {
323 color: #485fc7 !important;
324 }
325
326 .better-payment .has-text-link-fix {
327 color: #485fc7;
328 }
329
330 .better-payment .has-text-info {
331 color: #3e8ed0 !important;
332 }
333
334 .better-payment .has-text-info-fix {
335 color: #3e8ed0;
336 }
337
338 .better-payment .has-text-success {
339 color: #48c78e !important;
340 }
341
342 .better-payment .has-text-success-fix {
343 color: #48c78e;
344 }
345
346 .better-payment .has-text-warning {
347 color: #ffe08a !important;
348 }
349
350 .better-payment .has-text-warning-fix {
351 color: #ffe08a;
352 }
353
354 .better-payment .has-text-danger {
355 color: #f14668 !important;
356 }
357
358 .better-payment .has-text-danger-fix {
359 color: #f14668;
360 }
361
362 .better-payment .m-0 {
363 margin: 0 !important;
364 }
365
366 .better-payment .mt-0 {
367 margin-top: 0 !important;
368 }
369
370 .better-payment .mr-0 {
371 margin-right: 0 !important;
372 }
373
374 .better-payment .mb-0 {
375 margin-bottom: 0 !important;
376 }
377
378 .better-payment .ml-0 {
379 margin-left: 0 !important;
380 }
381
382 .better-payment .mx-0 {
383 margin-left: 0 !important;
384 margin-right: 0 !important;
385 }
386
387 .better-payment .my-0 {
388 margin-top: 0 !important;
389 margin-bottom: 0 !important;
390 }
391
392 .better-payment .m-1 {
393 margin: 0.25rem !important;
394 }
395
396 .better-payment .mt-1 {
397 margin-top: 0.25rem !important;
398 }
399
400 .better-payment .mr-1 {
401 margin-right: 0.25rem !important;
402 }
403
404 .better-payment .mb-1 {
405 margin-bottom: 0.25rem !important;
406 }
407
408 .better-payment .ml-1 {
409 margin-left: 0.25rem !important;
410 }
411
412 .better-payment .mx-1 {
413 margin-left: 0.25rem !important;
414 margin-right: 0.25rem !important;
415 }
416
417 .better-payment .my-1 {
418 margin-top: 0.25rem !important;
419 margin-bottom: 0.25rem !important;
420 }
421
422 .better-payment .m-2 {
423 margin: 0.5rem !important;
424 }
425
426 .better-payment .mt-2 {
427 margin-top: 0.5rem !important;
428 }
429
430 .better-payment .mr-2 {
431 margin-right: 0.5rem !important;
432 }
433
434 .better-payment .mb-2 {
435 margin-bottom: 0.5rem !important;
436 }
437
438 .better-payment .ml-2 {
439 margin-left: 0.5rem !important;
440 }
441
442 .better-payment .mx-2 {
443 margin-left: 0.5rem !important;
444 margin-right: 0.5rem !important;
445 }
446
447 .better-payment .my-2 {
448 margin-top: 0.5rem !important;
449 margin-bottom: 0.5rem !important;
450 }
451
452 .better-payment .m-3 {
453 margin: 0.75rem !important;
454 }
455
456 .better-payment .mt-3 {
457 margin-top: 0.75rem !important;
458 }
459
460 .better-payment .mr-3 {
461 margin-right: 0.75rem !important;
462 }
463
464 .better-payment .mb-3 {
465 margin-bottom: 0.75rem !important;
466 }
467
468 .better-payment .ml-3 {
469 margin-left: 0.75rem !important;
470 }
471
472 .better-payment .mx-3 {
473 margin-left: 0.75rem !important;
474 margin-right: 0.75rem !important;
475 }
476
477 .better-payment .my-3 {
478 margin-top: 0.75rem !important;
479 margin-bottom: 0.75rem !important;
480 }
481
482 .better-payment .m-4 {
483 margin: 1rem !important;
484 }
485
486 .better-payment .mt-4 {
487 margin-top: 1rem !important;
488 }
489
490 .better-payment .mr-4 {
491 margin-right: 1rem !important;
492 }
493
494 .better-payment .mb-4 {
495 margin-bottom: 1rem !important;
496 }
497
498 .better-payment .ml-4 {
499 margin-left: 1rem !important;
500 }
501
502 .better-payment .mx-4 {
503 margin-left: 1rem !important;
504 margin-right: 1rem !important;
505 }
506
507 .better-payment .my-4 {
508 margin-top: 1rem !important;
509 margin-bottom: 1rem !important;
510 }
511
512 .better-payment .m-5 {
513 margin: 1.5rem !important;
514 }
515
516 .better-payment .mt-5 {
517 margin-top: 1.5rem !important;
518 }
519
520 .better-payment .mr-5 {
521 margin-right: 1.5rem !important;
522 }
523
524 .better-payment .mb-5 {
525 margin-bottom: 1.5rem !important;
526 }
527
528 .better-payment .ml-5 {
529 margin-left: 1.5rem !important;
530 }
531
532 .better-payment .mx-5 {
533 margin-left: 1.5rem !important;
534 margin-right: 1.5rem !important;
535 }
536
537 .better-payment .my-5 {
538 margin-top: 1.5rem !important;
539 margin-bottom: 1.5rem !important;
540 }
541
542 .better-payment .m-6 {
543 margin: 3rem !important;
544 }
545
546 .better-payment .mt-6 {
547 margin-top: 3rem !important;
548 }
549
550 .better-payment .mr-6 {
551 margin-right: 3rem !important;
552 }
553
554 .better-payment .mb-6 {
555 margin-bottom: 3rem !important;
556 }
557
558 .better-payment .ml-6 {
559 margin-left: 3rem !important;
560 }
561
562 .better-payment .mx-6 {
563 margin-left: 3rem !important;
564 margin-right: 3rem !important;
565 }
566
567 .better-payment .my-6 {
568 margin-top: 3rem !important;
569 margin-bottom: 3rem !important;
570 }
571
572 .better-payment .p-0 {
573 padding: 0 !important;
574 }
575
576 .better-payment .pt-0 {
577 padding-top: 0 !important;
578 }
579
580 .better-payment .pr-0 {
581 padding-right: 0 !important;
582 }
583
584 .better-payment .pb-0 {
585 padding-bottom: 0 !important;
586 }
587
588 .better-payment .pl-0 {
589 padding-left: 0 !important;
590 }
591
592 .better-payment .px-0 {
593 padding-left: 0 !important;
594 padding-right: 0 !important;
595 }
596
597 .better-payment .py-0 {
598 padding-top: 0 !important;
599 padding-bottom: 0 !important;
600 }
601
602 .better-payment .p-1 {
603 padding: 0.25rem !important;
604 }
605
606 .better-payment .pt-1 {
607 padding-top: 0.25rem !important;
608 }
609
610 .better-payment .pr-1 {
611 padding-right: 0.25rem !important;
612 }
613
614 .better-payment .pb-1 {
615 padding-bottom: 0.25rem !important;
616 }
617
618 .better-payment .pl-1 {
619 padding-left: 0.25rem !important;
620 }
621
622 .better-payment .px-1 {
623 padding-left: 0.25rem !important;
624 padding-right: 0.25rem !important;
625 }
626
627 .better-payment .py-1 {
628 padding-top: 0.25rem !important;
629 padding-bottom: 0.25rem !important;
630 }
631
632 .better-payment .p-2 {
633 padding: 0.5rem !important;
634 }
635
636 .better-payment .pt-2 {
637 padding-top: 0.5rem !important;
638 }
639
640 .better-payment .pr-2 {
641 padding-right: 0.5rem !important;
642 }
643
644 .better-payment .pb-2 {
645 padding-bottom: 0.5rem !important;
646 }
647
648 .better-payment .pl-2 {
649 padding-left: 0.5rem !important;
650 }
651
652 .better-payment .px-2 {
653 padding-left: 0.5rem !important;
654 padding-right: 0.5rem !important;
655 }
656
657 .better-payment .py-2 {
658 padding-top: 0.5rem !important;
659 padding-bottom: 0.5rem !important;
660 }
661
662 .better-payment .p-3 {
663 padding: 0.75rem !important;
664 }
665
666 .better-payment .pt-3 {
667 padding-top: 0.75rem !important;
668 }
669
670 .better-payment .pr-3 {
671 padding-right: 0.75rem !important;
672 }
673
674 .better-payment .pb-3 {
675 padding-bottom: 0.75rem !important;
676 }
677
678 .better-payment .pl-3 {
679 padding-left: 0.75rem !important;
680 }
681
682 .better-payment .px-3 {
683 padding-left: 0.75rem !important;
684 padding-right: 0.75rem !important;
685 }
686
687 .better-payment .py-3 {
688 padding-top: 0.75rem !important;
689 padding-bottom: 0.75rem !important;
690 }
691
692 .better-payment .p-4 {
693 padding: 1rem !important;
694 }
695
696 .better-payment .pt-4 {
697 padding-top: 1rem !important;
698 }
699
700 .better-payment .pr-4 {
701 padding-right: 1rem !important;
702 }
703
704 .better-payment .pb-4 {
705 padding-bottom: 1rem !important;
706 }
707
708 .better-payment .pl-4 {
709 padding-left: 1rem !important;
710 }
711
712 .better-payment .px-4 {
713 padding-left: 1rem !important;
714 padding-right: 1rem !important;
715 }
716
717 .better-payment .py-4 {
718 padding-top: 1rem !important;
719 padding-bottom: 1rem !important;
720 }
721
722 .better-payment .p-5 {
723 padding: 1.5rem !important;
724 }
725
726 .better-payment .pt-5 {
727 padding-top: 1.5rem !important;
728 }
729
730 .better-payment .pr-5 {
731 padding-right: 1.5rem !important;
732 }
733
734 .better-payment .pb-5 {
735 padding-bottom: 1.5rem !important;
736 }
737
738 .better-payment .pl-5 {
739 padding-left: 1.5rem !important;
740 }
741
742 .better-payment .px-5 {
743 padding-left: 1.5rem !important;
744 padding-right: 1.5rem !important;
745 }
746
747 .better-payment .py-5 {
748 padding-top: 1.5rem !important;
749 padding-bottom: 1.5rem !important;
750 }
751
752 .better-payment .p-6 {
753 padding: 3rem !important;
754 }
755
756 .better-payment .pt-6 {
757 padding-top: 3rem !important;
758 }
759
760 .better-payment .pr-6 {
761 padding-right: 3rem !important;
762 }
763
764 .better-payment .pb-6 {
765 padding-bottom: 3rem !important;
766 }
767
768 .better-payment .pl-6 {
769 padding-left: 3rem !important;
770 }
771
772 .better-payment .px-6 {
773 padding-left: 3rem !important;
774 padding-right: 3rem !important;
775 }
776
777 .better-payment .py-6 {
778 padding-top: 3rem !important;
779 padding-bottom: 3rem !important;
780 }
781
782 .better-payment .columns.is-gapless:not(:last-child) {
783 margin-bottom: 1.5rem;
784 }
785
786 .better-payment .columns.is-gapless {
787 margin-left: 0;
788 margin-right: 0;
789 margin-top: 0;
790 }
791
792 .better-payment .tile.is-ancestor:not(:last-child) {
793 margin-bottom: 0.75rem;
794 }
795
796 .better-payment .tile.is-ancestor {
797 margin-left: -0.75rem;
798 margin-right: -0.75rem;
799 margin-top: -0.75rem;
800 }
801
802 .better-payment .tile {
803 align-items: stretch;
804 display: block;
805 flex-basis: 0;
806 flex-grow: 1;
807 flex-shrink: 1;
808 min-height: -webkit-min-content;
809 min-height: -moz-min-content;
810 min-height: min-content;
811 }
812
813 .better-payment .tile.is-vertical > .tile.is-child:not(:last-child) {
814 margin-bottom: 1.5rem !important;
815 }
816
817 .better-payment .tile.is-child {
818 margin: 0 !important;
819 }
820
821 .better-payment .notification.is-primary {
822 background-color: #00d1b2;
823 color: #fff;
824 }
825
826 .better-payment .notification.is-warning {
827 background-color: #ffe08a;
828 color: rgba(0, 0, 0, 0.7);
829 }
830
831 .better-payment .notification.is-info {
832 background-color: #3e8ed0;
833 color: #fff;
834 }
835
836 .better-payment .has-background-white {
837 background-color: #ffffff !important;
838 }
839
840 .better-payment .has-background-white-fix {
841 background-color: #ffffff;
842 }
843
844 .better-payment .has-background-black {
845 background-color: #0a0a0a !important;
846 }
847
848 .better-payment .has-background-black-fix {
849 background-color: #0a0a0a;
850 }
851
852 .better-payment .has-background-light {
853 background-color: #f5f5f5 !important;
854 }
855
856 .better-payment .has-background-light-fix {
857 background-color: #f5f5f5;
858 }
859
860 .better-payment .has-background-dark {
861 background-color: #363636 !important;
862 }
863
864 .better-payment .has-background-dark-fix {
865 background-color: #363636;
866 }
867
868 .better-payment .has-background-primary {
869 background-color: #00d1b2 !important;
870 }
871
872 .better-payment .has-background-primary-fix {
873 background-color: #00d1b2;
874 }
875
876 .better-payment .has-background-link {
877 background-color: #485fc7 !important;
878 }
879
880 .better-payment .has-background-link-fix {
881 background-color: #485fc7;
882 }
883
884 .better-payment .has-background-info {
885 background-color: #3e8ed0 !important;
886 }
887
888 .better-payment .has-background-info-fix {
889 background-color: #3e8ed0;
890 }
891
892 .better-payment .has-background-success {
893 background-color: #48c78e !important;
894 }
895
896 .better-payment .has-background-success-fix {
897 background-color: #48c78e;
898 }
899
900 .better-payment .has-background-warning {
901 background-color: #ffe08a !important;
902 }
903
904 .better-payment .has-background-warning-fix {
905 background-color: #ffe08a;
906 }
907
908 .better-payment .has-background-danger {
909 background-color: #f14668 !important;
910 }
911
912 .better-payment .has-background-danger-fix {
913 background-color: #f14668;
914 }
915
916 .better-payment .has-text-centered {
917 text-align: center !important;
918 }
919
920 .better-payment .has-text-justified {
921 text-align: justify !important;
922 }
923
924 .better-payment .has-text-left {
925 text-align: left !important;
926 }
927
928 .better-payment .has-text-right {
929 text-align: right !important;
930 }
931
932 .better-payment .has-text-weight-light {
933 font-weight: 300 !important;
934 }
935
936 .better-payment .has-text-weight-normal {
937 font-weight: 400 !important;
938 }
939
940 .better-payment .has-text-weight-medium {
941 font-weight: 500 !important;
942 }
943
944 .better-payment .has-text-weight-semibold {
945 font-weight: 600 !important;
946 }
947
948 .better-payment .has-text-weight-bold {
949 font-weight: 700 !important;
950 }
951
952 .better-payment .bulma-control-extend,
953 .better-payment .file-cta,
954 .better-payment .file-name,
955 .better-payment .input,
956 .better-payment .pagination-ellipsis,
957 .better-payment .pagination-link,
958 .better-payment .pagination-next,
959 .better-payment .pagination-previous,
960 .better-payment .select select,
961 .better-payment .textarea {
962 -moz-appearance: none;
963 -webkit-appearance: none;
964 align-items: center;
965 border: 1px solid transparent;
966 border-radius: 0.375em;
967 box-shadow: none;
968 display: inline-flex;
969 font-size: 1rem;
970 height: 2.5em;
971 justify-content: flex-start;
972 line-height: 1.5;
973 padding-bottom: calc(0.5em - 1px);
974 padding-left: calc(0.75em - 1px);
975 padding-right: calc(0.75em - 1px);
976 padding-top: calc(0.5em - 1px);
977 position: relative;
978 vertical-align: top;
979 }
980
981 .better-payment .input,
982 .better-payment .select select,
983 .better-payment .textarea {
984 background-color: #fff;
985 border-color: #dbdbdb;
986 border-radius: 0.375em;
987 color: #363636;
988 }
989
990 .better-payment .bulma-control-extend:active,
991 .better-payment .bulma-control-extend:focus,
992 .better-payment .file-cta:active,
993 .better-payment .file-cta:focus,
994 .better-payment .file-name:active,
995 .better-payment .file-name:focus,
996 .better-payment .input:active,
997 .better-payment .input:focus,
998 .better-payment .is-active.bulma-control-extend,
999 .better-payment .is-active.file-cta,
1000 .better-payment .is-active.file-name,
1001 .better-payment .is-active.input,
1002 .better-payment .is-active.pagination-ellipsis,
1003 .better-payment .is-active.pagination-link,
1004 .better-payment .is-active.pagination-next,
1005 .better-payment .is-active.pagination-previous,
1006 .better-payment .is-active.textarea,
1007 .better-payment .is-focused.bulma-control-extend,
1008 .better-payment .is-focused.file-cta,
1009 .better-payment .is-focused.file-name,
1010 .better-payment .is-focused.input,
1011 .better-payment .is-focused.pagination-ellipsis,
1012 .better-payment .is-focused.pagination-link,
1013 .better-payment .is-focused.pagination-next,
1014 .better-payment .is-focused.pagination-previous,
1015 .better-payment .is-focused.textarea,
1016 .better-payment .pagination-ellipsis:active,
1017 .better-payment .pagination-ellipsis:focus,
1018 .better-payment .pagination-link:active,
1019 .better-payment .pagination-link:focus,
1020 .better-payment .pagination-next:active,
1021 .better-payment .pagination-next:focus,
1022 .better-payment .pagination-previous:active,
1023 .better-payment .pagination-previous:focus,
1024 .better-payment .select select.is-active,
1025 .better-payment .select select.is-focused,
1026 .better-payment .select select:active,
1027 .better-payment .select select:focus,
1028 .better-payment .textarea:active,
1029 .better-payment.textarea:focus {
1030 outline: 0;
1031 }
1032
1033 .better-payment .better-payment-notice.notification.is-danger.is-light {
1034 background-color: rgb(242, 222, 222);
1035 color: rgb(169, 68, 66);
1036 font-size: 85%;
1037 padding: 15px;
1038 border-radius: 3px;
1039 }
1040
1041 .better-payment .better-payment-notice.notification.is-danger.is-light a {
1042 color: rgb(169, 68, 66) !important;
1043 }
1044
1045 .better-payment .notification {
1046 background-color: #f5f5f5;
1047 border-radius: 0.375em;
1048 position: relative;
1049 padding: 1.25rem 2.5rem 1.25rem 1.5rem;
1050 }
1051
1052 .better-payment .notification.is-light {
1053 background-color: #f5f5f5;
1054 color: rgba(0, 0, 0, 0.7);
1055 }
1056
1057 .better-payment .notification.is-danger {
1058 background-color: #f14668;
1059 color: #fff;
1060 }
1061
1062 .better-payment .notification.is-danger.is-light {
1063 background-color: #feecf0;
1064 color: #cc0f35;
1065 }
1066
1067 .better-payment .notification.is-warning {
1068 background-color: #ffe08a;
1069 color: rgba(0, 0, 0, 0.7);
1070 }
1071
1072 .better-payment .notification.is-warning.is-light {
1073 background-color: #fffaeb;
1074 color: #946c00;
1075 }
1076
1077 .better-payment .notification.is-success {
1078 background-color: #48c78e;
1079 color: #fff;
1080 }
1081
1082 .better-payment .notification.is-success.is-light {
1083 background-color: #effaf5;
1084 color: #257953;
1085 }
1086
1087 .better-payment .notification.is-info {
1088 background-color: #3e8ed0;
1089 color: #fff;
1090 }
1091
1092 .better-payment .notification.is-info.is-light {
1093 background-color: #eff5fb;
1094 color: #296fa8;
1095 }
1096
1097 .better-payment .notification.is-link {
1098 background-color: #485fc7;
1099 color: #fff;
1100 }
1101
1102 .better-payment .notification.is-link.is-light {
1103 background-color: #eff1fa;
1104 color: #3850b7;
1105 }
1106
1107 .better-payment .notification.is-primary {
1108 background-color: #00d1b2;
1109 color: #fff;
1110 }
1111
1112 .better-payment .notification.is-primary.is-light {
1113 background-color: #ebfffc;
1114 color: #00947e;
1115 }
1116
1117 .better-payment .box {
1118 background-color: #fff;
1119 border-radius: 6px;
1120 box-shadow: 0 0.5em 1em -0.125em rgba(10, 10, 10, 0.1), 0 0 0 1px rgba(10, 10, 10, 0.02);
1121 color: #4a4a4a;
1122 display: block;
1123 padding: 0.75rem;
1124 }
1125
1126 /* Layout 2 */
1127 .better-payment .payment-form-layout-1,
1128 .better-payment .payment-form-layout-2 {
1129 font-family: "DM Sans", sans-serif;
1130 box-shadow: 0px 40px 75px rgba(0, 1, 35, 0.08);
1131 }
1132
1133 .better-payment .payment-form-layout-1 .dynamic-amount-section,
1134 .better-payment .payment-form-layout-2 .dynamic-amount-section {
1135 position: relative;
1136 background-color: #006AFF;
1137 background-image: url("../img/bg-blue-2.svg");
1138 background-repeat: no-repeat;
1139 background-position: center;
1140 background-size: cover;
1141 border-top-left-radius: 10px;
1142 border-bottom-left-radius: 10px;
1143 }
1144
1145 .better-payment .payment-form-layout-2 .dynamic-amount-section-subtitle {
1146 color: #98B9F2;
1147 }
1148
1149 .better-payment .payment-form-layout-3 .dynamic-amount-section-amount {
1150 color: #0042BD;
1151 }
1152
1153 .better-payment .payment-form-layout.payment-form-layout-3 .button {
1154 background-color: #0042BD !important;
1155 }
1156
1157 .better-payment .payment-form-layout-3 .dynamic-amount-section-title {
1158 color: #000;
1159 }
1160
1161 .better-payment .payment-form-layout-3 .dynamic-amount-section-subtitle {
1162 color: #666;
1163 }
1164
1165 .better-payment .payment-form-layout-3 .dynamic-amount-section-icon {
1166 color: #C6CDE4;
1167 }
1168
1169 .better-payment .payment-form-layout-3 .payment-method-checkbox {
1170 border-bottom: 1px solid #E9ECFF;
1171 cursor: pointer;
1172 display: flex;
1173 align-items: center;
1174 justify-content: center;
1175 }
1176
1177 .better-payment .payment-form-layout-3 .payment-method-checkbox input {
1178 display: none;
1179 }
1180
1181 .better-payment .payment-form-layout-3 .payment-method-checkbox img {
1182 object-fit: contain;
1183 height: 25px;
1184 }
1185
1186 .better-payment .payment-form-layout-3 .payment-method-checkbox input,
1187 .better-payment .payment-form-layout-2 .payment-method-checkbox.single-item input,
1188 .better-payment .payment-form-layout-1 .payment-method-checkbox.single-item input {
1189 visibility: hidden;
1190 }
1191
1192 .better-payment .payment-form-layout-3 .payment-method-checkbox.active,
1193 .better-payment .payment-form-layout-1 .payment-method-checkbox.single-item.active,
1194 .better-payment .payment-form-layout-2 .payment-method-checkbox.single-item.active {
1195 border-bottom: 1px solid #0042BD;
1196 }
1197
1198 .better-payment .payment-form-layout-1 .form-content-section,
1199 .better-payment .payment-form-layout-2 .form-content-section {
1200 border-top-right-radius: 10px;
1201 border-bottom-right-radius: 10px;
1202 }
1203
1204 .better-payment .payment-form-layout-2 .dynamic-amount-section,
1205 .better-payment .payment-form-layout-2 .form-content-section {
1206 border-radius: 10px;
1207 }
1208
1209 .better-payment .payment-form-layout-2 .dynamic-amount-section {
1210 background-color: #006AFF;
1211 background-image: linear-gradient(180deg, #006AFF 0%, #004CBF 100%);
1212 }
1213
1214 .better-payment .payment-form-layout-3 .dynamic-amount-section {
1215 background: #FBFCFF;
1216 }
1217
1218 .better-payment .payment-form-layout .button {
1219 background-color: #006AFF !important;
1220 color: #fff !important;
1221 }
1222
1223 .better-payment .button {
1224 -moz-appearance: none;
1225 -webkit-appearance: none;
1226 align-items: center;
1227 border: 1px solid transparent;
1228 border-radius: 0.375em;
1229 box-shadow: none;
1230 display: inline-flex;
1231 font-size: 1rem;
1232 height: 2.5em;
1233 justify-content: flex-start;
1234 line-height: 1.5;
1235 padding-bottom: calc(0.5em - 1px);
1236 padding-left: calc(0.75em - 1px);
1237 padding-right: calc(0.75em - 1px);
1238 padding-top: calc(0.5em - 1px);
1239 position: relative;
1240 vertical-align: top;
1241 }
1242
1243 .better-payment .button.fix-common {
1244 -moz-appearance: none;
1245 -webkit-appearance: none;
1246 align-items: center;
1247 border: 1px solid transparent;
1248 border-radius: 0.375em;
1249 box-shadow: none;
1250 display: inline-flex;
1251 font-size: unset;
1252 height: 2.5em;
1253 justify-content: flex-start;
1254 line-height: 1.5;
1255 padding-bottom: calc(0.5em - 1px);
1256 padding-left: calc(0.75em - 1px);
1257 padding-right: calc(0.75em - 1px);
1258 padding-top: calc(0.5em - 1px);
1259 position: relative;
1260 vertical-align: top;
1261 }
1262
1263 .better-payment .button:active,
1264 .better-payment .button:focus,
1265 .better-payment .is-active.button,
1266 .better-payment .is-focused.button {
1267 outline: 0;
1268 }
1269
1270 .better-payment .buttons .button {
1271 margin-bottom: 0.5rem;
1272 }
1273
1274 .better-payment .button.is-fullwidth {
1275 display: flex;
1276 width: 100%;
1277 }
1278
1279 .better-payment .button.is-medium {
1280 font-size: 1.25rem;
1281 }
1282
1283 .better-payment .button {
1284 background-color: #fff;
1285 border-color: #dbdbdb;
1286 border-width: 1px;
1287 color: #363636;
1288 cursor: pointer;
1289 justify-content: center;
1290 padding-bottom: calc(0.5em - 1px);
1291 padding-left: 1em;
1292 padding-right: 1em;
1293 padding-top: calc(0.5em - 1px);
1294 text-align: center;
1295 white-space: nowrap;
1296 }
1297
1298 .better-payment .button.is-hovered,
1299 .better-payment .button:hover {
1300 border-color: #b5b5b5;
1301 color: #363636;
1302 }
1303
1304 .better-payment .is-hidden {
1305 display: none !important;
1306 }
1307
1308 .better-payment .control .bp-currency-symbol {
1309 color: #b0b7d6;
1310 font-size: 1.5rem;
1311 }
1312
1313 .better-payment .is-full-width,
1314 .better-payment.is-full-width {
1315 width: 100%;
1316 }
1317
1318 .better-payment .is-medium.bp-custom-payment-amount-el-integration {
1319 font-size: unset;
1320 border-color: unset;
1321 border-radius: 3px;
1322 }
1323
1324 .better-payment .control.has-icons-left .is-medium.bp-custom-payment-amount-el-integration ~ .icon {
1325 font-size: unset;
1326 }
1327
1328 .better-payment .is-medium.bp-custom-payment-amount-el-integration:focus {
1329 box-shadow: unset;
1330 }
1331
1332 /* Mobile */
1333 @media screen and (max-width: 768px) {
1334 .better-payment .payment-form-layout-3 .payment-method-checkbox img {
1335 margin-left: -35px;
1336 }
1337 .better-payment .payment-form-layout-1 .bp-three-items-enabled-wrap.field-payment_method .bp-radio-box,
1338 .better-payment .payment-form-layout-2 .bp-three-items-enabled-wrap.field-payment_method .bp-radio-box {
1339 display: unset;
1340 }
1341 .better-payment .payment-form-layout .button,
1342 .better-payment .form-content-section input,
1343 .better-payment .is-medium.input,
1344 .better-payment .is-medium.textarea,
1345 .better-payment .control.has-icons-left .input.is-medium ~ .icon,
1346 .better-payment .control.has-icons-left .select.is-medium ~ .icon,
1347 .better-payment .control.has-icons-right .input.is-medium ~ .icon,
1348 .better-payment .control.has-icons-right .select.is-medium ~ .icon {
1349 font-size: 16px;
1350 }
1351 }
1352 /* Tablet */
1353 @media screen and (min-width: 769px) {
1354 .better-payment .columns:not(.is-desktop) {
1355 display: flex;
1356 }
1357 .better-payment .column.is-three-quarters,
1358 .better-payment .column.is-three-quarters-tablet {
1359 flex: none;
1360 width: 75%;
1361 }
1362 .better-payment .column.is-two-thirds,
1363 .better-payment .column.is-two-thirds-tablet {
1364 flex: none;
1365 width: 66.6666%;
1366 }
1367 .better-payment .tile:not(.is-child) {
1368 display: flex;
1369 }
1370 .better-payment .tile.is-8 {
1371 flex: none;
1372 width: 66.66667%;
1373 }
1374 .better-payment .column.is-1,
1375 .better-payment .column.is-1-tablet {
1376 flex: none;
1377 width: 8.33333%;
1378 }
1379 .better-payment .column.is-2,
1380 .better-payment .column.is-2-tablet {
1381 flex: none;
1382 width: 16.66667%;
1383 }
1384 .better-payment .column.is-3,
1385 .better-payment .column.is-3-tablet {
1386 flex: none;
1387 width: 25%;
1388 }
1389 .better-payment .column.is-4,
1390 .better-payment .column.is-4-tablet {
1391 flex: none;
1392 width: 33.33333%;
1393 }
1394 .better-payment .column.is-5,
1395 .better-payment .column.is-5-tablet {
1396 flex: none;
1397 width: 41.66667%;
1398 }
1399 .better-payment .column.is-6,
1400 .better-payment .column.is-6-tablet {
1401 flex: none;
1402 width: 50%;
1403 }
1404 .better-payment .column.is-7,
1405 .better-payment .column.is-7-tablet {
1406 flex: none;
1407 width: 58.33333%;
1408 }
1409 .better-payment .column.is-8,
1410 .better-payment .column.is-8-tablet {
1411 flex: none;
1412 width: 66.66667%;
1413 }
1414 .better-payment .column.is-9,
1415 .better-payment .column.is-9-tablet {
1416 flex: none;
1417 width: 75%;
1418 }
1419 .better-payment .column.is-10,
1420 .better-payment .column.is-10-tablet {
1421 flex: none;
1422 width: 83.33333%;
1423 }
1424 .better-payment .column.is-11,
1425 .better-payment .column.is-11-tablet {
1426 flex: none;
1427 width: 91.66667%;
1428 }
1429 .better-payment .column.is-12,
1430 .better-payment .column.is-12-tablet {
1431 flex: none;
1432 width: 100%;
1433 }
1434 .better-payment .column.is-full,
1435 .better-payment .column.is-full-tablet {
1436 flex: none;
1437 width: 100%;
1438 }
1439 .better-payment .column.is-four-fifths,
1440 .better-payment .column.is-four-fifths-tablet {
1441 flex: none;
1442 width: 80%;
1443 }
1444 .better-payment .column.is-three-quarters,
1445 .better-payment .column.is-three-quarters-tablet {
1446 flex: none;
1447 width: 75%;
1448 }
1449 .better-payment .column.is-two-thirds,
1450 .better-payment .column.is-two-thirds-tablet {
1451 flex: none;
1452 width: 66.6666%;
1453 }
1454 .better-payment .column.is-three-fifths,
1455 .better-payment .column.is-three-fifths-tablet {
1456 flex: none;
1457 width: 60%;
1458 }
1459 .better-payment .column.is-half,
1460 .better-payment .column.is-half-tablet {
1461 flex: none;
1462 width: 50%;
1463 }
1464 .better-payment .column.is-two-fifths,
1465 .better-payment .column.is-two-fifths-tablet {
1466 flex: none;
1467 width: 40%;
1468 }
1469 .better-payment .column.is-one-third,
1470 .better-payment .column.is-one-third-tablet {
1471 flex: none;
1472 width: 33.3333%;
1473 }
1474 .better-payment .column.is-one-quarter,
1475 .better-payment .column.is-one-quarter-tablet {
1476 flex: none;
1477 width: 25%;
1478 }
1479 .better-payment .column.is-one-fifth,
1480 .better-payment .column.is-one-fifth-tablet {
1481 flex: none;
1482 width: 20%;
1483 }
1484 .better-payment .tile.is-vertical {
1485 flex-direction: column;
1486 }
1487 .better-payment .tile.is-parent {
1488 padding: 0.75rem;
1489 }
1490 .better-payment .column.is-offset-1,
1491 .better-payment .column.is-offset-1-tablet {
1492 margin-left: 8.33333%;
1493 }
1494 .better-payment .column.is-offset-2,
1495 .better-payment .column.is-offset-2-tablet {
1496 margin-left: 16.66667%;
1497 }
1498 .better-payment .column.is-offset-3,
1499 .better-payment .column.is-offset-3-tablet {
1500 margin-left: 25%;
1501 }
1502 .better-payment .column.is-offset-4,
1503 .better-payment .column.is-offset-4-tablet {
1504 margin-left: 33.33333%;
1505 }
1506 .better-payment .column.is-offset-5,
1507 .better-payment .column.is-offset-5-tablet {
1508 margin-left: 41.66667%;
1509 }
1510 .better-payment .column.is-offset-6,
1511 .better-payment .column.is-offset-6-tablet {
1512 margin-left: 50%;
1513 }
1514 .better-payment .column.is-offset-7,
1515 .better-payment .column.is-offset-7-tablet {
1516 margin-left: 58.33333%;
1517 }
1518 .better-payment .column.is-offset-8,
1519 .better-payment .column.is-offset-8-tablet {
1520 margin-left: 66.66667%;
1521 }
1522 .better-payment .column.is-offset-9,
1523 .better-payment .column.is-offset-9-tablet {
1524 margin-left: 75%;
1525 }
1526 .better-payment .column.is-offset-10,
1527 .better-payment .column.is-offset-10-tablet {
1528 margin-left: 83.33333%;
1529 }
1530 .better-payment .column.is-offset-11,
1531 .better-payment .column.is-offset-11-tablet {
1532 margin-left: 91.66667%;
1533 }
1534 .better-payment .column.is-offset-12,
1535 .better-payment .column.is-offset-12-tablet {
1536 margin-left: 100%;
1537 }
1538 .better-payment .tile.is-offset-2,
1539 .better-payment .tile.is-offset-2-tablet {
1540 margin-left: 16.66667%;
1541 }
1542 .better-payment .bp-modal .modal-card,
1543 .better-payment .bp-modal .modal-content {
1544 width: 740px;
1545 }
1546 }
1547 /* Desktop */
1548 @media screen and (min-width: 992px) {
1549 .better-payment .columns:not(.is-desktop) {
1550 display: flex;
1551 }
1552 .better-payment .column.is-1-desktop {
1553 flex: none;
1554 width: 8.33333%;
1555 }
1556 .better-payment .column.is-2-desktop {
1557 flex: none;
1558 width: 16.66667%;
1559 }
1560 .better-payment .column.is-3-desktop {
1561 flex: none;
1562 width: 25%;
1563 }
1564 .better-payment .column.is-4-desktop {
1565 flex: none;
1566 width: 33.33333%;
1567 }
1568 .better-payment .column.is-5-desktop {
1569 flex: none;
1570 width: 41.66667%;
1571 }
1572 .better-payment .column.is-6-desktop {
1573 flex: none;
1574 width: 50%;
1575 }
1576 .better-payment .column.is-7-desktop {
1577 flex: none;
1578 width: 58.33333%;
1579 }
1580 .better-payment .column.is-8-desktop {
1581 flex: none;
1582 width: 66.66667%;
1583 }
1584 .better-payment .column.is-9-desktop {
1585 flex: none;
1586 width: 75%;
1587 }
1588 .better-payment .column.is-10-desktop {
1589 flex: none;
1590 width: 83.33333%;
1591 }
1592 .better-payment .column.is-11-desktop {
1593 flex: none;
1594 width: 91.66667%;
1595 }
1596 .better-payment .column.is-12-desktop {
1597 flex: none;
1598 width: 100%;
1599 }
1600 .better-payment .bp-modal .modal-card,
1601 .better-payment .bp-modal .modal-content {
1602 width: 950px !important;
1603 }
1604 .better-payment .bp-modal .is-small .modal-card,
1605 .better-payment .bp-modal .is-small .modal-content {
1606 width: 550px;
1607 }
1608 }
1609 /* Large Desktop : widescreen */
1610 @media screen and (min-width: 1200px) {
1611 .better-payment .column.is-1-widescreen {
1612 flex: none;
1613 width: 8.33333%;
1614 }
1615 .better-payment .column.is-2-widescreen {
1616 flex: none;
1617 width: 16.66667%;
1618 }
1619 .better-payment .column.is-3-widescreen {
1620 flex: none;
1621 width: 25%;
1622 }
1623 .better-payment .column.is-4-widescreen {
1624 flex: none;
1625 width: 33.33333%;
1626 }
1627 .better-payment .column.is-5-widescreen {
1628 flex: none;
1629 width: 41.66667%;
1630 }
1631 .better-payment .column.is-6-widescreen {
1632 flex: none;
1633 width: 50%;
1634 }
1635 .better-payment .column.is-7-widescreen {
1636 flex: none;
1637 width: 58.33333%;
1638 }
1639 .better-payment .column.is-8-widescreen {
1640 flex: none;
1641 width: 66.66667%;
1642 }
1643 .better-payment .column.is-9-widescreen {
1644 flex: none;
1645 width: 75%;
1646 }
1647 .better-payment .column.is-10-widescreen {
1648 flex: none;
1649 width: 83.33333%;
1650 }
1651 .better-payment .column.is-11-widescreen {
1652 flex: none;
1653 width: 91.66667%;
1654 }
1655 .better-payment .column.is-12-widescreen {
1656 flex: none;
1657 width: 100%;
1658 }
1659 }
1660 /* Larger Desktop : fullhd */
1661 @media screen and (min-width: 1400px) {
1662 .better-payment .column.is-1-fullhd {
1663 flex: none;
1664 width: 8.33333%;
1665 }
1666 .better-payment .column.is-2-fullhd {
1667 flex: none;
1668 width: 16.66667%;
1669 }
1670 .better-payment .column.is-3-fullhd {
1671 flex: none;
1672 width: 25%;
1673 }
1674 .better-payment .column.is-4-fullhd {
1675 flex: none;
1676 width: 33.33333%;
1677 }
1678 .better-payment .column.is-5-fullhd {
1679 flex: none;
1680 width: 41.66667%;
1681 }
1682 .better-payment .column.is-6-fullhd {
1683 flex: none;
1684 width: 50%;
1685 }
1686 .better-payment .column.is-7-fullhd {
1687 flex: none;
1688 width: 58.33333%;
1689 }
1690 .better-payment .column.is-8-fullhd {
1691 flex: none;
1692 width: 66.66667%;
1693 }
1694 .better-payment .column.is-9-fullhd {
1695 flex: none;
1696 width: 75%;
1697 }
1698 .better-payment .column.is-10-fullhd {
1699 flex: none;
1700 width: 83.33333%;
1701 }
1702 .better-payment .column.is-11-fullhd {
1703 flex: none;
1704 width: 91.66667%;
1705 }
1706 .better-payment .column.is-12-fullhd {
1707 flex: none;
1708 width: 100%;
1709 }
1710 }
1711 /* Larger Desktop Custom : fullhd-custom */
1712 @media screen and (min-width: 1500px) {
1713 .better-payment .column.is-1-fullhd-custom {
1714 flex: none;
1715 width: 8.33333%;
1716 }
1717 .better-payment .column.is-2-fullhd-custom {
1718 flex: none;
1719 width: 16.66667%;
1720 }
1721 .better-payment .column.is-3-fullhd-custom {
1722 flex: none;
1723 width: 25%;
1724 }
1725 .better-payment .column.is-4-fullhd-custom {
1726 flex: none;
1727 width: 33.33333%;
1728 }
1729 .better-payment .column.is-5-fullhd-custom {
1730 flex: none;
1731 width: 41.66667%;
1732 }
1733 .better-payment .column.is-6-fullhd-custom {
1734 flex: none;
1735 width: 50%;
1736 }
1737 .better-payment .column.is-7-fullhd-custom {
1738 flex: none;
1739 width: 58.33333%;
1740 }
1741 .better-payment .column.is-8-fullhd-custom {
1742 flex: none;
1743 width: 66.66667%;
1744 }
1745 .better-payment .column.is-9-fullhd-custom {
1746 flex: none;
1747 width: 75%;
1748 }
1749 .better-payment .column.is-10-fullhd-custom {
1750 flex: none;
1751 width: 83.33333%;
1752 }
1753 .better-payment .column.is-11-fullhd-custom {
1754 flex: none;
1755 width: 91.66667%;
1756 }
1757 .better-payment .column.is-12-fullhd-custom {
1758 flex: none;
1759 width: 100%;
1760 }
1761 }
1762 /* BP Modal : Starts */
1763 .better-payment .bp-modal .modal,
1764 .better-payment .bp-modal .modal-background {
1765 bottom: 0;
1766 left: 0;
1767 position: absolute;
1768 right: 0;
1769 top: 0;
1770 }
1771
1772 .better-payment .bp-modal .modal {
1773 align-items: center;
1774 display: none;
1775 flex-direction: column;
1776 justify-content: center;
1777 overflow: hidden;
1778 position: fixed;
1779 z-index: 40;
1780 }
1781
1782 .better-payment .bp-modal .modal-background {
1783 background-color: rgba(10, 10, 10, 0.86);
1784 }
1785
1786 .better-payment .bp-modal .modal-card,
1787 .better-payment .bp-modal .modal-content {
1788 margin: 0 20px;
1789 max-height: calc(100vh - 160px);
1790 overflow: auto;
1791 position: relative;
1792 width: 100%;
1793 }
1794
1795 .better-payment .bp-modal .modal-card {
1796 display: flex;
1797 flex-direction: column;
1798 max-height: calc(100vh - 40px);
1799 overflow: hidden;
1800 }
1801
1802 .better-payment .bp-modal .modal-card-head {
1803 border-bottom: 1px solid #dbdbdb;
1804 border-top-left-radius: 6px;
1805 border-top-right-radius: 6px;
1806 }
1807
1808 .better-payment .bp-modal .modal-card-foot,
1809 .better-payment .bp-modal .modal-card-head {
1810 align-items: center;
1811 background-color: #f5f5f5;
1812 display: flex;
1813 flex-shrink: 0;
1814 justify-content: flex-end;
1815 padding: 15px 20px;
1816 position: relative;
1817 }
1818
1819 .better-payment .bp-modal .modal-card-body {
1820 -webkit-overflow-scrolling: touch;
1821 background-color: #fff;
1822 flex-grow: 1;
1823 flex-shrink: 1;
1824 overflow: auto;
1825 padding: 20px;
1826 }
1827
1828 .better-payment .bp-modal .modal-card-foot {
1829 border-bottom-left-radius: 6px;
1830 border-bottom-right-radius: 6px;
1831 border-top: 1px solid #dbdbdb;
1832 }
1833
1834 .better-payment .bp-modal .modal-card-title {
1835 color: #363636;
1836 flex-grow: 1;
1837 flex-shrink: 0;
1838 font-size: 1.5rem;
1839 line-height: 1;
1840 }
1841
1842 .better-payment .bp-modal .button,
1843 .better-payment .bp-modal .button:focus {
1844 outline: 0 !important;
1845 border-color: transparent !important;
1846 }
1847
1848 .better-payment .bp-modal .modal.is-active {
1849 display: flex;
1850 }
1851
1852 .better-payment .bp-modal .is-large.modal-close {
1853 height: 32px;
1854 max-height: 32px;
1855 max-width: 32px;
1856 min-height: 32px;
1857 min-width: 32px;
1858 width: 32px;
1859 }
1860
1861 .better-payment .bp-modal .delete,
1862 .better-payment .bp-modal .modal-close {
1863 -webkit-touch-callout: none;
1864 -webkit-user-select: none;
1865 -moz-user-select: none;
1866 -ms-user-select: none;
1867 user-select: none;
1868 -moz-appearance: none;
1869 -webkit-appearance: none;
1870 background-color: rgba(10, 10, 10, 0.2);
1871 border: none;
1872 border-radius: 9999px;
1873 cursor: pointer;
1874 pointer-events: auto;
1875 display: inline-block;
1876 flex-grow: 0;
1877 flex-shrink: 0;
1878 font-size: 0;
1879 height: 20px;
1880 max-height: 20px;
1881 max-width: 20px;
1882 min-height: 20px;
1883 min-width: 20px;
1884 outline: 0;
1885 position: relative;
1886 vertical-align: top;
1887 width: 20px;
1888 }
1889
1890 .better-payment .bp-modal .modal-close {
1891 background: 0 0;
1892 height: 40px;
1893 position: fixed;
1894 right: 20px;
1895 top: 52px;
1896 width: 40px;
1897 }
1898
1899 .better-payment .bp-modal .delete::before,
1900 .better-payment .bp-modal .modal-close::before {
1901 height: 2px;
1902 width: 50%;
1903 }
1904
1905 .better-payment .bp-modal .delete::after,
1906 .better-payment .bp-modal .modal-close::after {
1907 height: 50%;
1908 width: 2px;
1909 }
1910
1911 .better-payment .bp-modal .delete::after,
1912 .better-payment .bp-modal .delete::before,
1913 .better-payment .bp-modal .modal-close::after,
1914 .better-payment .bp-modal .modal-close::before {
1915 background-color: #fff;
1916 content: "";
1917 display: block;
1918 left: 50%;
1919 position: absolute;
1920 top: 50%;
1921 transform: translateX(-50%) translateY(-50%) rotate(45deg);
1922 transform-origin: center center;
1923 }
1924
1925 .better-payment .bp-modal .box {
1926 background-color: #fff;
1927 border-radius: 6px;
1928 box-shadow: 0 0.5em 1em -0.125em rgba(10, 10, 10, 0.1), 0 0 0 1px rgba(10, 10, 10, 0.02);
1929 color: #4a4a4a;
1930 display: block;
1931 padding: 1.25rem;
1932 }
1933
1934 .better-payment .bp-modal .delete:focus,
1935 .better-payment .bp-modal .delete:hover,
1936 .better-payment .bp-modal .modal-close:focus,
1937 .better-payment .bp-modal .modal-close:hover {
1938 background-color: rgba(10, 10, 10, 0.3);
1939 }
1940
1941 .better-payment .bp-modal .modal-card,
1942 .better-payment .bp-modal .modal-content {
1943 margin: 0 auto;
1944 max-height: calc(100vh - 40px);
1945 }
1946
1947 /* BP Modal : Ends */
1948 /* BP Transactions Page */
1949 .better-payment .file {
1950 align-items: stretch;
1951 display: flex;
1952 justify-content: flex-start;
1953 position: relative;
1954 }
1955 .better-payment .file.is-white .file-cta {
1956 background-color: #fff;
1957 border-color: transparent;
1958 color: #0a0a0a;
1959 }
1960 .better-payment .file.is-white.is-hovered .file-cta, .better-payment .file.is-white:hover .file-cta {
1961 background-color: #f9f9f9;
1962 border-color: transparent;
1963 color: #0a0a0a;
1964 }
1965 .better-payment .file.is-white.is-focused .file-cta, .better-payment .file.is-white:focus .file-cta {
1966 border-color: transparent;
1967 box-shadow: 0 0 0.5em rgba(255, 255, 255, 0.25);
1968 color: #0a0a0a;
1969 }
1970 .better-payment .file.is-white.is-active .file-cta, .better-payment .file.is-white:active .file-cta {
1971 background-color: #f2f2f2;
1972 border-color: transparent;
1973 color: #0a0a0a;
1974 }
1975 .better-payment .file.is-black .file-cta {
1976 background-color: #0a0a0a;
1977 border-color: transparent;
1978 color: #fff;
1979 }
1980 .better-payment .file.is-black.is-hovered .file-cta, .better-payment .file.is-black:hover .file-cta {
1981 background-color: #040404;
1982 border-color: transparent;
1983 color: #fff;
1984 }
1985 .better-payment .file.is-black.is-focused .file-cta, .better-payment .file.is-black:focus .file-cta {
1986 border-color: transparent;
1987 box-shadow: 0 0 0.5em rgba(10, 10, 10, 0.25);
1988 color: #fff;
1989 }
1990 .better-payment .file.is-black.is-active .file-cta, .better-payment .file.is-black:active .file-cta {
1991 background-color: #000;
1992 border-color: transparent;
1993 color: #fff;
1994 }
1995 .better-payment .file.is-light .file-cta {
1996 background-color: #f4f4f4;
1997 border-color: transparent;
1998 color: rgba(0, 0, 0, 0.7);
1999 }
2000 .better-payment .file.is-light.is-hovered .file-cta, .better-payment .file.is-light:hover .file-cta {
2001 background-color: #eee;
2002 border-color: transparent;
2003 color: rgba(0, 0, 0, 0.7);
2004 }
2005 .better-payment .file.is-light.is-focused .file-cta, .better-payment .file.is-light:focus .file-cta {
2006 border-color: transparent;
2007 box-shadow: 0 0 0.5em rgba(245, 245, 245, 0.25);
2008 color: rgba(0, 0, 0, 0.7);
2009 }
2010 .better-payment .file.is-light.is-active .file-cta, .better-payment .file.is-light:active .file-cta {
2011 background-color: #e8e8e8;
2012 border-color: transparent;
2013 color: rgba(0, 0, 0, 0.7);
2014 }
2015 .better-payment .file.is-dark .file-cta {
2016 background-color: #353535;
2017 border-color: transparent;
2018 color: #fff;
2019 }
2020 .better-payment .file.is-dark.is-hovered .file-cta, .better-payment .file.is-dark:hover .file-cta {
2021 background-color: #2f2f2f;
2022 border-color: transparent;
2023 color: #fff;
2024 }
2025 .better-payment .file.is-dark.is-focused .file-cta, .better-payment .file.is-dark:focus .file-cta {
2026 border-color: transparent;
2027 box-shadow: 0 0 0.5em rgba(54, 54, 54, 0.25);
2028 color: #fff;
2029 }
2030 .better-payment .file.is-dark.is-active .file-cta, .better-payment .file.is-dark:active .file-cta {
2031 background-color: #292929;
2032 border-color: transparent;
2033 color: #fff;
2034 }
2035 .better-payment .file.is-primary .file-cta {
2036 background-color: #00d1b1;
2037 border-color: transparent;
2038 color: #fff;
2039 }
2040 .better-payment .file.is-primary.is-hovered .file-cta, .better-payment .file.is-primary:hover .file-cta {
2041 background-color: #00c4a7;
2042 border-color: transparent;
2043 color: #fff;
2044 }
2045 .better-payment .file.is-primary.is-focused .file-cta, .better-payment .file.is-primary:focus .file-cta {
2046 border-color: transparent;
2047 box-shadow: 0 0 0.5em rgba(0, 209, 178, 0.25);
2048 color: #fff;
2049 }
2050 .better-payment .file.is-primary.is-active .file-cta, .better-payment .file.is-primary:active .file-cta {
2051 background-color: #00b89c;
2052 border-color: transparent;
2053 color: #fff;
2054 }
2055 .better-payment .file.is-link .file-cta {
2056 background-color: #475ec6;
2057 border-color: transparent;
2058 color: #fff;
2059 }
2060 .better-payment .file.is-link.is-hovered .file-cta, .better-payment .file.is-link:hover .file-cta {
2061 background-color: #3e56c4;
2062 border-color: transparent;
2063 color: #fff;
2064 }
2065 .better-payment .file.is-link.is-focused .file-cta, .better-payment .file.is-link:focus .file-cta {
2066 border-color: transparent;
2067 box-shadow: 0 0 0.5em rgba(72, 95, 199, 0.25);
2068 color: #fff;
2069 }
2070 .better-payment .file.is-link.is-active .file-cta, .better-payment .file.is-link:active .file-cta {
2071 background-color: #3a51bb;
2072 border-color: transparent;
2073 color: #fff;
2074 }
2075 .better-payment .file.is-info .file-cta {
2076 background-color: #3e8ed0;
2077 border-color: transparent;
2078 color: #fff;
2079 }
2080 .better-payment .file.is-info.is-hovered .file-cta, .better-payment .file.is-info:hover .file-cta {
2081 background-color: #3488ce;
2082 border-color: transparent;
2083 color: #fff;
2084 }
2085 .better-payment .file.is-info.is-focused .file-cta, .better-payment .file.is-info:focus .file-cta {
2086 border-color: transparent;
2087 box-shadow: 0 0 0.5em rgba(62, 142, 208, 0.25);
2088 color: #fff;
2089 }
2090 .better-payment .file.is-info.is-active .file-cta, .better-payment .file.is-info:active .file-cta {
2091 background-color: #3082c5;
2092 border-color: transparent;
2093 color: #fff;
2094 }
2095 .better-payment .file.is-success .file-cta {
2096 background-color: #47c68d;
2097 border-color: transparent;
2098 color: #fff;
2099 }
2100 .better-payment .file.is-success.is-hovered .file-cta, .better-payment .file.is-success:hover .file-cta {
2101 background-color: #3ec487;
2102 border-color: transparent;
2103 color: #fff;
2104 }
2105 .better-payment .file.is-success.is-focused .file-cta, .better-payment .file.is-success:focus .file-cta {
2106 border-color: transparent;
2107 box-shadow: 0 0 0.5em rgba(72, 199, 142, 0.25);
2108 color: #fff;
2109 }
2110 .better-payment .file.is-success.is-active .file-cta, .better-payment .file.is-success:active .file-cta {
2111 background-color: #3abb81;
2112 border-color: transparent;
2113 color: #fff;
2114 }
2115 .better-payment .file.is-warning .file-cta {
2116 background-color: #ffdf89;
2117 border-color: transparent;
2118 color: rgba(0, 0, 0, 0.7);
2119 }
2120 .better-payment .file.is-warning.is-hovered .file-cta, .better-payment .file.is-warning:hover .file-cta {
2121 background-color: #ffdc7d;
2122 border-color: transparent;
2123 color: rgba(0, 0, 0, 0.7);
2124 }
2125 .better-payment .file.is-warning.is-focused .file-cta, .better-payment .file.is-warning:focus .file-cta {
2126 border-color: transparent;
2127 box-shadow: 0 0 0.5em rgba(255, 224, 138, 0.25);
2128 color: rgba(0, 0, 0, 0.7);
2129 }
2130 .better-payment .file.is-warning.is-active .file-cta, .better-payment .file.is-warning:active .file-cta {
2131 background-color: #ffd970;
2132 border-color: transparent;
2133 color: rgba(0, 0, 0, 0.7);
2134 }
2135 .better-payment .file.is-danger .file-cta {
2136 background-color: #f14668;
2137 border-color: transparent;
2138 color: #fff;
2139 }
2140 .better-payment .file.is-danger.is-hovered .file-cta, .better-payment .file.is-danger:hover .file-cta {
2141 background-color: #f03a5f;
2142 border-color: transparent;
2143 color: #fff;
2144 }
2145 .better-payment .file.is-danger.is-focused .file-cta, .better-payment .file.is-danger:focus .file-cta {
2146 border-color: transparent;
2147 box-shadow: 0 0 0.5em rgba(241, 70, 104, 0.25);
2148 color: #fff;
2149 }
2150 .better-payment .file.is-danger.is-active .file-cta, .better-payment .file.is-danger:active .file-cta {
2151 background-color: #ef2e55;
2152 border-color: transparent;
2153 color: #fff;
2154 }
2155 .better-payment .file.is-expo .file-cta {
2156 background-color: #ffd257;
2157 border-color: transparent;
2158 color: #fff;
2159 }
2160 .better-payment .file.is-expo.is-hovered .file-cta, .better-payment .file.is-expo:hover .file-cta {
2161 background-color: #ffcf4a;
2162 border-color: transparent;
2163 color: #fff;
2164 }
2165 .better-payment .file.is-expo.is-focused .file-cta, .better-payment .file.is-expo:focus .file-cta {
2166 border-color: transparent;
2167 box-shadow: 0 0 0.5em rgba(255, 210, 87, 0.25);
2168 color: #fff;
2169 }
2170 .better-payment .file.is-expo.is-active .file-cta, .better-payment .file.is-expo:active .file-cta {
2171 background-color: #ffcb3e;
2172 border-color: transparent;
2173 color: #fff;
2174 }
2175 .better-payment .file.is-love .file-cta {
2176 background-color: #f14668;
2177 border-color: transparent;
2178 color: #fff;
2179 }
2180 .better-payment .file.is-love.is-hovered .file-cta, .better-payment .file.is-love:hover .file-cta {
2181 background-color: #f03a5f;
2182 border-color: transparent;
2183 color: #fff;
2184 }
2185 .better-payment .file.is-love.is-focused .file-cta, .better-payment .file.is-love:focus .file-cta {
2186 border-color: transparent;
2187 box-shadow: 0 0 0.5em rgba(241, 70, 104, 0.25);
2188 color: #fff;
2189 }
2190 .better-payment .file.is-love.is-active .file-cta, .better-payment .file.is-love:active .file-cta {
2191 background-color: #ef2e55;
2192 border-color: transparent;
2193 color: #fff;
2194 }
2195 .better-payment .file.is-patreon .file-cta {
2196 background-color: #f96854;
2197 border-color: transparent;
2198 color: #fff;
2199 }
2200 .better-payment .file.is-patreon.is-hovered .file-cta, .better-payment .file.is-patreon:hover .file-cta {
2201 background-color: #f95d48;
2202 border-color: transparent;
2203 color: #fff;
2204 }
2205 .better-payment .file.is-patreon.is-focused .file-cta, .better-payment .file.is-patreon:focus .file-cta {
2206 border-color: transparent;
2207 box-shadow: 0 0 0.5em rgba(249, 104, 84, 0.25);
2208 color: #fff;
2209 }
2210 .better-payment .file.is-patreon.is-active .file-cta, .better-payment .file.is-patreon:active .file-cta {
2211 background-color: #f8523b;
2212 border-color: transparent;
2213 color: #fff;
2214 }
2215 .better-payment .file.is-rss .file-cta {
2216 background-color: #f26522;
2217 border-color: transparent;
2218 color: #fff;
2219 }
2220 .better-payment .file.is-rss.is-hovered .file-cta, .better-payment .file.is-rss:hover .file-cta {
2221 background-color: #f15d16;
2222 border-color: transparent;
2223 color: #fff;
2224 }
2225 .better-payment .file.is-rss.is-focused .file-cta, .better-payment .file.is-rss:focus .file-cta {
2226 border-color: transparent;
2227 box-shadow: 0 0 0.5em rgba(242, 101, 34, 0.25);
2228 color: #fff;
2229 }
2230 .better-payment .file.is-rss.is-active .file-cta, .better-payment .file.is-rss:active .file-cta {
2231 background-color: #ed560e;
2232 border-color: transparent;
2233 color: #fff;
2234 }
2235 .better-payment .file.is-bleeding .file-cta {
2236 background-color: #abf47c;
2237 border-color: transparent;
2238 color: rgba(0, 0, 0, 0.7);
2239 }
2240 .better-payment .file.is-bleeding.is-hovered .file-cta, .better-payment .file.is-bleeding:hover .file-cta {
2241 background-color: #a3f370;
2242 border-color: transparent;
2243 color: rgba(0, 0, 0, 0.7);
2244 }
2245 .better-payment .file.is-bleeding.is-focused .file-cta, .better-payment .file.is-bleeding:focus .file-cta {
2246 border-color: transparent;
2247 box-shadow: 0 0 0.5em rgba(171, 244, 124, 0.25);
2248 color: rgba(0, 0, 0, 0.7);
2249 }
2250 .better-payment .file.is-bleeding.is-active .file-cta, .better-payment .file.is-bleeding:active .file-cta {
2251 background-color: #9cf264;
2252 border-color: transparent;
2253 color: rgba(0, 0, 0, 0.7);
2254 }
2255 .better-payment .file.is-sass .file-cta {
2256 background-color: #bf4080;
2257 border-color: transparent;
2258 color: #fff;
2259 }
2260 .better-payment .file.is-sass.is-hovered .file-cta, .better-payment .file.is-sass:hover .file-cta {
2261 background-color: #b53d7a;
2262 border-color: transparent;
2263 color: #fff;
2264 }
2265 .better-payment .file.is-sass.is-focused .file-cta, .better-payment .file.is-sass:focus .file-cta {
2266 border-color: transparent;
2267 box-shadow: 0 0 0.5em rgba(191, 64, 128, 0.25);
2268 color: #fff;
2269 }
2270 .better-payment .file.is-sass.is-active .file-cta, .better-payment .file.is-sass:active .file-cta {
2271 background-color: #ac3a73;
2272 border-color: transparent;
2273 color: #fff;
2274 }
2275 .better-payment .file.is-amazon .file-cta {
2276 background-color: #ffd863;
2277 border-color: transparent;
2278 color: rgba(0, 0, 0, 0.7);
2279 }
2280 .better-payment .file.is-amazon.is-hovered .file-cta, .better-payment .file.is-amazon:hover .file-cta {
2281 background-color: #ffd556;
2282 border-color: transparent;
2283 color: rgba(0, 0, 0, 0.7);
2284 }
2285 .better-payment .file.is-amazon.is-focused .file-cta, .better-payment .file.is-amazon:focus .file-cta {
2286 border-color: transparent;
2287 box-shadow: 0 0 0.5em rgba(255, 216, 99, 0.25);
2288 color: rgba(0, 0, 0, 0.7);
2289 }
2290 .better-payment .file.is-amazon.is-active .file-cta, .better-payment .file.is-amazon:active .file-cta {
2291 background-color: #ffd24a;
2292 border-color: transparent;
2293 color: rgba(0, 0, 0, 0.7);
2294 }
2295 .better-payment .file.is-sponsor .file-cta {
2296 background-color: #ea4aaa;
2297 border-color: transparent;
2298 color: #fff;
2299 }
2300 .better-payment .file.is-sponsor.is-hovered .file-cta, .better-payment .file.is-sponsor:hover .file-cta {
2301 background-color: #e93fa5;
2302 border-color: transparent;
2303 color: #fff;
2304 }
2305 .better-payment .file.is-sponsor.is-focused .file-cta, .better-payment .file.is-sponsor:focus .file-cta {
2306 border-color: transparent;
2307 box-shadow: 0 0 0.5em rgba(234, 74, 170, 0.25);
2308 color: #fff;
2309 }
2310 .better-payment .file.is-sponsor.is-active .file-cta, .better-payment .file.is-sponsor:active .file-cta {
2311 background-color: #e7339f;
2312 border-color: transparent;
2313 color: #fff;
2314 }
2315 .better-payment .file.is-twitter .file-cta {
2316 background-color: #55acee;
2317 border-color: transparent;
2318 color: #fff;
2319 }
2320 .better-payment .file.is-twitter.is-hovered .file-cta, .better-payment .file.is-twitter:hover .file-cta {
2321 background-color: #49a6ed;
2322 border-color: transparent;
2323 color: #fff;
2324 }
2325 .better-payment .file.is-twitter.is-focused .file-cta, .better-payment .file.is-twitter:focus .file-cta {
2326 border-color: transparent;
2327 box-shadow: 0 0 0.5em rgba(85, 172, 238, 0.25);
2328 color: #fff;
2329 }
2330 .better-payment .file.is-twitter.is-active .file-cta, .better-payment .file.is-twitter:active .file-cta {
2331 background-color: #3ea1ec;
2332 border-color: transparent;
2333 color: #fff;
2334 }
2335 .better-payment .file.is-videos .file-cta {
2336 background-color: #47c68d;
2337 border-color: transparent;
2338 color: #fff;
2339 }
2340 .better-payment .file.is-videos.is-hovered .file-cta, .better-payment .file.is-videos:hover .file-cta {
2341 background-color: #3ec487;
2342 border-color: transparent;
2343 color: #fff;
2344 }
2345 .better-payment .file.is-videos.is-focused .file-cta, .better-payment .file.is-videos:focus .file-cta {
2346 border-color: transparent;
2347 box-shadow: 0 0 0.5em rgba(72, 199, 142, 0.25);
2348 color: #fff;
2349 }
2350 .better-payment .file.is-videos.is-active .file-cta, .better-payment .file.is-videos:active .file-cta {
2351 background-color: #3abb81;
2352 border-color: transparent;
2353 color: #fff;
2354 }
2355 .better-payment .file.is-extensions .file-cta {
2356 background-color: #3e8ed0;
2357 border-color: transparent;
2358 color: #fff;
2359 }
2360 .better-payment .file.is-extensions.is-hovered .file-cta, .better-payment .file.is-extensions:hover .file-cta {
2361 background-color: #3488ce;
2362 border-color: transparent;
2363 color: #fff;
2364 }
2365 .better-payment .file.is-extensions.is-focused .file-cta, .better-payment .file.is-extensions:focus .file-cta {
2366 border-color: transparent;
2367 box-shadow: 0 0 0.5em rgba(62, 142, 208, 0.25);
2368 color: #fff;
2369 }
2370 .better-payment .file.is-extensions.is-active .file-cta, .better-payment .file.is-extensions:active .file-cta {
2371 background-color: #3082c5;
2372 border-color: transparent;
2373 color: #fff;
2374 }
2375 .better-payment .file.is-bootstrap .file-cta {
2376 background-color: #6f5499;
2377 border-color: transparent;
2378 color: #fff;
2379 }
2380 .better-payment .file.is-bootstrap.is-hovered .file-cta, .better-payment .file.is-bootstrap:hover .file-cta {
2381 background-color: #694f91;
2382 border-color: transparent;
2383 color: #fff;
2384 }
2385 .better-payment .file.is-bootstrap.is-focused .file-cta, .better-payment .file.is-bootstrap:focus .file-cta {
2386 border-color: transparent;
2387 box-shadow: 0 0 0.5em rgba(111, 84, 153, 0.25);
2388 color: #fff;
2389 }
2390 .better-payment .file.is-bootstrap.is-active .file-cta, .better-payment .file.is-bootstrap:active .file-cta {
2391 background-color: #634b89;
2392 border-color: transparent;
2393 color: #fff;
2394 }
2395 .better-payment .file.is-small {
2396 font-size: 0.75rem;
2397 }
2398 .better-payment .file.is-normal {
2399 font-size: 1rem;
2400 }
2401 .better-payment .file.is-medium {
2402 font-size: 1.25rem;
2403 }
2404 .better-payment .file.is-medium .file-icon .fa {
2405 font-size: 21px;
2406 }
2407 .better-payment .file.is-large {
2408 font-size: 1.5rem;
2409 }
2410 .better-payment .file.is-large .file-icon .fa {
2411 font-size: 28px;
2412 }
2413 .better-payment .file.has-name .file-cta {
2414 border-bottom-right-radius: 0;
2415 border-top-right-radius: 0;
2416 }
2417 .better-payment .file.has-name .file-name {
2418 border-bottom-left-radius: 0;
2419 border-top-left-radius: 0;
2420 }
2421 .better-payment .file.has-name.is-empty .file-cta {
2422 border-radius: 0.375em;
2423 }
2424 .better-payment .file.has-name.is-empty .file-name {
2425 display: none;
2426 }
2427 .better-payment .file.is-boxed .file-label {
2428 flex-direction: column;
2429 }
2430 .better-payment .file.is-boxed .file-cta {
2431 flex-direction: column;
2432 height: auto;
2433 padding: 1em 3em;
2434 }
2435 .better-payment .file.is-boxed .file-name {
2436 border-width: 0 1px 1px;
2437 }
2438 .better-payment .file.is-boxed .file-icon {
2439 height: 1.5em;
2440 width: 1.5em;
2441 }
2442 .better-payment .file.is-boxed .file-icon .fa {
2443 font-size: 21px;
2444 }
2445 .better-payment .file.is-boxed.is-small .file-icon .fa {
2446 font-size: 14px;
2447 }
2448 .better-payment .file.is-boxed.is-medium .file-icon .fa {
2449 font-size: 28px;
2450 }
2451 .better-payment .file.is-boxed.is-large .file-icon .fa {
2452 font-size: 35px;
2453 }
2454 .better-payment .file.is-boxed.has-name .file-cta {
2455 border-radius: 0.375em 0.375em 0 0;
2456 }
2457 .better-payment .file.is-boxed.has-name .file-name {
2458 border-radius: 0 0 0.375em 0.375em;
2459 border-width: 0 1px 1px;
2460 }
2461 .better-payment .file.is-centered {
2462 justify-content: center;
2463 }
2464 .better-payment .file.is-fullwidth .file-label {
2465 width: 100%;
2466 }
2467 .better-payment .file.is-fullwidth .file-name {
2468 flex-grow: 1;
2469 max-width: none;
2470 }
2471 .better-payment .file.is-right {
2472 justify-content: flex-end;
2473 }
2474 .better-payment .file.is-right .file-cta {
2475 border-radius: 0 0.375em 0.375em 0;
2476 }
2477 .better-payment .file.is-right .file-name {
2478 border-radius: 0.375em 0 0 0.375em;
2479 border-width: 1px 0 1px 1px;
2480 order: -1;
2481 }
2482 .better-payment .file-label {
2483 align-items: stretch;
2484 display: flex;
2485 cursor: pointer;
2486 justify-content: flex-start;
2487 overflow: hidden;
2488 position: relative;
2489 }
2490 .better-payment .file-label:hover .file-cta {
2491 background-color: #eee;
2492 color: #353535;
2493 }
2494 .better-payment .file-label:hover .file-name {
2495 border-color: #d5d5d5;
2496 }
2497 .better-payment .file-label:active .file-cta {
2498 background-color: #e8e8e8;
2499 color: #353535;
2500 }
2501 .better-payment .file-label:active .file-name {
2502 border-color: #cfcfcf;
2503 }
2504 .better-payment .file-input {
2505 height: 100%;
2506 left: 0;
2507 opacity: 0;
2508 outline: 0;
2509 position: absolute;
2510 top: 0;
2511 width: 100%;
2512 }
2513 .better-payment .file-cta, .better-payment .file-name {
2514 border-color: #dbdbdb;
2515 border-radius: 0.375em;
2516 font-size: 1em;
2517 padding-left: 1em;
2518 padding-right: 1em;
2519 white-space: nowrap;
2520 }
2521 .better-payment .file-cta {
2522 background-color: #f4f4f4;
2523 color: #494949;
2524 }
2525 .better-payment .file-name {
2526 border-color: #dbdbdb;
2527 border-style: solid;
2528 border-width: 1px 1px 1px 0;
2529 display: block;
2530 max-width: 16em;
2531 overflow: hidden;
2532 text-align: inherit;
2533 text-overflow: ellipsis;
2534 }
2535 .better-payment .file-icon {
2536 align-items: center;
2537 display: flex;
2538 height: 1em;
2539 justify-content: center;
2540 margin-right: 0.5em;
2541 width: 1em;
2542 }
2543 .better-payment .file-icon .fa {
2544 font-size: 14px;
2545 }
2546 .better-payment .is-flex {
2547 display: flex !important;
2548 }
2549 .better-payment .is-flex-direction-row {
2550 flex-direction: row !important;
2551 }
2552 .better-payment .is-flex-direction-row-reverse {
2553 flex-direction: row-reverse !important;
2554 }
2555 .better-payment .is-flex-direction-column {
2556 flex-direction: column !important;
2557 }
2558 .better-payment .is-flex-direction-column-reverse {
2559 flex-direction: column-reverse !important;
2560 }
2561 .better-payment .is-flex-wrap-nowrap {
2562 flex-wrap: nowrap !important;
2563 }
2564 .better-payment .is-flex-wrap-wrap {
2565 flex-wrap: wrap !important;
2566 }
2567 .better-payment .is-flex-wrap-wrap-reverse {
2568 flex-wrap: wrap-reverse !important;
2569 }
2570 .better-payment .is-justify-content-flex-start {
2571 justify-content: flex-start !important;
2572 }
2573 .better-payment .is-justify-content-flex-end {
2574 justify-content: flex-end !important;
2575 }
2576 .better-payment .is-justify-content-center {
2577 justify-content: center !important;
2578 }
2579 .better-payment .is-justify-content-space-between {
2580 justify-content: space-between !important;
2581 }
2582 .better-payment .is-justify-content-space-around {
2583 justify-content: space-around !important;
2584 }
2585 .better-payment .is-justify-content-space-evenly {
2586 justify-content: space-evenly !important;
2587 }
2588 .better-payment .is-justify-content-start {
2589 justify-content: start !important;
2590 }
2591 .better-payment .is-justify-content-end {
2592 justify-content: end !important;
2593 }
2594 .better-payment .is-justify-content-left {
2595 justify-content: left !important;
2596 }
2597 .better-payment .is-justify-content-right {
2598 justify-content: right !important;
2599 }
2600 .better-payment .is-align-content-flex-start {
2601 align-content: flex-start !important;
2602 }
2603 .better-payment .is-align-content-flex-end {
2604 align-content: flex-end !important;
2605 }
2606 .better-payment .is-align-content-center {
2607 align-content: center !important;
2608 }
2609 .better-payment .is-align-content-space-between {
2610 align-content: space-between !important;
2611 }
2612 .better-payment .is-align-content-space-around {
2613 align-content: space-around !important;
2614 }
2615 .better-payment .is-align-content-space-evenly {
2616 align-content: space-evenly !important;
2617 }
2618 .better-payment .is-align-content-stretch {
2619 align-content: stretch !important;
2620 }
2621 .better-payment .is-align-content-start {
2622 align-content: start !important;
2623 }
2624 .better-payment .is-align-content-end {
2625 align-content: end !important;
2626 }
2627 .better-payment .is-align-content-baseline {
2628 align-content: baseline !important;
2629 }
2630 .better-payment .is-align-items-stretch {
2631 align-items: stretch !important;
2632 }
2633 .better-payment .is-align-items-flex-start {
2634 align-items: flex-start !important;
2635 }
2636 .better-payment .is-align-items-flex-end {
2637 align-items: flex-end !important;
2638 }
2639 .better-payment .is-align-items-center {
2640 align-items: center !important;
2641 }
2642 .better-payment .is-align-items-baseline {
2643 align-items: baseline !important;
2644 }
2645 .better-payment .is-align-items-start {
2646 align-items: start !important;
2647 }
2648 .better-payment .is-align-items-end {
2649 align-items: end !important;
2650 }
2651 .better-payment .is-align-items-self-start {
2652 align-items: self-start !important;
2653 }
2654 .better-payment .is-align-items-self-end {
2655 align-items: self-end !important;
2656 }
2657 .better-payment .is-align-self-auto {
2658 align-self: auto !important;
2659 }
2660 .better-payment .is-align-self-flex-start {
2661 align-self: flex-start !important;
2662 }
2663 .better-payment .is-align-self-flex-end {
2664 align-self: flex-end !important;
2665 }
2666 .better-payment .is-align-self-center {
2667 align-self: center !important;
2668 }
2669 .better-payment .is-align-self-baseline {
2670 align-self: baseline !important;
2671 }
2672 .better-payment .is-align-self-stretch {
2673 align-self: stretch !important;
2674 }
2675 .better-payment .is-flex-grow-0 {
2676 flex-grow: 0 !important;
2677 }
2678 .better-payment .is-flex-grow-1 {
2679 flex-grow: 1 !important;
2680 }
2681 .better-payment .is-flex-grow-2 {
2682 flex-grow: 2 !important;
2683 }
2684 .better-payment .is-flex-grow-3 {
2685 flex-grow: 3 !important;
2686 }
2687 .better-payment .is-flex-grow-4 {
2688 flex-grow: 4 !important;
2689 }
2690 .better-payment .is-flex-grow-5 {
2691 flex-grow: 5 !important;
2692 }
2693 .better-payment .is-flex-shrink-0 {
2694 flex-shrink: 0 !important;
2695 }
2696 .better-payment .is-flex-shrink-1 {
2697 flex-shrink: 1 !important;
2698 }
2699 .better-payment .is-flex-shrink-2 {
2700 flex-shrink: 2 !important;
2701 }
2702 .better-payment .is-flex-shrink-3 {
2703 flex-shrink: 3 !important;
2704 }
2705 .better-payment .is-flex-shrink-4 {
2706 flex-shrink: 4 !important;
2707 }
2708 .better-payment .is-flex-shrink-5 {
2709 flex-shrink: 5 !important;
2710 }
2711 .better-payment .is-clearfix::after {
2712 clear: both;
2713 content: " ";
2714 display: table;
2715 }
2716 .better-payment .is-pulled-left {
2717 float: left !important;
2718 }
2719 .better-payment .is-pulled-right {
2720 float: right !important;
2721 }
2722 .better-payment .is-radiusless {
2723 border-radius: 0 !important;
2724 }
2725 .better-payment .is-shadowless {
2726 box-shadow: none !important;
2727 }
2728 .better-payment .is-clickable {
2729 cursor: pointer !important;
2730 pointer-events: all !important;
2731 }
2732 .better-payment .is-clipped {
2733 overflow: hidden !important;
2734 }
2735 .better-payment .is-relative {
2736 position: relative !important;
2737 }
2738 .better-payment .file.no-file-name .file-cta {
2739 border-radius: 0.375em;
2740 }
2741 .better-payment .button.is-success {
2742 background-color: #47c68d;
2743 border-color: transparent;
2744 color: #fff;
2745 }
2746 @media screen and (max-width: 768px) {
2747 .better-payment .is-flex-mobile {
2748 display: flex !important;
2749 }
2750 }
2751 @media screen and (min-width: 769px), print {
2752 .better-payment .is-flex-tablet {
2753 display: flex !important;
2754 }
2755 }
2756 @media screen and (min-width: 769px) and (max-width: 1023px) {
2757 .better-payment .is-flex-tablet-only {
2758 display: flex !important;
2759 }
2760 }
2761 @media screen and (max-width: 1023px) {
2762 .better-payment .is-flex-touch {
2763 display: flex !important;
2764 }
2765 }
2766 @media screen and (min-width: 1024px) {
2767 .better-payment .is-flex-desktop {
2768 display: flex !important;
2769 }
2770 }
2771 @media screen and (min-width: 1024px) and (max-width: 1215px) {
2772 .better-payment .is-flex-desktop-only {
2773 display: flex !important;
2774 }
2775 }
2776 @media screen and (min-width: 1216px) {
2777 .better-payment .is-flex-widescreen {
2778 display: flex !important;
2779 }
2780 }
2781 @media screen and (min-width: 1216px) and (max-width: 1407px) {
2782 .better-payment .is-flex-widescreen-only {
2783 display: flex !important;
2784 }
2785 }
2786 @media screen and (min-width: 1408px) {
2787 .better-payment .is-flex-fullhd {
2788 display: flex !important;
2789 }
2790 }
2791
2792 .field-display-inline:nth-child(odd) {
2793 margin-right: 1%;
2794 }
2795
2796 .field-display-inline:nth-child(even) {
2797 margin-left: 1%;
2798 }
2799
2800 .better-payment .d-none {
2801 display: none !important;
2802 }
2803 .better-payment .flex {
2804 display: flex;
2805 }
2806 .better-payment .flex-col {
2807 flex-direction: column;
2808 }
2809 .better-payment .flex-1 {
2810 flex: 1;
2811 }
2812 .better-payment .justify-between {
2813 justify-content: space-between;
2814 }
2815 .better-payment .justify-center {
2816 justify-content: center;
2817 }
2818 .better-payment .justify-end {
2819 justify-content: flex-end;
2820 }
2821 .better-payment .items-start {
2822 align-items: flex-start;
2823 }
2824 .better-payment .items-center {
2825 align-items: center;
2826 }
2827 .better-payment .items-end {
2828 align-items: flex-end;
2829 }
2830 .better-payment .min-h-full {
2831 min-height: 100vh;
2832 }
2833 .better-payment .gap-1 {
2834 gap: 4px;
2835 }
2836 .better-payment .gap-2 {
2837 gap: 8px;
2838 }
2839 .better-payment .gap-3 {
2840 gap: 12px;
2841 }
2842 .better-payment .gap-4 {
2843 gap: 16px;
2844 }
2845 .better-payment .gap-5 {
2846 gap: 20px;
2847 }
2848 .better-payment .gap-6 {
2849 gap: 24px;
2850 }
2851 .better-payment .gap-10 {
2852 gap: 40px;
2853 }
2854 .better-payment .min-w-300 {
2855 min-width: 300px !important;
2856 }
2857 .better-payment .max-w-300 {
2858 max-width: 300px !important;
2859 }
2860 .better-payment .pointer {
2861 cursor: pointer;
2862 }
2863 .better-payment h2 {
2864 font-size: 26px;
2865 line-height: 1.2em;
2866 font-weight: 700;
2867 font-family: "IBM Plex Sans", sans-serif;
2868 color: #2B2748;
2869 }
2870 .better-payment .bp-dashboard-header h2 {
2871 font-weight: 400;
2872 }
2873 .better-payment button {
2874 font-size: 14px;
2875 line-height: 1.1em;
2876 color: #6859FA;
2877 display: inline-flex;
2878 align-items: center;
2879 justify-content: center;
2880 padding: 8px 16px;
2881 background: #F0EEFE;
2882 border-radius: 20px;
2883 border: none;
2884 transition: all 0.25s ease-in-out;
2885 cursor: pointer;
2886 }
2887 .better-payment button.primary-btn {
2888 font-size: 16px;
2889 font-weight: 500;
2890 padding: 12px 18px;
2891 border-radius: 8px;
2892 color: #6859FA;
2893 }
2894 .better-payment button.complete {
2895 color: #FFFFFF;
2896 background: #0ECA86;
2897 }
2898 .better-payment button.incomplete {
2899 color: #FFFFFF;
2900 background: #FFDA15;
2901 }
2902 .better-payment button.active {
2903 color: #00C679;
2904 background: rgba(0, 198, 123, 0.1019607843);
2905 border-radius: 20px;
2906 }
2907 .better-payment button.inactive {
2908 color: #EDAA00;
2909 background: rgba(255, 209, 0, 0.1019607843);
2910 }
2911 .better-payment button.cancel {
2912 color: #FF0000;
2913 background: rgba(255, 0, 0, 0.1490196078);
2914 }
2915 .better-payment .bp--sidebar-wrapper {
2916 padding: 24px;
2917 background: #fff;
2918 min-width: 270px;
2919 min-height: 100vh;
2920 border: 1px solid #f1f1f1;
2921 }
2922 .better-payment .bp--author {
2923 display: flex;
2924 align-items: center;
2925 gap: 16px;
2926 margin-bottom: 40px;
2927 }
2928 .better-payment .bp--author h5 {
2929 font-size: 20px;
2930 font-weight: 500;
2931 line-height: 1.1em;
2932 color: #48506D;
2933 }
2934 .better-payment .bp--sidebar-nav-list {
2935 display: flex;
2936 flex-direction: column;
2937 gap: 12px;
2938 }
2939 .better-payment .bp--sidebar-nav {
2940 display: flex;
2941 align-items: center;
2942 gap: 12px;
2943 padding: 4px 8px;
2944 cursor: pointer;
2945 }
2946 .better-payment .bp--nav-icon {
2947 display: inline-flex;
2948 }
2949 .better-payment span.bp--nav-icon svg {
2950 width: 20px;
2951 height: 20px;
2952 }
2953 .better-payment .bp--sidebar-nav.active span.bp--nav-icon svg path {
2954 stroke: #000000;
2955 }
2956 .better-payment .bp--sidebar-nav .bp--nav-text {
2957 color: #48506D;
2958 font-size: 16px;
2959 font-weight: 500;
2960 transition: ease-in-out 0.25s;
2961 }
2962 .better-payment .bp--sidebar-nav.active .bp--nav-text {
2963 color: #000000;
2964 }
2965 .better-payment .bp--sidebar-nav:hover .bp--nav-text {
2966 color: #2B2748;
2967 }
2968 .better-payment .bp--sidebar-nav.active {
2969 color: #2B2748;
2970 }
2971 .better-payment .bp--db-main-wrapper {
2972 padding-right: 24px;
2973 flex-basis: calc(100% - 294px);
2974 max-width: calc(100% - 294px);
2975 }
2976 .better-payment .bp--db-header {
2977 display: flex;
2978 justify-content: space-between;
2979 align-items: center;
2980 padding: 16px 24px;
2981 background: #fff;
2982 margin-bottom: 24px;
2983 border: 1px solid #f1f1f1;
2984 }
2985 .better-payment .bp--db-header img {
2986 max-width: 200px;
2987 }
2988 .better-payment .bp--table-wrapper {
2989 display: flex;
2990 flex-direction: column;
2991 overflow: auto;
2992 }
2993 .better-payment .bp--table-header {
2994 background: rgba(110, 88, 247, 0.1);
2995 border: none;
2996 padding: 10px 24px;
2997 min-width: 1442px;
2998 }
2999 .better-payment .bp--table-header .th,
3000 .better-payment .bp--table-header .th h5 {
3001 font-size: 16px;
3002 line-height: 1.2em;
3003 font-weight: 500;
3004 color: #2A3256;
3005 }
3006 .better-payment .bp--table-body {
3007 padding: 10px 24px;
3008 min-width: 1442px;
3009 background: #FFFFFF;
3010 border-left: 1px solid #f1f1f1;
3011 border-right: 1px solid #f1f1f1;
3012 }
3013 .better-payment .bp--table-body {
3014 border-bottom: 1px solid rgba(110, 88, 247, 0.1);
3015 }
3016 .better-payment .bp--table-body .td h5,
3017 .better-payment .bp--table-body .td h5 span {
3018 font-size: 16px;
3019 font-weight: 400;
3020 line-height: 1.2em;
3021 color: #2A3256;
3022 }
3023 .better-payment .bp--table-body .td p {
3024 font-size: 14px;
3025 color: #48506D;
3026 display: inline-flex;
3027 }
3028 .better-payment .bp--table-body .td span {
3029 font-size: 13px;
3030 color: #797E90;
3031 }
3032 .better-payment .bp--table-body .price {
3033 font-size: 18px;
3034 line-height: 1em;
3035 font-weight: 500;
3036 color: #2B2748;
3037 padding-right: 4px;
3038 }
3039 .better-payment .td.details i {
3040 font-size: 16px;
3041 color: #48506D;
3042 }
3043 .better-payment .td.details .product--img {
3044 max-width: 24px;
3045 }
3046 .better-payment .td.details .source--img {
3047 max-width: 80px;
3048 }
3049 .better-payment .th.details,
3050 .better-payment .td.details {
3051 min-width: 130px;
3052 max-width: 130px;
3053 flex: 1;
3054 }
3055 .better-payment .th.details.user-name,
3056 .better-payment .td.details.user-name {
3057 max-width: 200px;
3058 }
3059 .better-payment .transactions .th.details:first-child,
3060 .better-payment .transactions .td.details:first-child {
3061 min-width: 170px;
3062 }
3063 .better-payment .transactions .th.details:nth-child(2),
3064 .better-payment .transactions .td.details:nth-child(2) {
3065 min-width: 220px;
3066 max-width: 220px;
3067 }
3068 .better-payment .transactions .th.details:nth-child(4),
3069 .better-payment .transactions .td.details:nth-child(4) {
3070 min-width: 220px;
3071 max-width: 220px;
3072 }
3073 .better-payment .bp--table-body .td .action-icon {
3074 border-radius: 4px;
3075 display: flex;
3076 align-items: center;
3077 justify-content: center;
3078 width: 48px;
3079 height: 36px;
3080 background: rgba(110, 88, 247, 0.1);
3081 }
3082 .better-payment .bp--table-body .td span.action-icon i {
3083 font-size: 20px;
3084 line-height: 1.2em;
3085 color: #6e58f7;
3086 }
3087 .better-payment .bp-flexbox-container {
3088 display: flex;
3089 align-items: center;
3090 gap: 5px;
3091 }
3092 .better-payment .bp-shortend-text {
3093 width: 200px;
3094 white-space: nowrap;
3095 overflow: hidden;
3096 text-overflow: ellipsis;
3097 }
3098 .better-payment .bp--table-wrapper .bp--table-header {
3099 min-width: 1640px;
3100 }
3101 .better-payment .bp--table-wrapper .bp--table-header.bp-min_width-1300 {
3102 min-width: 1300px;
3103 padding-left: 14px;
3104 padding-right: 14px;
3105 }
3106 .better-payment .bp--table-wrapper .bp--table-header .th.details.email {
3107 max-width: 200px;
3108 min-width: 200px;
3109 }
3110 .better-payment .bp--table-wrapper .bp--table-header .th.details.transaction {
3111 max-width: 200px;
3112 min-width: 200px;
3113 }
3114 .better-payment .bp--table-wrapper .bp--table-header .th.user-name {
3115 max-width: 200px;
3116 min-width: 200px;
3117 }
3118 .better-payment .bp--table-wrapper .bp--table-body {
3119 min-width: 1640px;
3120 }
3121 .better-payment .bp--table-wrapper .bp--table-body.bp-min_width-1300 {
3122 min-width: 1300px;
3123 padding-left: 14px;
3124 padding-right: 14px;
3125 }
3126 .better-payment .bp--table-wrapper .bp--table-body .td p {
3127 align-items: center;
3128 gap: 4px;
3129 }
3130 .better-payment .bp--table-wrapper .bp--table-body .td span {
3131 font-size: 14px;
3132 color: #48506d;
3133 }
3134 .better-payment .bp--table-wrapper .bp--table-body .td.details.email {
3135 max-width: 200px;
3136 min-width: 200px;
3137 }
3138 .better-payment .bp--table-wrapper .bp--table-body .td.details.email p span:first-child {
3139 max-width: 170px;
3140 white-space: nowrap;
3141 overflow: hidden;
3142 text-overflow: ellipsis;
3143 }
3144 .better-payment .bp--table-wrapper .bp--table-body .td.details.transaction {
3145 max-width: 200px;
3146 min-width: 200px;
3147 }
3148 .better-payment .bp--table-wrapper .bp--table-body .td.details.transaction p span:first-child {
3149 max-width: 170px;
3150 white-space: nowrap;
3151 overflow: hidden;
3152 text-overflow: ellipsis;
3153 }
3154 .better-payment .bp-copy-clipboard-info,
3155 .better-payment .bp-email-copy-clipboard-info {
3156 color: rgb(110, 88, 247) !important;
3157 }
3158 .better-payment .better-payment-user-dashboard-container h1,
3159 .better-payment .better-payment-user-dashboard-container h2,
3160 .better-payment .better-payment-user-dashboard-container h3,
3161 .better-payment .better-payment-user-dashboard-container h4,
3162 .better-payment .better-payment-user-dashboard-container h5,
3163 .better-payment .better-payment-user-dashboard-container h6,
3164 .better-payment .better-payment-user-dashboard-container p {
3165 margin: 0;
3166 padding: 0;
3167 }
3168 .better-payment .bp-logo {
3169 margin-bottom: 55px;
3170 text-align: center;
3171 }
3172 .better-payment .bp-logo img {
3173 max-height: 36px;
3174 width: auto;
3175 }
3176 .better-payment .bp-row {
3177 display: flex;
3178 flex-wrap: wrap;
3179 margin-left: -12px;
3180 margin-right: -12px;
3181 }
3182 .better-payment .bp-col {
3183 position: relative;
3184 width: 100%;
3185 min-height: 1px;
3186 padding-left: 12px;
3187 padding-right: 12px;
3188 }
3189 .better-payment .bp-col1 {
3190 width: 8.333333333%;
3191 }
3192 .better-payment .bp-col_2 {
3193 width: 16.66666666%;
3194 }
3195 .better-payment .bp-col_3 {
3196 width: 20%;
3197 }
3198 .better-payment .bp-col_4 {
3199 width: 25%;
3200 }
3201 .better-payment .bp-col_5 {
3202 width: 33.333333333%;
3203 }
3204 .better-payment .bp-col_6 {
3205 width: 41.3333333%;
3206 }
3207 .better-payment .bp-col_7 {
3208 width: 50%;
3209 }
3210 .better-payment .bp-col_8 {
3211 width: 58.333333333%;
3212 }
3213 .better-payment .bp-col_9 {
3214 width: 66.666666666%;
3215 }
3216 .better-payment .bp-col_10 {
3217 width: 75%;
3218 }
3219 .better-payment .bp-col_11 {
3220 width: 83.333333333%;
3221 }
3222 .better-payment .bp-col_12 {
3223 width: 91.666666666%;
3224 }
3225 .better-payment .bp-col_13 {
3226 width: 100%;
3227 }
3228 .better-payment .w-80 {
3229 width: 80px;
3230 text-align: left;
3231 }
3232 .better-payment .w-195 {
3233 flex-basis: 195px;
3234 }
3235 .better-payment .w-325 {
3236 flex-basis: 325px;
3237 }
3238 .better-payment .w-214 {
3239 flex-basis: 214px;
3240 }
3241 .better-payment .w-130 {
3242 flex-basis: 130px;
3243 }
3244 .better-payment .w-140 {
3245 flex-basis: 140px;
3246 }
3247 .better-payment .bp-amount_wrapper {
3248 margin-bottom: 24px;
3249 }
3250 .better-payment .td-product_logo {
3251 line-height: 0;
3252 max-width: 90px;
3253 }
3254 .better-payment .td-product_logo img {
3255 object-fit: contain;
3256 height: 20px;
3257 width: 100%;
3258 }
3259 .better-payment .bp-dashboard_wrapper {
3260 width: 100%;
3261 background-color: #FFFFFF;
3262 }
3263 .better-payment .bp-dashboard_wrapper .bp-dashboard_title {
3264 font-size: 32px;
3265 font-weight: 600;
3266 text-align: left;
3267 color: #2A3256;
3268 margin-bottom: 36px;
3269 }
3270 .better-payment .bp-amount {
3271 width: 100%;
3272 height: auto;
3273 padding: 0px;
3274 border-radius: 12px;
3275 border: 1px solid #EAECF0;
3276 overflow: hidden;
3277 }
3278 .better-payment .bp-amount h4 {
3279 margin: 16px;
3280 font-size: 16px;
3281 font-weight: 500;
3282 color: #667085;
3283 }
3284 .better-payment .bp-amount_price {
3285 font-size: 30px;
3286 font-weight: 600;
3287 text-align: left;
3288 color: #2A3256;
3289 padding: 16px;
3290 }
3291 .better-payment .bp-transaction {
3292 padding: 10px 16px;
3293 background-color: #FAFAFC;
3294 width: 100%;
3295 font-size: 13px;
3296 font-weight: 400;
3297 color: #667085;
3298 }
3299 @media (min-width: 1500px) {
3300 .better-payment .bp-amount_price {
3301 font-size: 40px;
3302 }
3303 .better-payment .bp-amount h4 {
3304 font-size: 18px;
3305 }
3306 .better-payment .bp-transaction {
3307 font-size: 16px;
3308 }
3309 }
3310 .better-payment .bp-transaction_number {
3311 font-weight: 500;
3312 color: #6E58F7;
3313 }
3314 .better-payment .bp-chart_header .name h3 {
3315 color: #2A3256;
3316 font-size: 20px;
3317 font-weight: 600;
3318 }
3319 .better-payment .bp-analytics_chart-wrapper {
3320 margin-bottom: 24px;
3321 }
3322 .better-payment .bp-analytics_box {
3323 background-color: #ffffff;
3324 border: 1px solid #EAECF0;
3325 border-radius: 16px;
3326 padding: 20px 24px;
3327 }
3328 .better-payment .bp-chart_header {
3329 border-bottom: 1px solid #EAECF0;
3330 padding-top: 8px;
3331 padding-bottom: 16px;
3332 margin-bottom: 24px;
3333 }
3334 .better-payment .bp-form_control {
3335 border: 1px solid #D9E1F4;
3336 border-radius: 8px;
3337 padding: 11px 16px;
3338 }
3339 .better-payment .bp-form_control option {
3340 font-size: 14px;
3341 font-weight: 500;
3342 color: #48506D;
3343 }
3344 .better-payment .filter-btn {
3345 padding: 8px 16px 8px 16px;
3346 border-radius: 8px;
3347 }
3348 .better-payment .bp-recent_box {
3349 background-color: #ffffff;
3350 border: 1px solid #EAECF0;
3351 border-radius: 16px;
3352 padding: 0 16px;
3353 }
3354 .better-payment .bp-recent_header {
3355 padding: 16px 0;
3356 border-bottom: 1px solid #EAECF0;
3357 margin-bottom: 16px;
3358 }
3359 .better-payment .bp-recent_header span {
3360 line-height: 0;
3361 }
3362 .better-payment .bp-view_all-btn {
3363 font-size: 14px;
3364 font-weight: 500;
3365 color: #48506D;
3366 border: 1px solid #D9E1F4;
3367 border-radius: 4px;
3368 padding: 6px 16px;
3369 text-decoration: none;
3370 }
3371 .better-payment .bp-recent_header-title {
3372 color: #2A3256;
3373 font-size: 16px;
3374 font-weight: 600;
3375 }
3376 .better-payment .bp-th {
3377 background-color: #FAFAFC;
3378 border-radius: 4px;
3379 padding: 9px 12px 9px 12px;
3380 margin-bottom: 4px;
3381 }
3382 .better-payment .bp-th h5 {
3383 font-size: 14px;
3384 font-weight: 500;
3385 color: #667085;
3386 }
3387 .better-payment .bp-recent_body {
3388 padding-bottom: 16px;
3389 }
3390 .better-payment .bp-product_scroll {
3391 min-height: 334px;
3392 max-height: 334px;
3393 overflow: auto;
3394 }
3395 .better-payment .td-product {
3396 gap: 6px;
3397 padding: 9px 11px;
3398 }
3399 .better-payment .td-product_name {
3400 font-size: 12px;
3401 font-weight: 500;
3402 color: #2A3256;
3403 margin-bottom: 4px;
3404 }
3405 .better-payment .td-details {
3406 font-size: 10px;
3407 font-weight: 400;
3408 color: #667085;
3409 }
3410 .better-payment .bp-subscription_box {
3411 background-color: #ffffff;
3412 border: 1px solid #EAECF0;
3413 border-radius: 16px;
3414 padding: 0 16px;
3415 }
3416 .better-payment .bp-subscription_box-th {
3417 border-bottom: 1px solid #EAECF0;
3418 padding: 16px 0;
3419 margin-bottom: 20px;
3420 }
3421 .better-payment .bp-subscription_th {
3422 padding: 12px;
3423 background: #FAFAFC;
3424 margin-bottom: 6px;
3425 }
3426 .better-payment .bp-subscription_title {
3427 color: #2A3256;
3428 font-size: 16px;
3429 font-weight: 600;
3430 }
3431 .better-payment .bp-subscription_th h4 {
3432 color: #667085;
3433 font-size: 14px;
3434 font-weight: 500;
3435 text-align: left;
3436 }
3437 .better-payment .bp-subscription_td {
3438 padding: 15px 0px 15px 12px;
3439 }
3440 .better-payment .bp-subscription_td .bp-plan_info h4 {
3441 color: #2A3256;
3442 font-size: 14px;
3443 font-weight: 500;
3444 line-height: 14px;
3445 margin-bottom: 5px;
3446 }
3447 .better-payment .bp-subscription_td .bp-plan_info p {
3448 color: #48506D;
3449 font-size: 10px;
3450 font-weight: 400;
3451 line-height: 10px;
3452 }
3453 .better-payment .bp-subscription_td .starter-plan,
3454 .better-payment .bp-subscription_td .due-plan {
3455 color: #797E90;
3456 font-size: 14px;
3457 font-weight: 400;
3458 }
3459 .better-payment .bp-subscription_td button {
3460 border-radius: 5px;
3461 font-size: 10px;
3462 font-weight: 500;
3463 padding: 5px 11px;
3464 border: 1px solid #9DD0FF;
3465 background: rgba(0, 133, 255, 0.1019607843);
3466 color: #0085FF;
3467 }
3468 .better-payment .bp-subscription_td .active {
3469 color: #00C679;
3470 background: rgba(0, 198, 123, 0.1019607843);
3471 border: 1px solid #A2ECCF;
3472 }
3473 .better-payment .bp-subscription_td .inactive {
3474 border: 1px solid #FFEB91;
3475 color: #EDAA00;
3476 background-color: rgba(255, 209, 0, 0.1019607843);
3477 }
3478 .better-payment .bp-subscription_product-price {
3479 display: flex;
3480 align-items: end;
3481 gap: 2px;
3482 }
3483 .better-payment .bp-subscription_product-td {
3484 border-bottom: 1px solid rgba(110, 88, 247, 0.1);
3485 }
3486 .better-payment .bp-subscription_product-td:last-child {
3487 border: none;
3488 }
3489 .better-payment .bp-subscription_product-price span:first-child {
3490 color: #2B2748;
3491 font-size: 18px;
3492 font-weight: 500;
3493 }
3494 .better-payment .bp-subscription_product-price span:last-child {
3495 color: #797E90;
3496 font-family: "IBM Plex Sans", sans-serif;
3497 font-size: 10.2px;
3498 font-weight: 400;
3499 }
3500 .better-payment .bp-subscripthon_doughnut-box {
3501 margin-bottom: 48px;
3502 justify-content: center;
3503 }
3504 .better-payment .bp-total_title {
3505 color: #667085;
3506 font-size: 16px;
3507 font-weight: 500;
3508 position: absolute;
3509 }
3510 .better-payment .bp-total_count {
3511 font-size: 56px;
3512 font-weight: 600;
3513 text-align: center;
3514 position: absolute;
3515 }
3516 .better-payment .better-payment-user-dashboard-container .dashboard-tab-wrapper .bp-total_count {
3517 margin-bottom: 35px;
3518 }
3519 .better-payment .bp-multi-graph {
3520 width: 400px;
3521 height: 200px;
3522 position: relative;
3523 color: #fff;
3524 font-size: 22px;
3525 font-weight: 600;
3526 display: flex;
3527 align-items: flex-end;
3528 justify-content: center;
3529 overflow: hidden;
3530 box-sizing: border-box;
3531 }
3532 .better-payment .bp-multi-graph:before {
3533 content: "";
3534 width: 400px;
3535 height: 200px;
3536 border: 30px solid rgba(0, 0, 0, 0.15);
3537 border-bottom: none;
3538 position: absolute;
3539 box-sizing: border-box;
3540 transform-origin: 50% 0%;
3541 border-radius: 300px 300px 0 0;
3542 left: 0;
3543 top: 0;
3544 }
3545 .better-payment .bp-graph {
3546 width: 400px;
3547 height: 200px;
3548 border: 30px solid var(--fill);
3549 border-top: none;
3550 position: absolute;
3551 transform-origin: 50% 0%;
3552 border-radius: 0 0 300px 300px;
3553 left: 0;
3554 top: 100%;
3555 z-index: 5;
3556 animation: 1s fillGraphAnimation ease-in;
3557 transform: rotate(calc(1deg * var(--percentage) * 1.8));
3558 box-sizing: border-box;
3559 cursor: pointer;
3560 }
3561 .better-payment .bp-graph:after {
3562 content: attr(data-name) " " counter(varible) "%";
3563 counter-reset: varible var(--percentage);
3564 background: var(--fill);
3565 box-sizing: border-box;
3566 border-radius: 2px;
3567 color: #fff;
3568 font-weight: 200;
3569 font-size: 12px;
3570 height: 20px;
3571 padding: 3px 5px;
3572 position: absolute;
3573 left: 0;
3574 top: 0;
3575 transform: rotate(calc(-1deg * var(--percentage) * 1.8)) translate(-30px, 0);
3576 transition: 0.2s ease-in;
3577 transform-origin: 0 50%;
3578 opacity: 0;
3579 }
3580 @keyframes fillGraphAnimation {
3581 0% {
3582 transform: rotate(0deg);
3583 }
3584 50% {
3585 transform: rotate(180deg);
3586 }
3587 }
3588 .better-payment .bp-doughnut_info {
3589 position: absolute;
3590 width: 132px;
3591 height: auto;
3592 background-color: rgba(0, 0, 0, 0.8509803922);
3593 border-radius: 2px;
3594 padding: 12px;
3595 left: 0;
3596 top: 0;
3597 z-index: 99;
3598 opacity: 0;
3599 cursor: pointer;
3600 transition: all 0.5s;
3601 }
3602 .better-payment .bp-multi-graph:hover .bp-doughnut_info {
3603 opacity: 1;
3604 }
3605 .better-payment .bp-doughnut_info .bp-doughnut_date {
3606 font-size: 9.28px;
3607 font-weight: 500;
3608 color: #fff;
3609 margin-bottom: 7px;
3610 }
3611 .better-payment .bp-doughnut_info .bp-dougnut_color-info {
3612 color: #fff;
3613 font-size: 7.95px;
3614 font-weight: 500;
3615 }
3616 .better-payment .bp-doughnut_info .bp-dougnut_color-info div {
3617 display: inline-block;
3618 width: 9px;
3619 height: 9px;
3620 border-radius: 1px;
3621 background-color: #fff;
3622 padding: 2px;
3623 margin: 5px 5px 5px 0;
3624 }
3625 .better-payment .bp-doughnut_info div .color-B {
3626 background-color: #8673FF;
3627 }
3628 .better-payment .bp-doughnut_info div .color-Y {
3629 background-color: #FFCF66;
3630 }
3631 .better-payment .bp-doughnut_info div .color-R {
3632 background-color: #FF5060;
3633 }
3634 .better-payment .p-0 {
3635 padding: 0 !important;
3636 }
3637 .better-payment .mb-0 {
3638 margin-bottom: 0 !important;
3639 }
3640 .better-payment .pb-0 {
3641 padding-bottom: 0 !important;
3642 }
3643 .better-payment .pl-0 {
3644 padding-left: 0 !important;
3645 }
3646 .better-payment .w-auto {
3647 min-width: auto !important;
3648 width: auto !important;
3649 }
3650 .better-payment .border-bottom_active {
3651 border-left: none !important;
3652 border-right: none !important;
3653 border-top: none !important;
3654 }
3655 .better-payment .min-w_600 {
3656 min-width: 580px !important;
3657 }
3658 .better-payment .line-height-0 {
3659 line-height: 0;
3660 }
3661 .better-payment .better-payment-transaction-import {
3662 margin-bottom: 5px;
3663 }
3664 @media only screen and (max-width: 1200px) {
3665 .better-payment .bp-amount h4,
3666 .better-payment .bp-transaction {
3667 font-size: 14px;
3668 }
3669 .better-payment .bp-amount_price {
3670 font-size: 32px;
3671 }
3672 .better-payment .bp-subscription_wrapper .bp-col_7 {
3673 width: 100%;
3674 }
3675 .better-payment .bp-subscription_box {
3676 margin-bottom: 24px;
3677 }
3678 .better-payment .bp-analytics_chart-wrapper .bp-col_10,
3679 .better-payment .bp-analytics_chart-wrapper .bp-col_4 {
3680 width: 100%;
3681 }
3682 .better-payment .bp-analytics_box {
3683 margin-bottom: 24px;
3684 }
3685 }
3686 @media only screen and (max-width: 1024px) {
3687 .better-payment .bp-logo {
3688 margin-bottom: 45px;
3689 }
3690 .better-payment .bp-amount_wrapper .bp-col_4 {
3691 width: 50%;
3692 }
3693 .better-payment .bp-amount {
3694 margin-bottom: 24px;
3695 }
3696 .better-payment .bp-chart_header .name h3 {
3697 font-size: 16px;
3698 }
3699 .better-payment .bp-th,
3700 .better-payment .bp-td {
3701 justify-content: space-between;
3702 }
3703 .better-payment .bp-th {
3704 padding: 9px 0px 9px 12px;
3705 }
3706 }
3707 @media only screen and (max-width: 800px) {
3708 .better-payment .flex-wrap {
3709 flex-wrap: wrap !important;
3710 }
3711 .better-payment .bp-amount_wrapper .bp-col_4 {
3712 width: 100% !important;
3713 }
3714 .better-payment .bp-multi-graph {
3715 width: 200px !important;
3716 height: 100px !important;
3717 }
3718 .better-payment .bp-multi-graph:before {
3719 width: 200px !important;
3720 height: 100px !important;
3721 }
3722 .better-payment .bp-graph {
3723 width: 200px !important;
3724 height: 100px !important;
3725 }
3726 .better-payment .better-payment-user-dashboard-container .dashboard-tab-wrapper .bp-total_count {
3727 margin-bottom: 20px;
3728 }
3729 .better-payment .bp-total_count {
3730 font-size: 28px !important;
3731 }
3732 .better-payment .bp-total_title {
3733 font-size: 10px !important;
3734 }
3735 }
3736 @media only screen and (max-width: 1024px) {
3737 .better-payment .gap-2 {
3738 gap: 4px;
3739 }
3740 .better-payment .gap-3 {
3741 gap: 6px;
3742 }
3743 .better-payment .gap-4 {
3744 gap: 8px;
3745 }
3746 .better-payment .gap-5 {
3747 gap: 12px;
3748 }
3749 .better-payment .gap-6 {
3750 gap: 16px;
3751 }
3752 .better-payment .gap-10 {
3753 gap: 24px;
3754 }
3755 .better-payment h2 {
3756 font-size: 20px;
3757 }
3758 .better-payment button {
3759 font-size: 12px;
3760 padding: 7px 12px;
3761 }
3762 .better-payment button.primary-btn {
3763 font-size: 14px;
3764 padding: 10px 16px;
3765 }
3766 .better-payment .bp--sidebar-wrapper {
3767 min-width: 200px;
3768 }
3769 .better-payment .bp--sidebar-nav-list {
3770 gap: 10px;
3771 }
3772 .better-payment .bp--sidebar-nav {
3773 gap: 8px;
3774 }
3775 .better-payment .bp--author {
3776 gap: 12px;
3777 margin-bottom: 40px;
3778 }
3779 .better-payment span.bp--nav-icon svg {
3780 width: 20px;
3781 height: 20px;
3782 }
3783 .better-payment .bp--sidebar-nav .bp--nav-text {
3784 font-size: 14px;
3785 }
3786 .better-payment .bp--db-main-wrapper {
3787 padding-right: 16px;
3788 flex-basis: calc(100% - 216px);
3789 max-width: calc(100% - 216px);
3790 }
3791 .better-payment .bp--db-header {
3792 padding: 12px 20px;
3793 margin-bottom: 16px;
3794 }
3795 .better-payment .bp--table-body {
3796 padding: 10px 20px;
3797 }
3798 .better-payment .bp--table-body .td .action-icon {
3799 width: 36px;
3800 height: 30px;
3801 }
3802 .better-payment .bp--table-header .th {
3803 font-size: 14px;
3804 }
3805 .better-payment .bp--table-body .td p {
3806 font-size: 12px;
3807 }
3808 .better-payment .bp--table-body .td span.action-icon i {
3809 font-size: 16px;
3810 }
3811 }
3812 .better-payment .bp-no_subscription-text {
3813 font-size: 14px;
3814 color: #48506d;
3815 font-weight: 400;
3816 }
3817 .better-payment .td-product_price span {
3818 font-size: 13px;
3819 font-weight: 600;
3820 color: #2a3256;
3821 }
3822 .better-payment .padding-0 {
3823 padding: 0px;
3824 }
3825 .better-payment .bp-hidden-xs {
3826 display: block;
3827 }
3828 .better-payment .bp-visible-xs {
3829 display: none;
3830 }
3831 .better-payment {
3832 /* Media Queries : Start */
3833 }
3834 @media (max-width: 767.98px) {
3835 .better-payment .bp-hidden-xs {
3836 display: none;
3837 }
3838 .better-payment .bp-visible-xs {
3839 display: block;
3840 }
3841 .better-payment .bp--db-main-wrapper {
3842 width: 100%;
3843 max-width: 100%;
3844 flex-basis: 100%;
3845 padding-right: 0px;
3846 }
3847 .better-payment .better-payment-user-dashboard-sidebar {
3848 position: absolute;
3849 top: 0;
3850 left: 0;
3851 z-index: 999;
3852 height: 100%;
3853 }
3854 .better-payment .bp-overlay {
3855 position: absolute;
3856 top: 0;
3857 bottom: 0;
3858 left: 0;
3859 right: 0;
3860 background-color: rgba(0, 0, 0, 0.5);
3861 z-index: 1;
3862 display: none;
3863 }
3864 .better-payment .bp-dashboard-hamburger {
3865 background: transparent;
3866 cursor: pointer;
3867 display: flex;
3868 align-items: center;
3869 }
3870 }
3871 .better-payment {
3872 /* Media Queries : End */
3873 }
3874
3875 .better-payment-warning {
3876 font-size: 13px;
3877 line-height: 18px;
3878 background-color: #f3f0ca;
3879 color: #886726;
3880 padding: 10px;
3881 border-radius: 3px;
3882 }
3883
3884 .better-payment-dynamic-value-info {
3885 word-break: break-word;
3886 }
3887
3888 div.bp-thank_page-custom-logo_wrapper-error svg {
3889 width: 70px;
3890 height: 70px;
3891 background: rgba(238, 96, 89, 0.1019607843);
3892 padding: 10px;
3893 border-radius: 16px;
3894 }
3895 div.bp-thank_page-custom-logo_wrapper-error svg path {
3896 stroke: #F44336;
3897 fill: #F44336;
3898 }
3899
3900 .bp-thank_page div.bp-thank_page-custom-logo_wrapper-success svg {
3901 width: 70px;
3902 height: 70px;
3903 background: rgba(107, 89, 238, 0.1019607843);
3904 padding: 10px;
3905 border-radius: 16px;
3906 }
3907 .bp-thank_page div.bp-thank_page-custom-logo_wrapper-success svg path {
3908 stroke: #6B59EE;
3909 fill: #6B59EE;
3910 }
3911
3912 .bp-thank_page-logo {
3913 display: flex;
3914 align-items: center;
3915 justify-content: center;
3916 }
3917
3918 div.bp-thank_page-custom-logo_wrapper-success.pf-block {
3919 display: flex;
3920 align-items: center;
3921 justify-content: center;
3922 line-height: 0;
3923 width: 70px;
3924 height: 70px;
3925 background: rgba(107, 89, 238, 0.1019607843);
3926 padding: 10px;
3927 border-radius: 16px;
3928 }
3929 div.bp-thank_page-custom-logo_wrapper-success.pf-block span,
3930 div.bp-thank_page-custom-logo_wrapper-success.pf-block i {
3931 font-size: 42px;
3932 color: #6B59EE;
3933 height: auto;
3934 width: auto;
3935 }
3936
3937 div.bp-thank_page-custom-logo_wrapper-error.pf-block {
3938 display: flex;
3939 align-items: center;
3940 justify-content: center;
3941 line-height: 0;
3942 width: 70px;
3943 height: 70px;
3944 background: rgba(238, 96, 89, 0.1019607843);
3945 padding: 10px;
3946 border-radius: 16px;
3947 }
3948 div.bp-thank_page-custom-logo_wrapper-error.pf-block span,
3949 div.bp-thank_page-custom-logo_wrapper-error.pf-block i {
3950 font-size: 42px;
3951 color: #F44336;
3952 height: auto;
3953 width: auto;
3954 }
3955
3956 .better-payment a {
3957 text-decoration: none;
3958 }
3959