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