oficina / sheets Public

Clone
git clone https://amadan.net/oficina/sheets

Plain git — no account needed to clone.

Download

Download this file

1:root {
2 --jbutton-color: #298BA8;
3 --jactive-color: #007aff;
4 --jsafe-area-top: env(safe-area-inset-top);
5 --jsafe-area-bottom: env(safe-area-inset-bottom);
6}
7
8[data-visible="false"], .row[data-visible="false"] {
9 display: none;
10}
11
12
13div[data-before]:before {
14 content: attr(data-before);
15}
16
17.unselectable {
18 -webkit-touch-callout: none;
19 -webkit-user-select: none;
20 -khtml-user-select: none;
21 -moz-user-select: none;
22 -ms-user-select: none;
23 user-select: none;
24}
25
26.jreadonly {
27 pointer-events: none;
28}
29
30.jdragging {
31 opacity:0.2;
32 filter: alpha(opacity=20);
33}
34
35.jupload.input {
36 position: relative;
37 box-sizing: border-box;
38 background-size: initial;
39 height: 33px;
40 min-height: initial;
41 padding: 6px;
42 padding-right: 30px;
43}
44
45.jupload.input:before {
46 content: "save";
47 font-size: 18px;
48 font-family: "Material Icons";
49 color: #000;
50 position: absolute;
51 right: 5px;
52}
53
54.jupload:empty:before {
55 z-index: 0;
56}
57
58.jupload img {
59 width: 100%;
60}
61
62.jupload.input img {
63 width: initial;
64 max-width: 100%;
65 height: 100%;
66}
67
68.jupload[data-multiple] {
69 padding: 10px;
70}
71
72.jupload[data-multiple] img {
73 height: 70px;
74 width: 100px;
75 object-fit: cover;
76 margin-right: 5px;
77 margin-bottom: 5px;
78}
79
80.jupload {
81 position: relative;
82 border: 1px dotted #eee;
83 cursor: pointer;
84 box-sizing: border-box;
85 width: 100%;
86 max-width: 100%;
87 max-height: 100%;
88 min-height: 180px;
89}
90
91.jupload:not(.input):empty:before {
92 content: "\e2c3";
93 font-family: "Material Icons";
94 font-size: 90px;
95 color: #eee;
96 width: 100%;
97 height: 100%;
98 display: flex;
99 align-items: center;
100 justify-content: center;
101 position: absolute;
102}
103
104.jupload-item {
105 padding-right: 22px;
106 border-radius: 1px;
107 display: inline-block;
108 position: relative;
109}
110
111.jphoto {
112 position: relative;
113 border: 1px dotted #eee;
114 cursor: pointer;
115 box-sizing: border-box;
116 width: 100%;
117 display: flex;
118 align-items: center;
119 justify-content: center;
120}
121
122.jphoto:empty:before {
123 content: "\e2c3";
124 font-family: "Material Icons";
125 font-size: 90px;
126 color: #eee;
127 width: 100%;
128 height: 100%;
129 text-align: center;
130}
131
132.jremove {
133 opacity: 0.2;
134 filter: alpha(opacity=20);
135}
136
137.round img {
138 border-radius: 1000px;
139}
140
141.jtooltip {
142 position: fixed;
143 top: 10px;
144 left: 10px;
145 z-index: 5;
146
147 font-family: initial;
148 font-size: 12px;
149 color: #000;
150 background-color: #fff;
151 border: 1px solid black;
152 padding: 8px;
153 margin: 10px;
154
155 display: block;
156 animation: jfadeIn 0.5s;
157 pointer-events: none;
158}
159
160.jtooltip:empty {
161 display: none;
162}
163
164@keyframes jfadeIn {
165 0% {
166 opacity: 0;
167 }
168 100% {
169 opacity: 1;
170 }
171}
172
173.jpanel {
174 position: absolute;
175 box-sizing: border-box;
176 z-index: 10;
177}
178
179.jpanel:focus {
180 outline: 2px solid black;
181 outline-offset: -1px;
182 z-index: 1000 !important;
183}
184
185.jpanel-action {
186 position: absolute;
187 width: 8px;
188 height: 8px;
189 background-color: white;
190 border:1px solid black;
191 box-sizing: border-box;
192 pointer-events: auto;
193 z-index: 1000;
194}
195
196.jpanel-action[data-position="n-resize"] {
197 top: -4px;
198 left: calc(50% - 4px);
199}
200
201.jpanel-action[data-position="ne-resize"] {
202 top: -4px;
203 left: calc(100% - 4px);
204}
205
206.jpanel-action[data-position="e-resize"] {
207 top: calc(50% - 4px);
208 left: calc(100% - 4px);
209}
210
211.jpanel-action[data-position="se-resize"] {
212 top: calc(100% - 4px);
213 left: calc(100% - 4px);
214}
215
216.jpanel-action[data-position="s-resize"] {
217 top: calc(100% - 4px);
218 left: calc(50% - 4px);
219}
220
221.jpanel-action[data-position="sw-resize"] {
222 top: calc(100% - 4px);
223 left: -4px;
224}
225
226.jpanel-action[data-position="w-resize"] {
227 top: calc(50% - 4px);
228 left: -4px;
229}
230
231.jpanel-action[data-position="nw-resize"] {
232 top: -4px;
233 left: -4px;
234}
235
236.jpanel-action[data-position="nw-resize"] {
237 top: -4px;
238 left: -4px;
239}
240
241.jpanel-action[data-action="rotate"] {
242 top: -50px;
243 left: calc(50% - 12px);
244 width: 24px;
245 height: 24px;
246 border: 0;
247 cursor: move;
248 background-color: transparent;
249}
250
251.jpanel-action[data-action="rotate"]:before {
252 content: 'refresh';
253 font-family: 'Material Icons';
254 font-size: 24px;
255}
256
257.jpanel-action[data-action="rotate"]:after {
258 position: absolute;
259 content: '';
260 bottom: -22px;
261 left: calc(50%);
262 width: 1px;
263 height: 28px;
264 background-color: black;
265}
266
267/** Loading */
268.jloading {
269 position:fixed;
270 z-index:10001;
271 width:100%;
272 left:0;
273 right:0;
274 top:0;
275 bottom:0;
276 background-color: rgba(0,0,0,0.7);
277}
278
279.jloading::after {
280 content:'';
281 display:block;
282 margin:0 auto;
283 margin-top:50vh;
284 width:40px;
285 height:40px;
286 border-style:solid;
287 border-color:white;
288 border-top-color:transparent;
289 border-width:4px;
290 border-radius:50%;
291 -webkit-animation: jspin .8s linear infinite;
292 animation: jspin .8s linear infinite;
293}
294
295.jloading.jspin {
296 background-color:transparent;
297}
298
299.jloading.jspin::after {
300 margin:0 auto;
301 margin-top:80px;
302 border-color:#aaa;
303 border-top-color:transparent;
304}
305
306/** Animations **/
307.jfade-in {
308 animation: jfade-in 2s forwards;
309}
310
311.jfade-out {
312 animation: jfade-out 1s forwards;
313}
314
315.jslide-left-in {
316 position: relative;
317 animation: jslide-left-in 0.4s forwards;
318}
319
320.jslide-left-out {
321 position: relative;
322 animation: jslide-left-out 0.4s forwards;
323}
324
325.jslide-right-in {
326 position: relative;
327 animation: jslide-right-in 0.4s forwards;
328}
329
330.jslide-right-out {
331 position: relative;
332 animation: jslide-right-out 0.4s forwards;
333}
334
335.jslide-top-in {
336 position: relative;
337 animation: jslide-top-in 0.4s forwards;
338}
339
340.jslide-top-out {
341 position: relative;
342 animation: jslide-top-out 0.2s forwards;
343}
344
345.jslide-bottom-in {
346 position: relative;
347 animation: jslide-bottom-in 0.4s forwards;
348}
349
350.jslide-bottom-out {
351 position: relative;
352 animation: jslide-bottom-out 0.1s forwards;
353}
354
355.jslide-left-in > div {
356 -webkit-transform: translateZ(0px);
357 -webkit-transform: translate3d(0,0,0);
358}
359
360.jslide-left-out > div {
361 -webkit-transform: translateZ(0px);
362 -webkit-transform: translate3d(0,0,0);
363}
364
365.jslide-right-in > div {
366 -webkit-transform: translateZ(0px);
367 -webkit-transform: translate3d(0,0,0);
368}
369
370.jslide-right-out > div {
371 -webkit-transform: translateZ(0px);
372 -webkit-transform: translate3d(0,0,0);
373}
374
375.jspin {
376 animation: jspin 2s infinite linear;
377}
378
379/** Fadein and Fadeout **/
380@keyframes jfade-in {
381 0% { opacity: 0; }
382 100% { opacity: 100; }
383}
384
385@-webkit-keyframes jfade-in {
386 0% { opacity: 0; }
387 100% { opacity: 100; }
388}
389
390@keyframes jfade-out {
391 0% { opacity: 100; }
392 100% { opacity: 0; }
393}
394
395@-webkit-keyframes jfade-out {
396 0% { opacity: 100; }
397 100% { opacity: 0; }
398}
399
400/** Keyframes Left to Right **/
401@keyframes jslide-left-in {
402 0% { left: -100%; }
403 100% { left: 0%; }
404}
405
406@-webkit-keyframes jslide-left-in {
407 0% { left: -100%; }
408 100% { left: 0%; }
409}
410
411@keyframes jslide-left-out {
412 0% { left: 0%; }
413 100% { left: -100%; }
414}
415
416@-webkit-keyframes jslide-left-out {
417 0% { left: 0%; }
418 100% { left: -100%; }
419}
420
421/** Keyframes Right to Left **/
422@keyframes jslide-right-in {
423 0% { left: 100%; }
424 100% { left: 0%; }
425}
426
427@-webkit-keyframes jslide-right-in
428{
429 0% { left: 100%; }
430 100% { left: 0%; }
431}
432
433@keyframes jslide-right-out {
434 0% { left: 0%; }
435 100% { left: 100%; }
436}
437
438@-webkit-keyframes jslide-right-out {
439 0% { left: 0%; }
440 100% { left: 100%; }
441}
442
443/** Keyframes Top to Bottom **/
444@keyframes jslide-top-in {
445 0% { transform: translateY(-100%); }
446 100% { transform: translateY(0%); }
447}
448
449@-webkit-keyframes jslide-top-in {
450 0% { transform: translateY(-100%); }
451 100% { -webkit-transform: translateY(0%); }
452}
453
454@keyframes jslide-top-out {
455 0% { transform: translateY(0%); }
456 100% { transform: translateY(-100%); }
457}
458
459@-webkit-keyframes jslide-top-out {
460 0% { -webkit-transform: translateY(0%); }
461 100% { -webkit-transform: translateY(-100%); }
462}
463
464/** Keyframes Bottom to Top **/
465@keyframes jslide-bottom-in {
466 0% { transform: translateY(100%); }
467 100% { transform: translateY(0%); }
468}
469
470@-webkit-keyframes jslide-bottom-in {
471 0% { transform: translateY(100%); }
472 100% { -webkit-transform: translateY(0%); }
473}
474
475@keyframes jslide-bottom-out {
476 0% { transform: translateY(0%); }
477 100% { transform: translateY(100%); }
478}
479
480@-webkit-keyframes jslide-bottom-out {
481 0% { -webkit-transform: translateY(0%); }
482 100% { -webkit-transform: translateY(100%); }
483}
484
485@-webkit-keyframes jspin {
486 from {
487 -webkit-transform:rotate(0deg);
488 }
489 to {
490 -webkit-transform:rotate(359deg);
491 }
492}
493
494@keyframes jspin {
495 from {
496 transform:rotate(0deg);
497 }
498 to {
499 transform:rotate(359deg);
500 }
501}
502.jcalendar {
503 position:absolute;
504 z-index:9000;
505 display:none;
506 box-sizing:border-box;
507 -webkit-touch-callout: none;
508 -webkit-user-select: none;
509 -khtml-user-select: none;
510 -moz-user-select: none;
511 -ms-user-select: none;
512 user-select: none;
513 -webkit-tap-highlight-color: rgba(0,0,0,0);
514 -webkit-tap-highlight-color: transparent;
515 min-width:280px;
516}
517
518.jcalendar.jcalendar-focus {
519 display:block;
520}
521
522.jcalendar .jcalendar-backdrop {
523 position:fixed;
524 top:0px;
525 left:0px;
526 z-index:9000;
527 min-width:100%;
528 min-height:100%;
529 background-color:rgba(0,0,0,0.5);
530 border:0px;
531 padding:0px;
532 display:none;
533}
534
535.jcalendar .jcalendar-container {
536 position:relative;
537 box-sizing:border-box;
538}
539
540.jcalendar .jcalendar-content {
541 position:absolute;
542 z-index:9001;
543 -webkit-box-shadow: 1px 1px 5px 0px rgba(0,0,0,0.39);
544 -moz-box-shadow: 1px 1px 5px 0px rgba(0,0,0,0.39);
545 box-shadow: 1px 1px 5px 0px rgba(0,0,0,0.39);
546 background-color:#fff;
547}
548
549.jcalendar-header {
550 text-align:center;
551}
552
553.jcalendar-header span {
554 margin-right:4px;
555 font-size:1.1em;
556 font-weight:bold;
557}
558
559.jcalendar-prev {
560 cursor:pointer;
561 background-image:url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 width=%2724%27 height=%2724%27 viewBox=%270 0 24 24%27%3E%3Cpath d=%27M15.41 16.59L10.83 12l4.58-4.59L14 6l-6 6 6 6 1.41-1.41z%27 fill=%27%23000%27 /%3E%3Cpath fill=%27none%27 d=%27M0 0h24v24H0V0z%27/%3E%3C/svg%3E");
562 background-position:center;
563 background-repeat:no-repeat;
564}
565
566.jcalendar-next {
567 cursor:pointer;
568 background-image:url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 width=%2724%27 height=%2724%27 viewBox=%270 0 24 24%27%3E%3Cpath d=%27M8.59 16.59L13.17 12 8.59 7.41 10 6l6 6-6 6-1.41-1.41z%27 fill=%27%23000%27 /%3E%3Cpath fill=%27none%27 d=%27M0 0h24v24H0V0z%27/%3E%3C/svg%3E");
569 background-position:center;
570 background-repeat:no-repeat;
571}
572
573.jcalendar-weekday {
574 font-weight: 600;
575 background-color: #fcfcfc;
576 padding: 14px;
577}
578
579.jcalendar-table {
580 padding: 10px;
581}
582
583.jcalendar-table > table {
584 width:100%;
585 background-color:#fff;
586}
587
588.jcalendar-table > table > thead {
589 cursor: pointer;
590}
591
592.jcalendar-table thead td {
593 padding: 10px;
594 height: 40px;
595}
596
597.jcalendar-table > table > tbody > tr {
598 height: 34px;
599}
600
601.jcalendar-table > table > tbody td {
602 box-sizing:border-box;
603 cursor:pointer;
604 padding:9px;
605 font-size:0.9em;
606}
607
608.jcalendar-table tfoot td {
609 padding:10px;
610}
611
612.jcalendar-months td, .jcalendar-years td {
613 height:24px;
614}
615
616.jcalendar-input {
617 padding-right:18px;
618 background-image:url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 width=%2716%27 height=%2716%27 viewBox=%270 0 24 24%27 fill=%27gray%27%3E%3Cpath d=%27M20 3h-1V1h-2v2H7V1H5v2H4c-1.1 0-2 .9-2 2v16c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm0 18H4V8h16v13z%27/%3E%3Cpath fill=%27none%27 d=%27M0 0h24v24H0z%27/%3E%3C/svg%3E");
619 background-position:top 50% right 5px;
620 background-repeat:no-repeat;
621 box-sizing: border-box;
622}
623
624.jcalendar-done {
625 -webkit-box-shadow: 1px 1px 5px 0px rgba(0,0,0,0.39);
626 -moz-box-shadow: 1px 1px 5px 0px rgba(0,0,0,0.39);
627 box-shadow: 1px 1px 5px 0px rgba(0,0,0,0.39);
628 background-color:#fff;
629}
630
631.jcalendar-update {
632 border:1px solid #ccc;
633 background-color:#fff;
634 border-radius:4px;
635 padding:5px;
636 width:100%;
637}
638
639.jcalendar-container select {
640 width:55px;
641 display:inline-block;
642 border:0px;
643 padding:4px;
644 text-align:center;
645 font-size:1.1em;
646 user-select:none;
647 margin-right:10px;
648}
649
650.jcalendar-container select:first-child {
651 margin-right:2px;
652}
653
654.jcalendar-selected {
655 background-color:#eee;
656}
657
658.jcalendar-reset, .jcalendar-confirm {
659 text-transform:uppercase;
660 cursor:pointer;
661 color: var(--jactive-color);
662}
663
664.jcalendar-controls {
665 padding:15px;
666
667 -webkit-box-sizing: border-box;
668 box-sizing: border-box;
669 vertical-align:middle;
670
671 display: -webkit-box;
672 display: -moz-box;
673 display: -ms-flexbox;
674 display: -webkit-flex;
675 display: flex;
676
677 -webkit-flex-flow: row wrap;
678 justify-content: space-between;
679 align-items:center;
680}
681
682.jcalendar-controls div {
683 font-weight:bold;
684}
685
686.jcalendar-fullsize {
687 position:fixed;
688 width:100%;
689 top:0px;
690 left:0px;
691}
692
693.jcalendar-fullsize .jcalendar-content
694{
695 position:fixed;
696 width:100%;
697 left:0px;
698 bottom:0px;
699}
700
701.jcalendar-focus.jcalendar-fullsize .jcalendar-backdrop {
702 display:block;
703}
704
705.jcalendar-sunday {
706 color: red;
707}
708.jcalendar-disabled {
709 color: #ccc;
710}
711
712.jcalendar-time {
713 display:flex;
714}
715
716.jcalendar_warning {
717 color: red;
718}
719
720.jcalendar-hide-controls .jcalendar-controls {
721 display: none;
722}
723
724.jcolor {
725 display: none;
726 outline: none;
727 position: absolute;
728}
729
730.jcolor-input {
731 padding-right: 24px !important;
732 background: url("data:image/svg+xml,%0A%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 24 24%27 fill=%27black%27 width=%2718px%27 height=%2718px%27%3E%3Cpath d=%27M0 0h24v24H0z%27 fill=%27none%27/%3E%3Cpath d=%27M12 3c-4.97 0-9 4.03-9 9s4.03 9 9 9c.83 0 1.5-.67 1.5-1.5 0-.39-.15-.74-.39-1.01-.23-.26-.38-.61-.38-.99 0-.83.67-1.5 1.5-1.5H16c2.76 0 5-2.24 5-5 0-4.42-4.03-8-9-8zm-5.5 9c-.83 0-1.5-.67-1.5-1.5S5.67 9 6.5 9 8 9.67 8 10.5 7.33 12 6.5 12zm3-4C8.67 8 8 7.33 8 6.5S8.67 5 9.5 5s1.5.67 1.5 1.5S10.33 8 9.5 8zm5 0c-.83 0-1.5-.67-1.5-1.5S13.67 5 14.5 5s1.5.67 1.5 1.5S15.33 8 14.5 8zm3 4c-.83 0-1.5-.67-1.5-1.5S16.67 9 17.5 9s1.5.67 1.5 1.5-.67 1.5-1.5 1.5z%27/%3E%3C/svg%3E") top 50% right 4px no-repeat, content-box;
733 box-sizing: border-box;
734}
735
736.jcolor-content {
737 position: absolute;
738 z-index: 9000;
739 user-select: none;
740 -webkit-font-smoothing: antialiased;
741 font-size: .875rem;
742 letter-spacing: .2px;
743 -webkit-border-radius: 4px;
744 border-radius: 4px;
745 -webkit-box-shadow: 0 8px 10px 1px rgba(0,0,0,0.14), 0 3px 14px 2px rgba(0,0,0,0.12), 0 5px 5px -3px rgba(0,0,0,0.2);
746 box-shadow: 0 8px 10px 1px rgba(0,0,0,0.14), 0 3px 14px 2px rgba(0,0,0,0.12), 0 5px 5px -3px rgba(0,0,0,0.2);
747 background-color:#fff;
748 box-sizing: border-box;
749 min-width: 260px;
750}
751
752.jmodal .jcolor-content {
753 position: fixed;
754}
755
756.jcolor-controls {
757 display: flex;
758 padding: 10px;
759 border-bottom: 1px solid #eee;
760 margin-bottom: 5px;
761}
762
763.jcolor-controls div {
764 flex: 1;
765 font-size: 1em;
766 color: var(--jactive-color);
767 text-transform: uppercase;
768 font-weight: bold;
769 box-sizing: border-box;
770}
771
772.jcolor-content table {
773 border-collapse: collapse;
774 box-sizing: border-box;
775}
776
777.jcolor-focus {
778 display:block;
779}
780
781.jcolor table {
782 width:100%;
783 height:100%;
784 min-height: 160px;
785}
786
787.jcolor td {
788 padding: 7px;
789}
790
791.jcolor-selected {
792 background-repeat:no-repeat;
793 background-size: 16px;
794 background-position: center;
795 background-image: url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 width=%2724%27 height=%2724%27 viewBox=%270 0 24 24%27%3E%3Cpath d=%27M0 0h24v24H0z%27 fill=%27none%27/%3E%3Cpath d=%27M9 16.17L4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z%27 fill=%27white%27/%3E%3C/svg%3E");
796}
797
798.jcolor-fullscreen {
799 position: fixed;
800 left: 0px;
801 bottom: 0px;
802 width:100%;
803 max-height: 290px;
804 border-radius: 0px;
805 box-sizing: border-box;
806}
807
808.jcolor-fullscreen .jcolor-controls {
809 padding: 15px;
810 -webkit-box-shadow: 1px 0px 1px 0px rgba(0,0,0,0.39);
811 -moz-box-shadow: 1px 0px 1px 0px rgba(0,0,0,0.39);
812 box-shadow: 1px 0px 1px 0px rgba(0,0,0,0.39);
813}
814
815.jcolor-reset {
816 text-align: left;
817}
818
819.jcolor-close {
820 text-align: right;
821}
822
823.jcolor-backdrop {
824 position: fixed;
825 top: 0px;
826 left: 0px;
827 min-width: 100%;
828 min-height: 100%;
829 background-color: rgba(0,0,0,0.5);
830 border: 0px;
831 padding: 0px;
832 z-index: 8000;
833 display: none;
834
835 -webkit-touch-callout: none; /* iOS Safari */
836 -webkit-user-select: none; /* Safari */
837 -khtml-user-select: none; /* Konqueror HTML */
838 -moz-user-select: none; /* Firefox */
839 -ms-user-select: none; /* Internet Explorer/Edge */
840 user-select: none; /* Non-prefixed version, currently
841 supported by Chrome and Opera */
842}
843
844.jcolor-content .jtabs-content {
845 padding: 7px;
846}
847
848.jcolor-grid tr:first-child > td:first-child {
849 border-top-left-radius: 3px;
850}
851
852.jcolor-grid tr:first-child > td:last-child {
853 border-top-right-radius: 3px;
854}
855
856.jcolor-grid tr:last-child > td:first-child {
857 border-bottom-left-radius: 3px;
858}
859
860.jcolor-grid tr:last-child > td:last-child {
861 border-bottom-right-radius: 3px;
862}
863
864.jcolor-hsl {
865 box-sizing: border-box;
866}
867
868.jcolor-hsl > div {
869 height: 100%;
870 position: relative;
871}
872
873.jcolor-hsl canvas {
874 display: block;
875 border-radius: 4px;
876 -webkit-user-drag: none;
877}
878
879.jcolor-point {
880 height: 5px;
881 width: 5px;
882 background-color: #000;
883 position: absolute;
884 top: 50%;
885 left: 50%;
886 transform: translate(-50%, -50%);
887 border-radius: 50%;
888}
889
890.jcolor-sliders {
891 padding: 10px 20px 10px 10px;
892}
893
894.jcolor-sliders input {
895 -webkit-appearance: none;
896
897 height: 12px;
898 width: 80%;
899
900 background: #d3d3d3;
901 opacity: 1;
902
903 border-radius: 30px;
904 outline: none;
905}
906
907.jcolor-sliders-input-subcontainer {
908 display: flex;
909 justify-content: space-between;
910 align-items: center;
911}
912
913.jcolor-sliders-input-container {
914 margin-top: 4px;
915 line-height: 0.8em;
916 text-align: left;
917}
918
919.jcolor-sliders-input-container > label {
920 font-size: 10px;
921 text-transform: uppercase;
922 color: #bbbbbd;
923}
924
925.jcolor-sliders-input-subcontainer > input {
926 border: 0px;
927 padding: 1px;
928}
929
930.jcolor-sliders-input-container input::-webkit-slider-thumb {
931 -webkit-appearance: none;
932 height: 12px;
933 width: 12px;
934 border-radius: 50%;
935 background: #000;
936 border: 2px solid #fff;
937 cursor: pointer;
938}
939
940.jcolor-sliders-input-container input::-moz-range-thumb {
941 -webkit-appearance: none;
942 height: 12px;
943 width: 12px;
944 border-radius: 50%;
945 background: #000;
946 border: 2px solid #fff;
947 cursor: pointer;
948}
949
950.jcolor-sliders-final-color {
951 padding: 6px;
952 user-select: all;
953 margin-top: 10px;
954 text-align: center;
955}
956
957.jcolor-sliders-final-color > div:nth-child(2) {
958 width: 71px;
959 text-transform: uppercase;
960}
961
962.jcolor .jtabs .jtabs-headers-container .jtabs-controls {
963 display: none !important;
964}
965
966.jcolor .jtabs .jtabs-headers-container {
967 display: flex !important;
968 justify-content: center;
969 padding: 4px;
970}
971
972.jcolor .jtabs-headers > div:not(.jtabs-border) {
973 padding: 2px !important;
974 padding-left: 15px !important;
975 padding-right: 15px !important;
976 font-size: 0.8em;
977}
978.jcontextmenu {
979 position:fixed;
980 z-index:10000;
981 background:#fff;
982 color: #555;
983 font-size: 11px;
984 -webkit-user-select: none;
985 -moz-user-select: none;
986 user-select: none;
987 -webkit-box-shadow: 2px 2px 2px 0px rgba(143, 144, 145, 1);
988 -moz-box-shadow: 2px 2px 2px 0px rgba(143, 144, 145, 1);
989 box-shadow: 2px 2px 2px 0px rgba(143, 144, 145, 1);
990 border: 1px solid #C6C6C6;
991 padding: 0px;
992 padding-top:4px;
993 padding-bottom:4px;
994 margin:0px;
995 outline:none;
996 display:none;
997}
998
999.jcontextmenu.jcontextmenu-focus {
1000 display:inline-block;
1001}
1002
1003.jcontextmenu > div {
1004 box-sizing: border-box;
1005 display: flex;
1006 padding: 8px 8px 8px 32px;
1007 width: 250px;
1008 position: relative;
1009 cursor: default;
1010 font-size: 11px;
1011 font-family:sans-serif;
1012 text-align: left;
1013 -webkit-box-align: center;
1014 align-items: center;
1015}
1016
1017.jcontextmenu > div::before {
1018 content: attr(data-icon);
1019 font-family: 'Material Icons' !important;
1020 font-size: 15px;
1021 position: absolute;
1022 left: 9px;
1023 line-height: 24px;
1024}
1025
1026.jcontextmenu.symbols > div::before {
1027 font-family: 'Material Symbols Outlined' !important;
1028}
1029
1030.jcontextmenu > div.header {
1031 display: none;
1032}
1033
1034.jcontextmenu > div a {
1035 color: #555;
1036 text-decoration: none;
1037 flex: 1;
1038 cursor: pointer;
1039}
1040
1041.jcontextmenu > div span {
1042 margin-right: 10px;
1043 font-size: 0.9em;
1044}
1045
1046.jcontextmenu .jcontextmenu-disabled a {
1047 color: #ccc;
1048}
1049
1050.jcontextmenu .jcontextmenu-disabled::before {
1051 color: #ccc;
1052}
1053
1054.jcontextmenu > div:hover {
1055 background: #ebebeb;
1056}
1057
1058.jcontextmenu hr {
1059 border: 1px solid #e9e9e9;
1060 border-bottom: 0;
1061 margin-top:5px;
1062 margin-bottom:5px;
1063}
1064
1065.jcontextmenu > hr:hover {
1066 background: transparent;
1067}
1068
1069.jcontextmenu .jcontextmenu {
1070 top: 4px;
1071 left: 99%;
1072 opacity: 0;
1073 position: absolute;
1074}
1075
1076.jcontextmenu > div:hover > .jcontextmenu {
1077 display: block;
1078 opacity: 1;
1079 -webkit-transform: translate(0, 0) scale(1);
1080 transform: translate(0, 0) scale(1);
1081 pointer-events: auto;
1082}
1083
1084@media only screen and (max-width: 420px) {
1085 .jcontextmenu {
1086 top: initial !important;
1087 left: 0px !important;
1088 bottom: 0px !important;
1089 width: 100vw;
1090 height: 260px;
1091 overflow: scroll;
1092 animation: jslide-bottom-in 0.4s forwards;
1093 padding-top: 0px;
1094 }
1095 .jcontextmenu div {
1096 width: 100%;
1097 text-align: center;
1098 border-bottom: 1px solid #ccc;
1099 padding: 15px;
1100 }
1101 .jcontextmenu > div.header {
1102 background-color: lightgray;
1103 padding: 5px;
1104 top: 0px;
1105 position: sticky;
1106 z-index: 2;
1107 }
1108 .jcontextmenu > div.header > a.title {
1109 text-align: left;
1110 }
1111
1112 .jcontextmenu > div.header > a.close {
1113 text-align: right;
1114 }
1115 .jcontextmenu a {
1116 font-size: 1.4em;
1117 text-transform: uppercase;
1118 }
1119 .jcontextmenu span {
1120 display: none;
1121 }
1122 .jcontextmenu span {
1123 display: none;
1124 }
1125 .jcontextmenu hr {
1126 display: none;
1127 }
1128}
1129
1130.jdropdown {
1131 cursor:pointer;
1132 -webkit-touch-callout: none;
1133 -webkit-user-select: none;
1134 -khtml-user-select: none;
1135 -moz-user-select: none;
1136 -ms-user-select: none;
1137 user-select: none;
1138 box-sizing: border-box;
1139 background:#fff;
1140 -webkit-tap-highlight-color: transparent;
1141 display: inline-block;
1142}
1143
1144.jdropdown-backdrop {
1145 position:fixed;
1146 top:0px;
1147 left:0px;
1148 min-width:100%;
1149 min-height:100%;
1150 background-color:rgba(0,0,0,0.5);
1151 border:0px;
1152 padding:0px;
1153 z-index:8000;
1154 display:none;
1155}
1156
1157.jdropdown[disabled] {
1158 opacity: 0.5;
1159 pointer-events: none;
1160}
1161
1162.jdropdown-focus {
1163 position:relative;
1164}
1165
1166.jdropdown-focus .jdropdown-container {
1167 transform: translate3d(0,0,0);
1168}
1169
1170.jdropdown-default.jdropdown-focus .jdropdown-header {
1171 outline:auto 5px -webkit-focus-ring-color;
1172}
1173
1174.jdropdown-default.jdropdown-focus .jdropdown-header.jdropdown-add {
1175 background-image: url("data:image/svg+xml,%0A%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 24 24%27 fill=%27gray%27 width=%2724px%27 height=%2724px%27%3E%3Cpath d=%27M0 0h24v24H0z%27 fill=%27none%27/%3E%3Cpath d=%27M19 3H5c-1.11 0-2 .9-2 2v14c0 1.1.89 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm-2 10h-4v4h-2v-4H7v-2h4V7h2v4h4v2z%27/%3E%3C/svg%3E");
1176}
1177
1178.jdropdown-container-header {
1179 padding:0px;
1180 margin:0px;
1181 position:relative;
1182 box-sizing: border-box;
1183}
1184
1185.jdropdown-header {
1186 width:100%;
1187 appearance: none;
1188 background-repeat: no-repeat;
1189 background-position:top 50% right 5px;
1190 background-image: url("data:image/svg+xml,%0A%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 width=%2724%27 height=%2724%27 viewBox=%270 0 24 24%27%3E%3Cpath fill=%27none%27 d=%27M0 0h24v24H0V0z%27/%3E%3Cpath d=%27M7 10l5 5 5-5H7z%27 fill=%27gray%27/%3E%3C/svg%3E");
1191 text-overflow: ellipsis;
1192 cursor:pointer;
1193 box-sizing: border-box;
1194 -webkit-appearance: none;
1195 -moz-appearance: none;
1196 padding-right:30px !important;
1197}
1198
1199.jdropdown-insert-button {
1200 font-size: 1.4em;
1201 text-transform: uppercase;
1202 position:absolute;
1203 right: 30px;
1204 top: 4px;
1205 display:none;
1206}
1207
1208.jdropdown-container {
1209 min-width: inherit;
1210 transform: translate3d(-10000px,0,0);
1211 position:absolute;
1212 z-index:9001;
1213}
1214
1215.jdropdown-close {
1216 display:none;
1217 font-size:1em;
1218 color: var(--jactive-color);
1219 text-transform:uppercase;
1220 text-align:right;
1221 padding:12px;
1222 font-weight:bold;
1223}
1224
1225.jdropdown-content {
1226 min-width:inherit;
1227 margin:0px;
1228 box-sizing:border-box;
1229}
1230
1231.jdropdown-content:empty {
1232}
1233
1234.jdropdown-item {
1235 white-space: nowrap;
1236 text-align: left;
1237 text-overflow: ellipsis;
1238 overflow-x: hidden;
1239 color: #000;
1240 display: flex;
1241 align-items: center;
1242}
1243
1244.jdropdown-description {
1245 text-overflow: ellipsis;
1246 overflow: hidden;
1247 line-height: 1.5em;
1248}
1249
1250.jdropdown-image {
1251 margin-right:10px;
1252 width: 32px;
1253 height: 32px;
1254 border-radius:20px;
1255}
1256
1257.jdropdown-image-small {
1258 width:24px;
1259 height:24px;
1260}
1261
1262.jdropdown-icon {
1263 margin-right:10px;
1264 font-size: 30px;
1265 margin-left: -5px;
1266}
1267
1268.jdropdown-icon-small {
1269 font-size: 24px;
1270 margin-left: 0px;
1271}
1272
1273.jdropdown-title {
1274 font-size: 0.7em;
1275 text-overflow: ellipsis;
1276 overflow-x: hidden;
1277 display: block;
1278}
1279
1280/** Default visual **/
1281
1282.jdropdown-default .jdropdown-header {
1283 border:1px solid #ccc;
1284 padding:5px;
1285 padding-left:10px;
1286 padding-right:16px;
1287}
1288
1289.jdropdown-default .jdropdown-container {
1290 background-color:#fff;
1291}
1292
1293.jdropdown-default.jdropdown-focus.jdropdown-insert .jdropdown-header {
1294 padding-right:50px;
1295}
1296
1297.jdropdown-default.jdropdown-focus.jdropdown-insert .jdropdown-insert-button {
1298 display:block;
1299}
1300
1301.jdropdown-default .jdropdown-content
1302{
1303 min-width:inherit;
1304 border:1px solid #8fb1e3;
1305 margin:0px;
1306 background-color:#fff;
1307 box-sizing:border-box;
1308 min-height:10px;
1309 max-height:215px;
1310 overflow-y:auto;
1311}
1312
1313.jdropdown-default .jdropdown-item
1314{
1315 padding:4px;
1316 padding-left:8px;
1317 padding-right:40px;
1318}
1319
1320.jdropdown-default .jdropdown-item:hover
1321{
1322 background-color:#1f93ff;
1323 color:#fff;
1324}
1325
1326.jdropdown-default .jdropdown-cursor
1327{
1328 background-color:#eee;
1329}
1330
1331.jdropdown-default .jdropdown-selected
1332{
1333 background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij48cGF0aCBkPSJNMCAwaDI0djI0SDB6IiBmaWxsPSJub25lIiAvPjxwYXRoIGQ9Ik05IDE2LjE3TDQuODMgMTJsLTEuNDIgMS40MUw5IDE5IDIxIDdsLTEuNDEtMS40MXoiIGZpbGw9IndoaXRlIiAvPjwvc3ZnPgo=);
1334 background-repeat:no-repeat;
1335 background-position:top 50% right 5px;
1336 background-color:#1f93ff;
1337 color:#fff;
1338}
1339
1340.jdropdown-default .jdropdown-group {
1341 margin-top:5px;
1342}
1343
1344.jdropdown-default .jdropdown-group .jdropdown-item {
1345 padding-left:16px;
1346}
1347
1348.jdropdown-default .jdropdown-group-name {
1349 padding-left: 8px;
1350 font-weight: bold;
1351 text-align: left;
1352}
1353
1354.jdropdown-default .jdropdown-reset_ {
1355 content:'x';
1356 position:absolute;
1357 top:0;
1358 right:0;
1359 margin:5px;
1360 margin-right:10px;
1361 font-size:12px;
1362 width:12px;
1363 cursor:pointer;
1364 text-shadow: 0px 0px 5px #fff;
1365 display:none;
1366 line-height: 1.8em;
1367}
1368
1369.jdropdown-default.jdropdown-focus .jdropdown-reset_ {
1370 display:block;
1371}
1372
1373/** Default render for mobile **/
1374
1375.jdropdown-picker.jdropdown-focus .jdropdown-backdrop {
1376 display:block;
1377}
1378
1379.jdropdown-picker .jdropdown-header {
1380 outline: none;
1381}
1382
1383.jdropdown-picker .jdropdown-container
1384{
1385 position:fixed;
1386 bottom:0px;
1387 left:0px;
1388 border-bottom:1px solid #e6e6e8;
1389 width:100%;
1390 background-color:#fff;
1391 box-sizing: border-box;
1392}
1393
1394.jdropdown-picker .jdropdown-close
1395{
1396 -webkit-box-shadow: 0px -1px 5px 0px rgba(0,0,0,0.39);
1397 -moz-box-shadow: 0px -1px 5px 0px rgba(0,0,0,0.39);
1398 box-shadow: 0px -1px 5px 0px rgba(0,0,0,0.39);
1399 background-color:#fff;
1400 display:block;
1401}
1402
1403.jdropdown-picker .jdropdown-content
1404{
1405 overflow-y:scroll;
1406 height:280px;
1407 background-color:#fafafa;
1408 border-top:1px solid #e6e6e8;
1409}
1410
1411.jdropdown-picker .jdropdown-group-name
1412{
1413 font-size: 1em;
1414 text-transform: uppercase;
1415 padding-top:10px;
1416 padding-bottom:10px;
1417 display: block;
1418 border-bottom: 1px solid #e6e6e8;
1419 padding-left:20px;
1420 padding-right:20px;
1421 text-align:center;
1422 font-weight:bold;
1423}
1424
1425.jdropdown-picker .jdropdown-item
1426{
1427 font-size: 1em;
1428 text-transform: uppercase;
1429 padding-top:10px;
1430 padding-bottom:10px;
1431 border-bottom: 1px solid #e6e6e8;
1432 padding-left:20px;
1433 padding-right:20px;
1434}
1435
1436.jdropdown-picker .jdropdown-selected
1437{
1438 background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij48cGF0aCBkPSJNMCAwaDI0djI0SDB6IiBmaWxsPSJub25lIiAvPjxwYXRoIGQ9Ik05IDE2LjE3TDQuODMgMTJsLTEuNDIgMS40MUw5IDE5IDIxIDdsLTEuNDEtMS40MXoiIGZpbGw9IndoaXRlIiAvPjwvc3ZnPgo=);
1439 background-repeat:no-repeat;
1440 background-position:top 50% right 15px;
1441 background-color:#1f93ff;
1442 color:#fff;
1443}
1444
1445.jdropdown-picker .jdropdown-cursor
1446{
1447 background-color:#1f93ff;
1448 color:#fff;
1449}
1450
1451/** Default render for mobile searchbar **/
1452
1453.jdropdown-searchbar.jdropdown-focus
1454{
1455 position:fixed;
1456 top:0px !important;
1457 left:0px !important;
1458 width:100% !important;
1459 height:100% !important;
1460 background-color:#fafafa;
1461 padding:0px;
1462 z-index:9001;
1463 overflow-y:scroll;
1464 will-change: scroll-position;
1465 -webkit-overflow-scrolling: touch;
1466}
1467
1468.jdropdown-searchbar.jdropdown-focus .jdropdown-container-header
1469{
1470 position: fixed;
1471 top: 0px;
1472 left: 0px;
1473 z-index: 9002;
1474 padding: 6px;
1475 background-color:#fff;
1476 box-shadow: 0 1px 2px rgba(0,0,0,.1);
1477 width: 100%;
1478 height: 40px;
1479}
1480
1481.jdropdown-searchbar.jdropdown-focus .jdropdown-header
1482{
1483 border: 0px !important;
1484 background-position-x: 0% !important;
1485 background-position-y: 40% !important;
1486 background-repeat: no-repeat;
1487 background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij48cGF0aCBkPSJNMTUuNSAxNGgtLjc5bC0uMjgtLjI3QzE1LjQxIDEyLjU5IDE2IDExLjExIDE2IDkuNSAxNiA1LjkxIDEzLjA5IDMgOS41IDNTMyA1LjkxIDMgOS41IDUuOTEgMTYgOS41IDE2YzEuNjEgMCAzLjA5LS41OSA0LjIzLTEuNTdsLjI3LjI4di43OWw1IDQuOTlMMjAuNDkgMTlsLTQuOTktNXptLTYgMEM3LjAxIDE0IDUgMTEuOTkgNSA5LjVTNy4wMSA1IDkuNSA1IDE0IDcuMDEgMTQgOS41IDExLjk5IDE0IDkuNSAxNHoiIGZpbGw9IiNlNmU2ZTgiLz48cGF0aCBkPSJNMCAwaDI0djI0SDB6IiBmaWxsPSJub25lIi8+PC9zdmc+);
1488 padding-left: 30px !important;
1489 padding-right: 60px !important;
1490}
1491
1492.jdropdown-searchbar.jdropdown-focus .jdropdown-close
1493{
1494 display:block;
1495}
1496
1497.jdropdown-searchbar .jdropdown-header {
1498 outline: none;
1499}
1500
1501.jdropdown-searchbar .jdropdown-container
1502{
1503 margin-top: 40px;
1504 width:100%;
1505}
1506
1507.jdropdown-searchbar .jdropdown-close
1508{
1509 position:fixed;
1510 top:0px;
1511 right:0px;
1512}
1513
1514.jdropdown-searchbar .jdropdown-content
1515{
1516 margin-top:10px;
1517}
1518
1519.jdropdown-searchbar .jdropdown-group
1520{
1521 margin-top:10px;
1522 margin-bottom:15px;
1523 background-color:#fff;
1524}
1525
1526.jdropdown-searchbar .jdropdown-group-name
1527{
1528 border-top: 1px solid #e6e6e8;
1529 border-bottom: 1px solid #e6e6e8;
1530 padding:10px;
1531 padding-left:12px;
1532 font-weight:bold;
1533}
1534
1535.jdropdown-searchbar .jdropdown-group-arrow
1536{
1537 float:right;
1538 width:24px;
1539 height:24px;
1540 background-repeat:no-repeat;
1541}
1542
1543.jdropdown-searchbar .jdropdown-group-arrow-down
1544{
1545 background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij48cGF0aCBkPSJNNy40MSA4LjU5TDEyIDEzLjE3bDQuNTktNC41OEwxOCAxMGwtNiA2LTYtNiAxLjQxLTEuNDF6Ii8+PHBhdGggZmlsbD0ibm9uZSIgZD0iTTAgMGgyNHYyNEgwVjB6Ii8+PC9zdmc+);
1546}
1547
1548.jdropdown-searchbar .jdropdown-group-arrow-up
1549{
1550 background-image: url(data:image/svg+xml;base64,CjxzdmcgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCI+PHBhdGggZD0iTTcuNDEgMTUuNDFMMTIgMTAuODNsNC41OSA0LjU4TDE4IDE0bC02LTYtNiA2eiIvPjxwYXRoIGQ9Ik0wIDBoMjR2MjRIMHoiIGZpbGw9Im5vbmUiLz48L3N2Zz4=);
1551}
1552
1553.jdropdown-searchbar .jdropdown-item
1554{
1555 padding-top:10px;
1556 padding-bottom:10px;
1557 border-bottom: 1px solid #e6e6e8;
1558 padding-left:15px;
1559 padding-right:40px;
1560 background-color:#fff;
1561 font-size:0.9em;
1562}
1563
1564.jdropdown-searchbar .jdropdown-description {
1565 text-overflow: ellipsis;
1566 overflow: hidden;
1567 max-width: calc(100% - 20px);
1568}
1569
1570.jdropdown-searchbar .jdropdown-content > .jdropdown-item:first-child
1571{
1572 border-top: 1px solid #e6e6e8;
1573}
1574
1575.jdropdown-searchbar .jdropdown-selected
1576{
1577 background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij48cGF0aCBkPSJNMCAwaDI0djI0SDB6IiBmaWxsPSJub25lIi8+PHBhdGggZD0iTTkgMTYuMTdMNC44MyAxMmwtMS40MiAxLjQxTDkgMTkgMjEgN2wtMS40MS0xLjQxeiIgZmlsbD0iIzAwN2FmZiIvPjwvc3ZnPg==);
1578 background-repeat:no-repeat;
1579 background-position:top 50% right 15px;
1580}
1581
1582/** List render **/
1583
1584.jdropdown-list
1585{
1586}
1587
1588.jdropdown-list .jdropdown-container
1589{
1590 display:block;
1591}
1592
1593.jdropdown-list .jdropdown-header
1594{
1595 display:none;
1596}
1597
1598.jdropdown-list .jdropdown-group
1599{
1600 background-color:#fff;
1601}
1602
1603.jdropdown-list .jdropdown-group-name
1604{
1605 border-bottom: 1px solid #e6e6e8;
1606 padding-top:10px;
1607 padding-bottom:10px;
1608 font-weight:bold;
1609}
1610
1611.jdropdown-list .jdropdown-item
1612{
1613 padding-top:10px;
1614 padding-bottom:10px;
1615 border-bottom: 1px solid #e6e6e8;
1616 padding-left:10px;
1617 padding-right:40px;
1618 background-color:#fff;
1619}
1620
1621.jdropdown-list .jdropdown-selected
1622{
1623 background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij48cGF0aCBkPSJNMCAwaDI0djI0SDB6IiBmaWxsPSJub25lIi8+PHBhdGggZD0iTTkgMTYuMTdMNC44MyAxMmwtMS40MiAxLjQxTDkgMTkgMjEgN2wtMS40MS0xLjQxeiIgZmlsbD0iIzAwN2FmZiIvPjwvc3ZnPg==);
1624 background-repeat:no-repeat;
1625 background-position:top 50% right 10px;
1626}
1627
1628@media only screen and (max-width : 800px)
1629{
1630 .jdropdown-list {
1631 width:100% !important;
1632 border:0px;
1633 padding:0px;
1634 }
1635
1636 .jdropdown-list .jdropdown-container {
1637 min-width:100%;
1638 }
1639
1640 .jdropdown-searchbar.jdropdown-focus .jdropdown-description {
1641 text-transform: uppercase;
1642 }
1643}
1644
1645.app .jdropdown-item {
1646 text-transform:uppercase;
1647}
1648
1649.jdropdown-create-container {
1650 margin: 10px;
1651 border: 1px solid #ccc;
1652 border-radius: 2px;
1653 padding: 6px;
1654}
1655
1656.jdropdown-color {
1657 background-color: #fff;
1658 border: 1px solid transparent;
1659 border-radius: 12px;
1660 width: 12px;
1661 height: 12px;
1662 margin-right: 6px;
1663}
1664
1665.jdropdown-item[data-disabled] {
1666 opacity: 0.5;
1667 pointer-events: none;
1668}
1669.jeditor-container {
1670 border:1px solid #ccc;
1671 box-sizing: border-box;
1672}
1673
1674.jeditor-container.with-margin {
1675 background-color: #f2f2f2;
1676 max-width: 1200px;
1677}
1678
1679.jeditor-dragging {
1680 border:1px dashed #000;
1681}
1682
1683.jeditor {
1684 outline:none;
1685 word-break: break-word;
1686}
1687
1688.jeditor-container.with-margin .jeditor {
1689 background-color: #fff;
1690 margin: 80px;
1691 min-height: 800px;
1692 padding: 80px;
1693 max-width: 800px;
1694}
1695
1696.jeditor[data-placeholder]:empty:before {
1697 content: attr(data-placeholder);
1698 color: lightgray;
1699}
1700
1701/** Snippet **/
1702
1703.jsnippet {
1704 margin-top:15px;
1705 cursor:pointer;
1706 border: 1px solid #ccc;
1707 position:relative;
1708}
1709
1710.jsnippet:focus {
1711 outline: none;
1712}
1713
1714.jsnippet img {
1715 width:100%;
1716}
1717
1718.jsnippet .jsnippet-title {
1719 padding:15px;
1720 font-size:1.4em;
1721}
1722
1723.jsnippet .jsnippet-description {
1724 padding-left:15px;
1725 padding-right:15px;
1726 font-size:1em;
1727}
1728
1729.jsnippet .jsnippet-host {
1730 padding:15px;
1731 text-transform:uppercase;
1732 font-size:0.8em;
1733 color:#777;
1734 text-align:right;
1735}
1736
1737.jsnippet .jsnippet-url {
1738 display:none;
1739}
1740
1741.jeditor .jsnippet:after {
1742 content: 'close';
1743 font-family: 'Material icons';
1744 font-size: 24px;
1745 width: 24px;
1746 height: 24px;
1747 line-height: 24px;
1748 cursor: pointer;
1749 text-shadow: 0px 0px 2px #fff;
1750 position: absolute;
1751 top: 12px;
1752 right: 12px;
1753}
1754
1755.jsnippet * {
1756 -webkit-user-select: none;
1757 -khtml-user-select: none;
1758 -moz-user-select: none;
1759 -o-user-select: none;
1760 user-select: none;
1761
1762 -webkit-user-drag: none;
1763 -khtml-user-drag: none;
1764 -moz-user-drag: none;
1765 -o-user-drag: none;
1766}
1767
1768.jeditor img {
1769 border:2px solid transparent;
1770 box-sizing: border-box;
1771}
1772
1773.jeditor img.resizing {
1774 -webkit-user-select: none;
1775 -khtml-user-select: none;
1776 -moz-user-select: none;
1777 -o-user-select: none;
1778 user-select: none;
1779
1780 -webkit-user-drag: none;
1781 -khtml-user-drag: none;
1782 -moz-user-drag: none;
1783 -o-user-drag: none;
1784}
1785
1786.jeditor img:focus {
1787 border: 2px solid #0096FD;
1788 outline: #0096FD;
1789}
1790
1791.jeditor .pdf {
1792 background-image: url("data:image/svg+xml,%3Csvg version=%271.1%27 id=%27Layer_1%27 xmlns=%27http://www.w3.org/2000/svg%27 xmlns:xlink=%27http://www.w3.org/1999/xlink%27 x=%270px%27 y=%270px%27 viewBox=%270 0 512 512%27 style=%27enable-background:new 0 0 512 512;%27 xml:space=%27preserve%27%3E%3Cpath style=%27fill:%23C30B15;%27 d=%27M511.344,274.266C511.77,268.231,512,262.143,512,256C512,114.615,397.385,0,256,0S0,114.615,0,256 c0,117.769,79.53,216.949,187.809,246.801L511.344,274.266z%27/%3E%3Cpath style=%27fill:%2385080E;%27 d=%27M511.344,274.266L314.991,77.913L119.096,434.087l68.714,68.714C209.522,508.787,232.385,512,256,512 C391.243,512,501.976,407.125,511.344,274.266z%27/%3E%3Cpolygon style=%27fill:%23FFFFFF;%27 points=%27278.328,333.913 255.711,77.913 119.096,77.913 119.096,311.652 %27/%3E%3Cpolygon style=%27fill:%23E8E6E6;%27 points=%27392.904,311.652 392.904,155.826 337.252,133.565 314.991,77.913 255.711,77.913 256.067,333.913 %27/%3E%3Cpolygon style=%27fill:%23FFFFFF;%27 points=%27314.991,155.826 314.991,77.913 392.904,155.826 %27/%3E%3Crect x=%27119.096%27 y=%27311.652%27 style=%27fill:%23FC0F1A;%27 width=%27273.809%27 height=%27122.435%27/%3E%3Cg%3E%3Cpath style=%27fill:%23FFFFFF;%27 d=%27M204.871,346.387c13.547,0,21.341,6.659,21.341,18.465c0,12.412-7.795,19.601-21.341,19.601h-9.611 v14.909h-13.471v-52.975L204.871,346.387L204.871,346.387z M195.26,373.858h8.93c5.904,0,9.308-2.952,9.308-8.552 c0-5.525-3.406-8.324-9.308-8.324h-8.93V373.858z%27/%3E%3Cpath style=%27fill:%23FFFFFF;%27 d=%27M257.928,346.387c16.649,0,28.152,10.746,28.152,26.487c0,15.666-11.655,26.488-28.683,26.488 h-22.25v-52.975H257.928z M248.619,388.615h9.611c8.249,0,14.151-6.357,14.151-15.665c0-9.384-6.205-15.817-14.757-15.817h-9.006 V388.615z%27/%3E%3Cpath style=%27fill:%23FFFFFF;%27 d=%27M308.563,356.982v12.26h23.763v10.596h-23.763v19.525h-13.471v-52.975h39.277v10.595h-25.806 V356.982z%27/%3E%3C/g%3E%3C/svg%3E%0A");
1793 background-repeat: no-repeat;
1794 background-size: cover;
1795 width:60px;
1796 height:60px;
1797}
1798
1799.jeditor-toolbar {
1800 width: fit-content;
1801 max-width: 100%;
1802 box-sizing: border-box;
1803 margin: 10px;
1804}
1805
1806.toolbar-on-top .jeditor-toolbar {
1807 width: initial;
1808 margin: 0px;
1809 box-shadow: 1px 1px 2px rgb(0 0 0 / 10%);
1810 display: block;
1811}
1812
1813.toolbar-on-top .jeditor {
1814 padding: 15px;
1815}
1816
1817.toolbar-on-top .jtoolbar .material-icons {
1818 font-size: 24px;
1819 transform: initial;
1820 margin: 4px;
1821}
1822
1823.toolbar-on-top .jtoolbar .jpicker-header {
1824 font-size: 1em;
1825 margin-top: 4px;
1826 margin-bottom: 4px;
1827}
1828
1829.jeditor table {
1830 border-collapse: collapse;
1831}
1832
1833.jeditor table td {
1834 border: 1px solid #bbb;
1835 height: 2em;
1836}
1837
1838.jeditor table td:focus {
1839 border: 1px solid blue;
1840}
1841
1842.jeditor .line-break {
1843 border-top: 1px dashed #ccc;
1844 display: flex;
1845 justify-content: center;
1846 pointer-events: none;
1847}
1848
1849.jeditor .line-break:before {
1850 content: 'New page';
1851 background-color: #fff;
1852 color: #ccc;
1853 margin: -1em;
1854 padding: 6px;
1855 position: absolute;
1856}
1857.jfloating {
1858 position:fixed;
1859 bottom:0px;
1860 right:0px;
1861 margin-right:5px;
1862
1863 -webkit-box-shadow: 0 2px 10px rgba(0,0,0,.2);
1864 -moz-box-shadow: 0 2px 10px rgba(0,0,0,.2);
1865 border:1px solid #ccc;
1866 background-color:#fff;
1867 box-sizing: border-box;
1868 padding-top:50px !important;
1869 z-index:9002;
1870 border-radius: 8px;
1871}
1872
1873.jfloating.jfloating-big {
1874 width: 510px !important;
1875 height: 472px !important;
1876}
1877
1878.jfloating.jfloating-small {
1879 width: 300px !important;
1880 height: 320px !important;
1881}
1882
1883.jfloating.jfloating-large {
1884 width: 600px !important;
1885 height: 600px !important;
1886}
1887
1888.jfloating:before {
1889 position:absolute;
1890 top:0;
1891 left:0;
1892 width:100%;
1893 content:attr(title);
1894 padding:15px;
1895 box-sizing: border-box;
1896 font-size:1.2em;
1897 box-shadow: 1px 1px 3px rgba(0,0,0,.2);
1898 background-color: #fff;
1899 border-radius: 8px 8px 0px 0px;
1900 background-color: #404040;
1901 font-size: .93rem;
1902 font-weight: 600;
1903 color: white;
1904 letter-spacing: .5px;
1905}
1906
1907.jfloating:after {
1908 content:'';
1909 background-image: url("data:image/svg+xml,%0A%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 width=%2724%27 height=%2724%27 viewBox=%270 0 24 24%27%3E%3Cpath fill=%27%23FFF%27 d=%27M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z%27/%3E%3Cpath d=%27M0 0h24v24H0z%27 fill=%27none%27/%3E%3C/svg%3E");
1910 position:absolute;
1911 top:0;
1912 right:0;
1913 margin:14px;
1914 font-size:24px;
1915 width:24px;
1916 height:24px;
1917 cursor:pointer;
1918 text-shadow: 0px 0px 5px #fff;
1919}
1920
1921.jfloating_content {
1922 padding:20px;
1923 overflow-y:auto;
1924 max-height:100%;
1925 box-sizing: border-box;
1926 height: -webkit-fill-available;
1927}
1928
1929.jfloating.jfloating-minimized {
1930 height: 50px !important;
1931}
1932
1933.jfloating.jfloating-minimized .jfloating_content {
1934 display: none;
1935}
1936
1937.jmodal {
1938 position:fixed;
1939 top:50%;
1940 left:50%;
1941 width:60%;
1942 height:60%;
1943 -webkit-box-shadow: 0 2px 12px rgba(0,0,0,.2);
1944 -moz-box-shadow: 0 2px 12px rgba(0,0,0,.2);
1945 border:1px solid #ccc;
1946 background-color:#fff;
1947 transform: translate(-50%, -50%);
1948 box-sizing: border-box;
1949 z-index:9002;
1950 border-radius: 4px;
1951 display: flex;
1952 flex-direction: column;
1953}
1954
1955.jmodal_title {
1956 padding: 20px;
1957 height: 70px;
1958 box-sizing: border-box;
1959 font-size: 1.4em;
1960 background-color: #fff;
1961 border-radius: 8px 8px 0px 0px;
1962 pointer-events: none;
1963 display: flex;
1964 -webkit-align-items: center;
1965 -webkit-box-align: center;
1966 align-items: center;
1967 border-bottom: 1px solid #eee;
1968}
1969
1970.jmodal_title > div {
1971 font-size: 1.4em;
1972}
1973
1974.jmodal_title[data-icon]:before {
1975 content: attr(data-icon);
1976 font-family: 'Material Icons' !important;
1977 width: 24px;
1978 height: 24px;
1979 font-size: 24px;
1980 margin-right: 10px;
1981 line-height: 24px;
1982}
1983
1984.jmodal_content {
1985 padding: 20px;
1986 overflow-y: auto;
1987 height: 100%;
1988 box-sizing: border-box;
1989 scrollbar-width: thin;
1990 scrollbar-color: #333 transparent;
1991}
1992
1993.jmodal_title:empty {
1994 display: none;
1995}
1996
1997.jmodal_title:empty + .jmodal_content {
1998 height: 100%;
1999}
2000
2001.jmodal_content::-webkit-scrollbar {
2002 height: 12px;
2003}
2004
2005.jmodal_content::-webkit-scrollbar {
2006 width: 12px;
2007}
2008
2009.jmodal_content::-webkit-scrollbar-track {
2010 border: 1px solid #fff;
2011 background: #eee;
2012}
2013
2014.jmodal_content::-webkit-scrollbar-thumb {
2015 border: 1px solid #fff;
2016 background: #888;
2017}
2018
2019.jmodal:after {
2020 content: '';
2021 background-image: url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 width=%2724%27 height=%2724%27 viewBox=%270 0 24 24%27%3E%3Cpath d=%27M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z%27/%3E%3Cpath d=%27M0 0h24v24H0z%27 fill=%27none%27/%3E%3C/svg%3E");
2022 position: absolute;
2023 top: 0;
2024 right: 0;
2025 margin: 25px;
2026 font-size: 24px;
2027 width: 24px;
2028 height: 24px;
2029 cursor: pointer;
2030 text-shadow: 0px 0px 5px #fff;
2031}
2032
2033.jmodal_fullscreen {
2034 width: 100% !important;
2035 height: 100% !important;
2036 top: 0px;
2037 left: 0px;
2038 transform: none;
2039 border: 0px;
2040 border-radius: 0px;
2041}
2042
2043.jmodal_backdrop {
2044 position: fixed;
2045 top: 0px;
2046 left: 0px;
2047 min-width: 100%;
2048 min-height: 100%;
2049 background-color: rgba(0,0,0,0.2);
2050 border: 0px;
2051 padding: 0px;
2052 z-index: 8000;
2053 display: none;
2054
2055 -webkit-touch-callout: none; /* iOS Safari */
2056 -webkit-user-select: none; /* Safari */
2057 -khtml-user-select: none; /* Konqueror HTML */
2058 -moz-user-select: none; /* Firefox */
2059 -ms-user-select: none; /* Internet Explorer/Edge */
2060 user-select: none; /* Non-prefixed version, currently
2061 supported by Chrome and Opera */
2062}
2063
2064.jmodal_content .jcalendar .jcalendar-content,
2065.jmodal_content .jdropdown-container {
2066 position: fixed;
2067}
2068
2069.jnotification {
2070 position: fixed;
2071 z-index: 10000;
2072 -webkit-box-sizing: border-box;
2073 box-sizing: border-box;
2074 padding: 10px;
2075 bottom: 0px;
2076}
2077
2078.jnotification-container {
2079 -webkit-box-shadow: 0px 2px 15px -5px rgba(0, 0, 0, 0.7);
2080 box-shadow: 0px 2px 15px -5px rgba(0, 0, 0, 0.7);
2081 padding: 12px;
2082 border-radius: 8px;
2083
2084 background-color: #000;
2085 background: rgba(92,92,92,1);
2086 background: linear-gradient(0deg, rgba(92,92,92,1) 0%, rgba(77,77,77,1) 100%);
2087 color: #fff;
2088 width: 320px;
2089 margin: 30px;
2090 padding: 20px;
2091}
2092
2093.jnotification-close {
2094 content: '';
2095 background-image: url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 width=%2720%27 height=%2720%27 viewBox=%270 0 24 24%27 fill=%27white%27%3E%3Cpath d=%27M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z%27/%3E%3Cpath d=%27M0 0h24v24H0z%27 fill=%27none%27/%3E%3C/svg%3E");
2096 font-size: 20px;
2097 width: 20px;
2098 height: 20px;
2099 cursor: pointer;
2100}
2101
2102.jnotification-title {
2103 font-weight: bold;
2104}
2105
2106.jnotification-header {
2107 display: flex;
2108 padding-bottom: 5px;
2109}
2110
2111.jnotification-header:empty {
2112 display: none;
2113}
2114
2115.jnotification-image {
2116 margin-right: 5px;
2117}
2118
2119.jnotification-image:empty {
2120 display: none;
2121}
2122
2123.jnotification-image img {
2124 width: 24px;
2125}
2126
2127.jnotification-name {
2128 text-transform: uppercase;
2129 font-size: 0.9em;
2130 flex: 1;
2131 letter-spacing: 0.1em;
2132}
2133
2134.jnotification-error .jnotification-container {
2135 background: rgb(182,38,6);
2136 background: linear-gradient(0deg, rgba(170,41,13,1) 0%, rgba(149,11,11,1) 100%);
2137}
2138
2139@media (max-width: 800px) {
2140 .jnotification {
2141 top: calc(0px + var(--jsafe-area-top));
2142 width: 100%;
2143 }
2144 .jnotification-container {
2145 background: rgba(255,255,255,0.95);
2146 border: 1px solid #eee;
2147 color: #444;
2148 margin: 0px;
2149 width: initial;
2150 }
2151 .jnotification-error .jnotification-container {
2152 background: rgba(255,255,255,0.95);
2153 color: #790909;
2154 }
2155 .jnotification-close {
2156 background-image: url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 width=%2720%27 height=%2720%27 viewBox=%270 0 24 24%27 fill=%27black%27%3E%3Cpath d=%27M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z%27/%3E%3Cpath d=%27M0 0h24v24H0z%27 fill=%27none%27/%3E%3C/svg%3E");
2157 }
2158}
2159
2160.jnotification-header {
2161 display: -webkit-box;
2162 display: -webkit-flex;
2163 display: -ms-flexbox;
2164 display: flex;
2165 -webkit-box-pack: start;
2166 -webkit-justify-content: flex-start;
2167 -ms-flex-pack: start;
2168 justify-content: flex-start;
2169 -webkit-box-align: center;
2170 -webkit-align-items: center;
2171 -ms-flex-align: center;
2172 align-items: center;
2173}
2174.jpicker {
2175 cursor: pointer;
2176 white-space: nowrap;
2177 display: inline-flex;
2178 -webkit-user-select: none;
2179 -moz-user-select: none;
2180 -ms-user-select: none;
2181 user-select: none;
2182 outline: none;
2183 position: relative;
2184 min-height: 26px;
2185}
2186
2187.jpicker-header {
2188 background-repeat: no-repeat;
2189 background-position: top 50% right 5px;
2190 background-image: url("data:image/svg+xml,%0A%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 width=%2724%27 height=%2724%27 viewBox=%270 0 24 24%27%3E%3Cpath fill=%27none%27 d=%27M0 0h24v24H0V0z%27/%3E%3Cpath d=%27M7 10l5 5 5-5H7z%27 fill=%27gray%27/%3E%3C/svg%3E");
2191 text-overflow: ellipsis;
2192 cursor: pointer;
2193 box-sizing: border-box;
2194 text-align: left;
2195 outline: none;
2196 line-height: 24px;
2197 padding: 2px 35px 2px 12px;
2198 border-radius: 4px;
2199}
2200
2201.jpicker-header:hover {
2202 background-color: #f2f2f2;
2203}
2204
2205.jpicker-content {
2206 position: absolute;
2207 top: 0;
2208 display: none;
2209 box-shadow: 0 4px 5px 0 rgba(0,0,0,0.14), 0 1px 10px 0 rgba(0,0,0,0.12), 0 2px 4px -1px rgba(0,0,0,0.2);
2210 border-radius: 4px;
2211 background-color: #fff;
2212 padding: 4px;
2213 z-index: 50;
2214 text-align: left;
2215 max-height: 250px;
2216 scrollbar-width: thin;
2217 scrollbar-color: #333 transparent;
2218}
2219
2220.jpicker-content::-webkit-scrollbar {
2221 width: 8px;
2222}
2223
2224.jpicker-content::-webkit-scrollbar-track {
2225 background: #eee;
2226}
2227
2228.jpicker-content::-webkit-scrollbar-thumb {
2229 background: #888;
2230}
2231
2232.jpicker-content > div {
2233 padding: 6px;
2234 padding-left: 15px;
2235 padding-right: 15px;
2236}
2237
2238.jpicker-focus > .jpicker-content {
2239 display: block;
2240}
2241
2242.jpicker-content > div:hover {
2243 background-color:#efefef;
2244}
2245
2246.jpicker-content > div:empty {
2247 opacity: 0;
2248}
2249
2250.jpicker-header > i, .jpicker-header > div {
2251 display: block;
2252}
2253
2254.jpicker-focus > .jpicker-content.jpicker-columns {
2255 display: flex !important ;
2256 justify-content: center;
2257 flex-wrap: wrap;
2258}
2259
2260.jpicker-focus .jpicker-content.jpicker-grid {
2261 display: inline-grid;
2262}
2263
2264
2265
2266.jprogressbar
2267{
2268 cursor:pointer;
2269 -webkit-touch-callout: none;
2270 -webkit-user-select: none;
2271 -khtml-user-select: none;
2272 -moz-user-select: none;
2273 -ms-user-select: none;
2274 user-select: none;
2275 box-sizing: border-box;
2276 background:#fff;
2277 -webkit-tap-highlight-color: transparent;
2278 display: inline-block;
2279 box-sizing: border-box;
2280 cursor:pointer;
2281 border:1px solid #ccc;
2282 position:relative;
2283}
2284
2285.jprogressbar::before {
2286 content:attr(data-value);
2287 position:absolute;
2288 margin:5px;
2289 margin-left:10px;
2290}
2291
2292.jprogressbar-header::placeholder
2293{
2294 color:#000;
2295}
2296
2297.jprogressbar:focus {
2298 outline: auto 5px -webkit-focus-ring-color;
2299}
2300
2301.jprogressbar > div {
2302 background-color: #eee;
2303 background-color: red;
2304 box-sizing: border-box;
2305 height:31px;
2306}
2307.jrating {
2308 display:flex;
2309}
2310.jrating > div {
2311 width:24px;
2312 height:24px;
2313 line-height:24px;
2314 background-image: url("data:image/svg+xml,%0A%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 width=%2724%27 height=%2724%27 viewBox=%270 0 24 24%27%3E%3Cpath d=%27M22 9.24l-7.19-.62L12 2 9.19 8.63 2 9.24l5.46 4.73L5.82 21 12 17.27 18.18 21l-1.63-7.03L22 9.24zM12 15.4l-3.76 2.27 1-4.28-3.32-2.88 4.38-.38L12 6.1l1.71 4.04 4.38.38-3.32 2.88 1 4.28L12 15.4z%27 fill=%27gray%27/%3E%3Cpath d=%27M0 0h24v24H0z%27 fill=%27none%27/%3E%3C/svg%3E");
2315}
2316
2317.jrating .jrating-over {
2318 background-image: url("data:image/svg+xml,%0A%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 width=%2724%27 height=%2724%27 viewBox=%270 0 24 24%27 fill=%27black%27%3E%3Cpath d=%27M0 0h24v24H0z%27 fill=%27none%27/%3E%3Cpath d=%27M12 17.27L18.18 21l-1.64-7.03L22 9.24l-7.19-.61L12 2 9.19 8.63 2 9.24l5.46 4.73L5.82 21z%27/%3E%3Cpath d=%27M0 0h24v24H0z%27 fill=%27none%27/%3E%3C/svg%3E");
2319 opacity: 0.7;
2320}
2321
2322.jrating .jrating-selected {
2323 background-image: url("data:image/svg+xml,%0A%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 width=%2724%27 height=%2724%27 viewBox=%270 0 24 24%27 fill=%27red%27%3E%3Cpath d=%27M0 0h24v24H0z%27 fill=%27none%27/%3E%3Cpath d=%27M12 17.27L18.18 21l-1.64-7.03L22 9.24l-7.19-.61L12 2 9.19 8.63 2 9.24l5.46 4.73L5.82 21z%27/%3E%3Cpath d=%27M0 0h24v24H0z%27 fill=%27none%27/%3E%3C/svg%3E");
2324}
2325
2326.jsearch {
2327 position: relative;
2328 display: none;
2329 -webkit-user-select: none;
2330 -moz-user-select: none;
2331 -ms-user-select: none;
2332 user-select: none;
2333}
2334
2335.jsearch_container {
2336 position: absolute;
2337 box-shadow: 0 1px 2px 0 rgba(60,64,67,0.302), 0 2px 6px 2px rgba(60,64,67,0.149);
2338 border: none;
2339 -webkit-border-radius: 4px;
2340 border-radius: 4px;
2341 width: 280px;
2342 padding: 8px 0;
2343 z-index: 1;
2344
2345 -webkit-box-shadow: 0 2px 4px rgba(0,0,0,0.2);
2346 box-shadow: 0 2px 4px rgba(0,0,0,0.2);
2347 -webkit-transition: opacity .218s;
2348 transition: opacity .218s;
2349 background: #fff;
2350 border: 1px solid rgba(0,0,0,.2);
2351 cursor: pointer;
2352 margin: 0;
2353 min-width: 300px;
2354 outline: none;
2355 width: auto;
2356 -webkit-user-select: none;
2357 -moz-user-select: none;
2358 -ms-user-select: none;
2359 user-select: none;
2360}
2361
2362.jsearch_container:empty:after {
2363 content: attr(data-placeholder);
2364}
2365
2366.jsearch_container > div {
2367 color: #333;
2368 cursor: pointer;
2369 display: -webkit-box;
2370 display: -webkit-flex;
2371 display: flex;
2372 padding: 5px 10px;
2373 user-select: none;
2374 -webkit-align-items: center;
2375 align-items: center;
2376
2377 -webkit-user-select: none;
2378 -moz-user-select: none;
2379 -ms-user-select: none;
2380 user-select: none;
2381}
2382
2383.jsearch_container > div:hover {
2384 background-color: #e8eaed;
2385}
2386
2387.jsearch_container > div > img {
2388 width: 32px;
2389 height: 32px;
2390 user-select: none;
2391 border-radius: 16px;
2392 margin-right: 2px;
2393}
2394
2395.jsearch_container > div > div {
2396 overflow: hidden;
2397 text-overflow: ellipsis;
2398 margin-left: 2px;
2399 max-width: 300px;
2400 white-space: nowrap;
2401 user-select: none;
2402}
2403
2404.jsearch_container .selected {
2405 background-color: #e8eaed;
2406}
2407.jslider {
2408 outline: none;
2409}
2410
2411.jslider-focus {
2412 width: 100% !important;
2413 height: 100% !important;
2414}
2415
2416.jslider-focus img {
2417 display: none;
2418}
2419
2420.jslider img {
2421 width: 100px;
2422}
2423
2424.jslider-left::before {
2425 position: fixed;
2426 left: 15px;
2427 top: 50%;
2428 content:'arrow_back_ios';
2429 color: #fff;
2430 width: 30px;
2431 height: 30px;
2432 font-family: 'Material Icons';
2433 font-size: 30px;
2434 /* before it was 0px 0px 0px #000 */
2435 text-shadow: 0px 0px 6px rgb(56,56,56);
2436 text-align: center;
2437 cursor: pointer;
2438}
2439
2440.jslider-right::after {
2441 position: fixed;
2442 right: 15px;
2443 top: 50%;
2444 content: 'arrow_forward_ios';
2445 color: #fff;
2446 width: 30px;
2447 height: 30px;
2448 font-family: 'Material Icons';
2449 font-size: 30px;
2450 /* before it was 0px 0px 0px #000 */
2451 text-shadow: 0px 0px 6px rgb(56,56,56);
2452 text-align: center;
2453 cursor: pointer;
2454}
2455
2456.jslider-close {
2457 width:24px;
2458 height:24px;
2459 background-image: url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 width=%2724%27 height=%2724%27 viewBox=%270 0 24 24%27 fill=%27white%27%3E%3Cpath d=%27M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z%27/%3E%3Cpath d=%27M0 0h24v24H0z%27 fill=%27none%27/%3E%3C/svg%3E");
2460 position:fixed;
2461 top:15px;
2462 right:15px;
2463 cursor:pointer;
2464 z-index:3000;
2465
2466 display: block !important;
2467}
2468
2469.jslider-counter {
2470 height:24px;
2471 background-color: transparent;
2472 position:fixed;
2473 left: 50%;
2474 transform: translateX(-50%);
2475 bottom: 15px;
2476 cursor:pointer;
2477 z-index:3000;
2478
2479 display: flex;
2480 display: -webkit-flex;
2481 -webkit-justify-content: center;
2482 -webkit-align-items: center;
2483 -webkit-flex-direction: row;
2484 justify-content: center;
2485 align-items: center;
2486 flex-direction: row;
2487}
2488
2489.jslider-caption {
2490 position: fixed;
2491 max-width: 90vw;
2492 text-overflow: ellipsis;
2493 white-space: nowrap;
2494 overflow: hidden;
2495 top:15px;
2496 left: 15px;
2497 z-index:3000;
2498 color: #FFF;
2499 font-size: 1rem;
2500
2501 display: block !important;
2502}
2503
2504.jslider-counter div {
2505 width: 10px;
2506 height: 10px;
2507 background: #fff;
2508 border-radius: 50%;
2509 margin: 0px 5px;
2510
2511 display: block !important;
2512}
2513
2514.jslider-counter .jslider-counter-focus {
2515 background-color: cornflowerblue;
2516 pointer-events: none;
2517}
2518
2519.jslider-focus {
2520 position:fixed;
2521 left:0;
2522 top:0;
2523 width: 100%;
2524 min-height:100%;
2525 max-height:100%;
2526 z-index:2000;
2527 margin:0px;
2528 box-sizing:border-box;
2529
2530 background-color:rgba(0,0,0,0.8);
2531 -webkit-transition-duration: .05s;
2532 transition-duration: .05s;
2533 display: flex;
2534 -ms-flex-align: center;
2535 -webkit-align-items: center;
2536 -webkit-box-align: center;
2537
2538 align-items: center;
2539}
2540
2541.jslider-focus img {
2542 width: 50vw;
2543 height: auto;
2544 box-sizing: border-box;
2545 margin:0 auto;
2546 vertical-align:middle;
2547 display:none;
2548}
2549
2550.jslider-focus img.jslider-vertical {
2551 width: auto;
2552 /* before it was 50vh */
2553 height: 80vh;
2554}
2555
2556@media only screen and (max-width: 576px) {
2557 .jslider-focus img.jslider-vertical {
2558 width: 99vw !important;
2559 height: auto !important;
2560 }
2561
2562 .jslider-focus img {
2563 width: 100vw !important;
2564 height: auto !important;
2565 }
2566}
2567
2568.jslider-grid {
2569 display: -ms-grid;
2570 display: grid;
2571 grid-gap: 1px;
2572 position: relative;
2573}
2574
2575.jslider-grid[data-number='2'] {
2576 -ms-grid-columns: 1fr 50%;
2577 grid-template-columns: 1fr 50%;
2578}
2579
2580.jslider-grid[data-number='3'] {
2581 -ms-grid-columns: 1fr 33%;
2582 grid-template-columns: 1fr 33%;
2583}
2584
2585.jslider-grid[data-number='4'] {
2586 -ms-grid-columns: 1fr 25%;
2587 grid-template-columns: 1fr 25%;
2588}
2589
2590.jslider-grid img {
2591 display: none;
2592 width: 100%;
2593 height: 100%;
2594 object-fit: cover;
2595}
2596
2597.jslider-grid[data-total]:after {
2598 content: attr(data-total) "+";
2599 font-size: 1.5em;
2600 position:absolute;
2601 color: #fff;
2602 right: 15px;
2603 bottom: 6px;
2604}
2605
2606.jslider-grid img:first-child {
2607 -ms-grid-column: 1;
2608 -ms-grid-row: 1;
2609 grid-column: 1;
2610 grid-row: 1;
2611 display: block;
2612}
2613
2614.jslider-grid[data-number='2'] img:nth-child(2) {
2615 -ms-grid-column: 2;
2616 -ms-grid-row: 1;
2617 grid-column: 2;
2618 grid-row: 1;
2619 display: block;
2620}
2621
2622.jslider-grid[data-number='3'] img:first-child {
2623 -ms-grid-column: 1 / 2;
2624 -ms-grid-row: 1 / 4;
2625 grid-column: 1 / 2;
2626 grid-row: 1 / 4;
2627}
2628
2629.jslider-grid[data-number='3'] img:nth-child(2) {
2630 -ms-grid-column: 2;
2631 -ms-grid-row: 1;
2632 grid-column: 2;
2633 grid-row: 1;
2634 display: block;
2635}
2636
2637.jslider-grid[data-number='3'] img:nth-child(3) {
2638 -ms-grid-column: 2;
2639 -ms-grid-row: 2;
2640 grid-column: 2;
2641 grid-row: 2;
2642 display: block;
2643}
2644
2645.jslider-grid[data-number='4'] img:first-child {
2646 -ms-grid-column: 1 / 2;
2647 -ms-grid-row: 1 / 4;
2648 grid-column: 1 / 2;
2649 grid-row: 1 / 4;
2650}
2651
2652.jslider-grid[data-number='4'] img:nth-child(2) {
2653 -ms-grid-column: 2;
2654 -ms-grid-row: 1;
2655 grid-column: 2;
2656 grid-row: 1;
2657 display: block;
2658}
2659
2660.jslider-grid[data-number='4'] img:nth-child(3) {
2661 -ms-grid-column: 2;
2662 -ms-grid-row: 2;
2663 grid-column: 2;
2664 grid-row: 2;
2665 display: block;
2666}
2667
2668.jslider-grid[data-number='4'] img:nth-child(4) {
2669 -ms-grid-column: 2;
2670 -ms-grid-row: 3;
2671 grid-column: 2;
2672 grid-row: 3;
2673 display: block;
2674}
2675
2676.jtabs {
2677 max-width: 100vw;
2678 position: relative;
2679}
2680
2681.jtabs .jtabs-headers-container {
2682 display: flex;
2683 align-items: center;
2684}
2685
2686.jtabs .jtabs-headers {
2687 display: flex;
2688 align-items: center;
2689 overflow: hidden;
2690 position: relative;
2691}
2692
2693.jtabs .jtabs-headers > div:not(.jtabs-border) {
2694 padding: 8px;
2695 padding-left: 20px;
2696 padding-right: 20px;
2697 margin-left: 1px;
2698 margin-right: 1px;
2699 background-color: #f1f1f1;
2700 cursor: pointer;
2701 white-space: nowrap;
2702 text-align: center;
2703}
2704
2705.jtabs .jtabs-headers > div.jtabs-selected {
2706 background-color: #e8e8e8;
2707 color: #000;
2708}
2709
2710.jtabs .jtabs-headers > div > div {
2711 color: #555;
2712 width: 100%;
2713 overflow: hidden;
2714}
2715
2716.jtabs .jtabs-headers i {
2717 display: block;
2718 margin: auto;
2719}
2720
2721.jtabs .jtabs-content {
2722 box-sizing: border-box;
2723}
2724
2725.jtabs .jtabs-content > div {
2726 display: none;
2727 box-sizing: border-box;
2728}
2729
2730.jtabs .jtabs-content > div.jtabs-selected {
2731 display: block;
2732}
2733
2734.jtabs .jtabs-border {
2735 position: absolute;
2736 height: 2px;
2737 background-color: #888;
2738 transform-origin: left;
2739 transition: all .2s cubic-bezier(0.4,0,0.2,1);
2740 transition-property: color,left,transform;
2741 display: none;
2742 pointer-events: none;
2743}
2744
2745.jtabs-animation .jtabs-border {
2746 display: initial;
2747}
2748
2749.jtabs .jtabs-controls {
2750 margin: 3px;
2751 margin-left: 10px;
2752 display: flex;
2753 min-width: 82px;
2754}
2755
2756.jtabs .jtabs-controls > div {
2757 cursor: pointer;
2758 background-position: center;
2759 background-repeat: no-repeat;
2760 width: 24px;
2761 height: 24px;
2762 line-height: 24px;
2763}
2764
2765.jtabs .jtabs-prev {
2766 margin-left: 10px;
2767 background-image: url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 24 24%27 fill=%27gray%27 width=%2718px%27 height=%2718px%27%3E%3Cpath d=%27M0 0h24v24H0z%27 fill=%27none%27/%3E%3Cpath d=%27M15.41 7.41L14 6l-6 6 6 6 1.41-1.41L10.83 12z%27/%3E%3C/svg%3E");
2768}
2769
2770.jtabs .jtabs-prev.disabled {
2771 margin-left: 10px;
2772 background-image: url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 24 24%27 fill=%27lightgray%27 width=%2718px%27 height=%2718px%27%3E%3Cpath d=%27M0 0h24v24H0z%27 fill=%27none%27/%3E%3Cpath d=%27M15.41 7.41L14 6l-6 6 6 6 1.41-1.41L10.83 12z%27/%3E%3C/svg%3E");
2773}
2774
2775.jtabs .jtabs-next {
2776 background-image: url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 24 24%27 fill=%27gray%27 width=%2718px%27 height=%2718px%27%3E%3Cpath d=%27M0 0h24v24H0z%27 fill=%27none%27/%3E%3Cpath d=%27M10 6L8.59 7.41 13.17 12l-4.58 4.59L10 18l6-6z%27/%3E%3C/svg%3E");
2777}
2778
2779.jtabs .jtabs-next.disabled {
2780 background-image: url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 24 24%27 fill=%27lightgray%27 width=%2718px%27 height=%2718px%27%3E%3Cpath d=%27M0 0h24v24H0z%27 fill=%27none%27/%3E%3Cpath d=%27M10 6L8.59 7.41 13.17 12l-4.58 4.59L10 18l6-6z%27/%3E%3C/svg%3E");
2781}
2782
2783.jtabs .jtabs-add {
2784 background-image: url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 height=%2724%27 viewBox=%270 0 24 24%27 width=%2724%27%3E%3Cpath d=%27M19 3H5c-1.11 0-2 .9-2 2v14c0 1.1.89 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm-2 10h-4v4h-2v-4H7v-2h4V7h2v4h4v2z%27 fill=%27%23bbbbbb%27/%3E%3Cpath d=%27M0 0h24v24H0z%27 fill=%27none%27/%3E%3C/svg%3E");
2785}
2786
2787/** Modern skin **/
2788
2789.jtabs.jtabs-modern .jtabs-headers > div:not(.jtabs-border) {
2790 padding: 4px;
2791 padding-left: 10px;
2792 padding-right: 10px;
2793 background-color: #fff;
2794}
2795
2796.jtabs.jtabs-modern .jtabs-headers > .jtabs-selected {
2797 color: #000;
2798}
2799
2800.jtabs.jtabs-modern .jtabs-headers > .jtabs-selected .material-icons {
2801 color: #000;
2802}
2803
2804.jtabs.jtabs-modern .jtabs-headers {
2805 background: #EEEEEF !important;
2806 padding: 2px;
2807 border-radius: 4px;
2808}
2809
2810.jtabs.jtabs-modern .jtabs-headers .jtabs-border {
2811 border-color: #EEEEEF !important;
2812}
2813
2814.jtabs.jtabs-modern .jtabs-border {
2815 background-color: rgba(194, 197, 188, 0.884);
2816}
2817.jtags {
2818 display: flex;
2819 flex-wrap: wrap;
2820 -ms-flex-direction: row;
2821 -webkit-flex-direction: row;
2822 flex-direction: row;
2823 -ms-flex-pack: flex-start;
2824 -webkit-justify-content: space-between;
2825 justify-content: flex-start;
2826 padding: 1px;
2827 border: 1px solid #ccc;
2828 position: relative;
2829}
2830
2831.jtags.jtags-empty:not(.jtags-focus)::before {
2832 position: absolute;
2833 margin: 3px;
2834 color: #ccc;
2835 content: attr(data-placeholder);
2836 top: 0;
2837 margin-left: 6px;
2838}
2839
2840.jtags > div {
2841 padding: 3px 22px 3px 10px;
2842 font-size: 0.9em;
2843 position: relative;
2844 border-radius: 1px;
2845 margin: 2px;
2846 display: block;
2847 outline: none;
2848}
2849
2850.jtags > div:empty:before {
2851 content: " ";
2852 white-space: pre;
2853}
2854
2855.jtags > div::after {
2856 content: 'x';
2857 position: absolute;
2858 right: 4px;
2859 width: 12px;
2860 height: 12px;
2861 cursor: pointer;
2862 font-size: 0.9em;
2863 display: none;
2864}
2865
2866.jtags_label {
2867 background-color: #e4e4e4 !important;
2868}
2869
2870.jtags_label::after {
2871 display: inline-block !important;
2872}
2873
2874.jtags_error::after {
2875 color: #fff !important;
2876}
2877
2878.jtags_error {
2879 background-color: #d93025 !important;
2880 color: #fff;
2881}
2882
2883.jtoolbar-container {
2884 border-radius: 2px;
2885 box-shadow: 0 4px 5px 0 rgba(0,0,0,0.14), 0 1px 10px 0 rgba(0,0,0,0.12), 0 2px 4px -1px rgba(0,0,0,0.2);
2886 display: inline-flex !important;
2887}
2888
2889.jtoolbar {
2890 cursor: pointer;
2891 white-space: nowrap;
2892 display: flex;
2893 padding:4px;
2894 -webkit-user-select: none;
2895 -moz-user-select: none;
2896 -ms-user-select: none;
2897 user-select: none;
2898 font-size: 13px;
2899}
2900
2901.jtoolbar-disabled {
2902 pointer-events: none;
2903 opacity: 0.4;
2904}
2905
2906.jtoolbar-mobile {
2907 display: flex;
2908 position:fixed;
2909 bottom: 0;
2910 margin: 0;
2911 left: 0;
2912 width: 100%;
2913 background: #f7f7f8;
2914 z-index: 1;
2915 box-sizing: border-box;
2916 box-shadow: 0 -1px 2px rgba(0,0,0,.1);
2917 border-radius: 0px;
2918}
2919
2920.jtoolbar > div {
2921 display: inline-flex;
2922 align-items: center;
2923 box-sizing: border-box;
2924 vertical-align:middle;
2925 justify-content: space-evenly;
2926}
2927
2928.jtoolbar-mobile > div {
2929 display: flex;
2930 width: 100%;
2931}
2932
2933.jtoolbar .jtoolbar-item {
2934 text-align: center;
2935 margin: auto;
2936 padding: 2px;
2937 padding-left:4px;
2938 padding-right:4px;
2939}
2940
2941.jtoolbar-mobile .jtoolbar-item {
2942 position: relative;
2943 flex:1;
2944}
2945
2946.jtoolbar .jtoolbar-divisor {
2947 width: 2px;
2948 height: 18px;
2949 padding: 0px;
2950 margin-left: 4px;
2951 margin-right: 4px;
2952 background-color: #ddd;
2953}
2954
2955.jtoolbar .jtoolbar-label {
2956 padding-left: 8px;
2957 padding-right: 8px;
2958}
2959
2960
2961
2962.jtoolbar-mobile a
2963{
2964 text-decoration:none;
2965 display:inline-block;
2966}
2967
2968.jtoolbar-mobile i {
2969 display: inline-flex !important;
2970 color:#929292;
2971}
2972
2973.jtoolbar-mobile span {
2974 font-size:0.7em;
2975 display:block;
2976 color:#929292;
2977}
2978
2979.jtoolbar-mobile .jtoolbar-selected a, .jtoolbar-mobile .jtoolbar-selected i, .jtoolbar-mobile .jtoolbar-selected span {
2980 color:var(--jactive-color) !important;
2981 background-color:transparent;
2982}
2983
2984.jtoolbar-item {
2985 -webkit-user-select: none;
2986 -moz-user-select: none;
2987 -ms-user-select: none;
2988 user-select: none;
2989}
2990
2991.jtoolbar-item i {
2992 display: block;
2993 color:#333;
2994}
2995
2996.jtoolbar-item:hover {
2997 background-color:#f2f2f2;
2998}
2999
3000.jtoolbar .jpicker {
3001 padding-left: 0;
3002 padding-right: 0;
3003}
3004
3005.jtoolbar .jpicker-header {
3006 padding: 0 20px 0 8px;
3007 background-position: top 50% right 0;
3008 display: flex;
3009 align-items: center;
3010}
3011
3012.jtoolbar .jpicker-content > div {
3013 padding: 6px;
3014}
3015
3016.jtoolbar-active {
3017 background-color:#eee;
3018}
3019
3020.jtoolbar .fa {
3021 width: 18px;
3022 height: 18px;
3023 display: block;
3024 line-height: 18px;
3025 font-size: 14px;
3026}
3027
3028.jtoolbar .material-icons {
3029 font-size: 18px;
3030 width: 24px;
3031 height: 24px;
3032 display: block;
3033 line-height: 24px;
3034 transform: rotate(0.03deg);
3035 text-align: center;
3036}
3037
3038.jtoolbar .jtoolbar-arrow {
3039 background-repeat: no-repeat;
3040 background-position: center;
3041 background-image: url("data:image/svg+xml,%0A%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 24 24%27 fill=%27black%27 width=%2718px%27 height=%2718px%27%3E%3Cpath d=%27M0 0h24v24H0z%27 fill=%27none%27/%3E%3Cpath d=%27M12 8c1.1 0 2-.9 2-2s-.9-2-2-2-2 .9-2 2 .9 2 2 2zm0 2c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm0 6c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2z%27/%3E%3C/svg%3E");
3042 width: 24px;
3043 height: 16px;
3044 margin-left: 4px;
3045 border-left: 1px solid #f2f2f2;
3046}
3047
3048.jtoolbar-floating {
3049 position: absolute;
3050 display: none;
3051 box-shadow: 0 4px 5px 0 rgba(0,0,0,0.14), 0 1px 10px 0 rgba(0,0,0,0.12), 0 2px 4px -1px rgba(0,0,0,0.2);
3052 border-radius: 4px;
3053 background-color: #fff;
3054 padding: 4px;
3055 z-index: 50;
3056 text-align: left;
3057 margin-right: 20px;
3058}
3059
3060.jtoolbar-floating .jtoolbar-divisor {
3061 display: none;
3062}
3063
3064.jtoolbar-arrow-selected .jtoolbar-floating {
3065 display: flex;
3066 flex-wrap: wrap;
3067}
3068
3069