PluginProbe
Page Builder: Pagelayer – Drag and Drop website builder / 2.1.3
Page Builder: Pagelayer – Drag and Drop website builder v2.1.3
2.2.1 2.2.0 2.1.9 2.1.8 2.1.7 2.1.6 2.1.5 2.1.4 2.1.3 trunk 0.9.0 0.9.1 0.9.2 0.9.3 0.9.4 0.9.5 0.9.6 0.9.7 0.9.8 0.9.9 1.0.0 1.0.2 1.0.3 1.0.4 1.0.5 All 129 releases
pagelayer / css / pagelayer-editor.css

pagelayer-editor.css in Page Builder: Pagelayer – Drag and Drop website builder 2.1.3, at css/pagelayer-editor.css

4,462 lines 82.1 KB
No matching file
Up and down to move Enter to open Esc to close
Raw Download Zip
1 /*
2 PAGELAYER
3 http://pagelayer.com/
4 (c) Pagelayer Team
5 */
6
7 /*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */
8
9 html {
10 line-height: 1.15; /* 1 */
11 -webkit-text-size-adjust: 100%; /* 2 */
12 }
13
14 body {
15 margin: 0;
16 }
17
18 main {
19 display: block;
20 }
21
22 h1 {
23 font-size: 2em;
24 margin: 0.67em 0;
25 }
26
27 hr {
28 box-sizing: content-box; /* 1 */
29 height: 0; /* 1 */
30 overflow: visible; /* 2 */
31 }
32
33 pre {
34 font-family: monospace, monospace; /* 1 */
35 font-size: 1em; /* 2 */
36 }
37
38 a {
39 background-color: transparent;
40 }
41
42 abbr[title] {
43 border-bottom: none; /* 1 */
44 text-decoration: underline; /* 2 */
45 text-decoration: underline dotted; /* 2 */
46 }
47
48 b,
49 strong {
50 font-weight: bolder;
51 }
52
53 code,
54 kbd,
55 samp {
56 font-family: monospace, monospace; /* 1 */
57 font-size: 1em; /* 2 */
58 }
59
60 small {
61 font-size: 80%;
62 }
63
64 sub,
65 sup {
66 font-size: 75%;
67 line-height: 0;
68 position: relative;
69 vertical-align: baseline;
70 }
71
72 sub {
73 bottom: -0.25em;
74 }
75
76 sup {
77 top: -0.5em;
78 }
79
80 img {
81 border-style: none;
82 }
83
84 button,
85 input,
86 optgroup,
87 select,
88 textarea {
89 font-family: inherit; /* 1 */
90 font-size: 100%; /* 1 */
91 line-height: 1.15; /* 1 */
92 margin: 0; /* 2 */
93 }
94
95 button,
96 input { /* 1 */
97 overflow: visible;
98 }
99
100 button,
101 select { /* 1 */
102 text-transform: none;
103 }
104
105 button,
106 [type="button"],
107 [type="reset"],
108 [type="submit"] {
109 -webkit-appearance: button;
110 }
111
112 button::-moz-focus-inner,
113 [type="button"]::-moz-focus-inner,
114 [type="reset"]::-moz-focus-inner,
115 [type="submit"]::-moz-focus-inner {
116 border-style: none;
117 padding: 0;
118 }
119
120 button:-moz-focusring,
121 [type="button"]:-moz-focusring,
122 [type="reset"]:-moz-focusring,
123 [type="submit"]:-moz-focusring {
124 outline: 1px dotted ButtonText;
125 }
126
127 fieldset {
128 padding: 0.35em 0.75em 0.625em;
129 }
130
131 legend {
132 box-sizing: border-box; /* 1 */
133 color: inherit; /* 2 */
134 display: table; /* 1 */
135 max-width: 100%; /* 1 */
136 padding: 0; /* 3 */
137 white-space: normal; /* 1 */
138 }
139
140 progress {
141 vertical-align: baseline;
142 }
143
144 textarea {
145 overflow: auto;
146 }
147
148 [type="checkbox"],
149 [type="radio"] {
150 box-sizing: border-box; /* 1 */
151 padding: 0; /* 2 */
152 }
153
154 [type="number"]::-webkit-inner-spin-button,
155 [type="number"]::-webkit-outer-spin-button {
156 height: auto;
157 }
158
159 [type="search"] {
160 -webkit-appearance: textfield; /* 1 */
161 outline-offset: -2px; /* 2 */
162 }
163
164 [type="search"]::-webkit-search-decoration {
165 -webkit-appearance: none;
166 }
167
168 ::-webkit-file-upload-button {
169 -webkit-appearance: button; /* 1 */
170 font: inherit; /* 2 */
171 }
172
173 details {
174 display: block;
175 }
176
177 summary {
178 display: list-item;
179 }
180
181
182 template {
183 display: none;
184 }
185
186 [hidden] {
187 display: none;
188 }
189
190 /* END normalize.css */
191
192 /* An overwrite to show the row irrespective in the editor */
193
194 body {
195 font-family: Roboto, 'Open Sans', Arial, Helvetica, sans-serif;
196 font-size:12px;
197 }
198
199 .pagelayer-normalize{
200 height:100%;
201 width:100%;
202 padding:0px;
203 margin:0px;
204 border:0px;
205 }
206
207 /* Pagelayer Top Bar */
208 .pagelayer-bottombar-holder{
209 background: #4f4f4f;
210 position:relative;
211 padding: 5px;
212 }
213
214 .pagelayer-bottombar{
215 padding: auto;
216 }
217
218 .pagelayer-bottombar-rightbuttons button{
219 font-size: 13px;
220 font-weight: bold;
221 cursor: pointer;
222 border-radius: 2px;
223 padding: 4px 8px;
224 margin: auto 5px;
225 outline:none;
226 }
227
228 .pagelayer-bottombar-rightbuttons .pli{
229 color:#fff;
230 cursor: pointer;
231 }
232
233 .pagelayer-success-btn{
234 border: #398439 1px solid;
235 color: #fff;
236 background: #449d44;
237 }
238
239 .pagelayer-success-btn:hover{
240 background: #3a733a;
241 border-color: #3a733a;
242 }
243
244 .pagelayer-primary-btn{
245 border: #2e6da4 1px solid;
246 color: #fff;
247 background: #337ab7;
248 }
249
250 .pagelayer-primary-btn:hover{
251 background: #286090;
252 border-color: #204d74;
253 }
254
255 .pagelayer-close-button{
256 border: #ef4d4d 1px solid;
257 color: #fff;
258 background: #ef4d4d;
259 }
260
261 .pagelayer-close-button:hover{
262 background: #c13030;
263 border-color: #c13030;
264 }
265
266 .pagelayer-bottombar-rightbuttons i{
267 padding: 4px;
268 margin: auto 3px;
269 }
270
271 .pagelayer-mode-wrapper i{
272 padding: 8px;
273 margin: auto 5px;
274 }
275
276 .pagelayer-mode-wrapper{
277 display:inline-block;
278 text-align:center;
279 }
280
281 .pagelayer-mode-wrapper i{
282 padding: 8px;
283 margin: auto 5px;
284 }
285
286 .pagelayer-mode-buttons-wrapper{
287 position:absolute;
288 bottom:100%;
289 color:#fff;
290 background-color: #3e8ef7;
291 display:none;
292 z-index:1;
293 }
294
295 .pagelayer-leftbar-toggle-h{
296 width:0px;
297 }
298
299 .pagelayer-leftbar-table{
300 position:relative;
301 }
302
303 .pagelayer-leftbar-hidden{
304 width:0px;
305 }
306
307 .pagelayer-leftbar-hidden table{
308 display:none;
309 }
310
311 .pagelayer-leftbar-toggle{
312 position: absolute;
313 width:12px;
314 background: #E3E3E3;
315 cursor: pointer;
316 text-align:center;
317 line-height:300%;
318 top: 50%;
319 left: 100%;
320 transform: translateY(-50%);
321 }
322
323 .pagelayer-rightbar .pagelayer-leftbar-toggle{
324 left: -12px;
325 }
326
327 .pagelayer-rightbar:not(.pagelayer-leftbar-hidden) .pagelayer-leftbar-toggle,
328 .pagelayer-leftbar-hidden:not(.pagelayer-rightbar) .pagelayer-leftbar-toggle{
329 direction: rtl;
330 }
331
332 .pagelayer-leftbar-toggle:hover{
333 background-color: #3e8ef7;
334 color: #ffffff;
335 }
336
337 .pagelayer-leftbar-holder{
338 overflow: hidden;
339 position: absolute;
340 top: 0;
341 bottom: 0;
342 left: 0;
343 right: 0;
344 border-right: 1px solid #c9d0d9;
345 }
346
347 /*.pagelayer-body-table{
348 max-height: 100vh !important;
349 }*/
350
351 .pagelayer-iframe{
352 }
353
354 .pagelayer-iframe-holder{
355 max-height: 100vh !important;
356 height: 100%;
357 overflow: auto;
358 text-align:center;
359 }
360
361 .pagelayer-iframe-holder.pagelayer-iframe-holder-with-bar{
362 max-height: calc(100vh - 45px) !important;
363 height: calc(100vh - 45px) !important;
364 }
365
366 .pagelayer-iframe-top-bar{
367 height:45px;
368 background-color: #3e8ef7;
369 display:none;
370 color: #fff;
371 }
372
373 .pagelayer-body{
374 transition:0.5s;
375 }
376
377 .pagelayer-pro-req{
378 font-size: 10px;
379 padding: 2px 4px;
380 display: inline-block;
381 background-color: #e63131;
382 color: #fff;
383 margin-left: 4px;
384 border-radius: 2px;
385 cursor: pointer;
386 }
387
388 .pagelayer-pro-req > .pagelayer-tlite{
389 background: #fff;
390 color: #000;
391 width: 220px !important;
392 white-space: inherit !important;
393 top: 22px !important;
394 left: 0px !important;
395 }
396
397 .pagelayer-screen-desktop{
398
399 }
400
401 .pagelayer-screen-tablet{
402 height:900px;
403 margin:20px auto;
404 border: solid #444;
405 border-width: 30px 10px;
406 border-radius: 10px;
407 }
408
409 .pagelayer-screen-mobile{
410 height:540px;
411 margin:20px auto;
412 border: solid #444;
413 border-width: 30px 10px;
414 border-radius: 10px;
415 }
416
417 /* Element Properties Dialog classes */
418 [class^="pagelayer-elp"]{
419 font-family: Roboto, 'Open Sans', Arial, Helvetica, sans-serif !important;
420 color: #313439;
421 background-color: transparent;
422 }
423
424 #pagelayer-elpd {
425 display:none;
426 color:#444;
427 border: 1px solid #d3d3d3;
428 }
429
430 .pagelayer-dark #pagelayer-elpd {
431 border: 1px solid #252529;
432 }
433
434 #pagelayer-elpd .slimScrollDiv{
435 height: calc(100% - 50px) !important;
436 }
437
438 .pagelayer-elpd-header {
439 border: none;
440 color:#fff;
441 }
442
443 .pagelayer-elpd-title {
444 text-align: center;
445 padding:0px;
446 cursor: move;
447 color: #fff;
448 font-weight: 600;
449 width:76%;
450 }
451
452 .pagelayer-elpd-close {
453 padding-right:10px;
454 cursor: pointer;
455 margin: 0px;
456 position: absolute;
457 right: 5px;
458 color: #fff;
459 top: 50%;
460 transform: translateY(-50%);
461 }
462
463 .pagelayer-elpd-body{
464 border: none;
465 }
466
467 .pagelayer-elpd-section-rows{
468 background-color: #FFF;
469 border-top: 1px solid #d3d3d3;
470 }
471
472 .pagelayer-dark .pagelayer-elpd-section-rows{
473 background-color: #1c1c1f;
474 border-top: 1px solid #1c1c1f;
475 }
476
477 .pagelayer-elpd-section-name{
478 margin-top: 10px;
479 padding: 11px 10px;
480 background-color: #FFF;
481 font-size: 13px;
482 font-weight: bold;
483 color: #555;
484 cursor: pointer;
485 transition: all 0.3s;
486 }
487
488 .pagelayer-dark .pagelayer-elpd-section-name{
489 background-color: #252529;
490 font-family: Roboto;
491 font-size: 12px;
492 font-weight: 400;
493 color: #ffffff;
494 }
495
496 .pagelayer-elpd-section-name:hover,
497 .pagelayer-elpd-section-open{
498 color:#1a7fb0;
499 }
500
501 .pagelayer-dark .pagelayer-elpd-section-open{
502 background-color: #0d47a1;
503 }
504
505 .pagelayer-dark .pagelayer-elpd-section-name:hover{
506 color:#ffffff;
507 }
508
509 .pagelayer-elpd-section-name:not(.pagelayer-elpd-section-open) .pli:before,
510 .pagelayer-navigator-toggle .pagalayer-arrow:before{
511 content: "\f0da";
512 font-family: pagelayer;
513 }
514 .pagelayer-elpd-section-name.pagelayer-elpd-section-open .pli:before,
515 .pagelayer-navigator-open > .pagelayer-navigator-toggle .pagalayer-arrow:before{
516 content: "\f0d7";
517 font-family: pagelayer;
518 }
519
520 .pagelayer-elpd-section-name .pli{
521 width:15px;
522 float:right;
523 font-style: normal;
524 }
525
526 /* Pagelayer editor panel tabs*/
527
528 .pagelayer-elpd-tab,
529 .pagelayer-history-tab,
530 .pagelayer-widget-tab{
531 display: inline-block;
532 font-size: 13px;
533 cursor: pointer;
534 padding: 10px 6px;
535 margin: 0px 5px 0px 0px;
536 }
537
538 .pagelayer-elpd-tab:hover,
539 .pagelayer-history-tab:hover,
540 .pagelayer-widget-tab:hover{
541 color: #3e8ef7;
542 }
543
544 .pagelayer-dark .pagelayer-elpd-tab,
545 .pagelayer-dark .pagelayer-history-tab,
546 .pagelayer-dark .pagelayer-widget-tab{
547 font-family: Roboto !important;
548 color:#777777;
549 font-size: 14px;
550 font-weight: 400;
551 }
552
553 .pagelayer-elpd-settings-body{
554 display: none;
555 }
556
557 .pagelayer-elpd-settings-body.active{
558 display: block;
559 }
560
561 .pagelayer-elpd-style-body{
562 display: none;
563 }
564
565 .pagelayer-elpd-style-body.active{
566 display: block;
567 }
568
569 .pagelayer-history-section{
570 display:none;
571 }
572
573 .pagelayer-history-body{
574 margin:10px 0px;
575 padding:10px;
576 background-color:#ffffff;
577 }
578
579 .pagelayer-history-section.active{
580 display:block;
581 }
582
583 .pagelayer-history-section.active[pagelayer-show-tab="actions"]{
584 display:flex;
585 flex-direction:column-reverse;
586 }
587
588 [pagelayer-elpd-active-tab="1"],
589 [pagelayer-history-active-tab="1"] {
590 color: #3e8ef7;
591 border-bottom: 2px solid #3e8ef7;
592 }
593
594 .pagelayer-dark [pagelayer-elpd-active-tab="1"],
595 .pagelayer-dark [pagelayer-history-active-tab="1"]{
596 color: #ffffff;
597 }
598
599 .pagelayer-elpd-tabs,
600 .pagelayer-history-tabs,
601 .pagelayer-widget-tabs {
602 background-color: #fff;
603 border-bottom: 1px solid #d3d3d3;
604 }
605
606 .pagelayer-dark .pagelayer-elpd-tabs,
607 .pagelayer-dark .pagelayer-history-tabs,
608 .pagelayer-dark .pagelayer-widget-tabs{
609 background-color: #1c1c1f;
610 border-bottom: 1px solid #1c1c1f;
611 }
612
613
614 .pagelayer-elpd-tabs{
615 display: flex;
616 align-items: center;
617 }
618
619 .pagelayer-widget-tabs{
620 display: flex;
621 text-align: center;
622 margin-left: -17px;
623 }
624
625 .pagelayer-widget-tab{
626 flex:1;
627 }
628
629 .pagelayer-elpd-options{
630 text-align:right;
631 display:inline-block;
632 margin-right:10px;
633 }
634
635 .pagelayer-elpd-options i{
636 padding:4px 5px;
637 cursor:pointer;
638 }
639
640 .pagelayer-dark .pagelayer-elpd-options i{
641 color:#777777;
642 }
643
644 .pagelayer-dark .pagelayer-elpd-options i:hover{
645 color: #ffffff;
646 }
647
648 .pagelayer-form-item {
649 border-bottom: 1px dashed #e6e6e6;
650 padding: 10px 8px 10px 6px;
651 margin-bottom: 0px;
652 position: relative;
653 }
654
655 [pagelayer-access-item]{
656 position: absolute;
657 z-index: -100;
658 top: 0px;
659 visibility: hidden;
660 }
661
662 .pagelayer-access-item-visible{
663 position: relative !important;
664 z-index: unset !important;
665 visibility: visible !important;
666 }
667
668 .pagelayer-dark .pagelayer-form-item{
669 border-bottom: 1px dashed #686870;
670 }
671
672 .pagelayer-form-item:hover .pagelayer-elp-default[data_show=true]{
673 display:initial;
674 }
675
676 .pagelayer-elp-label-div, .pagelayer-elp-link-label-div{
677 padding:4px 0px 4px 0px;
678 position:relative;
679 }
680
681 .pagelayer-elp-label-div[type=select]{
682 width:50%;
683 }
684
685 .pagelayer-elp-label, .pagelayer-elp-link-label{
686 display: inline-block;
687 color: #555;
688 font-size: 12px;
689 line-height: 150%;
690 }
691
692 .pagelayer-dark .pagelayer-elp-label,
693 .pagelayer-dark .pagelayer-elp-link-label,
694 .pagelayer-dark .pagelayer-post-category,
695 .pagelayer-dark .pagelayer-elp-postCategory,
696 .pagelayer-dark .pagelayer-elp-postdate::-webkit-datetime-edit-second-field{
697 color:#bdbdbd;
698 }
699
700 .pagelayer-elp-heading{
701 font-size: 13px;
702 font-weight:600;
703 line-height: 150%;
704 }
705
706 .pagelayer-elp-screen{
707 display: inline-block;
708 text-align: center;
709 z-index: 1;
710 vertical-align: middle;
711 position: relative;
712 }
713
714 .pagelayer-elp-screen .pli{
715 padding: 0;
716 cursor: pointer;
717 box-shadow: 0 0 0.5rem #babbbc;
718 height: 30px;
719 width: 30px;
720 border-radius: 50%;
721 line-height: 30px;
722 transition-duration: 0.1s;
723 }
724
725 .pagelayer-dark .pagelayer-elp-screen .pli{
726 color:#bdbdbd;
727 }
728
729
730 .pagelayer-elp-screen .pli-desktop:not(.pagelayer-prop-screen),
731 .pagelayer-elp-screen .pli-tablet:not(.pagelayer-prop-screen),
732 .pagelayer-elp-screen .pli-mobile:not(.pagelayer-prop-screen){
733 position: absolute;
734 transform: none;
735 left: 0;
736 display:none;
737 opacity:0;
738 background:#aaaaaa;
739 color:#ffffff;
740 }
741
742 .pagelayer-dark .pagelayer-elp-screen .pli-desktop:not(.pagelayer-prop-screen),
743 .pagelayer-dark .pagelayer-elp-screen .pli-tablet:not(.pagelayer-prop-screen),
744 .pagelayer-dark .pagelayer-elp-screen .pli-mobile:not(.pagelayer-prop-screen){
745 background:#0d47a1;
746 }
747
748 .pagelayer-elp-screen .pli-desktop.open{
749 transform: rotate(-90deg) translate(30px, -27px) rotate(90deg);
750 transition-delay: 0s;
751 top:-5px;
752 left: 40px;
753 opacity:1;
754 display:block;
755 }
756
757 .pagelayer-elp-screen .pli-tablet.open{
758 transform: rotate(-90deg) translate(0px, -6px) rotate(90deg);
759 transition-delay: 0.1s;
760 top:0px;
761 left: 40px;
762 opacity:1;
763 display:block;
764 }
765
766 .pagelayer-elp-screen .pli-mobile.open{
767 transform: rotate(-90deg) translate(-30px, -27px) rotate(90deg);
768 transition-delay: 0.2s;
769 top:5px;
770 left: 40px;
771 opacity:1;
772 display:block;
773 }
774
775 .pagelayer-elp-screen .pagelayer-prop-screen{
776 box-shadow: none;
777 z-index: 2;
778 font-size: 12px;
779 height: 20px;
780 width: 20px;
781 line-height: 20px;
782 }
783
784 .pagelayer-elp-screen .pli:not(.pagelayer-prop-screen):hover{
785 background-color: #3E8EF7;
786 }
787
788 .pagelayer-dark .pagelayer-elp-screen .pli:not(.pagelayer-prop-screen):hover{
789 background-color: #1066fd;
790 }
791
792 .pagelayer-elp-screen .pagelayer-prop-screen:hover,
793 .pagelayer-typo-default:hover i,
794 .pagelayer-elp-default:hover i{
795 color: #3E8EF7;
796 }
797
798 .pagelayer-elp-units{
799 display: inline-block;
800 float:right;
801 padding-top:4px;
802 }
803
804 .pagelayer-elp-units span{
805 padding:1px 4px;
806 font-size:12px;
807 cursor: pointer;
808 }
809
810 .pagelayer-dark .pagelayer-elp-units span{
811 color:#bdbdbd;
812 }
813
814 .pagelayer-elp-units span[selected] {
815 color: #3e8ef7;
816 }
817
818 /* Default button css start */
819 .pagelayer-elp-default{
820 display:none;
821 width: 20px;
822 height: 20px;
823 cursor: pointer;
824 margin-left: 4px;
825 position: absolute;
826 top: 9px;
827 }
828
829 .pagelayer-elp-default:focus{
830 outline:none;
831 }
832
833 .pagelayer-elp-default i{
834 font-size: 10px;
835 color: black;
836 }
837
838 /* Default button css ends */
839
840 .pagelayer-elp-desc, .pagelayer-elp-permalink-a, .pagelayer-elp-link-desc{
841 color:#757575;
842 font-size: 12px;
843 line-height: 20px;
844 font-style: italic;
845 margin-top: 5px;
846 display:block;
847 word-break: break-word;
848 }
849
850 .pagelayer-elpd-body input,
851 .pagelayer-elpd-body textarea,
852 .pagelayer-elpd-body select,
853 .pagelayer-elpd-body option,
854 .pagelayer-elp-multiselect{
855 font-size: 13px !important;
856 color: #666;
857 border-radius: unset;
858 border:1px solid #CCC;
859 line-height: 26px;
860 width: 100%;
861 }
862
863 .pagelayer-elp-textarea{
864 border-radius: 3px !important;
865 resize:vertical;
866 }
867
868 .pagelayer-dark .pagelayer-elpd-body input,
869 .pagelayer-dark .pagelayer-elpd-body textarea,
870 .pagelayer-dark .pagelayer-elpd-body select,
871 .pagelayer-dark .pagelayer-elpd-body option,
872 .pagelayer-dark .pagelayer-add-cat-btn input,
873 .pagelayer-dark .pagelayer-elp-multiselect{
874 border:1px solid #6e6d6d;
875 }
876
877 .pagelayer-dark .pagelayer-elpd-body input,
878 .pagelayer-dark .pagelayer-elpd-body textarea,
879 .pagelayer-dark .pagelayer-elpd-body select,
880 .pagelayer-dark .pagelayer-elpd-body option,
881 .pagelayer-dark .pagelayer-add-cat-btn input,
882 .pagelayer-dark .pagelayer-elp-multiselect{
883 color:#bdbdbd;
884 }
885
886 .pagelayer-elpd-body input:focus,
887 .pagelayer-elpd-body textarea:focus,
888 .pagelayer-elpd-body select:focus{
889 border-color: #00A0D2;
890 box-shadow: 0 0 1px #00A0D2 inset;
891 }
892
893 .pagelayer-elp-button{
894 text-transform: unset;
895 border: 1px solid #00A0D2;
896 font-weight: unset;
897 font-size: 12px;
898 margin:5px;
899 min-height: unset;
900 background-color: #00A0D2;
901 color: #fff;
902 transition: all 0.3s;
903 border-radius: unset;
904 border-radius: 2px;
905 padding: 10px 15px;
906 cursor:pointer;
907 }
908
909 .pagelayer-elp-button:hover{
910 background-color: #00A0D2bf;
911 border-color: #00A0D2;
912 }
913
914 .pagelayer-elp-image-div,
915 .pagelayer-elp-retina-image-div,
916 .pagelayer-elp-retina-mobile-image-div{
917 padding:7px;
918 width:90%;
919 margin:5px auto;
920 height:150px;
921 position:relative;
922 border: 1px solid #2EA5DF;
923 }
924
925 /* image drop zone css start */
926 .pagelayer-elp-drop-zone{
927 position:absolute;
928 text-align:center;
929 width:100%;
930 height:100%;
931 top:0;
932 left:0;
933 z-index:3;
934 background-color: #2ea5dff0;
935 display:none;
936 }
937
938 .pagelayer-elp-drop-zone *{
939 pointer-events: none;
940 }
941
942 .pagelayer-elp-drop-zone > div{
943 position: relative;
944 top: 50%;
945 -webkit-transform: translateY(-50%);
946 -ms-transform: translateY(-50%);
947 transform: translateY(-50%);
948 text-align:center;
949 }
950
951 .pagelayer-elp-drop-zone div *{
952 color:white;
953 }
954
955 .pagelayer-elp-drop-zone div i{
956 font-size:20px;
957 }
958
959 .pagelayer-elp-drop-zone div h4{
960 margin: 12px;
961 }
962
963 .pagelayer-elp-img-up-progress {
964 width: 50%;
965 margin-left: auto;
966 margin-right: auto;
967 background-color: transparent;
968 border: 2px solid white;
969 border-radius: 20px;
970 padding: 4px;
971 }
972
973 .pagelayer-elp-img-up-bar {
974 width: 3%;
975 height: 5px;
976 background-color: white;
977 line-height: 5px;
978 text-align: center;
979 border-radius: 20px;
980 }
981 /* image drop zone css start */
982
983 .pagelayer-elp-modal,
984 .pagelayer-elp-access{
985 cursor: pointer;
986 padding: 10px;
987 display: block;
988 margin: 0 auto;
989 position: absolute;
990 font-size:1.5rem;
991 top: 0px;
992 right: 12px;
993 color: #333;
994 vertical-align: middle;
995 }
996
997 .pagelayer-elp-access .pli-caret-right{
998 font-size: 18px;
999 line-height: 1.5;
1000 }
1001
1002 .pagelayer-elp-access .pli-caret-right:hover{
1003 color: #3e8ef7;
1004 }
1005
1006 .pagelayer-elp-access .pli-caret-open:before{
1007 content: "\f0d7" !important;
1008 }
1009
1010 .pagelayer-pro-notice,
1011 .pagelayer-confirm-box-holder {
1012 position: fixed;
1013 top: 0px;
1014 z-index: 10000;
1015 width: 100%;
1016 display: none;
1017 left: 0px;
1018 height: 100vh;
1019 }
1020
1021 .pagelayer-pro-div,
1022 .pagelayer-confirm-box{
1023 margin: 25vh auto;
1024 max-width: 500px;
1025 padding: 20px;
1026 background-color: #fff;
1027 box-shadow: 0 0 15px -5px;
1028 }
1029
1030 .pagelayer-pro-x{
1031 float:right;
1032 font-size: 13px;
1033 cursor: pointer;
1034 }
1035
1036 .pagelayer-pro-head{
1037 text-align: center;
1038 }
1039
1040 .pagelayer-pro-message,
1041 .pagelayer-confirmation-msg{
1042 margin: 25px auto;
1043 font-size: 15px;
1044 padding: 2px 25px;
1045 text-align: center;
1046 line-height: 1.8;
1047 }
1048
1049 .button-pagelayer{
1050 padding: 12px 25px !important;
1051 font-size: 15px !important;
1052 font-weight: bold;
1053 background: #7444fd !important;
1054 color: #fff !important;
1055 border: 1px solid #7444fd !important;
1056 transition: all .3s linear;
1057 cursor: pointer;
1058 text-decoration: none;
1059 display: inline-block;
1060 }
1061
1062 .button-pagelayer:hover{
1063 background: #fff !important;
1064 color: #7444fd !important;
1065 }
1066
1067 .pagelayer-elp-access-holder{
1068 position: absolute;
1069 border: 1px solid #ccc;
1070 top: 42px;
1071 background: #fff;
1072 z-index: 100;
1073 right: 8px;
1074 width: 95%;
1075 box-shadow: 0 0 15px -5px;
1076 display: none;
1077 }
1078
1079 .pagelayer-elp-image{
1080 height: 100%;
1081 -webkit-background-size: cover;
1082 background-size: cover;
1083 background-position: 50%;
1084 cursor:pointer;
1085 }
1086
1087 .pagelayer-elp-image-delete,
1088 .pagelayer-elp-retina-delete,
1089 .pagelayer-elp-retina-mobile-delete,
1090 .pagelayer-elp-image-retina{
1091 cursor: pointer;
1092 position: absolute;
1093 top: 4px;
1094 right: 4px;
1095 background-color: #2EA5DF;
1096 padding: 5px 9px;
1097 max-width: 28px;
1098 max-height: 28px;
1099 -webkit-box-sizing: content-box;
1100 -moz-box-sizing: content-box;
1101 box-sizing: content-box;
1102 border-radius: 2px;
1103 }
1104
1105 .pagelayer-elp-image-retina{
1106 right:50px;
1107 }
1108
1109 .pagelayer-elp-image-ai{
1110 position: absolute;
1111 top: -5px;
1112 left: -5px;
1113 }
1114
1115 .pagelayer-elp-image-ai input{
1116 width: 18px;
1117 height: 18px;
1118 }
1119
1120 .pagelayer-elp-image-delete .pli,
1121 .pagelayer-elp-retina-delete .pli,
1122 .pagelayer-elp-retina-mobile-delete .pli,
1123 .pagelayer-elp-image-retina .pli{
1124 color: #fff;
1125 }
1126
1127 .pagelayer-hidden{
1128 display:none !important;
1129 }
1130
1131 .pagelayer-elp-radio-div{
1132 display:flex;
1133 }
1134
1135 .pagelayer-elp-radio:first-child{
1136 border-radius: 4px 0px 0px 4px;
1137 -moz-outline-radius: 7px 0px 0px 7px;
1138 }
1139
1140 .pagelayer-elp-radio:last-child{
1141 border-radius: 0px 4px 4px 0px;
1142 -moz-outline-radius: 0px 7px 7px 0px;
1143 }
1144
1145 .pagelayer-elp-radio{
1146 display: inline-block;
1147 vertical-align: middle;
1148 padding: 6px;
1149 cursor: pointer;
1150 font-size:12px;
1151 color: #666 !important;
1152 text-decoration: none;
1153 background: #eee;
1154 flex:1;
1155 text-align:center;
1156 }
1157
1158 .pagelayer-elp-radio:hover{
1159 background-color: #4CB5E8 !important;
1160 color:#fff !important;
1161 transition: all 0.3s;
1162 }
1163
1164 .pagelayer-dark .pagelayer-elp-radio{
1165 background-color: #fafafa;
1166 }
1167
1168 .pagelayer-dark .pagelayer-elp-radio:hover,
1169 .pagelayer-dark .pagelayer-elp-radio-active{
1170 background-color:#0d47a1 !important;
1171 }
1172
1173 .pagelayer-elp-radio-active{
1174 background-color: #1A9CDB !important;
1175 color:#ffffff !important;
1176 }
1177
1178 .pagelayer-elp-typo-edit-div,
1179 .pagelayer-elp-color-div-holder{
1180 cursor: pointer;
1181 width: 70px;
1182 height: 30px;
1183 border-radius: 3px;
1184 margin: 0 auto;
1185 position: absolute;
1186 top: 5px;
1187 right: 11px;
1188 border: solid 1px #999;
1189 color: #333;
1190 display: flex;
1191 }
1192
1193 .pagelayer-elp-typo-edit-div{
1194 width: 34px;
1195 }
1196
1197 .pagelayer-elp-color-div{
1198 cursor: pointer;
1199 padding: 3px;
1200 width: 28px;
1201 height: 23px;
1202 display: block;
1203 border-radius: 2px;
1204 margin: 0 auto;
1205 position: absolute;
1206 top: 5px;
1207 right: 7px;
1208 border: solid 1px #999;
1209 color: #333;
1210 vertical-align: middle;
1211 }
1212
1213 .pagelayer-elp-color-div-holder .pagelayer-elp-color-div{
1214 position: relative;
1215 border: 0px;
1216 height: calc(100% - 6px);
1217 top: 0;
1218 left: 0;
1219 }
1220
1221 .pagelayer-elp-color-preview{
1222 height: 100%;
1223 background-size: cover !important;
1224 border-radius: 2px;
1225 flex: 1;
1226 }
1227
1228 .pagelayer-elp-color-global{
1229 width: 50%;
1230 border-right: 1px solid #999;
1231 display: flex;
1232 align-items: center;
1233 justify-content: center;
1234 }
1235
1236 .pagelayer-elp-global-icon:hover,
1237 .pagelayer-elp-color-global:hover{
1238 color: #137dc5;
1239 }
1240
1241 .pagelayer-elp-typo-edit-div .pli-pencil{
1242 display: flex;
1243 align-items: center;
1244 justify-content: center;
1245 flex: 1;
1246 }
1247
1248 .pagelayer-elp-global-icon:before,
1249 .pagelayer-elp-color-global:before{
1250 content: "\e9c9";
1251 font-family: 'pagelayer', "Font Awesome 5 Free" !important;
1252 }
1253
1254 .pagelayer-white-border{
1255 outline: 1px solid #dfdfdf;
1256 }
1257
1258 .pagelayer-global-selected,
1259 .pagelayer-global-font-list-item:hover,
1260 .pagelayer-global-color-list-item:hover{
1261 background: #f9f9f9;
1262 }
1263
1264 .pagelayer-global-selected:after{
1265 content: "\ea10";
1266 font-family: 'pagelayer', "Font Awesome 5 Free" !important;
1267 color: #137dc5;
1268 }
1269
1270 .pagelayer-global-font-list,
1271 .pagelayer-global-color-list{
1272 position: absolute;
1273 background: #fff;
1274 padding: 10px 0;
1275 z-index: 9999;
1276 border-radius: 4px;
1277 right: 0;
1278 top: 35px;
1279 width: 250px;
1280 display: none;
1281 max-height: 350px;
1282 overflow-y: auto;
1283 font-size: 12px;
1284 box-shadow: 0px 0px 13px rgb(0 0 0 / 30%);
1285 }
1286
1287 .pagelayer-global-font-list-item,
1288 .pagelayer-global-color-list-item{
1289 display: flex;
1290 padding: 10px 20px;
1291 cursor: pointer;
1292 }
1293
1294 .pagelayer-global-font-list-item .pagelayer-global-font-title,
1295 .pagelayer-global-color-list-item .pagelayer-global-color-title{
1296 flex: 1;
1297 }
1298
1299 .pagelayer-global-color-list-item .pagelayer-global-color-pre{
1300 position: relative;
1301 border: 1px solid #f1f1f1;
1302 margin-right: 7px;
1303 padding: 1px;
1304 background-clip: content-box;
1305 }
1306
1307 .pagelayer-global-color-list-item .pagelayer-global-color-pre:before{
1308 content: '';
1309 padding: 0px 10px;
1310 background-color: #ff000000;
1311 background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAICAYAAADED76LAAAALElEQVQYGWO8d+/efwYkoKioiMRjYGBC4WHhUK6A8T8QIJt8//59ZC493AAAQssKpBK4F5AAAAAASUVORK5CYII=);
1312 -webkit-background-size: 12px 12px;
1313 background-size: 6px 6px;
1314 position: relative;
1315 z-index: -1;
1316 }
1317
1318 .pagelayer-global-setting-color{
1319 position: relative;
1320 box-shadow: 0 1px 2px #d2cfcf;
1321 padding: 10px 4px;
1322 margin-bottom: 5px;
1323 margin-top: -10px;
1324 cursor: default;
1325 }
1326
1327 .pagelayer-global-setting-color b{
1328 margin-left: 11px;
1329 }
1330
1331 .pagelayer-global-setting-color .pli{
1332 right: 15px;
1333 position: absolute;
1334 cursor: pointer;
1335 }
1336
1337 .pagelayer-elp-typo-icons .pli-service{
1338 cursor: pointer;
1339 }
1340
1341 .pagelayer-elp-global-typo .pli:hover,
1342 .pagelayer-global-setting-color .pli:hover{
1343 color: #137dc5;
1344 }
1345
1346 .pagelayer-active-global{
1347 color: #137dc5;
1348 }
1349
1350 .pagelayer-blank-preview{
1351 background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAKAAAACgBAMAAAB54XoeAAAAAXNSR0IB2cksfwAAAAlwSFlzAAALEwAACxMBAJqcGAAAAC1QTFRFAAAAAQEBBQUFDAwM9PT0+vr6/////v7+BAQE+/v7AgIC/f39AwMDDQ0N8/Pzb6ggJQAAAZ5JREFUeJztlr1twzAQhU+tK7ELDDdBNsgO2SAznAr3JAJXWSJp49YLuPAW2cJbhEdSQZBCEMRHgMVj5U80HnkSfz4Ra06eXjSoTvr6HKGGU94o8vBpqPr2LjLUcAr8ikNEnLx6jT93VZxneBn1Zg9uOlxsxO0suTkXfJywTsG5Ok5x9hK0NKM6bhEosh+nq+HJD+c6TmvG2r8RtrMb9g4aOKY3CA0ElyyHcbAHIXNw5Q9bWeLG2aUH80ItU97K8ihlhmmIUFb+dpZvOceNE7fOnz/UsNztHAMEzSwf6idEqTOLHv0R8THc7/o72Qzrl8vMwAVdmreDFhloLxQcCC65QSC45AYfBV0yfGGjtx78cLjrVaHHF/yAhV8B8EsKfo3CL/pRHFZFnIBlCa5z9EP6If1wBdMPe5QleMkNAumHuZ9+SD9cYPphjzpHP6Qf0g9XMP2wR1mCl9wgkH6Y++mH9MMFph/2qHP0Q/oh/XAF0w97lCV4yQ0C6Ye5n35IP1xg+mGPOkc/pB/SD1cw/bBHWYKX3CCQfpj76Yfr+QfwnsxmcLvdhQAAAABJRU5ErkJggg==') !important;
1352 background-size: cover !important;
1353 opacity: 70%;
1354 }
1355
1356 .picker_arrow {
1357 display:none;
1358 }
1359
1360 .picker_wrapper {
1361 top: 13px !important;
1362 right: -15px !important;
1363 font-family: Roboto !important;
1364 font-size: 12px;
1365 border-radius: 4px;
1366 background:#f7f7f7;
1367 }
1368
1369 .picker_done button{
1370 border: #318088 1px solid;
1371 color: #fff;
1372 background: #248a4c;
1373 border-radius: 2px;
1374 font-size: 14px;
1375 line-height: 1.5;
1376 }
1377
1378 .picker_editor input{
1379 font-family: Roboto !important;
1380 font-size: 12px;
1381 }
1382
1383 .pagelayer-elp-color-span{
1384 padding: 2px 0;
1385 height: 28px;
1386 line-height: 28px;
1387 float: left;
1388 font-size: 10px;
1389 }
1390
1391 .pagelayer-elp-color-div .picker_wrapper{
1392 margin-top: 22px !important;
1393 border: 1px solid rgba(0,0,0,0.2) !important;
1394 background: #fff !important;
1395 box-shadow: 0 3px 5px rgba(0,0,0,0.2) !important;
1396 }
1397
1398 .pagelayer-dark .pagelayer-elp-color-div .picker_wrapper{
1399 border: 1px solid #0277bd !important;
1400 background: #252529 !important;
1401 box-shadow: 0 0.5rem 1rem #00000026 !important;
1402 }
1403
1404 .picker_wrapper{
1405 z-index:12 !important;
1406 }
1407
1408 .pagelayer-dark .picker_done button {
1409 border: none;
1410 font-family: roboto;
1411 color: #777;
1412 background-color: #ffffff;
1413 }
1414
1415 .pagelayer-dark .picker_editor input{
1416 color: #bdbdbd;
1417 background-color: #1c1c1f;
1418 }
1419
1420 .pagelayer-elp-remove-color{
1421 background-color:#616161;
1422 position: absolute;
1423 top: 0;
1424 right: 0;
1425 z-index:1;
1426 box-shadow: 0 0 3px #333;
1427 padding: 3px;
1428 border-top-right-radius: 2px;
1429 }
1430
1431 .pagelayer-elp-remove-color .pli:before{
1432 color: #fff;
1433 font-size: 7px;
1434 }
1435
1436 .pagelayer-elp-icon-div{
1437 cursor: pointer;
1438 padding: 6px;
1439 border: solid 1px #d1d1d1;
1440 background: #fffffc;
1441 color: #333;
1442 vertical-align: middle;
1443 width: 126px;
1444 height: 18px;
1445 display: block;
1446 border-radius: 4px;
1447 margin: 0 auto;
1448 position: absolute;
1449 top: 7px;
1450 right: 10px;
1451 }
1452
1453 .pagelayer-dark .pagelayer-elp-icon-div{
1454 background-color: #1c1c1f;
1455 color: #bdbdbd;
1456 border: 1px solid #6e6d6d;
1457 }
1458
1459 .pagelayer-elp-icon-preview{
1460 position: relative;
1461 display: block;
1462 margin-right: 5px;
1463 float: left;
1464 width: 75%;
1465 height: auto;
1466 border: none;
1467 overflow: hidden;
1468 white-space: nowrap;
1469 text-overflow: ellipsis;
1470 }
1471
1472 .pagelayer-elp-icon-preview i{
1473 padding-right: 5px;
1474 font-size: 19px;
1475 color: #666;
1476 vertical-align: middle;
1477 }
1478
1479 .pagelayer-dark .pagelayer-elp-icon-preview i,
1480 .pagelayer-dark .pagelayer-elp-icon-name{
1481 color:#bdbdbd;
1482 }
1483
1484 .pagelayer-elp-icon-name{
1485 font-size: 13px;
1486 }
1487
1488 .pagelayer-elp-icon-open,
1489 .pagelayer-elp-icon-close{
1490 float: right;
1491 font-size: 10px;
1492 padding: 0px;
1493 line-height: 20px;
1494 }
1495
1496 .pagelayer-dark .pagelayer-elp-icon-open,
1497 .pagelayer-dark .pagelayer-elp-icon-close{
1498 color:#bdbdbd;
1499 }
1500
1501 .pagelayer-elp-icon-close{
1502 padding-right: 5px;
1503 font-size: 12px;
1504 }
1505
1506 .pagelayer-elp-icon-remove{
1507 position: absolute;
1508 right: 20px;
1509 font-size: 11px;
1510 top: 10px;
1511 z-index: 10;
1512 }
1513
1514 .pagelayer-elp-icon-selector,
1515 .pagelayer-elp-link-list{
1516 position: absolute;
1517 z-index: 1000;
1518 border: 1px solid rgba(0,0,0,0.2) !important;
1519 background: #fff !important;
1520 box-shadow: 0 3px 5px rgba(0,0,0,0.2) !important;
1521 -webkit-border-radius: 2px !important;
1522 text-shadow: none !important;
1523 padding: 5px;
1524 height: auto;
1525 box-sizing: border-box;
1526 display: none;
1527 width: 80%;
1528 border-radius: 2px;
1529 margin: 0 0 0 auto;
1530 top: 40px;
1531 right: 10px;
1532 }
1533
1534 .pagelayer-dark .pagelayer-elp-icon-selector{
1535 background: #252529 !important;
1536 border: 1px solid #ffffff73 !important;
1537 }
1538
1539 .pagelayer-elp-search-icon{
1540 margin-bottom: 5px !important;
1541 padding: 2px 6px;
1542 line-height: 20px !important;
1543 border-radius: 3px !important;
1544 }
1545
1546 .pagelayer-elp-icon-list{
1547 width: 100%;
1548 -moz-box-sizing: border-box;
1549 -webkit-box-sizing: border-box;
1550 box-sizing: border-box;
1551 padding: 0;
1552 max-height: 183px;
1553 overflow-y: auto;
1554 }
1555
1556 .pagelayer-elp-icon-list::-webkit-scrollbar {
1557 -webkit-appearance: none;
1558 }
1559
1560 .pagelayer-elp-icon-list::-webkit-scrollbar:vertical {
1561 width: 10px;
1562 }
1563
1564 .pagelayer-elp-icon-list::-webkit-scrollbar-thumb {
1565 border-radius: 8px;
1566 border: 2px solid white;
1567 background-color: rgba(0, 0, 0, .5);
1568 }
1569
1570 .pagelayer-elp-icon-list::-webkit-scrollbar-track {
1571 background-color: #fff;
1572 border-radius: 8px;
1573 }
1574
1575 .pagelayer-elp-icon-span{
1576 display: block;
1577 margin: 2px;
1578 cursor: pointer;
1579 box-sizing: border-box;
1580 border: 1px solid #dbdbdb;
1581 transition: all 0.3s;
1582 font-size: 13px;
1583 padding: 3px;
1584 }
1585
1586 .pagelayer-dark .pagelayer-elp-icon-span,
1587 .pagelayer-dark .pagelayer-elp-icon-span i{
1588 color:#bdbdbd;
1589 }
1590
1591 .pagelayer-elp-icon-span:hover{
1592 border-color: #00A0D2;
1593 background-color: #3e8ef7;
1594 color: #ffffff;
1595 box-shadow: 0px 1px 1px #3e8ef7bf;
1596 }
1597
1598 .pagelayer-elp-icon-span i{
1599 font-size: 15px;
1600 line-height: 1em;
1601 padding: 3px;
1602 color: #555;
1603 transition: all 0.3s;
1604 vertical-align: middle;
1605 }
1606
1607 .pagelayer-elp-icon-span:hover i{
1608 color: #ffffff;
1609 }
1610
1611 .pagelayer-elp-icon-type{
1612 display:flex;
1613 flex-grow:1;
1614 text-align:center;
1615 }
1616
1617 .pagelayer-elp-icon-type p{
1618 flex-grow: 1;
1619 padding: 5px 0;
1620 margin: 0 0 3px;
1621 cursor: pointer;
1622 font-size: 12px;
1623 background: #999;
1624 color: #ffffff;
1625 border: 1px solid #777;
1626 }
1627
1628 .pagelayer-elp-icon-type p.active{
1629 background-color:#666666;
1630 }
1631
1632 .pagelayer-dark .pagelayer-elp-icon-type p.active{
1633 background: #0277bd;
1634 }
1635
1636 .pagelayer-elp-icon-sets{
1637 line-height: 27px;
1638 height: 27px;
1639 border-radius: 4px;
1640 margin: 5px 0;
1641 }
1642
1643 .pagelayer-video{
1644 width: 100% !important;
1645 /* background: #ccc; */
1646 position: relative;
1647 /* top: -40px;
1648 float: right;
1649 border-radius: 0px 4px 4px 0px; */
1650 }
1651
1652 .pagelayer-video i{
1653 top: 10px;
1654 position: relative;
1655 left: 8px;
1656 }
1657
1658 .pagelayer-elp-slider-div{
1659 display: flex;
1660 padding: 7px 0 0;
1661 }
1662
1663 input.pagelayer-elp-slider{
1664 -webkit-appearance: none;
1665 width: 70%;
1666 height: 10px;
1667 border-radius: 5px;
1668 background-color: #d3d3d3 !important;
1669 outline: none;
1670 opacity: 0.7;
1671 -webkit-transition: .2s;
1672 transition: opacity .2s;
1673 font-size: 0px !important;
1674 padding: 0;
1675 }
1676
1677 .pagelayer-elp-slider:focus{
1678 border-color: transparent;
1679 box-shadow: 0 0 1px transparent;
1680 }
1681
1682 .pagelayer-elp-slider:hover{
1683 opacity: 1;
1684 }
1685
1686 .pagelayer-elp-slider::-webkit-slider-thumb{
1687 -webkit-appearance: none;
1688 appearance: none;
1689 width: 15px;
1690 height: 15px;
1691 border-radius: 50%;
1692 background: #4CAF50;
1693 cursor: pointer;
1694 }
1695
1696 .pagelayer-dark .pagelayer-elp-slider::-webkit-slider-thumb{
1697 background: #3e8ef7;
1698 }
1699
1700 .pagelayer-elp-slider::-moz-range-thumb{
1701 width: 15px;
1702 height: 15px;
1703 border-radius: 50%;
1704 background: #00A0D2;
1705 cursor: pointer;
1706 }
1707
1708 .pagelayer-elp-slider-value{
1709 width: 23% !important;
1710 margin-left: 7%;
1711 margin-top: -12px;
1712 border-radius: 3px !important;
1713 padding: 2px 2px 2px 6px;
1714 border: 0px solid #fff !important;
1715 border-bottom: 1px solid #ccc !important;
1716 }
1717
1718 .pagelayer-elp-datetime-div{
1719 position: relative;
1720 }
1721
1722 .pagelayer-elp-postdate-div{
1723 display: flex;
1724 border: 1px solid lightgrey;
1725 border-radius:3px;
1726 }
1727
1728 .pagelayer-elp-datetime{
1729 width: 99%;
1730 }
1731
1732 .pagelayer-elp-postdate{
1733 border: none !important;
1734 outline: none;
1735 }
1736
1737 .pagelayer-elp-postdate::-webkit-calendar-picker-indicator {
1738 cursor: pointer;
1739 }
1740
1741 .pagelayer-elp-fa-calendar{
1742 position: absolute;
1743 height: 40px;
1744 width: 40px;
1745 background: #000;
1746 right: 0;
1747 top: 0;
1748 }
1749
1750 .pagelayer-elp-checkbox-div{
1751 top: 13px;
1752 right:7px;
1753 position: absolute;
1754 }
1755
1756 input[type="checkbox"].pagelayer-elp-checkbox{
1757 font-size: 30px;
1758 -webkit-appearance: none;
1759 -moz-appearance: none;
1760 appearance: none;
1761 width: 3.5em;
1762 height: 1.7em;
1763 background: #ddd;
1764 border-radius: 3em;
1765 position: relative;
1766 cursor: pointer;
1767 outline: none;
1768 -webkit-transition: all .2s ease-in-out;
1769 transition: all .2s ease-in-out;
1770 }
1771
1772 input[type="checkbox"].pagelayer-elp-checkbox:checked{
1773 background-color: #1A9CDB;
1774 border-color: #1A9CDB;
1775 }
1776
1777 .pagelayer-dark input[type="checkbox"].pagelayer-elp-checkbox:checked{
1778 background-color: #0d47a1;
1779 }
1780
1781 input[type="checkbox"].pagelayer-elp-checkbox:after{
1782 position: absolute;
1783 content: "";
1784 width: 1.5em;
1785 height: 1.5em;
1786 border-radius: 50%;
1787 background: #fff;
1788 -webkit-box-shadow: 0 0 .25em rgba(0,0,0,.3);
1789 box-shadow: 0 0 .25em rgba(0,0,0,.3);
1790 -webkit-transform: scale(.7);
1791 transform: scale(.7);
1792 left: 0;
1793 -webkit-transition: all .2s ease-in-out;
1794 transition: all .2s ease-in-out;
1795 }
1796
1797 input[type="checkbox"].pagelayer-elp-checkbox:checked:after{
1798 left: calc(100% - 1.5em);
1799 }
1800
1801 .pagelayer-elp-input-icon,
1802 .pagelayer-elp-pos-rel{
1803 position: relative;
1804 }
1805
1806 .pagelayer-elp-link-no-addons > .pagelayer-elp-link{
1807 width:100% !important;
1808 }
1809
1810 .pagelayer-elp-link-no-addons > .pagelayer-elp-link-icon{
1811 display:none !important;
1812 }
1813
1814 .pagelayer-elp-input-icon input{
1815 width: 85%;
1816 }
1817
1818 .pagelayer-elp-input-icon i.pli{
1819 padding:1px 10px;
1820 position:relative;
1821 top:0px;
1822 border: 1px solid #d1d1d1;
1823 border-left:0px;
1824 cursor: pointer;
1825 background:#FFF;
1826 line-height:26px !important;
1827 font-size: 13px;
1828 }
1829
1830 .pagelayer-dark .pagelayer-elp-input-icon i.pli{
1831 background: #e0e0e0;
1832 }
1833
1834 .pagelayer-elp-padding-div i.pli{
1835 padding:8px 11px;
1836 border: 1px solid #d1d1d1;
1837 border-left:0px !important;
1838 cursor: pointer;
1839 background: #FFF;
1840 vertical-align:top;
1841 font-size: 12px;
1842 border-top-right-radius: 3px;
1843 border-bottom-right-radius: 3px;
1844 }
1845
1846 .pagelayer-elp-padding-linked{
1847 background: #1a7fb0 !important;
1848 color: #fff !important;
1849 border: 1px solid #1a7fb0 !important;
1850 }
1851
1852 .pagelayer-elp-padding:first-child{
1853 border-top-left-radius: 3px;
1854 border-bottom-left-radius: 3px;
1855 }
1856
1857 .pagelayer-dark .pagelayer-elp-padding-linked{
1858 background: #e0e0e0 !important;
1859 }
1860
1861 .pagelayer-elp-dimension-div i.pli{
1862 padding:8px 11px;
1863 border: 1px solid #d1d1d1;
1864 border-left:0px !important;
1865 cursor: pointer;
1866 background: #FFF;
1867 vertical-align:top;
1868 font-size: 12px;
1869 border-top-right-radius: 3px;
1870 border-bottom-right-radius: 3px;
1871 }
1872
1873 .pagelayer-elp-dimension-linked{
1874 background: #1a7fb0 !important;
1875 color: #fff !important;
1876 border: 1px solid #1a7fb0 !important;
1877 }
1878
1879 .pagelayer-elp-dimension:first-child{
1880 border-top-left-radius: 3px;
1881 border-bottom-left-radius: 3px;
1882 }
1883
1884 /* Pagelayer Multi Select Property */
1885 .pagelayer-elp-multiselect{
1886 min-height: 25px;
1887 width:95%;
1888 }
1889
1890 .pagelayer-elp-multiselect-ul{
1891 list-style:none;
1892 padding:0;
1893 margin:0;
1894 display:none;
1895 border: 1px solid #CCC;
1896 border-radius: 0 0 5px 5px;
1897 border-top:none;
1898 position:absolute;
1899 background:rgb(255, 255, 255);
1900 z-index:1;
1901 width:99%;
1902 }
1903
1904 .pagelayer-dark .pagelayer-elp-multiselect-ul{
1905 background: #1c1c1f;
1906 border: 1px solid #6e6d6d;
1907 border-top: none;
1908 box-shadow: 0 0.5rem 1rem #00000026;
1909 }
1910
1911 .pagelayer-elp-multiselect-option{
1912 font-size:13px;
1913 padding:4px 8px;
1914 cursor:pointer;
1915 }
1916
1917 .pagelayer-dark .pagelayer-elp-multiselect-option{
1918 color: #777;
1919 }
1920
1921 .pagelayer-elp-multiselect-option[selected="selected"]{
1922 background: #f2f2f2;
1923 }
1924
1925 .pagelayer-elp-multiselect-remove{
1926 color: #f2f2f2;
1927 padding-left: 2px;
1928 cursor: pointer;
1929 }
1930
1931 .pagelayer-dark .pagelayer-elp-multiselect-option[selected="selected"]{
1932 background: #0277bd;
1933 color: #fff;
1934 }
1935
1936 .pagelayer-elp-multiselect-selected{
1937 padding: 3px 5px;
1938 border-radius: 5px;
1939 margin: 2px;
1940 background: #44a9db;
1941 line-height: 13px;
1942 font-size: 13px;
1943 color: #fff;
1944 }
1945
1946 .pagelayer-dark .pagelayer-elp-multiselect-selected{
1947 color: #777;
1948 background: #ffffff;
1949 }
1950
1951 .pagelayer-elp-multiselect{
1952 display: flex;
1953 flex-wrap: wrap;
1954 padding: 5px;
1955 border-radius: 3px;
1956 }
1957
1958 /* Pagelayer Multi Select Property end*/
1959
1960 .pagelayer-elp-multi_image{
1961 padding: 3px;
1962 width: 60%;
1963 margin: 5px auto;
1964 border: 1px solid #d5dadf;
1965 position: relative;
1966 text-align: center;
1967 background: #4CBCDF;
1968 color: #fff;
1969 font-size: 13px;
1970 cursor: pointer;
1971 }
1972
1973 .pagelayer-elp-multi_image{
1974 height: 100%;
1975 -webkit-background-size: cover;
1976 background-size: cover;
1977 background-position: 50%;
1978 }
1979
1980 .pagelayer-elp-multi_image-thumbs{
1981 margin-top:10px;
1982 }
1983
1984 .pagelayer-elp-multi_image-thumb{
1985 display: inline-block;
1986 width: 44px;
1987 height: 44px;
1988 background-size: cover;
1989 background-position: 50% 50%;
1990 margin: 0 7px 0 0;
1991 border: 2px solid #d5dadf;
1992 }
1993
1994 .pagelayer-grid-columns-1 .pagelayer-grid-item{
1995 width: 100%;
1996 }
1997
1998 .pagelayer-grid-columns-2 .pagelayer-grid-item{
1999 width: 50%;
2000 }
2001
2002 .pagelayer-grid-columns-3 .pagelayer-grid-item{
2003 width: 33%;
2004 }
2005
2006 .pagelayer-grid-columns-4 .pagelayer-grid-item{
2007 width: 25%;
2008 }
2009
2010 .pagelayer-grid-columns-5 .pagelayer-grid-item{
2011 width: 20%;
2012 }
2013
2014 .pagelayer-grid-columns-6 .pagelayer-grid-item{
2015 width: 16%;
2016 }
2017
2018 .pagelayer-grid-columns-7 .pagelayer-grid-item{
2019 width: 14%;
2020 }
2021
2022 .pagelayer-grid-columns-8 .pagelayer-grid-item{
2023 width: 12%;
2024 }
2025
2026 .pagelayer-grid-columns-9 .pagelayer-grid-item{
2027 width: 11%;
2028 }
2029
2030 .pagelayer-grid-columns-10 .pagelayer-grid-item{
2031 width: 10%;
2032 }
2033
2034 .pagelayer-grid-item{
2035 float: left;
2036 }
2037
2038 .pagelayer-elp-audio-div,
2039 .pagelayer-elp-media-div{
2040 position: relative;
2041 }
2042
2043 .pagelayer-elp-audio,
2044 .pagelayer-elp-media{
2045 width: calc(100% - 40px);
2046 }
2047
2048 .pagelayer-elp-audio-insert,
2049 .pagelayer-elp-media-select{
2050 position: absolute;
2051 top: 0;
2052 right: 0;
2053 background-color: #000;
2054 height: 100%;
2055 width: 40px;
2056 -webkit-box-sizing: content-box;
2057 -moz-box-sizing: content-box;
2058 box-sizing: content-box;
2059 }
2060
2061 .pagelayer-elp-shadow-div,
2062 .pagelayer-elp-typo-div,
2063 .pagelayer-elp-filter-div{
2064 padding: 0px 10px;
2065 box-shadow: 0px 0px 13px rgba(0,0,0,.3);
2066 position: relative;
2067 margin-top: 8px;
2068 border: 1px solid #ddd;
2069 display: none;
2070 position: absolute;
2071 background-color: #fff;
2072 width: 86%;
2073 z-index: 12;
2074 }
2075
2076 .pagelayer-typo-default{
2077 display:none;
2078 width: 20px;
2079 height: 20px;
2080 cursor: pointer;
2081 margin-left: 4px;
2082 }
2083
2084 .pagelayer-global-on .pagelayer-elp-typo:not([pagelayer-set-global]):hover .pagelayer-typo-default{
2085 display: inline-block;
2086 }
2087
2088 .pagelayer-dark .pagelayer-elp-shadow-div,
2089 .pagelayer-dark .pagelayer-elp-typo-div,
2090 .pagelayer-dark .pagelayer-elp-filter-div{
2091 background-color:#252529;
2092 }
2093
2094
2095 .pagelayer-prop-edit{
2096 padding: 7px;
2097 border: 1px solid #3e8ca4;
2098 width: 20px;
2099 position: absolute;
2100 top: 7px;
2101 right: 11px;
2102 text-align: center;
2103 cursor: pointer;
2104 border-radius: 3px;
2105 }
2106
2107 .pagelayer-prop-edit i{
2108 font-size: 14px;
2109 color: #484848;
2110 }
2111
2112 .pagelayer-dark .pagelayer-prop-edit i{
2113 color:#bdbdbd;
2114 }
2115
2116 .pagelayer-prop-show{
2117 display: block;
2118 }
2119
2120 .pagelayer-elp-shadow-color{
2121 padding: 15px 0px !important;
2122 }
2123
2124 .pagelayer-elp-shadow-color .pagelayer-elp-color-div{
2125 top:7px;
2126 }
2127
2128 .pagelayer-elp-typo,
2129 .pagelayer-elp-prop-grp{
2130 margin: 0px;
2131 padding: 10px 0;
2132 position: relative;
2133 border-bottom: 1px dashed #ccc;
2134 }
2135
2136 .pagelayer-elp-typo-fonts{
2137 padding: 10px 0;
2138 }
2139
2140 .pagelayer-elp-gradient-div .pagelayer-elp-prop-grp{
2141 padding: 5px 0;
2142 }
2143
2144 .pagelayer-elp-gradient-color{
2145 padding: 15px 0px !important;
2146 }
2147
2148 .pagelayer-elp-prop-grp .pagelayer-elp-color-div{
2149 right: 0;
2150 }
2151
2152 .pagelayer-elp-typo-fonts .pagelayer-elp-label,
2153 .pagelayer-elp-typo .pagelayer-elp-label,
2154 .pagelayer-elp-typo .pagelayer-elp-typo-input,
2155 .pagelayer-elp-shadow-div .pagelayer-elp-shadow-input,
2156 .pagelayer-elp-shadow-div .pagelayer-elp-label,
2157 .pagelayer-elp-prop-grp>label, .pagelayer-elp-prop-grp>input{
2158 width: 50%;
2159 }
2160
2161 .pagelayer-elp-filter-div .pagelayer-elp-label{
2162 width:40%;
2163 text-transform: capitalize;
2164 }
2165
2166 .pagelayer-elp-filter-div .pagelayer-elp-filter-val{
2167 float:right;
2168 width:10%;
2169 font-size:13px;
2170 text-align: right;
2171 }
2172
2173 .pagelayer-elp-filter-input{
2174 background-position: center center !important;
2175 background-size: cover !important;
2176 }
2177
2178 .pagelayer-elp-filter-blur .pagelayer-elp-filter-input{
2179 background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAFwAAAAKCAIAAAC2Wq7lAAAAAXNSR0IB2cksfwAAAAlwSFlzAAALEwAACxMBAJqcGAAABq9JREFUeJyVlmtvHGcZhnfOszs7u+s9ENtrI9eqHbWJKSSIlBz4QD/mFxQpUvlSviTKb4nyC4qI/0HkCCgijapQQJBDUe04uPEh69re887OeXa43l2wjNsK+toejd/Dc7if+7nfUTMnhiRJGxsbS0tLk3/TNL1+/fra2hrzvPO8c+fOzZs3eZlsuHv37u3btydL5XL5xo0bv/rwwzeXl9Ikff16b+3Bg3v3fvPs6bMwiqbPTF/92ZX33//FpUvvFoulfq/7ycOHH/36o4d//MRxBpZlrays/PKDD35y6d36XN31gid//9tvf/+7x59+2mg0dF1fXlq6cuXylWvXzp07Z1mFXrfz4MHaxx//YfPFJsZnpqdXfnD+xxcvnHv7fC6fazVbX6x/8fTpsxebm439fU2RL1648NPLl996620rb3W73a1/bj198qTf7w+HQ1mWK5XqwsLC4uIbc3PzZGGYpnoSFNI7hdHJ+cnzePLUkpSRcCBl+M2MmMiMt6X8iCOSzIIcR3E6GmVGYrBDVbSJH1lRVE1jb5ImSRJHYRDFIYYUVcWmooi/NMPxxHN9TdWTUYJFlaEpo1Ey9ithM0wiY5TESYJ5JnVVsy0rCAMiGKWjGMsRxiN84F04HdtniLNh6HpD3cV4pE7yPAXHdx0AJSsydoAjEYOcE/AAJwInYk3TFUmJRUj8BmEYEAd14xSR6brBIALf87udnuP0Qz9UJNk09FwuB1N0zQBkTkErUPA8V1Uk3dBY5bhh6rgOwngwcMjQ9704jgEym8vaUUHxXFCnHr7rEtbQdclfkSRN1UamqcgCGvY7w2Gn3QY2w/hvpvzP8Y3YaZqmKEo2m6V6QeA3j5ps6/UHVCyXs6q1ipRK5UpFMwzHcZuHRy7+3SGh66o+NTWVy+aKpSIjDMJWu+UMnTiISF5RlalyGWRVTS8UberW7fb2Gw3o7flelMRWLletVuM4sW2bzFzPPTo88L3hYIBxn5DsQkFVVDvOg6rn+c1WS9XUoQMsrgLfMikuqCTPKI4H/T5wD5wh7FOXl5dPpkoPZ/7TI8yXSiUkZqIazERRtLm5ebwK5Kx+f34eOArFAqX7/PN/sEYvhUHgDoeLiwv1+kwmIxMWiR8eHv75r3+hG8DLGQyKUyWEAmJTq0ql0h/0Xmxs0gppOgr8APq8sbBQn63Td1SPIn/1VaPdbkEB2if0Pdsu6JrOvGgjVe11up7r8g5RAUXT1XKplNgFyKtrGgoSBPRRZiTaM6JzsZOKSDOQKwrDbg+GOmO+y+r6+vpJFM6ePUvaxxjdv39/dXX1mCbIKiAer966dQthfvnyJe8k/OjRo9XVewHM1xTKuLi4ePXqtWKhQBsBEHB/+erVZ5/9icY2dL1aq62snH/vvZ+riuIF/u727s7Oq3bnS/BCROx8ng1z9Xo2myNJ+gISbW/vuq4DNci8YNsz0zPWzKysSHgE4k67gyiQHt1ocz6fL+RtpIoeBqz2mIMoGq2IzaxpGYomKRJZoTXoTuQQVyhUD5RPCufXxeXU6td7h0nIIgTCsh4/fry9s7O7vaPq2vSZM3VIMjMDymw6OjwcOA6RPX/+nILYBfvijy5C/nfe+aGZNTutdhxGGxvrW1tbFBnI5ufnZ2frXAe1ahV67uy9braahwcHjf0GG/JWntU3l5bn6rOarnGh+J4HF/YPGv3+oFCwOVgqTnHNWfm8Zuh7O7ugtvd6j7zptVqtlsvm6XpVVwGFvsNFr99z+gPXE3r03TTl24agnCbwTeKYhleiwPeLIGUY+qThCRo+kw+hkwMt44d+LitqZuWsJIooLPVAjziezZrgpQpRsCu1KlrT6XSoFaU+ah6hCHE5LpWn2MbT0HTuG2jv+m6r2ez1+3RfrfY9lAKbpakSXg729yFjt9MlAHhB37GHypkml1WC7KOvQ8dpddqD3iCMwtOgfCMd/g9QRGdK8r9Pi9tnNLm/meTuU4SkISVQfzxgKfCNnbEuIaW6afDmieEyzU6eKJGhm7xABzkViuaLdS/MR5mxwIML9xo/7EEsh8gpIwjxgDvDFIhTDFzgjoWh5xqmkaRxmqGPVNM0Y24iWVznrDoDB0wxoPK/NB6Zb7lcjsfxd8rJbccaLGUmZmTesUnSkw8YMS+WBGbEmo4H6bFH3Nniw0boP1o4/npJyI1bQHzfjIGGAjIfInQ/oScjUBWWU1IyIKAi8YcEKSIqnEZjGyPxoYJZ7hGuv3gUTeJEnpMoGX8riY8n4skqemRIqixAoAxQBtCHvvcv+qJRH7fzah8AAAAASUVORK5CYII=') !important;
2180 }
2181
2182 .pagelayer-elp-filter-contrast input{
2183 background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAFAAAAAKCAMAAAAU2ikOAAAAAXNSR0IB2cksfwAAAAlwSFlzAAALEwAACxMBAJqcGAAAAklQTFRFAAAAAgICAwMDBAQEBgYGCAgICwsLAQEBISEhJSUlKioqLy8vNDQ0WFhYXl5eZWVla2trcXFxmpqaoKCgpqamra2ts7OzJiYm1dXV2dnZ3t7e4uLi5ubm2tra+/v7/Pz8/f39/v7+////BQUFBwcHGhoaHh4eIyMjJycnLCwsTk5OVFRUWlpaYWFhaGhoj4+PlpaWnZ2do6Ojqqqqzc3N0tLS19fX3Nzc4ODg9/f3+vr6FBQUGBgYHBwcICAgRUVFS0tLUVFRV1dXhYWFjIyMkpKSmZmZn5+fxMTEysrKz8/P1NTU9PT09vb2+fn5Dw8PEhISFhYWPDw8QUFBSEhIe3t7goKCiIiIu7u7wcHBx8fHzMzM0dHR7+/v8vLy9fX1CgoKDQ0NEBAQFxcXOTk5Pj4+SkpKd3d3fn5+i4uLsrKyuLi4vr6+ycnJ6urq7e3t8PDw8/PzBQYHBQUGBAQFAwMEAgMDFRUVGRkZHR0dIiIiR0dHTU1NYGBglZWVm5uboqKixsbG1tbW29vbBgcIBAUGAwQFExMTGxsbHx8fREREUFBQVlZWhISEkZGRmJiYvb29w8PDzs7O09PT+Pj4AAABDAwMDg4OERERNTU1Ozs7RkZGTExMdHR0enp6gICAjo6OJCQktLS0urq6wMDAy8vL6+vr7u7uAQECLS0tMjIyODg4Q0NDaWlpcHBwdnZ2fX19q6ursbGxt7e35eXl6enpCQkJKysrMDAwX19fbGxsc3NzeXl5oaGhqKiorq6u39/f4+Pj5+fnrIREkAAAAeZJREFUeJxd0Pk/FHEcx/Hv7OLblrvD1S675cjKolJLOVJSIVKtctOKStaQIyKZEuWqJEI50h0lkXT5yzLvT4N2fpnnYx6Pz+vxmQ9jK4+gUjs4OgmMM2GDZuMmZ8jF1c3dQyXLc/OWrdu8ZHn7+Ppth7Q6/wA9yWAwQBxieLig2rGTywgMCg7ZBYUaw3aHQ6aIyKg9Gll790XvPwBpzTG6AJKcWRP7V+QqNRB78FCcBopPSDzsCiUdOZp8DB9Tjp846QNpU9PSY0j2Qa4sidepjMzAIOh01plQI3T2nMUUgeHs8xdycimTl19gXg0a1sQEzinKUS4sKo4tgZwvWuNLIY9LZUnlGLl85WpKBQ1fq7RV/b8hiYnVNddr+eolobr6hhshUGOTMewmZDE1t9zCXGtO7u02KhSY03V2VSaJ4p27TDkl/Xdxe8m9DsjaWXr/AVTWVd7dg5HevoqHjyhjq0p7bPffTJIksRrqZ8pBnww8rauHBoeyng1DI6PPLS/GZI1PTLa+hNqmXuWnkuTgmBKUROg1VxZ1XLlkO/Tm7Tvre+jDx+mZLuzw6fNsbx/t9WWu0kbSr99QkpCqFXg/BdUOX50G8M1rfmFwCPrmtvh9CSM/fv4an6DM7z/LUyR/vZ5u+BdDtnhZvafUoAAAAABJRU5ErkJggg==') !important;
2184 }
2185
2186 .pagelayer-elp-filter-brightness input{
2187 background-image: linear-gradient(90deg,#000,#fff);
2188 }
2189
2190 .pagelayer-elp-filter-grayscale input{
2191 background-image: linear-gradient(90deg, rgba(203,20,106,1) 0%, rgba(88,88,88,1) 56%);
2192 }
2193
2194 .pagelayer-elp-filter-hue input{
2195 background-image: linear-gradient(90deg,red,orange,#ff0,#adff2f,#32cd32,#00bfff,blue,#9400d3 95%);
2196 }
2197
2198 .pagelayer-elp-filter-saturate input{
2199 background-image: linear-gradient(90deg,gray,red);
2200 }
2201
2202 .pagelayer-elp-filter-opacity input{
2203 background-image: linear-gradient(90deg,#fff,#000);
2204 }
2205
2206 .pagelayer-elp-typo-fonts .pagelayer-elp-label,
2207 .pagelayer-elp-typo .pagelayer-elp-label{
2208 font-weight: 600;
2209 font-size: 11px;
2210 color: #555;
2211 }
2212
2213 .pagelayer-elp-global-typo{
2214 box-shadow: 0 2px 2px -1px #d2cfce;
2215 margin: -10px -10px 0 -10px;
2216 padding: 8px 10px;
2217 display: flex;
2218 }
2219
2220 [pagelayer-screen-mode="desktop"] [pagelayer-show-device]:not([pagelayer-show-device="desktop"]),
2221 [pagelayer-screen-mode="tablet"] [pagelayer-show-device]:not([pagelayer-show-device="tablet"]),
2222 [pagelayer-screen-mode="mobile"] [pagelayer-show-device]:not([pagelayer-show-device="mobile"]){
2223 display:none;
2224 }
2225
2226 .pagelayer-elp-global-typo .pagelayer-elp-typo-icons{
2227 text-align: right;
2228 width: 50%;
2229 }
2230
2231 .pagelayer-elp-global-typo .pagelayer-global-font-list{
2232 width: 100%;
2233 }
2234
2235 .pagelayer-elp-typo-icons .pagelayer-elp-global-icon{
2236 margin-right: 10px;
2237 cursor: pointer;
2238 }
2239
2240 .pagelayer-dark .pagelayer-elp-typo .pagelayer-elp-label{
2241 color:#bdbdbd;
2242 }
2243
2244 .pagelayer-elp-typo select.pagelayer-elp-typo-input,
2245 .pagelayer-elp-typo-input,
2246 .pagelayer-elp-shadow-input{
2247 padding: 3px;
2248 border-radius: 4px !important;
2249 line-height: 23px !important;
2250 }
2251
2252 .pagelayer-dark .pagelayer-elp-typo select.pagelayer-elp-typo-input{
2253 background-color: #252529;
2254 }
2255
2256 .pagelayer-elp-grad-color{
2257 position:relative;
2258 }
2259
2260 /* Left side menu Input related */
2261 .pagelayer-elp-text,
2262 .pagelayer-elp-spinner,
2263 .pagelayer-elp-tinymce-textarea,
2264 .pagelayer-elp-tinymce {
2265 border-radius: 2px !important;
2266 }
2267
2268 .pagelayer-post-type{
2269 text-transform: capitalize;
2270 }
2271
2272 .pagelayer-elp-text{
2273 padding-left:5px;
2274 }
2275
2276 .pagelayer-elp-select-div,
2277 .pagelayer-elp-spinner-div{
2278 width: 50%;
2279 right: 10px;
2280 position: absolute;
2281 top: 7px;
2282 }
2283
2284 .pagelayer-elp-spinner-div{
2285 width:85px;
2286 }
2287
2288 .pagelayer-elp-spinner{
2289 padding: 2px 0 2px 6px;
2290 border-radius: 4px !important;
2291 }
2292
2293 .pagelayer-elp-select {
2294 font-size: 16px;
2295 font-weight: 700;
2296 color: #444;
2297 line-height: 1.3;
2298 padding: 2px 2px 2px 6px;
2299 width: 100%;
2300 max-width: 100%;
2301 margin: 0;
2302 border: 1px solid #aaa;
2303 border-radius: 3px !important;
2304 box-shadow: 0 1px 0 1px rgba(0,0,0,.04);
2305 -moz-appearance: none;
2306 -webkit-appearance: none;
2307 appearance: none;
2308 background-image: linear-gradient(45deg, transparent 50%, #1A9CDB 50%), linear-gradient(135deg, #1A9CDB 50%, transparent 50%);
2309 background-position: right .9em top 50%, right .55em top 50%;
2310 background-size: 5px 5px, 5px 5px;
2311 background-repeat: no-repeat;
2312 }
2313 .pagelayer-elp-select::-ms-expand {
2314 display: none;
2315 }
2316 .pagelayer-elp-select:hover {
2317 border-color: #888;
2318 }
2319 .pagelayer-elp-select:focus {
2320 border-color: #aaa;
2321 box-shadow: 0 0 1px 3px rgba(59, 153, 252, .7);
2322 box-shadow: 0 0 0 3px -moz-mac-focusring;
2323 color: #222;
2324 outline: none;
2325 }
2326 .pagelayer-elp-select option{
2327 font-weight:normal;
2328 }
2329
2330 .pagelayer-dark .pagelayer-elp-select-div .pagelayer-elp-select,
2331 .pagelayer-dark .pagelayer-elp-typo-input .pagelayer-elp-select,
2332 .pagelayer-dark .pagelayer-parent-category .pagelayer-add-cat{
2333 background-color: #252529;
2334 color:#bdbdbd;
2335 }
2336
2337 .pagelayer-elpd-body input:focus,
2338 .pagelayer-elpd-body textarea:focus,
2339 .pagelayer-elpd-body select:focus {
2340 border-color: #3e8ef7;
2341 box-shadow: unset;
2342 }
2343
2344 .pagelayer-elp-group-item{
2345 border: 1px solid #777;
2346 font-size: 13px;
2347 margin-bottom: 10px;
2348 }
2349
2350 .pagelayer-elp-group-item .pagelayer-form-item{
2351 padding: 10px 0px 10px 0px;
2352 }
2353
2354 .pagelayer-elp-group-item .pagelayer-elp-select-div,
2355 .pagelayer-elp-group-item .pagelayer-elp-spinner-div,
2356 .pagelayer-elp-group-item .pagelayer-elp-color-div{
2357 right:0px;
2358 }
2359
2360 .pagelayer-elp-group-item-head{
2361 display:flex;
2362 background: #F8F8F8;
2363 }
2364
2365 .pagelayer-dark .pagelayer-elp-group-item-head{
2366 background:#252529;
2367 }
2368
2369 .pagelayer-elp-group-item-head span{
2370 cursor: pointer;
2371 padding: 9px;
2372 display:inline-block;
2373 }
2374
2375 .pagelayer-dark .pagelayer-elp-group-item-head span{
2376 color:#bdbdbd;
2377 }
2378
2379 .pagelayer-elp-group-item-head .pagelayer-elp-group-item-drag:hover {
2380 cursor:all-scroll;
2381 }
2382
2383 .pagelayer-elp-group-item-title{
2384 flex-grow: 100;
2385 white-space: nowrap;
2386 overflow: hidden;
2387 text-overflow: ellipsis;
2388 }
2389
2390 .pagelayer-elp-group-item-del{
2391 float: right;
2392 }
2393
2394 .pagelayer-elp-group-item-body{
2395 display: none;
2396 padding: 7px 10px;
2397 }
2398
2399 .pagelayer-elp-group-item-clone{
2400 padding-right:0px !important;
2401 }
2402
2403 .pagelayer-elp-padding{
2404 width:21% !important;
2405 }
2406
2407 .pagelayer-elp-dimension{
2408 width:42% !important;
2409 }
2410
2411 /* END Element Properties Dialog classes */
2412
2413 /* Widget Parameters */
2414
2415 .pagelayer-widgets-form input,
2416 .pagelayer-widgets-form select,
2417 .pagelayer-widgets-form textarea {
2418 border: 1px solid #ddd;
2419 box-shadow: inset 0 1px 2px rgba(0,0,0,.07);
2420 background-color: #fff;
2421 color: #32373c;
2422 outline: 0;
2423 transition: 50ms border-color ease-in-out;
2424 font-size: 15px !important;
2425 line-height: 150% !important;
2426 }
2427
2428 .pagelayer-widgets-form select{
2429 padding:5px;
2430 }
2431
2432 .pagelayer-widgets-form input[type="checkbox"]{
2433 width: auto;
2434 }
2435
2436 .pagelayer-widgets-form{
2437 line-height:150%;
2438 border-top: none;
2439 padding: 8px;
2440 }
2441
2442 .pagelayer-dark .pagelayer-widgets-form label{
2443 color:#bdbdbd;
2444 }
2445
2446 .pagelayer-dark .pagelayer-widgets-form input,
2447 .pagelayer-dark .pagelayer-widgets-form select,
2448 .pagelayer-dark .pagelayer-widgets-form textarea {
2449 color:#bdbdbd;
2450 background-color:#1c1c1f;
2451 border:1px solid #6e6d6d;
2452 }
2453
2454 /* End Widget Parameters */
2455
2456 .trumbowyg-box{
2457 margin-top:0px !important;
2458 }
2459
2460 .trumbowyg-editor{
2461 min-height: 250px !important;
2462 padding: 10px !important;
2463 }
2464
2465 /* Pagelayer Left bar */
2466
2467 .pagelayer-topbar-holder{
2468 background-color: #4CB5E8;
2469 position:relative;
2470 animation: colorchange 30s infinite alternate;
2471 -webkit-animation: colorchange 30s infinite alternate;
2472 }
2473
2474 @keyframes colorchange{
2475 0% {background: #3e0772;}
2476 25% {background: #209ce2;}
2477 50% {background: #00838c;}
2478 75% {background: #088dce;}
2479 100% {background: #3d5afe;}
2480 }
2481
2482 .pagelayer-topbar-mover{
2483 cursor: all-scroll;
2484 }
2485
2486 .pagelayer-logo{
2487 font-size:18px;
2488 font-weight: bold;
2489 display: block;
2490 text-align:center;
2491 vertical-align:middle;
2492 color:#fff;
2493 width:76%;
2494 }
2495
2496 .pagelayer-logo-text{
2497 font-weight: bold;
2498 margin-left: 5px;
2499 line-height: normal;
2500 vertical-align: super;
2501 }
2502
2503 .pagelayer-settings-icon{
2504 padding-right:10px;
2505 cursor: pointer;
2506 position: absolute;
2507 right: 5px;
2508 top: 50%;
2509 transform: translateY(-50%);
2510 }
2511
2512 .pagelayer-options-icon{
2513 padding-left:10px;
2514 cursor: pointer;
2515 position: absolute;
2516 left: 5px;
2517 top: 50%;
2518 transform: translateY(-50%);
2519 font-size: 18px !important;
2520 color: #ffffff;
2521 }
2522
2523 .pagelayer-leftbar{
2524 width:270px !important;
2525 padding-top:0;
2526 background-color: #E3E3E3;
2527 overflow: hidden;
2528 background: -moz-linear-gradient(224deg, rgba(222,222,222,1) 0%, rgba(191,202,214,1) 100%); /* ff3.6+ */
2529 background: -webkit-gradient(linear, left bottom, right top, color-stop(0%, rgba(191,202,214,1)), color-stop(100%, rgba(222,222,222,1))); /* safari4+,chrome */
2530 background: -webkit-linear-gradient(224deg, rgba(222,222,222,1) 0%, rgba(191,202,214,1) 100%); /* safari5.1+,chrome10+ */
2531 background: -o-linear-gradient(224deg, rgba(222,222,222,1) 0%, rgba(191,202,214,1) 100%); /* opera 11.10+ */
2532 background: -ms-linear-gradient(224deg, rgba(222,222,222,1) 0%, rgba(191,202,214,1) 100%); /* ie10+ */
2533 background: linear-gradient(226deg, rgba(222,222,222,1) 0%, rgba(191,202,214,1) 100%); /* w3c */
2534 filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#BFCAD6', endColorstr='#DEDEDE',GradientType=1 ); /* ie6-9 */
2535 }
2536
2537 .pagelayer-dark .pagelayer-leftbar{
2538 background: unset !important;
2539 background-color: #1c1c1f !important;
2540 }
2541
2542 .pagelayer-leftbar-search{
2543 text-align:center;
2544 margin: 20px 40px 10px 25px;
2545 position:relative;
2546 }
2547
2548 .pagelayer-search-field{
2549 width:100%;
2550 line-height:120%;
2551 padding: 5px 20px 5px 30px;
2552 border-radius: 5px;
2553 border: none;
2554 font-size: 14px;
2555 height:30px;
2556 }
2557
2558 .pagelayer-widget-search .pli,
2559 .pagelayer-leftbar-search .pli{
2560 position: absolute;
2561 top: 0;
2562 height: 30px;
2563 padding: 0 7px;
2564 color: #666;
2565 line-height: 30px;
2566 }
2567
2568 .pagelayer-widget-search .pagelayer-sf-empty,
2569 .pagelayer-leftbar-search .pagelayer-sf-empty{
2570 right:0;
2571 left:auto;
2572 font-weight:bolder;
2573 cursor:pointer;
2574 }
2575
2576 .pagelayer-shortcodes{
2577 margin-left:17px;
2578 }
2579
2580 .pagelayer-widget-group,
2581 .pagelayer-leftbar-group{
2582 width: 100%;
2583 background-repeat: no-repeat;
2584 background-position: center;
2585 font-size: 11px !important;
2586 color: #442E2E;
2587 clear: both;
2588 text-align: center;
2589 font-family: Roboto, 'Open Sans', Arial, sans-serif !important;
2590 margin-bottom: 2px;
2591 }
2592
2593 .pagelayer-widget-group h5,
2594 .pagelayer-leftbar-group h5{
2595 font-size: 11px;
2596 line-height: 20px;
2597 text-transform: uppercase;
2598 color: #777;
2599 padding: 5px 0 3px;
2600 margin: 5px;
2601 }
2602
2603 .pagelayer-widget-group h5:only-child,
2604 .pagelayer-leftbar-group h5:only-child{
2605 display: none;
2606 }
2607
2608 .pagelayer-global-widget-pro{
2609 text-align: center;
2610 margin-right: 10px;
2611 padding-top: 20px;
2612 font-size: 14px;
2613 }
2614
2615 .pagelayer-shortcode-holder,
2616 .pagelayer-shortcode-drag{
2617 width: 100px !important;
2618 height:67px !important;
2619 margin-bottom:12px;
2620 margin-left:12px;
2621 background-color: #FFFFFF;
2622 border-radius: 4px;
2623 float: left;
2624 transition: all 0.1s;
2625 }
2626
2627 .pagelayer-dark .pagelayer-shortcode-drag,
2628 .pagelayer-dark .pagelayer-shortcode-drag:hover{
2629 background-color:#252529;
2630 box-shadow:0 0.5rem 1rem #00000026;
2631 }
2632
2633 .pagelayer-shortcode-holder:hover,
2634 .pagelayer-shortcode-drag:hover{
2635 transform: scale(1.06);
2636 }
2637
2638 .pagelayer-sc{
2639 padding: 4px !important;
2640 margin: 4px auto 0 auto !important;
2641 cursor: move;
2642 }
2643
2644 .pagelayer-shortcode-inner{
2645 height: 25px;
2646 padding: 0px !important;
2647 }
2648
2649 .pagelayer-shortcode-text{
2650 display: -webkit-box;
2651 -webkit-box-orient: vertical;
2652 -webkit-line-clamp: 3;
2653 font-family: Roboto, 'Open Sans', Arial, Helvetica, sans-serif;
2654 font-size: 11px !important;
2655 font-style: normal;
2656 line-height: 125%;
2657 margin: 0;
2658 overflow: hidden;
2659 cursor: move;
2660 text-overflow: ellipsis;
2661 text-align: center;
2662 width: 100%;
2663 margin-top: 3px;
2664 color: #777;
2665 transition: all 0.3s;
2666 padding:1px;
2667 }
2668
2669 .pagelayer-leftbar-search-empty{
2670 display: none;
2671 padding: 40px;
2672 text-align: center;
2673 color: #777;
2674 font-family: 'Roboto';
2675 }
2676
2677 .pagelayer-leftbar-search-empty p{
2678 margin: 8px;
2679 }
2680
2681 .pagelayer-leftbar-search-empty .fa-sad-tear{
2682 font-size: 24px;
2683 }
2684
2685 .pagelayer-dark .pagelayer-shortcode-text{
2686 color: #bdbdbd;
2687 }
2688
2689 .pagelayer-shortcode-drag:hover .pagelayer-shortcode:before,
2690 .pagelayer-shortcode-drag:hover .pagelayer-shortcode-text{
2691 color: #00A0D2;
2692 }
2693
2694 .pagelayer-dark .pagelayer-shortcode-drag:hover .pagelayer-shortcode:before,
2695 .pagelayer-dark .pagelayer-shortcode-drag:hover .pagelayer-shortcode-text{
2696 color: #3d5afe;
2697 }
2698
2699 /* Trumbowyg color widget style */
2700 .trumbowyg-dropdown-foreColor,
2701 .trumbowyg-dropdown-backColor {
2702 width: 100% !important;
2703 max-width: 250px !important;
2704 padding: 7px 5px;
2705 left:0 !important;
2706 }
2707
2708 .trumbowyg-dropdown-foreColor svg,
2709 .trumbowyg-dropdown-backColor svg {
2710 display: none !important;
2711 }
2712
2713 .trumbowyg-dropdown-foreColor button[type="button"],
2714 .trumbowyg-dropdown-backColor button[type="button"] {
2715 display: block;
2716 position: relative;
2717 float: left;
2718 text-indent: -9999px;
2719 height: 20px;
2720 width: 20px;
2721 max-height:27px;
2722 max-width:27px;
2723 border: 1px solid #333;
2724 padding: 0;
2725 margin: 2px;
2726 }
2727
2728 .trumbowyg-dropdown-foreColor button[type="button"]:hover::after,
2729 .trumbowyg-dropdown-backColor button[type="button"]:hover::after,
2730 .trumbowyg-dropdown-foreColor button[type="button"]:focus::after,
2731 .trumbowyg-dropdown-backColor button[type="button"]:focus::after{
2732 content: " ";
2733 display: block;
2734 position: absolute;
2735 top: -5px;
2736 left: -5px;
2737 height: 27px;
2738 width: 27px;
2739 max-width:27px;
2740 background: inherit;
2741 border: 1px solid #FFF;
2742 box-shadow: #000 0 0 2px;
2743 z-index: 10;
2744 }
2745
2746 .trumbowyg-dropdown-fontsize,
2747 .trumbowyg-dropdown-lineheight,
2748 .trumbowyg-dropdown-fontfamily{
2749 height: 200px;
2750 overflow: auto;
2751 }
2752
2753 /* Trumbowyg color widget style end */
2754
2755 /* Pagelayer history style*/
2756
2757 .pagelayer-revision-holder,
2758 .pagelayer-history-holder{
2759 border: 1px solid #b7b5b5fa;
2760 margin-bottom: 10px;
2761 padding: 10px;
2762 display: -webkit-box;
2763 display: -webkit-flex;
2764 display: -ms-flexbox;
2765 display: flex;
2766 -webkit-box-align: center;
2767 -webkit-align-items: center;
2768 -ms-flex-align: center;
2769 align-items: center;
2770 font-size: 12px;
2771 color:#505050;
2772 }
2773
2774 .pagelayer-leftbar-tab,
2775 .pagelayer-history,
2776 .pagelayer-history-hidden{
2777 display:none;
2778 }
2779
2780 .pagelayer-revision-holder:hover,
2781 .pagelayer-history-holder:hover,
2782 .pagelayer-history-holder.current_active_item{
2783 background-color:#efefef;
2784 }
2785
2786 .pagelayer-revision-img-holder{
2787 border-radius: 50%;
2788 overflow: hidden;
2789 margin-right:10px;
2790 }
2791
2792 .pagelayer-revision-detail-holder,
2793 .pagelayer-history-detail-holder{
2794 flex:1;
2795 }
2796
2797 .pagelayer-revision-holder .pagelayer-revision-delete,
2798 .pagelayer-history-holder .pagelayer-history-check{
2799 display:none;
2800 }
2801
2802 .pagelayer-revision-holder:hover .pagelayer-revision-delete,
2803 .pagelayer-history-holder.current_active_item .pagelayer-history-check{
2804 display:block;
2805 }
2806
2807 .pagelayer-revision-delete:hover{
2808 cursor:pointer;
2809 }
2810
2811 .pagelayer-revision-img-holder img{
2812 max-width: 100%;
2813 width: 20px;
2814 height: 20px;
2815 }
2816
2817 .pagelayer-history-holder span{
2818 margin-right:5px;
2819 }
2820
2821 /* Pagelayer history end*/
2822
2823 /* Pagelayer General options*/
2824 .pagelayer-general-options{
2825 color: #777;
2826 background-color: #FFFFFF;
2827 font-size: 14px;
2828 }
2829
2830 .pagelayer-general-options .pagelayer-option-holder{
2831 padding: 10px;
2832 border-radius: 4px;
2833 transition: all 0.1s;
2834 margin-bottom:4px;
2835 cursor: pointer;
2836 }
2837
2838 .pagelayer-general-options .pagelayer-option-holder i{
2839 margin: 0 10px;
2840 }
2841
2842 .pagelayer-general-options .pagelayer-option-holder:hover{
2843 color:#1a7fb0;
2844 background: #ebebeb;
2845 }
2846
2847 .pagelayer-general-options .pagelayer-option-holder:active{
2848 transform: scale(0.97);
2849 cursor: progress;
2850 }
2851
2852 .pagelayer-general-options .pagelayer-options-sections{
2853 padding: 10px;
2854 }
2855
2856 .pagelayer-general-options .pagelayer-options-sections:not(:last-child){
2857 border-bottom: 1px solid #ebebeb;
2858 }
2859
2860 .pagelayer-general-options h5{
2861 font-size: 11px;
2862 text-transform: uppercase;
2863 color: #777;
2864 margin: 15px 5px;
2865 }
2866
2867 /* Pagelayer General options end*/
2868
2869 /* Pagelayer settings*/
2870
2871 .pagelayer-post-settings-holder{
2872 border:1px solid #d3d3d3;
2873 font-size: 14px;
2874 line-height: 150%;
2875 }
2876
2877 .pagelayer-post-settings-acc{
2878 background-color:#fff;
2879 }
2880
2881 .pagelayer-post-settings-apply{
2882 font-size: 14px;
2883 font-weight: bold;
2884 cursor: pointer;
2885 border-radius: 2px;
2886 padding: 4px 8px;
2887 margin: auto 5px;
2888 }
2889
2890 .pagelayer-post-settings-apply[disabled]{
2891 opacity:0.5;
2892 }
2893
2894 .pagelayer-post-settings-acc{
2895 margin-top:7px;
2896 }
2897
2898 .pagelayer-post-settings-fields{
2899 padding:10px;
2900 display:none;
2901 }
2902
2903 .pagelayer-post-settings-lable{
2904 border:1px solid #d3d3d3;
2905 padding:10px;
2906 cursor:pointer;
2907 }
2908
2909 .pagelayer-toggle{
2910 float:right;
2911 }
2912
2913 .pagelayer-toggle:not(.pagelayer-open):before{
2914 content: "\f0da";
2915 }
2916
2917 .pagelayer-toggle.pagelayer-open:before{
2918 content: "\f0d7";
2919 }
2920
2921 .pagelayer-post-settings-fields label{
2922 display:block;
2923 margin:7px 0;
2924 }
2925
2926 /* Pagelayer settings end*/
2927
2928 /*Tooltip TLITE CSS : https://github.com/chrisdavies/tlite */
2929 .pagelayer-tlite {
2930 background: #111;
2931 color: white;
2932 font-family: sans-serif;
2933 font-size: 0.8rem;
2934 font-weight: normal;
2935 text-decoration: none;
2936 text-align: left;
2937 padding: 0.6em 0.75rem;
2938 border-radius: 4px;
2939 position: absolute;
2940 opacity: 0;
2941 visibility: hidden;
2942 transition: opacity 0.4s;
2943 white-space: nowrap;
2944 box-shadow: 0 0.5rem 1rem -0.5rem black;
2945 z-index: 1000;
2946 -webkit-backface-visibility: hidden;
2947 }
2948
2949 .pagelayer-tlite-table td,
2950 .pagelayer-tlite-table th {
2951 position: relative;
2952 }
2953
2954 .pagelayer-tlite-visible {
2955 visibility: visible;
2956 opacity: 0.9;
2957 }
2958
2959 .pagelayer-tlite::before {
2960 content: ' ';
2961 display: block;
2962 background: inherit;
2963 width: 10px;
2964 height: 10px;
2965 position: absolute;
2966 transform: rotate(45deg);
2967 }
2968
2969 .pagelayer-tlite-n::before {
2970 top: -3px;
2971 left: 50%;
2972 margin-left: -5px;
2973 }
2974
2975 .pagelayer-tlite-nw::before {
2976 top: -3px;
2977 left: 10px;
2978 }
2979
2980 .pagelayer-tlite-ne::before {
2981 top: -3px;
2982 right: 10px;
2983 }
2984
2985 .pagelayer-tlite-s::before {
2986 bottom: -3px;
2987 left: 50%;
2988 margin-left: -5px;
2989 }
2990
2991 .pagelayer-tlite-se::before {
2992 bottom: -3px;
2993 right: 10px;
2994 }
2995
2996 .pagelayer-tlite-sw::before {
2997 bottom: -3px;
2998 left: 10px;
2999 }
3000
3001 .pagelayer-tlite-w::before {
3002 left: -3px;
3003 top: 50%;
3004 margin-top: -5px;
3005 }
3006
3007 .pagelayer-tlite-e::before {
3008 right: -3px;
3009 top: 50%;
3010 margin-top: -5px;
3011 }
3012 /*Tooltip end*/
3013
3014 /* Add section modal*/
3015 .pagelayer-add-section-modal-container{
3016 position: fixed;
3017 top: 0;
3018 left: 0;
3019 width: 100%;
3020 height: 100%;
3021 background-color: #00000069;
3022 z-index:9999;
3023 display:none;
3024 font-family: Roboto, 'Open Sans', Arial, Helvetica, sans-serif;
3025 }
3026
3027 .pagelayer-add-section-modal-close{
3028 font-size: 30px;
3029 float: right;
3030 cursor:pointer;
3031 line-height: 100%;
3032 }
3033
3034 .pagelayer-add-section-modal-holder{
3035 position: relative;
3036 font-size: 18px;
3037 height: 100vh;
3038 }
3039
3040 .pagelayer-add-section-modal{
3041 background-color: #ffffff;
3042 width: 100%;
3043 margin: auto;
3044 position: relative;
3045 }
3046
3047 /* Add modal for editor*/
3048 .pagelayer-editor-modal{
3049 position:fixed;
3050 display:none;
3051 justify-content:center;
3052 align-items:center;
3053 top:0;
3054 left:0;
3055 width:100%;
3056 height:100%;
3057 z-index:9999;
3058 background-color:rgba(0, 0, 0, 0.3);
3059 }
3060
3061 .pagelayer-editor-modal *{
3062 box-sizing:border-box;
3063 padding:0;
3064 margin:0;
3065 }
3066
3067 .pagelayer-editor-modal-wrap{
3068 background-color: #FFF;
3069 border-radius:2px;
3070 width: 40%;
3071 box-shadow: 0 10px 10px rgb(0 0 0 / 25%);
3072 }
3073
3074 .pagelayer-editor-modal-header{
3075 display:flex;
3076 justify-content:space-between;
3077 align-items: center;
3078 padding: 20px 30px;
3079 border-bottom: 1px solid #ccc;
3080 }
3081
3082 .pagelayer-editor-modal-header i{
3083 font-size: 1.3em;
3084 cursor:pointer;
3085 }
3086
3087 .pagelayer-editor-modal-header i:hover{
3088 color: #3e8ef7;
3089 }
3090
3091 .pagelayer-editor-modal-body{
3092 padding: 0 25px;
3093 }
3094
3095 .pagelayer-edt-modal-block{
3096 margin: 10px;
3097 }
3098
3099 .pagelayer-edt-modal-block ul{
3100 padding:0;
3101 margin-bottom:10px;
3102 }
3103
3104 .pagelayer-edt-modal-block li{
3105 list-style-type:none;
3106 display:flex;
3107 flex-direction:row;
3108 justify-content:space-between;
3109 font-size:1.1em;
3110 padding: 10px 0;
3111 border-bottom: 1px solid #ccc;
3112 color: #282828;
3113 }
3114
3115 .pagelayer-keyboard-shortcut-keys{
3116 font-weight: bold;
3117 }
3118
3119 .pagelayer-keyboard-shortcut-keys > span{
3120 margin: 0 4px;
3121 background-color: #e8e8e8;
3122 padding: 5px 7px;
3123 border-radius: 3px;
3124 }
3125
3126 /* width */
3127 .pagelayer-add-section-modal::-webkit-scrollbar {
3128 width: 7px;
3129 }
3130
3131 /* Track */
3132 .pagelayer-add-section-modal::-webkit-scrollbar-track {
3133 background: #f1f1f1;
3134 border-radius:5px;
3135 }
3136
3137 /* Handle */
3138 .pagelayer-add-section-modal::-webkit-scrollbar-thumb {
3139 background: #c1c1c1;
3140 border-radius:5px;
3141 }
3142
3143 /* Handle on hover */
3144 .pagelayer-add-section-modal::-webkit-scrollbar-thumb:hover {
3145 background: #555;
3146 }
3147
3148 .pagelayer-add-section-modal-header{
3149 padding: 15px;
3150 position: sticky;
3151 background: #5e5e5e;
3152 top: 0;
3153 z-index: 999;
3154 color: #fff;
3155 }
3156
3157 .pagelayer-add-section-modal-header>div{
3158 display: inline-block;
3159 }
3160
3161 .pagelayer-section-type-div{
3162 width: 85%;
3163 text-align: center;
3164 }
3165
3166 .pagelayer-add-section-modal-row{
3167 display: flex;
3168 flex-direction: row;
3169 }
3170
3171 .pagelayer-add-section-modal-left{
3172 min-width: 250px;
3173 width: 250px;
3174 background-color: #ccc;
3175 }
3176
3177 .pagelayer-section-search-div{
3178 text-align:center;
3179 margin: 20px;
3180 position:relative;
3181 }
3182
3183 .pagelayer-section-search{
3184 width:100%;
3185 line-height:120%;
3186 padding: 5px 20px 5px 30px;
3187 border-radius: 5px;
3188 border: none;
3189 font-size: 14px;
3190 height:30px;
3191 }
3192
3193 .pagelayer-section-search-div .pli{
3194 position: absolute;
3195 top: 0;
3196 height: 30px;
3197 padding: 0 7px;
3198 color: #666;
3199 line-height: 30px;
3200 }
3201
3202 .pagelayer-section-search-div .pagelayer-sf-empty{
3203 right:0;
3204 left:auto;
3205 font-weight:bolder;
3206 cursor:pointer;
3207 }
3208
3209 .pagelayer-section-tags-holder{
3210 padding: 0px 10px;
3211 height: calc(100vh - 150px);
3212 overflow: auto;
3213 }
3214
3215 .pagelayer-section-tags{
3216 background: #1A9CDB;
3217 cursor: pointer;
3218 padding: 5px;
3219 color: #fff;
3220 font-size: 13px;
3221 display: inline-block;
3222 margin: 3px;
3223 }
3224
3225 .pagelayer-section-tags[on="1"]{
3226 background: #326fa6;
3227 }
3228
3229 .pagelayer-section-modal-body-holder{
3230 overflow:auto;
3231 height: calc(100vh - 50px);
3232 width: calc(100vw - 250px);
3233 background: #efefef;
3234 }
3235
3236 .pagelayer-add-section-modal-body{
3237 margin: 0;
3238 background: #efefef;
3239 height: 100%;
3240 display: flex;
3241 flex-wrap: wrap;
3242 }
3243
3244 .pagelayer-add-section-modal-footer{
3245 padding: 15px;
3246 border-top: 1px solid #e5e5e5;
3247 }
3248
3249 .pagelayer-section-is-visible{
3250 height: 50px;
3251 flex-basis: 100%;
3252 }
3253
3254 .pagelayer-section-holder{
3255 vertical-align: top;
3256 background: #efefef;
3257 flex: 1;
3258 }
3259
3260 .pagelayer-section-item{
3261 min-height: 50px;
3262 margin:15px;
3263 z-index: 9;
3264 transition-duration: 0.2s;
3265 background-color:#fff;
3266 border: 3px solid #fff;
3267 border-radius: 4px;
3268 cursor: pointer;
3269 position: relative;
3270 }
3271
3272 .pagelayer-section-item:hover{
3273 z-index: 99;
3274 transform: scale(1.01);
3275 border: 3px solid #1A9CDB;
3276 }
3277
3278 .pagelayer-section-item img{
3279 width:100%;
3280 }
3281
3282 .pagelayer-section-item[pagelayer-section-type=page]{
3283 max-height: 350px;
3284 overflow: auto;
3285 }
3286
3287 .pagelayer-section-pro-req{
3288 position: absolute;
3289 top: 15px;
3290 right: 0px;
3291 font-size: 14px;
3292 padding: 10px;
3293 background-color: #e63131;
3294 color: #fff;
3295 margin-left: 4px;
3296 border-radius: 2px;
3297 cursor: pointer;
3298 }
3299
3300 .pagelayer-section-pro-txt{
3301 position: absolute;
3302 top: 45%;
3303 left: 0px;
3304 font-size: 14px;
3305 padding: 10px;
3306 color: #fff;
3307 line-height: 120%;
3308 background: #111;
3309 opacity: 0;
3310 transition: all 0.3s;
3311 }
3312
3313 .pagelayer-section-item:hover > .pagelayer-section-pro-txt{
3314 opacity: 0.8;
3315 }
3316
3317 .pagelayer-section-pro-txt a{
3318 color: #1A9CDB;
3319 }
3320
3321 .pagelayer-add-section-modal-overlay{
3322 position: absolute;
3323 top:0;
3324 bottom:0;
3325 height:100%;
3326 width:100%;
3327 z-index:999999;
3328 align-items: center;
3329 justify-content: center;
3330 text-align:center;
3331 display:flex;
3332 background-color:#f7f7f7fa;
3333 }
3334
3335 .pagelayer-section-wait .fa-spin{
3336 font-size:50px;
3337 }
3338
3339 /* Add section modal end */
3340
3341 /* Navigator start */
3342 .pagelayer-leftbar-prop-body{
3343 margin:10px 0px;
3344 background-color:#ffffff;
3345 border: 1px solid #d3d3d3;
3346 font-size:12px;
3347 }
3348
3349 .pagelayer-ele-name{
3350 padding: 10px;
3351 border-bottom:1px solid #d3d3d3;
3352 color: #000000;
3353 }
3354
3355 .pagelayer-ele-name:hover{
3356 background-color:#f5f5f5;
3357 cursor:pointer;
3358 }
3359
3360 .pagelayer-navigetor-ele > .pagelayer-navigetor-ele{
3361 display:none;
3362 }
3363
3364 .pagelayer-navigator-open > .pagelayer-navigetor-ele{
3365 display:block;
3366 }
3367
3368 .pagelayer-ele-name .fa:before{
3369 margin-right:8px;
3370 font-family:pagelayer,fontawesome;
3371 font-size:14px !important;
3372 }
3373
3374 .pagelayer-navi-active{
3375 background-color: #d5e4f7
3376 }
3377
3378 .pagelayer-navigator-options{
3379 float: right;
3380 }
3381
3382 .pagelayer-navigator-options .pli{
3383 padding: 0 4px;
3384 }
3385 /* Navigator end */
3386
3387 /* Left bar move start */
3388 .pagelayer-leftbar-moving{
3389 position:absolute;
3390 height:80vh;
3391 z-index:999;
3392 box-shadow:0 0 5px #e1e1e1;
3393 }
3394
3395 .pagelayer-overflow-hidden{
3396 overflow:hidden !important;
3397 }
3398
3399 .pagelayer-leftbar-move{
3400 width:30px;
3401 height:100%;
3402 background-color:#00BCD4;
3403 position:absolute;
3404 opacity: 0.33;
3405 }
3406
3407 .pagelayer-moveto-left{
3408 left:0;
3409 right:auto;
3410 }
3411
3412 .pagelayer-moveto-right{
3413 right:0;
3414 left:auto;
3415 }
3416
3417 .pagelayer-close-bar{
3418 background-color: #000;
3419 color: #ffffff;
3420 height:15px;
3421 }
3422
3423 .pagelayer-leftbar-table:not(.pagelayer-leftbar-moving) .pagelayer-close-bar{
3424 display:none;
3425 }
3426
3427 .pagelayer-leftbar-minimize{
3428 height:auto;
3429 }
3430
3431 .pagelayer-close-bar-icons{
3432 float:right;
3433 }
3434
3435 .pagelayer-close-bar-icons i{
3436 padding:5px 10px;
3437 font-size: 10px;
3438 }
3439
3440 .pagelayer-close-bar-icons i:hover{
3441 background-color: #E3E3E3;
3442 color: #000;
3443 }
3444
3445 .pagelayer-leftbar-moving.pagelayer-leftbar-minimize .pagelayer-leftbar-holder,
3446 .pagelayer-leftbar-moving.pagelayer-leftbar-minimize .pagelayer-bottombar-row{
3447 display:none;
3448 }
3449
3450 /* Left bar move end*/
3451
3452 /* Pre-Loading animaiton classes */
3453 #pagelayer-loader-wrapper {
3454 background-color:white;
3455 -webkit-box-align: center;
3456 -ms-flex-align: center;
3457 align-items: center;
3458 display: -webkit-box;
3459 display: -ms-flexbox;
3460 display: flex;
3461 height: 100%;
3462 -webkit-box-pack: center;
3463 -ms-flex-pack: center;
3464 justify-content: center;
3465 position: fixed;
3466 left: 0;
3467 top: 0;
3468 width: 100%;
3469 z-index: 9000;
3470 }
3471
3472
3473 #pagelayer-loader-wrapper .pagelayer-animation-section {
3474 position: absolute;
3475 z-index: 1000;
3476 }
3477
3478 .pagelayer-loader {
3479 position:relative;
3480 width: 150px;
3481 height: 150px;
3482 margin: 0 auto 50px auto;
3483 z-index: 1001;
3484 }
3485
3486 .pagelayer-loader:before {
3487 content: "";
3488 position: absolute;
3489 top: 0;
3490 left: 0;
3491 right: 0;
3492 bottom: 0;
3493 border-radius: 50%;
3494 border: 3px solid transparent;
3495 border-top-color: #3498db;
3496 -webkit-animation: spin 3s linear infinite;
3497 animation: spin 3s linear infinite;
3498 }
3499
3500 .pagelayer-loader:after {
3501 content: "";
3502 position: absolute;
3503 top: 10px;
3504 left: 10px;
3505 right: 10px;
3506 bottom: 10px;
3507 border-radius: 50%;
3508 border: 3px solid transparent;
3509 border-top-color: #e74c3c;
3510 -webkit-animation: spin 2s linear infinite;
3511 animation: spin 2s linear infinite;
3512 }
3513
3514 .pagelayer-loader .pagelayer-percent-parent{
3515 width:100%;
3516 height:100%;
3517 margin:auto;
3518 display: flex;
3519 align-items: center;
3520 justify-content: center;
3521 text-align:center;
3522 }
3523
3524 .pagelayer-loader .pagelayer-percent-parent:before{
3525 content: "";
3526 position: absolute;
3527 top: 20px;
3528 left: 20px;
3529 right: 20px;
3530 bottom: 20px;
3531 border-radius: 50%;
3532 border: 3px solid transparent;
3533 border-top-color: #f9c922;
3534 -webkit-animation: spin 1.5s linear infinite;
3535 animation: spin 1.5s linear infinite;
3536 }
3537
3538 .pagelayer-loader .pagelayer-percent-parent .pagelayer-percent{
3539 font-size:30px;
3540 }
3541
3542 @-webkit-keyframes spin {
3543 0%{
3544 -webkit-transform: rotate(0deg);
3545 -ms-transform: rotate(0deg);
3546 transform: rotate(0deg);
3547 }
3548 100%{
3549 -webkit-transform: rotate(360deg);
3550 -ms-transform: rotate(360deg);
3551 transform: rotate(360deg);
3552 }
3553 }
3554
3555 @keyframes spin {
3556 0% {
3557 -webkit-transform: rotate(0deg);
3558 -ms-transform: rotate(0deg);
3559 transform: rotate(0deg);
3560 }
3561 100% {
3562 -webkit-transform: rotate(360deg);
3563 -ms-transform: rotate(360deg);
3564 transform: rotate(360deg);
3565 }
3566 }
3567
3568 #pagelayer-loader-wrapper .pagelayer-animation-section .pagelayer-txt-loading {
3569 font: bold 7em Poppins,sans-serif;
3570 text-align: center;
3571 -webkit-user-select: none;
3572 -moz-user-select: none;
3573 -ms-user-select: none;
3574 user-select: none;
3575 }
3576
3577 .pagelayer-txt-loading .letters-loading {
3578 color: rgba(0,0,0,0.2);
3579 position: relative;
3580 }
3581
3582 .pagelayer-txt-loading .letters-loading:before {
3583 -webkit-animation: letters-loading 4s infinite;
3584 animation: letters-loading 4s infinite;
3585 color: #000;
3586 content: attr(data-text-preloader);
3587 left: 0;
3588 opacity: 0;
3589 font-family: "Poppins",sans-serif;
3590 position: absolute;
3591 -webkit-transform: rotateY(-90deg);
3592 transform: rotateY(-90deg);
3593 }
3594
3595 .pagelayer-txt-loading .letters-loading:nth-child(2):before {
3596 -webkit-animation-delay: .2s;
3597 animation-delay: .2s
3598 }
3599 .pagelayer-txt-loading .letters-loading:nth-child(3):before {
3600 -webkit-animation-delay: .4s;
3601 animation-delay: .4s
3602 }
3603 .pagelayer-txt-loading .letters-loading:nth-child(4):before {
3604 -webkit-animation-delay: .6s;
3605 animation-delay: .6s
3606 }
3607 .pagelayer-txt-loading .letters-loading:nth-child(5):before {
3608 -webkit-animation-delay: .8s;
3609 animation-delay: .8s
3610 }
3611 .pagelayer-txt-loading .letters-loading:nth-child(6):before {
3612 -webkit-animation-delay: 1s;
3613 animation-delay: 1s
3614 }
3615 .pagelayer-txt-loading .letters-loading:nth-child(7):before {
3616 -webkit-animation-delay: 1.2s;
3617 animation-delay: 1.2s
3618 }
3619 .pagelayer-txt-loading .letters-loading:nth-child(8):before {
3620 -webkit-animation-delay: 1.4s;
3621 animation-delay: 1.4s
3622 }
3623 .pagelayer-txt-loading .letters-loading:nth-child(9):before {
3624 -webkit-animation-delay: 1.6s;
3625 animation-delay: 1.6s
3626 }
3627 .pagelayer-txt-loading .letters-loading:nth-child(10):before {
3628 -webkit-animation-delay: 1.8s;
3629 animation-delay: 1.8s
3630 }
3631 .pagelayer-txt-loading .letters-loading:nth-child(11):before {
3632 -webkit-animation-delay: 2s;
3633 animation-delay: 2s
3634 }
3635
3636 .pagelayer-loaded .pagelayer-animation-section .pagelayer-loader, .pagelayer-loaded .pagelayer-animation-section .pagelayer-txt-loading{
3637 opacity: 0;
3638 -webkit-transition: all 0.3s ease-out;
3639 transition: all 0.3s ease-out;
3640 }
3641
3642 @-webkit-keyframes letters-loading {
3643 0%, 75%, 100% {
3644 opacity: 0;
3645 -webkit-transform: rotateY(-90deg);
3646 transform: rotateY(-90deg)
3647 }
3648 25%, 50% {
3649 opacity: 1;
3650 -webkit-transform: rotateY(0deg);
3651 transform: rotateY(0deg)
3652 }
3653 }
3654 @keyframes letters-loading {
3655 0%, 75%, 100% {
3656 opacity: 0;
3657 -webkit-transform: rotateY(-90deg);
3658 transform: rotateY(-90deg)
3659 }
3660 25%, 50% {
3661 opacity: 1;
3662 -webkit-transform: rotateY(0deg);
3663 transform: rotateY(0deg)
3664 }
3665 }
3666
3667 @media screen and (max-width: 767px) {
3668 #pagelayer-loader-wrapper .pagelayer-animation-section .pagelayer-loader {
3669 height: 8em;
3670 width: 8em
3671 }
3672 #pagelayer-loader-wrapper .pagelayer-animation-section .pagelayer-txt-loading {
3673 font: bold 3.5em Poppins, sans-serif
3674 }
3675 .pagelayer-loader .pagelayer-percent-parent .pagelayer-percent{
3676 font-size:20px;
3677 }
3678 }
3679 @media screen and (max-width: 500px) {
3680 #pagelayer-loader-wrapper .pagelayer-animation-section .pagelayer-loader {
3681 height: 7em;
3682 width: 7em
3683 }
3684 #pagelayer-loader-wrapper .pagelayer-animation-section .pagelayer-txt-loading {
3685 font: bold 2em Poppins, sans-serif
3686 }
3687 .pagelayer-loader .pagelayer-percent-parent .pagelayer-percent{
3688 font-size:15px;
3689 }
3690 }
3691
3692 /* Pre-Loading animaiton classes end*/
3693
3694 /* Update Loading animation class start */
3695
3696 .pagelayer-update-button{
3697 width:58px;
3698 height:24px;
3699 }
3700
3701 .pagelayer-update-loader{
3702 display:none;
3703 padding:2px;
3704 }
3705
3706 .pagelayer-update-loader span{
3707 width:8px;
3708 height:8px;
3709 margin: 0 2px;
3710 background-color: #ededede0;
3711 border-radius: 50%;
3712 display:inline-block;
3713 animation: dots 0.9s ease-in-out infinite;
3714 }
3715
3716 .pagelayer-update-loader span:nth-child(2){
3717 animation-delay: 0.3s;
3718 }
3719
3720 .pagelayer-update-loader span:nth-child(3){
3721 animation-delay: 0.6s;
3722 }
3723
3724 @keyframes dots{
3725 50%{
3726 opacity:0;
3727 }
3728 }
3729
3730 /* Update Loading animation class end */
3731
3732 /* Error box css starts */
3733
3734 .pagelayer-errorBox{
3735 position:absolute;
3736 top:10px;
3737 left: 0;
3738 right: 0;
3739 margin-left: auto;
3740 margin-right: auto;
3741 width:70%;
3742 height:234;
3743 border-radius:20px;
3744 background-color:#fffafa;
3745 box-shadow: 1px 1px 8px #ffc7c7;
3746 z-index:9999;
3747 display:none;
3748 }
3749
3750 .pagelayer-errorBox-close{
3751 position:absolute;
3752 right:10;
3753 top:10;
3754 font-size:20px;
3755 padding:5px;
3756 color:lightgrey;
3757 cursor:pointer;
3758 }
3759
3760 .pagelayer-errorBox-main{
3761 height:180px;
3762 margin:2px 10px;
3763 }
3764
3765 .pagelayer-errorBox-main h2{
3766 color:red;
3767 font-size:20px;
3768 margin:0;
3769 }
3770
3771 .pagelayer-errorBox-main h2 i{
3772 font-size:30px;
3773 margin:10px;
3774 vertical-align:middle;
3775 }
3776
3777 .pagelayer-errorBox-content{
3778 margin-left:90px;
3779 font-size:13px;
3780 overflow:auto;
3781 height:130px;
3782 border-bottom:1px solid lightgrey;
3783 }
3784
3785 .pagelayer-errorBox-resolve{
3786 text-align:right;
3787 padding:10px;
3788 }
3789 .pagelayer-errorBox-resolve p{
3790 display:inline;
3791 margin:10px;
3792 }
3793
3794 .pagelayer-errorBox-resolve .pagelayer-errorBox-support, .pagelayer-errorBox-resolve .pagelayer-errorBox-copy{
3795 cursor:pointer;
3796 padding: 5px;
3797 border-radius: 5px;
3798 color: white;
3799 }
3800
3801 .pagelayer-errorBox-resolve .pagelayer-errorBox-copy{
3802 background-color: #616cf3;
3803 border: 1px solid blue;
3804 }
3805
3806 .pagelayer-errorBox-resolve .pagelayer-errorBox-support{
3807 background-color: #56b45d;
3808 border: 1px solid green;
3809 }
3810
3811 /* Error box css ends */
3812
3813 /* Property modal start*/
3814 .pagelayer-elp-modal-wrapper{
3815 position: fixed;
3816 top: 0;
3817 bottom: 0;
3818 left: 0;
3819 right: 0;
3820 overflow-y: auto;
3821 background: #0000009c;
3822 z-index: 999;
3823 color: #fff;
3824 display:none;
3825 }
3826
3827 .pagelayer-elp-modal-wrap{
3828 width: 500px;
3829 background-color: #fff;
3830 position: relative;
3831 margin: 20px auto;
3832 border-radius: 5px;
3833 box-shadow: 0px 0px 7px 0px #fff;
3834 }
3835
3836 .pagelayer-elp-modal-close{
3837 float:right;
3838 padding: 5px;
3839 cursor:pointer
3840 }
3841
3842 .pagelayer-elp-modal-header{
3843 padding:15px 20px 10px;
3844 margin-top: 10px;
3845 font-size: 13px;
3846 font-weight: bold;
3847 color: #555;
3848 }
3849
3850 .pagelayer-elp-modal-holder{
3851 padding: 5px 20px 10px;
3852 }
3853
3854 /* Property modal end*/
3855 /* Property link start*/
3856
3857 .pagelayer-elp-link-list{
3858 max-height:250px;
3859 overflow:auto;
3860 width: 99%;
3861 top: 35px;
3862 right: 4px;
3863 }
3864
3865 .pagelayer-elp-link-list .pagelayer-elp-link-search{
3866 width:100%;
3867 }
3868
3869 .pagelayer-elp-link-item{
3870 display: flex;
3871 font-size: 13px;
3872 padding: 7px 2px;
3873 margin: 2px 0;
3874 cursor: pointer;
3875 align-items:center;
3876 }
3877
3878 .pagelayer-elp-link-item:hover{
3879 box-shadow: inset 0 0 0 1px #555d66, inset 0 0 0 2px #fff;
3880 border-radius: 4px;
3881 }
3882
3883 .pagelayer-elp-link-item span{
3884 text-overflow: ellipsis;
3885 display: inline-block;
3886 overflow: hidden;
3887 white-space: nowrap;
3888 width: 100%;
3889 padding:3px;
3890 }
3891
3892 .pagelayer-elp-link-item-title{
3893 font-weight:bold;
3894 }
3895
3896 .pagelayer-elp-link-item-perma{
3897 color:#999;
3898 }
3899
3900 .pagelayer-elp-link-title{
3901 width: 73%;
3902 margin-right:2%;
3903 }
3904
3905 .pagelayer-elp-link-info{
3906 width: 20%;
3907 background-color: #ededed;
3908 padding: 2px;
3909 font-size:11px;
3910 }
3911
3912 .pagelayer-elp-link-id{
3913 background-color: #ededed;
3914 padding: 2px 6px;
3915 font-size:12px;
3916 margin-left:5px;
3917 }
3918
3919 .pagelayer-elp-link-info span{
3920 padding: 4px;
3921 }
3922
3923 .pagelayer-elp-link-div .pagelayer-elp-link-addons{
3924 margin-right: 30px;
3925 display: none;
3926 }
3927
3928 .pagelayer-elp-link-div .pagelayer-elp-link-cb-div{
3929 display: flex;
3930 justify-content: space-between;
3931 align-items: center;
3932 padding-top: 5px;
3933 }
3934
3935 .pagelayer-elp-link-div .pagelayer-elp-link-cb-div:first-child{
3936 margin-top: 10px;
3937 }
3938
3939 .pagelayer-elp-link-div .pagelayer-elp-link-ca{
3940 margin: 5px 0px;
3941 }
3942
3943 .pagelayer-elp-link-ca input{
3944 width: 100%;
3945 }
3946
3947 /* Property link end*/
3948 /* Editor notice start*/
3949 .pagelayer-editor-notice{
3950 position: fixed;
3951 right: 10px;
3952 top: 10px;
3953 padding-right: 16px;
3954 transition: all 5s ease-out;
3955 pointer-events: none;
3956 }
3957
3958 .sitepad-body .pagelayer-editor-notice{
3959 top:50px;
3960 }
3961
3962 .pagelayer-editor-msg{
3963 position:relative;
3964 font-size: 13px;
3965 background-color: rgba(0,0,0,.8);
3966 border-radius: 4px;
3967 box-shadow: 0 2px 4px rgba(0,0,0,.3);
3968 color: #fff;
3969 padding: 16px 30px 16px 15px;
3970 margin-bottom:7px;
3971 transition: opacity 800ms ease-out;
3972 pointer-events: all;
3973 width:fit-content;
3974 margin-left:auto;
3975 }
3976
3977 .pagelayer-editor-msg.pagelayer-editor-msg-state-success{
3978 background-color: #449d44;
3979 }
3980
3981 .pagelayer-editor-msg.pagelayer-editor-msg-state-error{
3982 background-color: #ef4d4d;
3983 }
3984
3985 .pagelayer-editor-msg.pagelayer-editor-msg-state-warning{
3986 background-color: #cd8500;
3987 }
3988
3989 .pagelayer-notice-x{
3990 position: absolute;
3991 top: 50%;
3992 right: 10px;
3993 transform: translateY(-50%);
3994 cursor:pointer;
3995 }
3996
3997 /* Editor notice end*/
3998 /* Pagelayer post setting modal start*/
3999 .pagelayer-props-modal{
4000 position: fixed;
4001 left: 0;
4002 top: 0;
4003 right: 0;
4004 bottom: 0;
4005 z-index: 1100;
4006 background-color:#2d2d2d8c;
4007 display:none;
4008 }
4009
4010 .pagelayer-props-holder{
4011 position:relative;
4012 height: 100%;
4013 overflow: auto;
4014 display: flex;
4015 justify-content: center;
4016 align-items: center;
4017 width: 100%;
4018 margin:auto;
4019 max-height: 967px;
4020 }
4021
4022 .pagelayer-props-wrap{
4023 position:relative;
4024 height: 90%;
4025 width: 90%;
4026 margin:auto;
4027 overflow: auto;
4028 display: flex;
4029 justify-content: center;
4030 align-items: center;
4031 border-radius: 10px
4032 }
4033
4034 .pagelayer-props-loading-screen{
4035 position:absolute;
4036 border: 8px solid transparent;
4037 border-radius: 50%;
4038 border-top: 8px solid #ebebeb;
4039 width: 80px;
4040 height: 80px;
4041 -webkit-animation: propsLoading 0.5s ease-in-out infinite; /* Safari */
4042 animation: propsLoading 0.5s ease-in-out infinite;
4043 }
4044
4045 /* Safari */
4046 @-webkit-keyframes propsLoading {
4047 0% { -webkit-transform: rotate(0deg); }
4048 100% { -webkit-transform: rotate(360deg); }
4049 }
4050
4051 @keyframes propsLoading {
4052 0% { transform: rotate(0deg); }
4053 100% { transform: rotate(360deg); }
4054 }
4055
4056 .pagelayer-props-wrap .pagelayer-meta-iframe{
4057 position: relative;
4058 width: 100%;
4059 height: 100%;
4060 border: 0px;
4061 }
4062
4063 .pagelayer-props-modal-close{
4064 position: absolute;
4065 top: 20px;
4066 right: 25px;
4067 z-index: 999;
4068 cursor:pointer;
4069 visibility:hidden;
4070 }
4071
4072 @keyframes highlight {
4073 0% {
4074 background: #dfdfdf;
4075 }
4076 100% {
4077 background: #fff;
4078 }
4079 }
4080
4081 .highlight {
4082 animation: highlight 1s;
4083 animation-iteration-count: 5;
4084 }
4085 /* Pagelayer post setting modal end */
4086
4087 /* Pagelayer post props(category) start */
4088 .pagelayer-post-cat-div{
4089 max-height:300px;
4090 overflow:auto;
4091 }
4092
4093 .pagelayer-post-category, .pagelayer-post-category ul{
4094 list-style:none;
4095 padding:0;
4096 margin:0;
4097 margin-left:16px;
4098 }
4099
4100 .pagelayer-post-category li{
4101 margin:8px 0px;
4102 }
4103
4104 .pagelayer-post-category label, .pagelayer-elp-postCategory *{
4105 font-size:small;
4106 }
4107
4108 .pagelayer-post-category input[type=checkbox]{
4109 margin-right:5px;
4110 background-color:#007cba;
4111 width:16px;
4112 height:16px;
4113 }
4114
4115 .pagelayer-add-cat-btn{
4116 color:#0073aa;
4117 cursor:pointer;
4118 line-height:3;
4119 }
4120
4121 .pagelayer-add-cat-btn:hover{
4122 color:#00a0d2;
4123 }
4124
4125 .pagelayer-elp-postCategory input, .pagelayer-parent-category > select{
4126 margin-top:5px;
4127 margin-bottom:12px;
4128 }
4129
4130 .pagelayer-parent-category{
4131 margin-top:5px;
4132 }
4133
4134 .pagelayer-parent-category > select{
4135 height:32px;
4136 outline:none;
4137 }
4138
4139 .pagelayer-cat-submit{
4140 color: #007cba;
4141 border: 1px solid #007cba;
4142 padding: 10px;
4143 background-color: white;
4144 cursor: pointer;
4145 }
4146
4147 .pagelayer-cat-submit:hover{
4148 color: #006ba1;
4149 border: 1px solid #006ba1;
4150 }
4151
4152 .pagelayer-dark .pagelayer-cat-submit,
4153 .pagelayer-elp-postCategory input{
4154 background-color:transparent;
4155 }
4156
4157 .pagelayer-dark .pagelayer-cat-submit:hover{
4158 color:white;
4159 background-color:#007cba;
4160 }
4161
4162 /* Pagelayer post props(category) end */
4163 /* Pagelayer post props(tags) start */
4164
4165 .pagelayer-elp-postTags{
4166 border: 1px solid #757575;
4167 border-radius: 2px;
4168 display: flex;
4169 flex-wrap: wrap;
4170 padding:2px;
4171 }
4172
4173 .pagelayer-post-tags{
4174 display: flex;
4175 flex-wrap: wrap;
4176 align-items: flex-start;
4177 }
4178
4179 .pagelayer-elp-tags-ele{
4180 display: flex;
4181 margin: 2px 4px 2px 0;
4182 max-width: 100%;
4183 background-color: #ddd;
4184 border-radius: 2px;
4185 font-size: 13px;
4186 padding: 5px;
4187 }
4188
4189 .pagelayer-elp-tags-ele .pagelayer-tags-label{
4190 padding: 2px;
4191 }
4192
4193 .pagelayer-elp-tags-ele .pagelayer-elp-tags-remove{
4194 cursor:pointer;
4195 padding: 3px 5px;
4196 }
4197
4198 .pagelayer-elp-postTags-inp{
4199 width:auto;
4200 display: inline-block;
4201 flex: 1;
4202 padding: 5px;
4203 height: 26px;
4204 border: none !important;
4205 outline: none !important;
4206 max-width: 100%;
4207 min-height: 24px;
4208 min-width: 50px;
4209 background: inherit;
4210 color: #1e1e1e;
4211 box-shadow: none;
4212 margin-top:3px;
4213 }
4214
4215 .pagelayer-post-tags .pagelayer-postTags-list{
4216 flex: 1 0 100%;
4217 min-width: 100%;
4218 max-height: 9em;
4219 overflow-y: auto;
4220 transition: all .15s ease-in-out;
4221 list-style: none;
4222 border-top: 1px solid #757575;
4223 outline: none;
4224 border: none;
4225 margin: 0;
4226 margin-top:4px;
4227 padding:0;
4228 }
4229
4230
4231 .pagelayer-post-tags .pagelayer-postTags-list li{
4232 color: #757575;
4233 display: block;
4234 font-size: 13px;
4235 padding: 4px 8px;
4236 margin: 0;
4237 cursor: pointer;
4238 border-top: 1px solid #757575;
4239 }
4240
4241 .pagelayer-post-tags .pagelayer-postTags-list li:hover{
4242 color:white;
4243 background-color:#007cba;
4244 }
4245
4246 .pagelayer-elp-trash-button-div{
4247 text-align:center;
4248 }
4249
4250 .pagelayer-elp-trash-button{
4251 color: #cc1818;
4252 padding: 6px;
4253 white-space: nowrap;
4254 background: transparent;
4255 text-decoration: none;
4256 font-size: 13px;
4257 cursor: pointer;
4258 border: 1px solid #cc1818;
4259 border-radius: 2px;
4260 }
4261
4262 .pagelayer-elp-trash-button:hover{
4263 background-color: transparent;
4264 color: #710d0d;
4265 box-shadow: inset 0 0 0 1px #710d0d;
4266 }
4267
4268 .pagelayer-dark .pagelayer-elp-trash-button:hover{
4269 color:#ffffff;
4270 background-color: #cc1818;
4271 }
4272
4273
4274 .pagelayer-dark .pagelayer-elp-postdate-div .pagelayer-elp-postdate::-webkit-calendar-picker-indicator{
4275 filter: invert(70%);
4276 }
4277 /* Pagelayer post props(tags) end */
4278 /* Pagelayer widget list tooltip start*/
4279
4280 .pagelayer-widget-tooltip{
4281 position: fixed;
4282 top: 0;
4283 left: 0;
4284 background: #fff;
4285 width: 300px;
4286 max-height: 350px;
4287 min-height: 125px;
4288 height: auto;
4289 overflow-y: auto;
4290 box-shadow: 0 2px 6px rgb(0 0 0 / 5%);
4291 border-radius: 2px;
4292 display: none;
4293 z-index: 999;
4294 }
4295
4296 .pagelayer-widget-search-holder{
4297 position: sticky;
4298 top: 0;
4299 padding: 10px 10%;
4300 z-index: 1;
4301 background: #fff;
4302 }
4303
4304 .pagelayer-widget-search{
4305 position: relative;
4306 }
4307
4308 .pagelayer-pointer.pagelayer-shortcode-text,
4309 .pagelayer-pointer.pagelayer-sc{
4310 cursor: pointer !important;
4311 }
4312
4313 .pagelayer-widget-tooltip .pagelayer-search-field{
4314 border: 2px solid;
4315 }
4316
4317 .pagelayer-widget-tooltip .pagelayer-shortcode-holder{
4318 width: 70px !important;
4319 border: 1px solid transparent;
4320 }
4321
4322 .pagelayer-widget-list-tooltip{
4323 width: 150px !important;
4324 padding: 0px 10px;
4325 }
4326
4327 .pagelayer-shortcode-holder[pagelayer-tag="pl_row"],
4328 .pagelayer-shortcode-holder[pagelayer-tag="pl_col"],
4329 .pagelayer-widget-list-tooltip .pagelayer-widget-group h5,
4330 .pagelayer-widget-list-tooltip .pagelayer-widget-search-holder{
4331 display:none !important;
4332 }
4333
4334 .pagelayer-widget-list-tooltip .pagelayer-shortcode{
4335 width: 24px;
4336 height: 16px;
4337 font-size: 14px;
4338 text-align: left;
4339 }
4340
4341 .pagelayer-widget-list-tooltip .pagelayer-shortcode-holder{
4342 width: 100% !important;
4343 height: auto !important;
4344 float: unset;
4345 margin: 0px;
4346 }
4347
4348 .pagelayer-widget-list-tooltip .pagelayer-sc{
4349 display: flex;
4350 align-items: center;
4351 }
4352
4353 .pagelayer-widget-list-tooltip .pagelayer-shortcode-text{
4354 text-align: left;
4355 }
4356
4357 .pagelayer-widget-list-tooltip .pagelayer-shortcode-inner{
4358 height: auto;
4359 width: 22px;
4360 }
4361
4362 .pagelayer-shortcode-holder.pagelayer-list-widget-active{
4363 border: 1px solid rgb(0, 128, 0);
4364 }
4365
4366 /* Pagelayer widget list tooltip end*/
4367 /* Menu start */
4368 .pagelayer-elp-menu-items-holder{
4369 padding-top: 15px;
4370 }
4371
4372 .pagelayer-drag-highlight{
4373 margin-top: 0;
4374 margin-bottom: 10px;
4375 max-width: calc(100% - 2px);
4376 border: 1px dashed #a7aaad;
4377 height: 33px !important;
4378 }
4379
4380 .pagelayer-menu-depth-1{
4381 margin-left: 10px;
4382 width: calc(100% - 10px) !important;
4383 }
4384
4385 .pagelayer-menu-depth-2{
4386 margin-left: 20px;
4387 width: calc(100% - 20px) !important;
4388 }
4389
4390 .pagelayer-menu-depth-3{
4391 margin-left: 30px;
4392 width: calc(100% - 30px) !important;
4393 }
4394
4395 .pagelayer-menu-depth-4{
4396 margin-left: 40px;
4397 width: calc(100% - 40px) !important;
4398 }
4399
4400 .pagelayer-menu-depth-5{
4401 margin-left: 50px;
4402 width: calc(100% - 50px) !important;
4403 }
4404
4405 .pagelayer-menu-depth-6{
4406 margin-left: 60px;
4407 width: calc(100% - 60px) !important;
4408 }
4409
4410 .pagelayer-menu-depth-7{
4411 margin-left: 70px;
4412 width: calc(100% - 70px) !important;
4413 }
4414
4415 .pagelayer-menu-depth-8{
4416 margin-left: 80px;
4417 width: calc(100% - 80px) !important;
4418 }
4419
4420 .pagelayer-menu-depth-9{
4421 margin-left: 90px;
4422 width: calc(100% - 90px) !important;
4423 }
4424
4425 .pagelayer-menu-depth-10{
4426 margin-left: 100px;
4427 width: calc(100% - 100px) !important;
4428 }
4429
4430 .pagelayer-menu-depth-11{
4431 margin-left: 110px;
4432 width: calc(100% - 110px) !important;
4433 }
4434
4435 .pagelayer-menu-depth-12{
4436 margin-left: 120px;
4437 width: calc(100% - 120px) !important;
4438 }
4439
4440 .pagelayer-menu-depth-13{
4441 margin-left: 130px;
4442 width: calc(100% - 130px) !important;
4443 }
4444
4445 .pagelayer-menu-depth-14{
4446 margin-left: 140px;
4447 width: calc(100% - 140px) !important;
4448 }
4449
4450 .pagelayer-menu-depth-15{
4451 margin-left: 150px;
4452 width: calc(100% - 150px) !important;
4453 }
4454
4455 .pagelayer-menu-item-transport:empty{
4456 display: none;
4457 }
4458
4459 .pagelayer-menu-item-transport{
4460 padding-top: 10px;
4461 }
4462 /* Menu end */