PluginProbe
Imagify Image Optimization: Optimize Images | Compress & Convert to WebP/AVIF / 2.2
Imagify Image Optimization: Optimize Images | Compress & Convert to WebP/AVIF v2.2
2.3.4 2.3.3 2.3.2 2.3.1 2.3.0 2.2.9 2.2.8 trunk 1.10 1.3.3 1.3.4 1.3.5 1.3.5.1 1.3.5.2 1.3.6 1.3.6.1 1.4 1.4.1 1.4.2 1.4.3 1.4.4 1.4.5 1.4.6 1.4.7 1.5 All 103 releases
imagify / assets / css / pricing-modal.css

pricing-modal.css in Imagify Image Optimization: Optimize Images | Compress & Convert to WebP/AVIF 2.2, at assets/css/pricing-modal.css

1,341 lines 28.8 KB
No matching file
Up and down to move Enter to open Esc to close
Raw Download Zip
1 /* Flexbox re-groups */
2 .imagify-modal-cols,
3 .imagify-border-styled,
4 .imagify-offer-header,
5 .imagify-payment-modal .imagify-modal-content,
6 .imagify-flex-table,
7 .imagify-tabs {
8 display: -webkit-box;
9 display: -webkit-flex;
10 display: -ms-flexbox;
11 display: flex;
12 -webkit-box-orient: horizontal;
13 -webkit-box-direction: normal;
14 -webkit-flex-direction: row;
15 -ms-flex-direction: row;
16 flex-direction: row;
17 }
18 .imagify-modal-cols,
19 .imagify-border-styled {
20 -webkit-box-pack: center;
21 -webkit-justify-content: center;
22 -ms-flex-pack: center;
23 justify-content: center;
24 -webkit-box-align: center;
25 -webkit-align-items: center;
26 -ms-flex-align: center;
27 align-items: center;
28 }
29
30 .imagify-payment-modal {
31 text-align: center;
32 color: #7A8996;
33 }
34 .imagify-payment-modal * {
35 box-sizing: border-box;
36 }
37 .imagify-modal-loader {
38 position: absolute;
39 top: 0; left: 0; right: 0; bottom: 0;
40 background: #fff url('../images/loader-balls.svg') center no-repeat;
41 z-index: 10;
42 }
43 .imagify-payment-modal .imagify-modal-content {
44 width: 980px;
45 max-width: 100%;
46 min-width: 925px;
47 padding: 0;
48 }
49 .imagify-modal-content.imagify-iframe-viewing {
50 width: 980px;
51 height: 672px;
52 overflow: hidden;
53 }
54 .imagify-iframe-viewing #imagify-payment-process-view {
55 width: 980px;
56 height: 668px;
57 }
58 .imagify-payment-modal .imagify-modal-main {
59 width: 70%;
60 }
61 .imagify-iframe-viewing .imagify-modal-main {
62 width: auto;
63 }
64 .imagify-payment-modal .imagify-modal-content.imagify-success-viewing {
65 min-width: auto;
66 width: 450px;
67 min-height: 300px;
68 }
69 .imagify-success-viewing .imagify-modal-main {
70 width: 100%;
71 }
72 .imagify-payment-modal .imagify-modal-sidebar {
73 width: 30%;
74 padding: 15px 20px;
75 background: #1F2332;
76 color: #FFF;
77 }
78 .imagify-modal-content.imagify-iframe-viewing .imagify-modal-sidebar,
79 .imagify-modal-content.imagify-success-viewing .imagify-modal-sidebar {
80 display: none;
81 }
82 .imagify-modal-section {
83 padding: 0 25px;
84 }
85 .imagify-modal-section.section-gray {
86 margin: 0 0 1em;
87 padding: 10px 25px 15px;
88 background: #F6F7FB;
89 }
90 .imagify-tabs-contents .section-gray {
91 padding: 8px 25px 10px;
92 }
93 .imagify-modal-section .imagify-modal-title:first-child {
94 margin-top: 1em;
95 margin-bottom: 1.5em;
96 }
97 .imagify-modal-section.section-gray .imagify-modal-title {
98 margin-top: .5em;
99 margin-bottom: .5em;
100 }
101 .imagify-modal-title {
102 font-size: 1.8em;
103 }
104 .imagify-modal-title .imagify-inner-sub-title {
105 display: block;
106 font-size: .56em;
107 }
108 .imagify-analyzing .imagify-numbers-calc,
109 .imagify-numbers-notcalc,
110 .imagify-modal-section.imagify-analyzing .imagify-modal-cols,
111 .imagify-modal-section .imagify-loader {
112 display: none;
113 }
114 .imagify-analyzing .imagify-numbers-notcalc,
115 .imagify-modal-section.imagify-analyzing .imagify-loader {
116 display: block;
117 }
118 .imagify-modal-section .imagify-loader {
119 margin: 2em auto;
120 }
121
122 .imagify-border-styled {
123 width: 200px;
124 margin: 0 auto;
125 color: #8BC34A;
126 font-weight: bold;
127 font-size: 0.925em;
128 }
129 .imagify-border-styled:before,
130 .imagify-border-styled:after {
131 content: "";
132 height: 1px;
133 background: rgba(0,0,0,.1);
134 -webkit-flex-basis: 40px;
135 -ms-flex-preferred-size: 40px;
136 flex-basis: 40px;
137 }
138 .imagify-border-styled:before {
139 margin-right: 5px;
140 }
141 .imagify-border-styled:after {
142 margin-left: 5px;
143 }
144 .imagify-big-number {
145 font-size: 3.7em;
146 font-weight: bold;
147 margin: -3px 0;
148 color: #4A4A4A;
149 line-height: 1;
150 }
151 .imagify-payment-modal strong {
152 font-weight: bold;
153 color: #4A4A4A;
154 }
155
156 .imagify-popin-message {
157 padding: 5px 15px;
158 text-align: left;
159 }
160 .imagify-popin-message.imagify-error p {
161 color: #FFF;
162 }
163
164 .imagify-small-options {
165 width: 300px;
166 margin: 1em auto .5em;
167 background: #338EA6;
168 border-radius: 4px;
169 }
170
171 .imagify-small-options input[type="radio"]:not(:checked) + label,
172 .imagify-small-options input[type="radio"]:checked + label {
173 padding: 8px 10px;
174 font-size: 13px;
175 color: #FFF;
176 box-shadow: none;
177 border-left: 0;
178 }
179
180 .imagify-small-options input[type="radio"]:not(:checked) + label {
181 background: #338EA6;
182 color: rgba(255, 255, 255, .4);
183 }
184 .imagify-small-options input[type="radio"]:checked + label {
185 background: #40B1D0;
186 }
187
188 .imagify-cols:after {
189 content: "";
190 display: table;
191 clear: both;
192 }
193
194 .js .imagify-iframe-viewing .close-btn {
195 display: none;
196 }
197
198 .imagify-modal .imagify-cols {
199 padding: 0 20px;
200 }
201 .imagify-payment-modal .imagify-iconed {
202 margin: 1.5em 5em 1.5em 0;
203 }
204
205
206 .imagify-iconed {
207 position: relative;
208 text-align: left;
209 padding-left: 42px;
210 margin-right: 15px;
211 font-weight: 500;
212 }
213 .imagify-iconed .dashicons,
214 .imagify-iconed .icon {
215 position: absolute;
216 font-size: 2em;
217 left: 0; top: 2px;
218 color: #40B1D0;
219 }
220 .imagify-payment-modal .close-btn {
221 top: 10px;
222 right: 10px;
223 width: 24px;
224 height: 24px;
225 padding: 2px 0 0 4.5px; /* Safari iOS bug fix */
226 color: #FFF;
227 background: #40B1D0;
228 border-radius: 50%;
229 -webkit-transition: all .275s;
230 transition: all .275s;
231 }
232 .imagify-payment-modal .close-btn i {
233 margin-left: -3.5px;
234 margin-top: -0.5px;
235 }
236 .imagify-payment-modal .close-btn:hover {
237 background: #F6F7FB;
238 }
239
240 /* OFFERS */
241 .imagify-offer-line {
242 margin-top: 1.5em;
243 }
244 .imagify-offer-line + .imagify-offer-line {
245 margin-top: 0.75em;
246 }
247 .imagify-offer-header {
248 -webkit-box-pack: justify;
249 -webkit-justify-content: space-between;
250 -ms-flex-pack: justify;
251 justify-content: space-between;
252 -webkit-box-align: center;
253 -webkit-align-items: center;
254 -ms-flex-align: center;
255 align-items: center;
256 padding: 0 0 0 15px;
257 border-radius: 4px 4px 0 0;
258 -webkit-transition: all .275s;
259 transition: all .275s;
260 }
261 .imagify-offer-header.imagify-offer-header.imagify-offer-header .imagify-inline-options label:last-child {
262 border-radius: 0 4px 0 0;
263 }
264 .imagify-offer-header .imagify-inline-options {
265 width: auto;
266 }
267 .imagify-offer-title {
268 font-weight: bold;
269 margin: 0;
270 }
271 .imagify-offer-header,
272 .imagify-offer-header .imagify-inline-options input[type="radio"]:not(:checked) + label {
273 background: #E5EBEF;
274 }
275 .imagify-offer-onetime .imagify-offer-header {
276 padding-top:8px;
277 padding-bottom: 8px;
278 }
279 .imagify-offer-onetimes > div {
280 padding-top: 15px;
281 padding-bottom: 15px;
282 }
283 .imagify-offer-header .imagify-inline-options input[type="radio"]:not(:checked) + label,
284 .imagify-offer-header .imagify-inline-options input[type="radio"]:checked + label {
285 position: relative;
286 padding: 7px 30px;
287 font-size: 1em;
288 letter-spacing: 0.05em;
289 color: inherit;
290 box-shadow: 0 0 0;
291 border-radius: 0;
292 }
293 .imagify-offer-header .imagify-inline-options input[type="radio"]:checked + label {
294 background: #F6F7FB;
295 }
296
297 .imagify-2-free {
298 position: absolute;
299 bottom: 100%; left: 0; right: 0;
300 padding: 2px 10px;
301 margin-bottom: 8px;
302 font-size: 0.8em;
303 letter-spacing: 0;
304 text-transform: none;
305 text-align: center;
306 color: #FFF;
307 background: #10121A;
308 border-radius: 2px;
309 }
310 .imagify-2-free:after {
311 content: "";
312 position: absolute;
313 left: 50%; bottom: -3px;
314 margin-left: -3px;
315 border-top: 3px solid #10121A;
316 border-left: 3px solid transparent;
317 border-right: 3px solid transparent;
318 }
319 /* right position */
320 .imagify-2-free.imagify-b-right {
321 bottom: auto;
322 left: 100%; right: -100%;
323 margin-bottom: 0;
324 margin-left: 8px;
325 }
326 .imagify-2-free.imagify-b-right:after {
327 left: -3px; bottom: auto; top: 50%;
328 margin-top: -3px; margin-left: 0;
329 border-right: 3px solid #10121A;
330 border-top: 3px solid transparent;
331 border-bottom: 3px solid transparent;
332 border-left: 0;
333 }
334
335 /* bottom position */
336 .imagify-2-free.imagify-b-bottom {
337 bottom: -100%;
338 left: 0; right: 0;
339 margin-top: 8px;
340 }
341
342 .imagify-2-free.imagify-b-bottom:after {
343 top: -3px; bottom: auto;
344 border-bottom: 3px solid #10121A;
345 border-left: 3px solid transparent;
346 border-right: 3px solid transparent;
347 border-top: 0;
348 }
349
350 .imagify-offer-content {
351 text-align: left;
352 background: #F6F7FB;
353 border-radius: 0 0 4px 4px;
354 -webkit-transition: all .275s;
355 transition: all .275s;
356 }
357 .imagify-offer-onetime .imagify-offer-content {
358 padding: 10px 0;
359 }
360
361 /* Checkboxes adjustment */
362 div.imagify-col-checkbox {
363 position: relative;
364 width: 25.5%;
365 padding-top: 10px;
366 padding-bottom: 7px;
367 }
368 .imagify-col-checkbox label {
369 display: block;
370 }
371 .imagify-col-checkbox .imagify-checkbox.imagify-checkbox:not(:checked),
372 .imagify-col-checkbox .imagify-checkbox.imagify-checkbox:checked {
373 position: absolute;
374 top: 50%; left: 6px;
375 margin: -8px 0 0 0;
376 }
377 .imagify-col-checkbox .imagify-checkbox.imagify-checkbox:not(:checked) + label:before,
378 .imagify-col-checkbox .imagify-checkbox.imagify-checkbox:checked + label:before {
379 margin: 0;
380 top: -2px;
381 left: 6px;
382 -webkit-transition: all .275s;
383 transition: all .275s;
384 }
385 .imagify-col-checkbox .imagify-checkbox.imagify-checkbox:not(:checked) + label:after,
386 .imagify-col-checkbox .imagify-checkbox.imagify-checkbox:checked + label:after {
387 top: 1px;
388 left: 13px;
389 }
390 .imagify-col-checkbox label {
391 padding-left: 55px!important;
392 }
393
394 /* Offer col */
395 .imagify-offer-size {
396 font-size: 30px;
397 color: #2E3243;
398 font-weight: bold;
399 -webkit-transition: all .275s;
400 transition: all .275s;
401 }
402 .imagify-offer-by {
403 font-size: 10px;
404 -webkit-transition: all .275s;
405 transition: all .275s;
406 }
407 .imagify-approx {
408 display: none;
409 font-size: 11px;
410 line-height: 1.2;
411 -webkit-transition: all .275s;
412 transition: all .275s;
413 }
414
415 div.imagify-col-price {
416 width: 35%;
417 }
418 .imagify-flex-table .imagify-price-block {
419 padding-left: 0;
420 padding-right: 0;
421 }
422 .imagify-offer-monthly .imagify-flex-table .imagify-price-block,
423 .imagify-offer-monthlies .imagify-price-block {
424 padding-top: 0;
425 }
426 .imagify-flex-table .imagify-price-complement {
427 padding-right: 0;
428 font-size: 10px;
429 font-weight: bold;
430 }
431 .imagify-price-block,
432 .imagify-price-discount {
433 white-space: nowrap;
434 }
435 .imagify-price-block span,
436 .imagify-price-discount span {
437 display: inline-block;
438 vertical-align: middle;
439 }
440 .imagify-price-discount.imagify-price-discount {
441 position: relative;
442 flex-grow: 0;
443 padding-top: 15px;
444 font-weight: bold;
445 width: 70px;
446 }
447 .imagify-price-discount:before {
448 content: "";
449 position: absolute;
450 top: 25px;
451 width: 62%;
452 height: 2px;
453 background: #2E3243;
454 transform: rotate(-15deg);
455 }
456 .imagify-offer-onetimes .imagify-price-discount:before {
457 width: 100%;
458 }
459 .imagify-price-discount-dollar {
460 color: #2E3243;
461 }
462 .imagify-price-discount-number {
463 color: #8BA6B4;
464 }
465 .imagify-offer-selected .imagify-price-discount-number {
466 color: #FFF;
467 }
468 span.imagify-dollars {
469 color: #1F2332;
470 font-size: 18px;
471 font-weight: bold;
472 vertical-align: -2px;
473 }
474 .imagify-offer-onetime .imagify-col-price {
475 padding-top: 0;
476 }
477 .imagify-offer-onetime .imagify-dollars {
478 vertical-align: -1px;
479 }
480 .imagify-price-big,
481 .imagify-price-mini {
482 color: #40B1D0;
483 font-weight: bold;
484 }
485 .imagify-price-big {
486 font-size: 36px;
487 }
488 span.imagify-price-mini {
489 font-size: 18px;
490 vertical-align: 2px;
491 }
492 span.imagify-price-by {
493 font-size: 10px;
494 color: #1F2332;
495 vertical-align: -13px;
496 text-indent: -27px;
497 }
498
499 .imagify-col-other-actions {
500 width: 18.5%;
501 text-align: right;
502 }
503 .imagify-col-other-actions a {
504 font-size: 11px;
505 }
506
507 /* Offer selected */
508 .imagify-offer-selected,
509 .imagify-offer-selected .imagify-offer-title,
510 .imagify-offer-selected .imagify-offer-size,
511 .imagify-offer-selected .imagify-price-big,
512 .imagify-offer-selected .imagify-price-mini,
513 .imagify-offer-selected .imagify-price-complement,
514 .imagify-offer-selected .imagify-col-other-actions a {
515 color: #FFF;
516 }
517 .imagify-offer-selected .imagify-offer-header,
518 .imagify-offer-selected .imagify-offer-header .imagify-inline-options input[type="radio"]:not(:checked) + label {
519 background: #338EA6;
520 }
521 .imagify-offer-selected .imagify-offer-header .imagify-inline-options input[type="radio"]:checked + label {
522 background: #40B1D0;
523 }
524 .imagify-offer-selected .imagify-offer-content {
525 background: #40B1D0;
526 }
527 .imagify-offer-selected .imagify-checkbox.imagify-checkbox:not(:checked) + label:before,
528 .imagify-offer-selected .imagify-checkbox.imagify-checkbox:checked + label:before {
529 border-color: #FFF;
530 background: #40B1D0;
531 }
532 .imagify-offer-selected .imagify-checkbox.imagify-checkbox:not(:checked) + label:after,
533 .imagify-offer-selected .imagify-checkbox.imagify-checkbox:checked + label:after {
534 color: #FFF;
535 }
536 .imagify-offer-selected .imagify-offer-by {
537 color: #2E3243;
538 }
539
540 .imagify-enough-title {
541 display: none;
542 }
543 .imagify-enough-free .imagify-not-enough-title {
544 display: none;
545 }
546 .imagify-enough-free .imagify-enough-title {
547 display: block;
548 }
549
550 .imagify-submit-line {
551 display: -webkit-box;
552 display: -ms-flexbox;
553 display: flex;
554 -webkit-box-pack: justify;
555 -ms-flex-pack: justify;
556 justify-content: space-between;
557 -webkit-box-align: center;
558 -ms-flex-align: center;
559 align-items: center;
560 margin: 2em 0;
561 text-align: left;
562 }
563 .imagify-coupon-section {
564 display: -webkit-box;
565 display: -ms-flexbox;
566 display: flex;
567 -webkit-box-align: center;
568 -ms-flex-align: center;
569 align-items: center;
570 }
571 .imagify-coupon-section p {
572 margin: 0;
573 line-height: 1.3;
574 }
575 .imagify-coupon-text {
576 width: 200px;
577 max-width: 100%;
578 padding-right: 15px;
579 }
580 .imagify-coupon-loader {
581 display: none;
582 }
583 .imagify-coupon-text.checking {
584 text-align: right;
585 }
586 .imagify-coupon-text.checking .imagify-coupon-loader {
587 display: inline;
588 }
589 .imagify-coupon-text.checking label {
590 display: none;
591 }
592 .imagify-coupon-input {
593 position: relative;
594 }
595 .imagify-coupon-input input {
596 position: relative;
597 z-index: 1;
598 }
599 [id="imagify-coupon-validate"].button-secondary {
600 position: absolute;
601 top: 1px;
602 right: 3px;
603 bottom: 2px;
604 box-shadow: none;
605 padding: 4px 10px;
606 z-index: 0;
607 transition: transform .275s;
608 }
609 .imagify-canbe-validate [id="imagify-coupon-validate"] {
610 transform: translateX(45px);
611 }
612
613 /* Promotion/Discount section */
614 .imagify-modal-section + .imagify-modal-promotion {
615 margin-top: -1em;
616 }
617 .imagify-modal-promotion {
618 position: relative;
619 overflow: hidden;
620 display: none;
621 align-items: center;
622 padding: 15px 25px;
623 background: #604D90;
624 text-shadow: 0 0 3px rgba(0, 0, 0, 0.3);
625 }
626 .imagify-modal-promotion.active {
627 display: -webkit-box;
628 display: -ms-flexbox;
629 display: flex;
630 }
631 [id="imagify-pricing-tab-onetime"] .imagify-modal-promotion {
632 margin-bottom: 4em;
633 }
634 .imagify-modal-promotion:before {
635 content: "\f488";
636 position: absolute;
637 top: 28px;
638 left: 8%;
639 font-family: "dashicons";
640 font-size: 90px;
641 color: #8476A9;
642 text-shadow: none;
643 }
644 .imagify-modal-promotion p {
645 position: relative;
646 margin: .2em 0;
647 color: #FFF;
648 }
649 .imagify-promo-title {
650 -ms-flex-preferred-size: 100%;
651 flex-basis: 100%;
652 text-transform: uppercase;
653 font-size: 20px;
654 font-weight: bold;
655 letter-spacing: 0.125em;
656 }
657 .imagify-until-date {
658 -ms-flex-preferred-size: 200px;
659 flex-basis: 200px;
660 text-align: right;
661 }
662 .imagify-until-date strong {
663 color: #FFF;
664 }
665
666
667 .imagify-submit-line button {
668 font-size: 16px;
669 }
670 input.imagify-coupon-code {
671 padding: 10px;
672 border: 2px solid #7A8996;
673 font-size: 0.875em;
674 font-weight: bold;
675 border-radius: 3px;
676 }
677 .validated.imagify-coupon-section .imagify-coupon-text,
678 .validated.imagify-coupon-section strong {
679 color: #8BC34A;
680 }
681 .validated.imagify-coupon-section .imagify-coupon-code {
682 color: #8BC34A;
683 border-color: #8BC34A;
684 }
685 .invalid.imagify-coupon-section .imagify-coupon-text,
686 .invalid.imagify-coupon-section strong {
687 color: #d0021b;
688 }
689 .invalid.imagify-coupon-section .imagify-coupon-code {
690 color: #d0021b;
691 border-color: #d0021b;
692 }
693 .imagify-footer-lines {
694 width: 500px;
695 max-width: 100%;
696 margin: 2em auto 2.5em;
697 font-size: 0.85em;
698 line-height: 1.5;
699 }
700
701 /* Year selected */
702 .imagify-year-selected .imagify-switch-my .imagify-yearly {
703 display: block;
704 }
705 .imagify-year-selected .imagify-switch-my .imagify-monthly {
706 display: none;
707 }
708 /* Month selected */
709 .imagify-month-selected .imagify-switch-my .imagify-yearly {
710 display: none;
711 }
712 .imagify-month-selected .imagify-switch-my .imagify-monthly {
713 display: block;
714 }
715
716 /* Flexbox table */
717 .imagify-flex-table {
718 -webkit-box-align: center;
719 -webkit-align-items: center;
720 -ms-flex-align: center;
721 align-items: center;
722 }
723 .imagify-flex-table > * {
724 -webkit-box-flex: 1;
725 -webkit-flex-grow: 1;
726 -ms-flex-positive: 1;
727 flex-grow: 1;
728 padding: 7px 15px;
729 }
730
731 /* Pricing table */
732 div.imagify-col-details {
733 width: 22%;
734 padding-left: 25px;
735 }
736 .imagify-col-details p {
737 margin: 0;
738 }
739 .imagify-pricing-table {
740 margin: 0 20px;
741 }
742 .imagify-pricing-table .imagify-offer-line {
743 padding: .6em 0;
744 border: 2px solid #E8EEF0;
745 text-align: left;
746 border-radius: 3px;
747 }
748 .imagify-pricing-table .imagify-offer-line:first-child {
749 margin-top: .75em;
750 }
751 .imagify-pricing-table .imagify-offer-line.imagify-offer-selected:first-child {
752 margin-top: 1.75em;
753 }
754 .imagify-pricing-table .imagify-offer-line + .imagify-offer-line {
755 margin-top: -2px;
756 }
757 .imagify-pricing-table .imagify-col-other-actions {
758 width: 20.5%;
759 }
760 .imagify-pricing-table .imagify-approx {
761 margin-left: 0;
762 line-height: 0.5;
763 margin-bottom: 1em;
764 }
765 .imagify-pricing-table .imagify-offer-selected {
766 -webkit-transform: scale(1.03);
767 transform: scale(1.03);
768 background: #40B1D0;
769 border-width: 0;
770 }
771 .imagify-pricing-table .imagify-offer-selected .imagify-approx {
772 color: #FFF;
773 }
774 .imagify-pricing-table .imagify-button-secondary {
775 padding: 3px 20px;
776 box-shadow: none;
777 text-transform: uppercase;
778 font-size: 12px;
779 letter-spacing: 0.025em;
780 }
781 .imagify-offer-selected.imagify-offer-selected .imagify-button-secondary {
782 border: 2px solid #FFF;
783 background: #40B1D0;
784 box-shadow: none;
785 text-shadow: none!important;
786 }
787 .imagify-offer-selected.imagify-offer-selected .imagify-button-secondary:hover,
788 .imagify-offer-selected.imagify-offer-selected .imagify-button-secondary:focus {
789 background: #FFF;
790 color: #40B1D0;
791 }
792
793 .imagify-col .imagify-special-needs {
794 margin-left: 25px;
795 }
796 .imagify-special-needs strong {
797 font-size: 25px;
798 font-weight: bold;
799 color: #40B1D0;
800 }
801 .imagify-special-needs span {
802 display: block;
803 font-size: 12px;
804 margin-top: -.5em;
805 }
806 div.imagify-col-price {
807 position: relative;
808 }
809
810 /* we recommend line */
811 .imagify-recommend {
812 display: none;
813 position: absolute;
814 left: -20px; bottom: 100%;
815 padding: 0;
816 margin-bottom: 8px;
817 color: #1F2332;
818 font-weight: bold;
819 font-style: italic;
820 }
821 .imagify-offer-selected .imagify-recommend {
822 display: block;
823 }
824 [class*="imagify-onetime-"] .imagify-recommend {
825 left: 65px;
826 margin-bottom: 20px;
827 }
828 .imagify-recommend:before {
829 content: "";
830 position: absolute;
831 top: 7px; left: -35px;
832 width: 29px; height: 30px;
833 background: url("../images/icon-arrow-choice.png") scroll 0 no-repeat;
834 background-size: contain;
835 }
836 @media only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
837 .imagify-recommend:before {
838 background-image: url("../images/icon-arrow-choice.svg");
839 }
840 }
841
842 /* One Time Adjustments */
843 .imagify-offer-line[class*="imagify-onetime-"] {
844 padding: 0;
845 margin: .3em 0 0;
846 }
847 .imagify-offer-line.imagify-offer-line[class*="imagify-onetime-"]:first-child {
848 margin-top: 2em;
849 }
850 .imagify-offer-line[class*="imagify-onetime-"] + .imagify-offer-line {
851 margin-top: .5em;
852 }
853 .imagify-offer-selected.imagify-offer-line[class*="imagify-onetime-"] {
854 -webkit-transform: scale(1);
855 transform: scale(1);
856 border-width: 2px;
857 }
858
859 /* cols */
860 .imagify-offer-line[class*="imagify-onetime-"] .imagify-col-details {
861 position: relative;
862 overflow: hidden;
863 width: 21%;
864 background: #1F2332;
865 color: #FFF;
866 }
867 .imagify-offer-selected.imagify-offer-line[class*="imagify-onetime-"] .imagify-col-details {
868 background: #338EA6;
869 }
870 .imagify-offer-line[class*="imagify-onetime-"] .imagify-col-details:before {
871 content: "";
872 position: absolute;
873 bottom: 0; right: 25px;
874 width: 75px; height: 54px;
875 background: url("../images/icon-pack.png");
876 }
877 .imagify-offer-line[class*="imagify-onetime-"] .imagify-col-other-actions {
878 width: 30%;
879 }
880
881 .imagify-offer-line[class*="imagify-onetime-"] .imagify-offer-size,
882 .imagify-offer-line[class*="imagify-onetime-"] .imagify-approx {
883 color: #FFF;
884 }
885 .imagify-offer-line[class*="imagify-onetime-"] .imagify-offer-size {
886 font-size: 24px;
887 }
888 .imagify-offer-line[class*="imagify-onetime-"] .imagify-approx {
889 font-size: 12px;
890 }
891 .imagify-offer-line[class*="imagify-onetime-"] .imagify-price-block {
892 padding-left: 10px;
893 }
894 .imagify-offer-line[class*="imagify-onetime-"] .imagify-dollars {
895 vertical-align: middle;
896 }
897 .imagify-offer-line[class*="imagify-onetime-"] .imagify-price-big {
898 vertical-align: -5px;
899 }
900 .imagify-offer-line[class*="imagify-onetime-"] .imagify-price-mini {
901 vertical-align: 7px;
902 }
903
904 /* Simple Tabs */
905 .imagify-tabs {
906 margin-bottom: 0;
907 list-style: none;
908 background: #E5EBEF;
909 }
910 .imagify-modal-content .imagify-tabs {
911 margin: 1em 0 0;
912 }
913 .imagify-tab {
914 -webkit-box-flex: 1;
915 -webkit-flex-grow: 1;
916 -ms-flex-positive: 1;
917 flex-grow: 1;
918 width: 50%;
919 margin: 0;
920 font-size: 23px;
921 }
922 .imagify-tab a {
923 display: block;
924 padding: 15px 10px;
925 color: inherit;
926 text-decoration: none;
927 }
928 .imagify-tab a:focus {
929 box-shadow: none;
930 outline: none;
931 color: #40B1D8;
932 }
933 .imagify-tab.imagify-current a {
934 background: #F6F7FB;
935 }
936 .imagify-tab-content.imagify-current {
937 display: block;
938 }
939 .imagify-tab-content {
940 display: none;
941 }
942 .imagify-tab-content .imagify-modal-section:first-child {
943 margin-top: 0;
944 }
945
946 /* Modal sidebar */
947 .imagify-modal-sidebar-content,
948 .imagify-payment-modal .imagify-modal-sidebar {
949 display: -webkit-box;
950 display: -webkit-flex;
951 display: -ms-flexbox;
952 display: flex;
953 -webkit-box-orient: vertical;
954 -webkit-box-direction: normal;
955 -webkit-flex-direction: column;
956 -ms-flex-direction: column;
957 flex-direction: column;
958 }
959 .imagify-modal-sidebar-content {
960 -webkit-box-flex: 1;
961 -webkit-flex-grow: 1;
962 -ms-flex-positive: 1;
963 flex-grow: 1;
964 }
965 p.imagify-modal-sidebar-title.imagify-modal-sidebar-title {
966 margin-top: 5px;
967 padding-right: 40px;
968 font-size: 18px;
969 color: #FFF;
970 }
971 .imagify-modal-testimony {
972 margin-top: 1em;
973 }
974 .imagify-modal-testimony + .imagify-modal-testimony {
975 margin-top: 2em;
976 }
977 @media (max-height:620px) {
978 .imagify-modal-testimony + .imagify-modal-testimony {
979 display: none;
980 }
981 }
982 .imagify-modal-testimony-person {
983 display: table;
984 width: 100%;
985 }
986 .imagify-modal-testimony-person > * {
987 display: table-cell;
988 vertical-align: middle;
989 }
990 .imagify-modal-avatar {
991 width: 114px;
992 line-height: 0;
993 }
994 .imagify-modal-avatar img {
995 border: 2px solid #FFF;
996 border-radius: 50%;
997 width: 96px; height: 96px;
998 }
999 .imagify-modal-identity a {
1000 text-decoration: none;
1001 font-weight: bold;
1002 }
1003 .imagify-modal-identity a:first-child {
1004 font-size: 13px;
1005 }
1006 .imagify-modal-identity a:first-child + a {
1007 display: block;
1008 font-size: 10px;
1009 color: #7A8996;
1010 }
1011 .imagify-modal-testimony-content.imagify-modal-testimony-content p {
1012 font-size: 13px;
1013 font-style: italic;
1014 line-height: 1.7;
1015 color: #7A8996;
1016 }
1017 .imagify-modal-sidebar-trust {
1018 margin-top: auto;
1019 padding-top: 1.5em;
1020 }
1021 .imagify-modal-sidebar-trust p {
1022 margin: 0;
1023 font-weight: bold;
1024 font-size: 12px;
1025 line-height: 1.7;
1026 }
1027 .imagify-modal-sidebar-trust p img {
1028 margin-right: 3px;
1029 vertical-align: -2px;
1030 }
1031 .imagify-modal-sidebar-trust p + p {
1032 font-size: 11px;
1033 }
1034
1035 /* Cart */
1036 .imagify-cart {
1037 text-align: left;
1038 }
1039 .imagify-cart .imagify-cart-list {
1040 border-top: 1px solid rgba(122, 137, 150, .2);
1041 border-bottom: 1px solid rgba(122, 137, 150, .2);
1042 }
1043 .imagify-cart .imagify-cart-label {
1044 margin-bottom: 0.5em;
1045 font-size: 10px;
1046 color: #2E3243;
1047 }
1048 .imagify-cart-list p {
1049 margin: 0;
1050 font-weight: bold;
1051 }
1052 .imagify-cart-item {
1053 margin: .4em 0;
1054 }
1055 .imagify-cart .imagify-cart-suggestion {
1056 margin-top: -.3em;
1057 }
1058 .imagify-cart-suggestion a,
1059 .imagify-cl-description p {
1060 font-size: 10px;
1061 }
1062 .imagify-remove-from-cart {
1063 border: 0;
1064 padding: 0;
1065 width: 14px;
1066 height: 14px;
1067 line-height: 13px;
1068 border-radius: 50%;
1069 background: #40B1D0;
1070 cursor: pointer;
1071 transition: background .3s;
1072 }
1073 .imagify-remove-from-cart i:before {
1074 position: relative;
1075 top: -6px; left: -3px;
1076 font-size: 13px;
1077 color: #FFF;
1078 }
1079 .imagify-remove-from-cart:hover,
1080 .imagify-remove-from-cart:focus {
1081 background: #D0021B;
1082 }
1083
1084 /* col sizes */
1085 .imagify-cart .imagify-cl-remove {
1086 -webkit-box-flex: 0;
1087 -webkit-flex-grow: 0;
1088 -ms-flex-positive: 0;
1089 flex-grow: 0;
1090 width: 45px;
1091 }
1092 .imagify-cart .imagify-cl-name {
1093 -webkit-box-flex: 0;
1094 -webkit-flex-grow: 0;
1095 -ms-flex-positive: 0;
1096 flex-grow: 0;
1097 width: 200px;
1098 }
1099 .imagify-cart .imagify-cl-description {
1100 -webkit-align-self: flex-start;
1101 -ms-flex-item-align: start;
1102 align-self: flex-start;
1103 padding-top: 10px;
1104 }
1105 .imagify-cart .imagify-cl-price {
1106 text-align: right;
1107 }
1108
1109 #imagify-payment-iframe {
1110 width: 980px;
1111 height: 672px;
1112 background: #f6f7fb url(../images/loader-balls.svg) 50% 50% no-repeat;
1113 }
1114
1115 .imagify-success-view {
1116 display: -webkit-box;
1117 display: -webkit-flex;
1118 display: -ms-flexbox;
1119 display: flex;
1120 -webkit-box-align: center;
1121 -webkit-align-items: center;
1122 -ms-flex-align: center;
1123 align-items: center;
1124 -webkit-box-orient: vertical;
1125 -webkit-box-direction: normal;
1126 -webkit-flex-direction: column;
1127 -ms-flex-direction: column;
1128 flex-direction: column;
1129 -webkit-box-pack: center;
1130 -webkit-justify-content: center;
1131 -ms-flex-pack: center;
1132 justify-content: center;
1133 height: 100%;
1134 }
1135 .imagify-success-view p {
1136 font-weight: bold;
1137 font-size: 16px;
1138 }
1139
1140 /* Imagify cart item removing */
1141 .imagify-cart-emptied-item {
1142 margin: .3em auto;
1143 padding: 6px 20px;
1144 background: #E6EBEF;
1145 border-radius: 20px;
1146 }
1147 .imagify-cart-emptied-item.imagify-cart-emptied-item p {
1148 font-weight: bold;
1149 }
1150 .imagify-cart-emptied-item a {
1151 color: #40b1d0;
1152 float: right;
1153 font-weight: bold;
1154 }
1155 @media (max-width: 782px) {
1156 .imagify-payment-modal .imagify-modal-content{
1157 width: 90%;
1158 min-width: auto;
1159 -webkit-flex-direction: column;
1160 -ms-flex-direction: column;
1161 flex-direction: column;
1162 -webkit-box-direction: normal;
1163 -webkit-box-orient: vertical;
1164 -moz-box-direction: normal;
1165 -moz-box-orient: vertical;
1166 align-items: center;
1167 }
1168 .imagify-payment-modal .imagify-modal-main{
1169 width: 100%;
1170 }
1171 .imagify-payment-modal .imagify-modal-sidebar{
1172 width: 100%;
1173
1174 }
1175 .imagify-modal-section.section-gray{
1176 padding: 10px 10px 15px;
1177 }
1178 .imagify-modal-section{
1179 padding: 0 10px;
1180 }
1181 .imagify-submit-line{
1182 -webkit-flex-direction: column;
1183 -ms-flex-direction: column;
1184 flex-direction: column;
1185 -webkit-box-direction: normal;
1186 -webkit-box-orient: vertical;
1187 -moz-box-direction: normal;
1188 -moz-box-orient: vertical;
1189 align-items: center;
1190 }
1191 .imagify-coupon-section{
1192 -webkit-flex-direction: column;
1193 -ms-flex-direction: column;
1194 flex-direction: column;
1195 -webkit-box-direction: normal;
1196 -webkit-box-orient: vertical;
1197 -moz-box-direction: normal;
1198 -moz-box-orient: vertical;
1199 align-items: center;
1200 margin-bottom: 20px;
1201 }
1202 .imagify-coupon-section .imagify-coupon-text{
1203 text-align: center;
1204 width: 100%;
1205 padding: 0;
1206 margin-bottom: 20px;
1207 }
1208
1209 .imagify-modal-cols{
1210 -webkit-flex-direction: column;
1211 -ms-flex-direction: column;
1212 flex-direction: column;
1213 -webkit-box-direction: normal;
1214 -webkit-box-orient: vertical;
1215 -moz-box-direction: normal;
1216 -moz-box-orient: vertical;
1217 align-items: center;
1218 }
1219 .imagify-col{
1220 padding: 0;
1221 float: none;
1222 width: 100%;
1223 }
1224 .imagify-payment-modal .imagify-iconed{
1225 margin: 1.5em auto;
1226 max-width: 260px;
1227 }
1228 .imagify-offer-header{
1229 padding: 0;
1230 }
1231 .imagify-offer-header .imagify-inline-options input[type="radio"]:not(:checked) + label,
1232 .imagify-offer-header .imagify-inline-options input[type="radio"]:checked + label{
1233 padding: 7px 15px;
1234 }
1235 .imagify-offer-header .imagify-inline-options input[type="radio"]:checked + label{
1236 padding: 7px 15px;
1237 }
1238 .imagify-offer-header .imagify-offer-title.imagify-switch-my .imagify-monthly,
1239 .imagify-offer-header .imagify-offer-title.imagify-switch-my .imagify-yearly{
1240 padding: 10px 5px;
1241 font-size: 12px;
1242 }
1243 .imagify-offer-size{
1244 font-size: 18px;
1245 }
1246 .imagify-col-other-actions{
1247 padding: 10px;
1248 text-align: center;
1249 }
1250 .imagify-2-free{
1251 padding: 2px 5px;
1252 }
1253 .imagify-2-free.imagify-b-right {
1254 position: absolute;
1255 bottom: 100%;
1256 left: 0;
1257 right: 0;
1258 padding: 2px 5px;
1259 margin-bottom: 0px;
1260 margin-left: 0px;
1261 font-size: 0.8em;
1262 letter-spacing: 0;
1263 text-transform: none;
1264 text-align: center;
1265 color: #FFF;
1266 background: #10121A;
1267 border-radius: 2px;
1268 }
1269 .imagify-2-free.imagify-b-right:after{
1270 content: "";
1271 position: absolute;
1272 left: 50%;
1273 top: unset;
1274 bottom: -6px;
1275 margin-left: -3px;
1276 border-top: 3px solid #10121A;
1277 border-left: 3px solid transparent;
1278 border-right: 3px solid transparent;
1279 }
1280 div.imagify-col-price{
1281 -webkit-flex-direction: column;
1282 -ms-flex-direction: column;
1283 flex-direction: column;
1284 -webkit-box-direction: normal;
1285 -webkit-box-orient: vertical;
1286 -moz-box-direction: normal;
1287 -moz-box-orient: vertical;
1288 align-items: center;
1289 }
1290 .imagify-flex-table .imagify-price-complement{
1291 padding: 5px 0 0 0;
1292 margin: 0;
1293 text-align: center;
1294 }
1295 div.imagify-col-details{
1296 padding: 10px 0px 10px 10px;
1297 }
1298 .imagify-pricing-table .imagify-col-other-actions{
1299 padding: 0 10px 0 0;
1300 }
1301 .imagify-pricing-table .imagify-button-secondary{
1302 font-size: 12px;
1303 white-space: normal;
1304 line-height: 14px;
1305 padding: 10px;
1306 }
1307 .imagify-price-big{
1308 font-size: 24px;
1309 }
1310 span.imagify-price-mini{
1311 font-size: 12px;
1312 }
1313 .imagify-col-checkbox label{
1314 padding-left: 30px !important;
1315 }
1316 .medium.imagify-checkbox:not(:checked) + label:before,
1317 .medium.imagify-checkbox:checked + label:before{
1318 width: 15px;
1319 height: 15px;
1320 }
1321 div.imagify-col-checkbox{
1322 padding: 0;
1323 }
1324 .imagify-offer-monthly .imagify-flex-table .imagify-price-block,
1325 .imagify-offer-monthlies .imagify-price-block{
1326 padding: 0;
1327 }
1328 .imagify-pricing-table{
1329 margin: 0 .5em;
1330 }
1331 .imagify-payment-modal .close-btn{
1332 top: 5px;
1333 right: 5px;
1334 }
1335 .imagify-col-checkbox .imagify-checkbox.imagify-checkbox:not(:checked) + label:after,
1336 .imagify-col-checkbox .imagify-checkbox.imagify-checkbox:checked + label:after{
1337 top: -1px;
1338 left: 10px;
1339 }
1340 }
1341