PluginProbe
Customify / 2.1.0
Customify v2.1.0
2.10.9 1.2.3 1.2.4 1.2.5 1.2.6 1.2.7 1.2.7.1 1.3.0 1.3.1 1.4.0 1.4.1 1.4.2 1.5.0 1.5.1 1.5.2 1.5.3 1.5.4 1.5.5 1.5.6 1.5.7 1.6.0 1.6.0.1 1.6.5 1.7.0 1.7.1 All 77 releases
customify / css / customizer.css

customizer.css in Customify 2.1.0, at css/customizer.css

3,108 lines 80.1 KB
No matching file
Up and down to move Enter to open Esc to close
Raw Download Zip
1 @charset "UTF-8";
2 .sm-radio-group {
3 position: relative;
4 border-radius: 999em;
5 overflow: hidden;
6 height: 2.428em;
7 display: -ms-flexbox;
8 display: flex;
9 -ms-flex-wrap: nowrap;
10 flex-wrap: nowrap;
11 -ms-flex-align: stretch;
12 align-items: stretch;
13 color: rgba(65, 107, 126, 0.7);
14 font-size: 14px;
15 -webkit-font-smoothing: antialiased;
16 font-weight: 600;
17 line-height: 1.142em;
18 }
19
20 .sm-radio-group > * {
21 -ms-flex: 1 1 0;
22 flex: 1 1 0;
23 }
24
25 .sm-radio-group:after {
26 content: "";
27 position: absolute;
28 top: 0;
29 right: 0;
30 bottom: 0;
31 left: 0;
32 border: 0.142em solid #57abd5;
33 border-radius: 999em;
34 pointer-events: none;
35 }
36
37 .sm-radio-group input[type="radio"] {
38 display: none;
39 }
40
41 .sm-radio-group input[type="radio"]:checked + label {
42 background-color: #57abd5;
43 color: #ffffff;
44 }
45
46 .sm-radio-group input[type="radio"]:checked + label:before {
47 content: "";
48 display: inline-block;
49 color: inherit;
50 position: relative;
51 top: .285em;
52 margin-right: .45em;
53 height: .8em;
54 width: .55em;
55 border-right: 2px solid;
56 border-bottom: 2px solid;
57 -webkit-transform: translateY(-50%) rotate(45deg);
58 transform: translateY(-50%) rotate(45deg);
59 }
60
61 .sm-radio-group label {
62 display: -ms-flexbox;
63 display: flex;
64 -ms-flex-align: center;
65 align-items: center;
66 -ms-flex-pack: center;
67 justify-content: center;
68 position: relative;
69 cursor: pointer;
70 transition: all .25s ease;
71 color: inherit;
72 }
73
74 .sm-radio-group label:hover {
75 color: #416b7e;
76 }
77
78 .sm-radio-group label:nth-of-type(2) {
79 border-left: 2px solid #57abd5;
80 border-right: 2px solid #57abd5;
81 }
82
83 [id="customize-control-sm_coloration_level_control"] .sm-radio-group {
84 display: -ms-flexbox;
85 display: flex;
86 -ms-flex-direction: row-reverse;
87 flex-direction: row-reverse;
88 -ms-flex-wrap: nowrap;
89 flex-wrap: nowrap;
90 -ms-flex-align: stretch;
91 align-items: stretch;
92 -ms-flex-pack: start;
93 justify-content: flex-start;
94 }
95
96 [id="customize-control-sm_coloration_level_control"] .sm-radio-group > * {
97 -ms-flex: 0 0 33.33%;
98 flex: 0 0 33.33%;
99 }
100
101 [id="customize-control-sm_coloration_level_control"] .sm-radio-group input[type="radio"]:last-of-type:checked + label {
102 background: linear-gradient(90deg, #3DAAE0 0%, #D557BE 100%);
103 }
104
105 [id="customize-control-sm_coloration_level_control"] .sm-radio-group input[type="radio"]:nth-of-type(1):checked ~ label:last-of-type, [id="customize-control-sm_coloration_level_control"] .sm-radio-group input[type="radio"]:nth-of-type(2):checked ~ label:last-of-type {
106 margin-right: -33.33%;
107 }
108
109 [id="customize-control-sm_coloration_level_control"] .sm-radio-group label:nth-of-type(1) {
110 -ms-flex-order: 4;
111 order: 4;
112 }
113
114 [id="customize-control-sm_coloration_level_control"] .sm-radio-group label:nth-of-type(2) {
115 -ms-flex-order: 3;
116 order: 3;
117 border-left: 2px solid #57abd5;
118 border-right: 2px solid #57abd5;
119 }
120
121 [id="customize-control-sm_coloration_level_control"] .sm-radio-group label:nth-of-type(3) {
122 -ms-flex-order: 2;
123 order: 2;
124 }
125
126 [id="customize-control-sm_coloration_level_control"] .sm-radio-group label:nth-of-type(4) {
127 -ms-flex-order: 1;
128 order: 1;
129 border-left: 2px solid #57abd5;
130 }
131
132 [id="sub-accordion-section-sm_color_palettes_section"].sm-view-customize li.customize-control-sm_switch {
133 display: -ms-flexbox !important;
134 display: flex !important;
135 -ms-flex-align: center;
136 align-items: center;
137 -ms-flex-pack: justify;
138 justify-content: space-between;
139 padding-top: 42px;
140 padding-bottom: 42px;
141 }
142
143 [id="sub-accordion-section-sm_color_palettes_section"].sm-view-customize li.customize-control-sm_switch .customize-control-title, [id="sub-accordion-section-sm_color_palettes_section"].sm-view-customize li.customize-control-sm_switch .separator.label {
144 display: inline-block;
145 }
146
147 .sm-switch {
148 display: -ms-flexbox;
149 display: flex;
150 -ms-flex-wrap: nowrap;
151 flex-wrap: nowrap;
152 -ms-flex-align: stretch;
153 align-items: stretch;
154 -ms-flex-pack: start;
155 justify-content: flex-start;
156 overflow: hidden;
157 position: relative;
158 height: 2.428em;
159 max-width: 5.5em;
160 border-radius: 999em;
161 color: #ffffff;
162 font-size: 14px;
163 -webkit-font-smoothing: antialiased;
164 font-weight: 600;
165 line-height: 1.142em;
166 z-index: 10;
167 }
168
169 .sm-switch input[type="radio"] {
170 display: none;
171 }
172
173 .sm-switch input[type="radio"] + label {
174 display: -ms-flexbox;
175 display: flex;
176 -ms-flex-align: center;
177 align-items: center;
178 -ms-flex: 0 0 100%;
179 flex: 0 0 100%;
180 }
181
182 .sm-switch input[type="radio"] + label, .sm-switch input[type="radio"] + label:after {
183 transition: all 0.2s ease-out;
184 }
185
186 .sm-switch input[type="radio"]:checked + label {
187 pointer-events: none;
188 }
189
190 .sm-switch input[type="radio"]:nth-of-type(1) + label {
191 padding-left: 1.214em;
192 }
193
194 .sm-switch input[type="radio"]:nth-of-type(1) + label:after {
195 content: "";
196 position: absolute;
197 top: 0;
198 right: 0;
199 bottom: 0;
200 left: 0;
201 background-color: #57abd5;
202 z-index: -1;
203 }
204
205 .sm-switch input[type="radio"]:nth-of-type(1):not(:checked) + label {
206 -webkit-transform: translateX(-100%) translateX(2.125em);
207 transform: translateX(-100%) translateX(2.125em);
208 }
209
210 .sm-switch input[type="radio"]:nth-of-type(1):not(:checked) + label:after {
211 background: #cccccc;
212 -webkit-transform: translateX(100%) translateX(-2.125em);
213 transform: translateX(100%) translateX(-2.125em);
214 }
215
216 .sm-switch input[type="radio"]:nth-of-type(1):not(:checked) + label ~ label {
217 -webkit-transform: translateX(-100%);
218 transform: translateX(-100%);
219 }
220
221 .sm-switch input[type="radio"]:nth-of-type(1):checked + label ~ label {
222 -webkit-transform: translateX(-2.4em);
223 transform: translateX(-2.4em);
224 }
225
226 .sm-switch input[type="radio"]:nth-of-type(1):checked + label ~ label:before {
227 -webkit-transform: translateX(-100%) translateX(2.125em);
228 transform: translateX(-100%) translateX(2.125em);
229 }
230
231 .sm-switch input[type="radio"]:nth-of-type(2) + label {
232 -ms-flex-direction: row-reverse;
233 flex-direction: row-reverse;
234 padding-right: 1em;
235 }
236
237 .sm-switch input[type="radio"]:nth-of-type(2) + label:before {
238 content: "";
239 position: absolute;
240 top: 0;
241 right: 0;
242 bottom: 0;
243 left: 0;
244 }
245
246 .sm-switch input[type="radio"]:nth-of-type(2) + label:after {
247 content: "";
248 display: block;
249 height: 2.142em;
250 width: 2.142em;
251 margin-right: auto;
252 margin-left: 0.125em;
253 border-radius: 50%;
254 background-color: #ffffff;
255 box-shadow: 1px 2px 2px 0 rgba(23, 21, 21, 0.15);
256 pointer-events: none;
257 }
258
259 .wp-full-overlay-sidebar *, .wp-full-overlay-sidebar *:before, .wp-full-overlay-sidebar *:after {
260 box-sizing: border-box;
261 }
262
263 .iris-picker,
264 .iris-picker * {
265 box-sizing: content-box;
266 }
267
268 .wp-full-overlay-sidebar-content .accordion-section-content {
269 overflow: visible;
270 }
271
272 .control-section:not(.control-section-themes) .customize-control {
273 padding: 0;
274 width: 100%;
275 min-height: initial;
276 }
277
278 #customize-header-actions #customize-save-button-wrapper {
279 margin-top: 7px;
280 }
281
282 .wp-full-overlay-footer .devices button {
283 float: left;
284 border-radius: 0;
285 }
286
287 .customize-controls-close {
288 width: 48px;
289 height: 44px;
290 color: #7da9c3;
291 background: #ffffff;
292 border-top: none;
293 border-right-color: #e0e8ef;
294 }
295
296 .customize-controls-close:focus, .customize-controls-close:hover {
297 background: #f5fcff;
298 }
299
300 .customize-controls-close:before {
301 top: 0px;
302 }
303
304 #customize-controls .customize-info {
305 border-bottom-color: #e0e8ef;
306 }
307
308 .customize-panel-back, .customize-section-back {
309 height: 74px;
310 color: #7da9c3;
311 border-right-color: #e0e8ef;
312 }
313
314 .customize-panel-back:hover, .customize-panel-back:focus, .customize-section-back:hover, .customize-section-back:focus {
315 border-left-color: #f5fcff;
316 background: #f5fcff;
317 }
318
319 #customize-theme-controls .theme * {
320 box-sizing: content-box;
321 }
322
323 #customize-theme-controls .accordion-section-content {
324 padding: 17px;
325 }
326
327 #customize-theme-controls .customize-section-title {
328 margin-top: -17px;
329 margin-right: -17px;
330 }
331
332 #customize-theme-controls .control-panel-content .control-section:nth-child(2),
333 #customize-theme-controls .control-panel-content .control-section:nth-child(3) {
334 border-top: none;
335 }
336
337 #customize-theme-controls #accordion-section-add_menu {
338 border-bottom: none;
339 }
340
341 #customize-theme-controls #accordion-section-add_menu .add-menu-toggle {
342 float: none;
343 }
344
345 #customize-theme-controls .customize-pane-child.open {
346 height: 100%;
347 }
348
349 #customize-controls .description {
350 font-size: 12px;
351 font-weight: 300;
352 font-style: normal;
353 line-height: 1.6;
354 color: #4d7b90;
355 text-indent: 0;
356 }
357
358 .customize-control-description {
359 margin-top: 6px;
360 }
361
362 .customize-control {
363 margin-bottom: 24px;
364 }
365
366 #accordion-section-themes + .control-section {
367 border-top: none;
368 }
369
370 #customize-controls .panel-meta.customize-info .accordion-section-title {
371 border-top: none;
372 height: 74px;
373 }
374
375 .button-controls:after {
376 content: " ";
377 display: table;
378 clear: both;
379 }
380
381 .wp-core-ui .button:not(.theme-details):not(.collapse-sidebar):not(.wp-color-result),
382 .wp-core-ui .button-primary,
383 .wp-core-ui .button-secondary {
384 width: auto;
385 padding-left: 15px;
386 padding-right: 15px;
387 font-weight: 400;
388 color: #F5FCFF;
389 text-shadow: none;
390 border: none;
391 background: #AED2E5;
392 box-shadow: 0px 2px 0px 0px #8DBED7;
393 border-radius: 4px;
394 }
395
396 .wp-core-ui .button:not(.theme-details):not(.collapse-sidebar):not(.wp-color-result):hover,
397 .wp-core-ui .button-primary:hover,
398 .wp-core-ui .button-secondary:hover {
399 color: white;
400 text-shadow: none;
401 background: #98C6DD;
402 box-shadow: 0px 2px 0px 0px #74A7C2;
403 }
404
405 .wp-core-ui #customize-header-actions .button-primary {
406 background: #73C5EE;
407 box-shadow: 0px 2px 0px 0px #57ABD5;
408 }
409
410 .wp-core-ui #customize-header-actions .button-primary:hover {
411 background: #58B0DD;
412 box-shadow: 0px 2px 0px 0px #3F8AAF;
413 }
414
415 .wp-core-ui #customize-header-actions .button-primary.has-next-sibling {
416 border-right: 1px solid #57ABD5;
417 }
418
419 .wp-core-ui #customize-header-actions .button-primary:disabled {
420 color: white !important;
421 background: #AED2E5 !important;
422 opacity: 0.7;
423 box-shadow: 0px 2px 0px 0px #8db5ca !important;
424 }
425
426 .wp-core-ui #customize-header-actions .button-primary:disabled.has-next-sibling {
427 border-right: none;
428 }
429
430 .wp-core-ui .reset_section,
431 .wp-core-ui .reset_panel {
432 width: 100%;
433 height: 4em;
434 display: block;
435 margin: 0px 0 25px;
436 }
437
438 .wp-core-ui .reset_panel {
439 margin-top: 10px;
440 }
441
442 .separator.label {
443 display: block;
444 font-size: 14px;
445 line-height: 24px;
446 font-weight: 500;
447 }
448
449 .customize-control-title, .separator.label {
450 color: #2A3B44;
451 }
452
453 .separator.section:before, .separator.sub-section:before {
454 content: "";
455 position: absolute;
456 top: 0;
457 bottom: 0;
458 left: -18px;
459 right: -18px;
460 z-index: -1;
461 }
462
463 .separator.label {
464 font-weight: 500;
465 }
466
467 .separator.large {
468 margin-top: 12px;
469 font-size: 16px;
470 color: #39474D;
471 }
472
473 .separator.section {
474 position: relative;
475 padding: 14px 0;
476 margin-bottom: 0;
477 background: none;
478 border: none;
479 }
480
481 .separator.section[id*="layout"] {
482 margin-top: 0;
483 }
484
485 .separator.section[id*="layout"]:before {
486 border: none;
487 }
488
489 .separator.section:before {
490 border: 1px solid #e0e8ef;
491 background-color: #ffffff;
492 box-shadow: 0px 1px 0px 0px #DFE8EF;
493 }
494
495 .separator.sub-section {
496 position: relative;
497 padding: 12px 0;
498 }
499
500 .separator.sub-section:before {
501 border-top: 1px solid #e0e8ef;
502 border-bottom: 1px solid #e0e8ef;
503 background-color: #f6fbff;
504 }
505
506 .separator.sub-section + span {
507 margin-top: 20px;
508 font-style: normal;
509 }
510
511 .section-navigation-wrapper {
512 position: relative;
513 height: 43px;
514 margin: -15px -12px 0 -12px;
515 margin-right: -17px;
516 margin-left: -17px;
517 }
518
519 .section-navigation {
520 display: -ms-flexbox;
521 display: flex;
522 margin-top: -1px;
523 clear: both;
524 border-top: 1px solid #e0e8ef;
525 }
526
527 .section-navigation a {
528 -ms-flex: 1 1 auto;
529 flex: 1 1 auto;
530 display: block;
531 padding: 12px 0;
532 color: #3b484e;
533 background-color: #ffffff;
534 border-bottom: 1px solid #e0e8ef;
535 border-right: 1px solid #e0e8ef;
536 text-align: center;
537 text-decoration: none;
538 transition: background-color .15s ease-in-out;
539 }
540
541 .section-navigation a:last-child {
542 border-right: 0;
543 }
544
545 #customize-controls .customize-info.is-sticky.is-sticky,
546 #customize-controls .customize-section-title.is-sticky.is-sticky {
547 top: 40px;
548 }
549
550 #customize-controls .customize-info.is-in-view.is-in-view,
551 #customize-controls .customize-section-title.is-in-view.is-in-view {
552 box-shadow: none;
553 }
554
555 #customize-controls .has-nav .customize-info,
556 #customize-controls .has-nav .customize-section-title {
557 margin-right: -12px;
558 }
559
560 #customize-controls .customize-section-title.customize-section-title {
561 border-bottom: 0;
562 }
563
564 .customize-section-description-container.section-meta.has-nav {
565 margin-bottom: 0;
566 }
567
568 .font-options__wrapper {
569 position: relative;
570 }
571
572 .font-options__wrapper:after {
573 content: "";
574 position: absolute;
575 top: 90%;
576 left: 0;
577 right: 0;
578 z-index: 0;
579 display: block;
580 height: 30px;
581 }
582
583 .font-options__head {
584 display: -ms-flexbox;
585 display: flex;
586 -ms-flex-pack: justify;
587 justify-content: space-between;
588 }
589
590 .font-options__head.font-options__head {
591 -webkit-appearance: none;
592 text-overflow: ellipsis;
593 white-space: nowrap;
594 }
595
596 .font-options__font-title {
597 margin-right: 26px;
598 margin-left: 10px;
599 font-size: 12px;
600 line-height: 20px;
601 font-weight: 300;
602 color: #98c6dd;
603 text-overflow: ellipsis;
604 overflow: hidden;
605 white-space: nowrap;
606 }
607
608 .font-options__options-list {
609 position: absolute;
610 top: calc(100% + 6px);
611 left: -6px;
612 right: -6px;
613 z-index: 2;
614 display: block;
615 padding: 10px;
616 border: 1px solid #dfe8ef;
617 border-radius: 5px;
618 background-color: #ffffff;
619 opacity: 0;
620 display: none;
621 transition: opacity .15s linear;
622 }
623
624 .font-options__options-list:last-child {
625 margin-bottom: 0;
626 }
627
628 .font-options__options-list:before, .font-options__options-list:after {
629 content: "";
630 position: absolute;
631 top: -20px;
632 right: 25px;
633 height: 0;
634 width: 0;
635 border: solid transparent;
636 z-index: 10;
637 }
638
639 .font-options__options-list:before {
640 border-bottom-color: white;
641 border-width: 10px;
642 z-index: 11;
643 }
644
645 .font-options__options-list:after {
646 border-bottom-color: rgba(0, 0, 0, 0.075);
647 border-width: 12px;
648 top: -24px;
649 right: 23px;
650 }
651
652 .customize-control-color .wp-picker-container .wp-picker-open + .wp-picker-input-wrap:after {
653 content: "";
654 position: absolute;
655 bottom: 100%;
656 right: 12px;
657 border-collapse: separate;
658 width: 0;
659 height: 0;
660 border-width: 0 9px 9px 9px;
661 border-style: solid;
662 border-color: transparent transparent #fff transparent;
663 }
664
665 .font-options__head, .wp-full-overlay-sidebar-content .customize-control input[type=text]:not(#_customize-input-wpcom_custom_css_content_width_control):not(.wp-color-picker),
666 .wp-full-overlay-sidebar-content .customize-control input[type=checkbox],
667 .wp-full-overlay-sidebar-content .customize-control input[type=password],
668 .wp-full-overlay-sidebar-content .customize-control input[type=color],
669 .wp-full-overlay-sidebar-content .customize-control input[type=date],
670 .wp-full-overlay-sidebar-content .customize-control input[type=datetime],
671 .wp-full-overlay-sidebar-content .customize-control input[type=datetime-local],
672 .wp-full-overlay-sidebar-content .customize-control input[type=email],
673 .wp-full-overlay-sidebar-content .customize-control input[type=month],
674 .wp-full-overlay-sidebar-content .customize-control input[type=number],
675 .wp-full-overlay-sidebar-content .customize-control input[type=radio],
676 .wp-full-overlay-sidebar-content .customize-control input[type=tel],
677 .wp-full-overlay-sidebar-content .customize-control input[type=time],
678 .wp-full-overlay-sidebar-content .customize-control input[type=url],
679 .wp-full-overlay-sidebar-content .customize-control input[type=week],
680 .wp-full-overlay-sidebar-content .customize-control input[type=search],
681 .wp-full-overlay-sidebar-content .customize-control select,
682 .wp-full-overlay-sidebar-content .customize-control textarea,
683 .wp-full-overlay-sidebar-content .customize-control input[type="number"].range-value, ul.font-options__options-list .select2-container .select2-selection--single, #customize-theme-controls .select2-container .select2-selection--multiple {
684 width: 100%;
685 height: 44px;
686 padding: 10px 14px;
687 background: #FFFFFF;
688 border: 2px solid #B8DAEB;
689 border-radius: 4px;
690 font-size: 14px;
691 line-height: 1.5;
692 color: #416B7E;
693 outline: 0;
694 }
695
696 .font-options__head:focus, .wp-full-overlay-sidebar-content .customize-control input[type=text]:focus:not(#_customize-input-wpcom_custom_css_content_width_control):not(.wp-color-picker),
697 .wp-full-overlay-sidebar-content .customize-control input[type=checkbox]:focus,
698 .wp-full-overlay-sidebar-content .customize-control input[type=password]:focus,
699 .wp-full-overlay-sidebar-content .customize-control input[type=color]:focus,
700 .wp-full-overlay-sidebar-content .customize-control input[type=date]:focus,
701 .wp-full-overlay-sidebar-content .customize-control input[type=datetime]:focus,
702 .wp-full-overlay-sidebar-content .customize-control input[type=datetime-local]:focus,
703 .wp-full-overlay-sidebar-content .customize-control input[type=email]:focus,
704 .wp-full-overlay-sidebar-content .customize-control input[type=month]:focus,
705 .wp-full-overlay-sidebar-content .customize-control input[type=number]:focus,
706 .wp-full-overlay-sidebar-content .customize-control input[type=radio]:focus,
707 .wp-full-overlay-sidebar-content .customize-control input[type=tel]:focus,
708 .wp-full-overlay-sidebar-content .customize-control input[type=time]:focus,
709 .wp-full-overlay-sidebar-content .customize-control input[type=url]:focus,
710 .wp-full-overlay-sidebar-content .customize-control input[type=week]:focus,
711 .wp-full-overlay-sidebar-content .customize-control input[type=search]:focus,
712 .wp-full-overlay-sidebar-content .customize-control select:focus,
713 .wp-full-overlay-sidebar-content .customize-control textarea:focus,
714 .wp-full-overlay-sidebar-content .customize-control input[type="number"].range-value:focus, ul.font-options__options-list .select2-container .select2-selection--single:focus, #customize-theme-controls .select2-container .select2-selection--multiple:focus {
715 border-color: #73C5EE;
716 box-shadow: none;
717 }
718
719 .font-options__head, .wp-full-overlay-sidebar-content .customize-control select, ul.font-options__options-list .select2-container .select2-selection--single, #customize-theme-controls .select2-container .select2-selection--multiple {
720 width: 100%;
721 -webkit-appearance: button;
722 -moz-appearance: none;
723 font-weight: 600;
724 background: white url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+Cjxzdmcgd2lkdGg9IjE1cHgiIGhlaWdodD0iOXB4IiB2aWV3Qm94PSIwIDAgMTUgOSIgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIj4KICAgIDxkZWZzPjwvZGVmcz4KICAgIDxnIGlkPSJQYWdlLTEiIHN0cm9rZT0ibm9uZSIgc3Ryb2tlLXdpZHRoPSIxIiBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPgogICAgICAgIDxnIGlkPSJDdXN0b21pZnktQ29weS0yIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgtMjU2LjAwMDAwMCwgLTM4Ni4wMDAwMDApIiBmaWxsPSIjOThDNkRFIj4KICAgICAgICAgICAgPGcgaWQ9IkhlYWRlciIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoLTIxLjAwMDAwMCwgNDcuMDAwMDAwKSI+CiAgICAgICAgICAgICAgICA8ZyBpZD0iQ29udGVudCIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMTAuMDAwMDAwLCA3NS4wMDAwMDApIj4KICAgICAgICAgICAgICAgICAgICA8ZyBpZD0iVGl0bGUiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDI2LjAwMDAwMCwgMjE5LjAwMDAwMCkiPgogICAgICAgICAgICAgICAgICAgICAgICA8ZyBpZD0iRmllbGQtLS1TZWxlY3QtQ29weSI+CiAgICAgICAgICAgICAgICAgICAgICAgICAgICA8ZyBpZD0iU2VsZWN0IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgwLjAwMDAwMCwgMjcuMDAwMDAwKSI+CiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgPHBhdGggZD0iTTI1NC40ODEyLDE4IEwyNTYsMTkuNTE0IEwyNDguNSwyNyBMMjQxLDE5LjUxNCBMMjQyLjUxODgsMTggTDI0OC41LDIzLjk2NzIgTDI1NC40ODEyLDE4IFoiIGlkPSJQYWdlLTEiPjwvcGF0aD4KICAgICAgICAgICAgICAgICAgICAgICAgICAgIDwvZz4KICAgICAgICAgICAgICAgICAgICAgICAgPC9nPgogICAgICAgICAgICAgICAgICAgIDwvZz4KICAgICAgICAgICAgICAgIDwvZz4KICAgICAgICAgICAgPC9nPgogICAgICAgIDwvZz4KICAgIDwvZz4KPC9zdmc+) no-repeat;
725 background-position: right 16px top 16px;
726 }
727
728 [multiple].font-options__head, .wp-full-overlay-sidebar-content .customize-control select[multiple], ul.font-options__options-list .select2-container [multiple].select2-selection--single, #customize-theme-controls .select2-container [multiple].select2-selection--multiple {
729 background: white;
730 }
731
732 .wp-full-overlay-sidebar-content .customize-control input[type=text],
733 .wp-full-overlay-sidebar-content .customize-control textarea {
734 font-size: 13px;
735 }
736
737 .wp-full-overlay-sidebar-content .customize-control textarea {
738 height: auto;
739 }
740
741 .wp-full-overlay-sidebar-content .customize-control input[type=checkbox],
742 .wp-full-overlay-sidebar-content .customize-control input[type=radio] {
743 width: 22px;
744 height: 22px;
745 }
746
747 .wp-full-overlay-sidebar-content .customize-control input[type=checkbox]:checked,
748 .wp-full-overlay-sidebar-content .customize-control input[type=radio]:checked {
749 background: #73C5EE;
750 border-color: #5AB9E8;
751 }
752
753 .wp-full-overlay-sidebar-content .customize-control input[type=checkbox]:checked:before,
754 .wp-full-overlay-sidebar-content .customize-control input[type=radio]:checked:before {
755 color: white;
756 margin: -1px 0 0 -2px;
757 }
758
759 .wp-full-overlay-sidebar-content .customize-control .awesome_preset input[type=radio]:checked {
760 background: transparent;
761 }
762
763 .wp-full-overlay-sidebar-content .customize-control.customize-control-checkbox:not(#customize-control-jetpack_css_mode_control) label:not(:only-of-type),
764 .wp-full-overlay-sidebar-content .customize-control.customize-control-checkbox:not(#customize-control-jetpack_css_mode_control) > .customize-inside-control-row:not(:only-of-type), .wp-full-overlay-sidebar-content .customize-control.customize-control-radio label:not(:only-of-type),
765 .wp-full-overlay-sidebar-content .customize-control.customize-control-radio > .customize-inside-control-row:not(:only-of-type) {
766 margin-left: 30px;
767 padding-top: 0;
768 padding-bottom: 0;
769 display: inline-block;
770 width: calc(49% - 30px);
771 text-indent: -6px;
772 }
773
774 .wp-full-overlay-sidebar-content .customize-control.customize-control-checkbox:not(#customize-control-jetpack_css_mode_control) label, .wp-full-overlay-sidebar-content .customize-control.customize-control-radio label {
775 color: #416B7E;
776 }
777
778 [id*="divider"] + .wp-full-overlay-sidebar-content .customize-control.customize-control-checkbox:not(#customize-control-jetpack_css_mode_control), [id*="divider"] + .wp-full-overlay-sidebar-content .customize-control.customize-control-radio {
779 margin-top: 0;
780 }
781
782 .wp-full-overlay-sidebar-content .customize-control input[type=radio] {
783 border-radius: 50%;
784 }
785
786 .wp-full-overlay-sidebar-content .customize-control input[type=radio]:checked:before {
787 content: none;
788 }
789
790 .customize-control-html + .wp-full-overlay-sidebar-content .customize-control.customize-control-checkbox {
791 margin-top: -24px;
792 }
793
794 .wp-full-overlay-sidebar-content .customize-control.customize-control-radio label,
795 .wp-full-overlay-sidebar-content .customize-control.customize-control-radio .customize-inside-control-row {
796 margin-top: 12px;
797 }
798
799 .wp-full-overlay-sidebar-content .customize-control.customize-control-radio#customize-control-changeset_status .customize-inside-control-row {
800 margin-top: 0;
801 text-indent: 0;
802 }
803
804 .wp-full-overlay-sidebar-content .customize-control input[type="range"] {
805 width: 65%;
806 }
807
808 .wp-full-overlay-sidebar-content .customize-control input[type="range"] {
809 position: relative;
810 -webkit-appearance: none;
811 width: calc(100% - 55px);
812 height: 22px;
813 overflow: hidden;
814 outline: none;
815 background: none;
816 }
817
818 .wp-full-overlay-sidebar-content .customize-control input[type="range"]:before {
819 content: " ";
820 position: absolute;
821 top: 8px;
822 left: 0;
823 height: 6px;
824 width: 100%;
825 background: #DFE8EF;
826 box-shadow: inset 0px 1px 3px 0px rgba(0, 0, 0, 0.3);
827 border-radius: 10px;
828 }
829
830 .wp-full-overlay-sidebar-content .customize-control input[type="range"]::-webkit-slider-thumb {
831 -webkit-appearance: none;
832 width: 22px;
833 height: 22px;
834 background: #27ae60;
835 position: relative;
836 z-index: 3;
837 background: #FFFFFF;
838 border: 2px solid #B8DAEB;
839 border-radius: 4px;
840 }
841
842 .wp-full-overlay-sidebar-content .customize-control input[type="range"]::-webkit-slider-thumb:before {
843 content: "..";
844 position: absolute;
845 left: 5px;
846 top: -5px;
847 color: #B8DAEB;
848 font-size: 1em;
849 letter-spacing: 1px;
850 }
851
852 .wp-full-overlay-sidebar-content .customize-control input[type="range"]::-webkit-slider-thumb:after {
853 content: " ";
854 width: calc(100% - 55px);
855 height: 6px;
856 position: absolute;
857 z-index: 1;
858 right: 20px;
859 top: 6px;
860 background: #73C5EE;
861 }
862
863 .wp-full-overlay-sidebar-content .customize-control input[type="number"].range-value {
864 min-width: 40px;
865 max-width: 80px;
866 width: auto;
867 height: 30px;
868 top: -5px;
869 float: right;
870 padding: 4px 0px 5px 0px;
871 margin-left: 10px;
872 font-size: 13px;
873 line-height: 1;
874 text-align: center;
875 }
876
877 .wp-full-overlay-sidebar-content .customize-control input[type=number]::-webkit-inner-spin-button,
878 .wp-full-overlay-sidebar-content .customize-control input[type=number]::-webkit-outer-spin-button {
879 -webkit-appearance: none;
880 margin: 0;
881 }
882
883 .customize-control-color {
884 display: block;
885 }
886
887 .customize-control-color .customize-control-title, .customize-control-color .separator.label {
888 float: left;
889 }
890
891 .customize-control-color .wp-picker-container {
892 position: relative;
893 float: right;
894 top: -3px;
895 }
896
897 .customize-control-color .wp-picker-container .wp-picker-holder {
898 position: relative;
899 }
900
901 .customize-control-color .wp-picker-container .wp-color-result,
902 .customize-control-color .wp-picker-container .wp-color-result.button {
903 top: 0;
904 height: 30px;
905 width: 40px;
906 margin: 0;
907 padding: 0;
908 border-radius: 4px;
909 background: #2ECC71;
910 border: 2px solid #B8DAEB;
911 box-shadow: none;
912 }
913
914 .customize-control-color .wp-picker-container .wp-color-result:after,
915 .customize-control-color .wp-picker-container .wp-color-result .wp-color-result-text,
916 .customize-control-color .wp-picker-container .wp-color-result.button:after,
917 .customize-control-color .wp-picker-container .wp-color-result.button .wp-color-result-text {
918 display: none;
919 }
920
921 .customize-control-color .wp-picker-container .iris-picker {
922 position: absolute;
923 top: 40px;
924 right: 0;
925 z-index: 1000;
926 width: 275px !important;
927 border-top: none;
928 border-color: #DFDFDE;
929 border-radius: 0 0 3px 3px;
930 border: none;
931 background: white;
932 }
933
934 .customize-control-color .wp-picker-container .iris-picker, .customize-control-color .wp-picker-container .iris-picker * {
935 box-sizing: content-box;
936 }
937
938 .customize-control-color .wp-picker-container .iris-picker .iris-square {
939 width: 215px !important;
940 height: 173px !important;
941 margin-right: 0;
942 }
943
944 .customize-control-color .wp-picker-container .iris-picker .iris-strip {
945 float: right;
946 box-shadow: rgba(0, 0, 0, 0.4) 0 1px 1px inset;
947 }
948
949 .customize-control-color .wp-picker-container .iris-picker .iris-strip .ui-slider-handle {
950 border-color: #aaa !important;
951 opacity: 1;
952 box-shadow: none;
953 }
954
955 .customize-control-color .wp-picker-container .iris-picker .iris-palette {
956 width: 24px !important;
957 height: 24px !important;
958 border-radius: 50px;
959 box-shadow: rgba(0, 0, 0, 0.4) 0 1px 1px inset;
960 }
961
962 .customize-control-color .wp-picker-container .wp-picker-open + .wp-picker-input-wrap {
963 position: absolute;
964 z-index: 1000;
965 top: 35px;
966 right: 0;
967 width: 275px;
968 padding: 9px 12px;
969 background: white;
970 border: none;
971 border-radius: 3px 3px 0 0;
972 }
973
974 .customize-control-color .wp-picker-container .wp-picker-open + .wp-picker-input-wrap input.wp-color-picker {
975 float: left;
976 width: 100px;
977 font-size: 13px;
978 text-align: left;
979 margin: 0;
980 padding: 6px 12px;
981 height: auto;
982 }
983
984 .customize-control-color .wp-picker-container .wp-picker-open + .wp-picker-input-wrap input.button {
985 float: right;
986 padding: 4px 12px;
987 height: 30px;
988 }
989
990 .customize-control-font:last-child {
991 margin-bottom: 150px;
992 }
993
994 #accordion-section-live_css_edit_section .customize-section-title {
995 margin-top: -13px;
996 border-bottom: 1px solid #ddd;
997 }
998
999 #accordion-section-live_css_edit_section #css_editor {
1000 top: 70px;
1001 border-top: 10px solid white;
1002 overflow: visible;
1003 }
1004
1005 #accordion-section-live_css_edit_section #css_editor:before {
1006 content: "";
1007 width: 48px;
1008 height: 10px;
1009 display: block;
1010 background: #e8e8e8;
1011 top: -10px;
1012 position: absolute;
1013 z-index: 10000000;
1014 left: 0;
1015 }
1016
1017 #accordion-section-live_css_edit_section .ace_scroller {
1018 padding-left: 10px;
1019 }
1020
1021 .wp-full-overlay.editor_opened {
1022 margin-left: 500px;
1023 }
1024
1025 .wp-full-overlay.editor_opened #customize-controls {
1026 width: 500px;
1027 }
1028
1029 .wp-full-overlay.editor_opened.collapsed #customize-controls {
1030 width: 300px;
1031 }
1032
1033 .customize-control-media .current,
1034 .customize-control-site_icon .current,
1035 li#customize-control-site_logo .current {
1036 margin-bottom: 10px;
1037 min-height: 44px;
1038 background: #F5FCFF;
1039 border: 2px solid #B8DAEB;
1040 border-radius: 4px;
1041 }
1042
1043 .customize-control-media .current .container, .customize-control-media .current span,
1044 .customize-control-site_icon .current .container,
1045 .customize-control-site_icon .current span,
1046 li#customize-control-site_logo .current .container,
1047 li#customize-control-site_logo .current span {
1048 border: none;
1049 }
1050
1051 .customize-control-media .inner, .customize-control-media .current span,
1052 .customize-control-site_icon .inner,
1053 .customize-control-site_icon .current span,
1054 li#customize-control-site_logo .inner,
1055 li#customize-control-site_logo .current span {
1056 font-size: 13px;
1057 color: #98C6DD;
1058 }
1059
1060 .customize-control-media .inner,
1061 .customize-control-site_icon .inner,
1062 li#customize-control-site_logo .inner {
1063 line-height: 1.4;
1064 }
1065
1066 .customize-control-media .thumbnail-image,
1067 .customize-control-site_icon .thumbnail-image,
1068 li#customize-control-site_logo .thumbnail-image {
1069 padding: 14px;
1070 text-align: center;
1071 }
1072
1073 .customize-control-media .thumbnail-image img,
1074 .customize-control-site_icon .thumbnail-image img,
1075 li#customize-control-site_logo .thumbnail-image img {
1076 width: auto;
1077 }
1078
1079 .customize-control-media .actions,
1080 .customize-control-site_icon .actions,
1081 li#customize-control-site_logo .actions {
1082 margin-bottom: 0;
1083 }
1084
1085 .customize-control-typography select, .customize-control-typography select {
1086 margin-bottom: 10px;
1087 }
1088
1089 .customize-control-typography .description, .customize-control-typography .description {
1090 margin-top: -3px;
1091 }
1092
1093 .customize-control-typography ul li, .customize-control-typography ul li {
1094 width: 100%;
1095 margin: 0;
1096 }
1097
1098 .default-preset-button {
1099 background-color: #F5F6F6;
1100 float: right;
1101 padding: 1px 8px;
1102 border-radius: 3px;
1103 border: 1px solid #CBCBCB;
1104 margin-right: 4px;
1105 font-family: "Open Sans",sans-serif;
1106 font-size: 13px;
1107 }
1108
1109 .customize-control-preset .description {
1110 margin-right: 5px;
1111 font-style: normal;
1112 }
1113
1114 .customify_preset.radio_buttons .customify_radio_button {
1115 border: none;
1116 display: inline-block;
1117 padding: 2px;
1118 margin: 3px;
1119 position: relative;
1120 overflow: hidden;
1121 height: auto;
1122 }
1123
1124 .customify_preset.radio_buttons .customify_radio_button input[type="radio"] {
1125 opacity: 0;
1126 width: 100%;
1127 height: 100%;
1128 position: absolute;
1129 z-index: 9999;
1130 }
1131
1132 .customify_preset.radio_buttons .customify_radio_button input[type="radio"]:checked + label {
1133 background-color: #ebebeb;
1134 }
1135
1136 .customify_preset.radio_buttons .customify_radio_button input[type="radio"]:checked + label:before {
1137 content: '>';
1138 color: inherit;
1139 }
1140
1141 .customify_preset.radio_buttons .customify_radio_button input[type="radio"]:checked + label:after {
1142 content: '<';
1143 color: inherit;
1144 }
1145
1146 .customify_preset.radio_buttons .customify_radio_button input[type="radio"]:checked:before {
1147 opacity: 0;
1148 }
1149
1150 .customify_preset.radio_buttons .customify_radio_button label {
1151 position: relative;
1152 z-index: 999;
1153 border-left: 4px solid;
1154 }
1155
1156 .customify_preset .awesome_preset {
1157 width: 45%;
1158 position: relative;
1159 display: inline-block;
1160 text-align: center;
1161 color: white;
1162 margin-top: 5px;
1163 margin-bottom: 25px;
1164 transition: all 0.2s;
1165 }
1166
1167 .customify_preset .awesome_preset:hover {
1168 opacity: 0.9;
1169 }
1170
1171 .customify_preset .awesome_preset:before {
1172 content: '';
1173 position: absolute;
1174 top: 1px;
1175 left: 1px;
1176 right: 1px;
1177 bottom: 1px;
1178 border: 1px solid #FFF;
1179 background: transparent;
1180 opacity: .5;
1181 border-radius: 4px;
1182 z-index: 5;
1183 }
1184
1185 .customify_preset .awesome_preset .preset-wrap .preset-color {
1186 height: 128px;
1187 border-radius: 4px 4px 0 0;
1188 padding: 17px 0 27px;
1189 }
1190
1191 .customify_preset .awesome_preset .preset-wrap .preset-color .first-font {
1192 display: inline-block;
1193 width: 100%;
1194 font-size: 55px;
1195 line-height: 1;
1196 }
1197
1198 .customify_preset .awesome_preset .preset-wrap .preset-color .secondary-font {
1199 display: inline-block;
1200 width: 100%;
1201 font-size: 20px;
1202 line-height: 1;
1203 margin-top: 8px;
1204 }
1205
1206 .customify_preset .awesome_preset .preset-wrap .preset-name {
1207 position: relative;
1208 font-size: 11px;
1209 text-transform: UPPERCASE;
1210 border-radius: 0 0 4px 4px;
1211 padding: 1px;
1212 }
1213
1214 .customify_preset .awesome_preset .preset-wrap .preset-name:before {
1215 content: '';
1216 position: absolute;
1217 border-color: inherit;
1218 border: 10px solid;
1219 border-left-color: transparent;
1220 border-right-color: transparent;
1221 border-top: transparent;
1222 top: -10px;
1223 border-bottom-color: inherit;
1224 left: 40%;
1225 }
1226
1227 .customify_preset .awesome_preset:nth-child(odd) {
1228 margin-right: 7%;
1229 }
1230
1231 .customify_preset .awesome_preset input[type=radio] {
1232 height: 100%;
1233 width: 100%;
1234 position: absolute;
1235 border: 0;
1236 box-shadow: none;
1237 color: #006505;
1238 background-color: transparent;
1239 border-radius: 0;
1240 margin: 0;
1241 display: inline-block;
1242 top: 0;
1243 left: 0;
1244 z-index: 10;
1245 }
1246
1247 .customify_preset .awesome_preset input[type=radio]:checked:before {
1248 position: absolute;
1249 height: 25px;
1250 width: 25px;
1251 top: -13px;
1252 right: -14px;
1253 background: #FFF;
1254 z-index: 1;
1255 }
1256
1257 .customify_preset .awesome_preset input[type=radio]:checked:after {
1258 -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
1259 filter: alpha(opacity=0);
1260 content: '';
1261 position: absolute;
1262 width: 26px;
1263 height: 26px;
1264 border-radius: 50%;
1265 top: -5px;
1266 right: -5px;
1267 z-index: 10;
1268 background: #73C5EE url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+Cjxzdmcgd2lkdGg9IjEzcHgiIGhlaWdodD0iOXB4IiB2aWV3Qm94PSIwIDAgMTMgOSIgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIj4KICAgIDxkZWZzPjwvZGVmcz4KICAgIDxnIGlkPSJQYWdlLTEiIHN0cm9rZT0ibm9uZSIgc3Ryb2tlLXdpZHRoPSIxIiBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPgogICAgICAgIDxnIGlkPSJDdXN0b21pZnktQ29weSIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoLTIxLjAwMDAwMCwgLTQwOC4wMDAwMDApIiBmaWxsPSIjRkZGRkZGIj4KICAgICAgICAgICAgPGcgaWQ9IkhlYWRlciIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoLTIxLjAwMDAwMCwgNDcuMDAwMDAwKSI+CiAgICAgICAgICAgICAgICA8ZyBpZD0iQ29udGVudCIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMTAuMDAwMDAwLCA3NS4wMDAwMDApIj4KICAgICAgICAgICAgICAgICAgICA8ZyBpZD0iRmllbGQtLS1DaGVja2JveC1Db3B5IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgyNy4wMDAwMDAsIDI0OS4wMDAwMDApIj4KICAgICAgICAgICAgICAgICAgICAgICAgPGcgaWQ9IkNoZWNrYm94IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgwLjAwMDAwMCwgMzAuMDAwMDAwKSI+CiAgICAgICAgICAgICAgICAgICAgICAgICAgICA8cGF0aCBkPSJNMTAuMDM4NDk1LDE2IEwxNy4xMTYxMzc1LDguOTIxNDg3NiBMMTUuMTk0NjQ5OCw3IEwxMC4wMzg0OTUsMTIuMTU1MDY3NCBMNi45MjE0ODc2LDkuMDM4OTI5OTcgTDUsMTAuOTYwNDE3NiBMMTAuMDM4NDk1LDE2IFoiIGlkPSJQYWdlLTEiPjwvcGF0aD4KICAgICAgICAgICAgICAgICAgICAgICAgPC9nPgogICAgICAgICAgICAgICAgICAgIDwvZz4KICAgICAgICAgICAgICAgIDwvZz4KICAgICAgICAgICAgPC9nPgogICAgICAgIDwvZz4KICAgIDwvZz4KPC9zdmc+) no-repeat;
1269 background-position: center center;
1270 }
1271
1272 .customify_radio_image {
1273 display: inline-block;
1274 }
1275
1276 .customify_radio_image label {
1277 display: block;
1278 float: left;
1279 margin-right: 10px;
1280 position: relative;
1281 }
1282
1283 .customify_radio_image label input[type=radio] {
1284 position: absolute;
1285 top: 0;
1286 bottom: 0;
1287 left: 0;
1288 right: 0;
1289 width: 100%;
1290 height: 100%;
1291 visibility: hidden;
1292 }
1293
1294 .customify_radio_image label input[type=radio] img {
1295 cursor: pointer;
1296 border: 2px solid transparent;
1297 }
1298
1299 .customify_radio_image label input[type=radio]:checked + img {
1300 border: 3px solid #73C5EE;
1301 }
1302
1303 .customify_ace_editor {
1304 display: block;
1305 min-height: 200px;
1306 border: 1px solid #ddd;
1307 }
1308
1309 .customize-control-custom_background .hide {
1310 display: none;
1311 }
1312
1313 .customize-control-custom_background .upload_button_div {
1314 margin: 10px 0;
1315 }
1316
1317 .customize-control-custom_background .upload_button_div > * {
1318 margin-right: 10px;
1319 }
1320
1321 .customize-control-custom_background .preview_screenshot {
1322 text-align: center;
1323 margin: 10px 0;
1324 }
1325
1326 .customize-control-custom_background .preview_screenshot img {
1327 border: 2px solid #ccc;
1328 }
1329
1330 #customify_import_demo_data_button {
1331 width: 70%;
1332 text-align: center;
1333 padding: 10px;
1334 display: inline-block;
1335 height: auto;
1336 margin: 0 15% 10% 15%;
1337 }
1338
1339 .import_step_note {
1340 margin: 5px;
1341 width: 100%;
1342 display: inline-block;
1343 }
1344
1345 .import_step_note:before {
1346 content: "\1F449";
1347 }
1348
1349 .import_step_note.success:before {
1350 content: "\1F44D";
1351 }
1352
1353 .import_step_note.failed:before {
1354 content: "\274C";
1355 }
1356
1357 #customize-header-actions {
1358 background: #ffffff;
1359 border-color: #e0e8ef;
1360 }
1361
1362 .wp-full-overlay-sidebar,
1363 .customize-themes-panel,
1364 #customize-sidebar-outer-content {
1365 background: #F7F9FA;
1366 border-right: 1px solid #e0e8ef;
1367 }
1368
1369 .outer-section-open #customize-controls .wp-full-overlay-sidebar-content,
1370 .attachment-media-view, .media-widget-preview.media_audio, .media-widget-preview.media_image {
1371 background: #F7F9FA;
1372 }
1373
1374 #customize-theme-controls #accordion-section-menu_locations {
1375 border-bottom: 1px solid #e0e8ef;
1376 }
1377
1378 #customize-controls #accordion-section-themes > .accordion-section-title {
1379 font-weight: 600;
1380 border-bottom: 1px solid #e0e8ef;
1381 }
1382
1383 #customize-controls #accordion-section-themes > .accordion-section-title:hover {
1384 background: #fff;
1385 }
1386
1387 #customize-controls .panel-meta.customize-info {
1388 border-bottom-color: #e0e8ef;
1389 }
1390
1391 #customize-theme-controls .control-section .accordion-section-title {
1392 font-weight: 400;
1393 border-top: 1px solid #e0e8ef;
1394 border-bottom: none;
1395 }
1396
1397 #customize-theme-controls .control-section:last-of-type > .accordion-section-title {
1398 border-bottom: 1px solid #e0e8ef;
1399 }
1400
1401 #customize-theme-controls .customize-section-title {
1402 border-top: 1px solid #e0e8ef;
1403 border-bottom: 1px solid #e0e8ef;
1404 }
1405
1406 #customize-controls .control-section .accordion-section-title:focus, #customize-controls .control-section .accordion-section-title:hover, #customize-controls .control-section.open .accordion-section-title, #customize-controls .control-section:hover > .accordion-section-title {
1407 color: #056184;
1408 background: #f5fcff;
1409 border-left-color: #f5fcff;
1410 }
1411
1412 .wp-customizer {
1413 /* SECTION: NAV MENUS */
1414 }
1415
1416 .wp-customizer .menu-item-edit-active .menu-item-handle, .wp-customizer .section-open .menu-item-settings, .wp-customizer .menu-item-bar .menu-item-handle:hover {
1417 border-color: #e0e8ef;
1418 }
1419
1420 .wp-customizer .section-open .menu-item-settings {
1421 background: #f5fcff;
1422 }
1423
1424 .wp-customizer .control-section-nav_menu .menu-location-settings {
1425 border-top-color: #e0e8ef !important;
1426 }
1427
1428 [data-balloon] {
1429 position: relative;
1430 }
1431
1432 [data-balloon]::before {
1433 opacity: 0;
1434 pointer-events: none;
1435 transition: all .18s ease-out;
1436 background: rgba(17, 17, 17, 0.9);
1437 border-radius: 4px;
1438 color: #fff;
1439 content: attr(data-balloon);
1440 font-size: 12px;
1441 padding: .5em 1em;
1442 position: absolute;
1443 white-space: nowrap;
1444 z-index: 10;
1445 }
1446
1447 [data-balloon]::after {
1448 background: no-repeat url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="36px" height="12px"><path fill="rgba(17, 17, 17, 0.9)" transform="rotate(0)" d="M2.658,0.000 C-13.615,0.000 50.938,0.000 34.662,0.000 C28.662,0.000 23.035,12.002 18.660,12.002 C14.285,12.002 8.594,0.000 2.658,0.000 Z"/></svg>');
1449 background-size: 100% auto;
1450 width: 18px;
1451 height: 6px;
1452 opacity: 0;
1453 pointer-events: none;
1454 transition: all .18s ease-out;
1455 content: '';
1456 position: absolute;
1457 z-index: 10;
1458 }
1459
1460 [data-balloon]:hover::before, [data-balloon]:hover::after {
1461 opacity: 1;
1462 pointer-events: auto;
1463 }
1464
1465 [data-balloon][data-balloon-pos="up"]::before {
1466 bottom: 100%;
1467 left: 50%;
1468 margin-bottom: 11px;
1469 -webkit-transform: translate3d(-50%, 10px, 0);
1470 transform: translate3d(-50%, 10px, 0);
1471 -webkit-transform-origin: top;
1472 transform-origin: top;
1473 }
1474
1475 [data-balloon][data-balloon-pos="up"]::after {
1476 bottom: 100%;
1477 left: 50%;
1478 margin-bottom: 5px;
1479 -webkit-transform: translate3d(-50%, 10px, 0);
1480 transform: translate3d(-50%, 10px, 0);
1481 -webkit-transform-origin: top;
1482 transform-origin: top;
1483 }
1484
1485 [data-balloon][data-balloon-pos="up"]:hover::before {
1486 -webkit-transform: translate3d(-50%, 0, 0);
1487 transform: translate3d(-50%, 0, 0);
1488 }
1489
1490 [data-balloon][data-balloon-pos="up"]:hover::after {
1491 -webkit-transform: translate3d(-50%, 0, 0);
1492 transform: translate3d(-50%, 0, 0);
1493 }
1494
1495 [data-balloon][data-balloon-pos='down']::before {
1496 left: 50%;
1497 margin-top: 11px;
1498 top: 100%;
1499 -webkit-transform: translate3d(-50%, -10px, 0);
1500 transform: translate3d(-50%, -10px, 0);
1501 }
1502
1503 [data-balloon][data-balloon-pos='down']::after {
1504 background: no-repeat url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="36px" height="12px"><path fill="rgba(17, 17, 17, 0.9)" transform="rotate(180 18 6)" d="M2.658,0.000 C-13.615,0.000 50.938,0.000 34.662,0.000 C28.662,0.000 23.035,12.002 18.660,12.002 C14.285,12.002 8.594,0.000 2.658,0.000 Z"/></svg>');
1505 background-size: 100% auto;
1506 width: 18px;
1507 height: 6px;
1508 left: 50%;
1509 margin-top: 5px;
1510 top: 100%;
1511 -webkit-transform: translate3d(-50%, -10px, 0);
1512 transform: translate3d(-50%, -10px, 0);
1513 }
1514
1515 [data-balloon][data-balloon-pos='down']:hover::before {
1516 -webkit-transform: translate3d(-50%, 0, 0);
1517 transform: translate3d(-50%, 0, 0);
1518 }
1519
1520 [data-balloon][data-balloon-pos='down']:hover::after {
1521 -webkit-transform: translate3d(-50%, 0, 0);
1522 transform: translate3d(-50%, 0, 0);
1523 }
1524
1525 [data-balloon][data-balloon-pos='left']::before {
1526 margin-right: 11px;
1527 right: 100%;
1528 top: 50%;
1529 -webkit-transform: translate3d(10px, -50%, 0);
1530 transform: translate3d(10px, -50%, 0);
1531 }
1532
1533 [data-balloon][data-balloon-pos='left']::after {
1534 background: no-repeat url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="12px" height="36px"><path fill="rgba(17, 17, 17, 0.9)" transform="rotate(-90 18 18)" d="M2.658,0.000 C-13.615,0.000 50.938,0.000 34.662,0.000 C28.662,0.000 23.035,12.002 18.660,12.002 C14.285,12.002 8.594,0.000 2.658,0.000 Z"/></svg>');
1535 background-size: 100% auto;
1536 width: 6px;
1537 height: 18px;
1538 margin-right: 5px;
1539 right: 100%;
1540 top: 50%;
1541 -webkit-transform: translate3d(10px, -50%, 0);
1542 transform: translate3d(10px, -50%, 0);
1543 }
1544
1545 [data-balloon][data-balloon-pos='left']:hover::before {
1546 -webkit-transform: translate3d(0, -50%, 0);
1547 transform: translate3d(0, -50%, 0);
1548 }
1549
1550 [data-balloon][data-balloon-pos='left']:hover::after {
1551 -webkit-transform: translate3d(0, -50%, 0);
1552 transform: translate3d(0, -50%, 0);
1553 }
1554
1555 [data-balloon][data-balloon-pos='right']::before {
1556 left: 100%;
1557 margin-left: 11px;
1558 top: 50%;
1559 -webkit-transform: translate3d(-10px, -50%, 0);
1560 transform: translate3d(-10px, -50%, 0);
1561 }
1562
1563 [data-balloon][data-balloon-pos='right']::after {
1564 background: no-repeat url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="12px" height="36px"><path fill="rgba(17, 17, 17, 0.9)" transform="rotate(90 6 6)" d="M2.658,0.000 C-13.615,0.000 50.938,0.000 34.662,0.000 C28.662,0.000 23.035,12.002 18.660,12.002 C14.285,12.002 8.594,0.000 2.658,0.000 Z"/></svg>');
1565 background-size: 100% auto;
1566 width: 6px;
1567 height: 18px;
1568 left: 100%;
1569 margin-left: 5px;
1570 top: 50%;
1571 -webkit-transform: translate3d(-10px, -50%, 0);
1572 transform: translate3d(-10px, -50%, 0);
1573 }
1574
1575 [data-balloon][data-balloon-pos='right']:hover::before {
1576 -webkit-transform: translate3d(0, -50%, 0);
1577 transform: translate3d(0, -50%, 0);
1578 }
1579
1580 [data-balloon][data-balloon-pos='right']:hover::after {
1581 -webkit-transform: translate3d(0, -50%, 0);
1582 transform: translate3d(0, -50%, 0);
1583 }
1584
1585 [data-balloon][data-balloon-length='small']::before {
1586 white-space: normal;
1587 width: 80px;
1588 }
1589
1590 [data-balloon][data-balloon-length='medium']::before {
1591 white-space: normal;
1592 width: 150px;
1593 }
1594
1595 [data-balloon][data-balloon-length='large']::before {
1596 white-space: normal;
1597 width: 260px;
1598 }
1599
1600 [data-balloon][data-balloon-length='xlarge']::before {
1601 white-space: normal;
1602 width: 380px;
1603 }
1604
1605 @media screen and (max-width: 768px) {
1606 [data-balloon][data-balloon-length='xlarge']::before {
1607 white-space: normal;
1608 width: 90vw;
1609 }
1610 }
1611
1612 [data-balloon][data-balloon-length='fit']::before {
1613 white-space: normal;
1614 width: 100%;
1615 }
1616
1617 /* ==========================================================================
1618 #FEEDBACK MODAL
1619 ========================================================================== */
1620 body.modal-open {
1621 overflow: hidden;
1622 }
1623
1624 body.modal-open #style-manager-user-feedback-modal .modal {
1625 overflow-x: hidden;
1626 overflow-y: auto;
1627 visibility: visible;
1628 opacity: 1;
1629 -webkit-transform: translate(0, 0);
1630 transform: translate(0, 0);
1631 }
1632
1633 #style-manager-user-feedback-modal {
1634 height: 100%;
1635 }
1636
1637 #style-manager-user-feedback-modal .modal {
1638 position: relative;
1639 height: 100%;
1640 display: -ms-flexbox;
1641 display: flex;
1642 -ms-flex-align: center;
1643 align-items: center;
1644 top: 0;
1645 right: 0;
1646 bottom: 0;
1647 left: 0;
1648 z-index: 1050;
1649 opacity: 0;
1650 visibility: hidden;
1651 overflow: hidden;
1652 outline: 0;
1653 transition: all .3s ease;
1654 -webkit-transform: translate(0, -10%);
1655 transform: translate(0, -10%);
1656 font-family: 'Galano Grotesque Alt', -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,"Helvetica Neue",sans-serif;
1657 font-weight: 400;
1658 font-size: 16px;
1659 line-height: 1.7;
1660 }
1661
1662 #style-manager-user-feedback-modal .modal-dialog {
1663 position: relative;
1664 width: auto;
1665 margin: 10px;
1666 text-align: left;
1667 }
1668
1669 #style-manager-user-feedback-modal .modal-content {
1670 position: relative;
1671 display: -ms-flexbox;
1672 display: flex;
1673 -ms-flex-direction: column;
1674 flex-direction: column;
1675 background-color: #fff;
1676 background-clip: padding-box;
1677 border: none;
1678 border-radius: 4px;
1679 box-shadow: 0 4px 4px 0 rgba(42, 54, 52, 0.1), 0 8px 8px 0 rgba(42, 54, 52, 0.1), 0 16px 16px 0 rgba(42, 54, 52, 0.1), 0 16px 32px 0 rgba(42, 54, 52, 0.1), 0 32px 64px 0 rgba(42, 54, 52, 0.1), 0 64px 128px 0 rgba(42, 54, 52, 0.1);
1680 outline: 0;
1681 }
1682
1683 #style-manager-user-feedback-modal .modal-content p {
1684 color: #000;
1685 }
1686
1687 #style-manager-user-feedback-modal .modal-content p a {
1688 font-weight: 500;
1689 color: #9660C6;
1690 border-bottom: 1px solid #9660C6;
1691 }
1692
1693 #style-manager-user-feedback-modal .modal-content > form {
1694 margin-bottom: 20px;
1695 }
1696
1697 #style-manager-user-feedback-modal .modal-backdrop {
1698 position: fixed;
1699 top: 0;
1700 right: 0;
1701 bottom: 0;
1702 left: 0;
1703 z-index: 1040;
1704 background-color: #000;
1705 opacity: 0;
1706 visibility: hidden;
1707 transition: all 0.3s ease;
1708 }
1709
1710 .modal-open #style-manager-user-feedback-modal .modal-backdrop {
1711 opacity: 0.8;
1712 visibility: visible;
1713 }
1714
1715 #style-manager-user-feedback-modal .modal-header {
1716 display: -ms-flexbox;
1717 display: flex;
1718 -ms-flex-align: start;
1719 align-items: flex-start;
1720 -ms-flex-pack: justify;
1721 justify-content: space-between;
1722 padding: 30px 48px 10px 48px;
1723 }
1724
1725 #style-manager-user-feedback-modal .modal-header .close.button {
1726 top: -10px;
1727 }
1728
1729 #style-manager-user-feedback-modal .modal-header .close.icon {
1730 opacity: 0.5;
1731 }
1732
1733 #style-manager-user-feedback-modal .modal-header .close:hover {
1734 opacity: 1;
1735 }
1736
1737 #style-manager-user-feedback-modal .modal-title {
1738 margin-bottom: 10px;
1739 line-height: 1.5;
1740 }
1741
1742 #style-manager-user-feedback-modal .modal-title.modal-title--small {
1743 font-weight: 500;
1744 }
1745
1746 #style-manager-user-feedback-modal .modal-body {
1747 position: relative;
1748 -ms-flex: 1 1 auto;
1749 flex: 1 1 auto;
1750 padding: 30px 30px 0 30px;
1751 }
1752
1753 #style-manager-user-feedback-modal .modal-body.full {
1754 padding: 0;
1755 }
1756
1757 #style-manager-user-feedback-modal .modal-body.full .box {
1758 padding-top: 0;
1759 padding-bottom: 0;
1760 margin-top: 0;
1761 }
1762
1763 #style-manager-user-feedback-modal .modal-body.full + .modal-footer.full .box {
1764 padding-top: 18px;
1765 }
1766
1767 #style-manager-user-feedback-modal .modal-footer {
1768 padding: 30px;
1769 text-align: center;
1770 }
1771
1772 #style-manager-user-feedback-modal .modal-footer .box .button:last-child {
1773 margin-bottom: 0;
1774 }
1775
1776 #style-manager-user-feedback-modal .modal-footer.full {
1777 padding: 0;
1778 }
1779
1780 #style-manager-user-feedback-modal .modal-scrollbar-measure {
1781 position: absolute;
1782 top: -9999px;
1783 width: 50px;
1784 height: 50px;
1785 overflow: scroll;
1786 }
1787
1788 #style-manager-user-feedback-modal .modal-state {
1789 display: none;
1790 }
1791
1792 #style-manager-user-feedback-modal .modal-state:checked + .modal {
1793 opacity: 1;
1794 visibility: visible;
1795 }
1796
1797 #style-manager-user-feedback-modal .modal-state:checked + .modal .modal__inner {
1798 top: 0;
1799 }
1800
1801 @media (min-width: 576px) {
1802 #style-manager-user-feedback-modal .modal-dialog {
1803 max-width: 655px;
1804 margin: 30px auto;
1805 }
1806 #style-manager-user-feedback-modal .modal-sm {
1807 max-width: 300px;
1808 }
1809 }
1810
1811 @media (min-width: 576px) {
1812 #style-manager-user-feedback-modal .modal-lg {
1813 max-width: 800px;
1814 }
1815 }
1816
1817 #style-manager-user-feedback .modal-body .box {
1818 position: relative;
1819 -ms-flex-direction: column;
1820 flex-direction: column;
1821 display: -ms-flexbox;
1822 display: flex;
1823 -ms-flex-wrap: nowrap;
1824 flex-wrap: nowrap;
1825 -ms-flex-align: center;
1826 align-items: center;
1827 margin: 20px 0;
1828 padding: 16px 52px;
1829 border-radius: 4px;
1830 }
1831
1832 #style-manager-user-feedback .modal-body .box > * {
1833 width: 100%;
1834 }
1835
1836 #style-manager-user-feedback .modal-body p {
1837 font-size: 16px;
1838 margin-bottom: 20px;
1839 }
1840
1841 #style-manager-user-feedback .modal-body textarea {
1842 width: 100%;
1843 margin: 0;
1844 padding: 11px 18px;
1845 border: 1px solid #dddddd;
1846 border-radius: 4px;
1847 box-shadow: none;
1848 font-family: 'Galano Grotesque Alt', -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,"Helvetica Neue",sans-serif;
1849 font-size: 16px;
1850 line-height: 26px;
1851 color: #473850;
1852 }
1853
1854 #style-manager-user-feedback .modal-title {
1855 margin-top: 0;
1856 margin-bottom: 34px;
1857 font-family: 'Galano Classic', -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,"Helvetica Neue",sans-serif;
1858 font-weight: 600;
1859 font-size: 28px;
1860 line-height: 1.4;
1861 text-align: center;
1862 }
1863
1864 #style-manager-user-feedback .button {
1865 text-decoration: none;
1866 cursor: pointer;
1867 -webkit-font-smoothing: antialiased;
1868 position: relative;
1869 transition-duration: .2s;
1870 transition-timing-function: cubic-bezier(0, 0, 0.58, 1);
1871 transition-property: -webkit-transform,background,background-color,color,box-shadow;
1872 transition-property: transform,background,background-color,color,box-shadow;
1873 display: inline-block;
1874 padding: 15px 50px;
1875 border-radius: 2px;
1876 font-family: "Galano Classic", -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,"Helvetica Neue",sans-serif;
1877 font-size: 16px;
1878 line-height: 23px;
1879 font-weight: 600;
1880 text-align: center;
1881 background-color: #9660c6;
1882 color: #ffffff;
1883 border-radius: 4px;
1884 box-shadow: none;
1885 height: auto;
1886 width: 100%;
1887 margin-top: 20px;
1888 }
1889
1890 #style-manager-user-feedback .button:hover {
1891 background-color: #9660c6;
1892 color: #ffffff;
1893 -webkit-transform: scale(1.05) translateY(-3px);
1894 transform: scale(1.05) translateY(-3px);
1895 box-shadow: 0 10px 20px -10px rgba(0, 0, 0, 0.7);
1896 }
1897
1898 #style-manager-user-feedback .second-step {
1899 margin-top: 18px;
1900 }
1901
1902 #style-manager-user-feedback .thanks-step,
1903 #style-manager-user-feedback .error-step {
1904 text-align: center;
1905 }
1906
1907 #style-manager-user-feedback .thanks-step .modal-title,
1908 #style-manager-user-feedback .error-step .modal-title {
1909 margin-bottom: 0;
1910 }
1911
1912 #style-manager-user-feedback .thanks-step p:last-child,
1913 #style-manager-user-feedback .error-step p:last-child {
1914 margin-bottom: 10px;
1915 }
1916
1917 .scorecard {
1918 display: -ms-flexbox;
1919 display: flex;
1920 -ms-flex-align: baseline;
1921 align-items: baseline;
1922 -ms-flex-pack: space-evenly;
1923 justify-content: space-evenly;
1924 color: #9660C6;
1925 font-family: "Galano Classic", -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,"Helvetica Neue",sans-serif;
1926 font-size: 18px;
1927 font-weight: 600;
1928 text-align: center;
1929 }
1930
1931 .scorecard > label {
1932 font-size: 20px;
1933 }
1934
1935 .scorecard > label span {
1936 display: block;
1937 width: 46px;
1938 border: 2px solid #9660C6;
1939 line-height: 46px;
1940 border-radius: 100%;
1941 background: #FFF;
1942 transition: all 0.25s ease;
1943 }
1944
1945 .scorecard > label input[type="radio"] {
1946 display: none;
1947 }
1948
1949 .scorecard > label span:hover,
1950 .scorecard > label input[type="radio"]:checked ~ span {
1951 background: #9660C6;
1952 color: #FFF;
1953 }
1954
1955 .font-options__wrapper .font-options__options-list {
1956 border-color: #B8DAEB;
1957 box-shadow: 0 10px 20px 0 rgba(0, 0, 0, 0.15);
1958 }
1959
1960 .font-options__wrapper .font-options__option {
1961 margin-bottom: 12px;
1962 }
1963
1964 .font-options__wrapper .font-options__option label {
1965 display: block;
1966 margin-bottom: 6px;
1967 }
1968
1969 .font-options__wrapper [type=checkbox]:checked ~ .font-options__options-list {
1970 opacity: 1;
1971 display: block;
1972 }
1973
1974 input.customify_font_tooltip {
1975 display: none;
1976 }
1977
1978 ul.font-options__options-list .select2-container {
1979 width: 100% !important;
1980 }
1981
1982 ul.font-options__options-list .select2-container .select2-selection--single {
1983 -webkit-appearance: initial;
1984 }
1985
1986 ul.font-options__options-list .select2-container .select2-selection--single .select2-selection__arrow {
1987 display: none;
1988 }
1989
1990 ul.font-options__options-list .select2-container--default .select2-selection--single .select2-selection__rendered {
1991 color: inherit;
1992 line-height: initial;
1993 }
1994
1995 .select2-container.select2-container--open {
1996 z-index: 99999999;
1997 }
1998
1999 #customize-theme-controls .select2-container {
2000 width: 100% !important;
2001 }
2002
2003 #customize-theme-controls .select2-container .select2-selection--multiple {
2004 -webkit-appearance: initial;
2005 padding: 4px 8px 4px;
2006 height: auto;
2007 background: none;
2008 }
2009
2010 #customize-theme-controls .select2-container .select2-selection--multiple .select2-selection__arrow {
2011 display: none;
2012 }
2013
2014 #customize-theme-controls .select2-container .select2-selection--multiple .select2-selection__rendered {
2015 padding: 0;
2016 display: -ms-flexbox;
2017 display: flex;
2018 }
2019
2020 #customize-theme-controls .select2-container .select2-selection--multiple .select2-selection__rendered .select2-search--inline {
2021 -ms-flex: 1;
2022 flex: 1;
2023 }
2024
2025 #customize-theme-controls .select2-container .select2-selection--multiple .select2-selection__rendered .select2-search--inline .select2-search__field[class] {
2026 min-width: 100%;
2027 border-width: 0;
2028 margin-top: 3px !important;
2029 }
2030
2031 #customize-theme-controls .select2-container .select2-selection--multiple .select2-selection__rendered .select2-selection__choice {
2032 padding: 3px 7px;
2033 margin-right: 6px;
2034 margin-top: 0px;
2035 border-color: #e0e8ef;
2036 background-color: #f6fbff;
2037 }
2038
2039 #customize-theme-controls .select2-container .select2-search--inline .select2-search__field {
2040 height: 29px;
2041 min-width: 9em;
2042 margin-top: 0;
2043 }
2044
2045 .select2-container--default .select2-results__option[aria-selected=true][class] {
2046 background: transparent;
2047 opacity: 0.3;
2048 pointer-events: none;
2049 }
2050
2051 .select2-container .select2-dropdown {
2052 border-color: #e0e8ef;
2053 }
2054
2055 #customize-theme-controls .widget-content .accordion-container {
2056 margin-left: -10px;
2057 margin-right: -10px;
2058 margin-top: 20px;
2059 margin-bottom: 10px;
2060 }
2061
2062 #customize-theme-controls .widget-content .accordion-container .accordion-section .accordion-section-content {
2063 position: relative;
2064 left: 0;
2065 max-height: 0;
2066 padding-top: 0;
2067 padding-bottom: 0;
2068 overflow: hidden;
2069 transition: all .4s ease;
2070 color: #416B7E;
2071 }
2072
2073 #customize-theme-controls .widget-content .accordion-container .accordion-section .accordion-section-content p:first-child {
2074 margin-top: 0;
2075 }
2076
2077 #customize-theme-controls .widget-content .accordion-container .accordion-section .accordion-section-content p:last-child {
2078 margin-bottom: 0;
2079 }
2080
2081 #customize-theme-controls .widget-content .accordion-container .accordion-section .accordion-section-title {
2082 color: #39474D;
2083 }
2084
2085 #customize-theme-controls .widget-content .accordion-container .accordion-section .accordion-section-title:after {
2086 content: "\f142";
2087 -webkit-transform: rotate(180deg);
2088 transform: rotate(180deg);
2089 }
2090
2091 #customize-theme-controls .widget-content .accordion-container .accordion-section.open {
2092 border-bottom: none;
2093 }
2094
2095 #customize-theme-controls .widget-content .accordion-container .accordion-section.open .accordion-section-content {
2096 max-height: 100%;
2097 padding-top: 17px;
2098 padding-bottom: 17px;
2099 }
2100
2101 #customize-theme-controls .widget-content .accordion-container .accordion-section.open .accordion-section-title {
2102 border-bottom: 1px solid;
2103 }
2104
2105 #customize-theme-controls .widget-content .accordion-container .accordion-section.open .accordion-section-title:after {
2106 -webkit-transform: rotate(0deg);
2107 transform: rotate(0deg);
2108 }
2109
2110 #customize-theme-controls .widget-content .accordion-container label.customize-control-title, #customize-theme-controls .widget-content .accordion-container label.separator.label {
2111 cursor: default;
2112 }
2113
2114 .widget .widget-content > p input[type=checkbox],
2115 .widget .widget-content > p input[type=radio] {
2116 margin-bottom: 3px;
2117 margin-top: 3px;
2118 }
2119
2120 .widget .widget-content small {
2121 margin-top: 5px;
2122 display: block;
2123 }
2124
2125 #available-widgets [class*=pixelgrade] .widget .widget-title:before,
2126 #available-widgets [class*=featured-posts] .widget .widget-title:before,
2127 #available-widgets [class*=categories-image-grid] .widget .widget-title:before {
2128 content: "\f538";
2129 color: #9660c6;
2130 }
2131
2132 #available-widgets [class*=pixelgrade-featured-posts-slideshow] .widget .widget-title:before {
2133 content: "\f233";
2134 }
2135
2136 #available-widgets [class*=pixelgrade-featured-posts-carousel] .widget .widget-title:before {
2137 content: "\f169";
2138 }
2139
2140 #available-widgets [class*=featured-posts-grid] .widget .widget-title:before {
2141 content: "\f180";
2142 }
2143
2144 #available-widgets [class*=featured-posts-list] .widget .widget-title:before {
2145 content: "\f164";
2146 }
2147
2148 #available-widgets [class*=categories-image-grid] .widget .widget-title:before {
2149 content: "\f163";
2150 }
2151
2152 #available-widgets [class*=pixelgrade-promo-box] .widget .widget-title:before {
2153 content: "\f488";
2154 }
2155
2156 .ui-tooltip {
2157 z-index: 999999;
2158 }
2159
2160 .wp-customizer .widget-conditional .condition-control:after {
2161 content: " ";
2162 display: table;
2163 clear: both;
2164 }
2165
2166 .wp-customizer .widget-conditional .selection {
2167 padding-right: 50px;
2168 padding-left: 28px;
2169 padding-bottom: 19px;
2170 margin-left: 0;
2171 margin-right: 0;
2172 margin-bottom: 10px;
2173 border-bottom: 1px solid #cbcfd4;
2174 }
2175
2176 .wp-customizer .widget-conditional .condition:last-child .selection {
2177 border: 0;
2178 }
2179
2180 .wp-customizer .widget-conditional select {
2181 max-width: 100%;
2182 width: 170px;
2183 }
2184
2185 .wp-customizer .widget-conditional .condition-top select {
2186 width: 130px;
2187 }
2188
2189 .pix_customizer_setting .customize-inside-control-row {
2190 position: relative;
2191 width: 100% !important;
2192 margin-left: 0 !important;
2193 text-indent: 0 !important;
2194 background-size: cover;
2195 background-position: 50% 50%;
2196 height: 64px;
2197 border-radius: 5px;
2198 overflow: hidden;
2199 }
2200
2201 .pix_customizer_setting .customize-inside-control-row:before {
2202 content: '';
2203 position: absolute;
2204 top: 0;
2205 bottom: 0;
2206 left: 0;
2207 right: 0;
2208 z-index: 10;
2209 pointer-events: none;
2210 box-shadow: inset 0 0 3px 0 rgba(0, 0, 0, 0.2);
2211 }
2212
2213 .pix_customizer_setting .customize-inside-control-row:hover:before {
2214 box-shadow: inset 0 0 3px 0 rgba(0, 0, 0, 0.4);
2215 }
2216
2217 .pix_customizer_setting .customize-inside-control-row:hover .palette__item {
2218 -webkit-transform: translateY(0%);
2219 transform: translateY(0%);
2220 }
2221
2222 .pix_customizer_setting .customize-inside-control-row:hover label {
2223 left: 10px;
2224 }
2225
2226 .pix_customizer_setting .customize-inside-control-row input {
2227 opacity: 0;
2228 }
2229
2230 .pix_customizer_setting .customize-inside-control-row input:checked + label .preview__letter--checked {
2231 display: inline-block;
2232 vertical-align: middle;
2233 }
2234
2235 .pix_customizer_setting .customize-inside-control-row input:checked + label .preview__letter {
2236 display: none;
2237 }
2238
2239 .pix_customizer_setting .customize-inside-control-row label {
2240 position: absolute;
2241 display: -ms-flexbox;
2242 display: flex;
2243 z-index: 2;
2244 width: 100%;
2245 height: 100%;
2246 top: 0;
2247 left: 0;
2248 padding: 0 10px;
2249 margin-top: 0 !important;
2250 -ms-flex-align: center;
2251 align-items: center;
2252 transition: all .3s ease;
2253 }
2254
2255 .pix_customizer_setting .customize-inside-control-row .palette {
2256 position: absolute;
2257 display: -ms-flexbox;
2258 display: flex;
2259 top: 0;
2260 left: 0;
2261 z-index: 1;
2262 width: 100%;
2263 height: 100%;
2264 transition: all .2s ease;
2265 }
2266
2267 .pix_customizer_setting .customize-inside-control-row .palette__item {
2268 -ms-flex: 1;
2269 flex: 1;
2270 -webkit-transform: translateY(100%);
2271 transform: translateY(100%);
2272 transition: all .3s ease;
2273 }
2274
2275 .pix_customizer_setting .customize-inside-control-row .palette__item:nth-child(1) {
2276 transition-delay: 0s;
2277 }
2278
2279 .pix_customizer_setting .customize-inside-control-row .palette__item:nth-child(2) {
2280 transition-delay: 0.05s;
2281 }
2282
2283 .pix_customizer_setting .customize-inside-control-row .palette__item:nth-child(3) {
2284 transition-delay: 0.1s;
2285 }
2286
2287 .pix_customizer_setting .customize-inside-control-row .palette__item:nth-child(4) {
2288 transition-delay: 0.15s;
2289 }
2290
2291 .pix_customizer_setting .customize-inside-control-row .palette__item:nth-child(5) {
2292 transition-delay: 0.2s;
2293 }
2294
2295 .pix_customizer_setting .customize-inside-control-row .palette__item:nth-child(6) {
2296 transition-delay: 0.25s;
2297 }
2298
2299 .pix_customizer_setting .customize-inside-control-row .palette__item:nth-child(7) {
2300 transition-delay: 0.3s;
2301 }
2302
2303 .pix_customizer_setting .customize-inside-control-row .palette__item:nth-child(8) {
2304 transition-delay: 0.35s;
2305 }
2306
2307 .pix_customizer_setting .customize-inside-control-row .palette__item:nth-child(9) {
2308 transition-delay: 0.4s;
2309 }
2310
2311 .pix_customizer_setting .customize-inside-control-row .palette__item:nth-child(10) {
2312 transition-delay: 0.45s;
2313 }
2314
2315 .pix_customizer_setting .customize-inside-control-row .preview__letter,
2316 .pix_customizer_setting .customize-inside-control-row .preview__letter--checked {
2317 display: inline-block;
2318 padding: 3px;
2319 border-radius: 2px;
2320 color: white;
2321 margin-right: 5px;
2322 min-height: 26px;
2323 min-width: 26px;
2324 text-align: center;
2325 background-position: center center;
2326 background-repeat: no-repeat;
2327 background-size: 15px 15px;
2328 font-style: normal;
2329 vertical-align: baseline;
2330 }
2331
2332 .pix_customizer_setting .customize-inside-control-row .preview__letter--checked {
2333 display: none;
2334 }
2335
2336 [id*="sm_current_color_palette_control"] .customize-inside-control-row .palette__item[class] {
2337 -webkit-transform: none;
2338 transform: none;
2339 }
2340
2341 [id*="sm_current_color_palette_control"] .variation-control {
2342 display: -ms-flexbox;
2343 display: flex;
2344 }
2345
2346 .label__inner {
2347 color: #000000;
2348 background: #F5F6F1;
2349 padding: 7px 12px 7px 7px;
2350 z-index: 2;
2351 border-radius: 3px;
2352 box-shadow: 0 2px 5px rgba(0, 0, 0, 0.15);
2353 }
2354
2355 .picker {
2356 position: relative;
2357 top: 0;
2358 left: 50%;
2359 width: 80%;
2360 max-width: 3em;
2361 margin-top: auto;
2362 margin-bottom: auto;
2363 border-radius: 50%;
2364 overflow: hidden;
2365 -webkit-transform: translate3d(-50%, 0, 0);
2366 transform: translate3d(-50%, 0, 0);
2367 }
2368
2369 .colors .picker > i {
2370 display: block;
2371 position: absolute;
2372 top: 0;
2373 right: 0;
2374 bottom: 0;
2375 left: 0;
2376 box-shadow: inset 0 0 3px 0 rgba(0, 0, 0, 0.2);
2377 border-radius: 50%;
2378 pointer-events: none;
2379 z-index: 20;
2380 }
2381
2382 .picker:before,
2383 .picker:after {
2384 content: "";
2385 display: block;
2386 background: currentColor;
2387 border-radius: 50%;
2388 }
2389
2390 .picker:before {
2391 padding-top: 100%;
2392 }
2393
2394 .picker:after {
2395 position: absolute;
2396 top: 0;
2397 left: 0;
2398 width: 100%;
2399 height: 100%;
2400 }
2401
2402 .fill {
2403 overflow: hidden;
2404 }
2405
2406 .color:first-child .fill {
2407 border-top-left-radius: 5px;
2408 border-bottom-left-radius: 5px;
2409 }
2410
2411 .color:last-child .fill {
2412 border-top-right-radius: 5px;
2413 border-bottom-right-radius: 5px;
2414 }
2415
2416 .label {
2417 margin-right: auto;
2418 }
2419
2420 #customize-theme-controls [id*="sm_current_color_palette_control"] {
2421 display: block;
2422 width: auto;
2423 }
2424
2425 #customize-theme-controls [id*="sm_current_color_palette_control"] .color-palette-container {
2426 background: white;
2427 }
2428
2429 #customize-theme-controls [id*="sm_current_color_palette_control"] .color-palette-container .description {
2430 margin-bottom: 15px;
2431 }
2432
2433 #customize-theme-controls [id*="sm_current_color_palette_control"] .description.c-color-palette__notification {
2434 padding-top: 19px;
2435 margin-bottom: 0;
2436 font-size: inherit;
2437 font-weight: bold;
2438 }
2439
2440 .c-color-palette__fields {
2441 position: relative;
2442 }
2443
2444 .c-color-palette .iris-picker {
2445 position: absolute;
2446 top: 100%;
2447 left: 0;
2448 z-index: 100;
2449 margin-top: 1em;
2450 border: 0;
2451 box-shadow: black 0 3px 12px -4px;
2452 }
2453
2454 .c-color-palette .iris-picker .iris-square-handle {
2455 border-color: transparent;
2456 left: -6px;
2457 top: -6px;
2458 }
2459
2460 .c-color-palette .iris-picker .iris-square-handle:after {
2461 position: absolute;
2462 bottom: 0;
2463 right: 0;
2464 left: 0;
2465 top: 0;
2466 border: 2px solid white;
2467 }
2468
2469 .c-color-palette .iris-picker .iris-square-value {
2470 box-shadow: none !important;
2471 }
2472
2473 .colors {
2474 position: relative;
2475 display: -ms-flexbox;
2476 display: flex;
2477 -ms-flex-wrap: wrap;
2478 flex-wrap: wrap;
2479 -ms-flex-align: center;
2480 align-items: center;
2481 width: 100%;
2482 height: 3em;
2483 }
2484
2485 .color {
2486 display: -ms-flexbox;
2487 display: flex;
2488 -ms-flex-direction: column;
2489 flex-direction: column;
2490 -ms-flex: 1 1 0;
2491 flex: 1 1 0;
2492 overflow: hidden;
2493 transition: -ms-flex-positive 0.3s cubic-bezier(0.18, 0.89, 0.32, 1.28);
2494 transition: flex-grow 0.3s cubic-bezier(0.18, 0.89, 0.32, 1.28);
2495 }
2496
2497 .color.hidden {
2498 display: -ms-flexbox;
2499 display: flex;
2500 -ms-flex-positive: 0;
2501 flex-grow: 0;
2502 transition: -ms-flex-positive 0.3s cubic-bezier(0.6, -1, 0.74, 0.05);
2503 transition: flex-grow 0.3s cubic-bezier(0.6, -1, 0.74, 0.05);
2504 }
2505
2506 .color.hidden .picker {
2507 opacity: 0;
2508 transition: opacity .2s ease-out;
2509 }
2510
2511 .color .picker {
2512 transition: opacity .3s ease-in-out, border-color .3s ease-in-out;
2513 cursor: pointer;
2514 }
2515
2516 .color.inactive .picker {
2517 opacity: 0.2;
2518 }
2519
2520 .color.inactive .picker:hover {
2521 opacity: 1;
2522 }
2523
2524 input.c-color-palette__input[class] {
2525 margin-top: 1em;
2526 }
2527
2528 #customize-control-sm_toggle_advanced_settings_control {
2529 margin-bottom: 0;
2530 opacity: 0;
2531 }
2532
2533 #customize-control-sm_toggle_advanced_settings_control button {
2534 width: 100%;
2535 }
2536
2537 @-webkit-keyframes bounceIn {
2538 0%, 20%, 40%, 60%, 80%, 100% {
2539 -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
2540 animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
2541 }
2542 0% {
2543 opacity: 0;
2544 -webkit-transform: scale3d(0.3, 0.3, 0.3);
2545 transform: scale3d(0.3, 0.3, 0.3);
2546 }
2547 20% {
2548 -webkit-transform: scale3d(1.1, 1.1, 1.1);
2549 transform: scale3d(1.1, 1.1, 1.1);
2550 }
2551 40% {
2552 -webkit-transform: scale3d(0.9, 0.9, 0.9);
2553 transform: scale3d(0.9, 0.9, 0.9);
2554 }
2555 60% {
2556 opacity: 1;
2557 -webkit-transform: scale3d(1.03, 1.03, 1.03);
2558 transform: scale3d(1.03, 1.03, 1.03);
2559 }
2560 80% {
2561 -webkit-transform: scale3d(0.97, 0.97, 0.97);
2562 transform: scale3d(0.97, 0.97, 0.97);
2563 }
2564 100% {
2565 opacity: 1;
2566 -webkit-transform: scale3d(1, 1, 1);
2567 transform: scale3d(1, 1, 1);
2568 }
2569 }
2570
2571 @keyframes bounceIn {
2572 0%, 20%, 40%, 60%, 80%, 100% {
2573 -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
2574 animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
2575 }
2576 0% {
2577 opacity: 0;
2578 -webkit-transform: scale3d(0.3, 0.3, 0.3);
2579 transform: scale3d(0.3, 0.3, 0.3);
2580 }
2581 20% {
2582 -webkit-transform: scale3d(1.1, 1.1, 1.1);
2583 transform: scale3d(1.1, 1.1, 1.1);
2584 }
2585 40% {
2586 -webkit-transform: scale3d(0.9, 0.9, 0.9);
2587 transform: scale3d(0.9, 0.9, 0.9);
2588 }
2589 60% {
2590 opacity: 1;
2591 -webkit-transform: scale3d(1.03, 1.03, 1.03);
2592 transform: scale3d(1.03, 1.03, 1.03);
2593 }
2594 80% {
2595 -webkit-transform: scale3d(0.97, 0.97, 0.97);
2596 transform: scale3d(0.97, 0.97, 0.97);
2597 }
2598 100% {
2599 opacity: 1;
2600 -webkit-transform: scale3d(1, 1, 1);
2601 transform: scale3d(1, 1, 1);
2602 }
2603 }
2604
2605 #customize-theme-controls #sub-accordion-panel-style_manager_panel .customize-panel-description,
2606 #customize-theme-controls #sub-accordion-panel-theme_options_panel .customize-panel-description {
2607 display: block;
2608 }
2609
2610 #customize-theme-controls li#accordion-panel-style_manager_panel h3.accordion-section-title:before {
2611 position: relative;
2612 float: right;
2613 content: "�
2614 �";
2615 color: #aed2e5;
2616 font-family: dashicons;
2617 padding: 1px;
2618 margin-right: 28px;
2619 font-size: 17px;
2620 -webkit-font-smoothing: antialiased;
2621 }
2622
2623 #customize-theme-controls li#accordion-panel-style_manager_panel h3.accordion-section-title:before {
2624 font-size: 18px;
2625 color: #f8bc30;
2626 }
2627
2628 #customize-theme-controls li#accordion-section-sm_color_palettes_section h3.accordion-section-title:before {
2629 position: relative;
2630 float: right;
2631 content: "ï„€";
2632 color: #aed2e5;
2633 font-family: dashicons;
2634 padding: 1px;
2635 margin-right: 28px;
2636 font-size: 17px;
2637 -webkit-font-smoothing: antialiased;
2638 }
2639
2640 #customize-theme-controls li#accordion-section-sm_color_palettes_section h3.accordion-section-title {
2641 border-top: none;
2642 }
2643
2644 #customize-theme-controls li#accordion-section-sm_font_palettes_section h3.accordion-section-title:before {
2645 position: relative;
2646 float: right;
2647 content: "ï„¢";
2648 color: #aed2e5;
2649 font-family: dashicons;
2650 padding: 1px;
2651 margin-right: 28px;
2652 font-size: 17px;
2653 -webkit-font-smoothing: antialiased;
2654 }
2655
2656 #customize-theme-controls li#accordion-section-sm_color_palettes_section h3.accordion-section-title:before,
2657 #customize-theme-controls li#accordion-section-sm_font_palettes_section h3.accordion-section-title:before {
2658 padding: 3px;
2659 margin-right: 5px;
2660 margin-top: -2px;
2661 }
2662
2663 #customize-theme-controls li#accordion-panel-theme_options_panel h3.accordion-section-title:before {
2664 position: relative;
2665 float: right;
2666 content: "";
2667 color: #aed2e5;
2668 font-family: dashicons;
2669 padding: 1px;
2670 margin-right: 28px;
2671 font-size: 17px;
2672 -webkit-font-smoothing: antialiased;
2673 }
2674
2675 #customize-theme-controls li#accordion-panel-theme_options_panel h3.accordion-section-title {
2676 border-bottom: 1px solid #ddd;
2677 border-left: none;
2678 border-right: none;
2679 margin: 0 0 15px 0;
2680 }
2681
2682 #customize-theme-controls li[id$="[general]"],
2683 #customize-theme-controls li[id$="[footer_section]"] {
2684 border-bottom: 1px solid #ddd;
2685 border-left: none;
2686 border-right: none;
2687 margin: 0 0 15px 0;
2688 }
2689
2690 #customize-theme-controls li[id$="[general]"] h3.accordion-section-title {
2691 border-top: none;
2692 }
2693
2694 .color .disc {
2695 display: block;
2696 overflow: hidden;
2697 position: absolute;
2698 top: 0;
2699 right: 0;
2700 bottom: 0;
2701 left: 0;
2702 z-index: 15;
2703 pointer-events: none;
2704 opacity: 0;
2705 transition: opacity .3s ease-in-out;
2706 }
2707
2708 .color .disc:after {
2709 content: "";
2710 -webkit-filter: blur(6px) saturate(0.7) brightness(1.1);
2711 filter: blur(6px) saturate(0.7) brightness(1.1);
2712 display: block;
2713 width: 200%;
2714 height: 200%;
2715 padding-top: 100%;
2716 position: absolute;
2717 top: -50%;
2718 left: -50%;
2719 -webkit-transform: scale(1);
2720 transform: scale(1);
2721 background-image: linear-gradient(330deg, transparent 50%, #ff8100 0), linear-gradient(300deg, transparent 50%, #ff5800 0), linear-gradient(270deg, transparent 50%, #c92323 0), linear-gradient(240deg, transparent 50%, #cc42a2 0), linear-gradient(210deg, transparent 50%, #9f49ac 0), linear-gradient(180deg, transparent 50%, #306cd3 0), linear-gradient(150deg, transparent 50%, #179067 0), linear-gradient(120deg, transparent 50%, #0eb5d6 0), linear-gradient(90deg, transparent 50%, #50b517 0), linear-gradient(60deg, transparent 50%, #ede604 0), linear-gradient(30deg, transparent 50%, #fc0 0), linear-gradient(0deg, transparent 50%, #feac00 0);
2722 background-clip: content-box,content-box,content-box,content-box,content-box,content-box,padding-box,padding-box,padding-box,padding-box,padding-box,padding-box;
2723 }
2724
2725 .color.altered .disc {
2726 opacity: 1;
2727 }
2728
2729 .customize-control-color .wp-picker-container .iris-picker .iris-palette-container {
2730 display: -ms-flexbox;
2731 display: flex;
2732 width: 215px;
2733 }
2734
2735 .customize-control-color .wp-picker-container .iris-picker .iris-palette {
2736 width: auto !important;
2737 height: auto !important;
2738 -ms-flex: 1 1 0;
2739 flex: 1 1 0;
2740 float: none;
2741 }
2742
2743 .customize-control-color .wp-picker-container .iris-picker .iris-palette:after {
2744 content: "";
2745 display: block;
2746 padding-top: 100%;
2747 }
2748
2749 .c-color-palette {
2750 padding: 30px 20px 18px;
2751 }
2752
2753 [id="customize-control-sm_current_color_palette_control"][id] {
2754 margin-bottom: 0;
2755 }
2756
2757 [id="customize-control-sm_current_color_palette_control"][id] ~ .customize-control {
2758 background-color: #FFFFFF;
2759 margin-bottom: 0;
2760 padding: 24px 20px 0;
2761 }
2762
2763 #customize-control-sm_dark_color_primary_slider_control,
2764 #customize-control-sm_dark_color_secondary_slider_control,
2765 #customize-control-sm_dark_color_tertiary_slider_control {
2766 display: none !important;
2767 }
2768
2769 .sm_color_matrix {
2770 display: -ms-flexbox;
2771 display: flex;
2772 -ms-flex-wrap: wrap;
2773 flex-wrap: wrap;
2774 margin-left: -15px;
2775 }
2776
2777 .sm_color_matrix > * {
2778 display: grid;
2779 grid-auto-rows: 2px;
2780 grid-auto-columns: 2px;
2781 -ms-flex: 0 0 33.33333%;
2782 flex: 0 0 33.33333%;
2783 padding-top: 15px;
2784 padding-left: 15px;
2785 }
2786
2787 .sm_color_matrix > * > * {
2788 background-color: currentColor;
2789 border-radius: 50%;
2790 border: 1px solid #ccc;
2791 -webkit-animation-duration: 0.75s;
2792 animation-duration: 0.75s;
2793 -webkit-animation-name: bounceIn;
2794 animation-name: bounceIn;
2795 }
2796
2797 .sm_color_matrix > * > :nth-child(1) {
2798 grid-area: 16 / 12 / span 12 / span 12;
2799 }
2800
2801 .sm_color_matrix > * > :nth-child(2) {
2802 grid-area: 26 / 24 / span 4 / span 4;
2803 }
2804
2805 .sm_color_matrix > * > :nth-child(3) {
2806 grid-area: 13 / 24 / span 4 / span 4;
2807 }
2808
2809 .sm_color_matrix > * > :nth-child(4) {
2810 grid-area: 8 / 8 / span 8 / span 8;
2811 }
2812
2813 .sm_color_matrix > * > :nth-child(5) {
2814 grid-area: 32 / 8 / span 4 / span 4;
2815 }
2816
2817 .sm_color_matrix > * > :nth-child(6) {
2818 grid-area: 30 / 16 / span 8 / span 8;
2819 }
2820
2821 .sm_color_matrix > * > :nth-child(7) {
2822 grid-area: 4 / 20 / span 8 / span 8;
2823 }
2824
2825 .sm_color_matrix > * > :nth-child(8) {
2826 grid-area: 17 / 26 / span 8 / span 8;
2827 }
2828
2829 .sm_color_matrix > * > :nth-child(9) {
2830 grid-area: 22 / 2 / span 8 / span 8;
2831 }
2832
2833 .sm_color_matrix > * > :nth-child(10) {
2834 grid-area: 28 / 11 / span 2 / span 2;
2835 }
2836
2837 .sm_color_matrix > * > :nth-child(11) {
2838 grid-area: 9 / 31 / span 6 / span 6;
2839 }
2840
2841 .sm_color_matrix > * > :nth-child(11) {
2842 grid-area: 26 / 30 / span 9 / span 9;
2843 }
2844
2845 .sm_color_matrix > * > :nth-child(12) {
2846 grid-area: 17 / 7 / span 4 / span 4;
2847 }
2848
2849 .sm_color_matrix > * > :nth-child(13) {
2850 grid-area: 19 / 36 / span 6 / span 6;
2851 }
2852
2853 .sm_color_matrix > * > :nth-child(14) {
2854 grid-area: 12 / 18 / span 2 / span 2;
2855 }
2856
2857 .sm_color_matrix > * > :nth-child(n+15) {
2858 display: none;
2859 }
2860
2861 .sm-tabs {
2862 display: -ms-flexbox;
2863 display: flex;
2864 -ms-flex-pack: justify;
2865 justify-content: space-between;
2866 padding: 0 16px;
2867 text-align: center;
2868 border-bottom: 1px solid #DFE8EF;
2869 }
2870
2871 .sm-tabs__item {
2872 padding: 12px 0;
2873 margin-bottom: -1px;
2874 -ms-flex-preferred-size: 31%;
2875 flex-basis: 31%;
2876 font-size: 14px;
2877 color: #416B7E;
2878 opacity: 0.7;
2879 border-bottom: 3px solid transparent;
2880 cursor: pointer;
2881 transition: all 0.2s ease;
2882 }
2883
2884 .sm-tabs__item:not(.sm-tabs__item--active):hover {
2885 color: #2A3B44;
2886 border-bottom-color: #E2E4E7;
2887 opacity: 1;
2888 }
2889
2890 .sm-tabs__item--active {
2891 color: #2A3B44;
2892 border-bottom-color: #57ABD5;
2893 opacity: 1;
2894 }
2895
2896 [id="sub-accordion-section-sm_color_palettes_section"] {
2897 display: -ms-flexbox !important;
2898 display: flex !important;
2899 -ms-flex-direction: column;
2900 flex-direction: column;
2901 padding: 12px 0 0 !important;
2902 overflow: hidden;
2903 }
2904
2905 [id="sub-accordion-section-sm_color_palettes_section"] #customize-control-sm_color_palette_control {
2906 -ms-flex-negative: 0;
2907 flex-shrink: 0;
2908 -ms-flex-positive: 1;
2909 flex-grow: 1;
2910 overflow-y: scroll;
2911 margin-bottom: 0;
2912 padding-top: 12px;
2913 }
2914
2915 [id="sub-accordion-section-sm_color_palettes_section"] > * {
2916 -ms-flex-positive: 0;
2917 flex-grow: 0;
2918 padding: 0 12px;
2919 }
2920
2921 [id="sub-accordion-section-sm_color_palettes_section"] [id="customize-control-sm_current_color_palette_control"] ~ * {
2922 display: none !important;
2923 }
2924
2925 [id="sub-accordion-section-sm_color_palettes_section"] [id="customize-control-sm_palettes_description_control"] span,
2926 [id="sub-accordion-section-sm_color_palettes_section"] [id="customize-control-sm_filters_description_control"] span,
2927 [id="sub-accordion-section-sm_color_palettes_section"] [id="customize-control-sm_customize_description_control"] span {
2928 margin: 0;
2929 }
2930
2931 [id="sub-accordion-section-sm_color_palettes_section"].sm-view-palettes [id="customize-control-sm_palettes_description_control"],
2932 [id="sub-accordion-section-sm_color_palettes_section"].sm-view-palettes [id="customize-control-sm_color_palette_control"] {
2933 display: block !important;
2934 }
2935
2936 [id="sub-accordion-section-sm_color_palettes_section"].sm-view-filters [id="customize-control-sm_filters_description_control"],
2937 [id="sub-accordion-section-sm_color_palettes_section"].sm-view-filters [id="customize-control-sm_palette_filter_control"] {
2938 display: block !important;
2939 }
2940
2941 [id="sub-accordion-section-sm_color_palettes_section"].sm-view-customize [id="customize-control-sm_customize_description_control"],
2942 [id="sub-accordion-section-sm_color_palettes_section"].sm-view-customize [id="customize-control-sm_coloration_level_control"],
2943 [id="sub-accordion-section-sm_color_palettes_section"].sm-view-customize [id="customize-control-sm_color_diversity_control"],
2944 [id="sub-accordion-section-sm_color_palettes_section"].sm-view-customize [id="customize-control-sm_shuffle_colors_control"],
2945 [id="sub-accordion-section-sm_color_palettes_section"].sm-view-customize [id="customize-control-sm_dark_mode_control"] {
2946 display: block !important;
2947 }
2948
2949 [id="sub-accordion-section-sm_color_palettes_section"] [id="customize-control-sm_spacing_bottom_control"][id] {
2950 display: block !important;
2951 min-height: 24px;
2952 -ms-flex-positive: 1;
2953 flex-grow: 1;
2954 }
2955
2956 [id="customize-control-sm_color_palette_control"] .customize-control-title, [id="customize-control-sm_color_palette_control"] .separator.label,
2957 [id="customize-control-sm_color_palette_control"] .customize-control-description {
2958 display: none;
2959 }
2960
2961 .customize-control-radio[class][id="customize-control-sm_palette_filter_control"] > .customize-inside-control-row:not(:only-of-type) {
2962 display: block;
2963 width: auto;
2964 }
2965
2966 .color[class*="sm_color"][class*="_connected"], .color[class*="sm_dark"][class*="_connected"], .color[class*="sm_light"][class*="_connected"] {
2967 display: none;
2968 }
2969
2970 .c-color-palette__colors {
2971 position: relative;
2972 }
2973
2974 .c-color-palette canvas, .c-color-palette svg {
2975 max-width: 100%;
2976 height: auto;
2977 }
2978
2979 .c-color-palette__fields {
2980 position: absolute;
2981 top: 100%;
2982 left: 0;
2983 right: 0;
2984 z-index: 100;
2985 }
2986
2987 [id="sub-accordion-section-sm_color_palettes_section"] > .customize-section-description-container {
2988 margin-bottom: 0;
2989 border-bottom: 1px solid #DFE8EF;
2990 }
2991
2992 .sm-palette-filter .colors {
2993 width: auto;
2994 height: auto;
2995 padding: 10px 10px;
2996 border-radius: 999em;
2997 }
2998
2999 .sm-palette-filter .picker:after {
3000 box-shadow: inset 0 0 3px 0 rgba(0, 0, 0, 0.2);
3001 }
3002
3003 .sm-palette-filter > label {
3004 position: relative;
3005 display: block;
3006 margin: 0 0 10px;
3007 }
3008
3009 .sm-palette-filter > label:hover .filter-label {
3010 opacity: 1;
3011 }
3012
3013 .sm-palette-filter > input {
3014 display: none;
3015 }
3016
3017 .sm-palette-filter .filter-label {
3018 position: absolute;
3019 top: 0;
3020 left: 0;
3021 z-index: 10;
3022 width: 100%;
3023 height: 100%;
3024 display: -ms-flexbox;
3025 display: flex;
3026 -ms-flex-align: center;
3027 align-items: center;
3028 -ms-flex-pack: center;
3029 justify-content: center;
3030 opacity: 0;
3031 transition: opacity .2s ease-out;
3032 }
3033
3034 .sm-palette-filter .filter-label span {
3035 position: relative;
3036 z-index: 20;
3037 }
3038
3039 .sm-palette-filter .filter-label:after {
3040 content: "";
3041 display: block;
3042 position: absolute;
3043 top: 0;
3044 left: 0;
3045 z-index: 10;
3046 width: 100%;
3047 height: 100%;
3048 background-color: #ffffff;
3049 box-shadow: #d6e0e5 0 0 0 1px;
3050 border-radius: 999em;
3051 }
3052
3053 .sm-palette-filter > input:checked + label .filter-label:after {
3054 background-color: #f7f9fa;
3055 box-shadow: none;
3056 }
3057
3058 .sm-palette-filter > input:checked + label .colors {
3059 background-color: #f7f9fa;
3060 box-shadow: #57ABD5 0 0 0 2px;
3061 }
3062
3063 .customize-control-sm_palette_filter .customize-control-title, .customize-control-sm_palette_filter .separator.label {
3064 display: none;
3065 }
3066
3067 #customize-control-sm_font_palette_control ~ .customize-control {
3068 display: none !important;
3069 }
3070
3071 .pix_customizer_setting .font_palette[class][class] .customize-inside-control-row {
3072 height: auto;
3073 padding-top: 52%;
3074 background-color: white;
3075 border-radius: 6px;
3076 overflow: hidden;
3077 }
3078
3079 .pix_customizer_setting .font_palette[class][class] .customize-inside-control-row:before {
3080 border: 1px solid #DFE8EF;
3081 border-radius: 6px;
3082 }
3083
3084 .pix_customizer_setting .font_palette[class][class] .customize-inside-control-row:before, .pix_customizer_setting .font_palette[class][class] .customize-inside-control-row:hover:before {
3085 box-shadow: 0 1px 0 0 #B8DAEB;
3086 }
3087
3088 .pix_customizer_setting .font_palette[class][class] .customize-inside-control-row input {
3089 display: none;
3090 }
3091
3092 .pix_customizer_setting .font_palette[class][class] .customize-inside-control-row label {
3093 border-radius: 6px;
3094 left: 0;
3095 }
3096
3097 .pix_customizer_setting .font_palette[class][class] .customize-inside-control-row input + label {
3098 border: 2px solid transparent;
3099 }
3100
3101 .pix_customizer_setting .font_palette[class][class] .customize-inside-control-row input:checked + label {
3102 border-color: #57ABD5;
3103 }
3104
3105 .pix_customizer_setting .font_palette[class][class] .customize-inside-control-row .label__inner {
3106 display: none;
3107 }
3108