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 +2597 -1480 1.6.02.4.0 View file →
@@ -1,512 +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 - color: #f5fcff;
168 - border: none;
169 - border-radius: 4px;
170 - background: #aed2e5;
171 - box-shadow: 0 2px 0 0 #8dbed7;
172 - text-shadow: none;
294 +.iris-picker,
295 +.iris-picker * {
296 + -webkit-box-sizing: content-box;
297 + box-sizing: content-box;
173 298 }
174 -.wp-core-ui .button:not(.theme-details):not(.collapse-sidebar):not(.wp-color-result):hover,
175 -.wp-core-ui .button-primary:hover,
176 -.wp-core-ui .button-secondary:hover
177 -{
178 - color: white;
179 - background: #98c6dd;
180 - box-shadow: 0 2px 0 0 #74a7c2;
181 - text-shadow: none;
299 +
300 +.wp-full-overlay-sidebar-content .accordion-section-content {
301 + overflow: visible;
182 302 }
183 303
184 -.wp-core-ui #customize-header-actions .button-primary
185 -{
186 - background: #73c5ee;
187 - box-shadow: 0 2px 0 0 #57abd5;
304 +.control-section:not(.control-section-themes) .customize-control {
305 + padding: 0;
306 + width: 100%;
307 + min-height: initial;
188 308 }
189 -.wp-core-ui #customize-header-actions .button-primary:hover
190 -{
191 - background: #58b0dd;
192 - box-shadow: 0 2px 0 0 #3f8aaf;
309 +
310 +#customize-header-actions #customize-save-button-wrapper {
311 + margin-top: 7px;
193 312 }
194 -.wp-core-ui #customize-header-actions .button-primary.has-next-sibling
195 -{
196 - border-right: 1px solid #57abd5;
313 +
314 +.wp-full-overlay-footer .devices button {
315 + float: left;
316 + border-radius: 0;
197 317 }
198 -.wp-core-ui #customize-header-actions .button-primary:disabled
199 -{
200 - opacity: .7;
201 - color: white !important;
202 - background: #aed2e5 !important;
203 - box-shadow: 0 2px 0 0 #8db5ca !important;
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;
204 326 }
205 -.wp-core-ui #customize-header-actions .button-primary:disabled.has-next-sibling
206 -{
207 - border-right: none;
327 +
328 +.customize-controls-close:focus, .customize-controls-close:hover {
329 + background: #f5fcff;
208 330 }
209 331
210 -.wp-core-ui .reset_section,
211 -.wp-core-ui .reset_panel
212 -{
213 - display: block;
332 +.customize-controls-close:before {
333 + top: 0px;
334 +}
214 335
215 - width: 100%;
216 - height: 4em;
217 - margin: 0 0 25px;
336 +#customize-controls .customize-info {
337 + border-bottom-color: #e0e8ef;
218 338 }
219 339
220 -.wp-core-ui .reset_panel
221 -{
222 - margin-top: 10px;
340 +.customize-panel-back, .customize-section-back {
341 + height: 74px;
342 + color: #7da9c3;
343 + border-right-color: #e0e8ef;
223 344 }
224 345
225 -.separator.label
226 -{
227 - font-size: 14px;
228 - font-weight: 600;
229 - line-height: 24px;
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;
349 +}
230 350
231 - display: block;
351 +#customize-theme-controls .theme * {
352 + -webkit-box-sizing: content-box;
353 + box-sizing: content-box;
232 354 }
233 355
234 -.customize-control-title,
235 -.separator.label
236 -{
237 - color: #416b7e;
356 +#customize-theme-controls .accordion-section-content {
357 + padding: 17px;
238 358 }
239 359
240 -.separator.section:before,
241 -.separator.sub-section:before
242 -{
243 - position: absolute;
244 - z-index: -1;
245 - top: 0;
246 - right: -18px;
247 - bottom: 0;
248 - left: -18px;
360 +#customize-theme-controls .customize-section-title {
361 + margin-top: -17px;
362 + margin-right: -17px;
363 +}
249 364
250 - content: '';
365 +#customize-theme-controls #accordion-section-add_menu {
366 + border-bottom: none;
251 367 }
252 368
253 -.separator.label
254 -{
255 - font-weight: 500;
369 +#customize-theme-controls #accordion-section-add_menu .add-menu-toggle {
370 + float: none;
256 371 }
257 372
258 -.separator.large
259 -{
260 - font-size: 16px;
373 +#customize-theme-controls .customize-pane-child.open {
374 + height: 100%;
375 +}
261 376
262 - margin-top: 12px;
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 - color: #39474d;
386 +.customize-control-description {
387 + margin-top: 6px;
265 388 }
266 389
267 -.separator.section
268 -{
269 - position: relative;
390 +.customize-control {
391 + margin-bottom: 24px;
392 +}
270 393
271 - margin-bottom: 0;
272 - padding: 14px 0;
394 +#accordion-section-themes + .control-section {
395 + border-top: none;
396 +}
273 397
274 - border: none;
275 - background: none;
398 +#customize-controls .panel-meta.customize-info .accordion-section-title {
399 + border-top: none;
400 + height: 74px;
276 401 }
277 -.separator.section[id*='layout']
278 -{
279 - margin-top: 0;
402 +
403 +.button-controls:after {
404 + content: " ";
405 + display: table;
406 + clear: both;
280 407 }
281 -.separator.section[id*='layout']:before
282 -{
283 - border: none;
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;
284 423 }
285 -.separator.section:before
286 -{
287 - border: 1px solid #e0e8ef;
288 - background-color: #fff;
289 - box-shadow: 0 1px 0 0 #dfe8ef;
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;
290 433 }
291 434
292 -.separator.sub-section
293 -{
294 - position: relative;
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;
439 +}
295 440
296 - padding: 12px 0;
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;
297 445 }
298 -.separator.sub-section:before
299 -{
300 - border-top: 1px solid #e0e8ef;
301 - border-bottom: 1px solid #e0e8ef;
302 - background-color: #f6fbff;
446 +
447 +.wp-core-ui #customize-header-actions .button-primary.has-next-sibling {
448 + border-right: 1px solid #57ABD5;
303 449 }
304 -.separator.sub-section + span
305 -{
306 - font-style: normal;
307 450
308 - margin-top: 20px;
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;
309 457 }
310 458
311 -.section-navigation-wrapper
312 -{
313 - position: relative;
459 +.wp-core-ui #customize-header-actions .button-primary:disabled.has-next-sibling {
460 + border-right: none;
461 +}
314 462
315 - height: 43px;
316 - margin: -15px -12px 0 -12px;
317 - margin-right: -17px;
318 - margin-left: -17px;
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;
319 469 }
320 470
321 -.section-navigation
322 -{
323 - display: -ms-flexbox;
324 - display: flex;
325 - clear: both;
471 +.wp-core-ui .reset_panel {
472 + margin-top: 10px;
473 +}
326 474
327 - margin-top: -1px;
475 +.separator.label {
476 + display: block;
477 + font-size: 14px;
478 + line-height: 24px;
479 + font-weight: 500;
480 +}
328 481
329 - border-top: 1px solid #e0e8ef;
482 +.customize-control-title, .separator.label {
483 + color: #2A3B44;
330 484 }
331 -.section-navigation a
332 -{
333 - display: block;
334 485
335 - padding: 12px 0;
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;
494 +}
336 495
337 - transition: background-color .15s ease-in-out;
338 - text-align: center;
339 - text-decoration: none;
496 +.separator.label {
497 + font-weight: 500;
498 +}
340 499
341 - color: #3b484e;
342 - border-right: 1px solid #e0e8ef;
343 - border-bottom: 1px solid #e0e8ef;
344 - background-color: #fff;
500 +.separator.large {
501 + margin-top: 12px;
502 + font-size: 16px;
503 + color: #39474D;
504 +}
345 505
346 - -ms-flex: 1 1 auto;
347 - flex: 1 1 auto;
506 +.separator.section {
507 + position: relative;
508 + padding: 14px 0;
509 + margin-bottom: 0;
510 + background: none;
511 + border: none;
348 512 }
349 -.section-navigation a:last-child
350 -{
351 - border-right: 0;
513 +
514 +.separator.section[id*="layout"] {
515 + margin-top: 0;
352 516 }
353 517
354 -#customize-controls .customize-info.is-sticky.is-sticky,
355 -#customize-controls .customize-section-title.is-sticky.is-sticky
356 -{
357 - top: 40px;
518 +.separator.section[id*="layout"]:before {
519 + border: none;
358 520 }
359 521
360 -#customize-controls .customize-info.is-in-view.is-in-view,
361 -#customize-controls .customize-section-title.is-in-view.is-in-view
362 -{
363 - box-shadow: none;
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;
364 527 }
365 528
366 -#customize-controls .has-nav .customize-info,
367 -#customize-controls .has-nav .customize-section-title
368 -{
369 - margin-right: -12px;
529 +.separator.sub-section {
530 + position: relative;
531 + padding: 12px 0;
370 532 }
371 533
372 -#customize-controls .customize-section-title.customize-section-title
373 -{
374 - border-bottom: 0;
534 +.separator.sub-section:before {
535 + border-top: 1px solid #e0e8ef;
536 + border-bottom: 1px solid #e0e8ef;
537 + background-color: #f6fbff;
375 538 }
376 539
377 -.customize-section-description-container.section-meta.has-nav
378 -{
379 - margin-bottom: 0;
540 +.separator.sub-section + span {
541 + margin-top: 20px;
542 + font-style: normal;
380 543 }
381 544
382 -.font-options__wrapper
383 -{
384 - position: relative;
545 +.section-navigation-wrapper {
546 + position: relative;
547 + height: 43px;
548 + margin: -15px -12px 0 -12px;
549 + margin-right: -17px;
550 + margin-left: -17px;
385 551 }
386 -.font-options__wrapper:after
387 -{
388 - position: absolute;
389 - z-index: 0;
390 - top: 90%;
391 - right: 0;
392 - left: 0;
393 552
394 - display: block;
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;
560 +}
395 561
396 - height: 30px;
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 - content: '';
578 +.section-navigation a:last-child {
579 + border-right: 0;
399 580 }
400 581
401 -.font-options__head
402 -{
403 - display: -ms-flexbox;
404 - display: flex;
582 +#customize-controls .customize-info.is-sticky.is-sticky,
583 +#customize-controls .customize-section-title.is-sticky.is-sticky {
584 + top: 40px;
585 +}
405 586
406 - -ms-flex-pack: justify;
407 - justify-content: space-between;
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;
408 591 }
409 -.font-options__head.font-options__head
410 -{
411 - white-space: nowrap;
412 - text-overflow: ellipsis;
413 592
414 - -webkit-appearance: none;
593 +#customize-controls .has-nav .customize-info,
594 +#customize-controls .has-nav .customize-section-title {
595 + margin-right: -12px;
415 596 }
416 597
417 -.font-options__font-title
418 -{
419 - font-size: 12px;
420 - font-weight: 300;
421 - line-height: 20px;
598 +#customize-controls .customize-section-title.customize-section-title {
599 + border-bottom: 0;
600 +}
422 601
423 - overflow: hidden;
602 +.customize-section-description-container.section-meta.has-nav {
603 + margin-bottom: 0;
604 +}
424 605
425 - margin-right: 26px;
426 - margin-left: 10px;
606 +.font-options__wrapper {
607 + position: relative;
608 +}
427 609
428 - white-space: nowrap;
429 - text-overflow: ellipsis;
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 +}
430 620
431 - color: #98c6dd;
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;
432 628 }
433 629
434 -.font-options__options-list
435 -{
436 - position: absolute;
437 - z-index: 2;
438 - top: calc(100% + 6px);
439 - right: -6px;
440 - left: -6px;
630 +.font-options__head.font-options__head {
631 + -webkit-appearance: none;
632 + text-overflow: ellipsis;
633 + white-space: nowrap;
634 +}
441 635
442 - display: block;
443 - display: none;
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 +}
444 647
445 - padding: 10px;
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 - transition: opacity .15s linear;
448 -
449 - opacity: 0;
450 - border: 1px solid #dfe8ef;
451 - border-radius: 5px;
452 - background-color: #fff;
665 +.font-options__options-list:last-child {
666 + margin-bottom: 0;
453 667 }
454 -.font-options__options-list:last-child
455 -{
456 - margin-bottom: 0;
457 -}
458 -.font-options__options-list:before,
459 -.font-options__options-list:after
460 -{
461 - position: absolute;
462 - z-index: 10;
463 - top: -20px;
464 - right: 25px;
465 668
466 - width: 0;
467 - height: 0;
468 -
469 - content: '';
470 -
471 - 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;
472 678 }
473 -.font-options__options-list:before
474 -{
475 - z-index: 11;
476 679
477 - border-width: 10px;
478 - border-bottom-color: white;
680 +.font-options__options-list:before {
681 + border-bottom-color: white;
682 + border-width: 10px;
683 + z-index: 11;
479 684 }
480 -.font-options__options-list:after
481 -{
482 - top: -24px;
483 - right: 23px;
484 685
485 - border-width: 12px;
486 - 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;
487 691 }
488 692
489 -.customize-control-color .wp-picker-container .wp-picker-open + .wp-picker-input-wrap:after
490 -{
491 - position: absolute;
492 - right: 12px;
493 - bottom: 100%;
494 -
495 - width: 0;
496 - height: 0;
497 -
498 - border-collapse: separate;
499 -
500 - content: '';
501 -
502 - border-width: 0 9px 9px 9px;
503 - border-style: solid;
504 - 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;
505 704 }
506 705
507 -.font-options__head,
508 -.wp-full-overlay-sidebar-content .customize-control input[type=text]:not(#_customize-input-wpcom_custom_css_content_width_control):not(.wp-color-picker),
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),
509 707 .wp-full-overlay-sidebar-content .customize-control input[type=checkbox],
510 708 .wp-full-overlay-sidebar-content .customize-control input[type=password],
511 709 .wp-full-overlay-sidebar-content .customize-control input[type=color],
512 710 .wp-full-overlay-sidebar-content .customize-control input[type=date],
@@ -522,1607 +720,2526 @@
522 720 .wp-full-overlay-sidebar-content .customize-control input[type=week],
523 721 .wp-full-overlay-sidebar-content .customize-control input[type=search],
524 722 .wp-full-overlay-sidebar-content .customize-control select,
525 723 .wp-full-overlay-sidebar-content .customize-control textarea,
526 -.wp-full-overlay-sidebar-content .customize-control input[type='number'].range-value,
527 -ul.font-options__options-list .select2-container .select2-selection--single,
528 -#customize-theme-controls .select2-container .select2-selection--multiple
529 -{
530 - font-size: 14px;
531 - 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 +}
532 736
533 - width: 100%;
534 - height: 44px;
535 - padding: 10px 14px;
536 -
537 - color: #416b7e;
538 - border: 2px solid #b8daeb;
539 - border-radius: 4px;
540 - outline: 0;
541 - background: #fff;
542 -}
543 -.font-options__head:focus,
544 -.wp-full-overlay-sidebar-content .customize-control input[type=text]:focus:not(#_customize-input-wpcom_custom_css_content_width_control):not(.wp-color-picker),
545 -.wp-full-overlay-sidebar-content .customize-control input[type=checkbox]:focus,
546 -.wp-full-overlay-sidebar-content .customize-control input[type=password]:focus,
547 -.wp-full-overlay-sidebar-content .customize-control input[type=color]:focus,
548 -.wp-full-overlay-sidebar-content .customize-control input[type=date]:focus,
549 -.wp-full-overlay-sidebar-content .customize-control input[type=datetime]:focus,
550 -.wp-full-overlay-sidebar-content .customize-control input[type=datetime-local]:focus,
551 -.wp-full-overlay-sidebar-content .customize-control input[type=email]:focus,
552 -.wp-full-overlay-sidebar-content .customize-control input[type=month]:focus,
553 -.wp-full-overlay-sidebar-content .customize-control input[type=number]:focus,
554 -.wp-full-overlay-sidebar-content .customize-control input[type=radio]:focus,
555 -.wp-full-overlay-sidebar-content .customize-control input[type=tel]:focus,
556 -.wp-full-overlay-sidebar-content .customize-control input[type=time]:focus,
557 -.wp-full-overlay-sidebar-content .customize-control input[type=url]:focus,
558 -.wp-full-overlay-sidebar-content .customize-control input[type=week]:focus,
559 -.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],
560 753 .wp-full-overlay-sidebar-content .customize-control select:focus,
561 754 .wp-full-overlay-sidebar-content .customize-control textarea:focus,
562 -.wp-full-overlay-sidebar-content .customize-control input[type='number'].range-value:focus,
563 -ul.font-options__options-list .select2-container .select2-selection--single:focus,
564 -#customize-theme-controls .select2-container .select2-selection--multiple:focus
565 -{
566 - border-color: #73c5ee;
567 - 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;
568 759 }
569 760
570 761 .font-options__head,
571 -.wp-full-overlay-sidebar-content .customize-control select,
572 -ul.font-options__options-list .select2-container .select2-selection--single,
573 -#customize-theme-controls .select2-container .select2-selection--multiple
574 -{
575 - 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 +}
576 770
577 - width: 100%;
578 -
579 - background: white url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+Cjxzdmcgd2lkdGg9IjE1cHgiIGhlaWdodD0iOXB4IiB2aWV3Qm94PSIwIDAgMTUgOSIgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIj4KICAgIDxkZWZzPjwvZGVmcz4KICAgIDxnIGlkPSJQYWdlLTEiIHN0cm9rZT0ibm9uZSIgc3Ryb2tlLXdpZHRoPSIxIiBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPgogICAgICAgIDxnIGlkPSJDdXN0b21pZnktQ29weS0yIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgtMjU2LjAwMDAwMCwgLTM4Ni4wMDAwMDApIiBmaWxsPSIjOThDNkRFIj4KICAgICAgICAgICAgPGcgaWQ9IkhlYWRlciIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoLTIxLjAwMDAwMCwgNDcuMDAwMDAwKSI+CiAgICAgICAgICAgICAgICA8ZyBpZD0iQ29udGVudCIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMTAuMDAwMDAwLCA3NS4wMDAwMDApIj4KICAgICAgICAgICAgICAgICAgICA8ZyBpZD0iVGl0bGUiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDI2LjAwMDAwMCwgMjE5LjAwMDAwMCkiPgogICAgICAgICAgICAgICAgICAgICAgICA8ZyBpZD0iRmllbGQtLS1TZWxlY3QtQ29weSI+CiAgICAgICAgICAgICAgICAgICAgICAgICAgICA8ZyBpZD0iU2VsZWN0IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgwLjAwMDAwMCwgMjcuMDAwMDAwKSI+CiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgPHBhdGggZD0iTTI1NC40ODEyLDE4IEwyNTYsMTkuNTE0IEwyNDguNSwyNyBMMjQxLDE5LjUxNCBMMjQyLjUxODgsMTggTDI0OC41LDIzLjk2NzIgTDI1NC40ODEyLDE4IFoiIGlkPSJQYWdlLTEiPjwvcGF0aD4KICAgICAgICAgICAgICAgICAgICAgICAgICAgIDwvZz4KICAgICAgICAgICAgICAgICAgICAgICAgPC9nPgogICAgICAgICAgICAgICAgICAgIDwvZz4KICAgICAgICAgICAgICAgIDwvZz4KICAgICAgICAgICAgPC9nPgogICAgICAgIDwvZz4KICAgIDwvZz4KPC9zdmc+) no-repeat;
580 - background-position: right 16px top 16px;
581 -
582 - -webkit-appearance: button;
583 - -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;
584 773 }
585 -[multiple].font-options__head,
586 -.wp-full-overlay-sidebar-content .customize-control select[multiple],
587 -ul.font-options__options-list .select2-container [multiple].select2-selection--single,
588 -#customize-theme-controls .select2-container [multiple].select2-selection--multiple
589 -{
590 - background: white;
591 -}
592 774
593 775 .wp-full-overlay-sidebar-content .customize-control input[type=text],
594 -.wp-full-overlay-sidebar-content .customize-control textarea
595 -{
596 - font-size: 13px;
776 +.wp-full-overlay-sidebar-content .customize-control textarea {
777 + font-size: 13px;
597 778 }
598 779
599 -.wp-full-overlay-sidebar-content .customize-control textarea
600 -{
601 - height: auto;
780 +.wp-full-overlay-sidebar-content .customize-control textarea {
781 + height: auto;
602 782 }
603 783
604 784 .wp-full-overlay-sidebar-content .customize-control input[type=checkbox],
605 -.wp-full-overlay-sidebar-content .customize-control input[type=radio]
606 -{
607 - width: 22px;
608 - height: 22px;
785 +.wp-full-overlay-sidebar-content .customize-control input[type=radio] {
786 + width: 22px;
787 + height: 22px;
609 788 }
789 +
610 790 .wp-full-overlay-sidebar-content .customize-control input[type=checkbox]:checked,
611 -.wp-full-overlay-sidebar-content .customize-control input[type=radio]:checked
612 -{
613 - border-color: #5ab9e8;
614 - background: #73c5ee;
791 +.wp-full-overlay-sidebar-content .customize-control input[type=radio]:checked {
792 + background: #73C5EE;
793 + border-color: #5AB9E8;
615 794 }
795 +
616 796 .wp-full-overlay-sidebar-content .customize-control input[type=checkbox]:checked:before,
617 -.wp-full-overlay-sidebar-content .customize-control input[type=radio]:checked:before
618 -{
619 - 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 +}
620 801
621 - color: white;
802 +.wp-full-overlay-sidebar-content .customize-control .awesome_preset input[type=radio]:checked {
803 + background: transparent;
622 804 }
623 805
624 -.wp-full-overlay-sidebar-content .customize-control .awesome_preset input[type=radio]:checked
625 -{
626 - background: transparent;
806 +.wp-full-overlay-sidebar-content .customize-control.customize-control-checkbox:not(#customize-control-jetpack_css_mode_control) label:not(:only-of-type),
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;
627 815 }
628 816
629 -.wp-full-overlay-sidebar-content .customize-control.customize-control-checkbox:not(#customize-control-jetpack_css_mode_control) label:not(:only-of-type),
630 -.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),
631 -.wp-full-overlay-sidebar-content .customize-control.customize-control-radio label:not(:only-of-type),
632 -.wp-full-overlay-sidebar-content .customize-control.customize-control-radio > .customize-inside-control-row:not(:only-of-type)
633 -{
634 - display: inline-block;
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 +}
635 820
636 - width: calc(49% - 30px);
637 - margin-left: 30px;
638 - padding-top: 0;
639 - padding-bottom: 0;
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;
823 +}
640 824
641 - text-indent: -6px;
825 +.wp-full-overlay-sidebar-content .customize-control input[type=radio] {
826 + border-radius: 50%;
642 827 }
643 828
644 -.wp-full-overlay-sidebar-content .customize-control.customize-control-checkbox:not(#customize-control-jetpack_css_mode_control) label,
645 -.wp-full-overlay-sidebar-content .customize-control.customize-control-radio label
646 -{
647 - color: #416b7e;
829 +.wp-full-overlay-sidebar-content .customize-control input[type=radio]:checked:before {
830 + content: none;
648 831 }
649 832
650 -[id*='divider'] + .wp-full-overlay-sidebar-content .customize-control.customize-control-checkbox:not(#customize-control-jetpack_css_mode_control),
651 -[id*='divider'] + .wp-full-overlay-sidebar-content .customize-control.customize-control-radio
652 -{
653 - margin-top: 0;
833 +.customize-control-html + .wp-full-overlay-sidebar-content .customize-control.customize-control-checkbox {
834 + margin-top: -24px;
654 835 }
655 836
656 -.wp-full-overlay-sidebar-content .customize-control input[type=radio]
657 -{
658 - border-radius: 50%;
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;
659 840 }
660 -.wp-full-overlay-sidebar-content .customize-control input[type=radio]:checked:before
661 -{
662 - content: none;
841 +
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;
663 845 }
664 846
665 -.customize-control-html + .wp-full-overlay-sidebar-content .customize-control.customize-control-checkbox
666 -{
667 - margin-top: -24px;
847 +.wp-full-overlay-sidebar-content .customize-control input[type="range"] {
848 + width: 65%;
668 849 }
669 850
670 -.wp-full-overlay-sidebar-content .customize-control.customize-control-radio label,
671 -.wp-full-overlay-sidebar-content .customize-control.customize-control-radio .customize-inside-control-row
672 -{
673 - margin-top: 12px;
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;
674 859 }
675 860
676 -.wp-full-overlay-sidebar-content .customize-control.customize-control-radio#customize-control-changeset_status .customize-inside-control-row
677 -{
678 - margin-top: 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;
872 +}
679 873
680 - text-indent: 0;
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;
681 884 }
682 885
683 -.wp-full-overlay-sidebar-content .customize-control input[type='range']
684 -{
685 - width: 65%;
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;
686 894 }
687 895
688 -.wp-full-overlay-sidebar-content .customize-control input[type='range']
689 -{
690 - position: relative;
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 +}
691 906
692 - overflow: hidden;
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 - width: calc(100% - 55px);
695 - height: 22px;
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 - outline: none;
698 - background: none;
927 +.customize-control-color {
928 + display: block;
929 +}
699 930
700 - -webkit-appearance: none;
931 +.customize-control-color .customize-control-title, .customize-control-color .separator.label {
932 + float: left;
701 933 }
702 -.wp-full-overlay-sidebar-content .customize-control input[type='range']:before
703 -{
704 - position: absolute;
705 - top: 8px;
706 - left: 0;
707 934
708 - width: 100%;
709 - height: 6px;
935 +.customize-control-color .wp-picker-container {
936 + position: relative;
937 + float: right;
938 + top: -3px;
939 +}
710 940
711 - content: ' ';
941 +.customize-control-color .wp-picker-container .wp-picker-holder {
942 + position: relative;
943 +}
712 944
713 - border-radius: 10px;
714 - background: #dfe8ef;
715 - box-shadow: inset 0 1px 3px 0 rgba(0, 0, 0, .3);
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;
716 957 }
717 -.wp-full-overlay-sidebar-content .customize-control input[type='range']::-webkit-slider-thumb
718 -{
719 - position: relative;
720 - z-index: 3;
721 958
722 - width: 22px;
723 - height: 22px;
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 +}
724 965
725 - border: 2px solid #b8daeb;
726 - border-radius: 4px;
727 - background: #27ae60;
728 - background: #fff;
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;
977 +}
729 978
730 - -webkit-appearance: none;
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;
731 982 }
732 -.wp-full-overlay-sidebar-content .customize-control input[type='range']::-webkit-slider-thumb:before
733 -{
734 - font-size: 1em;
735 983
736 - position: absolute;
737 - top: -5px;
738 - left: 5px;
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 - content: '..';
741 - letter-spacing: 1px;
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;
994 +}
742 995
743 - color: #b8daeb;
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;
744 1001 }
745 -.wp-full-overlay-sidebar-content .customize-control input[type='range']::-webkit-slider-thumb:after
746 -{
747 - position: absolute;
748 - z-index: 1;
749 - top: 6px;
750 - right: 20px;
751 1002
752 - width: calc(100% - 55px);
753 - height: 6px;
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 +}
754 1010
755 - content: ' ';
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;
1021 +}
756 1022
757 - background: #73c5ee;
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;
758 1031 }
759 1032
760 -.wp-full-overlay-sidebar-content .customize-control input[type='number'].range-value
761 -{
762 - font-size: 13px;
763 - line-height: 1;
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 +}
764 1038
765 - top: -5px;
1039 +.customize-control-font:last-child {
1040 + margin-bottom: 150px;
1041 +}
766 1042
767 - float: right;
1043 +#accordion-section-live_css_edit_section .customize-section-title {
1044 + margin-top: -13px;
1045 + border-bottom: 1px solid #ddd;
1046 +}
768 1047
769 - width: auto;
770 - min-width: 40px;
771 - max-width: 80px;
772 - height: 30px;
773 - margin-left: 10px;
774 - padding: 4px 0 5px 0;
1048 +#accordion-section-live_css_edit_section #css_editor {
1049 + top: 70px;
1050 + border-top: 10px solid white;
1051 + overflow: visible;
1052 +}
775 1053
776 - text-align: center;
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;
777 1064 }
778 1065
779 -.wp-full-overlay-sidebar-content .customize-control input[type=number]::-webkit-inner-spin-button,
780 -.wp-full-overlay-sidebar-content .customize-control input[type=number]::-webkit-outer-spin-button
781 -{
782 - margin: 0;
1066 +#accordion-section-live_css_edit_section .ace_scroller {
1067 + padding-left: 10px;
1068 +}
783 1069
784 - -webkit-appearance: none;
1070 +.wp-full-overlay.editor_opened {
1071 + margin-left: 500px;
785 1072 }
786 1073
787 -.customize-control-color
788 -{
789 - display: block;
1074 +.wp-full-overlay.editor_opened #customize-controls {
1075 + width: 500px;
790 1076 }
791 -.customize-control-color .customize-control-title,
792 -.customize-control-color .separator.label
793 -{
794 - float: left;
1077 +
1078 +.wp-full-overlay.editor_opened.collapsed #customize-controls {
1079 + width: 300px;
795 1080 }
796 -.customize-control-color .wp-picker-container
797 -{
798 - position: relative;
799 - top: -3px;
800 1081
801 - float: right;
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;
802 1090 }
803 -.customize-control-color .wp-picker-container .wp-picker-holder
804 -{
805 - position: relative;
1091 +
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;
806 1098 }
807 -.customize-control-color .wp-picker-container .wp-color-result,
808 -.customize-control-color .wp-picker-container .wp-color-result.button
809 -{
810 - top: 0;
811 1099
812 - width: 40px;
813 - height: 30px;
814 - margin: 0;
815 - padding: 0;
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;
1107 +}
816 1108
817 - border: 2px solid #b8daeb;
818 - border-radius: 4px;
819 - background: #2ecc71;
820 - box-shadow: none;
1109 +.customize-control-media .inner,
1110 +.customize-control-site_icon .inner,
1111 +li#customize-control-site_logo .inner {
1112 + line-height: 1.4;
821 1113 }
822 -.customize-control-color .wp-picker-container .wp-color-result:after,
823 -.customize-control-color .wp-picker-container .wp-color-result .wp-color-result-text,
824 -.customize-control-color .wp-picker-container .wp-color-result.button:after,
825 -.customize-control-color .wp-picker-container .wp-color-result.button .wp-color-result-text
826 -{
827 - display: none;
1114 +
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;
828 1120 }
829 -.customize-control-color .wp-picker-container .iris-picker
830 -{
831 - position: absolute;
832 - z-index: 1000;
833 - top: 40px;
834 - right: 0;
835 1121
836 - width: 275px !important;
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;
1126 +}
837 1127
838 - border: none;
839 - border-color: #dfdfde;
840 - border-top: none;
841 - border-radius: 0 0 3px 3px;
842 - background: white;
1128 +.customize-control-media .actions,
1129 +.customize-control-site_icon .actions,
1130 +li#customize-control-site_logo .actions {
1131 + margin-bottom: 0;
843 1132 }
844 -.customize-control-color .wp-picker-container .iris-picker,
845 -.customize-control-color .wp-picker-container .iris-picker *
846 -{
847 - box-sizing: content-box;
1133 +
1134 +.customize-control-typography select, .customize-control-typography select {
1135 + margin-bottom: 10px;
848 1136 }
849 -.customize-control-color .wp-picker-container .iris-picker .iris-square
850 -{
851 - width: 215px !important;
852 - height: 173px !important;
853 - margin-right: 0;
1137 +
1138 +.customize-control-typography .description, .customize-control-typography .description {
1139 + margin-top: -3px;
854 1140 }
855 -.customize-control-color .wp-picker-container .iris-picker .iris-strip
856 -{
857 - float: right;
858 1141
859 - box-shadow: rgba(0, 0, 0, .4) 0 1px 1px inset;
1142 +.customize-control-typography ul li, .customize-control-typography ul li {
1143 + width: 100%;
1144 + margin: 0;
860 1145 }
861 -.customize-control-color .wp-picker-container .iris-picker .iris-strip .ui-slider-handle
862 -{
863 - opacity: 1;
864 - border-color: #aaa !important;
865 - box-shadow: none;
1146 +
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;
866 1156 }
867 -.customize-control-color .wp-picker-container .iris-picker .iris-palette
868 -{
869 - width: 24px !important;
870 - height: 24px !important;
871 1157
872 - border-radius: 50px;
873 - box-shadow: rgba(0, 0, 0, .4) 0 1px 1px inset;
1158 +.customize-control-preset .description {
1159 + margin-right: 5px;
1160 + font-style: normal;
874 1161 }
875 -.customize-control-color .wp-picker-container .wp-picker-open + .wp-picker-input-wrap
876 -{
877 - position: absolute;
878 - z-index: 1000;
879 - top: 35px;
880 - right: 0;
881 1162
882 - width: 275px;
883 - padding: 9px 12px;
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;
1171 +}
884 1172
885 - border: none;
886 - border-radius: 3px 3px 0 0;
887 - background: white;
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;
888 1179 }
889 -.customize-control-color .wp-picker-container .wp-picker-open + .wp-picker-input-wrap input.wp-color-picker
890 -{
891 - font-size: 13px;
892 1180
893 - float: left;
1181 +.customify_preset.radio_buttons .customify_radio_button input[type="radio"]:checked + label {
1182 + background-color: #ebebeb;
1183 +}
894 1184
895 - width: 100px;
896 - height: auto;
897 - margin: 0;
898 - padding: 6px 12px;
1185 +.customify_preset.radio_buttons .customify_radio_button input[type="radio"]:checked + label:before {
1186 + content: '>';
1187 + color: inherit;
1188 +}
899 1189
900 - text-align: left;
1190 +.customify_preset.radio_buttons .customify_radio_button input[type="radio"]:checked + label:after {
1191 + content: '<';
1192 + color: inherit;
901 1193 }
902 -.customize-control-color .wp-picker-container .wp-picker-open + .wp-picker-input-wrap input.button
903 -{
904 - float: right;
905 1194
906 - height: 30px;
907 - padding: 4px 12px;
1195 +.customify_preset.radio_buttons .customify_radio_button input[type="radio"]:checked:before {
1196 + opacity: 0;
908 1197 }
909 1198
910 -.customize-control-font:last-child
911 -{
912 - margin-bottom: 150px;
1199 +.customify_preset.radio_buttons .customify_radio_button label {
1200 + position: relative;
1201 + z-index: 999;
1202 + border-left: 4px solid;
913 1203 }
914 1204
915 -#accordion-section-live_css_edit_section .customize-section-title
916 -{
917 - margin-top: -13px;
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;
1215 +}
918 1216
919 - border-bottom: 1px solid #ddd;
1217 +.customify_preset .awesome_preset:hover {
1218 + opacity: 0.9;
920 1219 }
921 1220
922 -#accordion-section-live_css_edit_section #css_editor
923 -{
924 - top: 70px;
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 +}
925 1234
926 - overflow: visible;
1235 +.customify_preset .awesome_preset .preset-wrap .preset-color {
1236 + height: 128px;
1237 + border-radius: 4px 4px 0 0;
1238 + padding: 17px 0 27px;
1239 +}
927 1240
928 - border-top: 10px solid white;
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;
929 1246 }
930 -#accordion-section-live_css_edit_section #css_editor:before
931 -{
932 - position: absolute;
933 - z-index: 10000000;
934 - top: -10px;
935 - left: 0;
936 1247
937 - display: block;
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 - width: 48px;
940 - height: 10px;
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 +}
941 1263
942 - content: '';
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%;
1275 +}
943 1276
944 - background: #e8e8e8;
1277 +.customify_preset .awesome_preset:nth-child(odd) {
1278 + margin-right: 7%;
945 1279 }
946 1280
947 -#accordion-section-live_css_edit_section .ace_scroller
948 -{
949 - padding-left: 10px;
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;
950 1296 }
951 1297
952 -.wp-full-overlay.editor_opened
953 -{
954 - margin-left: 500px;
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;
955 1306 }
956 -.wp-full-overlay.editor_opened #customize-controls
957 -{
958 - width: 500px;
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;
959 1321 }
960 -.wp-full-overlay.editor_opened.collapsed #customize-controls
961 -{
962 - width: 300px;
1322 +
1323 +.customify_radio_image {
1324 + display: inline-block;
963 1325 }
964 1326
965 -.customize-control-media .current,
966 -.customize-control-site_icon .current,
967 -li#customize-control-site_logo .current
968 -{
969 - min-height: 44px;
970 - margin-bottom: 10px;
1327 +.customify_radio_image label {
1328 + display: block;
1329 + float: left;
1330 + margin-right: 10px;
1331 + position: relative;
1332 +}
971 1333
972 - border: 2px solid #b8daeb;
973 - border-radius: 4px;
974 - background: #f5fcff;
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;
975 1343 }
976 -.customize-control-media .current .container,
977 -.customize-control-media .current span,
978 -.customize-control-site_icon .current .container,
979 -.customize-control-site_icon .current span,
980 -li#customize-control-site_logo .current .container,
981 -li#customize-control-site_logo .current span
982 -{
983 - border: none;
1344 +
1345 +.customify_radio_image label input[type=radio] img {
1346 + cursor: pointer;
1347 + border: 2px solid transparent;
984 1348 }
985 1349
986 -.customize-control-media .inner,
987 -.customize-control-media .current span,
988 -.customize-control-site_icon .inner,
989 -.customize-control-site_icon .current span,
990 -li#customize-control-site_logo .inner,
991 -li#customize-control-site_logo .current span
992 -{
993 - font-size: 13px;
1350 +.customify_radio_image label input[type=radio]:checked + img {
1351 + border: 3px solid #73C5EE;
1352 +}
994 1353
995 - color: #98c6dd;
1354 +.customify_ace_editor {
1355 + display: block;
1356 + min-height: 200px;
1357 + border: 1px solid #ddd;
996 1358 }
997 1359
998 -.customize-control-media .inner,
999 -.customize-control-site_icon .inner,
1000 -li#customize-control-site_logo .inner
1001 -{
1002 - line-height: 1.4;
1360 +.customize-control-custom_background .hide {
1361 + display: none;
1003 1362 }
1004 1363
1005 -.customize-control-media .thumbnail-image,
1006 -.customize-control-site_icon .thumbnail-image,
1007 -li#customize-control-site_logo .thumbnail-image
1008 -{
1009 - padding: 14px;
1364 +.customize-control-custom_background .upload_button_div {
1365 + margin: 10px 0;
1366 +}
1010 1367
1011 - text-align: center;
1368 +.customize-control-custom_background .upload_button_div > * {
1369 + margin-right: 10px;
1012 1370 }
1013 -.customize-control-media .thumbnail-image img,
1014 -.customize-control-site_icon .thumbnail-image img,
1015 -li#customize-control-site_logo .thumbnail-image img
1016 -{
1017 - width: auto;
1371 +
1372 +.customize-control-custom_background .preview_screenshot {
1373 + text-align: center;
1374 + margin: 10px 0;
1018 1375 }
1019 1376
1020 -.customize-control-media .actions,
1021 -.customize-control-site_icon .actions,
1022 -li#customize-control-site_logo .actions
1023 -{
1024 - margin-bottom: 0;
1377 +.customize-control-custom_background .preview_screenshot img {
1378 + border: 2px solid #ccc;
1025 1379 }
1026 1380
1027 -.customize-control-typography select,
1028 -.customize-control-typography select
1029 -{
1030 - margin-bottom: 10px;
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%;
1031 1388 }
1032 1389
1033 -.customize-control-typography .description,
1034 -.customize-control-typography .description
1035 -{
1036 - margin-top: -3px;
1390 +.import_step_note {
1391 + margin: 5px;
1392 + width: 100%;
1393 + display: inline-block;
1037 1394 }
1038 1395
1039 -.customize-control-typography ul li,
1040 -.customize-control-typography ul li
1041 -{
1042 - width: 100%;
1043 - margin: 0;
1396 +.import_step_note:before {
1397 + content: "\1F449";
1044 1398 }
1045 1399
1046 -.default-preset-button
1047 -{
1048 - font-family: 'Open Sans',sans-serif;
1049 - font-size: 13px;
1400 +.import_step_note.success:before {
1401 + content: "\1F44D";
1402 +}
1050 1403
1051 - float: right;
1404 +.import_step_note.failed:before {
1405 + content: "\274C";
1406 +}
1052 1407
1053 - margin-right: 4px;
1054 - padding: 1px 8px;
1408 +#customize-header-actions {
1409 + background: #ffffff;
1410 + border-color: #e0e8ef;
1411 +}
1055 1412
1056 - border: 1px solid #cbcbcb;
1057 - border-radius: 3px;
1058 - background-color: #f5f6f6;
1413 +.wp-full-overlay-sidebar,
1414 +.customize-themes-panel,
1415 +#customize-sidebar-outer-content {
1416 + background: #F7F9FA;
1417 + border-right: 1px solid #e0e8ef;
1059 1418 }
1060 1419
1061 -.customize-control-preset .description
1062 -{
1063 - font-style: normal;
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;
1423 +}
1064 1424
1065 - margin-right: 5px;
1425 +#customize-theme-controls #accordion-section-menu_locations {
1426 + border-bottom: 1px solid #e0e8ef;
1066 1427 }
1067 1428
1068 -.customify_preset.radio_buttons .customify_radio_button
1069 -{
1070 - position: relative;
1429 +#customize-controls #accordion-section-themes > .accordion-section-title {
1430 + font-weight: 600;
1431 + border-bottom: 1px solid #e0e8ef;
1432 +}
1071 1433
1072 - display: inline-block;
1073 - overflow: hidden;
1434 +#customize-controls #accordion-section-themes > .accordion-section-title:hover {
1435 + background: #fff;
1436 +}
1074 1437
1075 - height: auto;
1076 - margin: 3px;
1077 - padding: 2px;
1438 +#customize-controls .panel-meta.customize-info {
1439 + border-bottom-color: #e0e8ef;
1440 +}
1078 1441
1079 - border: none;
1442 +#customize-theme-controls .control-section .accordion-section-title {
1443 + font-weight: 400;
1444 + border-top: 1px solid #e0e8ef;
1445 + border-bottom: none;
1080 1446 }
1081 -.customify_preset.radio_buttons .customify_radio_button input[type='radio']
1082 -{
1083 - position: absolute;
1084 - z-index: 9999;
1085 1447
1086 - width: 100%;
1087 - height: 100%;
1448 +#customize-theme-controls .control-section:last-of-type > .accordion-section-title {
1449 + border-bottom: 1px solid #e0e8ef;
1450 +}
1088 1451
1089 - opacity: 0;
1452 +#customize-theme-controls .customize-section-title {
1453 + border-top: 1px solid #e0e8ef;
1454 + border-bottom: 1px solid #e0e8ef;
1090 1455 }
1091 -.customify_preset.radio_buttons .customify_radio_button input[type='radio']:checked + label
1092 -{
1093 - background-color: #ebebeb;
1456 +
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;
1094 1461 }
1095 -.customify_preset.radio_buttons .customify_radio_button input[type='radio']:checked + label:before
1096 -{
1097 - content: '>';
1098 1462
1099 - color: inherit;
1463 +.wp-customizer {
1464 + /* SECTION: NAV MENUS */
1100 1465 }
1101 -.customify_preset.radio_buttons .customify_radio_button input[type='radio']:checked + label:after
1102 -{
1103 - content: '<';
1104 1466
1105 - color: inherit;
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;
1106 1469 }
1107 -.customify_preset.radio_buttons .customify_radio_button input[type='radio']:checked:before
1108 -{
1109 - opacity: 0;
1470 +
1471 +.wp-customizer .section-open .menu-item-settings {
1472 + background: #f5fcff;
1110 1473 }
1111 -.customify_preset.radio_buttons .customify_radio_button label
1112 -{
1113 - position: relative;
1114 - z-index: 999;
1115 1474
1116 - border-left: 4px solid;
1475 +.wp-customizer .control-section-nav_menu .menu-location-settings {
1476 + border-top-color: #e0e8ef !important;
1117 1477 }
1118 1478
1119 -.customify_preset .awesome_preset
1120 -{
1121 - position: relative;
1479 +[data-balloon] {
1480 + position: relative;
1481 +}
1122 1482
1123 - display: inline-block;
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 +}
1124 1498
1125 - width: 45%;
1126 - margin-top: 5px;
1127 - margin-bottom: 25px;
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 - transition: all .2s;
1130 - text-align: center;
1513 +[data-balloon]:hover::before, [data-balloon]:hover::after {
1514 + opacity: 1;
1515 + pointer-events: auto;
1516 +}
1131 1517
1132 - color: white;
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;
1133 1526 }
1134 -.customify_preset .awesome_preset:hover
1135 -{
1136 - opacity: .9;
1527 +
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;
1137 1536 }
1138 -.customify_preset .awesome_preset:before
1139 -{
1140 - position: absolute;
1141 - z-index: 5;
1142 - top: 1px;
1143 - right: 1px;
1144 - bottom: 1px;
1145 - left: 1px;
1146 1537
1147 - content: '';
1538 +[data-balloon][data-balloon-pos="up"]:hover::before {
1539 + -webkit-transform: translate3d(-50%, 0, 0);
1540 + transform: translate3d(-50%, 0, 0);
1541 +}
1148 1542
1149 - opacity: .5;
1150 - border: 1px solid #fff;
1151 - border-radius: 4px;
1152 - background: transparent;
1543 +[data-balloon][data-balloon-pos="up"]:hover::after {
1544 + -webkit-transform: translate3d(-50%, 0, 0);
1545 + transform: translate3d(-50%, 0, 0);
1153 1546 }
1154 -.customify_preset .awesome_preset .preset-wrap .preset-color
1155 -{
1156 - height: 128px;
1157 - padding: 17px 0 27px;
1158 1547
1159 - border-radius: 4px 4px 0 0;
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);
1160 1554 }
1161 -.customify_preset .awesome_preset .preset-wrap .preset-color .first-font
1162 -{
1163 - font-size: 55px;
1164 - line-height: 1;
1165 1555
1166 - display: inline-block;
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);
1566 +}
1167 1567
1168 - width: 100%;
1568 +[data-balloon][data-balloon-pos='down']:hover::before {
1569 + -webkit-transform: translate3d(-50%, 0, 0);
1570 + transform: translate3d(-50%, 0, 0);
1169 1571 }
1170 -.customify_preset .awesome_preset .preset-wrap .preset-color .secondary-font
1171 -{
1172 - font-size: 20px;
1173 - line-height: 1;
1174 1572
1175 - display: inline-block;
1573 +[data-balloon][data-balloon-pos='down']:hover::after {
1574 + -webkit-transform: translate3d(-50%, 0, 0);
1575 + transform: translate3d(-50%, 0, 0);
1576 +}
1176 1577
1177 - width: 100%;
1178 - margin-top: 8px;
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);
1179 1584 }
1180 -.customify_preset .awesome_preset .preset-wrap .preset-name
1181 -{
1182 - font-size: 11px;
1183 1585
1184 - position: relative;
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 +}
1185 1597
1186 - padding: 1px;
1598 +[data-balloon][data-balloon-pos='left']:hover::before {
1599 + -webkit-transform: translate3d(0, -50%, 0);
1600 + transform: translate3d(0, -50%, 0);
1601 +}
1187 1602
1188 - text-transform: UPPERCASE;
1603 +[data-balloon][data-balloon-pos='left']:hover::after {
1604 + -webkit-transform: translate3d(0, -50%, 0);
1605 + transform: translate3d(0, -50%, 0);
1606 +}
1189 1607
1190 - border-radius: 0 0 4px 4px;
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);
1191 1614 }
1192 -.customify_preset .awesome_preset .preset-wrap .preset-name:before
1193 -{
1194 - position: absolute;
1195 - top: -10px;
1196 - left: 40%;
1197 1615
1198 - content: '';
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);
1626 +}
1199 1627
1200 - border: 10px solid;
1201 - border-color: inherit;
1202 - border-top: transparent;
1203 - border-right-color: transparent;
1204 - border-bottom-color: inherit;
1205 - border-left-color: transparent;
1628 +[data-balloon][data-balloon-pos='right']:hover::before {
1629 + -webkit-transform: translate3d(0, -50%, 0);
1630 + transform: translate3d(0, -50%, 0);
1206 1631 }
1207 -.customify_preset .awesome_preset:nth-child(odd)
1208 -{
1209 - margin-right: 7%;
1632 +
1633 +[data-balloon][data-balloon-pos='right']:hover::after {
1634 + -webkit-transform: translate3d(0, -50%, 0);
1635 + transform: translate3d(0, -50%, 0);
1210 1636 }
1211 -.customify_preset .awesome_preset input[type=radio]
1212 -{
1213 - position: absolute;
1214 - z-index: 10;
1215 - top: 0;
1216 - left: 0;
1217 1637
1218 - display: inline-block;
1638 +[data-balloon][data-balloon-length='small']::before {
1639 + white-space: normal;
1640 + width: 80px;
1641 +}
1219 1642
1220 - width: 100%;
1221 - height: 100%;
1222 - margin: 0;
1643 +[data-balloon][data-balloon-length='medium']::before {
1644 + white-space: normal;
1645 + width: 150px;
1646 +}
1223 1647
1224 - color: #006505;
1225 - border: 0;
1226 - border-radius: 0;
1227 - background-color: transparent;
1228 - box-shadow: none;
1648 +[data-balloon][data-balloon-length='large']::before {
1649 + white-space: normal;
1650 + width: 260px;
1229 1651 }
1230 -.customify_preset .awesome_preset input[type=radio]:checked:before
1231 -{
1232 - position: absolute;
1233 - z-index: 1;
1234 - top: -13px;
1235 - right: -14px;
1236 1652
1237 - width: 25px;
1238 - height: 25px;
1653 +[data-balloon][data-balloon-length='xlarge']::before {
1654 + white-space: normal;
1655 + width: 380px;
1656 +}
1239 1657
1240 - background: #fff;
1658 +@media screen and (max-width: 768px) {
1659 + [data-balloon][data-balloon-length='xlarge']::before {
1660 + white-space: normal;
1661 + width: 90vw;
1662 + }
1241 1663 }
1242 -.customify_preset .awesome_preset input[type=radio]:checked:after
1243 -{
1244 - position: absolute;
1245 - z-index: 10;
1246 - top: -5px;
1247 - right: -5px;
1248 1664
1249 - width: 26px;
1250 - height: 26px;
1665 +[data-balloon][data-balloon-length='fit']::before {
1666 + white-space: normal;
1667 + width: 100%;
1668 +}
1251 1669
1252 - content: '';
1670 +/* ==========================================================================
1671 + #FEEDBACK MODAL
1672 + ========================================================================== */
1673 +body.modal-open {
1674 + overflow: hidden;
1675 +}
1253 1676
1254 - border-radius: 50%;
1255 - background: #73c5ee url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+Cjxzdmcgd2lkdGg9IjEzcHgiIGhlaWdodD0iOXB4IiB2aWV3Qm94PSIwIDAgMTMgOSIgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIj4KICAgIDxkZWZzPjwvZGVmcz4KICAgIDxnIGlkPSJQYWdlLTEiIHN0cm9rZT0ibm9uZSIgc3Ryb2tlLXdpZHRoPSIxIiBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPgogICAgICAgIDxnIGlkPSJDdXN0b21pZnktQ29weSIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoLTIxLjAwMDAwMCwgLTQwOC4wMDAwMDApIiBmaWxsPSIjRkZGRkZGIj4KICAgICAgICAgICAgPGcgaWQ9IkhlYWRlciIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoLTIxLjAwMDAwMCwgNDcuMDAwMDAwKSI+CiAgICAgICAgICAgICAgICA8ZyBpZD0iQ29udGVudCIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMTAuMDAwMDAwLCA3NS4wMDAwMDApIj4KICAgICAgICAgICAgICAgICAgICA8ZyBpZD0iRmllbGQtLS1DaGVja2JveC1Db3B5IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgyNy4wMDAwMDAsIDI0OS4wMDAwMDApIj4KICAgICAgICAgICAgICAgICAgICAgICAgPGcgaWQ9IkNoZWNrYm94IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgwLjAwMDAwMCwgMzAuMDAwMDAwKSI+CiAgICAgICAgICAgICAgICAgICAgICAgICAgICA8cGF0aCBkPSJNMTAuMDM4NDk1LDE2IEwxNy4xMTYxMzc1LDguOTIxNDg3NiBMMTUuMTk0NjQ5OCw3IEwxMC4wMzg0OTUsMTIuMTU1MDY3NCBMNi45MjE0ODc2LDkuMDM4OTI5OTcgTDUsMTAuOTYwNDE3NiBMMTAuMDM4NDk1LDE2IFoiIGlkPSJQYWdlLTEiPjwvcGF0aD4KICAgICAgICAgICAgICAgICAgICAgICAgPC9nPgogICAgICAgICAgICAgICAgICAgIDwvZz4KICAgICAgICAgICAgICAgIDwvZz4KICAgICAgICAgICAgPC9nPgogICAgICAgIDwvZz4KICAgIDwvZz4KPC9zdmc+) no-repeat;
1256 - background-position: center center;
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);
1684 +}
1257 1685
1258 - -ms-filter: 'progid:DXImageTransform.Microsoft.Alpha(Opacity=0)';
1259 - filter: alpha(opacity=0);
1686 +#style-manager-user-feedback-modal {
1687 + height: 100%;
1260 1688 }
1261 1689
1262 -.customify_radio_image
1263 -{
1264 - display: inline-block;
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;
1265 1716 }
1266 -.customify_radio_image label
1267 -{
1268 - position: relative;
1269 1717
1270 - display: block;
1271 - float: left;
1718 +#style-manager-user-feedback-modal .modal-dialog {
1719 + position: relative;
1720 + width: auto;
1721 + margin: 10px;
1722 + text-align: left;
1723 +}
1272 1724
1273 - margin-right: 10px;
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;
1274 1741 }
1275 -.customify_radio_image label input[type=radio]
1276 -{
1277 - position: absolute;
1278 - top: 0;
1279 - right: 0;
1280 - bottom: 0;
1281 - left: 0;
1282 1742
1283 - visibility: hidden;
1743 +#style-manager-user-feedback-modal .modal-content p {
1744 + color: #000;
1745 +}
1284 1746
1285 - width: 100%;
1286 - height: 100%;
1747 +#style-manager-user-feedback-modal .modal-content p a {
1748 + font-weight: 500;
1749 + color: #9660C6;
1750 + border-bottom: 1px solid #9660C6;
1287 1751 }
1288 -.customify_radio_image label input[type=radio] img
1289 -{
1290 - cursor: pointer;
1291 1752
1292 - border: 2px solid transparent;
1753 +#style-manager-user-feedback-modal .modal-content > form {
1754 + margin-bottom: 20px;
1293 1755 }
1294 -.customify_radio_image label input[type=radio]:checked + img
1295 -{
1296 - border: 3px solid #73c5ee;
1756 +
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;
1297 1769 }
1298 1770
1299 -.customify_ace_editor
1300 -{
1301 - display: block;
1771 +.modal-open #style-manager-user-feedback-modal .modal-backdrop {
1772 + opacity: 0.8;
1773 + visibility: visible;
1774 +}
1302 1775
1303 - min-height: 200px;
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;
1787 +}
1304 1788
1305 - border: 1px solid #ddd;
1789 +#style-manager-user-feedback-modal .modal-header .close.button {
1790 + top: -10px;
1306 1791 }
1307 1792
1308 -.customize-control-custom_background .hide
1309 -{
1310 - display: none;
1793 +#style-manager-user-feedback-modal .modal-header .close.icon {
1794 + opacity: 0.5;
1311 1795 }
1312 1796
1313 -.customize-control-custom_background .upload_button_div
1314 -{
1315 - margin: 10px 0;
1797 +#style-manager-user-feedback-modal .modal-header .close:hover {
1798 + opacity: 1;
1316 1799 }
1317 -.customize-control-custom_background .upload_button_div > *
1318 -{
1319 - margin-right: 10px;
1800 +
1801 +#style-manager-user-feedback-modal .modal-title {
1802 + margin-bottom: 10px;
1803 + line-height: 1.5;
1320 1804 }
1321 1805
1322 -.customize-control-custom_background .preview_screenshot
1323 -{
1324 - margin: 10px 0;
1806 +#style-manager-user-feedback-modal .modal-title.modal-title--small {
1807 + font-weight: 500;
1808 +}
1325 1809
1326 - text-align: center;
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;
1327 1816 }
1328 -.customize-control-custom_background .preview_screenshot img
1329 -{
1330 - border: 2px solid #ccc;
1817 +
1818 +#style-manager-user-feedback-modal .modal-body.full {
1819 + padding: 0;
1331 1820 }
1332 1821
1333 -#customify_import_demo_data_button
1334 -{
1335 - display: inline-block;
1822 +#style-manager-user-feedback-modal .modal-body.full .box {
1823 + padding-top: 0;
1824 + padding-bottom: 0;
1825 + margin-top: 0;
1826 +}
1336 1827
1337 - width: 70%;
1338 - height: auto;
1339 - margin: 0 15% 10% 15%;
1340 - padding: 10px;
1828 +#style-manager-user-feedback-modal .modal-body.full + .modal-footer.full .box {
1829 + padding-top: 18px;
1830 +}
1341 1831
1342 - text-align: center;
1832 +#style-manager-user-feedback-modal .modal-footer {
1833 + padding: 30px;
1834 + text-align: center;
1343 1835 }
1344 1836
1345 -.import_step_note
1346 -{
1347 - display: inline-block;
1837 +#style-manager-user-feedback-modal .modal-footer .box .button:last-child {
1838 + margin-bottom: 0;
1839 +}
1348 1840
1349 - width: 100%;
1350 - margin: 5px;
1841 +#style-manager-user-feedback-modal .modal-footer.full {
1842 + padding: 0;
1351 1843 }
1352 -.import_step_note:before
1353 -{
1354 - content: '\1F449';
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;
1355 1851 }
1356 -.import_step_note.success:before
1357 -{
1358 - content: '\1F44D';
1852 +
1853 +#style-manager-user-feedback-modal .modal-state {
1854 + display: none;
1359 1855 }
1360 -.import_step_note.failed:before
1361 -{
1362 - content: '\274C';
1856 +
1857 +#style-manager-user-feedback-modal .modal-state:checked + .modal {
1858 + opacity: 1;
1859 + visibility: visible;
1363 1860 }
1364 1861
1365 -#customize-header-actions
1366 -{
1367 - border-color: #e0e8ef;
1368 - background: #fff;
1862 +#style-manager-user-feedback-modal .modal-state:checked + .modal .modal__inner {
1863 + top: 0;
1369 1864 }
1370 1865
1371 -.wp-full-overlay-sidebar,
1372 -.customize-themes-panel,
1373 -#customize-sidebar-outer-content
1374 -{
1375 - border-right: 1px solid #e0e8ef;
1376 - 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 + }
1377 1874 }
1378 1875
1379 -.outer-section-open #customize-controls .wp-full-overlay-sidebar-content,
1380 -.attachment-media-view,
1381 -.media-widget-preview.media_audio,
1382 -.media-widget-preview.media_image
1383 -{
1384 - background: #eaf9fe;
1876 +@media (min-width: 576px) {
1877 + #style-manager-user-feedback-modal .modal-lg {
1878 + max-width: 800px;
1879 + }
1385 1880 }
1386 1881
1387 -#customize-theme-controls #accordion-section-menu_locations
1388 -{
1389 - border-bottom: 1px solid #e0e8ef;
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;
1390 1899 }
1391 1900
1392 -#customize-controls #accordion-section-themes > .accordion-section-title
1393 -{
1394 - font-weight: 600;
1901 +#style-manager-user-feedback .modal-body .box > * {
1902 + width: 100%;
1903 +}
1395 1904
1396 - border-bottom: 1px solid #e0e8ef;
1905 +#style-manager-user-feedback .modal-body p {
1906 + font-size: 16px;
1907 + margin-bottom: 20px;
1397 1908 }
1398 -#customize-controls #accordion-section-themes > .accordion-section-title:hover
1399 -{
1400 - background: #fff;
1909 +
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;
1401 1922 }
1402 1923
1403 -#customize-controls .panel-meta.customize-info
1404 -{
1405 - border-bottom-color: #e0e8ef;
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;
1406 1932 }
1407 1933
1408 -#customize-theme-controls .control-section .accordion-section-title
1409 -{
1410 - font-weight: 400;
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;
1963 +}
1411 1964
1412 - border-top: 1px solid #e0e8ef;
1413 - border-bottom: none;
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);
1414 1972 }
1415 1973
1416 -#customize-theme-controls .control-section:last-of-type > .accordion-section-title
1417 -{
1418 - border-bottom: 1px solid #e0e8ef;
1974 +#style-manager-user-feedback .second-step {
1975 + margin-top: 18px;
1419 1976 }
1420 1977
1421 -#customize-theme-controls .customize-section-title
1422 -{
1423 - border-top: 1px solid #e0e8ef;
1424 - border-bottom: 1px solid #e0e8ef;
1978 +#style-manager-user-feedback .thanks-step,
1979 +#style-manager-user-feedback .error-step {
1980 + text-align: center;
1425 1981 }
1426 1982
1427 -#customize-controls .control-section .accordion-section-title:focus,
1428 -#customize-controls .control-section .accordion-section-title:hover,
1429 -#customize-controls .control-section.open .accordion-section-title,
1430 -#customize-controls .control-section:hover > .accordion-section-title
1431 -{
1432 - color: #056184;
1433 - border-left-color: #f5fcff;
1434 - background: #f5fcff;
1983 +#style-manager-user-feedback .thanks-step .modal-title,
1984 +#style-manager-user-feedback .error-step .modal-title {
1985 + margin-bottom: 0;
1435 1986 }
1436 1987
1437 -.wp-customizer
1438 -{
1439 - /* SECTION: NAV MENUS */
1988 +#style-manager-user-feedback .thanks-step p:last-child,
1989 +#style-manager-user-feedback .error-step p:last-child {
1990 + margin-bottom: 10px;
1440 1991 }
1441 -.wp-customizer .menu-item-edit-active .menu-item-handle,
1442 -.wp-customizer .section-open .menu-item-settings,
1443 -.wp-customizer .menu-item-bar .menu-item-handle:hover
1444 -{
1445 - border-color: #e0e8ef;
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;
1446 2008 }
1447 -.wp-customizer .section-open .menu-item-settings
1448 -{
1449 - background: #f5fcff;
2009 +
2010 +.scorecard > label {
2011 + font-size: 20px;
1450 2012 }
1451 -.wp-customizer .control-section-nav_menu .menu-location-settings
1452 -{
1453 - border-top-color: #e0e8ef !important;
2013 +
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;
1454 2023 }
1455 2024
1456 -[data-balloon]
1457 -{
1458 - position: relative;
2025 +.scorecard > label input[type="radio"] {
2026 + display: none;
1459 2027 }
1460 2028
1461 -[data-balloon]::before
1462 -{
1463 - font-size: 12px;
2029 +.scorecard > label span:hover,
2030 +.scorecard > label input[type="radio"]:checked ~ span {
2031 + background: #9660C6;
2032 + color: #FFF;
2033 +}
1464 2034
1465 - position: absolute;
1466 - z-index: 10;
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 +}
1467 2040
1468 - padding: .5em 1em;
2041 +.font-options__wrapper .font-options__option {
2042 + margin-bottom: 12px;
2043 +}
1469 2044
1470 - content: attr(data-balloon);
1471 - transition: all .18s ease-out;
1472 - white-space: nowrap;
1473 - pointer-events: none;
2045 +.font-options__wrapper .font-options__option label {
2046 + display: block;
2047 + margin-bottom: 6px;
2048 +}
1474 2049
1475 - opacity: 0;
1476 - color: #fff;
1477 - border-radius: 4px;
1478 - background: rgba(17, 17, 17, .9);
2050 +.font-options__wrapper [type=checkbox]:checked ~ .font-options__options-list {
2051 + opacity: 1;
2052 + display: block;
1479 2053 }
1480 2054
1481 -[data-balloon]::after
1482 -{
1483 - position: absolute;
1484 - z-index: 10;
2055 +input.customify_font_tooltip {
2056 + display: none;
2057 +}
1485 2058
1486 - width: 18px;
1487 - height: 6px;
2059 +ul.font-options__options-list .select2-container {
2060 + width: 100% !important;
2061 +}
1488 2062
1489 - content: '';
1490 - transition: all .18s ease-out;
1491 - pointer-events: none;
2063 +ul.font-options__options-list .select2-container .select2-selection--single {
2064 + -webkit-appearance: initial;
2065 +}
1492 2066
1493 - opacity: 0;
1494 - 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>');
1495 - background-size: 100% auto;
2067 +ul.font-options__options-list .select2-container .select2-selection--single .select2-selection__arrow {
2068 + display: none;
1496 2069 }
1497 2070
1498 -[data-balloon]:hover::before,
1499 -[data-balloon]:hover::after
1500 -{
1501 - pointer-events: auto;
2071 +ul.font-options__options-list .select2-container--default .select2-selection--single .select2-selection__rendered {
2072 + color: inherit;
2073 + line-height: initial;
2074 +}
1502 2075
1503 - opacity: 1;
2076 +.select2-container.select2-container--open {
2077 + z-index: 99999999;
1504 2078 }
1505 2079
1506 -[data-balloon][data-balloon-pos='up']::before
1507 -{
1508 - bottom: 100%;
1509 - left: 50%;
2080 +#customize-theme-controls .select2-container {
2081 + width: 100% !important;
2082 +}
1510 2083
1511 - margin-bottom: 11px;
2084 +#customize-theme-controls .select2-container .select2-selection--multiple {
2085 + -webkit-appearance: initial;
2086 + padding: 4px 8px 4px;
2087 + height: auto;
2088 + background: none;
2089 +}
1512 2090
1513 - -webkit-transform: translate3d(-50%, 10px, 0);
1514 - transform: translate3d(-50%, 10px, 0);
1515 - -webkit-transform-origin: top;
1516 - transform-origin: top;
2091 +#customize-theme-controls .select2-container .select2-selection--multiple .select2-selection__arrow {
2092 + display: none;
1517 2093 }
1518 2094
1519 -[data-balloon][data-balloon-pos='up']::after
1520 -{
1521 - bottom: 100%;
1522 - left: 50%;
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 +}
1523 2101
1524 - margin-bottom: 5px;
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;
2106 +}
1525 2107
1526 - -webkit-transform: translate3d(-50%, 10px, 0);
1527 - transform: translate3d(-50%, 10px, 0);
1528 - -webkit-transform-origin: top;
1529 - transform-origin: top;
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;
1530 2112 }
1531 2113
1532 -[data-balloon][data-balloon-pos='up']:hover::before
1533 -{
1534 - -webkit-transform: translate3d(-50%, 0, 0);
1535 - 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;
1536 2120 }
1537 2121
1538 -[data-balloon][data-balloon-pos='up']:hover::after
1539 -{
1540 - -webkit-transform: translate3d(-50%, 0, 0);
1541 - transform: translate3d(-50%, 0, 0);
2122 +#customize-theme-controls .select2-container .select2-search--inline .select2-search__field {
2123 + height: 29px;
2124 + min-width: 9em;
2125 + margin-top: 0;
1542 2126 }
1543 2127
1544 -[data-balloon][data-balloon-pos='down']::before
1545 -{
1546 - top: 100%;
1547 - left: 50%;
2128 +.select2-container--default .select2-results__option[aria-selected=true][class] {
2129 + background: transparent;
2130 + opacity: 0.3;
2131 + pointer-events: none;
2132 +}
1548 2133
1549 - margin-top: 11px;
2134 +.select2-container .select2-dropdown {
2135 + border-color: #e0e8ef;
2136 +}
1550 2137
1551 - -webkit-transform: translate3d(-50%, -10px, 0);
1552 - transform: translate3d(-50%, -10px, 0);
2138 +#customize-theme-controls .widget-content .accordion-container {
2139 + margin-left: -10px;
2140 + margin-right: -10px;
2141 + margin-top: 20px;
2142 + margin-bottom: 10px;
1553 2143 }
1554 2144
1555 -[data-balloon][data-balloon-pos='down']::after
1556 -{
1557 - top: 100%;
1558 - left: 50%;
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 +}
1559 2156
1560 - width: 18px;
1561 - height: 6px;
1562 - margin-top: 5px;
2157 +#customize-theme-controls .widget-content .accordion-container .accordion-section .accordion-section-content p:first-child {
2158 + margin-top: 0;
2159 +}
1563 2160
1564 - -webkit-transform: translate3d(-50%, -10px, 0);
1565 - transform: translate3d(-50%, -10px, 0);
2161 +#customize-theme-controls .widget-content .accordion-container .accordion-section .accordion-section-content p:last-child {
2162 + margin-bottom: 0;
2163 +}
1566 2164
1567 - 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>');
1568 - background-size: 100% auto;
2165 +#customize-theme-controls .widget-content .accordion-container .accordion-section .accordion-section-title {
2166 + color: #39474D;
1569 2167 }
1570 2168
1571 -[data-balloon][data-balloon-pos='down']:hover::before
1572 -{
1573 - -webkit-transform: translate3d(-50%, 0, 0);
1574 - 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);
1575 2173 }
1576 2174
1577 -[data-balloon][data-balloon-pos='down']:hover::after
1578 -{
1579 - -webkit-transform: translate3d(-50%, 0, 0);
1580 - transform: translate3d(-50%, 0, 0);
2175 +#customize-theme-controls .widget-content .accordion-container .accordion-section.open {
2176 + border-bottom: none;
1581 2177 }
1582 2178
1583 -[data-balloon][data-balloon-pos='left']::before
1584 -{
1585 - top: 50%;
1586 - right: 100%;
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 +}
1587 2184
1588 - margin-right: 11px;
2185 +#customize-theme-controls .widget-content .accordion-container .accordion-section.open .accordion-section-title {
2186 + border-bottom: 1px solid;
2187 +}
1589 2188
1590 - -webkit-transform: translate3d(10px, -50%, 0);
1591 - transform: translate3d(10px, -50%, 0);
2189 +#customize-theme-controls .widget-content .accordion-container .accordion-section.open .accordion-section-title:after {
2190 + -webkit-transform: rotate(0deg);
2191 + transform: rotate(0deg);
1592 2192 }
1593 2193
1594 -[data-balloon][data-balloon-pos='left']::after
1595 -{
1596 - top: 50%;
1597 - right: 100%;
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 +}
1598 2197
1599 - width: 6px;
1600 - height: 18px;
1601 - margin-right: 5px;
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 - -webkit-transform: translate3d(10px, -50%, 0);
1604 - transform: translate3d(10px, -50%, 0);
2204 +.widget .widget-content small {
2205 + margin-top: 5px;
2206 + display: block;
2207 +}
1605 2208
1606 - 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>');
1607 - background-size: 100% auto;
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;
1608 2214 }
1609 2215
1610 -[data-balloon][data-balloon-pos='left']:hover::before
1611 -{
1612 - -webkit-transform: translate3d(0, -50%, 0);
1613 - transform: translate3d(0, -50%, 0);
2216 +#available-widgets [class*=pixelgrade-featured-posts-slideshow] .widget .widget-title:before {
2217 + content: "\f233";
1614 2218 }
1615 2219
1616 -[data-balloon][data-balloon-pos='left']:hover::after
1617 -{
1618 - -webkit-transform: translate3d(0, -50%, 0);
1619 - transform: translate3d(0, -50%, 0);
2220 +#available-widgets [class*=pixelgrade-featured-posts-carousel] .widget .widget-title:before {
2221 + content: "\f169";
1620 2222 }
1621 2223
1622 -[data-balloon][data-balloon-pos='right']::before
1623 -{
1624 - top: 50%;
1625 - left: 100%;
2224 +#available-widgets [class*=featured-posts-grid] .widget .widget-title:before {
2225 + content: "\f180";
2226 +}
1626 2227
1627 - margin-left: 11px;
2228 +#available-widgets [class*=featured-posts-list] .widget .widget-title:before {
2229 + content: "\f164";
2230 +}
1628 2231
1629 - -webkit-transform: translate3d(-10px, -50%, 0);
1630 - transform: translate3d(-10px, -50%, 0);
2232 +#available-widgets [class*=categories-image-grid] .widget .widget-title:before {
2233 + content: "\f163";
1631 2234 }
1632 2235
1633 -[data-balloon][data-balloon-pos='right']::after
1634 -{
1635 - top: 50%;
1636 - left: 100%;
2236 +#available-widgets [class*=pixelgrade-promo-box] .widget .widget-title:before {
2237 + content: "\f488";
2238 +}
1637 2239
1638 - width: 6px;
1639 - height: 18px;
1640 - margin-left: 5px;
2240 +.ui-tooltip {
2241 + z-index: 999999;
2242 +}
1641 2243
1642 - -webkit-transform: translate3d(-10px, -50%, 0);
1643 - transform: translate3d(-10px, -50%, 0);
2244 +.wp-customizer .widget-conditional .condition-control:after {
2245 + content: " ";
2246 + display: table;
2247 + clear: both;
2248 +}
1644 2249
1645 - 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>');
1646 - background-size: 100% auto;
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;
1647 2258 }
1648 2259
1649 -[data-balloon][data-balloon-pos='right']:hover::before
1650 -{
1651 - -webkit-transform: translate3d(0, -50%, 0);
1652 - transform: translate3d(0, -50%, 0);
2260 +.wp-customizer .widget-conditional .condition:last-child .selection {
2261 + border: 0;
1653 2262 }
1654 2263
1655 -[data-balloon][data-balloon-pos='right']:hover::after
1656 -{
1657 - -webkit-transform: translate3d(0, -50%, 0);
1658 - transform: translate3d(0, -50%, 0);
2264 +.wp-customizer .widget-conditional select {
2265 + max-width: 100%;
2266 + width: 170px;
1659 2267 }
1660 2268
1661 -[data-balloon][data-balloon-length='small']::before
1662 -{
1663 - width: 80px;
2269 +.wp-customizer .widget-conditional .condition-top select {
2270 + width: 130px;
2271 +}
1664 2272
1665 - white-space: normal;
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;
1666 2283 }
1667 2284
1668 -[data-balloon][data-balloon-length='medium']::before
1669 -{
1670 - width: 150px;
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);
2296 +}
1671 2297
1672 - white-space: normal;
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);
1673 2301 }
1674 2302
1675 -[data-balloon][data-balloon-length='large']::before
1676 -{
1677 - width: 260px;
2303 +.pix_customizer_setting .customize-inside-control-row:hover .palette__item {
2304 + -webkit-transform: translateY(0%);
2305 + transform: translateY(0%);
2306 +}
1678 2307
1679 - white-space: normal;
2308 +.pix_customizer_setting .customize-inside-control-row:hover label {
2309 + left: 10px;
1680 2310 }
1681 2311
1682 -[data-balloon][data-balloon-length='xlarge']::before
1683 -{
1684 - width: 380px;
2312 +.pix_customizer_setting .customize-inside-control-row input {
2313 + opacity: 0;
2314 +}
1685 2315
1686 - white-space: normal;
2316 +.pix_customizer_setting .customize-inside-control-row input:checked + label .preview__letter--checked {
2317 + display: inline-block;
2318 + vertical-align: middle;
1687 2319 }
1688 2320
1689 -@media screen and (max-width: 768px)
1690 -{
1691 - [data-balloon][data-balloon-length='xlarge']::before
1692 - {
1693 - width: 90vw;
2321 +.pix_customizer_setting .customize-inside-control-row input:checked + label .preview__letter {
2322 + display: none;
2323 +}
1694 2324
1695 - white-space: normal;
1696 - }
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;
1697 2342 }
1698 2343
1699 -[data-balloon][data-balloon-length='fit']::before
1700 -{
1701 - width: 100%;
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;
2356 +}
1702 2357
1703 - white-space: normal;
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;
1704 2366 }
1705 2367
1706 -.font-options__wrapper .font-options__options-list
1707 -{
1708 - border-color: #b8daeb;
1709 - box-shadow: 0 10px 20px 0 rgba(0, 0, 0, .15);
2368 +.pix_customizer_setting .customize-inside-control-row .palette__item:nth-child(1) {
2369 + -webkit-transition-delay: 0s;
2370 + transition-delay: 0s;
1710 2371 }
1711 2372
1712 -.font-options__wrapper .font-options__option
1713 -{
1714 - margin-bottom: 12px;
2373 +.pix_customizer_setting .customize-inside-control-row .palette__item:nth-child(2) {
2374 + -webkit-transition-delay: 0.05s;
2375 + transition-delay: 0.05s;
1715 2376 }
1716 -.font-options__wrapper .font-options__option label
1717 -{
1718 - display: block;
1719 2377
1720 - margin-bottom: 6px;
2378 +.pix_customizer_setting .customize-inside-control-row .palette__item:nth-child(3) {
2379 + -webkit-transition-delay: 0.1s;
2380 + transition-delay: 0.1s;
1721 2381 }
1722 2382
1723 -.font-options__wrapper [type=checkbox]:checked ~ .font-options__options-list
1724 -{
1725 - display: block;
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 +}
1726 2387
1727 - opacity: 1;
2388 +.pix_customizer_setting .customize-inside-control-row .palette__item:nth-child(5) {
2389 + -webkit-transition-delay: 0.2s;
2390 + transition-delay: 0.2s;
1728 2391 }
1729 2392
1730 -input.customify_font_tooltip
1731 -{
1732 - display: none;
2393 +.pix_customizer_setting .customize-inside-control-row .palette__item:nth-child(6) {
2394 + -webkit-transition-delay: 0.25s;
2395 + transition-delay: 0.25s;
1733 2396 }
1734 2397
1735 -ul.font-options__options-list .select2-container
1736 -{
1737 - width: 100% !important;
2398 +.pix_customizer_setting .customize-inside-control-row .palette__item:nth-child(7) {
2399 + -webkit-transition-delay: 0.3s;
2400 + transition-delay: 0.3s;
1738 2401 }
1739 -ul.font-options__options-list .select2-container .select2-selection--single
1740 -{
1741 - -webkit-appearance: initial;
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;
1742 2406 }
1743 -ul.font-options__options-list .select2-container .select2-selection--single .select2-selection__arrow
1744 -{
1745 - display: none;
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;
1746 2411 }
1747 2412
1748 -ul.font-options__options-list .select2-container--default .select2-selection--single .select2-selection__rendered
1749 -{
1750 - line-height: initial;
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 +}
1751 2417
1752 - color: inherit;
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;
1753 2433 }
1754 2434
1755 -.select2-container.select2-container--open
1756 -{
1757 - z-index: 99999999;
2435 +.pix_customizer_setting .customize-inside-control-row .preview__letter--checked {
2436 + display: none;
1758 2437 }
1759 2438
1760 -#customize-theme-controls .select2-container
1761 -{
1762 - width: 100% !important;
2439 +[id*="sm_current_color_palette_control"] .customize-inside-control-row .palette__item[class] {
2440 + -webkit-transform: none;
2441 + transform: none;
1763 2442 }
1764 -#customize-theme-controls .select2-container .select2-selection--multiple
1765 -{
1766 - height: auto;
1767 - padding: 4px 8px 4px;
1768 2443
1769 - background: none;
2444 +[id*="sm_current_color_palette_control"] .variation-control {
2445 + display: -webkit-box;
2446 + display: -ms-flexbox;
2447 + display: flex;
2448 +}
1770 2449
1771 - -webkit-appearance: initial;
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);
1772 2458 }
1773 -#customize-theme-controls .select2-container .select2-selection--multiple .select2-selection__arrow
1774 -{
1775 - display: none;
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);
1776 2472 }
1777 -#customize-theme-controls .select2-container .select2-selection--multiple .select2-selection__rendered
1778 -{
1779 - display: -ms-flexbox;
1780 - display: flex;
1781 2473
1782 - padding: 0;
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;
1783 2486 }
1784 -#customize-theme-controls .select2-container .select2-selection--multiple .select2-selection__rendered .select2-search--inline
1785 -{
1786 - -ms-flex: 1;
1787 - flex: 1;
2487 +
2488 +.picker:before,
2489 +.picker:after {
2490 + content: "";
2491 + display: block;
2492 + background: currentColor;
2493 + border-radius: 50%;
1788 2494 }
1789 -#customize-theme-controls .select2-container .select2-selection--multiple .select2-selection__rendered .select2-search--inline .select2-search__field[class]
1790 -{
1791 - min-width: 100%;
1792 - margin-top: 3px !important;
1793 2495
1794 - border-width: 0;
2496 +.picker:before {
2497 + padding-top: 100%;
1795 2498 }
1796 -#customize-theme-controls .select2-container .select2-selection--multiple .select2-selection__rendered .select2-selection__choice
1797 -{
1798 - margin-top: 0;
1799 - margin-right: 6px;
1800 - padding: 3px 7px;
1801 2499
1802 - border-color: #e0e8ef;
1803 - background-color: #f6fbff;
2500 +.picker:after {
2501 + position: absolute;
2502 + top: 0;
2503 + left: 0;
2504 + width: 100%;
2505 + height: 100%;
1804 2506 }
1805 -#customize-theme-controls .select2-container .select2-search--inline .select2-search__field
1806 -{
1807 - min-width: 9em;
1808 - height: 29px;
1809 - margin-top: 0;
2507 +
2508 +.fill {
2509 + overflow: hidden;
1810 2510 }
1811 2511
1812 -.select2-container--default .select2-results__option[aria-selected=true][class]
1813 -{
1814 - pointer-events: none;
2512 +.color:first-child .fill {
2513 + border-top-left-radius: 5px;
2514 + border-bottom-left-radius: 5px;
2515 +}
1815 2516
1816 - opacity: .3;
1817 - background: transparent;
2517 +.color:last-child .fill {
2518 + border-top-right-radius: 5px;
2519 + border-bottom-right-radius: 5px;
1818 2520 }
1819 2521
1820 -.select2-container .select2-dropdown
1821 -{
1822 - border-color: #e0e8ef;
2522 +.label {
2523 + margin-right: auto;
1823 2524 }
1824 2525
1825 -#customize-theme-controls .widget-content .accordion-container
1826 -{
1827 - margin-top: 20px;
1828 - margin-right: -10px;
1829 - margin-bottom: 10px;
1830 - margin-left: -10px;
2526 +#customize-theme-controls [id*="sm_current_color_palette_control"] {
2527 + display: block;
2528 + width: auto;
1831 2529 }
1832 -#customize-theme-controls .widget-content .accordion-container .accordion-section .accordion-section-content
1833 -{
1834 - position: relative;
1835 - left: 0;
1836 2530
1837 - overflow: hidden;
2531 +#customize-theme-controls [id*="sm_current_color_palette_control"] .color-palette-container {
2532 + background: white;
2533 +}
1838 2534
1839 - max-height: 0;
1840 - padding-top: 0;
1841 - padding-bottom: 0;
2535 +#customize-theme-controls [id*="sm_current_color_palette_control"] .color-palette-container .description {
2536 + margin-bottom: 15px;
2537 +}
1842 2538
1843 - transition: all .4s ease;
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 +}
1844 2545
1845 - color: #416b7e;
2546 +.c-color-palette__fields {
2547 + position: relative;
1846 2548 }
1847 -#customize-theme-controls .widget-content .accordion-container .accordion-section .accordion-section-content p:first-child
1848 -{
1849 - margin-top: 0;
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;
1850 2559 }
1851 -#customize-theme-controls .widget-content .accordion-container .accordion-section .accordion-section-content p:last-child
1852 -{
1853 - margin-bottom: 0;
2560 +
2561 +.c-color-palette .iris-picker .iris-square-handle {
2562 + border-color: transparent;
2563 + left: -6px;
2564 + top: -6px;
1854 2565 }
1855 -#customize-theme-controls .widget-content .accordion-container .accordion-section .accordion-section-title
1856 -{
1857 - color: #39474d;
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;
1858 2574 }
1859 -#customize-theme-controls .widget-content .accordion-container .accordion-section .accordion-section-title:after
1860 -{
1861 - content: '\f142';
1862 - -webkit-transform: rotate(180deg);
1863 - transform: rotate(180deg);
2575 +
2576 +.c-color-palette .iris-picker .iris-square-value {
2577 + -webkit-box-shadow: none !important;
2578 + box-shadow: none !important;
1864 2579 }
1865 -#customize-theme-controls .widget-content .accordion-container .accordion-section.open
1866 -{
1867 - border-bottom: none;
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;
1868 2593 }
1869 -#customize-theme-controls .widget-content .accordion-container .accordion-section.open .accordion-section-content
1870 -{
1871 - max-height: 100%;
1872 - padding-top: 17px;
1873 - padding-bottom: 17px;
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);
1874 2611 }
1875 -#customize-theme-controls .widget-content .accordion-container .accordion-section.open .accordion-section-title
1876 -{
1877 - border-bottom: 1px solid;
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);
1878 2624 }
1879 -#customize-theme-controls .widget-content .accordion-container .accordion-section.open .accordion-section-title:after
1880 -{
1881 - -webkit-transform: rotate(0deg);
1882 - transform: rotate(0deg);
2625 +
2626 +.color.hidden .picker {
2627 + opacity: 0;
2628 + -webkit-transition: opacity .2s ease-out;
2629 + transition: opacity .2s ease-out;
1883 2630 }
1884 -#customize-theme-controls .widget-content .accordion-container label.customize-control-title,
1885 -#customize-theme-controls .widget-content .accordion-container label.separator.label
1886 -{
1887 - cursor: default;
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;
1888 2636 }
1889 2637
1890 -.widget .widget-content > p input[type=checkbox],
1891 -.widget .widget-content > p input[type=radio]
1892 -{
1893 - margin-top: 3px;
1894 - margin-bottom: 3px;
2638 +.color.inactive .picker {
2639 + opacity: 0.2;
1895 2640 }
1896 2641
1897 -.widget .widget-content small
1898 -{
1899 - display: block;
2642 +.color.inactive .picker:hover {
2643 + opacity: 1;
2644 +}
1900 2645
1901 - margin-top: 5px;
2646 +input.c-color-palette__input[class] {
2647 + margin-top: 1em;
1902 2648 }
1903 2649
1904 -#available-widgets [class*=pixelgrade] .widget .widget-title:before,
1905 -#available-widgets [class*=featured-posts] .widget .widget-title:before,
1906 -#available-widgets [class*=categories-image-grid] .widget .widget-title:before
1907 -{
1908 - content: '\f538';
2650 +#customize-control-sm_toggle_advanced_settings_control {
2651 + margin-bottom: 0;
2652 + opacity: 0;
2653 +}
1909 2654
1910 - color: #9660c6;
2655 +#customize-control-sm_toggle_advanced_settings_control button {
2656 + width: 100%;
1911 2657 }
1912 2658
1913 -#available-widgets [class*=pixelgrade-featured-posts-slideshow] .widget .widget-title:before
1914 -{
1915 - content: '\f233';
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% {
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 + }
1916 2691 }
1917 2692
1918 -#available-widgets [class*=pixelgrade-featured-posts-carousel] .widget .widget-title:before
1919 -{
1920 - content: '\f169';
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 + }
1921 2725 }
1922 2726
1923 -#available-widgets [class*=featured-posts-grid] .widget .widget-title:before
1924 -{
1925 - content: '\f180';
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;
1926 2730 }
1927 2731
1928 -#available-widgets [class*=featured-posts-list] .widget .widget-title:before
1929 -{
1930 - content: '\f164';
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;
1931 2742 }
1932 2743
1933 -#available-widgets [class*=categories-image-grid] .widget .widget-title:before
1934 -{
1935 - content: '\f163';
2744 +#customize-theme-controls li#accordion-panel-style_manager_panel h3.accordion-section-title:before {
2745 + font-size: 18px;
2746 + color: #f8bc30;
1936 2747 }
1937 2748
1938 -#available-widgets [class*=pixelgrade-promo-box] .widget .widget-title:before
1939 -{
1940 - content: '\f488';
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;
1941 2759 }
1942 2760
1943 -.wp-customizer .widget-conditional .condition-control:after
1944 -{
1945 - display: table;
1946 - clear: both;
2761 +#customize-theme-controls li#accordion-section-sm_color_palettes_section h3.accordion-section-title {
2762 + border-top: none;
2763 +}
1947 2764
1948 - content: ' ';
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;
1949 2775 }
1950 2776
1951 -.wp-customizer .widget-conditional .selection
1952 -{
1953 - margin-right: 0;
1954 - margin-bottom: 10px;
1955 - margin-left: 0;
1956 - padding-right: 50px;
1957 - padding-bottom: 19px;
1958 - padding-left: 28px;
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;
2782 +}
1959 2783
1960 - border-bottom: 1px solid #cbcfd4;
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;
1961 2794 }
1962 2795
1963 -.wp-customizer .widget-conditional .condition:last-child .selection
1964 -{
1965 - border: 0;
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;
1966 2801 }
1967 2802
1968 -.wp-customizer .widget-conditional select
1969 -{
1970 - width: 170px;
1971 - max-width: 100%;
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;
1972 2816 }
1973 2817
1974 -.wp-customizer .widget-conditional .condition-top select
1975 -{
1976 - width: 130px;
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;
1977 2833 }
1978 2834
1979 -.pix_customizer_setting .customize-inside-control-row
1980 -{
1981 - position: relative;
2835 +.color.altered .disc {
2836 + opacity: 1;
2837 +}
1982 2838
1983 - overflow: hidden;
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;
2844 +}
1984 2845
1985 - width: 100% !important;
1986 - height: 64px;
1987 - margin-left: 0 !important;
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;
2853 +}
1988 2854
1989 - text-indent: 0 !important;
2855 +.customize-control-color .wp-picker-container .iris-picker .iris-palette:after {
2856 + content: "";
2857 + display: block;
2858 + padding-top: 100%;
2859 +}
1990 2860
1991 - border-radius: 5px;
1992 - background-position: 50% 50%;
1993 - background-size: cover;
2861 +.c-color-palette {
2862 + padding: 30px 20px 18px;
1994 2863 }
1995 -.pix_customizer_setting .customize-inside-control-row:before
1996 -{
1997 - position: absolute;
1998 - z-index: 10;
1999 - top: 0;
2000 - right: 0;
2001 - bottom: 0;
2002 - left: 0;
2003 2864
2004 - content: '';
2005 - pointer-events: none;
2865 +[id="customize-control-sm_current_color_palette_control"][id] {
2866 + margin-bottom: 0;
2867 +}
2006 2868
2007 - box-shadow: inset 0 0 3px 0 rgba(0, 0, 0, .15), inset 0 1px 3px 0 rgba(0, 0, 0, .15);
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;
2008 2873 }
2009 -.pix_customizer_setting .customize-inside-control-row:hover:before
2010 -{
2011 - box-shadow: inset 0 2px 3px 0 rgba(0, 0, 0, .15), inset 0 0 3px 0 rgba(0, 0, 0, .15);
2874 +
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;
2012 2879 }
2013 -.pix_customizer_setting .customize-inside-control-row:hover .palette__item
2014 -{
2015 - -webkit-transform: translateY(0%);
2016 - transform: translateY(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;
2017 2888 }
2018 -.pix_customizer_setting .customize-inside-control-row:hover label
2019 -{
2020 - left: 10px;
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;
2021 2899 }
2022 -.pix_customizer_setting .customize-inside-control-row input
2023 -{
2024 - opacity: 0;
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;
2025 2909 }
2026 -.pix_customizer_setting .customize-inside-control-row label
2027 -{
2028 - position: absolute;
2029 - z-index: 2;
2030 - top: 0;
2031 - left: 0;
2032 2910
2033 - display: -ms-flexbox;
2034 - display: flex;
2911 +.sm_color_matrix > * > :nth-child(1) {
2912 + grid-area: 16 / 12 / span 12 / span 12;
2913 +}
2035 2914
2036 - width: 100%;
2037 - height: 100%;
2038 - margin-top: 0 !important;
2039 - padding: 0 10px;
2915 +.sm_color_matrix > * > :nth-child(2) {
2916 + grid-area: 26 / 24 / span 4 / span 4;
2917 +}
2040 2918
2041 - transition: all .3s ease;
2919 +.sm_color_matrix > * > :nth-child(3) {
2920 + grid-area: 13 / 24 / span 4 / span 4;
2921 +}
2042 2922
2043 - -ms-flex-align: center;
2044 - align-items: center;
2923 +.sm_color_matrix > * > :nth-child(4) {
2924 + grid-area: 8 / 8 / span 8 / span 8;
2045 2925 }
2046 -.pix_customizer_setting .customize-inside-control-row .label__inner
2047 -{
2048 - z-index: 2;
2049 2926
2050 - padding: 7px 12px 7px 7px;
2927 +.sm_color_matrix > * > :nth-child(5) {
2928 + grid-area: 32 / 8 / span 4 / span 4;
2929 +}
2051 2930
2052 - border-radius: 3px;
2053 - box-shadow: 0 2px 5px rgba(0, 0, 0, .15);
2931 +.sm_color_matrix > * > :nth-child(6) {
2932 + grid-area: 30 / 16 / span 8 / span 8;
2054 2933 }
2055 -.pix_customizer_setting .customize-inside-control-row .palette
2056 -{
2057 - position: absolute;
2058 - z-index: 1;
2059 - top: 0;
2060 - left: 0;
2061 2934
2062 - display: -ms-flexbox;
2063 - display: flex;
2935 +.sm_color_matrix > * > :nth-child(7) {
2936 + grid-area: 4 / 20 / span 8 / span 8;
2937 +}
2064 2938
2065 - width: 100%;
2066 - height: 100%;
2939 +.sm_color_matrix > * > :nth-child(8) {
2940 + grid-area: 17 / 26 / span 8 / span 8;
2941 +}
2067 2942
2068 - transition: all .2s ease;
2943 +.sm_color_matrix > * > :nth-child(9) {
2944 + grid-area: 22 / 2 / span 8 / span 8;
2069 2945 }
2070 -.pix_customizer_setting .customize-inside-control-row .palette__item
2071 -{
2072 - transition: all .3s ease;
2073 - -webkit-transform: translateY(100%);
2074 - transform: translateY(100%);
2075 2946
2076 - -ms-flex: 1;
2077 - flex: 1;
2947 +.sm_color_matrix > * > :nth-child(10) {
2948 + grid-area: 28 / 11 / span 2 / span 2;
2078 2949 }
2079 -.pix_customizer_setting .customize-inside-control-row .palette__item:nth-child(1)
2080 -{
2081 - transition-delay: 0s;
2950 +
2951 +.sm_color_matrix > * > :nth-child(11) {
2952 + grid-area: 9 / 31 / span 6 / span 6;
2082 2953 }
2083 -.pix_customizer_setting .customize-inside-control-row .palette__item:nth-child(2)
2084 -{
2085 - transition-delay: .05s;
2954 +
2955 +.sm_color_matrix > * > :nth-child(11) {
2956 + grid-area: 26 / 30 / span 9 / span 9;
2086 2957 }
2087 -.pix_customizer_setting .customize-inside-control-row .palette__item:nth-child(3)
2088 -{
2089 - transition-delay: .1s;
2958 +
2959 +.sm_color_matrix > * > :nth-child(12) {
2960 + grid-area: 17 / 7 / span 4 / span 4;
2090 2961 }
2091 -.pix_customizer_setting .customize-inside-control-row .palette__item:nth-child(4)
2092 -{
2093 - transition-delay: .15s;
2962 +
2963 +.sm_color_matrix > * > :nth-child(13) {
2964 + grid-area: 19 / 36 / span 6 / span 6;
2094 2965 }
2095 -.pix_customizer_setting .customize-inside-control-row .palette__item:nth-child(5)
2096 -{
2097 - transition-delay: .2s;
2966 +
2967 +.sm_color_matrix > * > :nth-child(14) {
2968 + grid-area: 12 / 18 / span 2 / span 2;
2098 2969 }
2099 -.pix_customizer_setting .customize-inside-control-row .palette__item:nth-child(6)
2100 -{
2101 - transition-delay: .25s;
2970 +
2971 +.sm_color_matrix > * > :nth-child(n+15) {
2972 + display: none;
2102 2973 }
2103 -.pix_customizer_setting .customize-inside-control-row .palette__item:nth-child(7)
2104 -{
2105 - transition-delay: .3s;
2974 +
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;
2106 2985 }
2107 -.pix_customizer_setting .customize-inside-control-row .palette__item:nth-child(8)
2108 -{
2109 - transition-delay: .35s;
2986 +
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;
2110 2999 }
2111 -.pix_customizer_setting .customize-inside-control-row .palette__item:nth-child(9)
2112 -{
2113 - transition-delay: .4s;
3000 +
3001 +.sm-tabs__item:not(.sm-tabs__item--active):hover {
3002 + color: #2A3B44;
3003 + border-bottom-color: #E2E4E7;
3004 + opacity: 1;
2114 3005 }
2115 -.pix_customizer_setting .customize-inside-control-row .palette__item:nth-child(10)
2116 -{
2117 - transition-delay: .45s;
3006 +
3007 +.sm-tabs__item--active {
3008 + color: #2A3B44;
3009 + border-bottom-color: #57ABD5;
3010 + opacity: 1;
2118 3011 }
2119 -.pix_customizer_setting .customize-inside-control-row .preview__letter
2120 -{
2121 - display: inline-block;
2122 3012
2123 - margin-right: 5px;
2124 - padding: 3px 9px;
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;
3023 +}
2125 3024
2126 - color: white;
2127 - border-radius: 2px;
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;
3034 +}
3035 +
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;
3041 +}
3042 +
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;
2128 3245 }