PluginProbe
Darkify – Dark Mode & Night Mode for Website & Admin (Dark Theme Included) / 1.4.9
Darkify – Dark Mode & Night Mode for Website & Admin (Dark Theme Included) v1.4.9
2.1.3 2.1.2 2.1.1 2.1.0 2.0.4 2.0.3 2.0.2 2.0.1 2.0.0 1.5.5 1.5.4 1.5.3 1.5.2 1.5.1 1.5.0 trunk 1.0.1 1.1.0 1.2.0 1.2.1 1.2.2 1.2.3 1.2.4 1.2.5 1.3.0 All 57 releases
darkify / src / Admin / Framework / assets / css / style.css

style.css in Darkify – Dark Mode & Night Mode for Website & Admin (Dark Theme Included) 1.4.9, at src/Admin/Framework/assets/css/style.css

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