@innovastudio/contentbox 1.5.97 → 1.6.1

Sign up to get free protection for your applications and to get access to all the features.
@@ -1,4 +1,4 @@
1
- /* IFRAME * New Control Panel */
1
+ /* IFRAME */
2
2
  .is-content-view.desktop {
3
3
  width: 1366px;
4
4
  height: 853px;
@@ -16,89 +16,240 @@
16
16
  height: 844px;
17
17
  }
18
18
 
19
- @media all and (min-width: 1620px) {
19
+ /* large screen*/
20
+ @media all and (min-width: 1920px) {
20
21
  .is-content-view.desktop {
21
- width: 1420px;
22
- height: 887px;
22
+ width: 1366px;
23
+ height: 853px;
24
+ transform: scale(0.96);
23
25
  }
24
26
 
25
27
  .is-content-view.tablet-landscape {
26
- width: 1280px;
27
- height: 960px;
28
+ width: 1080px;
29
+ height: 810px;
30
+ transform: scale(0.98);
31
+ }
32
+
33
+ .is-content-view.tablet {
34
+ width: 768px;
35
+ height: 1024px;
36
+ transform: scale(0.8);
37
+ }
38
+
39
+ .is-content-view.mobile {
40
+ width: 390px;
41
+ height: 844px;
42
+ transform: scale(0.98);
43
+ }
44
+
45
+ body.topspace .is-content-view.desktop {
46
+ transform: scale(0.92);
47
+ }
48
+
49
+ body.topspace .is-content-view.tablet-landscape {
50
+ transform: scale(0.94);
51
+ }
52
+
53
+ body.topspace .is-content-view.tablet {
54
+ transform: scale(0.76);
55
+ }
56
+
57
+ body.topspace .is-content-view.mobile {
58
+ transform: scale(0.94);
28
59
  }
29
60
  }
30
- @media all and (min-width: 1720px) {
61
+ @media all and (min-width: 1940px) {
31
62
  .is-content-view.desktop {
32
- width: 1520px;
33
- height: 949px;
63
+ width: 1620px;
64
+ height: 1012px;
65
+ transform: scale(1);
34
66
  }
35
67
 
36
68
  .is-content-view.tablet-landscape {
37
69
  width: 1280px;
38
70
  height: 960px;
71
+ transform: scale(1);
72
+ }
73
+
74
+ .is-content-view.tablet {
75
+ width: 768px;
76
+ height: 1024px;
77
+ transform: scale(1);
78
+ }
79
+
80
+ .is-content-view.mobile {
81
+ width: 390px;
82
+ height: 844px;
83
+ transform: scale(1);
39
84
  }
40
85
  }
41
- @media all and (min-width: 1820px) {
86
+ @media all and (min-width: 2000px) {
42
87
  .is-content-view.desktop {
88
+ width: 1730px;
89
+ height: 1080px;
90
+ transform: scale(1);
91
+ }
92
+
93
+ body.topspace .is-content-view.desktop {
43
94
  width: 1620px;
44
95
  height: 1012px;
96
+ transform: scale(1);
97
+ }
98
+ }
99
+ @media all and (max-width: 1720px) {
100
+ .is-content-view {
101
+ transform: scale(0.89);
102
+ }
103
+ .is-content-view.tablet {
104
+ transform: scale(0.75);
45
105
  }
46
106
 
47
- .is-content-view.tablet-landscape {
48
- width: 1280px;
49
- height: 960px;
107
+ body.topspace .is-content-view {
108
+ transform: scale(0.83);
109
+ }
110
+
111
+ body.topspace .is-content-view.tablet {
112
+ transform: scale(0.7);
113
+ }
114
+ }
115
+ @media all and (max-width: 1620px) {
116
+ .is-content-view {
117
+ transform: scale(0.86);
118
+ }
119
+
120
+ body.topspace .is-content-view {
121
+ transform: scale(0.8);
50
122
  }
51
123
  }
52
124
  @media all and (max-width: 1520px) {
53
125
  .is-content-view {
54
- transform: scale(0.95);
126
+ transform: scale(0.86);
127
+ }
128
+
129
+ body.topspace .is-content-view {
130
+ transform: scale(0.8);
55
131
  }
56
132
  }
57
133
  @media all and (max-width: 1450px) {
58
134
  .is-content-view {
59
- transform: scale(0.9);
135
+ transform: scale(0.86);
136
+ }
137
+
138
+ body.topspace .is-content-view {
139
+ transform: scale(0.8);
60
140
  }
61
141
  }
62
- @media all and (max-width: 1375px) {
142
+ @media all and (max-width: 1390px) {
63
143
  .is-content-view {
64
- transform: scale(0.85);
144
+ transform: scale(0.84);
145
+ }
146
+
147
+ body.topspace .is-content-view {
148
+ transform: scale(0.78);
65
149
  }
66
150
  }
67
- @media all and (max-width: 1300px) {
151
+ @media all and (max-width: 1330px) {
68
152
  .is-content-view {
69
153
  transform: scale(0.8);
70
154
  }
155
+
156
+ body.topspace .is-content-view {
157
+ transform: scale(0.74);
158
+ }
71
159
  }
72
- @media all and (max-width: 1235px) {
160
+ @media all and (max-width: 1270px) {
73
161
  .is-content-view {
74
- transform: scale(0.75);
162
+ transform: scale(0.76);
163
+ }
164
+
165
+ body.topspace .is-content-view {
166
+ transform: scale(0.7);
75
167
  }
76
168
  }
77
- @media all and (max-width: 1175px) {
169
+ @media all and (max-width: 1210px) {
78
170
  .is-content-view {
79
- transform: scale(0.7);
171
+ transform: scale(0.72);
172
+ }
173
+
174
+ body.topspace .is-content-view {
175
+ transform: scale(0.66);
176
+ }
177
+ }
178
+ @media all and (max-width: 1150px) {
179
+ .is-content-view {
180
+ transform: scale(0.68);
181
+ }
182
+
183
+ body.topspace .is-content-view {
184
+ transform: scale(0.62);
80
185
  }
81
186
  }
82
187
  @media all and (max-width: 1090px) {
83
188
  .is-content-view {
84
- transform: scale(0.65);
189
+ transform: scale(0.64);
190
+ }
191
+
192
+ body.topspace .is-content-view {
193
+ transform: scale(0.58);
194
+ }
195
+ }
196
+ @media all and (max-width: 1024px) {
197
+ .is-content-view {
198
+ transform: scale(0.6);
199
+ }
200
+
201
+ body.topspace .is-content-view {
202
+ transform: scale(0.5);
203
+ }
204
+ }
205
+ @media all and (max-width: 970px) {
206
+ .is-content-view {
207
+ transform: scale(0.56);
208
+ }
209
+
210
+ body.topspace .is-content-view {
211
+ transform: scale(0.5);
212
+ }
213
+ }
214
+ @media all and (max-width: 900px) {
215
+ .is-content-view {
216
+ transform: scale(0.52);
217
+ }
218
+
219
+ body.topspace .is-content-view {
220
+ transform: scale(0.46);
221
+ }
222
+ }
223
+ @media all and (max-width: 850px) {
224
+ .is-content-view {
225
+ transform: scale(0.48);
226
+ }
227
+
228
+ body.topspace .is-content-view {
229
+ transform: scale(0.42);
230
+ }
231
+ }
232
+ @media all and (max-width: 790px) {
233
+ .is-content-view {
234
+ transform: scale(0.44);
235
+ }
236
+
237
+ body.topspace .is-content-view {
238
+ transform: scale(0.38);
85
239
  }
86
240
  }
87
- body.controlpanel .is-responsive-tool {
88
- right: 340px;
241
+ @media all and (max-width: 730px) {
242
+ .is-content-view {
243
+ transform: scale(0.4);
244
+ }
245
+
246
+ body.topspace .is-content-view {
247
+ transform: scale(0.34);
248
+ }
89
249
  }
90
250
  body.controlpanel .is-content-view {
91
251
  margin-right: 290px;
92
252
  }
93
- body.controlpanel .is-controlpanel {
94
- position: fixed;
95
- width: 290px;
96
- height: 100vh;
97
- top: 0;
98
- right: 0;
99
- background: #fff;
100
- z-index: 1;
101
- }
102
253
  body.controlpanel .is-content-view.desktop {
103
254
  width: 1366px;
104
255
  height: 853px;
@@ -115,73 +266,2324 @@ body.controlpanel .is-content-view.mobile {
115
266
  width: 390px;
116
267
  height: 844px;
117
268
  }
118
- @media all and (min-width: 2030px) {
269
+ @media all and (min-width: 1920px) {
270
+ body.controlpanel .is-content-view.desktop {
271
+ width: 1366px;
272
+ height: 853px;
273
+ transform: scale(0.96);
274
+ }
275
+ body.controlpanel .is-content-view.tablet-landscape {
276
+ width: 1080px;
277
+ height: 810px;
278
+ transform: scale(0.98);
279
+ }
280
+ body.controlpanel .is-content-view.tablet {
281
+ width: 768px;
282
+ height: 1024px;
283
+ transform: scale(0.8);
284
+ }
285
+ body.controlpanel .is-content-view.mobile {
286
+ width: 390px;
287
+ height: 844px;
288
+ transform: scale(0.98);
289
+ }
290
+ body.controlpanel.topspace .is-content-view.desktop {
291
+ transform: scale(0.92);
292
+ }
293
+ body.controlpanel.topspace .is-content-view.tablet-landscape {
294
+ transform: scale(0.94);
295
+ }
296
+ body.controlpanel.topspace .is-content-view.tablet {
297
+ transform: scale(0.76);
298
+ }
299
+ body.controlpanel.topspace .is-content-view.mobile {
300
+ transform: scale(0.94);
301
+ }
302
+ }
303
+ @media all and (min-width: 1940px) {
304
+ body.controlpanel .is-content-view.desktop {
305
+ width: 1520px;
306
+ height: 949px;
307
+ transform: scale(1);
308
+ }
309
+ body.controlpanel .is-content-view.tablet-landscape {
310
+ width: 1280px;
311
+ height: 960px;
312
+ transform: scale(1);
313
+ }
314
+ body.controlpanel .is-content-view.tablet {
315
+ width: 768px;
316
+ height: 1024px;
317
+ transform: scale(1);
318
+ }
319
+ body.controlpanel .is-content-view.mobile {
320
+ width: 390px;
321
+ height: 844px;
322
+ transform: scale(1);
323
+ }
324
+ }
325
+ @media all and (min-width: 2080px) {
119
326
  body.controlpanel .is-content-view.desktop {
120
- width: 1560px;
121
- height: 974px;
327
+ width: 1620px;
328
+ height: 1012px;
122
329
  }
123
330
  body.controlpanel .is-content-view.tablet-landscape {
124
331
  width: 1280px;
125
332
  height: 960px;
126
333
  }
127
334
  }
335
+ @media all and (min-width: 2250px) {
336
+ body.controlpanel .is-content-view.desktop {
337
+ width: 1730px;
338
+ height: 1080px;
339
+ transform: scale(1);
340
+ }
341
+ body.controlpanel.topspace .is-content-view.desktop {
342
+ width: 1620px;
343
+ height: 1012px;
344
+ transform: scale(1);
345
+ }
346
+ }
128
347
  @media all and (max-width: 1800px) {
129
348
  body.controlpanel .is-content-view {
130
349
  transform: scale(0.95);
131
350
  }
351
+ body.controlpanel .is-content-view.tablet {
352
+ transform: scale(0.7);
353
+ }
354
+ body.controlpanel.topspace .is-content-view {
355
+ transform: scale(0.9);
356
+ }
132
357
  }
133
358
  @media all and (max-width: 1730px) {
134
359
  body.controlpanel .is-content-view {
135
360
  transform: scale(0.9);
136
361
  }
362
+ body.controlpanel.topspace .is-content-view {
363
+ transform: scale(0.85);
364
+ }
137
365
  }
138
366
  @media all and (max-width: 1680px) {
139
367
  body.controlpanel .is-content-view {
140
- transform: scale(0.85);
368
+ transform: scale(0.88);
369
+ }
370
+ body.controlpanel.topspace .is-content-view {
371
+ transform: scale(0.83);
372
+ }
373
+ body.controlpanel.topspace .is-content-view.tablet {
374
+ transform: scale(0.7);
141
375
  }
142
376
  }
143
377
  @media all and (max-width: 1600px) {
144
378
  body.controlpanel .is-content-view {
145
379
  transform: scale(0.8);
146
380
  }
381
+ body.controlpanel.topspace .is-content-view {
382
+ transform: scale(0.75);
383
+ }
147
384
  }
148
385
  @media all and (max-width: 1520px) {
149
386
  body.controlpanel .is-content-view {
150
387
  transform: scale(0.75);
151
388
  }
389
+ body.controlpanel.topspace .is-content-view {
390
+ transform: scale(0.7);
391
+ }
152
392
  }
153
393
  @media all and (max-width: 1450px) {
154
394
  body.controlpanel .is-content-view {
155
395
  transform: scale(0.7);
156
396
  }
397
+ body.controlpanel.topspace .is-content-view {
398
+ transform: scale(0.65);
399
+ }
157
400
  }
158
401
  @media all and (max-width: 1375px) {
159
402
  body.controlpanel .is-content-view {
160
- transform: scale(0.65);
403
+ transform: scale(0.63);
404
+ }
405
+ body.controlpanel.topspace .is-content-view {
406
+ transform: scale(0.58);
161
407
  }
162
408
  }
163
409
  @media all and (max-width: 1300px) {
164
410
  body.controlpanel .is-content-view {
165
411
  transform: scale(0.6);
166
412
  }
413
+ body.controlpanel.topspace .is-content-view {
414
+ transform: scale(0.55);
415
+ }
167
416
  }
168
417
  @media all and (max-width: 1235px) {
169
418
  body.controlpanel .is-content-view {
170
419
  transform: scale(0.55);
171
420
  }
421
+ body.controlpanel.topspace .is-content-view {
422
+ transform: scale(0.5);
423
+ }
172
424
  }
173
425
  @media all and (max-width: 1175px) {
174
426
  body.controlpanel .is-content-view {
175
427
  transform: scale(0.5);
176
428
  }
429
+ body.controlpanel.topspace .is-content-view {
430
+ transform: scale(0.45);
431
+ }
177
432
  }
178
433
  @media all and (max-width: 1090px) {
179
434
  body.controlpanel .is-content-view {
180
435
  transform: scale(0.45);
181
436
  }
437
+ body.controlpanel.topspace .is-content-view {
438
+ transform: scale(0.4);
439
+ }
440
+ }
441
+
442
+ .is-content-view.fullview {
443
+ width: 100vw !important;
444
+ height: 100vh !important;
445
+ transform: none !important;
446
+ margin: 0 !important;
447
+ }
448
+ .is-content-view.fullview > div {
449
+ display: none;
450
+ }
451
+ .is-content-view.fullview iframe {
452
+ position: fixed;
453
+ top: 0;
454
+ left: 61px;
455
+ width: calc(100vw - 61px);
456
+ height: 100vh;
457
+ }
458
+
459
+ body.controlpanel .is-content-view.fullview > div {
460
+ display: none;
461
+ }
462
+ body.controlpanel .is-content-view.fullview iframe {
463
+ position: fixed;
464
+ top: 0;
465
+ left: 61px;
466
+ width: calc(100vw - 351px);
467
+ height: 100vh;
182
468
  }
183
469
 
184
470
  /* /IFRAME */
471
+ /* UI */
472
+ .builder-ui {
473
+ font-family: sans-serif;
474
+ font-size: 13px;
475
+ font-weight: 300;
476
+ letter-spacing: 0.8px;
477
+ }
478
+ .builder-ui svg {
479
+ width: 16px;
480
+ height: 16px;
481
+ }
482
+ .builder-ui .tooltip {
483
+ /* prevent overide by css framework */
484
+ opacity: unset;
485
+ padding: 0;
486
+ color: inherit;
487
+ }
488
+ .builder-ui button {
489
+ width: 38px;
490
+ height: 34px;
491
+ background-color: transparent;
492
+ box-shadow: none;
493
+ margin: 2px;
494
+ border-radius: 5px;
495
+ position: relative;
496
+ display: flex;
497
+ align-items: center;
498
+ justify-content: center;
499
+ cursor: pointer;
500
+ font-family: inherit;
501
+ font-size: inherit;
502
+ font-weight: inherit;
503
+ letter-spacing: inherit;
504
+ line-height: 1;
505
+ }
506
+ .builder-ui button.auto {
507
+ width: auto;
508
+ padding: 0 14px;
509
+ }
510
+ .builder-ui button > span {
511
+ margin-left: 5px;
512
+ }
513
+ .builder-ui button.btn-editcode, .builder-ui button.btn-editmodule {
514
+ width: 150px;
515
+ }
516
+ .builder-ui button.is-btn-color {
517
+ width: 41px;
518
+ height: 37px;
519
+ border: 1px solid rgba(197, 197, 197, 0.2784313725);
520
+ }
521
+ .builder-ui button.is-btn-color.nocolor {
522
+ width: 37px;
523
+ height: 35px;
524
+ }
525
+ .builder-ui button.on {
526
+ background-color: rgb(237, 237, 237);
527
+ }
528
+ .builder-ui button:not(.is-btn-color):hover {
529
+ background-color: rgb(237, 237, 237);
530
+ }
531
+ .builder-ui .label {
532
+ font-size: 13px;
533
+ margin: 20px 0 3px;
534
+ font-weight: 400;
535
+ line-height: 1.6;
536
+ color: #4b4b4b;
537
+ display: flex;
538
+ flex-direction: column;
539
+ background: transparent;
540
+ }
541
+ .builder-ui .label.flex-row {
542
+ flex-direction: row;
543
+ }
544
+ .builder-ui .label input[type=checkbox] {
545
+ margin: 0;
546
+ /* prevent overide by css framework */
547
+ }
548
+ .builder-ui .label.checkbox {
549
+ flex-direction: row;
550
+ align-items: center;
551
+ cursor: pointer;
552
+ }
553
+ .builder-ui .label.checkbox span {
554
+ line-height: 1;
555
+ margin-left: 5px;
556
+ }
557
+ .builder-ui .label.unit > div {
558
+ display: flex;
559
+ justify-content: space-between;
560
+ margin-bottom: 3px;
561
+ }
562
+ .builder-ui .label.unit > div .btn-unit {
563
+ cursor: pointer;
564
+ }
565
+ .builder-ui .label.mt-0 {
566
+ margin-top: 0px;
567
+ }
568
+ .builder-ui .label.mt-1 {
569
+ margin-top: 6px;
570
+ }
571
+ .builder-ui .label.mt-2 {
572
+ margin-top: 10px;
573
+ }
574
+ .builder-ui .label.mt-3 {
575
+ margin-top: 14px;
576
+ }
577
+ .builder-ui .label.mt-4 {
578
+ margin-top: 20px;
579
+ }
580
+ .builder-ui .label.mt-5 {
581
+ margin-top: 24px;
582
+ }
583
+ .builder-ui .label.mt-6 {
584
+ margin-top: 28px;
585
+ }
586
+ .builder-ui .label.mb-1 {
587
+ margin-bottom: 6px;
588
+ }
589
+ .builder-ui .label.mb-3 {
590
+ margin-bottom: 14px;
591
+ }
592
+ .builder-ui input[type=text], .builder-ui textarea {
593
+ width: 100%;
594
+ height: 43px;
595
+ box-sizing: border-box;
596
+ margin: 0;
597
+ font-family: sans-serif;
598
+ font-size: 15px;
599
+ font-weight: 300;
600
+ letter-spacing: 1px;
601
+ padding: 0;
602
+ padding-left: 8px;
603
+ color: #121212;
604
+ display: inline-block;
605
+ border: none;
606
+ border-bottom: none;
607
+ border-radius: 1px;
608
+ background-color: #f6f6f6;
609
+ flex: none;
610
+ }
611
+ .builder-ui textarea {
612
+ height: 250px;
613
+ padding: 12px 15px;
614
+ }
615
+ .builder-ui select {
616
+ font-size: 13px;
617
+ letter-spacing: 1px;
618
+ height: 43px;
619
+ line-height: 1.7;
620
+ color: #4a4a4a;
621
+ border-radius: 5px;
622
+ border: none;
623
+ background-color: #f6f6f6;
624
+ width: auto;
625
+ display: inline-block;
626
+ background-image: none;
627
+ -webkit-appearance: menulist;
628
+ -moz-appearance: menulist;
629
+ appearance: menulist;
630
+ padding: 0 5px;
631
+ border-radius: 1px;
632
+ cursor: pointer;
633
+ }
634
+ .builder-ui input[type=text]:focus,
635
+ .builder-ui textarea:focus,
636
+ .builder-ui select:focus {
637
+ outline: #3e93f7 2px solid;
638
+ outline-offset: 0;
639
+ box-shadow: none;
640
+ }
641
+ .builder-ui .group {
642
+ border: 1px solid #e1e1e1;
643
+ margin-bottom: 11px;
644
+ border-radius: 6px;
645
+ overflow: hidden;
646
+ display: inline-flex;
647
+ flex-wrap: wrap;
648
+ padding: 2px;
649
+ box-sizing: border-box;
650
+ }
651
+ .builder-ui .div-target {
652
+ display: flex;
653
+ justify-content: flex-end;
654
+ margin-top: 6px;
655
+ }
656
+ .builder-ui .div-target button {
657
+ width: 40px;
658
+ height: 28px;
659
+ }
660
+ .builder-ui .div-target button[data-device=xs] svg {
661
+ width: 13px;
662
+ height: 13px;
663
+ }
664
+ .builder-ui .accordion-item {
665
+ width: 100%;
666
+ background-color: rgba(0, 0, 0, 0.05);
667
+ justify-content: space-between;
668
+ padding-left: 25px;
669
+ height: 45px;
670
+ margin: 0;
671
+ border-radius: 0;
672
+ outline-offset: -2px;
673
+ flex: none;
674
+ }
675
+ .builder-ui .accordion-item span {
676
+ margin-right: 10px;
677
+ transition: transform 0.15s ease;
678
+ }
679
+ .builder-ui .accordion-item span svg {
680
+ width: 15px;
681
+ height: 15px;
682
+ }
683
+ .builder-ui .accordion-item[aria-expanded=true] span {
684
+ -webkit-transform: rotate(-180deg);
685
+ transform: rotate(-180deg);
686
+ }
687
+ .builder-ui .accordion-item[aria-expanded=false] span {
688
+ -webkit-transform: rotate(0deg);
689
+ transform: rotate(0deg);
690
+ }
691
+ .builder-ui .accordion-content {
692
+ display: flex;
693
+ padding: 0 !important;
694
+ transition: all 0.4s ease;
695
+ }
696
+ .builder-ui .accordion-content[aria-hidden=true] {
697
+ max-height: 0;
698
+ overflow: hidden;
699
+ opacity: 0;
700
+ transition: max-height 0.2s ease-out, opacity 0.2s ease-out;
701
+ }
702
+ .builder-ui .accordion-content[aria-hidden=false] {
703
+ max-height: 1000px;
704
+ opacity: 1;
705
+ transition: max-height 0.2s ease-out, opacity 0.2s ease-out;
706
+ }
707
+ .builder-ui .accordion-content.last[aria-hidden=true] {
708
+ transition: max-height 0.2s ease-out, opacity 0.1s ease-out;
709
+ }
710
+ .builder-ui .accordion-content.last[aria-hidden=false] {
711
+ transition: max-height 0.2s ease-out, opacity 0.1s ease-out;
712
+ }
713
+ .builder-ui .scroll-darker * {
714
+ scrollbar-width: thin;
715
+ scrollbar-color: rgba(0, 0, 0, 0.2) auto;
716
+ }
717
+ .builder-ui .scroll-darker *::-webkit-scrollbar {
718
+ width: 12px;
719
+ }
720
+ .builder-ui .scroll-darker *::-webkit-scrollbar-track {
721
+ background: rgba(200, 200, 200, 0.2);
722
+ }
723
+ .builder-ui .scroll-darker *::-webkit-scrollbar-thumb {
724
+ background-color: rgba(0, 0, 0, 0.2);
725
+ }
726
+
727
+ /* /UI */
728
+ /* CONTROL PANEL */
729
+ body.controlpanel .builder-ui .is-controlpanel {
730
+ right: 0px;
731
+ box-shadow: rgba(0, 0, 0, 0.05) 0 0 16px 0px;
732
+ }
733
+ body.controlpanel .is-wrapper {
734
+ width: calc(100% - 290px) !important;
735
+ margin-left: 0 !important;
736
+ }
737
+
738
+ .builder-ui .is-controlpanel {
739
+ background-color: #fff;
740
+ position: fixed;
741
+ width: 290px;
742
+ height: 100vh;
743
+ display: flex;
744
+ top: 0;
745
+ right: -290px;
746
+ z-index: 1;
747
+ display: flex;
748
+ overflow-y: auto;
749
+ flex-direction: column;
750
+ transition: all 0.3s ease;
751
+ box-shadow: none;
752
+ }
753
+ .builder-ui .is-controlpanel > .is-devpanel {
754
+ position: absolute;
755
+ top: 3px;
756
+ left: 3px;
757
+ right: 3px;
758
+ display: flex;
759
+ justify-content: space-between;
760
+ align-items: center;
761
+ font-size: 12px;
762
+ z-index: 0;
763
+ }
764
+ .builder-ui .is-controlpanel > .is-devpanel > div button {
765
+ width: 32px;
766
+ height: 30px;
767
+ }
768
+ .builder-ui .is-controlpanel > .is-devpanel > div button.btn-preferences svg {
769
+ width: 15px;
770
+ height: 15px;
771
+ }
772
+ .builder-ui .is-controlpanel .panelnav {
773
+ margin-top: 58px;
774
+ padding: 8px 24px 8px;
775
+ box-sizing: border-box;
776
+ }
777
+ .builder-ui .is-controlpanel .panelnav .part-breadcrumb {
778
+ display: flex;
779
+ flex-direction: column;
780
+ margin-left: -1px;
781
+ }
782
+ .builder-ui .is-controlpanel .panelnav .part-breadcrumb div {
783
+ display: flex;
784
+ flex-direction: row;
785
+ align-items: center;
786
+ margin: 0 0 5px;
787
+ }
788
+ .builder-ui .is-controlpanel .panelnav .part-breadcrumb a {
789
+ font-size: 12px;
790
+ text-decoration: none;
791
+ margin: 0 2px;
792
+ }
793
+ .builder-ui .is-controlpanel .panelnav .part-breadcrumb span {
794
+ font-size: 10px;
795
+ display: inline-block;
796
+ margin: 0 2px;
797
+ }
798
+ .builder-ui .is-controlpanel .panelnav .part-breadcrumb svg {
799
+ width: 10px;
800
+ height: 10px;
801
+ }
802
+ .builder-ui .is-controlpanel .panelnav h3 {
803
+ font-family: sans-serif;
804
+ font-weight: 300;
805
+ font-size: 20px;
806
+ margin: 15px 0 12px;
807
+ }
808
+ .builder-ui .is-controlpanel [class^=panel-] {
809
+ display: none;
810
+ flex-direction: column;
811
+ }
812
+ .builder-ui .is-controlpanel [class^=panel-].active {
813
+ display: flex;
814
+ }
815
+ .builder-ui .is-controlpanel [class^=panel-].panel-section .submain, .builder-ui .is-controlpanel [class^=panel-].panel-box .submain {
816
+ padding: 0 24px 20px;
817
+ }
818
+ .builder-ui .is-controlpanel [class^=panel-] .submain {
819
+ padding: 0 24px 16px;
820
+ }
821
+ .builder-ui .is-controlpanel [class^=panel-] .subpanel {
822
+ padding: 14px 24px 15px;
823
+ }
824
+ .builder-ui .is-controlpanel [class^=panel-] .last .subpanel {
825
+ padding: 14px 24px 30px;
826
+ }
827
+ .builder-ui .is-controlpanel [class^=panel-] .subtitle {
828
+ font-weight: 600;
829
+ }
830
+ .builder-ui .is-controlpanel [class^=panel-].panel-pop {
831
+ position: fixed;
832
+ width: 132px;
833
+ height: auto;
834
+ background-color: #fff;
835
+ display: none;
836
+ border-radius: 4px;
837
+ overflow: hidden;
838
+ flex-wrap: wrap;
839
+ padding: 2px;
840
+ box-sizing: border-box;
841
+ flex: none;
842
+ flex-direction: row;
843
+ border: 1px solid #d1d1d1;
844
+ box-shadow: 2px 2px 4px 0px rgba(0, 0, 0, 0.08);
845
+ }
846
+ .builder-ui .is-controlpanel [class^=panel-].panel-pop button {
847
+ flex: none;
848
+ }
849
+ .builder-ui .is-controlpanel [class^=panel-].panel-pop.more {
850
+ width: auto;
851
+ flex-direction: column;
852
+ }
853
+ .builder-ui .is-controlpanel [class^=panel-].panel-pop.more > button {
854
+ padding: 0 20px;
855
+ width: auto;
856
+ }
857
+ .builder-ui .is-controlpanel [class^=panel-].panel-pop.more .label {
858
+ margin: 6px 0 0 0;
859
+ }
860
+ .builder-ui .is-controlpanel [class^=panel-].panel-pop.more div {
861
+ display: flex;
862
+ }
863
+ .builder-ui .is-controlpanel [class^=panel-].panel-pop.more div button {
864
+ flex: none;
865
+ }
866
+ .builder-ui .is-controlpanel [class^=panel-].panel-pop.more .plugins {
867
+ justify-content: center;
868
+ }
869
+ .builder-ui .is-controlpanel .panel-image .asset-preview img,
870
+ .builder-ui .is-controlpanel .panel-box .asset-preview img {
871
+ max-width: 130px;
872
+ max-height: 130px;
873
+ }
874
+ .builder-ui .is-controlpanel .panel-audio .asset-preview,
875
+ .builder-ui .is-controlpanel .panel-iframe .asset-preview {
876
+ width: 100%;
877
+ height: auto;
878
+ }
879
+ .builder-ui .is-controlpanel .panel-audio .asset-preview div,
880
+ .builder-ui .is-controlpanel .panel-iframe .asset-preview div {
881
+ margin-top: 0 !important;
882
+ }
883
+ .builder-ui .is-controlpanel .group.color-pick > div {
884
+ width: 36px;
885
+ display: flex;
886
+ padding: 1px;
887
+ align-items: center;
888
+ }
889
+ .builder-ui .is-controlpanel .group.color-pick > div button {
890
+ margin: 0;
891
+ border-radius: 6px;
892
+ z-index: 1;
893
+ width: 36px;
894
+ flex: none;
895
+ color: inherit;
896
+ }
897
+ .builder-ui .is-controlpanel .group.color-pick > div input {
898
+ width: 36px;
899
+ height: 34px;
900
+ border-radius: 6px;
901
+ font-weight: 200;
902
+ outline: none;
903
+ position: absolute;
904
+ padding: 0;
905
+ margin: 0;
906
+ cursor: pointer;
907
+ }
908
+ .builder-ui .is-controlpanel .group.fontsizes, .builder-ui .is-controlpanel .group.fontweight, .builder-ui .is-controlpanel .group.linespacing, .builder-ui .is-controlpanel .group.letterspacing {
909
+ width: 217px;
910
+ }
911
+ .builder-ui .is-controlpanel .group.listindent {
912
+ width: 175px;
913
+ }
914
+ .builder-ui .is-controlpanel .group.addcontent {
915
+ width: 222px;
916
+ }
917
+ .builder-ui .is-controlpanel .group.addcontent button {
918
+ width: 100%;
919
+ }
920
+ .builder-ui .is-controlpanel .group.removecontent {
921
+ width: 222px;
922
+ }
923
+ .builder-ui .is-controlpanel .group.removecontent button {
924
+ width: 100%;
925
+ }
926
+ .builder-ui .is-controlpanel .group.contentsize {
927
+ width: 222px;
928
+ }
929
+ .builder-ui .is-controlpanel .group.contentsize button {
930
+ width: 50px;
931
+ font-size: 12px;
932
+ }
933
+ .builder-ui .is-controlpanel .group.contentheight {
934
+ width: 222px;
935
+ flex-flow: wrap;
936
+ }
937
+ .builder-ui .is-controlpanel .group.contentheight > div:first-child {
938
+ display: flex;
939
+ flex-direction: row;
940
+ width: 100%;
941
+ }
942
+ .builder-ui .is-controlpanel .group.contentheight > div:nth-child(2) {
943
+ display: flex;
944
+ flex-direction: row;
945
+ width: 100%;
946
+ }
947
+ .builder-ui .is-controlpanel .group.contentheight button {
948
+ width: 100%;
949
+ }
950
+ .builder-ui .is-controlpanel .group.editmodule {
951
+ width: 222px;
952
+ margin-top: 16px;
953
+ }
954
+ .builder-ui .is-controlpanel .group.editmodule button {
955
+ width: 100%;
956
+ height: 39px;
957
+ background: rgb(135, 116, 215);
958
+ color: #fff;
959
+ }
960
+ .builder-ui .is-controlpanel .group.editmodule button svg {
961
+ fill: #fff;
962
+ }
963
+ .builder-ui .is-controlpanel .group.editmodule button:hover {
964
+ background: rgb(135, 116, 215);
965
+ }
966
+ .builder-ui .is-controlpanel .group.editspacing {
967
+ width: 222px;
968
+ }
969
+ .builder-ui .is-controlpanel .group.editspacing button {
970
+ width: 100%;
971
+ }
972
+ .builder-ui .is-controlpanel .group.contentspacing {
973
+ width: 218px;
974
+ }
975
+ .builder-ui .is-controlpanel .group.contentposition {
976
+ width: 112px;
977
+ flex-flow: wrap;
978
+ }
979
+ .builder-ui .is-controlpanel .group.contentposition button {
980
+ width: 33px;
981
+ height: 28px;
982
+ font-size: 10px;
983
+ }
984
+ .builder-ui .is-controlpanel .group.textcolor {
985
+ width: 218px;
986
+ flex-direction: row;
987
+ flex-wrap: nowrap;
988
+ }
989
+ .builder-ui .is-controlpanel .group.textcolor button {
990
+ width: 100%;
991
+ }
992
+ .builder-ui .is-controlpanel .group.sectionaction {
993
+ width: 175px;
994
+ }
995
+ .builder-ui .is-controlpanel .group.sectionheight {
996
+ width: 232px;
997
+ }
998
+ .builder-ui .is-controlpanel .group.sectionheight button {
999
+ width: 41px;
1000
+ height: 34px;
1001
+ font-size: 11px;
1002
+ }
1003
+ .builder-ui .is-controlpanel .group.sectionspacing {
1004
+ width: 230px;
1005
+ }
1006
+ .builder-ui .is-controlpanel .group.sectionspacing button {
1007
+ width: 33px;
1008
+ height: 32px;
1009
+ font-size: 12px;
1010
+ }
1011
+ .builder-ui .is-controlpanel .group.betweenbox {
1012
+ width: 215px;
1013
+ }
1014
+ .builder-ui .is-controlpanel .group.betweenbox button {
1015
+ width: 100px;
1016
+ }
1017
+ .builder-ui .is-controlpanel .group.boxesperline {
1018
+ width: 217px;
1019
+ }
1020
+ .builder-ui .is-controlpanel .group.animstart {
1021
+ width: 225px;
1022
+ }
1023
+ .builder-ui .is-controlpanel .group.animstart button {
1024
+ width: 105px;
1025
+ }
1026
+ .builder-ui .is-controlpanel .group.animend {
1027
+ width: 225px;
1028
+ }
1029
+ .builder-ui .is-controlpanel .group.animend button {
1030
+ width: 105px;
1031
+ }
1032
+ .builder-ui .is-controlpanel .group.scrollbuttons {
1033
+ width: 218px;
1034
+ }
1035
+ .builder-ui .is-controlpanel .group.colsperline {
1036
+ width: 175px;
1037
+ }
1038
+ .builder-ui .is-controlpanel .group.colsperline button[data-colsperline=""] {
1039
+ width: 79px;
1040
+ }
1041
+ .builder-ui .is-controlpanel .group.defaultparasize, .builder-ui .is-controlpanel .group.defaultlinespacing {
1042
+ width: 175px;
1043
+ }
1044
+ .builder-ui .is-controlpanel .group.contenttransparency {
1045
+ width: 132px;
1046
+ }
1047
+ .builder-ui .is-controlpanel .label.changedevice {
1048
+ display: flex;
1049
+ flex-direction: row;
1050
+ align-items: center;
1051
+ justify-content: space-between;
1052
+ width: 217px;
1053
+ }
1054
+ .builder-ui .is-controlpanel .label.changedevice .btn-device {
1055
+ width: 27px;
1056
+ height: 24px;
1057
+ }
1058
+ .builder-ui .is-controlpanel .label.changedevice .btn-device svg {
1059
+ width: 14px;
1060
+ height: 14px;
1061
+ flex: none;
1062
+ }
1063
+ .builder-ui .is-controlpanel .customtags .group > div {
1064
+ width: 216px;
1065
+ height: 111px;
1066
+ overflow-y: auto;
1067
+ overflow-x: hidden;
1068
+ }
1069
+ .builder-ui .is-controlpanel .customtags .group > div button {
1070
+ width: 100%;
1071
+ justify-content: flex-start;
1072
+ padding-left: 12px;
1073
+ }
1074
+ .builder-ui .is-controlpanel .imagesource input[type=text] {
1075
+ font-size: 13px;
1076
+ height: 40px;
1077
+ }
1078
+ .builder-ui .is-controlpanel .panel-dialog {
1079
+ width: 100%;
1080
+ position: fixed;
1081
+ top: 0;
1082
+ right: 0;
1083
+ width: 290px;
1084
+ height: 100%;
1085
+ display: none;
1086
+ background-color: #fff;
1087
+ overflow-y: auto;
1088
+ }
1089
+ .builder-ui .is-controlpanel .panel-dialog button.btn-back {
1090
+ width: 43px;
1091
+ height: 40px;
1092
+ }
1093
+ .builder-ui .is-controlpanel .panel-dialog button.btn-back svg {
1094
+ width: 22px;
1095
+ height: 22px;
1096
+ }
1097
+ .builder-ui .is-controlpanel .panel-dialog.icons > div {
1098
+ display: flex;
1099
+ flex-wrap: wrap;
1100
+ width: 100%;
1101
+ height: calc(100% - 40px);
1102
+ overflow-y: auto;
1103
+ }
1104
+ .builder-ui .is-controlpanel .panel-dialog.icons > div button {
1105
+ width: 63px;
1106
+ height: 60px;
1107
+ font-size: 24px;
1108
+ opacity: 0.9;
1109
+ }
1110
+ .builder-ui .is-controlpanel .panel-dialog.blocks > .choices {
1111
+ margin: 0;
1112
+ width: 100%;
1113
+ }
1114
+ .builder-ui .is-controlpanel .panel-dialog.blocks > .choices .choices__inner {
1115
+ padding-left: 15px;
1116
+ border: transparent 1px solid;
1117
+ }
1118
+ .builder-ui .is-controlpanel .panel-dialog.blocks > .choices .choices__list--dropdown .choices__item {
1119
+ padding-left: 20px;
1120
+ }
1121
+ .builder-ui .is-controlpanel .panel-dialog.blocks > .choices .choices__list--dropdown {
1122
+ border: #eaeaea 1px solid;
1123
+ }
1124
+ .builder-ui .is-controlpanel .panel-dialog.blocks .div-blocks {
1125
+ width: 100%;
1126
+ height: calc(100vh - 90px);
1127
+ overflow-y: auto;
1128
+ position: absolute;
1129
+ top: 90px;
1130
+ border-top: #efefef 1px solid;
1131
+ box-sizing: border-box;
1132
+ padding-bottom: 35px;
1133
+ }
1134
+ .builder-ui .is-controlpanel .panel-dialog.blocks .div-blocks > div {
1135
+ width: 212px;
1136
+ overflow: hidden;
1137
+ margin: 28px 0 0 34px;
1138
+ cursor: move;
1139
+ display: block;
1140
+ opacity: 1;
1141
+ outline: #d5d5d5 1px solid;
1142
+ box-shadow: 4px 5px 0px rgba(0, 0, 0, 0.03);
1143
+ position: relative;
1144
+ }
1145
+ .builder-ui .is-controlpanel .panel-dialog.blocks .div-blocks > div.hide {
1146
+ display: none;
1147
+ height: 0;
1148
+ opacity: 0;
1149
+ overflow: hidden;
1150
+ transition: height 350ms ease-in-out, opacity 750ms ease-in-out;
1151
+ }
1152
+ .builder-ui .is-controlpanel .panel-dialog.blocks .div-blocks > div img {
1153
+ box-shadow: none;
1154
+ display: block;
1155
+ transition: all 0.2s ease-in-out;
1156
+ box-sizing: border-box;
1157
+ width: 100%;
1158
+ }
1159
+ .builder-ui .is-controlpanel .panel-dialog.blocks .div-blocks > div .is-overlay {
1160
+ position: absolute;
1161
+ left: 0px;
1162
+ top: 0px;
1163
+ width: 100%;
1164
+ height: 100%;
1165
+ }
1166
+ .builder-ui .is-controlpanel .panel-dialog.blocks .div-blocks > div .is-overlay:after {
1167
+ background: rgba(0, 0, 0, 0.04);
1168
+ position: absolute;
1169
+ content: "";
1170
+ display: block;
1171
+ top: 0;
1172
+ left: 0;
1173
+ right: 0;
1174
+ bottom: 0;
1175
+ transition: all 0.3s ease-in-out;
1176
+ opacity: 0;
1177
+ }
1178
+ .builder-ui .is-controlpanel .panel-dialog.blocks .div-blocks > div:hover .is-overlay:after {
1179
+ opacity: 0.9;
1180
+ }
1181
+ .builder-ui .is-controlpanel .panel-dialog.blocks .div-blocks .snippet-item.sortable-drag:hover {
1182
+ background-color: rgba(0, 0, 0, 0.06);
1183
+ }
1184
+ .builder-ui .is-controlpanel .panel-dialog.element {
1185
+ overflow-y: auto;
1186
+ font-size: 13px;
1187
+ }
1188
+ .builder-ui .is-controlpanel .panel-dialog.element button.btn-back {
1189
+ flex: none;
1190
+ }
1191
+ .builder-ui .is-controlpanel .panel-dialog.element .submain {
1192
+ padding-bottom: 26px;
1193
+ }
1194
+ .builder-ui .is-controlpanel .panel-dialog.element .subpanel {
1195
+ padding-bottom: 26px;
1196
+ }
1197
+ .builder-ui .is-controlpanel .panel-dialog.element .subtitle {
1198
+ font-weight: 600;
1199
+ }
1200
+ .builder-ui .is-controlpanel .panel-dialog.element .part-breadcrumb {
1201
+ display: flex;
1202
+ flex-direction: row;
1203
+ margin-left: -1px;
1204
+ align-items: center;
1205
+ }
1206
+ .builder-ui .is-controlpanel .panel-dialog.element .part-breadcrumb a {
1207
+ font-size: 12px;
1208
+ text-decoration: none;
1209
+ margin: 0 2px;
1210
+ }
1211
+ .builder-ui .is-controlpanel .panel-dialog.element .part-breadcrumb svg {
1212
+ width: 10px;
1213
+ height: 10px;
1214
+ }
1215
+ .builder-ui .is-controlpanel .panel-dialog.element .part-element {
1216
+ font-size: 26px;
1217
+ }
1218
+ .builder-ui .is-controlpanel .panel-dialog.element .flex > *:first-child {
1219
+ width: 105px;
1220
+ margin-right: 15px;
1221
+ }
1222
+ .builder-ui .is-controlpanel .panel-dialog.element .flex > * > *:first-child {
1223
+ margin-bottom: 3px;
1224
+ margin-top: 16px;
1225
+ }
1226
+ .builder-ui .is-controlpanel .panel-dialog.element .unit > div {
1227
+ display: flex;
1228
+ align-items: center;
1229
+ justify-content: space-between;
1230
+ }
1231
+ .builder-ui .is-controlpanel .panel-dialog.element .unit .label {
1232
+ margin: 0;
1233
+ }
1234
+ .builder-ui .is-controlpanel .panel-dialog.element .group {
1235
+ margin-bottom: 5px;
1236
+ }
1237
+ .builder-ui .is-controlpanel .panel-dialog.element input, .builder-ui .is-controlpanel .panel-dialog.element select {
1238
+ width: 105px;
1239
+ }
1240
+ .builder-ui .is-controlpanel .panel-dialog.element div {
1241
+ flex: none;
1242
+ }
1243
+ .builder-ui .is-controlpanel .panel-dialog.element label, .builder-ui .is-controlpanel .panel-dialog.element .label {
1244
+ white-space: nowrap;
1245
+ }
1246
+ .builder-ui .is-controlpanel .panel-dialog.element a, .builder-ui .is-controlpanel .panel-dialog.element span {
1247
+ font-size: 13px;
1248
+ }
1249
+ .builder-ui .is-controlpanel .panel-dialog.element .is-btn-color {
1250
+ width: 35px;
1251
+ height: 33px;
1252
+ }
1253
+ .builder-ui .is-controlpanel .panel-dialog.shadow .div-shadow-list {
1254
+ display: flex;
1255
+ flex-direction: column;
1256
+ flex-flow: wrap;
1257
+ height: calc(100vh - 230px);
1258
+ max-height: 725px;
1259
+ overflow-y: auto;
1260
+ overflow-x: hidden;
1261
+ padding: 20px 0 0 20px;
1262
+ margin: 30px 0 0;
1263
+ border: rgba(177, 177, 177, 0.38) 1px solid;
1264
+ width: 100%;
1265
+ box-sizing: border-box;
1266
+ }
1267
+ .builder-ui .is-controlpanel .panel-dialog.shadow .div-shadow-list [data-shadow] {
1268
+ width: 75px;
1269
+ height: 70px;
1270
+ flex: none;
1271
+ margin: 0 20px 30px 0px;
1272
+ background: #fbfbfb;
1273
+ border-radius: 4px;
1274
+ }
1275
+ .builder-ui .is-modal {
1276
+ display: none;
1277
+ position: fixed;
1278
+ top: 0;
1279
+ left: 0;
1280
+ width: 100%;
1281
+ height: 100%;
1282
+ background: rgba(0, 0, 0, 0.03);
1283
+ z-index: 10007;
1284
+ }
1285
+ .builder-ui .modal-content {
1286
+ background: #fff;
1287
+ width: 100%;
1288
+ max-width: 600px;
1289
+ margin: 10% auto;
1290
+ padding: 0;
1291
+ border-radius: 5px;
1292
+ box-shadow: 6px 14px 20px 0px rgba(95, 95, 95, 0.08);
1293
+ }
1294
+
1295
+ .snippet-item {
1296
+ cursor: move !important;
1297
+ }
1298
+ .snippet-item.sortable-chosen {
1299
+ height: auto;
1300
+ }
1301
+ .snippet-item.sortable-chosen * {
1302
+ visibility: visible;
1303
+ }
1304
+ .snippet-item.sortable-chosen.sortable-drag * {
1305
+ visibility: hidden;
1306
+ transition: none !important;
1307
+ }
1308
+ .snippet-item.sortable-drag {
1309
+ outline: none !important;
1310
+ }
1311
+
1312
+ .choices {
1313
+ position: relative;
1314
+ margin-bottom: 24px;
1315
+ font-size: 16px;
1316
+ }
1317
+
1318
+ .choices:focus {
1319
+ outline: 0;
1320
+ }
1321
+
1322
+ .choices:last-child {
1323
+ margin-bottom: 0;
1324
+ }
1325
+
1326
+ .choices.is-disabled .choices__inner, .choices.is-disabled .choices__input {
1327
+ background-color: #eaeaea;
1328
+ cursor: not-allowed;
1329
+ -webkit-user-select: none;
1330
+ -ms-user-select: none;
1331
+ user-select: none;
1332
+ }
1333
+
1334
+ .choices.is-disabled .choices__item {
1335
+ cursor: not-allowed;
1336
+ }
1337
+
1338
+ .choices [hidden] {
1339
+ display: none !important;
1340
+ }
1341
+
1342
+ .choices[data-type*=select-one] {
1343
+ cursor: pointer;
1344
+ }
1345
+
1346
+ .choices[data-type*=select-one] .choices__inner {
1347
+ padding-bottom: 7.5px;
1348
+ }
1349
+
1350
+ .choices[data-type*=select-one] .choices__input {
1351
+ display: block;
1352
+ width: 100%;
1353
+ padding: 10px;
1354
+ border-bottom: 1px solid #ddd;
1355
+ background-color: #fff;
1356
+ margin: 0;
1357
+ }
1358
+
1359
+ .choices[data-type*=select-one] .choices__button {
1360
+ background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjEiIGhlaWdodD0iMjEiIHZpZXdCb3g9IjAgMCAyMSAyMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48ZyBmaWxsPSIjMDAwIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPjxwYXRoIGQ9Ik0yLjU5Mi4wNDRsMTguMzY0IDE4LjM2NC0yLjU0OCAyLjU0OEwuMDQ0IDIuNTkyeiIvPjxwYXRoIGQ9Ik0wIDE4LjM2NEwxOC4zNjQgMGwyLjU0OCAyLjU0OEwyLjU0OCAyMC45MTJ6Ii8+PC9nPjwvc3ZnPg==);
1361
+ padding: 0;
1362
+ background-size: 8px;
1363
+ position: absolute;
1364
+ top: 50%;
1365
+ right: 0;
1366
+ margin-top: -10px;
1367
+ margin-right: 25px;
1368
+ height: 20px;
1369
+ width: 20px;
1370
+ border-radius: 10em;
1371
+ opacity: 0.5;
1372
+ }
1373
+
1374
+ .choices[data-type*=select-one] .choices__button:focus, .choices[data-type*=select-one] .choices__button:hover {
1375
+ opacity: 1;
1376
+ }
1377
+
1378
+ .choices[data-type*=select-one] .choices__button:focus {
1379
+ box-shadow: 0 0 0 2px #00bcd4;
1380
+ }
1381
+
1382
+ .choices[data-type*=select-one] .choices__item[data-value=""] .choices__button {
1383
+ display: none;
1384
+ }
1385
+
1386
+ .choices[data-type*=select-one]:after {
1387
+ content: "";
1388
+ height: 0;
1389
+ width: 0;
1390
+ border-style: solid;
1391
+ border-color: #333 transparent transparent;
1392
+ border-width: 5px;
1393
+ position: absolute;
1394
+ right: 11.5px;
1395
+ top: 50%;
1396
+ margin-top: -2.5px;
1397
+ pointer-events: none;
1398
+ }
1399
+
1400
+ .choices[data-type*=select-one].is-open:after {
1401
+ border-color: transparent transparent #333;
1402
+ margin-top: -7.5px;
1403
+ }
1404
+
1405
+ .choices[data-type*=select-one][dir=rtl]:after {
1406
+ left: 11.5px;
1407
+ right: auto;
1408
+ }
1409
+
1410
+ .choices[data-type*=select-one][dir=rtl] .choices__button {
1411
+ right: auto;
1412
+ left: 0;
1413
+ margin-left: 25px;
1414
+ margin-right: 0;
1415
+ }
1416
+
1417
+ .choices[data-type*=select-multiple] .choices__inner, .choices[data-type*=text] .choices__inner {
1418
+ cursor: text;
1419
+ }
1420
+
1421
+ .choices[data-type*=select-multiple] .choices__button, .choices[data-type*=text] .choices__button {
1422
+ position: relative;
1423
+ display: inline-block;
1424
+ margin: 0 -4px 0 8px;
1425
+ padding-left: 16px;
1426
+ border-left: 1px solid #008fa1;
1427
+ background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjEiIGhlaWdodD0iMjEiIHZpZXdCb3g9IjAgMCAyMSAyMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48ZyBmaWxsPSIjRkZGIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPjxwYXRoIGQ9Ik0yLjU5Mi4wNDRsMTguMzY0IDE4LjM2NC0yLjU0OCAyLjU0OEwuMDQ0IDIuNTkyeiIvPjxwYXRoIGQ9Ik0wIDE4LjM2NEwxOC4zNjQgMGwyLjU0OCAyLjU0OEwyLjU0OCAyMC45MTJ6Ii8+PC9nPjwvc3ZnPg==);
1428
+ background-size: 8px;
1429
+ width: 8px;
1430
+ line-height: 1;
1431
+ opacity: 0.75;
1432
+ border-radius: 0;
1433
+ }
1434
+
1435
+ .choices[data-type*=select-multiple] .choices__button:focus, .choices[data-type*=select-multiple] .choices__button:hover, .choices[data-type*=text] .choices__button:focus, .choices[data-type*=text] .choices__button:hover {
1436
+ opacity: 1;
1437
+ }
1438
+
1439
+ .choices__inner {
1440
+ display: inline-block;
1441
+ vertical-align: top;
1442
+ width: 100%;
1443
+ background-color: #f9f9f9;
1444
+ padding: 7.5px 7.5px 3.75px;
1445
+ border: 1px solid #ddd;
1446
+ border-radius: 2.5px;
1447
+ font-size: 14px;
1448
+ min-height: 44px;
1449
+ overflow: hidden;
1450
+ }
1451
+
1452
+ .is-focused .choices__inner, .is-open .choices__inner {
1453
+ border-color: #b7b7b7;
1454
+ }
1455
+
1456
+ .is-open .choices__inner {
1457
+ border-radius: 2.5px 2.5px 0 0;
1458
+ }
1459
+
1460
+ .is-flipped.is-open .choices__inner {
1461
+ border-radius: 0 0 2.5px 2.5px;
1462
+ }
1463
+
1464
+ .choices__list {
1465
+ margin: 0;
1466
+ padding-left: 0;
1467
+ list-style: none;
1468
+ }
1469
+
1470
+ .choices__list--single {
1471
+ display: inline-block;
1472
+ padding: 4px 16px 4px 4px;
1473
+ width: 100%;
1474
+ }
1475
+
1476
+ [dir=rtl] .choices__list--single {
1477
+ padding-right: 4px;
1478
+ padding-left: 16px;
1479
+ }
1480
+
1481
+ .choices__list--single .choices__item {
1482
+ width: 100%;
1483
+ }
1484
+
1485
+ .choices__list--multiple {
1486
+ display: inline;
1487
+ }
1488
+
1489
+ .choices__list--multiple .choices__item {
1490
+ display: inline-block;
1491
+ vertical-align: middle;
1492
+ border-radius: 20px;
1493
+ padding: 4px 10px;
1494
+ font-size: 12px;
1495
+ font-weight: 500;
1496
+ margin-right: 3.75px;
1497
+ margin-bottom: 3.75px;
1498
+ background-color: #00bcd4;
1499
+ border: 1px solid #00a5bb;
1500
+ color: #fff;
1501
+ word-break: break-all;
1502
+ box-sizing: border-box;
1503
+ }
1504
+
1505
+ .choices__list--multiple .choices__item[data-deletable] {
1506
+ padding-right: 5px;
1507
+ }
1508
+
1509
+ [dir=rtl] .choices__list--multiple .choices__item {
1510
+ margin-right: 0;
1511
+ margin-left: 3.75px;
1512
+ }
1513
+
1514
+ .choices__list--multiple .choices__item.is-highlighted {
1515
+ background-color: #00a5bb;
1516
+ border: 1px solid #008fa1;
1517
+ }
1518
+
1519
+ .is-disabled .choices__list--multiple .choices__item {
1520
+ background-color: #aaa;
1521
+ border: 1px solid #919191;
1522
+ }
1523
+
1524
+ .choices__list--dropdown {
1525
+ visibility: hidden;
1526
+ z-index: 1;
1527
+ position: absolute;
1528
+ width: 100%;
1529
+ background-color: #fff;
1530
+ border: 1px solid #ddd;
1531
+ top: 100%;
1532
+ margin-top: -1px;
1533
+ border-bottom-left-radius: 2.5px;
1534
+ border-bottom-right-radius: 2.5px;
1535
+ overflow: hidden;
1536
+ word-break: break-all;
1537
+ will-change: visibility;
1538
+ }
1539
+
1540
+ .choices__list--dropdown.is-active {
1541
+ visibility: visible;
1542
+ }
1543
+
1544
+ .is-open .choices__list--dropdown {
1545
+ border-color: #b7b7b7;
1546
+ }
1547
+
1548
+ .is-flipped .choices__list--dropdown {
1549
+ top: auto;
1550
+ bottom: 100%;
1551
+ margin-top: 0;
1552
+ margin-bottom: -1px;
1553
+ border-radius: 0.25rem 0.25rem 0 0;
1554
+ }
1555
+
1556
+ .choices__list--dropdown .choices__list {
1557
+ position: relative;
1558
+ max-height: 300px;
1559
+ overflow: auto;
1560
+ -webkit-overflow-scrolling: touch;
1561
+ will-change: scroll-position;
1562
+ }
1563
+
1564
+ .choices__list--dropdown .choices__item {
1565
+ position: relative;
1566
+ padding: 10px;
1567
+ font-size: 14px;
1568
+ }
1569
+
1570
+ [dir=rtl] .choices__list--dropdown .choices__item {
1571
+ text-align: right;
1572
+ }
1573
+
1574
+ @media (min-width: 640px) {
1575
+ .choices__list--dropdown .choices__item--selectable {
1576
+ padding-right: 100px;
1577
+ }
1578
+
1579
+ .choices__list--dropdown .choices__item--selectable:after {
1580
+ content: attr(data-select-text);
1581
+ font-size: 12px;
1582
+ opacity: 0;
1583
+ position: absolute;
1584
+ right: 10px;
1585
+ top: 50%;
1586
+ transform: translateY(-50%);
1587
+ }
1588
+
1589
+ [dir=rtl] .choices__list--dropdown .choices__item--selectable {
1590
+ text-align: right;
1591
+ padding-left: 100px;
1592
+ padding-right: 10px;
1593
+ }
1594
+
1595
+ [dir=rtl] .choices__list--dropdown .choices__item--selectable:after {
1596
+ right: auto;
1597
+ left: 10px;
1598
+ }
1599
+ }
1600
+ .choices__list--dropdown .choices__item--selectable.is-highlighted {
1601
+ background-color: #f2f2f2;
1602
+ }
1603
+
1604
+ .choices__list--dropdown .choices__item--selectable.is-highlighted:after {
1605
+ opacity: 0.5;
1606
+ }
1607
+
1608
+ .choices__item {
1609
+ cursor: default;
1610
+ }
1611
+
1612
+ .choices__item--selectable {
1613
+ cursor: pointer;
1614
+ }
1615
+
1616
+ .choices__item--disabled {
1617
+ cursor: not-allowed;
1618
+ -webkit-user-select: none;
1619
+ -ms-user-select: none;
1620
+ user-select: none;
1621
+ opacity: 0.5;
1622
+ }
1623
+
1624
+ .choices__heading {
1625
+ font-weight: 600;
1626
+ font-size: 12px;
1627
+ padding: 10px;
1628
+ border-bottom: 1px solid #f7f7f7;
1629
+ color: gray;
1630
+ }
1631
+
1632
+ .choices__button {
1633
+ text-indent: -9999px;
1634
+ -webkit-appearance: none;
1635
+ -moz-appearance: none;
1636
+ appearance: none;
1637
+ border: 0;
1638
+ background-color: transparent;
1639
+ background-repeat: no-repeat;
1640
+ background-position: center;
1641
+ cursor: pointer;
1642
+ }
1643
+
1644
+ .choices__button:focus, .choices__input:focus {
1645
+ outline: 0;
1646
+ }
1647
+
1648
+ .choices__input {
1649
+ display: inline-block;
1650
+ vertical-align: baseline;
1651
+ background-color: #f9f9f9;
1652
+ font-size: 14px;
1653
+ margin-bottom: 5px;
1654
+ border: 0;
1655
+ border-radius: 0;
1656
+ max-width: 100%;
1657
+ padding: 4px 0 4px 2px;
1658
+ }
1659
+
1660
+ [dir=rtl] .choices__input {
1661
+ padding-right: 2px;
1662
+ padding-left: 0;
1663
+ }
1664
+
1665
+ .choices__placeholder {
1666
+ opacity: 0.5;
1667
+ }
1668
+
1669
+ .choices {
1670
+ display: flex;
1671
+ width: 100%;
1672
+ }
1673
+
1674
+ .choices__list--single .choices__item {
1675
+ display: flex;
1676
+ }
1677
+
1678
+ .choices__inner {
1679
+ height: 40px;
1680
+ border-radius: 5px;
1681
+ background: transparent;
1682
+ }
1683
+
1684
+ .choices__list--dropdown {
1685
+ box-sizing: border-box;
1686
+ }
1687
+
1688
+ .choices__inner {
1689
+ padding: 0 10px;
1690
+ }
1691
+
1692
+ .choices[data-type*=select-one] .choices__inner {
1693
+ padding: 0 8px 0 2px;
1694
+ display: flex;
1695
+ align-items: center;
1696
+ }
1697
+
1698
+ .choices__list--single .choices__item img {
1699
+ height: 25px;
1700
+ margin-top: 3px;
1701
+ }
1702
+
1703
+ .choices__list--dropdown .choices__item {
1704
+ display: flex;
1705
+ align-items: center;
1706
+ justify-content: flex-start;
1707
+ }
1708
+
1709
+ .choices__list--dropdown .choices__item img {
1710
+ height: 25px;
1711
+ }
1712
+
1713
+ .choices__list--dropdown .choices__item--selectable {
1714
+ padding-right: 0;
1715
+ }
1716
+
1717
+ .is-focused .choices__inner,
1718
+ .is-open .choices__inner,
1719
+ .is-open .choices__list--dropdown {
1720
+ border-color: #e1e1e1;
1721
+ }
1722
+
1723
+ .choices[data-type*=select-one]:after {
1724
+ border-top-color: #444;
1725
+ }
1726
+
1727
+ .choices[data-type*=select-one].is-open:after {
1728
+ border-bottom-color: #444;
1729
+ }
1730
+
1731
+ input.clr-color:focus {
1732
+ border: #3e93f7 2px solid !important;
1733
+ }
1734
+
1735
+ .clr-swatches button:after {
1736
+ box-shadow: none !important;
1737
+ }
1738
+
1739
+ .clr-swatches {
1740
+ width: 100% !important;
1741
+ margin: 0 9px 9px !important;
1742
+ }
1743
+
1744
+ .clr-swatches div {
1745
+ border-radius: 5px !important;
1746
+ overflow: hidden !important;
1747
+ width: 182px !important;
1748
+ padding: 0 !important;
1749
+ }
1750
+
1751
+ .clr-swatches button {
1752
+ width: 30px !important;
1753
+ height: 28px !important;
1754
+ margin: 0 !important;
1755
+ padding: 0 !important;
1756
+ border-radius: 0 !important;
1757
+ }
1758
+
1759
+ .clr-swatches.sm button {
1760
+ width: 26px !important;
1761
+ height: 24px !important;
1762
+ }
1763
+
1764
+ .clr-preview {
1765
+ margin: 15px 0 0px 20px !important;
1766
+ }
1767
+
1768
+ input.clr-color {
1769
+ margin: 15px 20px 14px auto !important;
1770
+ }
1771
+
1772
+ .clr-swatches button, .clr-preview:before, .clr-field button {
1773
+ background-image: repeating-linear-gradient(45deg, #ddd 25%, transparent 25%, transparent 75%, #ddd 75%, #ddd), repeating-linear-gradient(45deg, #ddd 25%, #fff 25%, #fff 75%, #ddd 75%, #ddd) !important;
1774
+ }
1775
+
1776
+ .clr-alpha, .clr-alpha div {
1777
+ background-image: repeating-linear-gradient(45deg, #bbb 25%, transparent 25%, transparent 75%, #bbb 75%, #bbb), repeating-linear-gradient(45deg, #bbb 25%, #fff 25%, #fff 75%, #bbb 75%, #bbb) !important;
1778
+ }
1779
+
1780
+ .is-rangeslider {
1781
+ -webkit-appearance: none;
1782
+ width: 100%;
1783
+ height: 24px;
1784
+ background: #e3e3e3;
1785
+ outline: none;
1786
+ border: none !important;
1787
+ opacity: 1;
1788
+ -webkit-transition: 0.2s;
1789
+ transition: opacity 0.2s;
1790
+ margin: 2px !important;
1791
+ border-radius: 2px !important;
1792
+ }
1793
+ .is-rangeslider:hover {
1794
+ opacity: 1;
1795
+ }
1796
+ .is-rangeslider:focus {
1797
+ outline: #3e93f7 2px solid;
1798
+ outline-offset: 2px;
1799
+ }
1800
+ .is-rangeslider::-webkit-slider-thumb {
1801
+ -webkit-appearance: none;
1802
+ appearance: none;
1803
+ width: 25px !important;
1804
+ height: 24px !important;
1805
+ border-radius: 3px !important;
1806
+ background: #0e75de;
1807
+ cursor: pointer;
1808
+ margin: 0 !important;
1809
+ }
1810
+ .is-rangeslider::-moz-range-thumb {
1811
+ width: 25px !important;
1812
+ height: 24px !important;
1813
+ border-radius: 3px !important;
1814
+ background: #0e75de;
1815
+ cursor: pointer;
1816
+ margin: 0 !important;
1817
+ }
1818
+ .is-rangeslider::-webkit-slider-runnable-track {
1819
+ height: auto !important;
1820
+ background: none !important;
1821
+ border: none !important;
1822
+ }
1823
+
1824
+ /* Add top space of 55px */
1825
+ :root {
1826
+ --topspace: 55px;
1827
+ }
1828
+
1829
+ body.topspace .builder-ui .is-controlpanel,
1830
+ body.topspace .builder-ui .is-controlpanel .panel-dialog {
1831
+ height: calc(100vh - var(--topspace));
1832
+ top: var(--topspace);
1833
+ }
1834
+
1835
+ body.topspace .is-content-view {
1836
+ margin-top: calc(6vh + var(--topspace)) !important;
1837
+ }
1838
+
1839
+ /*
1840
+ body.topspace {
1841
+ @media all and (min-width: 2000px) { // 2560 x 1238
1842
+ .is-content-view.desktop {
1843
+ width: 1620px;
1844
+ height: 1012px;
1845
+ transform: scale(1);
1846
+ }
1847
+ }
1848
+ @media all and (max-width: 1720px) { // 1679x865
1849
+ .is-content-view {
1850
+ transform: scale(0.83)
1851
+ }
1852
+ }
1853
+ }
1854
+ body.topspace.controlpanel {
1855
+ @media all and (min-width: 2250px) { // 2560 x 1238
1856
+ .is-content-view.desktop {
1857
+ width: 1620px;
1858
+ height: 1012px;
1859
+ transform: scale(1);
1860
+ }
1861
+ }
1862
+ @media all and (max-width: 1680px) { // 1679x865
1863
+ .is-content-view {
1864
+ transform: scale(0.83)
1865
+ }
1866
+ }
1867
+ }
1868
+ */
1869
+ body.topspace .is-content-view.fullview iframe {
1870
+ height: calc(100vh - var(--topspace));
1871
+ top: var(--topspace);
1872
+ }
1873
+
1874
+ body.topspace .is-sidebar {
1875
+ height: calc(100vh - var(--topspace)) !important;
1876
+ top: var(--topspace) !important;
1877
+ border-right: #e7e7e7 1px solid;
1878
+ }
1879
+
1880
+ body.topspace .is-sidebar-content {
1881
+ height: calc(100vh - var(--topspace)) !important;
1882
+ top: var(--topspace) !important;
1883
+ border: #e7e7e7 1px solid;
1884
+ }
1885
+
1886
+ body.dark.topspace .is-sidebar {
1887
+ border-right: none;
1888
+ }
1889
+
1890
+ body.dark.topspace .is-sidebar-content {
1891
+ border: none;
1892
+ }
1893
+
1894
+ .custom-topbar {
1895
+ display: none;
1896
+ justify-content: center;
1897
+ align-items: center;
1898
+ box-sizing: border-box;
1899
+ padding: 0;
1900
+ position: fixed;
1901
+ top: 0;
1902
+ left: 0;
1903
+ width: 100vw;
1904
+ height: var(--topspace);
1905
+ background: #fff;
1906
+ z-index: 10;
1907
+ }
1908
+
1909
+ body.topspace .custom-topbar {
1910
+ display: flex;
1911
+ }
1912
+
1913
+ .custom-topbar div {
1914
+ display: flex;
1915
+ align-items: center;
1916
+ }
1917
+
1918
+ .custom-topbar > div:first-child {
1919
+ position: fixed;
1920
+ top: 0;
1921
+ left: 30px;
1922
+ height: var(--topspace);
1923
+ }
1924
+
1925
+ .custom-topbar > div:nth-child(3) {
1926
+ position: fixed;
1927
+ top: 0;
1928
+ right: 16px;
1929
+ height: var(--topspace);
1930
+ }
1931
+
1932
+ .custom-topbar > div:nth-child(2) {
1933
+ margin-left: 45px;
1934
+ transition: all 0.3s ease;
1935
+ }
1936
+
1937
+ body.controlpanel .custom-topbar > div:nth-child(2) {
1938
+ margin-left: -245px;
1939
+ }
1940
+
1941
+ .custom-topbar button {
1942
+ width: auto;
1943
+ height: 33px;
1944
+ padding: 0px 16px;
1945
+ border-radius: 30px;
1946
+ margin: 0 3px;
1947
+ }
1948
+
1949
+ .dark .custom-topbar {
1950
+ background: rgb(24, 24, 24);
1951
+ }
1952
+
1953
+ .custom-topbar .separator {
1954
+ width: 2px;
1955
+ height: 35px;
1956
+ border-right: #cecece 1px solid;
1957
+ margin: 0 10px;
1958
+ }
1959
+
1960
+ .dark .custom-topbar .separator {
1961
+ border-right: #898989 1px solid;
1962
+ }
1963
+
1964
+ /* Centered IFrame */
1965
+ body.frame-center #editPanel {
1966
+ justify-content: center !important;
1967
+ }
1968
+
1969
+ body.frame-center .is-content-view {
1970
+ margin-top: 25px !important;
1971
+ transform-origin: center !important;
1972
+ }
1973
+
1974
+ body.frame-center.controlpanel .is-content-view {
1975
+ margin-top: 25px !important;
1976
+ transform-origin: center !important;
1977
+ }
1978
+
1979
+ /* /CONTROL PANEL */
1980
+ /* THEME */
1981
+ #_cbhtml .is-side button:hover, .is-ui .is-side button:hover {
1982
+ background-color: rgb(237, 237, 237) !important;
1983
+ }
1984
+ #_cbhtml .is-side button.on, .is-ui .is-side button.on {
1985
+ background-color: rgb(237, 237, 237) !important;
1986
+ }
1987
+
1988
+ .colored #_cbhtml .is-responsive-toolbar, .colored .is-ui .is-responsive-toolbar,
1989
+ .colored-dark #_cbhtml .is-responsive-toolbar,
1990
+ .colored-dark .is-ui .is-responsive-toolbar,
1991
+ .light #_cbhtml .is-responsive-toolbar,
1992
+ .light .is-ui .is-responsive-toolbar {
1993
+ background: transparent !important;
1994
+ }
1995
+ .colored #_cbhtml .is-responsive-toolbar button, .colored .is-ui .is-responsive-toolbar button,
1996
+ .colored-dark #_cbhtml .is-responsive-toolbar button,
1997
+ .colored-dark .is-ui .is-responsive-toolbar button,
1998
+ .light #_cbhtml .is-responsive-toolbar button,
1999
+ .light .is-ui .is-responsive-toolbar button {
2000
+ color: #121212 !important;
2001
+ background: transparent !important;
2002
+ }
2003
+ .colored #_cbhtml .is-responsive-toolbar button.active,
2004
+ .colored #_cbhtml .is-responsive-toolbar button:hover, .colored .is-ui .is-responsive-toolbar button.active,
2005
+ .colored .is-ui .is-responsive-toolbar button:hover,
2006
+ .colored-dark #_cbhtml .is-responsive-toolbar button.active,
2007
+ .colored-dark #_cbhtml .is-responsive-toolbar button:hover,
2008
+ .colored-dark .is-ui .is-responsive-toolbar button.active,
2009
+ .colored-dark .is-ui .is-responsive-toolbar button:hover,
2010
+ .light #_cbhtml .is-responsive-toolbar button.active,
2011
+ .light #_cbhtml .is-responsive-toolbar button:hover,
2012
+ .light .is-ui .is-responsive-toolbar button.active,
2013
+ .light .is-ui .is-responsive-toolbar button:hover {
2014
+ background-color: rgba(192, 192, 192, 0.3607843137) !important;
2015
+ }
2016
+
2017
+ .dark #_cbhtml .is-side, .dark .is-ui .is-side {
2018
+ color: #d3d3d3 !important;
2019
+ background: #181818 !important;
2020
+ }
2021
+ .dark #_cbhtml .is-side button, .dark .is-ui .is-side button {
2022
+ color: #d3d3d3 !important;
2023
+ background: transparent !important;
2024
+ }
2025
+ .dark #_cbhtml .is-side button:hover, .dark .is-ui .is-side button:hover {
2026
+ background-color: rgb(69, 69, 69) !important;
2027
+ }
2028
+ .dark #_cbhtml .is-side button.on, .dark .is-ui .is-side button.on {
2029
+ background-color: rgb(69, 69, 69) !important;
2030
+ }
2031
+ .dark #_cbhtml .is-side input[type=text], .dark #_cbhtml .is-side textarea, .dark .is-ui .is-side input[type=text], .dark .is-ui .is-side textarea {
2032
+ color: #c7c7c7 !important;
2033
+ background-color: #313131 !important;
2034
+ }
2035
+ .dark #_cbhtml .is-side input[type=checkbox], .dark .is-ui .is-side input[type=checkbox] {
2036
+ opacity: 0.7 !important;
2037
+ }
2038
+ .dark #_cbhtml .is-side select, .dark .is-ui .is-side select {
2039
+ color: #c7c7c7 !important;
2040
+ background-color: #313131 !important;
2041
+ }
2042
+ .dark #_cbhtml .is-sidebar.is-area, .dark .is-ui .is-sidebar.is-area {
2043
+ background: #181818 !important;
2044
+ }
2045
+ .dark #_cbhtml .is-sidebar.is-area button svg, .dark .is-ui .is-sidebar.is-area button svg {
2046
+ fill: #d3d3d3 !important;
2047
+ }
2048
+ .dark #_cbhtml .is-rangeslider, .dark .is-ui .is-rangeslider {
2049
+ background: #545454 !important;
2050
+ }
2051
+ .dark #_cbhtml .is-area-2nd, .dark #_cbhtml #divSidebarTypography, .dark .is-ui .is-area-2nd, .dark .is-ui #divSidebarTypography {
2052
+ background: #535353 !important;
2053
+ }
2054
+ .dark #_cbhtml #divSidebarSnippets, .dark #_cbhtml #divStyles, .dark .is-ui #divSidebarSnippets, .dark .is-ui #divStyles {
2055
+ background: #717171 !important;
2056
+ }
2057
+ .dark #_cbhtml .is-sidebar-content .is-dropdown .dropdown-toggle, .dark .is-ui .is-sidebar-content .is-dropdown .dropdown-toggle {
2058
+ color: #c7c7c7 !important;
2059
+ background-color: #464646 !important;
2060
+ }
2061
+ .dark #_cbhtml .is-dropdown .dropdown-toggle::after, .dark .is-ui .is-dropdown .dropdown-toggle::after {
2062
+ border-top-color: #9b9b9b !important;
2063
+ border-bottom-color: transparent !important;
2064
+ }
2065
+ .dark #_cbhtml .is-dropdown .dropdown-toggle.active::after, .dark .is-ui .is-dropdown .dropdown-toggle.active::after {
2066
+ border-bottom-color: #a0a0a0 !important;
2067
+ border-top-color: transparent !important;
2068
+ }
2069
+ .dark #_cbhtml .is-dropdown .dropdown-menu, .dark .is-ui .is-dropdown .dropdown-menu {
2070
+ background-color: #bbb !important;
2071
+ }
2072
+ .dark #_cbhtml .is-dropdown .dropdown-menu li, .dark .is-ui .is-dropdown .dropdown-menu li {
2073
+ background-color: transparent !important;
2074
+ }
2075
+ .dark #_cbhtml .is-dropdown .dropdown-menu li.selected, .dark .is-ui .is-dropdown .dropdown-menu li.selected {
2076
+ background-color: rgba(161, 160, 160, 0.6509803922) !important;
2077
+ }
2078
+ .dark #_cbhtml .is-dropdown .dropdown-menu li:hover, .dark #_cbhtml .is-dropdown .dropdown-menu li:focus, .dark .is-ui .is-dropdown .dropdown-menu li:hover, .dark .is-ui .is-dropdown .dropdown-menu li:focus {
2079
+ background-color: rgba(161, 160, 160, 0.6509803922) !important;
2080
+ }
2081
+ .dark #_cbhtml .anim-preset-list button img, .dark .is-ui .anim-preset-list button img {
2082
+ opacity: 0.3 !important;
2083
+ }
2084
+ .dark .is-responsive-toolbar {
2085
+ background: transparent !important;
2086
+ }
2087
+ .dark #editPanel, .dark .is-content-view {
2088
+ background: #a3a3a3;
2089
+ }
2090
+ .dark .is-content-view > div {
2091
+ background: #5d5d5d;
2092
+ }
2093
+ .dark .is-content-view iframe {
2094
+ opacity: 0.97;
2095
+ }
2096
+ .dark .builder-ui {
2097
+ color: #d3d3d3;
2098
+ }
2099
+ .dark .builder-ui a {
2100
+ color: #d3d3d3;
2101
+ }
2102
+ .dark .builder-ui svg {
2103
+ fill: #d3d3d3;
2104
+ }
2105
+ .dark .builder-ui .part-breadcrumb svg {
2106
+ width: 17px;
2107
+ height: 17px;
2108
+ }
2109
+ .dark .builder-ui button {
2110
+ color: #d3d3d3;
2111
+ }
2112
+ .dark .builder-ui button svg {
2113
+ color: #fff;
2114
+ }
2115
+ .dark .builder-ui button.is-btn-color {
2116
+ border: 1px solid transparent;
2117
+ }
2118
+ .dark .builder-ui button.on {
2119
+ background-color: rgb(69, 69, 69);
2120
+ }
2121
+ .dark .builder-ui button:not(.is-btn-color):hover {
2122
+ background-color: rgb(69, 69, 69);
2123
+ }
2124
+ .dark .builder-ui .label {
2125
+ color: #d3d3d3;
2126
+ }
2127
+ .dark .builder-ui input[type=text], .dark .builder-ui textarea {
2128
+ color: #c7c7c7;
2129
+ background-color: #313131;
2130
+ }
2131
+ .dark .builder-ui input[type=checkbox] {
2132
+ opacity: 0.7;
2133
+ }
2134
+ .dark .builder-ui select {
2135
+ color: #c7c7c7;
2136
+ background-color: #313131;
2137
+ }
2138
+ .dark .builder-ui .group {
2139
+ border: 1px solid #444;
2140
+ }
2141
+ .dark .builder-ui .accordion-item {
2142
+ background-color: #353535;
2143
+ }
2144
+ .dark .builder-ui .is-controlpanel {
2145
+ background-color: rgb(24, 24, 24);
2146
+ }
2147
+ .dark .builder-ui .is-controlpanel [class^=panel-].panel-pop {
2148
+ background-color: rgb(24, 24, 24);
2149
+ border: #6f6f6f 1px solid;
2150
+ }
2151
+ .dark .builder-ui .is-controlpanel .group.color-pick > div button {
2152
+ background: repeating-linear-gradient(45deg, #aaa 25%, transparent 25%, transparent 75%, #aaa 75%, #aaa), repeating-linear-gradient(45deg, #aaa 25%, #fff 25%, #fff 75%, #aaa 75%, #aaa);
2153
+ }
2154
+ .dark .builder-ui .is-controlpanel .panel-dialog {
2155
+ background-color: rgb(24, 24, 24);
2156
+ }
2157
+ .dark .builder-ui .is-controlpanel .panel-dialog.blocks > .choices .choices__list--dropdown {
2158
+ border: #eaeaea 1px solid;
2159
+ }
2160
+ .dark .builder-ui .is-controlpanel .panel-dialog.blocks .div-blocks {
2161
+ border-top: #efefef 1px solid;
2162
+ }
2163
+ .dark .builder-ui .is-controlpanel .panel-dialog.blocks .div-blocks > div {
2164
+ outline: #d5d5d5 1px solid;
2165
+ }
2166
+ .dark .choices__list--dropdown {
2167
+ background-color: #343434;
2168
+ }
2169
+ .dark .choices__inner,
2170
+ .dark .is-focused .choices__inner,
2171
+ .dark .is-open .choices__inner,
2172
+ .dark .is-open .choices__list--dropdown {
2173
+ border-color: #646464 !important;
2174
+ }
2175
+ .dark .choices[data-type*=select-one]:after {
2176
+ border-top-color: #c7c7c7;
2177
+ }
2178
+ .dark .choices[data-type*=select-one].is-open:after {
2179
+ border-top-color: transparent;
2180
+ }
2181
+ .dark .choices[data-type*=select-one].is-open:after {
2182
+ border-bottom-color: #c7c7c7;
2183
+ }
2184
+ .dark .choices__list--single .choices__item img {
2185
+ mix-blend-mode: screen;
2186
+ filter: invert(1);
2187
+ }
2188
+ .dark .choices__list--dropdown .choices__item--selectable img {
2189
+ mix-blend-mode: screen;
2190
+ filter: invert(1);
2191
+ }
2192
+ .dark .choices__list--dropdown .choices__item--selectable {
2193
+ background-color: inherit;
2194
+ }
2195
+ .dark .choices[data-type*=select-one] .choices__input {
2196
+ border-bottom: 1px solid #646464;
2197
+ background-color: inherit;
2198
+ color: #c7c7c7;
2199
+ }
2200
+ .dark .choices__list--dropdown .choices__item--selectable.is-highlighted {
2201
+ background-color: rgb(77, 75, 75);
2202
+ }
2203
+
2204
+ /* /THEME */
2205
+ /* Control Panel */
2206
+ /*
2207
+
2208
+ body.controlpanel {
2209
+ .is-controlpanel {
2210
+ right: 0px !important;
2211
+ box-shadow: rgba(0, 0, 0, 0.05) 0 0 16px 0px !important;
2212
+ }
2213
+ }
2214
+
2215
+ #_cbhtml .is-side.is-controlpanel {
2216
+ position: fixed;
2217
+ width:290px !important;
2218
+ height:100vh;
2219
+ display: flex !important;
2220
+ top:0 !important;
2221
+ right: -290px;
2222
+ left: auto !important;
2223
+ z-index:1 !important;
2224
+ display:flex;
2225
+ overflow-y: auto !important;
2226
+ flex-direction: column;
2227
+ transition: all 0.3s ease;
2228
+ box-shadow: none;
2229
+
2230
+ & > button.btn-close {
2231
+ width: 43px !important;
2232
+ height: 40px !important;
2233
+ border-radius: 5px !important;
2234
+ svg {
2235
+ width: 22px !important;
2236
+ height: 22px !important;
2237
+ }
2238
+ }
2239
+
2240
+ .panelnav {
2241
+ padding: 8px 24px 8px;
2242
+ box-sizing: border-box;
2243
+
2244
+ .part-breadcrumb {
2245
+ display: flex;
2246
+ flex-direction: column;
2247
+ div {
2248
+ display: flex;
2249
+ flex-direction: row;
2250
+ align-items: center;
2251
+ margin:0 0 5px;
2252
+ }
2253
+ a {
2254
+ font-size: 12px;
2255
+ text-decoration: none;
2256
+ margin: 0 2px;
2257
+ }
2258
+ span {
2259
+ font-size: 10px;
2260
+ display: inline-block;
2261
+ margin: 0 2px;
2262
+
2263
+ }
2264
+ svg {
2265
+ width:10px;
2266
+ height:10px;
2267
+ }
2268
+ }
2269
+
2270
+ h3 {
2271
+ font-family: sans-serif;
2272
+ font-weight: 300;
2273
+ font-size: 20px;
2274
+ margin: 15px 0 12px;
2275
+ }
2276
+ }
2277
+
2278
+ [class^="panel-"] {
2279
+ display: none;
2280
+ flex-direction: column;
2281
+ &.active {
2282
+ display: flex;
2283
+ }
2284
+
2285
+ .submain {
2286
+ padding: 0 24px 13px;
2287
+ }
2288
+ .subpanel {
2289
+ padding: 12px 24px 15px;
2290
+ }
2291
+ button.accordion-item {
2292
+ width: 100% !important;
2293
+ background-color: rgba(0,0,0,0.05);
2294
+ justify-content: flex-start;
2295
+ padding-left: 25px !important;
2296
+ height: 45px !important;
2297
+ margin: 0 !important;
2298
+ }
2299
+ }
2300
+
2301
+ .label {
2302
+ font-size: 13px;
2303
+ margin: 20px 0 6px;
2304
+ font-weight: 400;
2305
+ color: #4b4b4b;
2306
+ }
2307
+ .group {
2308
+ border: 1px solid #e1e1e1;
2309
+ margin-bottom: 11px;
2310
+ border-radius: 6px;
2311
+ overflow: hidden;
2312
+ display: inline-flex;
2313
+ padding: 2px;
2314
+
2315
+ &.fontsizes,
2316
+ &.fontweight,
2317
+ &.linespacing,
2318
+ &.letterspacing {
2319
+ width: 211px;
2320
+ display: flex;
2321
+ flex-wrap: wrap;
2322
+ }
2323
+
2324
+ &.listindent {
2325
+ width: 168px;
2326
+ display: flex;
2327
+ flex-wrap: wrap;
2328
+ }
2329
+ }
2330
+ button {
2331
+ width: 38px !important;
2332
+ height: 34px!important;
2333
+ background-color: transparent;
2334
+ box-shadow: none !important;
2335
+ margin: 2px !important;
2336
+ }
2337
+ button.on {
2338
+ background-color: rgba(0,0,0,0.05);
2339
+
2340
+ border-radius: 5px !important;
2341
+ }
2342
+ button:not(.choices__button):not(.is-btn-color):hover {
2343
+ background: rgba(0,0,0,0.035) !important;
2344
+ }
2345
+ button.is-btn-color {
2346
+ border-radius: 5px !important;
2347
+ }
2348
+
2349
+ .group.color-pick { // If using Coloris
2350
+ & > div {
2351
+ width: 140px;
2352
+ display: flex;
2353
+ padding:1px;
2354
+ align-items: center;
2355
+ // flex-direction: row-reverse;
2356
+ button {
2357
+ margin: 0 !important;
2358
+ border-radius: 6px !important;
2359
+ z-index: 1;
2360
+ width:34px !important;
2361
+ flex: none;
2362
+ color: inherit !important;
2363
+ background:
2364
+ repeating-linear-gradient(45deg, #aaa 25%, transparent 25%, transparent 75%, #aaa 75%, #aaa),
2365
+ repeating-linear-gradient(45deg, #aaa 25%, #fff 25%, #fff 75%, #aaa 75%, #aaa) !important;
2366
+ background-position: 0 0, 4px 4px !important;
2367
+ background-size: 8px 8px !important;
2368
+ }
2369
+ input {
2370
+ height: 34px !important;
2371
+ border-radius: 6px!important;
2372
+ font-weight: 200;
2373
+ width:100px !important;
2374
+ outline: none !important;
2375
+ margin-left: 4px !important;
2376
+ text-align: center !important;
2377
+ }
2378
+ }
2379
+ }
2380
+
2381
+ .panel-dialog {
2382
+ position: absolute;
2383
+ top: 0; left: 0;
2384
+ width: 100%;
2385
+ height: 100%;
2386
+ display: none;
2387
+ background-color: #fff;
2388
+
2389
+ button.btn-close {
2390
+ z-index:1;
2391
+ background-color:transparent !important;
2392
+ width:50px !important;
2393
+ height:45px !important;
2394
+ position:absolute;
2395
+ top:0;right:2px;
2396
+ padding:0;
2397
+ cursor:pointer;
2398
+ &:hover {
2399
+ background-color:transparent !important;
2400
+ }
2401
+ svg {
2402
+ width:25px;height:25px;
2403
+ }
2404
+ }
2405
+
2406
+ &.icons {
2407
+ & > div {
2408
+ display: flex;
2409
+ flex-wrap: wrap;
2410
+ margin-top: 47px;
2411
+ width:100%;
2412
+ height: calc(100% - 47px);
2413
+ overflow-y: auto;
2414
+
2415
+ button {
2416
+ width: 63px !important;
2417
+ height: 60px!important;
2418
+ font-size: 24px;
2419
+ opacity: 0.9;
2420
+ }
2421
+ }
2422
+ }
2423
+ }
2424
+
2425
+
2426
+ }
2427
+
2428
+ .clr-picker {
2429
+ margin-left: -40px;
2430
+ margin-top: 2px;
2431
+ padding: 6px;
2432
+ }
2433
+ input.clr-color:focus {
2434
+ border-color: #ddd !important;
2435
+ }
2436
+
2437
+ .choices{position:relative;margin-bottom:24px;font-size:16px}.choices:focus{outline:0}.choices:last-child{margin-bottom:0}.choices.is-disabled .choices__inner,.choices.is-disabled .choices__input{background-color:#eaeaea;cursor:not-allowed;-webkit-user-select:none;-ms-user-select:none;user-select:none}.choices.is-disabled .choices__item{cursor:not-allowed}.choices [hidden]{display:none!important}.choices[data-type*=select-one]{cursor:pointer}.choices[data-type*=select-one] .choices__inner{padding-bottom:7.5px}.choices[data-type*=select-one] .choices__input{display:block;width:100%;padding:10px;border-bottom:1px solid #ddd;background-color:#fff;margin:0}.choices[data-type*=select-one] .choices__button{background-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjEiIGhlaWdodD0iMjEiIHZpZXdCb3g9IjAgMCAyMSAyMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48ZyBmaWxsPSIjMDAwIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPjxwYXRoIGQ9Ik0yLjU5Mi4wNDRsMTguMzY0IDE4LjM2NC0yLjU0OCAyLjU0OEwuMDQ0IDIuNTkyeiIvPjxwYXRoIGQ9Ik0wIDE4LjM2NEwxOC4zNjQgMGwyLjU0OCAyLjU0OEwyLjU0OCAyMC45MTJ6Ii8+PC9nPjwvc3ZnPg==);padding:0;background-size:8px;position:absolute;top:50%;right:0;margin-top:-10px;margin-right:25px;height:20px;width:20px;border-radius:10em;opacity:.5}.choices[data-type*=select-one] .choices__button:focus,.choices[data-type*=select-one] .choices__button:hover{opacity:1}.choices[data-type*=select-one] .choices__button:focus{box-shadow:0 0 0 2px #00bcd4}.choices[data-type*=select-one] .choices__item[data-value=''] .choices__button{display:none}.choices[data-type*=select-one]:after{content:'';height:0;width:0;border-style:solid;border-color:#333 transparent transparent;border-width:5px;position:absolute;right:11.5px;top:50%;margin-top:-2.5px;pointer-events:none}.choices[data-type*=select-one].is-open:after{border-color:transparent transparent #333;margin-top:-7.5px}.choices[data-type*=select-one][dir=rtl]:after{left:11.5px;right:auto}.choices[data-type*=select-one][dir=rtl] .choices__button{right:auto;left:0;margin-left:25px;margin-right:0}.choices[data-type*=select-multiple] .choices__inner,.choices[data-type*=text] .choices__inner{cursor:text}.choices[data-type*=select-multiple] .choices__button,.choices[data-type*=text] .choices__button{position:relative;display:inline-block;margin:0 -4px 0 8px;padding-left:16px;border-left:1px solid #008fa1;background-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjEiIGhlaWdodD0iMjEiIHZpZXdCb3g9IjAgMCAyMSAyMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48ZyBmaWxsPSIjRkZGIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPjxwYXRoIGQ9Ik0yLjU5Mi4wNDRsMTguMzY0IDE4LjM2NC0yLjU0OCAyLjU0OEwuMDQ0IDIuNTkyeiIvPjxwYXRoIGQ9Ik0wIDE4LjM2NEwxOC4zNjQgMGwyLjU0OCAyLjU0OEwyLjU0OCAyMC45MTJ6Ii8+PC9nPjwvc3ZnPg==);background-size:8px;width:8px;line-height:1;opacity:.75;border-radius:0}.choices[data-type*=select-multiple] .choices__button:focus,.choices[data-type*=select-multiple] .choices__button:hover,.choices[data-type*=text] .choices__button:focus,.choices[data-type*=text] .choices__button:hover{opacity:1}.choices__inner{display:inline-block;vertical-align:top;width:100%;background-color:#f9f9f9;padding:7.5px 7.5px 3.75px;border:1px solid #ddd;border-radius:2.5px;font-size:14px;min-height:44px;overflow:hidden}.is-focused .choices__inner,.is-open .choices__inner{border-color:#b7b7b7}.is-open .choices__inner{border-radius:2.5px 2.5px 0 0}.is-flipped.is-open .choices__inner{border-radius:0 0 2.5px 2.5px}.choices__list{margin:0;padding-left:0;list-style:none}.choices__list--single{display:inline-block;padding:4px 16px 4px 4px;width:100%}[dir=rtl] .choices__list--single{padding-right:4px;padding-left:16px}.choices__list--single .choices__item{width:100%}.choices__list--multiple{display:inline}.choices__list--multiple .choices__item{display:inline-block;vertical-align:middle;border-radius:20px;padding:4px 10px;font-size:12px;font-weight:500;margin-right:3.75px;margin-bottom:3.75px;background-color:#00bcd4;border:1px solid #00a5bb;color:#fff;word-break:break-all;box-sizing:border-box}.choices__list--multiple .choices__item[data-deletable]{padding-right:5px}[dir=rtl] .choices__list--multiple .choices__item{margin-right:0;margin-left:3.75px}.choices__list--multiple .choices__item.is-highlighted{background-color:#00a5bb;border:1px solid #008fa1}.is-disabled .choices__list--multiple .choices__item{background-color:#aaa;border:1px solid #919191}.choices__list--dropdown{visibility:hidden;z-index:1;position:absolute;width:100%;background-color:#fff;border:1px solid #ddd;top:100%;margin-top:-1px;border-bottom-left-radius:2.5px;border-bottom-right-radius:2.5px;overflow:hidden;word-break:break-all;will-change:visibility}.choices__list--dropdown.is-active{visibility:visible}.is-open .choices__list--dropdown{border-color:#b7b7b7}.is-flipped .choices__list--dropdown{top:auto;bottom:100%;margin-top:0;margin-bottom:-1px;border-radius:.25rem .25rem 0 0}.choices__list--dropdown .choices__list{position:relative;max-height:300px;overflow:auto;-webkit-overflow-scrolling:touch;will-change:scroll-position}.choices__list--dropdown .choices__item{position:relative;padding:10px;font-size:14px}[dir=rtl] .choices__list--dropdown .choices__item{text-align:right}@media (min-width:640px){.choices__list--dropdown .choices__item--selectable{padding-right:100px}.choices__list--dropdown .choices__item--selectable:after{content:attr(data-select-text);font-size:12px;opacity:0;position:absolute;right:10px;top:50%;transform:translateY(-50%)}[dir=rtl] .choices__list--dropdown .choices__item--selectable{text-align:right;padding-left:100px;padding-right:10px}[dir=rtl] .choices__list--dropdown .choices__item--selectable:after{right:auto;left:10px}}.choices__list--dropdown .choices__item--selectable.is-highlighted{background-color:#f2f2f2}.choices__list--dropdown .choices__item--selectable.is-highlighted:after{opacity:.5}.choices__item{cursor:default}.choices__item--selectable{cursor:pointer}.choices__item--disabled{cursor:not-allowed;-webkit-user-select:none;-ms-user-select:none;user-select:none;opacity:.5}.choices__heading{font-weight:600;font-size:12px;padding:10px;border-bottom:1px solid #f7f7f7;color:gray}.choices__button{text-indent:-9999px;-webkit-appearance:none;-moz-appearance:none;appearance:none;border:0;background-color:transparent;background-repeat:no-repeat;background-position:center;cursor:pointer}.choices__button:focus,.choices__input:focus{outline:0}.choices__input{display:inline-block;vertical-align:baseline;background-color:#f9f9f9;font-size:14px;margin-bottom:5px;border:0;border-radius:0;max-width:100%;padding:4px 0 4px 2px}[dir=rtl] .choices__input{padding-right:2px;padding-left:0}.choices__placeholder{opacity:.5}
2438
+
2439
+ .choices {
2440
+ display: flex;
2441
+ width: 100%;
2442
+ }
2443
+ .choices__list--single .choices__item {
2444
+ display: flex;
2445
+ }
2446
+ .choices__inner {
2447
+ height: 40px;
2448
+ border-radius: 5px;
2449
+ background: transparent;
2450
+ }
2451
+ .choices__list--dropdown {
2452
+ box-sizing: border-box;
2453
+ }
2454
+ .is-focused .choices__inner,
2455
+ .is-open .choices__inner,
2456
+ .is-open .choices__list--dropdown {
2457
+ border-color: #e1e1e1;
2458
+ }
2459
+ .choices__inner {
2460
+ padding: 0 10px;
2461
+ }
2462
+ .choices[data-type*=select-one] .choices__inner {
2463
+ padding: 0 8px 0 2px;
2464
+ display: flex;
2465
+ align-items: center;
2466
+ }
2467
+ .choices__list--single .choices__item img {
2468
+ height:25px;
2469
+ margin-top: 3px;
2470
+ }
2471
+ .choices__list--dropdown .choices__item {
2472
+ display: flex;
2473
+ align-items: center;
2474
+ justify-content: flex-start;
2475
+ }
2476
+ .choices__list--dropdown .choices__item img {
2477
+ height:25px;
2478
+ }
2479
+ .choices[data-type*=select-one]:after {
2480
+ border-top-color: #444;
2481
+ }
2482
+ .choices[data-type*=select-one].is-open:after {
2483
+ border-bottom-color: #444;
2484
+ }
2485
+ .choices__list--dropdown .choices__item--selectable {
2486
+ padding-right:0;
2487
+ }
2488
+
2489
+ .dark {
2490
+ .is-responsive-toolbar button { color: #000 !important; }
2491
+
2492
+ .is-controlpanel {
2493
+ background-color: #343434;
2494
+ a { color:#efefef; }
2495
+ }
2496
+ .is-controlpanel button { color:#efefef !important; }
2497
+ .is-controlpanel button.on { background-color: rgb(77 75 75) !important; }
2498
+ .is-controlpanel .group { border-color: #646464; }
2499
+ .is-controlpanel .label {
2500
+ color: #d9d9d9;
2501
+ }
2502
+ .choices__list--dropdown {
2503
+ background-color: #343434;
2504
+ }
2505
+ .choices__inner,
2506
+ .is-focused .choices__inner,
2507
+ .is-open .choices__inner,
2508
+ .is-open .choices__list--dropdown {
2509
+ border-color: #646464 !important;
2510
+ }
2511
+
2512
+ .choices[data-type*=select-one]:after {
2513
+ border-top-color: #eee;
2514
+ }
2515
+ .choices[data-type*=select-one].is-open:after {
2516
+ border-top-color: transparent;
2517
+ }
2518
+ .choices[data-type*=select-one].is-open:after {
2519
+ border-bottom-color: #eee;
2520
+ }
2521
+ .choices__list--single .choices__item img {
2522
+ mix-blend-mode: screen;
2523
+ filter: invert(1);
2524
+ }
2525
+ .choices__list--dropdown .choices__item--selectable img {
2526
+ mix-blend-mode: screen;
2527
+ filter: invert(1);
2528
+ }
2529
+ .choices__list--dropdown .choices__item--selectable {
2530
+ background-color: inherit;
2531
+ }
2532
+ .choices[data-type*=select-one] .choices__input {
2533
+ border-bottom: 1px solid #646464;
2534
+ background-color: inherit;
2535
+ color:#efefef;
2536
+ }
2537
+ .choices__list--dropdown .choices__item--selectable.is-highlighted {
2538
+ background-color: rgb(77 75 75);
2539
+ }
2540
+ }
2541
+ .colored-dark {
2542
+ .is-responsive-toolbar button { color: #000 !important; }
2543
+
2544
+ .is-controlpanel button { color:#000 !important; }
2545
+
2546
+ .is-controlpanel .group { border-color: #bfbfbf; }
2547
+
2548
+ .choices__inner,
2549
+ .is-focused .choices__inner,
2550
+ .is-open .choices__inner,
2551
+ .is-open .choices__list--dropdown {
2552
+ border-color: #bfbfbf !important;
2553
+ }
2554
+ .choices[data-type*=select-one] .choices__input {
2555
+ background-color: #8b8b8b17;
2556
+ }
2557
+ .choices__list--dropdown {
2558
+ background-color: #d6d6d6;
2559
+ }
2560
+ }
2561
+ .colored {
2562
+ .is-controlpanel .group { border-color: #82828236; }
2563
+
2564
+ .choices__inner,
2565
+ .is-focused .choices__inner,
2566
+ .is-open .choices__inner,
2567
+ .is-open .choices__list--dropdown {
2568
+ border-color: #82828236 !important;
2569
+ }
2570
+
2571
+ .choices[data-type*=select-one] .choices__input {
2572
+ border-bottom: 1px solid transparent;
2573
+ }
2574
+ }
2575
+ .light {
2576
+ .is-controlpanel .group { border: 1px solid #82828236; }
2577
+
2578
+ .choices__inner,
2579
+ .is-focused .choices__inner,
2580
+ .is-open .choices__inner,
2581
+ .is-open .choices__list--dropdown {
2582
+ border-color: #82828236 !important;
2583
+ }
2584
+ }
2585
+ */
2586
+ /* /Control Panel */
185
2587
  .is-box-tool {
186
2588
  display: none;
187
2589
  z-index: 1;