PluginProbe
Customify / 1.3.1
Customify v1.3.1
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 1.3.1, at css/customizer.css

1,056 lines 34.1 KB
No matching file
Up and down to move Enter to open Esc to close
Raw Download Zip
1 .wp-full-overlay-sidebar * {
2 box-sizing: border-box; }
3
4 .accordion-section-content {
5 overflow: visible; }
6
7 .control-section:not(.control-section-themes) .customize-control {
8 padding: 0px;
9 width: 100%;
10 min-height: initial; }
11
12 .customize-controls-close {
13 width: 48px;
14 height: 44px;
15 color: #7da9c3;
16 background: #ffffff;
17 border-top: none;
18 border-right-color: #e0e8ef; }
19 .customize-controls-close:focus, .customize-controls-close:hover {
20 background: #f5fcff; }
21 .customize-controls-close:before {
22 top: 0px; }
23
24 #customize-controls .customize-info {
25 border-bottom-color: #e0e8ef; }
26
27 .customize-panel-back, .customize-section-back {
28 height: 74px;
29 color: #7da9c3;
30 border-right-color: #e0e8ef; }
31 .customize-panel-back:hover, .customize-panel-back:focus, .customize-section-back:hover, .customize-section-back:focus {
32 border-left-color: #f5fcff;
33 background: #f5fcff; }
34
35 #customize-theme-controls .theme * {
36 box-sizing: content-box; }
37
38 #customize-theme-controls .accordion-section-content {
39 padding: 17px; }
40
41 #customize-theme-controls .customize-section-title {
42 margin-top: -17px;
43 margin-right: -17px; }
44
45 #customize-theme-controls .control-panel-content .control-section:nth-child(2),
46 #customize-theme-controls .control-panel-content .control-section:nth-child(3) {
47 border-top: none; }
48
49 #customize-theme-controls .control-panel-content .control-section:nth-last-child(2) {
50 border-bottom: 1px solid #e0e8ef; }
51
52 #customize-theme-controls #accordion-section-add_menu {
53 text-align: right;
54 overflow: visible; }
55 #customize-theme-controls #accordion-section-add_menu .add-menu-toggle {
56 float: none; }
57
58 #customize-controls .description {
59 margin-bottom: 9px;
60 font-size: 12px;
61 font-weight: 300;
62 font-style: normal;
63 line-height: 1.6;
64 color: #4d7b90;
65 text-indent: 0; }
66
67 .customize-control-description {
68 margin-top: 6px; }
69
70 .customize-control {
71 margin-bottom: 24px; }
72
73 #accordion-section-themes + .control-section {
74 border-top: none; }
75
76 #customize-controls .panel-meta.customize-info .accordion-section-title {
77 border-top: none;
78 height: 74px; }
79
80 .wp-core-ui .button:not(.theme-details):not(.collapse-sidebar),
81 .wp-core-ui .button-primary,
82 .wp-core-ui .button-secondary {
83 width: auto;
84 padding: 6px 20px;
85 font-size: 13px;
86 font-weight: 400;
87 color: #F5FCFF;
88 line-height: 1.4;
89 text-shadow: none;
90 border: none;
91 background: #AED2E5;
92 box-shadow: 0px 2px 0px 0px #8DBED7;
93 border-radius: 4px;
94 transition: all 0.1s; }
95 .wp-core-ui .button:not(.theme-details):not(.collapse-sidebar):hover,
96 .wp-core-ui .button-primary:hover,
97 .wp-core-ui .button-secondary:hover {
98 color: white;
99 text-shadow: none;
100 background: #98C6DD;
101 box-shadow: 0px 2px 0px 0px #74A7C2; }
102
103 .wp-core-ui .button-primary {
104 background: #73C5EE;
105 box-shadow: 0px 2px 0px 0px #57ABD5; }
106 .wp-core-ui .button-primary:hover {
107 background: #58B0DD;
108 box-shadow: 0px 2px 0px 0px #3F8AAF; }
109
110 .wp-core-ui .reset_section,
111 .wp-core-ui .reset_panel {
112 width: 100%;
113 height: 4em;
114 display: block;
115 margin: 0px 0 25px; }
116
117 .wp-core-ui .reset_panel {
118 margin-top: 10px; }
119
120 .separator.label {
121 display: block;
122 font-size: 14px;
123 line-height: 24px;
124 font-weight: 600; }
125
126 .customize-control-title, .separator.label {
127 color: #416B7E; }
128
129 .separator.section:before, .separator.sub-section:before {
130 content: "";
131 position: absolute;
132 top: 0;
133 bottom: 0;
134 left: -18px;
135 right: -18px;
136 z-index: -1; }
137
138 .separator.label {
139 margin-bottom: -3px;
140 margin-bottom: -15px;
141 font-weight: 500; }
142
143 .separator.large {
144 margin-top: 12px;
145 font-size: 16px;
146 color: #39474D; }
147
148 .separator.section {
149 position: relative;
150 padding: 14px 0;
151 margin-bottom: 0;
152 background: none;
153 border: none; }
154 .separator.section[id*="layout"] {
155 margin-top: 0; }
156 .separator.section[id*="layout"]:before {
157 border: none; }
158 .separator.section:before {
159 border: 1px solid #e0e8ef;
160 background-color: #ffffff;
161 box-shadow: 0px 1px 0px 0px #DFE8EF; }
162
163 .separator.sub-section {
164 position: relative;
165 padding: 12px 0; }
166 .separator.sub-section:before {
167 border-top: 1px solid #e0e8ef;
168 border-bottom: 1px solid #e0e8ef;
169 background-color: #f6fbff; }
170 .separator.sub-section + span {
171 margin-top: 20px;
172 font-style: normal; }
173
174 .section-navigation-wrapper {
175 position: relative;
176 height: 43px;
177 margin: -15px -12px 0 -12px;
178 margin-right: -17px;
179 margin-left: -17px; }
180
181 .section-navigation {
182 display: -ms-flexbox;
183 display: flex;
184 margin-top: -1px;
185 clear: both;
186 border-top: 1px solid #e0e8ef; }
187 .section-navigation a {
188 -ms-flex: 1 1 auto;
189 flex: 1 1 auto;
190 display: block;
191 padding: 12px 0;
192 color: #3b484e;
193 background-color: #ffffff;
194 border-bottom: 1px solid #e0e8ef;
195 border-right: 1px solid #e0e8ef;
196 text-align: center;
197 text-decoration: none;
198 transition: background-color .15s ease-in-out; }
199 .section-navigation a:last-child {
200 border-right: 0; }
201
202 .customize-section-description-container + .customize-control {
203 margin-bottom: 0; }
204
205 #customize-controls .customize-info.is-sticky.is-sticky,
206 #customize-controls .customize-section-title.is-sticky.is-sticky {
207 top: 40px; }
208
209 #customize-controls .customize-info.is-in-view.is-in-view,
210 #customize-controls .customize-section-title.is-in-view.is-in-view {
211 box-shadow: none; }
212
213 #customize-controls .has-nav .customize-info,
214 #customize-controls .has-nav .customize-section-title {
215 margin-right: -12px; }
216
217 #customize-controls .customize-section-title.customize-section-title {
218 border-bottom: 0; }
219
220 .customize-section-description-container.section-meta.has-nav {
221 margin-bottom: 0; }
222
223 .font-options__wrapper {
224 position: relative; }
225 .font-options__wrapper:after {
226 content: "";
227 position: absolute;
228 top: 90%;
229 left: 0;
230 right: 0;
231 z-index: 0;
232 display: block;
233 height: 100px; }
234
235 .font-options__head {
236 display: -ms-flexbox;
237 display: flex;
238 -ms-flex-pack: justify;
239 justify-content: space-between; }
240 .font-options__head.font-options__head {
241 -webkit-appearance: none;
242 text-overflow: ellipsis;
243 white-space: nowrap; }
244
245 .font-options__font-title {
246 margin-right: 26px;
247 margin-left: 10px;
248 font-size: 12px;
249 line-height: 20px;
250 font-weight: 300;
251 color: #98c6dd;
252 text-overflow: ellipsis;
253 overflow: hidden;
254 white-space: nowrap; }
255
256 .font-options__options-list {
257 position: absolute;
258 top: calc(100% + 6px);
259 left: -6px;
260 right: -6px;
261 z-index: 2;
262 display: block;
263 padding: 10px;
264 border: 1px solid #dfe8ef;
265 border-radius: 5px;
266 background-color: #ffffff;
267 opacity: 0;
268 display: none;
269 transition: opacity .15s linear; }
270 .font-options__options-list:last-child {
271 margin-bottom: 0; }
272 .font-options__options-list:before, .font-options__options-list:after {
273 content: "";
274 position: absolute;
275 top: -20px;
276 right: 25px;
277 height: 0;
278 width: 0;
279 border: solid transparent;
280 z-index: 10; }
281 .font-options__options-list:before {
282 border-bottom-color: white;
283 border-width: 10px;
284 z-index: 11; }
285 .font-options__options-list:after {
286 border-bottom-color: rgba(0, 0, 0, 0.075);
287 border-width: 12px;
288 top: -24px;
289 right: 23px; }
290
291 .customize-control-color .wp-picker-container .wp-picker-open + .wp-picker-input-wrap:after {
292 content: "";
293 position: absolute;
294 bottom: 100%;
295 right: 12px;
296 border-collapse: separate;
297 width: 0;
298 height: 0;
299 border-width: 0 9px 9px 9px;
300 border-style: solid;
301 border-color: transparent transparent #fff transparent; }
302
303 .font-options__head, .customize-control input[type=text],
304 .customize-control input[type=checkbox],
305 .customize-control input[type=password],
306 .customize-control input[type=color],
307 .customize-control input[type=date],
308 .customize-control input[type=datetime],
309 .customize-control input[type=datetime-local],
310 .customize-control input[type=email],
311 .customize-control input[type=month],
312 .customize-control input[type=number],
313 .customize-control input[type=radio],
314 .customize-control input[type=tel],
315 .customize-control input[type=time],
316 .customize-control input[type=url],
317 .customize-control input[type=week],
318 .customize-control input[type=search],
319 .customize-control select,
320 .customize-control textarea,
321 .customize-control input[type="number"].range-value, ul.font-options__options-list .select2-container .select2-selection--single {
322 width: 100%;
323 height: 44px;
324 padding: 10px 14px;
325 background: #FFFFFF;
326 border: 2px solid #B8DAEB;
327 border-radius: 4px;
328 font-size: 14px;
329 line-height: 1.5;
330 color: #416B7E;
331 outline: 0; }
332 .font-options__head:focus, .customize-control input[type=text]:focus,
333 .customize-control input[type=checkbox]:focus,
334 .customize-control input[type=password]:focus,
335 .customize-control input[type=color]:focus,
336 .customize-control input[type=date]:focus,
337 .customize-control input[type=datetime]:focus,
338 .customize-control input[type=datetime-local]:focus,
339 .customize-control input[type=email]:focus,
340 .customize-control input[type=month]:focus,
341 .customize-control input[type=number]:focus,
342 .customize-control input[type=radio]:focus,
343 .customize-control input[type=tel]:focus,
344 .customize-control input[type=time]:focus,
345 .customize-control input[type=url]:focus,
346 .customize-control input[type=week]:focus,
347 .customize-control input[type=search]:focus,
348 .customize-control select:focus,
349 .customize-control textarea:focus,
350 .customize-control input[type="number"].range-value:focus, ul.font-options__options-list .select2-container .select2-selection--single:focus {
351 border-color: #73C5EE;
352 box-shadow: none; }
353
354 .font-options__head, .customize-control select, ul.font-options__options-list .select2-container .select2-selection--single {
355 width: 100%;
356 -webkit-appearance: button;
357 -moz-appearance: none;
358 font-weight: 600;
359 background: white url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+Cjxzdmcgd2lkdGg9IjE1cHgiIGhlaWdodD0iOXB4IiB2aWV3Qm94PSIwIDAgMTUgOSIgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIj4KICAgIDxkZWZzPjwvZGVmcz4KICAgIDxnIGlkPSJQYWdlLTEiIHN0cm9rZT0ibm9uZSIgc3Ryb2tlLXdpZHRoPSIxIiBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPgogICAgICAgIDxnIGlkPSJDdXN0b21pZnktQ29weS0yIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgtMjU2LjAwMDAwMCwgLTM4Ni4wMDAwMDApIiBmaWxsPSIjOThDNkRFIj4KICAgICAgICAgICAgPGcgaWQ9IkhlYWRlciIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoLTIxLjAwMDAwMCwgNDcuMDAwMDAwKSI+CiAgICAgICAgICAgICAgICA8ZyBpZD0iQ29udGVudCIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMTAuMDAwMDAwLCA3NS4wMDAwMDApIj4KICAgICAgICAgICAgICAgICAgICA8ZyBpZD0iVGl0bGUiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDI2LjAwMDAwMCwgMjE5LjAwMDAwMCkiPgogICAgICAgICAgICAgICAgICAgICAgICA8ZyBpZD0iRmllbGQtLS1TZWxlY3QtQ29weSI+CiAgICAgICAgICAgICAgICAgICAgICAgICAgICA8ZyBpZD0iU2VsZWN0IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgwLjAwMDAwMCwgMjcuMDAwMDAwKSI+CiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgPHBhdGggZD0iTTI1NC40ODEyLDE4IEwyNTYsMTkuNTE0IEwyNDguNSwyNyBMMjQxLDE5LjUxNCBMMjQyLjUxODgsMTggTDI0OC41LDIzLjk2NzIgTDI1NC40ODEyLDE4IFoiIGlkPSJQYWdlLTEiPjwvcGF0aD4KICAgICAgICAgICAgICAgICAgICAgICAgICAgIDwvZz4KICAgICAgICAgICAgICAgICAgICAgICAgPC9nPgogICAgICAgICAgICAgICAgICAgIDwvZz4KICAgICAgICAgICAgICAgIDwvZz4KICAgICAgICAgICAgPC9nPgogICAgICAgIDwvZz4KICAgIDwvZz4KPC9zdmc+) no-repeat;
360 background-position: right 16px top 16px; }
361 [multiple].font-options__head, .customize-control select[multiple], ul.font-options__options-list .select2-container [multiple].select2-selection--single {
362 background: white; }
363
364 .customize-control input[type=text],
365 .customize-control textarea {
366 font-size: 13px; }
367
368 .customize-control textarea {
369 height: auto; }
370
371 .customize-control input[type=checkbox],
372 .customize-control input[type=radio] {
373 width: 22px;
374 height: 22px; }
375 .customize-control input[type=checkbox]:checked,
376 .customize-control input[type=radio]:checked {
377 background: #73C5EE;
378 border-color: #5AB9E8; }
379 .customize-control input[type=checkbox]:checked:before,
380 .customize-control input[type=radio]:checked:before {
381 color: white;
382 margin: -1px 0 0 -2px; }
383
384 .customize-control.customize-control-checkbox label:not(:only-of-type), .customize-control.customize-control-radio label:not(:only-of-type) {
385 margin-left: 30px;
386 padding-top: 0;
387 padding-bottom: 0;
388 display: inline-block;
389 width: calc(49% - 30px);
390 text-indent: -6px; }
391
392 .customize-control.customize-control-checkbox label, .customize-control.customize-control-radio label {
393 color: #416B7E; }
394
395 .customize-control-html + .customize-control.customize-control-checkbox, .customize-control-html + .customize-control.customize-control-radio {
396 margin-top: -24px; }
397
398 [id*="divider"] + .customize-control.customize-control-checkbox, [id*="divider"] + .customize-control.customize-control-radio {
399 margin-top: 0; }
400
401 .customize-control input[type=radio] {
402 border-radius: 50%; }
403 .customize-control input[type=radio]:checked:before {
404 content: none; }
405
406 .customize-control.customize-control-radio label {
407 margin-top: 12px; }
408
409 .customize-control input[type="range"] {
410 width: 65%; }
411
412 .customize-control input[type="range"] {
413 position: relative;
414 -webkit-appearance: none;
415 width: 200px;
416 height: 22px;
417 overflow: hidden;
418 outline: none;
419 background: none; }
420 .customize-control input[type="range"]:before {
421 content: " ";
422 position: absolute;
423 top: 8px;
424 left: 0;
425 height: 6px;
426 width: 100%;
427 background: #DFE8EF;
428 box-shadow: inset 0px 1px 3px 0px rgba(0, 0, 0, 0.3);
429 border-radius: 10px; }
430 .customize-control input[type="range"]::-webkit-slider-thumb {
431 -webkit-appearance: none;
432 width: 22px;
433 height: 22px;
434 background: #27ae60;
435 position: relative;
436 z-index: 3;
437 background: #FFFFFF;
438 border: 2px solid #B8DAEB;
439 border-radius: 4px; }
440 .customize-control input[type="range"]::-webkit-slider-thumb:before {
441 content: "..";
442 position: absolute;
443 left: 5px;
444 top: -5px;
445 color: #B8DAEB;
446 font-size: 1em;
447 letter-spacing: 1px; }
448 .customize-control input[type="range"]::-webkit-slider-thumb:after {
449 content: " ";
450 width: 200px;
451 height: 6px;
452 position: absolute;
453 z-index: 1;
454 right: 20px;
455 top: 6px;
456 background: #73C5EE; }
457
458 .customize-control input[type="number"].range-value {
459 min-width: 40px;
460 max-width: 80px;
461 width: auto;
462 height: 30px;
463 top: -5px;
464 float: right;
465 padding: 4px 0px 5px 0px;
466 margin-left: 10px;
467 font-size: 13px;
468 line-height: 1;
469 text-align: center; }
470
471 .customize-control input[type=number]::-webkit-inner-spin-button,
472 .customize-control input[type=number]::-webkit-outer-spin-button {
473 -webkit-appearance: none;
474 margin: 0; }
475
476 .customize-control-color {
477 display: block; }
478 .customize-control-color .customize-control-title, .customize-control-color .separator.label {
479 float: left; }
480 .customize-control-color .wp-picker-container {
481 position: relative;
482 float: right;
483 top: -3px; }
484 .customize-control-color .wp-picker-container .wp-picker-holder {
485 position: relative; }
486 .customize-control-color .wp-picker-container .iris-picker {
487 position: absolute;
488 top: 40px;
489 right: 0;
490 z-index: 1000;
491 width: 275px !important;
492 border-top: none;
493 border-color: #DFDFDE;
494 border-radius: 0 0 3px 3px;
495 border: none;
496 background: white; }
497 .customize-control-color .wp-picker-container .iris-picker .iris-square {
498 width: 215px !important;
499 height: 173px !important;
500 margin-right: 0; }
501 .customize-control-color .wp-picker-container .iris-picker .iris-strip {
502 float: right;
503 box-shadow: rgba(0, 0, 0, 0.4) 0 1px 1px inset; }
504 .customize-control-color .wp-picker-container .iris-picker .iris-strip .ui-slider-handle {
505 border-color: #aaa !important;
506 opacity: 1;
507 box-shadow: none; }
508 .customize-control-color .wp-picker-container .iris-picker .iris-palette {
509 width: 24px !important;
510 height: 24px !important;
511 border-radius: 50px;
512 box-shadow: rgba(0, 0, 0, 0.4) 0 1px 1px inset; }
513 .customize-control-color .wp-picker-container .wp-picker-open + .wp-picker-input-wrap {
514 position: absolute;
515 z-index: 1000;
516 top: 35px;
517 right: 0;
518 width: 275px;
519 padding: 9px 12px;
520 background: white;
521 border: none;
522 border-radius: 3px 3px 0 0; }
523 .customize-control-color .wp-picker-container .wp-picker-open + .wp-picker-input-wrap input.wp-color-picker {
524 float: left;
525 width: 100px;
526 font-size: 13px;
527 text-align: left;
528 margin: 0;
529 padding: 6px 12px;
530 height: auto; }
531 .customize-control-color .wp-picker-container .wp-picker-open + .wp-picker-input-wrap input.button {
532 float: right;
533 padding: 4px 12px;
534 height: 30px; }
535 .customize-control-color .wp-color-result {
536 top: 0;
537 height: 30px;
538 width: 40px;
539 margin: 0;
540 padding: 0;
541 border-radius: 4px;
542 background: #2ECC71;
543 border: 2px solid #B8DAEB;
544 box-shadow: none; }
545 .customize-control-color .wp-color-result:after {
546 display: none; }
547
548 #accordion-section-live_css_edit_section .customize-section-title {
549 margin-top: -13px;
550 border-bottom: 1px solid #ddd; }
551
552 #accordion-section-live_css_edit_section #css_editor {
553 top: 70px;
554 border-top: 10px solid white;
555 overflow: visible; }
556 #accordion-section-live_css_edit_section #css_editor:before {
557 content: "";
558 width: 48px;
559 height: 10px;
560 display: block;
561 background: #e8e8e8;
562 top: -10px;
563 position: absolute;
564 z-index: 10000000;
565 left: 0; }
566
567 #accordion-section-live_css_edit_section .ace_scroller {
568 padding-left: 10px; }
569
570 .wp-full-overlay.editor_opened {
571 margin-left: 500px; }
572 .wp-full-overlay.editor_opened #customize-controls {
573 width: 500px; }
574 .wp-full-overlay.editor_opened.collapsed #customize-controls {
575 width: 300px; }
576
577 .customize-control-media .current,
578 .customize-control-site_icon .current,
579 li#customize-control-site_logo .current {
580 margin-bottom: 10px;
581 min-height: 44px;
582 background: #F5FCFF;
583 border: 2px solid #B8DAEB;
584 border-radius: 4px; }
585 .customize-control-media .current .container, .customize-control-media .current span,
586 .customize-control-site_icon .current .container,
587 .customize-control-site_icon .current span,
588 li#customize-control-site_logo .current .container,
589 li#customize-control-site_logo .current span {
590 border: none; }
591
592 .customize-control-media .inner, .customize-control-media .current span,
593 .customize-control-site_icon .inner,
594 .customize-control-site_icon .current span,
595 li#customize-control-site_logo .inner,
596 li#customize-control-site_logo .current span {
597 font-size: 13px;
598 color: #98C6DD; }
599
600 .customize-control-media .inner,
601 .customize-control-site_icon .inner,
602 li#customize-control-site_logo .inner {
603 line-height: 1.4; }
604
605 .customize-control-media .thumbnail-image,
606 .customize-control-site_icon .thumbnail-image,
607 li#customize-control-site_logo .thumbnail-image {
608 padding: 14px;
609 text-align: center; }
610 .customize-control-media .thumbnail-image img,
611 .customize-control-site_icon .thumbnail-image img,
612 li#customize-control-site_logo .thumbnail-image img {
613 width: auto; }
614
615 .customize-control-media .actions,
616 .customize-control-site_icon .actions,
617 li#customize-control-site_logo .actions {
618 margin-bottom: 0; }
619
620 .customize-control-typography select, .customize-control-typography select {
621 margin-bottom: 10px; }
622
623 .customize-control-typography .description, .customize-control-typography .description {
624 margin-top: -3px; }
625
626 .customize-control-typography ul li, .customize-control-typography ul li {
627 width: 100%;
628 margin: 0; }
629
630 .default-preset-button {
631 background-color: #F5F6F6;
632 float: right;
633 padding: 1px 8px;
634 border-radius: 3px;
635 border: 1px solid #CBCBCB;
636 margin-right: 4px;
637 font-family: "Open Sans",sans-serif;
638 font-size: 13px; }
639
640 .customize-control-preset .description {
641 margin-right: 5px;
642 font-style: normal; }
643
644 .customify_preset.radio_buttons .customify_radio_button {
645 border: none;
646 display: inline-block;
647 padding: 2px;
648 margin: 3px;
649 position: relative;
650 overflow: hidden;
651 height: auto; }
652 .customify_preset.radio_buttons .customify_radio_button input[type="radio"] {
653 opacity: 0;
654 width: 100%;
655 height: 100%;
656 position: absolute;
657 z-index: 9999; }
658 .customify_preset.radio_buttons .customify_radio_button input[type="radio"]:checked + label {
659 background-color: #ebebeb; }
660 .customify_preset.radio_buttons .customify_radio_button input[type="radio"]:checked + label:before {
661 content: '>';
662 color: inherit; }
663 .customify_preset.radio_buttons .customify_radio_button input[type="radio"]:checked + label:after {
664 content: '<';
665 color: inherit; }
666 .customify_preset.radio_buttons .customify_radio_button input[type="radio"]:checked:before {
667 opacity: 0; }
668 .customify_preset.radio_buttons .customify_radio_button label {
669 position: relative;
670 z-index: 999;
671 border-left: 4px solid; }
672
673 .customify_preset .awesome_preset {
674 width: 45%;
675 position: relative;
676 display: inline-block;
677 text-align: center;
678 color: white;
679 margin-top: 5px;
680 margin-bottom: 25px;
681 transition: all 0.2s; }
682 .customify_preset .awesome_preset:hover {
683 opacity: 0.9; }
684 .customify_preset .awesome_preset:before {
685 content: '';
686 position: absolute;
687 top: 1px;
688 left: 1px;
689 right: 1px;
690 bottom: 1px;
691 border: 1px solid #FFF;
692 background: transparent;
693 opacity: .5;
694 border-radius: 4px;
695 z-index: 5; }
696 .customify_preset .awesome_preset .preset-wrap .preset-color {
697 height: 128px;
698 border-radius: 4px 4px 0 0;
699 padding: 17px 0 27px; }
700 .customify_preset .awesome_preset .preset-wrap .preset-color .first-font {
701 display: inline-block;
702 width: 100%;
703 font-size: 55px;
704 line-height: 1; }
705 .customify_preset .awesome_preset .preset-wrap .preset-color .secondary-font {
706 display: inline-block;
707 width: 100%;
708 font-size: 20px;
709 line-height: 1;
710 margin-top: 8px; }
711 .customify_preset .awesome_preset .preset-wrap .preset-name {
712 position: relative;
713 font-size: 11px;
714 text-transform: UPPERCASE;
715 border-radius: 0 0 4px 4px;
716 padding: 1px; }
717 .customify_preset .awesome_preset .preset-wrap .preset-name:before {
718 content: '';
719 position: absolute;
720 border-color: inherit;
721 border: 10px solid;
722 border-left-color: transparent;
723 border-right-color: transparent;
724 border-top: transparent;
725 top: -10px;
726 border-bottom-color: inherit;
727 left: 40%; }
728 .customify_preset .awesome_preset:nth-child(odd) {
729 margin-right: 7%; }
730 .customify_preset .awesome_preset input[type=radio] {
731 height: 100%;
732 width: 100%;
733 position: absolute;
734 border: 0;
735 box-shadow: none;
736 color: #006505;
737 background-color: transparent;
738 border-radius: 0;
739 margin: 0;
740 display: inline-block;
741 top: 0;
742 left: 0;
743 z-index: 10; }
744 .customify_preset .awesome_preset input[type=radio]:checked:before {
745 position: absolute;
746 height: 25px;
747 width: 25px;
748 top: -13px;
749 right: -14px;
750 background: #FFF;
751 z-index: 1; }
752 .customify_preset .awesome_preset input[type=radio]:checked:after {
753 -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
754 filter: alpha(opacity=0);
755 content: '';
756 position: absolute;
757 width: 26px;
758 height: 26px;
759 border-radius: 50%;
760 top: -5px;
761 right: -5px;
762 z-index: 10;
763 background: #73C5EE url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+Cjxzdmcgd2lkdGg9IjEzcHgiIGhlaWdodD0iOXB4IiB2aWV3Qm94PSIwIDAgMTMgOSIgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIj4KICAgIDxkZWZzPjwvZGVmcz4KICAgIDxnIGlkPSJQYWdlLTEiIHN0cm9rZT0ibm9uZSIgc3Ryb2tlLXdpZHRoPSIxIiBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPgogICAgICAgIDxnIGlkPSJDdXN0b21pZnktQ29weSIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoLTIxLjAwMDAwMCwgLTQwOC4wMDAwMDApIiBmaWxsPSIjRkZGRkZGIj4KICAgICAgICAgICAgPGcgaWQ9IkhlYWRlciIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoLTIxLjAwMDAwMCwgNDcuMDAwMDAwKSI+CiAgICAgICAgICAgICAgICA8ZyBpZD0iQ29udGVudCIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMTAuMDAwMDAwLCA3NS4wMDAwMDApIj4KICAgICAgICAgICAgICAgICAgICA8ZyBpZD0iRmllbGQtLS1DaGVja2JveC1Db3B5IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgyNy4wMDAwMDAsIDI0OS4wMDAwMDApIj4KICAgICAgICAgICAgICAgICAgICAgICAgPGcgaWQ9IkNoZWNrYm94IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgwLjAwMDAwMCwgMzAuMDAwMDAwKSI+CiAgICAgICAgICAgICAgICAgICAgICAgICAgICA8cGF0aCBkPSJNMTAuMDM4NDk1LDE2IEwxNy4xMTYxMzc1LDguOTIxNDg3NiBMMTUuMTk0NjQ5OCw3IEwxMC4wMzg0OTUsMTIuMTU1MDY3NCBMNi45MjE0ODc2LDkuMDM4OTI5OTcgTDUsMTAuOTYwNDE3NiBMMTAuMDM4NDk1LDE2IFoiIGlkPSJQYWdlLTEiPjwvcGF0aD4KICAgICAgICAgICAgICAgICAgICAgICAgPC9nPgogICAgICAgICAgICAgICAgICAgIDwvZz4KICAgICAgICAgICAgICAgIDwvZz4KICAgICAgICAgICAgPC9nPgogICAgICAgIDwvZz4KICAgIDwvZz4KPC9zdmc+) no-repeat;
764 background-position: center center; }
765
766 .customify_radio_image {
767 display: inline-block; }
768 .customify_radio_image label {
769 display: block;
770 float: left;
771 margin-right: 10px;
772 position: relative; }
773 .customify_radio_image label input[type=radio] {
774 position: absolute;
775 top: 0;
776 bottom: 0;
777 left: 0;
778 right: 0;
779 width: 100%;
780 height: 100%;
781 visibility: hidden; }
782 .customify_radio_image label input[type=radio] img {
783 cursor: pointer;
784 border: 2px solid transparent; }
785 .customify_radio_image label input[type=radio]:checked + img {
786 border: 3px solid #73C5EE; }
787
788 .customify_ace_editor {
789 display: block;
790 min-height: 200px;
791 border: 1px solid #ddd; }
792
793 .customize-control-custom_background .hide {
794 display: none; }
795
796 .customize-control-custom_background .upload_button_div {
797 margin: 10px 0; }
798 .customize-control-custom_background .upload_button_div > * {
799 margin-right: 10px; }
800
801 .customize-control-custom_background .preview_screenshot {
802 text-align: center;
803 margin: 10px 0; }
804 .customize-control-custom_background .preview_screenshot img {
805 border: 2px solid #ccc; }
806
807 #customify_import_demo_data_button {
808 width: 70%;
809 text-align: center;
810 padding: 10px;
811 display: inline-block;
812 height: auto;
813 margin: 0 15% 10% 15%; }
814
815 .import_step_note {
816 margin: 5px;
817 width: 100%;
818 display: inline-block; }
819 .import_step_note:before {
820 content: "\1F449"; }
821 .import_step_note.success:before {
822 content: "\1F44D"; }
823 .import_step_note.failed:before {
824 content: "\274C"; }
825
826 #customize-header-actions {
827 background: #ffffff;
828 border-color: #e0e8ef; }
829
830 .wp-full-overlay-sidebar,
831 .customize-themes-panel {
832 background: #eaf9fe;
833 border-right: 1px solid #e0e8ef; }
834
835 #customize-theme-controls #accordion-section-menu_locations {
836 border-bottom: 1px solid #e0e8ef; }
837
838 #customize-controls #accordion-section-themes > .accordion-section-title {
839 font-weight: 600;
840 border-bottom: 1px solid #e0e8ef; }
841 #customize-controls #accordion-section-themes > .accordion-section-title:hover {
842 background: #fff; }
843
844 #customize-controls .panel-meta.customize-info {
845 border-bottom-color: #e0e8ef; }
846
847 #customize-theme-controls .control-section .accordion-section-title {
848 font-weight: 400;
849 border-top: 1px solid #e0e8ef;
850 border-bottom: none; }
851
852 #customize-theme-controls .control-section:last-of-type > .accordion-section-title {
853 border-bottom: 1px solid #e0e8ef; }
854
855 #customize-theme-controls .customize-section-title {
856 border-top: 1px solid #e0e8ef;
857 border-bottom: 1px solid #e0e8ef; }
858
859 #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 {
860 color: #056184;
861 background: #f5fcff;
862 border-left-color: #f5fcff; }
863
864 [data-balloon] {
865 position: relative; }
866
867 [data-balloon]::before {
868 opacity: 0;
869 pointer-events: none;
870 transition: all .18s ease-out;
871 background: rgba(17, 17, 17, 0.9);
872 border-radius: 4px;
873 color: #fff;
874 content: attr(data-balloon);
875 font-size: 12px;
876 padding: .5em 1em;
877 position: absolute;
878 white-space: nowrap;
879 z-index: 10; }
880
881 [data-balloon]::after {
882 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>');
883 background-size: 100% auto;
884 width: 18px;
885 height: 6px;
886 opacity: 0;
887 pointer-events: none;
888 transition: all .18s ease-out;
889 content: '';
890 position: absolute;
891 z-index: 10; }
892
893 [data-balloon]:hover::before, [data-balloon]:hover::after {
894 opacity: 1;
895 pointer-events: auto; }
896
897 [data-balloon][data-balloon-pos="up"]::before {
898 bottom: 100%;
899 left: 50%;
900 margin-bottom: 11px;
901 -webkit-transform: translate3d(-50%, 10px, 0);
902 transform: translate3d(-50%, 10px, 0);
903 -webkit-transform-origin: top;
904 transform-origin: top; }
905
906 [data-balloon][data-balloon-pos="up"]::after {
907 bottom: 100%;
908 left: 50%;
909 margin-bottom: 5px;
910 -webkit-transform: translate3d(-50%, 10px, 0);
911 transform: translate3d(-50%, 10px, 0);
912 -webkit-transform-origin: top;
913 transform-origin: top; }
914
915 [data-balloon][data-balloon-pos="up"]:hover::before {
916 -webkit-transform: translate3d(-50%, 0, 0);
917 transform: translate3d(-50%, 0, 0); }
918
919 [data-balloon][data-balloon-pos="up"]:hover::after {
920 -webkit-transform: translate3d(-50%, 0, 0);
921 transform: translate3d(-50%, 0, 0); }
922
923 [data-balloon][data-balloon-pos='down']::before {
924 left: 50%;
925 margin-top: 11px;
926 top: 100%;
927 -webkit-transform: translate3d(-50%, -10px, 0);
928 transform: translate3d(-50%, -10px, 0); }
929
930 [data-balloon][data-balloon-pos='down']::after {
931 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>');
932 background-size: 100% auto;
933 width: 18px;
934 height: 6px;
935 left: 50%;
936 margin-top: 5px;
937 top: 100%;
938 -webkit-transform: translate3d(-50%, -10px, 0);
939 transform: translate3d(-50%, -10px, 0); }
940
941 [data-balloon][data-balloon-pos='down']:hover::before {
942 -webkit-transform: translate3d(-50%, 0, 0);
943 transform: translate3d(-50%, 0, 0); }
944
945 [data-balloon][data-balloon-pos='down']:hover::after {
946 -webkit-transform: translate3d(-50%, 0, 0);
947 transform: translate3d(-50%, 0, 0); }
948
949 [data-balloon][data-balloon-pos='left']::before {
950 margin-right: 11px;
951 right: 100%;
952 top: 50%;
953 -webkit-transform: translate3d(10px, -50%, 0);
954 transform: translate3d(10px, -50%, 0); }
955
956 [data-balloon][data-balloon-pos='left']::after {
957 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>');
958 background-size: 100% auto;
959 width: 6px;
960 height: 18px;
961 margin-right: 5px;
962 right: 100%;
963 top: 50%;
964 -webkit-transform: translate3d(10px, -50%, 0);
965 transform: translate3d(10px, -50%, 0); }
966
967 [data-balloon][data-balloon-pos='left']:hover::before {
968 -webkit-transform: translate3d(0, -50%, 0);
969 transform: translate3d(0, -50%, 0); }
970
971 [data-balloon][data-balloon-pos='left']:hover::after {
972 -webkit-transform: translate3d(0, -50%, 0);
973 transform: translate3d(0, -50%, 0); }
974
975 [data-balloon][data-balloon-pos='right']::before {
976 left: 100%;
977 margin-left: 11px;
978 top: 50%;
979 -webkit-transform: translate3d(-10px, -50%, 0);
980 transform: translate3d(-10px, -50%, 0); }
981
982 [data-balloon][data-balloon-pos='right']::after {
983 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>');
984 background-size: 100% auto;
985 width: 6px;
986 height: 18px;
987 left: 100%;
988 margin-left: 5px;
989 top: 50%;
990 -webkit-transform: translate3d(-10px, -50%, 0);
991 transform: translate3d(-10px, -50%, 0); }
992
993 [data-balloon][data-balloon-pos='right']:hover::before {
994 -webkit-transform: translate3d(0, -50%, 0);
995 transform: translate3d(0, -50%, 0); }
996
997 [data-balloon][data-balloon-pos='right']:hover::after {
998 -webkit-transform: translate3d(0, -50%, 0);
999 transform: translate3d(0, -50%, 0); }
1000
1001 [data-balloon][data-balloon-length='small']::before {
1002 white-space: normal;
1003 width: 80px; }
1004
1005 [data-balloon][data-balloon-length='medium']::before {
1006 white-space: normal;
1007 width: 150px; }
1008
1009 [data-balloon][data-balloon-length='large']::before {
1010 white-space: normal;
1011 width: 260px; }
1012
1013 [data-balloon][data-balloon-length='xlarge']::before {
1014 white-space: normal;
1015 width: 380px; }
1016
1017 @media screen and (max-width: 768px) {
1018 [data-balloon][data-balloon-length='xlarge']::before {
1019 white-space: normal;
1020 width: 90vw; } }
1021
1022 [data-balloon][data-balloon-length='fit']::before {
1023 white-space: normal;
1024 width: 100%; }
1025
1026 .font-options__wrapper .font-options__options-list {
1027 border-color: #B8DAEB;
1028 box-shadow: 0 10px 20px 0 rgba(0, 0, 0, 0.15); }
1029
1030 .font-options__wrapper .font-options__option {
1031 margin-bottom: 12px; }
1032 .font-options__wrapper .font-options__option label {
1033 display: block;
1034 margin-bottom: 6px; }
1035
1036 .font-options__wrapper [type=checkbox]:checked ~ .font-options__options-list {
1037 opacity: 1;
1038 display: block; }
1039
1040 input.customify_font_tooltip {
1041 display: none; }
1042
1043 ul.font-options__options-list .select2-container {
1044 width: 100% !important; }
1045 ul.font-options__options-list .select2-container .select2-selection--single {
1046 -webkit-appearance: initial; }
1047 ul.font-options__options-list .select2-container .select2-selection--single .select2-selection__arrow {
1048 display: none; }
1049
1050 ul.font-options__options-list .select2-container--default .select2-selection--single .select2-selection__rendered {
1051 color: inherit;
1052 line-height: initial; }
1053
1054 .select2-container.select2-container--open {
1055 z-index: 99999999; }
1056