PluginProbe
Page Builder: Pagelayer – Drag and Drop website builder / 0.9.8
Page Builder: Pagelayer – Drag and Drop website builder v0.9.8
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 0.9.8, at css/pagelayer-editor.css

1,863 lines 33.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: Arial;
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: #212121;
210 position:relative;
211 }
212
213 .pagelayer-bottombar{
214 padding: auto;
215 }
216
217 .pagelayer-bottombar-rightbuttons button{
218 font-size: 14px;
219 font-weight: bold;
220 cursor: pointer;
221 border-radius: 2px;
222 padding: 4px 8px;
223 margin: auto 5px;
224 outline:none;
225 }
226
227 .pagelayer-bottombar-rightbuttons .fa{
228 color:#fff;
229 cursor: pointer;
230 }
231
232 .pagelayer-success-btn{
233 border: #398439 1px solid;
234 color: #fff;
235 background: #449d44;
236 }
237
238 .pagelayer-success-btn:hover{
239 background: #3a733a;
240 border-color: #3a733a;
241 }
242
243 .pagelayer-close-button{
244 border: #ef4d4d 1px solid;
245 color: #fff;
246 background: #ef4d4d;
247 }
248
249 .pagelayer-close-button:hover{
250 background: #c13030;
251 border-color: #c13030;
252 }
253
254 .pagelayer-mode-wrapper{
255 display:inline-block;
256 text-align:center;
257 }
258
259 .pagelayer-mode-wrapper i{
260 padding: 8px;
261 margin: auto 5px;
262 }
263
264 .pagelayer-mode-buttons-wrapper{
265 position:absolute;
266 bottom:100%;
267 color:#fff;
268 background-color: #3e8ef7;
269 display:none;
270 }
271
272 .pagelayer-leftbar-toggle-h{
273 width:0px;
274 }
275
276 .pagelayer-leftbar-toggle{
277 position: absolute;
278 width:12px;
279 background: #E3E3E3;
280 cursor: pointer;
281 text-align:center;
282 line-height:300%;
283 }
284
285 .pagelayer-leftbar-toggle:hover{
286 background-color: #3e8ef7;
287 color: #ffffff;
288 }
289
290 .pagelayer-leftbar-holder{
291 overflow: hidden;
292 position: absolute;
293 top: 0;
294 bottom: 0;
295 left: 0;
296 right: 0;
297 }
298
299 .pagelayer-iframe{
300 }
301
302 .pagelayer-iframe-holder{
303 max-height:100vh !important;
304 height: 100%;
305 overflow: auto;
306 text-align:center;
307 }
308
309 .pagelayer-body{
310 transition:0.5s;
311 }
312
313 .pagelayer-screen-desktop{
314
315 }
316
317 .pagelayer-screen-tablet{
318 width:768px;
319 height:900px;
320 margin:20px auto;
321 border: solid #444;
322 border-width: 30px 10px;
323 border-radius: 10px;
324 }
325
326 .pagelayer-screen-mobile{
327 width:360px;
328 height:540px;
329 margin:20px auto;
330 border: solid #444;
331 border-width: 30px 10px;
332 border-radius: 10px;
333 }
334
335 /* Element Properties Dialog classes */
336 [class^="pagelayer-elp"]{
337 font-family: Arial, "Helvetica Neue", Helvetica, sans-serif !important;
338 color: #313439;
339 background-color: transparent;
340 }
341
342 #pagelayer-elpd {
343 display:none;
344 color:#444;
345 border: 1px solid #d3d3d3;
346 }
347
348 #pagelayer-elpd .slimScrollDiv{
349 height: calc(100% - 50px) !important;
350 }
351
352 .pagelayer-elpd-header {
353 border: none;
354 color:#fff;
355 }
356
357 .pagelayer-elpd-title {
358 text-align: center;
359 padding:0px;
360 cursor: move;
361 color: #fff;
362 font-weight: 600;
363 }
364
365 .pagelayer-elpd-close {
366 float:right;
367 padding-right:10px;
368 cursor: pointer;
369 margin: 0px;
370 position: relative;
371 right: 5px;
372 color: #fff;
373 font-weight: 600;
374 }
375
376 .pagelayer-elpd-body{
377 border: none;
378 }
379
380 .pagelayer-elpd-section-rows{
381 background-color: #FFF;
382 border-top: 1px solid #d3d3d3;
383 }
384
385 .pagelayer-elpd-section-name{
386 margin-top: 10px;
387 padding: 11px 10px;
388 background-color: #FFF;
389 font-size: 12px;
390 font-weight: bold;
391 color: #666;
392 cursor: pointer;
393 transition: all 0.3s;
394 }
395
396 .pagelayer-elpd-section-name:hover,
397 .pagelayer-elpd-section-open{
398 color:#000000;
399 }
400
401 .pagelayer-elpd-section-name:not(.pagelayer-elpd-section-open) .fa:before{
402 content: "\f0da";
403 }
404 .pagelayer-elpd-section-name.pagelayer-elpd-section-open .fa:before{
405 content: "\f0d7";
406 }
407
408 .pagelayer-elpd-section-name .fa{
409 width:15px;
410 float:right;
411 }
412
413 /* Pagelayer editor panel tabs*/
414
415 .pagelayer-elpd-tab,
416 .pagelayer-history-tab{
417 display: inline-block;
418 font-size: 13px;
419 cursor: pointer;
420 padding: 10px 6px;
421 margin: 0px 5px 0px 0px;
422 }
423
424 .pagelayer-elpd-settings-body{
425 display: none;
426 }
427
428 .pagelayer-elpd-settings-body.active{
429 display: block;
430 }
431
432 .pagelayer-elpd-style-body{
433 display: none;
434 }
435
436 .pagelayer-elpd-style-body.active{
437 display: block;
438 }
439
440 .pagelayer-history-section{
441 display:none;
442 }
443
444 .pagelayer-history-body{
445 margin:10px 0px;
446 padding:10px;
447 background-color:#ffffff;
448 }
449
450 .pagelayer-history-section.active{
451 display:block;
452 }
453
454 .pagelayer-history-section.active[pagelayer-show-tab="actions"]{
455 display:flex;
456 flex-direction:column-reverse;
457 }
458
459 [pagelayer-elpd-active-tab="1"],
460 [pagelayer-history-active-tab="1"] {
461 color: #3e8ef7;
462 }
463
464 .pagelayer-elpd-tabs,
465 .pagelayer-history-tabs {
466 background-color: #fff;
467 border-bottom: 1px solid #d3d3d3;
468 }
469
470 .pagelayer-elpd-options{
471 text-align:right;
472 display:inline-block;
473 margin-right:10px;
474 }
475
476 .pagelayer-elpd-options i{
477 padding:4px 5px;
478 cursor:pointer;
479 }
480
481 .pagelayer-form-item {
482 border-bottom: 1px dashed #e6e6e6;
483 padding: 10px 8px 10px 6px;
484 margin-bottom: 0px;
485 position: relative;
486 }
487
488 .pagelayer-elp-label-div{
489 padding:4px 0px 4px 0px;
490 position:relative;
491 }
492
493 .pagelayer-elp-label{
494 display: inline-block;
495 color: #555;
496 font-size: 12px;
497 line-height: 150%;
498 }
499
500 .pagelayer-elp-heading{
501 font-size: 13px;
502 font-weight:600;
503 line-height: 150%;
504 }
505
506 .pagelayer-elp-screen{
507 display: inline-block;
508 position: absolute;
509 top: -2px;
510 text-align: center;
511 z-index: 1;
512 }
513
514 .pagelayer-elp-screen .fa{
515 padding: 0;
516 cursor: pointer;
517 box-shadow: 0 0 0.5rem #babbbc;
518 height: 30px;
519 width: 30px;
520 border-radius: 50%;
521 line-height: 30px;
522 transition-duration: 0.1s;
523 }
524
525 .pagelayer-elp-screen .fa-desktop:not(.pagelayer-prop-screen),
526 .pagelayer-elp-screen .fa-tablet:not(.pagelayer-prop-screen),
527 .pagelayer-elp-screen .fa-mobile:not(.pagelayer-prop-screen){
528 position: absolute;
529 transform: none;
530 left: 0;
531 opacity:0;
532 background:#aaaaaa;
533 color:#ffffff;
534 }
535
536 .pagelayer-elp-screen .fa-desktop.open{
537 transform: rotate(-90deg) translate(30px, -27px) rotate(90deg);
538 transition-delay: 0s;
539 left: 40px;
540 opacity:1;
541 }
542
543 .pagelayer-elp-screen .fa-tablet.open{
544 transform: rotate(-90deg) translate(0px, -6px) rotate(90deg);
545 transition-delay: 0.1s;
546 left: 40px;
547 opacity:1;
548 }
549
550 .pagelayer-elp-screen .fa-mobile.open{
551 transform: rotate(-90deg) translate(-30px, -27px) rotate(90deg);
552 transition-delay: 0.2s;
553 left: 40px;
554 opacity:1;
555 }
556
557 .pagelayer-elp-screen .pagelayer-prop-screen{
558 box-shadow: none;
559 z-index: 2;
560 position: absolute;
561 }
562
563 .pagelayer-elp-screen .fa:not(.pagelayer-prop-screen):hover{
564 background-color: #3E8EF7;
565 }
566
567 .pagelayer-elp-screen .pagelayer-prop-screen:hover{
568 color: #3E8EF7;
569 }
570
571 .pagelayer-elp-screen .fa-tablet{
572 font-size:1.2em;
573 }
574
575 .pagelayer-elp-screen .fa-mobile{
576 font-size:1.3em;
577 }
578
579 .pagelayer-elp-screen{
580 display: inline-block;
581 }
582
583 .pagelayer-elp-units{
584 display: inline-block;
585 float:right;
586 padding-top:4px;
587 }
588
589 .pagelayer-elp-units span{
590 padding:1px 4px;
591 font-size:12px;
592 cursor: pointer;
593 }
594
595 .pagelayer-elp-units span[selected] {
596 color: #3e8ef7;
597 }
598
599 .pagelayer-elp-desc{
600 color: rgba(49, 52, 57, 0.8);
601 font-size: 12px;
602 line-height: 20px;
603 font-style: italic;
604 margin-top: 5px;
605 }
606
607 .pagelayer-elpd-body input,
608 .pagelayer-elpd-body textarea,
609 .pagelayer-elpd-body select,
610 .pagelayer-elpd-body option,
611 .pagelayer-elp-multiselect{
612 font-size: 13px !important;
613 color: #666;
614 border-radius: unset;
615 border:1px solid #CCC;
616 line-height: 26px;
617 width: 100%;
618 }
619
620 .pagelayer-elpd-body input:focus,
621 .pagelayer-elpd-body textarea:focus,
622 .pagelayer-elpd-body select:focus{
623 border-color: #00A0D2;
624 box-shadow: 0 0 1px #00A0D2 inset;
625 }
626
627 .pagelayer-elp-button{
628 text-transform: unset;
629 border: 1px solid #00A0D2;
630 font-weight: unset;
631 font-size: 12px;
632 padding: 12px 10px;
633 min-height: unset;
634 background-color: #3e8ef7;
635 color: #fff;
636 transition: all 0.3s;
637 border-radius: unset;
638 border-radius: 2px;
639 padding: 10px 15px;
640 cursor:pointer;
641 }
642
643 .pagelayer-elp-button:hover{
644 background-color: #3e8ef7bf;
645 border-color: #00A0D2;
646 }
647
648 .pagelayer-elp-image-div{
649 padding:7px;
650 width:90%;
651 margin:5px auto;
652 height:150px;
653 border: 1px solid #d5dadf;
654 position:relative;
655 border: 1px solid #3e8ef7;
656 }
657
658 .pagelayer-elp-image{
659 height: 100%;
660 -webkit-background-size: cover;
661 background-size: cover;
662 background-position: 50%;
663 cursor:pointer;
664 }
665
666 .pagelayer-elp-image-delete{
667 cursor: pointer;
668 position: absolute;
669 top: 4px;
670 right: 4px;
671 background-color: #3e8ef7;
672 padding: 5px 9px;
673 max-width: 28px;
674 max-height: 28px;
675 -webkit-box-sizing: content-box;
676 -moz-box-sizing: content-box;
677 box-sizing: content-box;
678 border-radius: 2px;
679 }
680
681 .pagelayer-elp-image-delete .fa{
682 color: #fff;
683 }
684
685 .pagelayer-hidden{
686 display:none !important;
687 }
688
689 .pagelayer-elp-radio-div{
690 display:flex;
691 }
692
693 .pagelayer-elp-radio{
694 display: inline-block;
695 vertical-align: middle;
696 padding: 6px 8px;
697 cursor: pointer;
698 font-size:12px;
699 color: #666 !important;
700 text-decoration: none;
701 background: #eee;
702 margin: 5px 2px;
703 flex:1;
704 text-align:center;
705 }
706
707 .pagelayer-elp-radio:hover{
708 background-color:#3e8ef7bf !important;
709 color:#fff !important;
710 transition: all 0.6s;
711 }
712
713 .pagelayer-elp-radio-active{
714 background-color: #3e8ef7 !important;
715 color:#ffffff !important;
716 }
717
718 .pagelayer-elp-color-div{
719 cursor: pointer;
720 padding: 4px;
721 width: 50px;
722 height: 25px;
723 display: block;
724 border-radius: 2px;
725 margin: 0 auto;
726 position: absolute;
727 top: 5px;
728 right: 7px;
729 border: solid 1px #d1d1d1;
730 color: #333;
731 vertical-align: middle;
732 }
733
734 .pagelayer-elp-color-preview{
735 height: 93%;
736 border: solid 1px #d1d1d1;
737 }
738
739 .picker_arrow {
740 display:none;
741 }
742
743 .picker_wrapper {
744 top: 13px !important;
745 right: -15px !important;
746 }
747
748 .pagelayer-elp-color-span{
749 padding: 2px 0;
750 height: 28px;
751 line-height: 28px;
752 float: left;
753 font-size: 10px;
754 }
755
756 .pagelayer-elp-color-div .picker_wrapper{
757 margin-top: 22px !important;
758 border: 1px solid rgba(0,0,0,0.2) !important;
759 background: #fff !important;
760 box-shadow: 0 3px 5px rgba(0,0,0,0.2) !important;
761 }
762
763 .pagelayer-elp-icon-div{
764 cursor: pointer;
765 padding: 6px;
766 border: solid 1px #d1d1d1;
767 background: #fffffc;
768 color: #333;
769 vertical-align: middle;
770 width: 126px;
771 height: 18px;
772 display: block;
773 border-radius: 4px;
774 margin: 0 auto;
775 position: absolute;
776 top: 7px;
777 right: 10px;
778 }
779
780 .pagelayer-elp-icon-preview{
781 position: relative;
782 display: block;
783 margin-right: 5px;
784 float: left;
785 width: 83%;
786 height: auto;
787 border: none;
788 overflow: hidden;
789 white-space: nowrap;
790 text-overflow: ellipsis;
791 }
792
793 .pagelayer-elp-icon-preview i{
794 padding-right: 5px;
795 font-size: 19px;
796 color: #666;
797 vertical-align: middle;
798 }
799
800 .pagelayer-elp-icon-name{
801 font-size: 13px;
802 }
803
804 .pagelayer-elp-icon-open{
805 float: right;
806 font-size: 10px;
807 padding: 0px;
808 line-height: 20px;
809 }
810
811 .pagelayer-elp-icon-remove{
812 position: absolute;
813 right: 20px;
814 font-size: 11px;
815 top: 10px;
816 z-index: 10;
817 }
818
819 .pagelayer-elp-icon-selector{
820 position: absolute;
821 z-index: 1000;
822 border: 1px solid rgba(0,0,0,0.2) !important;
823 background: #fff !important;
824 box-shadow: 0 3px 5px rgba(0,0,0,0.2) !important;
825 -webkit-border-radius: 2px !important;
826 text-shadow: none !important;
827 padding: 5px;
828 height: auto;
829 box-sizing: border-box;
830 display: none;
831 width: 70%;
832 border-radius: 2px;
833 margin: 0 0 0 auto;
834 top: 40px;
835 right: 10px;
836 }
837
838 .pagelayer-elp-search-icon{
839 margin-bottom: 5px !important;
840 padding: 2px 6px;
841 line-height: 20px !important;
842 border-radius: 3px !important;
843 }
844
845 .pagelayer-elp-icon-list{
846 width: 100%;
847 -moz-box-sizing: border-box;
848 -webkit-box-sizing: border-box;
849 box-sizing: border-box;
850 padding: 0;
851 max-height: 183px;
852 overflow-y: auto;
853 }
854
855 .pagelayer-elp-icon-span{
856 display: block;
857 margin: 2px;
858 cursor: pointer;
859 box-sizing: border-box;
860 border: 1px solid #dbdbdb;
861 transition: all 0.3s;
862 font-size: 13px;
863 padding: 3px;
864 }
865
866 .pagelayer-elp-icon-span:hover{
867 border-color: #00A0D2;
868 background-color: #3e8ef7;
869 color: #ffffff;
870 box-shadow: 0px 1px 1px #3e8ef7bf;
871 }
872
873 .pagelayer-elp-icon-span i{
874 font-size: 15px;
875 line-height: 1em;
876 padding: 3px;
877 color: #555;
878 transition: all 0.3s;
879 vertical-align: middle;
880 }
881
882 .pagelayer-elp-icon-span:hover i{
883 color: #ffffff;
884 }
885
886
887 .pagelayer-video{
888 width: 100% !important;
889 /* background: #ccc; */
890 position: relative;
891 /* top: -40px;
892 float: right;
893 border-radius: 0px 4px 4px 0px; */
894 }
895
896 .pagelayer-video i{
897 top: 10px;
898 position: relative;
899 left: 8px;
900 }
901
902 .pagelayer-elp-slider-div{
903 display: flex;
904 padding: 7px 0 0;
905 }
906
907 input.pagelayer-elp-slider{
908 -webkit-appearance: none;
909 width: 75%;
910 height: 10px;
911 border-radius: 5px;
912 background: #d3d3d3 !important;
913 outline: none;
914 opacity: 0.7;
915 -webkit-transition: .2s;
916 transition: opacity .2s;
917 font-size: 0px !important;
918 padding: 0;
919 }
920
921 .pagelayer-elp-slider:focus{
922 border-color: transparent;
923 box-shadow: 0 0 1px transparent;
924 }
925
926 .pagelayer-elp-slider:hover{
927 opacity: 1;
928 }
929
930 .pagelayer-elp-slider::-webkit-slider-thumb{
931 -webkit-appearance: none;
932 appearance: none;
933 width: 15px;
934 height: 15px;
935 border-radius: 50%;
936 background: #4CAF50;
937 cursor: pointer;
938 }
939
940 .pagelayer-elp-slider::-moz-range-thumb{
941 width: 15px;
942 height: 15px;
943 border-radius: 50%;
944 background: #00A0D2;
945 cursor: pointer;
946 }
947
948 .pagelayer-elp-slider-value{
949 width: 23% !important;
950 margin-left: 2%;
951 margin-top: -10px;
952 border-radius: 4px;
953 }
954
955 .pagelayer-elp-datetime-div{
956 position: relative;
957 }
958
959 .pagelayer-elp-fa-calendar{
960 position: absolute;
961 height: 40px;
962 width: 40px;
963 background: #000;
964 right: 0;
965 top: 0;
966 }
967
968 .pagelayer-elp-checkbox-div{
969 top: 13px;
970 right:7px;
971 position: absolute;
972 }
973
974 input[type="checkbox"].pagelayer-elp-checkbox{
975 font-size: 30px;
976 -webkit-appearance: none;
977 -moz-appearance: none;
978 appearance: none;
979 width: 3.5em;
980 height: 1.7em;
981 background: #ddd;
982 border-radius: 3em;
983 position: relative;
984 cursor: pointer;
985 outline: none;
986 -webkit-transition: all .2s ease-in-out;
987 transition: all .2s ease-in-out;
988 }
989
990 input[type="checkbox"].pagelayer-elp-checkbox:checked{
991 background-color: #3e8ef7;
992 }
993
994 input[type="checkbox"].pagelayer-elp-checkbox:after{
995 position: absolute;
996 content: "";
997 width: 1.5em;
998 height: 1.5em;
999 border-radius: 50%;
1000 background: #fff;
1001 -webkit-box-shadow: 0 0 .25em rgba(0,0,0,.3);
1002 box-shadow: 0 0 .25em rgba(0,0,0,.3);
1003 -webkit-transform: scale(.7);
1004 transform: scale(.7);
1005 left: 0;
1006 -webkit-transition: all .2s ease-in-out;
1007 transition: all .2s ease-in-out;
1008 }
1009
1010 input[type="checkbox"].pagelayer-elp-checkbox:checked:after{
1011 left: calc(100% - 1.5em);
1012 }
1013
1014 .pagelayer-elp-input-icon,
1015 .pagelayer-elp-pos-rel{
1016 position: relative;
1017 }
1018
1019 .pagelayer-elp-input-icon input{
1020 width: 83%;
1021 }
1022
1023 .pagelayer-elp-input-icon i.fa {
1024 padding: 6px 10px;
1025 position: relative;
1026 top: 2px;
1027 border: 1px solid #d1d1d1;
1028 border-left:0px;
1029 cursor: pointer;
1030 background:#FFF;
1031 }
1032
1033 .pagelayer-elp-padding-div i.fa{
1034 padding:6px 11px;
1035 border: 1px solid #d1d1d1;
1036 border-left:0px;
1037 cursor: pointer;
1038 background: #FFF;
1039 vertical-align:top;
1040 }
1041
1042 .pagelayer-elp-padding-linked{
1043 background: #CCC !important;
1044 }
1045
1046 .pagelayer-elp-dimension-div i.fa{
1047 padding:6px 11px;
1048 border: 1px solid #d1d1d1;
1049 border-left:0px;
1050 cursor: pointer;
1051 background: #FFF;
1052 vertical-align:top;
1053 }
1054
1055 .pagelayer-elp-dimension-linked{
1056 background: #CCC !important;
1057 }
1058
1059 /* Pagelayer Multi Select Property */
1060 .pagelayer-elp-multiselect{
1061 min-height: 25px;
1062 width:96%;
1063 }
1064
1065 .pagelayer-elp-multiselect-ul{
1066 list-style:none;
1067 padding:0;
1068 margin:0;
1069 display:none;
1070 border: 1px solid #CCC;
1071 border-radius: 0 0 5px 5px;
1072 border-top:none;
1073 position:absolute;
1074 background:rgb(255, 255, 255);
1075 z-index:1;
1076 width:100%;
1077 }
1078
1079 .pagelayer-elp-multiselect-option{
1080 font-size:13px;
1081 padding:3px 8px;
1082 cursor:pointer;
1083 }
1084
1085 .pagelayer-elp-multiselect-option[selected="selected"]{
1086 background: #cccccc;
1087 }
1088
1089 .pagelayer-elp-multiselect-selected{
1090 padding: 3px 5px;
1091 border-radius: 5px;
1092 margin: 2px;
1093 background: #cccccc;
1094 line-height: 13px;
1095 font-size: 13px;
1096 }
1097
1098 .pagelayer-elp-multiselect{
1099 display: flex;
1100 flex-wrap: wrap;
1101 padding: 5px;
1102 }
1103
1104 /* Pagelayer Multi Select Property end*/
1105
1106 .pagelayer-elp-multi_image{
1107 padding: 3px;
1108 width: 60%;
1109 margin: 5px auto;
1110 border: 1px solid #d5dadf;
1111 position: relative;
1112 text-align: center;
1113 background: #4CBCDF;
1114 color: #fff;
1115 font-size: 13px;
1116 cursor: pointer;
1117 }
1118
1119 .pagelayer-elp-multi_image{
1120 height: 100%;
1121 -webkit-background-size: cover;
1122 background-size: cover;
1123 background-position: 50%;
1124 }
1125
1126 .pagelayer-elp-multi_image-thumbs{
1127 margin-top:10px;
1128 }
1129
1130 .pagelayer-elp-multi_image-thumb{
1131 display: inline-block;
1132 width: 44px;
1133 height: 44px;
1134 background-size: cover;
1135 background-position: 50% 50%;
1136 margin: 0 7px 0 0;
1137 border: 2px solid #d5dadf;
1138 }
1139
1140 .pagelayer-grid-columns-1 .pagelayer-grid-item{
1141 width: 100%;
1142 }
1143
1144 .pagelayer-grid-columns-2 .pagelayer-grid-item{
1145 width: 50%;
1146 }
1147
1148 .pagelayer-grid-columns-3 .pagelayer-grid-item{
1149 width: 33%;
1150 }
1151
1152 .pagelayer-grid-columns-4 .pagelayer-grid-item{
1153 width: 25%;
1154 }
1155
1156 .pagelayer-grid-columns-5 .pagelayer-grid-item{
1157 width: 20%;
1158 }
1159
1160 .pagelayer-grid-columns-6 .pagelayer-grid-item{
1161 width: 16%;
1162 }
1163
1164 .pagelayer-grid-columns-7 .pagelayer-grid-item{
1165 width: 14%;
1166 }
1167
1168 .pagelayer-grid-columns-8 .pagelayer-grid-item{
1169 width: 12%;
1170 }
1171
1172 .pagelayer-grid-columns-9 .pagelayer-grid-item{
1173 width: 11%;
1174 }
1175
1176 .pagelayer-grid-columns-10 .pagelayer-grid-item{
1177 width: 10%;
1178 }
1179
1180 .pagelayer-grid-item{
1181 float: left;
1182 }
1183
1184 .pagelayer-elp-audio-div,
1185 .pagelayer-elp-media-div{
1186 position: relative;
1187 }
1188
1189 .pagelayer-elp-audio,
1190 .pagelayer-elp-media{
1191 width: calc(100% - 40px);
1192 }
1193
1194 .pagelayer-elp-audio-insert,
1195 .pagelayer-elp-media-select{
1196 position: absolute;
1197 top: 0;
1198 right: 0;
1199 background-color: #000;
1200 height: 100%;
1201 width: 40px;
1202 -webkit-box-sizing: content-box;
1203 -moz-box-sizing: content-box;
1204 box-sizing: content-box;
1205 }
1206
1207 .pagelayer-elp-select-div .fa{
1208 position: absolute;
1209 right: 12px;
1210 top: 0;
1211 line-height: 40px;
1212 }
1213
1214 .pagelayer-elp-shadow-div,
1215 .pagelayer-elp-typo-div,
1216 .pagelayer-elp-filter-div{
1217 padding: 10px 10px 0px;
1218 box-shadow: 0px 0px 2px rgba(0,0,0,.2);
1219 position: relative;
1220 margin-top: 8px;
1221 border: 1px solid #ddd;
1222 display: none;
1223 position: absolute;
1224 background-color: #fff;
1225 width: 86%;
1226 z-index: 2;
1227 }
1228
1229 .pagelayer-prop-edit{
1230 padding: 7px;
1231 border: 1px solid #ccc;
1232 width: 44px;
1233 position: absolute;
1234 top: 7px;
1235 right: 8px;
1236 text-align: center;
1237 cursor: pointer;
1238 border-radius: 3px;
1239 }
1240
1241 .pagelayer-prop-edit i{
1242 font-size: 20px;
1243 }
1244
1245 .pagelayer-prop-show{
1246 display: block;
1247 }
1248
1249 .pagelayer-elp-shadow-color{
1250 position: relative;
1251 height: 35px;
1252 }
1253
1254 .pagelayer-elp-shadow-color .pagelayer-elp-color-div{
1255 top:0;
1256 }
1257
1258 .pagelayer-elp-typo:not(:first-child),
1259 .pagelayer-elp-prop-grp{
1260 margin: 3px 0;
1261 padding: 5px 0;
1262 }
1263
1264 .pagelayer-elp-gradient-div .pagelayer-elp-prop-grp{
1265 padding: 5px 0;
1266 }
1267
1268 .pagelayer-elp-prop-grp{
1269 position: relative;
1270 }
1271
1272 .pagelayer-elp-prop-grp .pagelayer-elp-color-div{
1273 top: -3px;
1274 right: 0;
1275 }
1276
1277 .pagelayer-elp-typo .pagelayer-elp-label,
1278 .pagelayer-elp-typo .pagelayer-elp-typo-input,
1279 .pagelayer-elp-shadow-div .pagelayer-elp-shadow-input,
1280 .pagelayer-elp-shadow-div .pagelayer-elp-label,
1281 .pagelayer-elp-prop-grp>label, .pagelayer-elp-prop-grp>input{
1282 width: 50%;
1283 }
1284
1285 .pagelayer-elp-filter-div .pagelayer-elp-label{
1286 width:40%;
1287 text-transform: capitalize;
1288 }
1289
1290 .pagelayer-elp-filter-div .pagelayer-elp-filter-val{
1291 float:right;
1292 width:10%;
1293 font-size:13px;
1294 text-align: right;
1295 }
1296
1297 .pagelayer-elp-typo .pagelayer-elp-label{
1298 font-weight: 600;
1299 font-size: 11px;
1300 color: #555;
1301 }
1302
1303 .pagelayer-elp-typo select.pagelayer-elp-typo-input,
1304 .pagelayer-elp-typo-input,
1305 .pagelayer-elp-shadow-input{
1306 padding: 3px;
1307 border-radius: 4px !important;
1308 line-height: 18px !important;
1309 }
1310
1311 .pagelayer-elp-grad-color{
1312 position:relative;
1313 }
1314
1315 /* Left side menu Input related */
1316 .pagelayer-elp-text,
1317 .pagelayer-elp-spinner,
1318 .pagelayer-elp-tinymce-textarea,
1319 .pagelayer-elp-tinymce {
1320 border-radius: 2px !important;
1321 }
1322
1323 .pagelayer-elp-select-div,
1324 .pagelayer-elp-spinner-div{
1325 width: 140px;
1326 right: 10px;
1327 position: absolute;
1328 top: 7px;
1329 }
1330
1331 .pagelayer-elp-spinner-div{
1332 width:85px;
1333 }
1334
1335 .pagelayer-elp-spinner{
1336 padding: 2px 0 2px 6px;
1337 border-radius: 4px !important;
1338 }
1339
1340 .pagelayer-elp-select-div .pagelayer-elp-select {
1341 border-radius: 4px;
1342 padding: 6px;
1343 }
1344
1345 .pagelayer-elpd-body input:focus,
1346 .pagelayer-elpd-body textarea:focus,
1347 .pagelayer-elpd-body select:focus {
1348 border-color: #3e8ef7;
1349 box-shadow: unset;
1350 }
1351
1352 .pagelayer-elp-group-item{
1353 border: 1px solid #777;
1354 font-size: 13px;
1355 margin-bottom: 10px;
1356 }
1357
1358 .pagelayer-elp-group-item .pagelayer-form-item{
1359 padding: 10px 0px 10px 0px;
1360 }
1361
1362 .pagelayer-elp-group-item .pagelayer-elp-select-div,
1363 .pagelayer-elp-group-item .pagelayer-elp-spinner-div,
1364 .pagelayer-elp-group-item .pagelayer-elp-color-div{
1365 right:0px;
1366 }
1367
1368 .pagelayer-elp-group-item-head{
1369 display:flex;
1370 background: #F8F8F8;
1371 }
1372
1373 .pagelayer-elp-group-item-head span{
1374 cursor: pointer;
1375 padding: 9px;
1376 display:inline-block;
1377 }
1378
1379 .pagelayer-elp-group-item-title{
1380 flex-grow: 100;
1381 }
1382
1383 .pagelayer-elp-group-item-del{
1384 float: right;
1385 }
1386
1387 .pagelayer-elp-group-item-body{
1388 display: none;
1389 padding: 7px 10px;
1390 }
1391
1392 .pagelayer-elp-group-item-clone{
1393 padding-right:0px !important;
1394 }
1395
1396 .pagelayer-elp-padding{
1397 width:21% !important;
1398 }
1399
1400 .pagelayer-elp-dimension{
1401 width:42% !important;
1402 }
1403
1404 /* END Element Properties Dialog classes */
1405
1406 /* Widget Parameters */
1407
1408 .pagelayer-widgets-form input,
1409 .pagelayer-widgets-form select,
1410 .pagelayer-widgets-form textarea {
1411 border: 1px solid #ddd;
1412 box-shadow: inset 0 1px 2px rgba(0,0,0,.07);
1413 background-color: #fff;
1414 color: #32373c;
1415 outline: 0;
1416 transition: 50ms border-color ease-in-out;
1417 font-size: 15px !important;
1418 line-height: 150% !important;
1419 }
1420
1421 .pagelayer-widgets-form select{
1422 padding:5px;
1423 }
1424
1425 .pagelayer-widgets-form input[type="checkbox"]{
1426 width: auto;
1427 }
1428
1429 .pagelayer-widgets-form{
1430 line-height:150%;
1431 border-top: none;
1432 padding: 8px;
1433 }
1434
1435 /* End Widget Parameters */
1436
1437 .trumbowyg-box{
1438 margin-top:0px !important;
1439 }
1440
1441 .trumbowyg-editor{
1442 min-height: 250px !important;
1443 padding: 10px !important;
1444 }
1445
1446 /* Pagelayer Left bar */
1447
1448 .pagelayer-topbar-holder{
1449 background-color: #3e8ef7;
1450 position:relative;
1451 }
1452
1453 .pagelayer-logo{
1454 font-size:20px;
1455 font-weight: bold;
1456 display: block;
1457 text-align:center;
1458 vertical-align:middle;
1459 color:#fff;
1460 }
1461
1462 .pagelayer-logo-text{
1463 font-weight: bold;
1464 margin-left: 5px;
1465 line-height: normal;
1466 vertical-align: super;
1467 }
1468
1469 .pagelayer-settings-icon{
1470 float:right;
1471 padding-right:10px;
1472 cursor: pointer;
1473 position: absolute;
1474 right: 5px;
1475 top: 50%;
1476 transform: translateY(-50%);
1477 }
1478
1479 .pagelayer-leftbar{
1480 width:270px !important;
1481 padding-top:0;
1482 background-color: #E3E3E3;
1483 overflow: hidden;
1484 background: -moz-linear-gradient(224deg, rgba(222,222,222,1) 0%, rgba(191,202,214,1) 100%); /* ff3.6+ */
1485 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 */
1486 background: -webkit-linear-gradient(224deg, rgba(222,222,222,1) 0%, rgba(191,202,214,1) 100%); /* safari5.1+,chrome10+ */
1487 background: -o-linear-gradient(224deg, rgba(222,222,222,1) 0%, rgba(191,202,214,1) 100%); /* opera 11.10+ */
1488 background: -ms-linear-gradient(224deg, rgba(222,222,222,1) 0%, rgba(191,202,214,1) 100%); /* ie10+ */
1489 background: linear-gradient(226deg, rgba(222,222,222,1) 0%, rgba(191,202,214,1) 100%); /* w3c */
1490 filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#BFCAD6', endColorstr='#DEDEDE',GradientType=1 ); /* ie6-9 */
1491 }
1492
1493 .pagelayer-leftbar-search{
1494 text-align:center;
1495 margin: 20px 40px 10px 25px;
1496 position:relative;
1497 }
1498
1499 .pagelayer-search-field{
1500 width:100%;
1501 line-height:120%;
1502 padding: 5px 5px 5px 30px;
1503 border-radius: 5px;
1504 border: none;
1505 font-size: 14px;
1506 height:30px;
1507 }
1508
1509 .pagelayer-leftbar-search .fa{
1510 position: absolute;
1511 top: 0;
1512 height: 30px;
1513 padding: 0 7px;
1514 color: #666;
1515 line-height: 30px;
1516 }
1517
1518 .pagelayer-shortcodes{
1519 margin-left:17px;
1520 }
1521
1522 .pagelayer-leftbar-group{
1523 width: 100%;
1524 background-repeat: no-repeat;
1525 background-position: center;
1526 font-size: 11px !important;
1527 color: #442E2E;
1528 clear: both;
1529 text-align: center;
1530 font-family: "Open Sans",arial,sans-serif !important;
1531 margin-bottom: 2px;
1532 }
1533
1534 .pagelayer-leftbar-group h5{
1535 font-size: 11px;
1536 line-height: 20px;
1537 text-transform: uppercase;
1538 color: #777;
1539 padding: 5px 0 3px;
1540 margin: 5px;
1541 }
1542
1543 .pagelayer-shortcode-drag, .pagelayer-shortcode-drag:hover{
1544 width: 100px !important;
1545 height:67px !important;
1546 margin-bottom:12px;
1547 margin-left:12px;
1548 background-color:#FFFFFF;
1549 border-radius: 4px;
1550 float: left;
1551 transition: all 0.1s;
1552 }
1553
1554 .pagelayer-shortcode-drag:hover{
1555 transform: scale(1.06);
1556 }
1557
1558 .pagelayer-sc{
1559 padding: 4px !important;
1560 margin: 4px auto 0 auto !important;
1561 cursor: move;
1562 }
1563
1564 .pagelayer-shortcode,.pagelayer-shortcode:before{
1565 display:inline-block;
1566 width:22px;
1567 height:22px;
1568 font-size:22px;
1569 line-height:1;
1570 font-family:pagelayer,fontawesome;
1571 text-decoration:inherit;
1572 font-weight:400;
1573 font-style:normal;
1574 vertical-align:top;
1575 text-align:center;
1576 -webkit-transition:color .1s ease-in 0;
1577 transition:color .1s ease-in 0;
1578 -webkit-font-smoothing:antialiased;
1579 -moz-osx-font-smoothing:grayscale;
1580 color: #444;
1581 transition: all 0.3s;
1582 }
1583
1584 .pagelayer-shortcode-inner{
1585 height: 25px;
1586 padding: 0px !important;
1587 }
1588
1589 .pagelayer-shortcode-text{
1590 display: block;
1591 font-family: "Open Sans", Arial,Helvetica,sans-serif;
1592 font-size: 11px !important;
1593 font-style: normal;
1594 line-height: 125%;
1595 margin: 0;
1596 overflow: hidden;
1597 cursor: move;
1598 text-overflow: ellipsis;
1599 text-align: center;
1600 width: 100%;
1601 margin-top: 3px;
1602 color: #777;
1603 transition: all 0.3s;
1604 padding:1px;
1605 }
1606
1607 .pagelayer-shortcode-drag:hover .pagelayer-shortcode:before,
1608 .pagelayer-shortcode-drag:hover .pagelayer-shortcode-text{
1609 color: #00A0D2;
1610 }
1611
1612 /* Pagelayer Editor Icons */
1613 @font-face{font-family:pagelayer;src:url(../fonts/pagelayer.eot)}
1614 @font-face{font-family:pagelayer;src:url(../fonts/pagelayer.woff) format('woff'),url(../fonts/pagelayer.ttf) format("truetype"),url(../fonts/pagelayer.svg#pagelayer) format("svg");font-weight:400;font-style:normal}
1615
1616 .pagelayer-pl_row:before{content:"\f0c9"} /* e916 */
1617 .pagelayer-pl_inner_row:before{content:"\f022"}
1618 .pagelayer-pl_col:before{content:"\f0db"}
1619 .pagelayer-pl_heading:before,.pagelayer-pl_post_title:before{content:"\e90f";font-size:18px;}
1620 .pagelayer-pl_text:before{content:"\f036"}
1621 .pagelayer-pl_code:before{content:"\f044"}
1622 .pagelayer-pl_quote:before{content:"\e906"}
1623 .pagelayer-pl_list:before{content:"\e908";font-size:20px;}
1624 .pagelayer-pl_icon:before{content:"\f006"}
1625 .pagelayer-pl_image:before{content:"\f03e"}
1626 .pagelayer-pl_image_slider:before{content:"\e939";margin-left:-5px;}
1627 .pagelayer-pl_grid_gallery:before{content:"\f00a"}
1628 .pagelayer-pl_image_hotspot:before{content:"\e91c"}
1629 .pagelayer-pl_btn:before{content:"\e90b"}
1630 .pagelayer-pl_btn_grp:before{content:"\f24d"}
1631 .pagelayer-pl_download:before{content:"\e909"}
1632 .pagelayer-pl_social:before{content:"\e938"}
1633 .pagelayer-pl_share:before{content:"\e952"}
1634 .pagelayer-pl_video:before{content:"\f03d"}
1635 .pagelayer-pl_audio:before{content:"\f028"}
1636 .pagelayer-pl_video_lightbox:before{content:"\e910"}
1637 .pagelayer-pl_video_slider:before{content:"\e944"}
1638 .pagelayer-pl_service:before{content:"\e937"}
1639 .pagelayer-pl_tabs:before{content:"\e93c"}
1640 .pagelayer-pl_accordion:before{content:"\e946"}
1641 .pagelayer-pl_table:before{content:"\f0ce"}
1642 .pagelayer-pl_call:before{content:"\e916"}
1643 .pagelayer-pl_modal:before{content:"\e90e"}
1644 .pagelayer-pl_splash:before{content:"\e90c"}
1645 .pagelayer-pl_space:before{content:"\e93a"}
1646 .pagelayer-pl_embed:before{content:"\f121"}
1647 .pagelayer-pl_chart:before{content:"\e94d"}
1648 .pagelayer-pl_google_maps:before{content:"\e924"}
1649 .pagelayer-pl_countdown:before{content:"\e941"}
1650 .pagelayer-pl_pricing:before{content:"\e933"}
1651 .pagelayer-pl_contact:before{content:"\f298"}
1652 .pagelayer-pl_search:before{content:"\f002"}
1653 .pagelayer-pl_testimonial:before{content:"\e906"}
1654 .pagelayer-pl_alert:before{content:"\f06a"}
1655 .pagelayer-pl_anchor:before{content:"\f13d"}
1656 .pagelayer-pl_progress:before{content:"\f0ae"}
1657 .pagelayer-pl_social_grp:before{content:"\f029"}
1658 .pagelayer-pl_share_grp:before{content:"\e952"}
1659 .pagelayer-pl_counter:before{content:"\f162"}
1660 .pagelayer-pl_shortcodes:before{content:"\f141"}
1661 .pagelayer-pl_divider:before{content:"\f2d1"}
1662 .pagelayer-pl_stars:before{content:"\f123"}
1663 .pagelayer-pl_block:before{content:"\f0c8"}
1664 .pagelayer-pl_collapse:before{content:"\f233"}
1665 .pagelayer-pl_iconbox:before{content:"\e912"}
1666 .pagelayer-pl_tooltip:before{content:"\f27a"} /*f18d*/
1667 .pagelayer-pl_post_comment:before{content:"\f0e6"}
1668 .pagelayer-pl_post_info:before{content:"\f05a"}
1669 .pagelayer-pl_post_nav:before{content:"\f0ec"}
1670 .pagelayer-pl_badge:before{content:"\f2c1"}
1671 .pagelayer-pl_wp_widgets:before{content:"\e945"}
1672 .pagelayer-pl_wp_custom_menu:before{content:"\e92a"}
1673 .pagelayer-pl_wp_posts_grid:before{content:"\e92f"}
1674 .pagelayer-pl_wp_posts_slider:before{content:"\e951"}
1675 .pagelayer-pl_wp_comments:before{content:"\e970"}
1676 .pagelayer-pl_wp_pages:before{content:"\e92e"}
1677 .pagelayer-pl_wp_posts:before{content:"\e912"}
1678 .pagelayer-pl_wp_calendar:before{content:"\f073"}
1679 .pagelayer-pl_wp_categories:before{content:"\e949"}
1680 .pagelayer-pl_wp_archives:before{content:"\f271"}
1681 .pagelayer-pl_wp_tags:before{content:"\e913"}
1682 .pagelayer-pl_wp_title:before{content:"\e90f";font-size:18px;}
1683 .pagelayer-pl_wp_menu:before{content:"\e900";font-size:28px; margin:-3px;}
1684 .pagelayer-pl_arrow_down:before{content:"\e900";font-size:28px; margin:-3px;}
1685 .pagelayer-pl_posts:before{content:"\e92e";font-size:28px; margin:-3px;}
1686 .pagelayer-shortcode[class*="pagelayer-pl_wp_"]:before{content:"\f19a"}
1687
1688 /* Trumbowyg color widget style */
1689 .trumbowyg-dropdown-foreColor,
1690 .trumbowyg-dropdown-backColor {
1691 width: 100% !important;
1692 max-width: 250px !important;
1693 padding: 7px 5px;
1694 left:0 !important;
1695 }
1696
1697 .trumbowyg-dropdown-foreColor svg,
1698 .trumbowyg-dropdown-backColor svg {
1699 display: none !important;
1700 }
1701
1702 .trumbowyg-dropdown-foreColor button[type="button"],
1703 .trumbowyg-dropdown-backColor button[type="button"] {
1704 display: block;
1705 position: relative;
1706 float: left;
1707 text-indent: -9999px;
1708 height: 20px;
1709 width: 20px;
1710 max-height:27px;
1711 max-width:27px;
1712 border: 1px solid #333;
1713 padding: 0;
1714 margin: 2px;
1715 }
1716
1717 .trumbowyg-dropdown-foreColor button[type="button"]:hover::after,
1718 .trumbowyg-dropdown-backColor button[type="button"]:hover::after,
1719 .trumbowyg-dropdown-foreColor button[type="button"]:focus::after,
1720 .trumbowyg-dropdown-backColor button[type="button"]:focus::after{
1721 content: " ";
1722 display: block;
1723 position: absolute;
1724 top: -5px;
1725 left: -5px;
1726 height: 27px;
1727 width: 27px;
1728 max-width:27px;
1729 background: inherit;
1730 border: 1px solid #FFF;
1731 box-shadow: #000 0 0 2px;
1732 z-index: 10;
1733 }
1734
1735 /* Trumbowyg color widget style end */
1736
1737 /* Pagelayer history style*/
1738
1739 .pagelayer-revision-holder,
1740 .pagelayer-history-holder{
1741 border: 1px solid #b7b5b5fa;
1742 margin-bottom: 10px;
1743 padding: 10px;
1744 display: -webkit-box;
1745 display: -webkit-flex;
1746 display: -ms-flexbox;
1747 display: flex;
1748 -webkit-box-align: center;
1749 -webkit-align-items: center;
1750 -ms-flex-align: center;
1751 align-items: center;
1752 font-size: 12px;
1753 color:#505050;
1754 }
1755
1756 .pagelayer-leftbar-tab,
1757 .pagelayer-history,
1758 .pagelayer-history-hidden{
1759 display:none;
1760 }
1761
1762 .pagelayer-revision-holder:hover,
1763 .pagelayer-history-holder:hover,
1764 .pagelayer-history-holder.current_active_item{
1765 background-color:#efefef;
1766 }
1767
1768 .pagelayer-revision-img-holder{
1769 border-radius: 50%;
1770 overflow: hidden;
1771 margin-right:10px;
1772 }
1773
1774 .pagelayer-revision-detail-holder,
1775 .pagelayer-history-detail-holder{
1776 flex:1;
1777 }
1778
1779 .pagelayer-revision-holder .pagelayer-revision-delete,
1780 .pagelayer-history-holder .pagelayer-history-check{
1781 display:none;
1782 }
1783
1784 .pagelayer-revision-holder:hover .pagelayer-revision-delete,
1785 .pagelayer-history-holder.current_active_item .pagelayer-history-check{
1786 display:block;
1787 }
1788
1789 .pagelayer-revision-delete:hover{
1790 cursor:pointer;
1791 }
1792
1793 .pagelayer-revision-img-holder img{
1794 max-width: 100%;
1795 width: 20px;
1796 height: 20px;
1797 }
1798
1799 .pagelayer-history-holder span{
1800 margin-right:5px;
1801 }
1802
1803 /* Pagelayer history end*/
1804
1805 /* Pagelayer settings*/
1806
1807 .pagelayer-post-settings-holder{
1808 border:1px solid #d3d3d3;
1809 font-size: 14px;
1810 line-height: 150%;
1811 }
1812
1813 .pagelayer-post-settings-acc{
1814 background-color:#fff;
1815 }
1816
1817 .pagelayer-post-settings-apply{
1818 font-size: 14px;
1819 font-weight: bold;
1820 cursor: pointer;
1821 border-radius: 2px;
1822 padding: 4px 8px;
1823 margin: auto 5px;
1824 }
1825
1826 .pagelayer-post-settings-apply[disabled]{
1827 opacity:0.5;
1828 }
1829
1830 .pagelayer-post-settings-acc{
1831 margin-top:7px;
1832 }
1833
1834 .pagelayer-post-settings-fields{
1835 padding:10px;
1836 display:none;
1837 }
1838
1839 .pagelayer-post-settings-lable{
1840 border:1px solid #d3d3d3;
1841 padding:10px;
1842 cursor:pointer;
1843 }
1844
1845 .pagelayer-toggle{
1846 float:right;
1847 }
1848
1849 .pagelayer-toggle:not(.pagelayer-open):before{
1850 content: "\f0da";
1851 }
1852
1853 .pagelayer-toggle.pagelayer-open:before{
1854 content: "\f0d7";
1855 }
1856
1857 .pagelayer-post-settings-fields label{
1858 display:block;
1859 margin:7px 0;
1860 }
1861
1862 /* Pagelayer settings end*/
1863