blob: a26dc18b2e87d36ab9f854e3ba73121373a7ce40 [file] [log] [blame]
Copybara botbe50d492023-11-30 00:16:42 +01001/**
2 * Copyright 2015 Google Inc. All Rights Reserved.
3 *
4 * Licensed under the Apache License, Version 2.0 (the "License");
5 * you may not use this file except in compliance with the License.
6 * You may obtain a copy of the License at
7 *
8 * http://www.apache.org/licenses/LICENSE-2.0
9 *
10 * Unless required by applicable law or agreed to in writing, software
11 * distributed under the License is distributed on an "AS IS" BASIS,
12 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
13 * See the License for the specific language governing permissions and
14 * limitations under the License.
15 */
16
17/*------------------------------------* $CONTENTS
18\*------------------------------------*/
19
20/**
21 * STYLE GUIDE VARIABLES------------------Declarations of Sass variables
22 * -----Typography
23 * -----Colors
24 * -----Textfield
25 * -----Switch
26 * -----Spinner
27 * -----Radio
28 * -----Menu
29 * -----List
30 * -----Layout
31 * -----Icon toggles
32 * -----Footer
33 * -----Column
34 * -----Checkbox
35 * -----Card
36 * -----Button
37 * -----Animation
38 * -----Progress
39 * -----Badge
40 * -----Shadows
41 * -----Grid
42 * -----Data table
43 * -----Dialog
44 * -----Snackbar
45 * -----Tooltip
46 * -----Chip
47 *
48 * Even though all variables have the `!default` directive, most of them
49 * should not be changed as they are dependent one another. This can cause
50 * visual distortions (like alignment issues) that are hard to track down
51 * and fix.
52 */
53
54/* ========== TYPOGRAPHY ========== */
55
56/* We're splitting fonts into "preferred" and "performance" in order to optimize
57 page loading. For important text, such as the body, we want it to load
58 immediately and not wait for the web font load, whereas for other sections,
59 such as headers and titles, we're OK with things taking a bit longer to load.
60 We do have some optional classes and parameters in the mixins, in case you
61 definitely want to make sure you're using the preferred font and don't mind
62 the performance hit.
63 We should be able to improve on this once CSS Font Loading L3 becomes more
64 widely available.
65*/
66
67/* ========== COLORS ========== */
68
69/**
70*
71* Material design color palettes.
72* @see http://www.google.com/design/spec/style/color.html
73*
74**/
75
76/**
77 * Copyright 2015 Google Inc. All Rights Reserved.
78 *
79 * Licensed under the Apache License, Version 2.0 (the "License");
80 * you may not use this file except in compliance with the License.
81 * You may obtain a copy of the License at
82 *
83 * http://www.apache.org/licenses/LICENSE-2.0
84 *
85 * Unless required by applicable law or agreed to in writing, software
86 * distributed under the License is distributed on an "AS IS" BASIS,
87 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
88 * See the License for the specific language governing permissions and
89 * limitations under the License.
90 */
91
92/* ========== Color Palettes ========== */
93
94/* colors.scss */
95
96/**
97 * Copyright 2015 Google Inc. All Rights Reserved.
98 *
99 * Licensed under the Apache License, Version 2.0 (the "License");
100 * you may not use this file except in compliance with the License.
101 * You may obtain a copy of the License at
102 *
103 * http://www.apache.org/licenses/LICENSE-2.0
104 *
105 * Unless required by applicable law or agreed to in writing, software
106 * distributed under the License is distributed on an "AS IS" BASIS,
107 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
108 * See the License for the specific language governing permissions and
109 * limitations under the License.
110 */
111
112/* ========== IMAGES ========== */
113
114/* ========== Color & Themes ========== */
115
116/* ========== Typography ========== */
117
118/* ========== Components ========== */
119
120/* ========== Standard Buttons ========== */
121
122/* ========== Icon Toggles ========== */
123
124/* ========== Radio Buttons ========== */
125
126/* ========== Ripple effect ========== */
127
128/* ========== Layout ========== */
129
130/* ========== Content Tabs ========== */
131
132/* ========== Checkboxes ========== */
133
134/* ========== Switches ========== */
135
136/* ========== Spinner ========== */
137
138/* ========== Text fields ========== */
139
140/* ========== Card ========== */
141
142/* ========== Sliders ========== */
143
144/* ========== Progress ========== */
145
146/* ========== List ========== */
147
148/* ========== Item ========== */
149
150/* ========== Dropdown menu ========== */
151
152/* ========== Tooltips ========== */
153
154/* ========== Footer ========== */
155
156/* TEXTFIELD */
157
158/* SWITCH */
159
160/* SPINNER */
161
162/* RADIO */
163
164/* MENU */
165
166/* LIST */
167
168/* LAYOUT */
169
170/* ICON TOGGLE */
171
172/* FOOTER */
173
174/*mega-footer*/
175
176/*mini-footer*/
177
178/* CHECKBOX */
179
180/* CARD */
181
182/* Card dimensions */
183
184/* Cover image */
185
186/* BUTTON */
187
188/**
189 *
190 * Dimensions
191 *
192 */
193
194/* ANIMATION */
195
196/* PROGRESS */
197
198/* BADGE */
199
200/* SHADOWS */
201
202/* GRID */
203
204/* DATA TABLE */
205
206/* DIALOG */
207
208/* SNACKBAR */
209
210/* TOOLTIP */
211
212/* CHIP */
213
214/**
215 * Copyright 2015 Google Inc. All Rights Reserved.
216 *
217 * Licensed under the Apache License, Version 2.0 (the "License");
218 * you may not use this file except in compliance with the License.
219 * You may obtain a copy of the License at
220 *
221 * http://www.apache.org/licenses/LICENSE-2.0
222 *
223 * Unless required by applicable law or agreed to in writing, software
224 * distributed under the License is distributed on an "AS IS" BASIS,
225 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
226 * See the License for the specific language governing permissions and
227 * limitations under the License.
228 */
229
230/* Typography */
231
232/* Shadows */
233
234/* Animations */
235
236/* Dialog */
237
238/**
239 * Copyright 2016 Leif Olsen. All Rights Reserved.
240 *
241 * Licensed under the Apache License, Version 2.0 (the "License");
242 * you may not use this file except in compliance with the License.
243 * You may obtain a copy of the License at
244 *
245 * http://www.apache.org/licenses/LICENSE-2.0
246 *
247 * Unless required by applicable law or agreed to in writing, software
248 * distributed under the License is distributed on an "AS IS" BASIS,
249 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
250 * See the License for the specific language governing permissions and
251 * limitations under the License.
252 */
253
254/* stylelint-disable */
255
256/* stylelint-enable */
257
258/* ========== Sticky Header ========== */
259
260/* stylelint-disable */
261
262/* stylelint-enable */
263
264/* ========== Accordion ========== */
265
266/* ========== Dialog ========== */
267
268/* ========== Lightbox ========== */
269
270/* ========== Lightboard ========== */
271
272/* ========== Carousel ========== */
273
274/* ========== Bordered fields ========== */
275
276/* ========== Color Themes ========== */
277
278/* stylelint-disable */
279
280/* stylelint-enable */
281
282/* stylelint-disable */
283
284/* stylelint-enable */
285
286/**
287 * @license
288 * Copyright 2016-2017 Leif Olsen. All Rights Reserved.
289 *
290 * Licensed under the Apache License, Version 2.0 (the "License");
291 * you may not use this file except in compliance with the License.
292 * You may obtain a copy of the License at
293 *
294 * http://www.apache.org/licenses/LICENSE-2.0
295 *
296 * Unless required by applicable law or agreed to in writing, software
297 * distributed under the License is distributed on an "AS IS" BASIS,
298 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
299 * See the License for the specific language governing permissions and
300 * limitations under the License.
301 *
302 * This code is built with Google Material Design Lite,
303 * which is Licensed under the Apache License, Version 2.0
304 */
305
306/* stylelint-disable */
307
308/* stylelint-enable */
309
310.mdlext-aria-expanded-plus-minus {
311 font-family: inherit;
312 font-weight: inherit;
313 font-style: inherit;
314 font-size: 24px;
315 display: inline-block;
316 width: 1em;
317 height: 1em;
318 line-height: 1;
319 text-transform: none;
320 letter-spacing: normal;
321 word-wrap: normal;
322 white-space: nowrap;
323 direction: ltr;
324 vertical-align: middle;
325 -webkit-font-smoothing: antialiased;
326 -webkit-font-feature-settings: 'liga';
327 text-rendering: optimizeLegibility;
328 -moz-osx-font-smoothing: grayscale;
329 font-feature-settings: 'liga';
330}
331
332.mdlext-aria-expanded-plus-minus::after {
333 content: "+";
334 margin-left: 0;
335}
336
337[aria-expanded='true'] > .mdlext-aria-expanded-plus-minus::after {
338 content: "-";
339 margin-left: 0;
340}
341
342.mdlext-aria-expanded-more-less {
343 font-family: "Material Icons";
344 font-weight: inherit;
345 font-style: inherit;
346 font-size: 24px;
347 display: inline-block;
348 width: 1em;
349 height: 1em;
350 line-height: 1;
351 text-transform: none;
352 letter-spacing: normal;
353 word-wrap: normal;
354 white-space: nowrap;
355 direction: ltr;
356 vertical-align: middle;
357 -webkit-font-smoothing: antialiased;
358 -webkit-font-feature-settings: 'liga';
359 text-rendering: optimizeLegibility;
360 -moz-osx-font-smoothing: grayscale;
361 font-feature-settings: 'liga';
362}
363
364.mdlext-aria-expanded-more-less::after {
365 content: "expand_more";
366 margin-left: 0;
367}
368
369[aria-expanded='true'] > .mdlext-aria-expanded-more-less::after {
370 content: "expand_less";
371 margin-left: 0;
372}
373
374/**
375 * Copyright 2016 Leif Olsen. All Rights Reserved.
376 *
377 * Licensed under the Apache License, Version 2.0 (the "License");
378 * you may not use this file except in compliance with the License.
379 * You may obtain a copy of the License at
380 *
381 * http://www.apache.org/licenses/LICENSE-2.0
382 *
383 * Unless required by applicable law or agreed to in writing, software
384 * distributed under the License is distributed on an "AS IS" BASIS,
385 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
386 * See the License for the specific language governing permissions and
387 * limitations under the License.
388 */
389
390/**
391 * Copyright 2016 Leif Olsen. All Rights Reserved.
392 *
393 * Licensed under the Apache License, Version 2.0 (the "License");
394 * you may not use this file except in compliance with the License.
395 * You may obtain a copy of the License at
396 *
397 * http://www.apache.org/licenses/LICENSE-2.0
398 *
399 * Unless required by applicable law or agreed to in writing, software
400 * distributed under the License is distributed on an "AS IS" BASIS,
401 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
402 * See the License for the specific language governing permissions and
403 * limitations under the License.
404 */
405
406/* stylelint-disable */
407
408/* stylelint-enable */
409
410/* ========== Sticky Header ========== */
411
412/* stylelint-disable */
413
414/* stylelint-enable */
415
416/* ========== Accordion ========== */
417
418/* ========== Dialog ========== */
419
420/* ========== Lightbox ========== */
421
422/* ========== Lightboard ========== */
423
424/* ========== Carousel ========== */
425
426/* ========== Bordered fields ========== */
427
428/* ========== Color Themes ========== */
429
430.mdlext-layout__sticky-header {
431 position: absolute;
432 overflow: visible;
433 background: transparent linear-gradient(to bottom, #3f51b5 0, #3f51b5 100%);
434 transition: 0.1s ease-in-out;
435}
436
437.mdlext-layout__sticky-header.mdlext-is-scroll {
438 background: transparent linear-gradient(to bottom, rgba(63, 81, 181, 0.98) 100%, rgba(63, 81, 181, 0.95) 100%);
439}
440
441*:not(.is-small-screen) .mdlext-layout__sticky-header .mdl-layout__drawer-button {
442 visibility: hidden;
443}
444
445*:not(.is-small-screen) .mdlext-layout__sticky-header .mdl-layout__header-row {
446 padding-left: 16px;
447}
448
449*:not(.mdl-layout--fixed-drawer).has-drawer .mdlext-layout__sticky-header,
450.is-small-screen.has-drawer .mdlext-layout__sticky-header {
451 display: -ms-flexbox;
452 display: flex;
453}
454
455*:not(.mdl-layout--fixed-drawer).has-drawer .mdlext-layout__sticky-header .mdl-layout__drawer-button,
456.is-small-screen.has-drawer .mdlext-layout__sticky-header .mdl-layout__drawer-button {
457 visibility: visible;
458}
459
460*:not(.mdl-layout--fixed-drawer).has-drawer .mdlext-layout__sticky-header .mdl-layout__header-row,
461.is-small-screen.has-drawer .mdlext-layout__sticky-header .mdl-layout__header-row {
462 padding-left: 64px;
463}
464
465/**
466 * Copyright 2015 Google Inc. All Rights Reserved.
467 * Copyright 2016 Leif Olsen. All Rights Reserved.
468 *
469 * Licensed under the Apache License, Version 2.0 (the "License");
470 * you may not use this file except in compliance with the License.
471 * You may obtain a copy of the License at
472 *
473 * http://www.apache.org/licenses/LICENSE-2.0
474 *
475 * Unless required by applicable law or agreed to in writing, software
476 * distributed under the License is distributed on an "AS IS" BASIS,
477 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
478 * See the License for the specific language governing permissions and
479 * limitations under the License.
480 *
481 * SASS based on css from Google Chrome Dialog polyfill, https://github.com/GoogleChrome/dialog-polyfill
482 * @include 'node_modules/dialog-polyfill/dialog-polyfill.css' before using this
483 */
484
485/**
486 * Copyright 2016 Leif Olsen. All Rights Reserved.
487 *
488 * Licensed under the Apache License, Version 2.0 (the "License");
489 * you may not use this file except in compliance with the License.
490 * You may obtain a copy of the License at
491 *
492 * http://www.apache.org/licenses/LICENSE-2.0
493 *
494 * Unless required by applicable law or agreed to in writing, software
495 * distributed under the License is distributed on an "AS IS" BASIS,
496 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
497 * See the License for the specific language governing permissions and
498 * limitations under the License.
499 */
500
501/* stylelint-disable */
502
503/* stylelint-enable */
504
505/* ========== Sticky Header ========== */
506
507/* stylelint-disable */
508
509/* stylelint-enable */
510
511/* ========== Accordion ========== */
512
513/* ========== Dialog ========== */
514
515/* ========== Lightbox ========== */
516
517/* ========== Lightboard ========== */
518
519/* ========== Carousel ========== */
520
521/* ========== Bordered fields ========== */
522
523/* ========== Color Themes ========== */
524
525dialog.mdlext-dialog {
526 position: absolute;
527 border: 0;
528 opacity: 0;
529 padding: 0;
530 background-color: transparent;
531}
532
533dialog.mdlext-dialog[open] {
534 animation: mdlext-open-dialog 0.5s 0.2s forwards;
535}
536
537dialog.mdlext-dialog[open]::-webkit-backdrop {
538 animation: mdlext-darken-backdrop 0.2s forwards;
539}
540
541dialog.mdlext-dialog[open]::backdrop {
542 animation: mdlext-darken-backdrop 0.2s forwards;
543}
544
545dialog.mdlext-dialog[open] + .backdrop {
546 animation: mdlext-darken-backdrop 0.2s forwards;
547}
548
549@keyframes mdlext-darken-backdrop {
550 to {
551 background: rgba(0, 0, 0, 0.86);
552 }
553}
554
555@keyframes mdlext-open-dialog {
556 to {
557 opacity: 1;
558 }
559}
560
561/**
562 * This code is modified from Material Design Lite _grid.sass,
563 * which is Licensed under the Apache License, Version 2.0
564 * Copyright 2015 Google Inc. All Rights Reserved.
565 *
566 * Licensed under the Apache License, Version 2.0 (the "License");
567 * you may not use this file except in compliance with the License.
568 * You may obtain a copy of the License at
569 *
570 * http://www.apache.org/licenses/LICENSE-2.0
571 *
572 * Unless required by applicable law or agreed to in writing, software
573 * distributed under the License is distributed on an "AS IS" BASIS,
574 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
575 * See the License for the specific language governing permissions and
576 * limitations under the License.
577 *
578 */
579
580.mdlext-grid {
581 display: -ms-flexbox;
582 display: flex;
583 -ms-flex-flow: row wrap;
584 flex-flow: row wrap;
585 margin: 0 auto;
586 -ms-flex-align: stretch;
587 align-items: stretch;
588}
589
590.mdlext-grid.mdlext-grid--no-spacing {
591 padding: 0;
592}
593
594.mdlext-cell {
595 box-sizing: border-box;
596}
597
598.mdlext-cell--top {
599 -ms-flex-item-align: start;
600 align-self: flex-start;
601}
602
603.mdlext-cell--middle {
604 -ms-flex-item-align: center;
605 -ms-grid-row-align: center;
606 align-self: center;
607}
608
609.mdlext-cell--bottom {
610 -ms-flex-item-align: end;
611 align-self: flex-end;
612}
613
614.mdlext-cell--stretch {
615 -ms-flex-item-align: stretch;
616 -ms-grid-row-align: stretch;
617 align-self: stretch;
618}
619
620.mdlext-grid.mdlext-grid--no-spacing > .mdlext-cell {
621 margin: 0;
622}
623
624.mdlext-cell--order-1 {
625 -ms-flex-order: 1;
626 order: 1;
627}
628
629.mdlext-cell--order-2 {
630 -ms-flex-order: 2;
631 order: 2;
632}
633
634.mdlext-cell--order-3 {
635 -ms-flex-order: 3;
636 order: 3;
637}
638
639.mdlext-cell--order-4 {
640 -ms-flex-order: 4;
641 order: 4;
642}
643
644.mdlext-cell--order-5 {
645 -ms-flex-order: 5;
646 order: 5;
647}
648
649.mdlext-cell--order-6 {
650 -ms-flex-order: 6;
651 order: 6;
652}
653
654.mdlext-cell--order-7 {
655 -ms-flex-order: 7;
656 order: 7;
657}
658
659.mdlext-cell--order-8 {
660 -ms-flex-order: 8;
661 order: 8;
662}
663
664.mdlext-cell--order-9 {
665 -ms-flex-order: 9;
666 order: 9;
667}
668
669.mdlext-cell--order-10 {
670 -ms-flex-order: 10;
671 order: 10;
672}
673
674.mdlext-cell--order-11 {
675 -ms-flex-order: 11;
676 order: 11;
677}
678
679.mdlext-cell--order-12 {
680 -ms-flex-order: 12;
681 order: 12;
682}
683
684/* stylelint-disable */
685
686@media (max-width: 479px) {
687 /* stylelint-enable */
688
689 .mdlext-grid {
690 padding: 8px;
691 }
692
693 .mdlext-cell {
694 margin: 8px;
695 width: calc(100% - 16px);
696 }
697
698 .mdlext-grid--no-spacing > .mdlext-cell {
699 width: 100%;
700 }
701
702 .mdlext-cell--hide-phone {
703 display: none !important;
704 }
705
706 .mdlext-cell--order-1-phone.mdlext-cell--order-1-phone {
707 -ms-flex-order: 1;
708 order: 1;
709 }
710
711 .mdlext-cell--order-2-phone.mdlext-cell--order-2-phone {
712 -ms-flex-order: 2;
713 order: 2;
714 }
715
716 .mdlext-cell--order-3-phone.mdlext-cell--order-3-phone {
717 -ms-flex-order: 3;
718 order: 3;
719 }
720
721 .mdlext-cell--order-4-phone.mdlext-cell--order-4-phone {
722 -ms-flex-order: 4;
723 order: 4;
724 }
725
726 .mdlext-cell--order-5-phone.mdlext-cell--order-5-phone {
727 -ms-flex-order: 5;
728 order: 5;
729 }
730
731 .mdlext-cell--order-6-phone.mdlext-cell--order-6-phone {
732 -ms-flex-order: 6;
733 order: 6;
734 }
735
736 .mdlext-cell--order-7-phone.mdlext-cell--order-7-phone {
737 -ms-flex-order: 7;
738 order: 7;
739 }
740
741 .mdlext-cell--order-8-phone.mdlext-cell--order-8-phone {
742 -ms-flex-order: 8;
743 order: 8;
744 }
745
746 .mdlext-cell--order-9-phone.mdlext-cell--order-9-phone {
747 -ms-flex-order: 9;
748 order: 9;
749 }
750
751 .mdlext-cell--order-10-phone.mdlext-cell--order-10-phone {
752 -ms-flex-order: 10;
753 order: 10;
754 }
755
756 .mdlext-cell--order-11-phone.mdlext-cell--order-11-phone {
757 -ms-flex-order: 11;
758 order: 11;
759 }
760
761 .mdlext-cell--order-12-phone.mdlext-cell--order-12-phone {
762 -ms-flex-order: 12;
763 order: 12;
764 }
765
766 .mdlext-cell--1-col,
767 .mdlext-cell--1-col-phone.mdlext-cell--1-col-phone {
768 width: calc(25% - 16px);
769 }
770
771 .mdlext-grid--no-spacing > .mdlext-cell--1-col,
772 .mdlext-grid--no-spacing >
773 .mdlext-cell--1-col-phone.mdlext-cell--1-col-phone {
774 width: 25%;
775 }
776
777 .mdlext-cell--2-col,
778 .mdlext-cell--2-col-phone.mdlext-cell--2-col-phone {
779 width: calc(50% - 16px);
780 }
781
782 .mdlext-grid--no-spacing > .mdlext-cell--2-col,
783 .mdlext-grid--no-spacing >
784 .mdlext-cell--2-col-phone.mdlext-cell--2-col-phone {
785 width: 50%;
786 }
787
788 .mdlext-cell--3-col,
789 .mdlext-cell--3-col-phone.mdlext-cell--3-col-phone {
790 width: calc(75% - 16px);
791 }
792
793 .mdlext-grid--no-spacing > .mdlext-cell--3-col,
794 .mdlext-grid--no-spacing >
795 .mdlext-cell--3-col-phone.mdlext-cell--3-col-phone {
796 width: 75%;
797 }
798
799 .mdlext-cell--4-col,
800 .mdlext-cell--4-col-phone.mdlext-cell--4-col-phone {
801 width: calc(100% - 16px);
802 }
803
804 .mdlext-grid--no-spacing > .mdlext-cell--4-col,
805 .mdlext-grid--no-spacing >
806 .mdlext-cell--4-col-phone.mdlext-cell--4-col-phone {
807 width: 100%;
808 }
809
810 .mdlext-cell--5-col,
811 .mdlext-cell--5-col-phone.mdlext-cell--5-col-phone {
812 width: calc(100% - 16px);
813 }
814
815 .mdlext-grid--no-spacing > .mdlext-cell--5-col,
816 .mdlext-grid--no-spacing >
817 .mdlext-cell--5-col-phone.mdlext-cell--5-col-phone {
818 width: 100%;
819 }
820
821 .mdlext-cell--6-col,
822 .mdlext-cell--6-col-phone.mdlext-cell--6-col-phone {
823 width: calc(100% - 16px);
824 }
825
826 .mdlext-grid--no-spacing > .mdlext-cell--6-col,
827 .mdlext-grid--no-spacing >
828 .mdlext-cell--6-col-phone.mdlext-cell--6-col-phone {
829 width: 100%;
830 }
831
832 .mdlext-cell--7-col,
833 .mdlext-cell--7-col-phone.mdlext-cell--7-col-phone {
834 width: calc(100% - 16px);
835 }
836
837 .mdlext-grid--no-spacing > .mdlext-cell--7-col,
838 .mdlext-grid--no-spacing >
839 .mdlext-cell--7-col-phone.mdlext-cell--7-col-phone {
840 width: 100%;
841 }
842
843 .mdlext-cell--8-col,
844 .mdlext-cell--8-col-phone.mdlext-cell--8-col-phone {
845 width: calc(100% - 16px);
846 }
847
848 .mdlext-grid--no-spacing > .mdlext-cell--8-col,
849 .mdlext-grid--no-spacing >
850 .mdlext-cell--8-col-phone.mdlext-cell--8-col-phone {
851 width: 100%;
852 }
853
854 .mdlext-cell--9-col,
855 .mdlext-cell--9-col-phone.mdlext-cell--9-col-phone {
856 width: calc(100% - 16px);
857 }
858
859 .mdlext-grid--no-spacing > .mdlext-cell--9-col,
860 .mdlext-grid--no-spacing >
861 .mdlext-cell--9-col-phone.mdlext-cell--9-col-phone {
862 width: 100%;
863 }
864
865 .mdlext-cell--10-col,
866 .mdlext-cell--10-col-phone.mdlext-cell--10-col-phone {
867 width: calc(100% - 16px);
868 }
869
870 .mdlext-grid--no-spacing > .mdlext-cell--10-col,
871 .mdlext-grid--no-spacing >
872 .mdlext-cell--10-col-phone.mdlext-cell--10-col-phone {
873 width: 100%;
874 }
875
876 .mdlext-cell--11-col,
877 .mdlext-cell--11-col-phone.mdlext-cell--11-col-phone {
878 width: calc(100% - 16px);
879 }
880
881 .mdlext-grid--no-spacing > .mdlext-cell--11-col,
882 .mdlext-grid--no-spacing >
883 .mdlext-cell--11-col-phone.mdlext-cell--11-col-phone {
884 width: 100%;
885 }
886
887 .mdlext-cell--12-col,
888 .mdlext-cell--12-col-phone.mdlext-cell--12-col-phone {
889 width: calc(100% - 16px);
890 }
891
892 .mdlext-grid--no-spacing > .mdlext-cell--12-col,
893 .mdlext-grid--no-spacing >
894 .mdlext-cell--12-col-phone.mdlext-cell--12-col-phone {
895 width: 100%;
896 }
897
898 .mdlext-cell--1-offset,
899 .mdlext-cell--1-offset-phone.mdlext-cell--1-offset-phone {
900 margin-left: calc(25% + 8px);
901 }
902
903 .mdlext-grid.mdlext-grid--no-spacing > .mdlext-cell--1-offset,
904 .mdlext-grid.mdlext-grid--no-spacing >
905 .mdlext-cell--1-offset-phone.mdlext-cell--1-offset-phone {
906 margin-left: 25%;
907 }
908
909 .mdlext-cell--2-offset,
910 .mdlext-cell--2-offset-phone.mdlext-cell--2-offset-phone {
911 margin-left: calc(50% + 8px);
912 }
913
914 .mdlext-grid.mdlext-grid--no-spacing > .mdlext-cell--2-offset,
915 .mdlext-grid.mdlext-grid--no-spacing >
916 .mdlext-cell--2-offset-phone.mdlext-cell--2-offset-phone {
917 margin-left: 50%;
918 }
919
920 .mdlext-cell--3-offset,
921 .mdlext-cell--3-offset-phone.mdlext-cell--3-offset-phone {
922 margin-left: calc(75% + 8px);
923 }
924
925 .mdlext-grid.mdlext-grid--no-spacing > .mdlext-cell--3-offset,
926 .mdlext-grid.mdlext-grid--no-spacing >
927 .mdlext-cell--3-offset-phone.mdlext-cell--3-offset-phone {
928 margin-left: 75%;
929 }
930}
931
932/* stylelint-disable */
933
934@media (min-width: 480px) and (max-width: 839px) {
935 /* stylelint-enable */
936
937 .mdlext-grid {
938 padding: 8px;
939 }
940
941 .mdlext-cell {
942 margin: 8px;
943 width: calc(50% - 16px);
944 }
945
946 .mdlext-grid--no-spacing > .mdlext-cell {
947 width: 50%;
948 }
949
950 .mdlext-cell--hide-tablet {
951 display: none !important;
952 }
953
954 .mdlext-cell--order-1-tablet.mdlext-cell--order-1-tablet {
955 -ms-flex-order: 1;
956 order: 1;
957 }
958
959 .mdlext-cell--order-2-tablet.mdlext-cell--order-2-tablet {
960 -ms-flex-order: 2;
961 order: 2;
962 }
963
964 .mdlext-cell--order-3-tablet.mdlext-cell--order-3-tablet {
965 -ms-flex-order: 3;
966 order: 3;
967 }
968
969 .mdlext-cell--order-4-tablet.mdlext-cell--order-4-tablet {
970 -ms-flex-order: 4;
971 order: 4;
972 }
973
974 .mdlext-cell--order-5-tablet.mdlext-cell--order-5-tablet {
975 -ms-flex-order: 5;
976 order: 5;
977 }
978
979 .mdlext-cell--order-6-tablet.mdlext-cell--order-6-tablet {
980 -ms-flex-order: 6;
981 order: 6;
982 }
983
984 .mdlext-cell--order-7-tablet.mdlext-cell--order-7-tablet {
985 -ms-flex-order: 7;
986 order: 7;
987 }
988
989 .mdlext-cell--order-8-tablet.mdlext-cell--order-8-tablet {
990 -ms-flex-order: 8;
991 order: 8;
992 }
993
994 .mdlext-cell--order-9-tablet.mdlext-cell--order-9-tablet {
995 -ms-flex-order: 9;
996 order: 9;
997 }
998
999 .mdlext-cell--order-10-tablet.mdlext-cell--order-10-tablet {
1000 -ms-flex-order: 10;
1001 order: 10;
1002 }
1003
1004 .mdlext-cell--order-11-tablet.mdlext-cell--order-11-tablet {
1005 -ms-flex-order: 11;
1006 order: 11;
1007 }
1008
1009 .mdlext-cell--order-12-tablet.mdlext-cell--order-12-tablet {
1010 -ms-flex-order: 12;
1011 order: 12;
1012 }
1013
1014 .mdlext-cell--1-col,
1015 .mdlext-cell--1-col-tablet.mdlext-cell--1-col-tablet {
1016 width: calc(12.5% - 16px);
1017 }
1018
1019 .mdlext-grid--no-spacing > .mdlext-cell--1-col,
1020 .mdlext-grid--no-spacing >
1021 .mdlext-cell--1-col-tablet.mdlext-cell--1-col-tablet {
1022 width: 12.5%;
1023 }
1024
1025 .mdlext-cell--2-col,
1026 .mdlext-cell--2-col-tablet.mdlext-cell--2-col-tablet {
1027 width: calc(25% - 16px);
1028 }
1029
1030 .mdlext-grid--no-spacing > .mdlext-cell--2-col,
1031 .mdlext-grid--no-spacing >
1032 .mdlext-cell--2-col-tablet.mdlext-cell--2-col-tablet {
1033 width: 25%;
1034 }
1035
1036 .mdlext-cell--3-col,
1037 .mdlext-cell--3-col-tablet.mdlext-cell--3-col-tablet {
1038 width: calc(37.5% - 16px);
1039 }
1040
1041 .mdlext-grid--no-spacing > .mdlext-cell--3-col,
1042 .mdlext-grid--no-spacing >
1043 .mdlext-cell--3-col-tablet.mdlext-cell--3-col-tablet {
1044 width: 37.5%;
1045 }
1046
1047 .mdlext-cell--4-col,
1048 .mdlext-cell--4-col-tablet.mdlext-cell--4-col-tablet {
1049 width: calc(50% - 16px);
1050 }
1051
1052 .mdlext-grid--no-spacing > .mdlext-cell--4-col,
1053 .mdlext-grid--no-spacing >
1054 .mdlext-cell--4-col-tablet.mdlext-cell--4-col-tablet {
1055 width: 50%;
1056 }
1057
1058 .mdlext-cell--5-col,
1059 .mdlext-cell--5-col-tablet.mdlext-cell--5-col-tablet {
1060 width: calc(62.5% - 16px);
1061 }
1062
1063 .mdlext-grid--no-spacing > .mdlext-cell--5-col,
1064 .mdlext-grid--no-spacing >
1065 .mdlext-cell--5-col-tablet.mdlext-cell--5-col-tablet {
1066 width: 62.5%;
1067 }
1068
1069 .mdlext-cell--6-col,
1070 .mdlext-cell--6-col-tablet.mdlext-cell--6-col-tablet {
1071 width: calc(75% - 16px);
1072 }
1073
1074 .mdlext-grid--no-spacing > .mdlext-cell--6-col,
1075 .mdlext-grid--no-spacing >
1076 .mdlext-cell--6-col-tablet.mdlext-cell--6-col-tablet {
1077 width: 75%;
1078 }
1079
1080 .mdlext-cell--7-col,
1081 .mdlext-cell--7-col-tablet.mdlext-cell--7-col-tablet {
1082 width: calc(87.5% - 16px);
1083 }
1084
1085 .mdlext-grid--no-spacing > .mdlext-cell--7-col,
1086 .mdlext-grid--no-spacing >
1087 .mdlext-cell--7-col-tablet.mdlext-cell--7-col-tablet {
1088 width: 87.5%;
1089 }
1090
1091 .mdlext-cell--8-col,
1092 .mdlext-cell--8-col-tablet.mdlext-cell--8-col-tablet {
1093 width: calc(100% - 16px);
1094 }
1095
1096 .mdlext-grid--no-spacing > .mdlext-cell--8-col,
1097 .mdlext-grid--no-spacing >
1098 .mdlext-cell--8-col-tablet.mdlext-cell--8-col-tablet {
1099 width: 100%;
1100 }
1101
1102 .mdlext-cell--9-col,
1103 .mdlext-cell--9-col-tablet.mdlext-cell--9-col-tablet {
1104 width: calc(100% - 16px);
1105 }
1106
1107 .mdlext-grid--no-spacing > .mdlext-cell--9-col,
1108 .mdlext-grid--no-spacing >
1109 .mdlext-cell--9-col-tablet.mdlext-cell--9-col-tablet {
1110 width: 100%;
1111 }
1112
1113 .mdlext-cell--10-col,
1114 .mdlext-cell--10-col-tablet.mdlext-cell--10-col-tablet {
1115 width: calc(100% - 16px);
1116 }
1117
1118 .mdlext-grid--no-spacing > .mdlext-cell--10-col,
1119 .mdlext-grid--no-spacing >
1120 .mdlext-cell--10-col-tablet.mdlext-cell--10-col-tablet {
1121 width: 100%;
1122 }
1123
1124 .mdlext-cell--11-col,
1125 .mdlext-cell--11-col-tablet.mdlext-cell--11-col-tablet {
1126 width: calc(100% - 16px);
1127 }
1128
1129 .mdlext-grid--no-spacing > .mdlext-cell--11-col,
1130 .mdlext-grid--no-spacing >
1131 .mdlext-cell--11-col-tablet.mdlext-cell--11-col-tablet {
1132 width: 100%;
1133 }
1134
1135 .mdlext-cell--12-col,
1136 .mdlext-cell--12-col-tablet.mdlext-cell--12-col-tablet {
1137 width: calc(100% - 16px);
1138 }
1139
1140 .mdlext-grid--no-spacing > .mdlext-cell--12-col,
1141 .mdlext-grid--no-spacing >
1142 .mdlext-cell--12-col-tablet.mdlext-cell--12-col-tablet {
1143 width: 100%;
1144 }
1145
1146 .mdlext-cell--1-offset,
1147 .mdlext-cell--1-offset-tablet.mdlext-cell--1-offset-tablet {
1148 margin-left: calc(12.5% + 8px);
1149 }
1150
1151 .mdlext-grid.mdlext-grid--no-spacing > .mdlext-cell--1-offset,
1152 .mdlext-grid.mdlext-grid--no-spacing >
1153 .mdlext-cell--1-offset-tablet.mdlext-cell--1-offset-tablet {
1154 margin-left: 12.5%;
1155 }
1156
1157 .mdlext-cell--2-offset,
1158 .mdlext-cell--2-offset-tablet.mdlext-cell--2-offset-tablet {
1159 margin-left: calc(25% + 8px);
1160 }
1161
1162 .mdlext-grid.mdlext-grid--no-spacing > .mdlext-cell--2-offset,
1163 .mdlext-grid.mdlext-grid--no-spacing >
1164 .mdlext-cell--2-offset-tablet.mdlext-cell--2-offset-tablet {
1165 margin-left: 25%;
1166 }
1167
1168 .mdlext-cell--3-offset,
1169 .mdlext-cell--3-offset-tablet.mdlext-cell--3-offset-tablet {
1170 margin-left: calc(37.5% + 8px);
1171 }
1172
1173 .mdlext-grid.mdlext-grid--no-spacing > .mdlext-cell--3-offset,
1174 .mdlext-grid.mdlext-grid--no-spacing >
1175 .mdlext-cell--3-offset-tablet.mdlext-cell--3-offset-tablet {
1176 margin-left: 37.5%;
1177 }
1178
1179 .mdlext-cell--4-offset,
1180 .mdlext-cell--4-offset-tablet.mdlext-cell--4-offset-tablet {
1181 margin-left: calc(50% + 8px);
1182 }
1183
1184 .mdlext-grid.mdlext-grid--no-spacing > .mdlext-cell--4-offset,
1185 .mdlext-grid.mdlext-grid--no-spacing >
1186 .mdlext-cell--4-offset-tablet.mdlext-cell--4-offset-tablet {
1187 margin-left: 50%;
1188 }
1189
1190 .mdlext-cell--5-offset,
1191 .mdlext-cell--5-offset-tablet.mdlext-cell--5-offset-tablet {
1192 margin-left: calc(62.5% + 8px);
1193 }
1194
1195 .mdlext-grid.mdlext-grid--no-spacing > .mdlext-cell--5-offset,
1196 .mdlext-grid.mdlext-grid--no-spacing >
1197 .mdlext-cell--5-offset-tablet.mdlext-cell--5-offset-tablet {
1198 margin-left: 62.5%;
1199 }
1200
1201 .mdlext-cell--6-offset,
1202 .mdlext-cell--6-offset-tablet.mdlext-cell--6-offset-tablet {
1203 margin-left: calc(75% + 8px);
1204 }
1205
1206 .mdlext-grid.mdlext-grid--no-spacing > .mdlext-cell--6-offset,
1207 .mdlext-grid.mdlext-grid--no-spacing >
1208 .mdlext-cell--6-offset-tablet.mdlext-cell--6-offset-tablet {
1209 margin-left: 75%;
1210 }
1211
1212 .mdlext-cell--7-offset,
1213 .mdlext-cell--7-offset-tablet.mdlext-cell--7-offset-tablet {
1214 margin-left: calc(87.5% + 8px);
1215 }
1216
1217 .mdlext-grid.mdlext-grid--no-spacing > .mdlext-cell--7-offset,
1218 .mdlext-grid.mdlext-grid--no-spacing >
1219 .mdlext-cell--7-offset-tablet.mdlext-cell--7-offset-tablet {
1220 margin-left: 87.5%;
1221 }
1222}
1223
1224@media (min-width: 840px) {
1225 .mdlext-grid {
1226 padding: 8px;
1227 }
1228
1229 .mdlext-cell {
1230 margin: 8px;
1231 width: calc(33.33333% - 16px);
1232 }
1233
1234 .mdlext-grid--no-spacing > .mdlext-cell {
1235 width: 33.33333%;
1236 }
1237
1238 .mdlext-cell--hide-desktop {
1239 display: none !important;
1240 }
1241
1242 .mdlext-cell--order-1-desktop.mdlext-cell--order-1-desktop {
1243 -ms-flex-order: 1;
1244 order: 1;
1245 }
1246
1247 .mdlext-cell--order-2-desktop.mdlext-cell--order-2-desktop {
1248 -ms-flex-order: 2;
1249 order: 2;
1250 }
1251
1252 .mdlext-cell--order-3-desktop.mdlext-cell--order-3-desktop {
1253 -ms-flex-order: 3;
1254 order: 3;
1255 }
1256
1257 .mdlext-cell--order-4-desktop.mdlext-cell--order-4-desktop {
1258 -ms-flex-order: 4;
1259 order: 4;
1260 }
1261
1262 .mdlext-cell--order-5-desktop.mdlext-cell--order-5-desktop {
1263 -ms-flex-order: 5;
1264 order: 5;
1265 }
1266
1267 .mdlext-cell--order-6-desktop.mdlext-cell--order-6-desktop {
1268 -ms-flex-order: 6;
1269 order: 6;
1270 }
1271
1272 .mdlext-cell--order-7-desktop.mdlext-cell--order-7-desktop {
1273 -ms-flex-order: 7;
1274 order: 7;
1275 }
1276
1277 .mdlext-cell--order-8-desktop.mdlext-cell--order-8-desktop {
1278 -ms-flex-order: 8;
1279 order: 8;
1280 }
1281
1282 .mdlext-cell--order-9-desktop.mdlext-cell--order-9-desktop {
1283 -ms-flex-order: 9;
1284 order: 9;
1285 }
1286
1287 .mdlext-cell--order-10-desktop.mdlext-cell--order-10-desktop {
1288 -ms-flex-order: 10;
1289 order: 10;
1290 }
1291
1292 .mdlext-cell--order-11-desktop.mdlext-cell--order-11-desktop {
1293 -ms-flex-order: 11;
1294 order: 11;
1295 }
1296
1297 .mdlext-cell--order-12-desktop.mdlext-cell--order-12-desktop {
1298 -ms-flex-order: 12;
1299 order: 12;
1300 }
1301
1302 .mdlext-cell--1-col,
1303 .mdlext-cell--1-col-desktop.mdlext-cell--1-col-desktop {
1304 width: calc(8.33333% - 16px);
1305 }
1306
1307 .mdlext-grid--no-spacing > .mdlext-cell--1-col,
1308 .mdlext-grid--no-spacing >
1309 .mdlext-cell--1-col-desktop.mdlext-cell--1-col-desktop {
1310 width: 8.33333%;
1311 }
1312
1313 .mdlext-cell--2-col,
1314 .mdlext-cell--2-col-desktop.mdlext-cell--2-col-desktop {
1315 width: calc(16.66667% - 16px);
1316 }
1317
1318 .mdlext-grid--no-spacing > .mdlext-cell--2-col,
1319 .mdlext-grid--no-spacing >
1320 .mdlext-cell--2-col-desktop.mdlext-cell--2-col-desktop {
1321 width: 16.66667%;
1322 }
1323
1324 .mdlext-cell--3-col,
1325 .mdlext-cell--3-col-desktop.mdlext-cell--3-col-desktop {
1326 width: calc(25% - 16px);
1327 }
1328
1329 .mdlext-grid--no-spacing > .mdlext-cell--3-col,
1330 .mdlext-grid--no-spacing >
1331 .mdlext-cell--3-col-desktop.mdlext-cell--3-col-desktop {
1332 width: 25%;
1333 }
1334
1335 .mdlext-cell--4-col,
1336 .mdlext-cell--4-col-desktop.mdlext-cell--4-col-desktop {
1337 width: calc(33.33333% - 16px);
1338 }
1339
1340 .mdlext-grid--no-spacing > .mdlext-cell--4-col,
1341 .mdlext-grid--no-spacing >
1342 .mdlext-cell--4-col-desktop.mdlext-cell--4-col-desktop {
1343 width: 33.33333%;
1344 }
1345
1346 .mdlext-cell--5-col,
1347 .mdlext-cell--5-col-desktop.mdlext-cell--5-col-desktop {
1348 width: calc(41.66667% - 16px);
1349 }
1350
1351 .mdlext-grid--no-spacing > .mdlext-cell--5-col,
1352 .mdlext-grid--no-spacing >
1353 .mdlext-cell--5-col-desktop.mdlext-cell--5-col-desktop {
1354 width: 41.66667%;
1355 }
1356
1357 .mdlext-cell--6-col,
1358 .mdlext-cell--6-col-desktop.mdlext-cell--6-col-desktop {
1359 width: calc(50% - 16px);
1360 }
1361
1362 .mdlext-grid--no-spacing > .mdlext-cell--6-col,
1363 .mdlext-grid--no-spacing >
1364 .mdlext-cell--6-col-desktop.mdlext-cell--6-col-desktop {
1365 width: 50%;
1366 }
1367
1368 .mdlext-cell--7-col,
1369 .mdlext-cell--7-col-desktop.mdlext-cell--7-col-desktop {
1370 width: calc(58.33333% - 16px);
1371 }
1372
1373 .mdlext-grid--no-spacing > .mdlext-cell--7-col,
1374 .mdlext-grid--no-spacing >
1375 .mdlext-cell--7-col-desktop.mdlext-cell--7-col-desktop {
1376 width: 58.33333%;
1377 }
1378
1379 .mdlext-cell--8-col,
1380 .mdlext-cell--8-col-desktop.mdlext-cell--8-col-desktop {
1381 width: calc(66.66667% - 16px);
1382 }
1383
1384 .mdlext-grid--no-spacing > .mdlext-cell--8-col,
1385 .mdlext-grid--no-spacing >
1386 .mdlext-cell--8-col-desktop.mdlext-cell--8-col-desktop {
1387 width: 66.66667%;
1388 }
1389
1390 .mdlext-cell--9-col,
1391 .mdlext-cell--9-col-desktop.mdlext-cell--9-col-desktop {
1392 width: calc(75% - 16px);
1393 }
1394
1395 .mdlext-grid--no-spacing > .mdlext-cell--9-col,
1396 .mdlext-grid--no-spacing >
1397 .mdlext-cell--9-col-desktop.mdlext-cell--9-col-desktop {
1398 width: 75%;
1399 }
1400
1401 .mdlext-cell--10-col,
1402 .mdlext-cell--10-col-desktop.mdlext-cell--10-col-desktop {
1403 width: calc(83.33333% - 16px);
1404 }
1405
1406 .mdlext-grid--no-spacing > .mdlext-cell--10-col,
1407 .mdlext-grid--no-spacing >
1408 .mdlext-cell--10-col-desktop.mdlext-cell--10-col-desktop {
1409 width: 83.33333%;
1410 }
1411
1412 .mdlext-cell--11-col,
1413 .mdlext-cell--11-col-desktop.mdlext-cell--11-col-desktop {
1414 width: calc(91.66667% - 16px);
1415 }
1416
1417 .mdlext-grid--no-spacing > .mdlext-cell--11-col,
1418 .mdlext-grid--no-spacing >
1419 .mdlext-cell--11-col-desktop.mdlext-cell--11-col-desktop {
1420 width: 91.66667%;
1421 }
1422
1423 .mdlext-cell--12-col,
1424 .mdlext-cell--12-col-desktop.mdlext-cell--12-col-desktop {
1425 width: calc(100% - 16px);
1426 }
1427
1428 .mdlext-grid--no-spacing > .mdlext-cell--12-col,
1429 .mdlext-grid--no-spacing >
1430 .mdlext-cell--12-col-desktop.mdlext-cell--12-col-desktop {
1431 width: 100%;
1432 }
1433
1434 .mdlext-cell--1-offset,
1435 .mdlext-cell--1-offset-desktop.mdlext-cell--1-offset-desktop {
1436 margin-left: calc(8.33333% + 8px);
1437 }
1438
1439 .mdlext-grid.mdlext-grid--no-spacing > .mdlext-cell--1-offset,
1440 .mdlext-grid.mdlext-grid--no-spacing >
1441 .mdlext-cell--1-offset-desktop.mdlext-cell--1-offset-desktop {
1442 margin-left: 8.33333%;
1443 }
1444
1445 .mdlext-cell--2-offset,
1446 .mdlext-cell--2-offset-desktop.mdlext-cell--2-offset-desktop {
1447 margin-left: calc(16.66667% + 8px);
1448 }
1449
1450 .mdlext-grid.mdlext-grid--no-spacing > .mdlext-cell--2-offset,
1451 .mdlext-grid.mdlext-grid--no-spacing >
1452 .mdlext-cell--2-offset-desktop.mdlext-cell--2-offset-desktop {
1453 margin-left: 16.66667%;
1454 }
1455
1456 .mdlext-cell--3-offset,
1457 .mdlext-cell--3-offset-desktop.mdlext-cell--3-offset-desktop {
1458 margin-left: calc(25% + 8px);
1459 }
1460
1461 .mdlext-grid.mdlext-grid--no-spacing > .mdlext-cell--3-offset,
1462 .mdlext-grid.mdlext-grid--no-spacing >
1463 .mdlext-cell--3-offset-desktop.mdlext-cell--3-offset-desktop {
1464 margin-left: 25%;
1465 }
1466
1467 .mdlext-cell--4-offset,
1468 .mdlext-cell--4-offset-desktop.mdlext-cell--4-offset-desktop {
1469 margin-left: calc(33.33333% + 8px);
1470 }
1471
1472 .mdlext-grid.mdlext-grid--no-spacing > .mdlext-cell--4-offset,
1473 .mdlext-grid.mdlext-grid--no-spacing >
1474 .mdlext-cell--4-offset-desktop.mdlext-cell--4-offset-desktop {
1475 margin-left: 33.33333%;
1476 }
1477
1478 .mdlext-cell--5-offset,
1479 .mdlext-cell--5-offset-desktop.mdlext-cell--5-offset-desktop {
1480 margin-left: calc(41.66667% + 8px);
1481 }
1482
1483 .mdlext-grid.mdlext-grid--no-spacing > .mdlext-cell--5-offset,
1484 .mdlext-grid.mdlext-grid--no-spacing >
1485 .mdlext-cell--5-offset-desktop.mdlext-cell--5-offset-desktop {
1486 margin-left: 41.66667%;
1487 }
1488
1489 .mdlext-cell--6-offset,
1490 .mdlext-cell--6-offset-desktop.mdlext-cell--6-offset-desktop {
1491 margin-left: calc(50% + 8px);
1492 }
1493
1494 .mdlext-grid.mdlext-grid--no-spacing > .mdlext-cell--6-offset,
1495 .mdlext-grid.mdlext-grid--no-spacing >
1496 .mdlext-cell--6-offset-desktop.mdlext-cell--6-offset-desktop {
1497 margin-left: 50%;
1498 }
1499
1500 .mdlext-cell--7-offset,
1501 .mdlext-cell--7-offset-desktop.mdlext-cell--7-offset-desktop {
1502 margin-left: calc(58.33333% + 8px);
1503 }
1504
1505 .mdlext-grid.mdlext-grid--no-spacing > .mdlext-cell--7-offset,
1506 .mdlext-grid.mdlext-grid--no-spacing >
1507 .mdlext-cell--7-offset-desktop.mdlext-cell--7-offset-desktop {
1508 margin-left: 58.33333%;
1509 }
1510
1511 .mdlext-cell--8-offset,
1512 .mdlext-cell--8-offset-desktop.mdlext-cell--8-offset-desktop {
1513 margin-left: calc(66.66667% + 8px);
1514 }
1515
1516 .mdlext-grid.mdlext-grid--no-spacing > .mdlext-cell--8-offset,
1517 .mdlext-grid.mdlext-grid--no-spacing >
1518 .mdlext-cell--8-offset-desktop.mdlext-cell--8-offset-desktop {
1519 margin-left: 66.66667%;
1520 }
1521
1522 .mdlext-cell--9-offset,
1523 .mdlext-cell--9-offset-desktop.mdlext-cell--9-offset-desktop {
1524 margin-left: calc(75% + 8px);
1525 }
1526
1527 .mdlext-grid.mdlext-grid--no-spacing > .mdlext-cell--9-offset,
1528 .mdlext-grid.mdlext-grid--no-spacing >
1529 .mdlext-cell--9-offset-desktop.mdlext-cell--9-offset-desktop {
1530 margin-left: 75%;
1531 }
1532
1533 .mdlext-cell--10-offset,
1534 .mdlext-cell--10-offset-desktop.mdlext-cell--10-offset-desktop {
1535 margin-left: calc(83.33333% + 8px);
1536 }
1537
1538 .mdlext-grid.mdlext-grid--no-spacing > .mdlext-cell--10-offset,
1539 .mdlext-grid.mdlext-grid--no-spacing >
1540 .mdlext-cell--10-offset-desktop.mdlext-cell--10-offset-desktop {
1541 margin-left: 83.33333%;
1542 }
1543
1544 .mdlext-cell--11-offset,
1545 .mdlext-cell--11-offset-desktop.mdlext-cell--11-offset-desktop {
1546 margin-left: calc(91.66667% + 8px);
1547 }
1548
1549 .mdlext-grid.mdlext-grid--no-spacing > .mdlext-cell--11-offset,
1550 .mdlext-grid.mdlext-grid--no-spacing >
1551 .mdlext-cell--11-offset-desktop.mdlext-cell--11-offset-desktop {
1552 margin-left: 91.66667%;
1553 }
1554}
1555
1556/**
1557 * Copyright 2016 Leif Olsen. All Rights Reserved.
1558 *
1559 * Licensed under the Apache License, Version 2.0 (the "License");
1560 * you may not use this file except in compliance with the License.
1561 * You may obtain a copy of the License at
1562 *
1563 * http://www.apache.org/licenses/LICENSE-2.0
1564 *
1565 * Unless required by applicable law or agreed to in writing, software
1566 * distributed under the License is distributed on an "AS IS" BASIS,
1567 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
1568 * See the License for the specific language governing permissions and
1569 * limitations under the License.
1570 */
1571
1572/*
1573 * A lightboard is a translucent surface illuminated from behind, used for situations
1574 * where a shape laid upon the surface needs to be seen with high contrast. In the "old days" of photography
1575 * photograpers used a lightboard to get a quick view of their slides. The goal is to create a responsive lightbox
1576 * design, based on flex layout, similar to what is used in Adobe LightRoom to browse images.
1577 */
1578
1579/**
1580 * Copyright 2016 Leif Olsen. All Rights Reserved.
1581 *
1582 * Licensed under the Apache License, Version 2.0 (the "License");
1583 * you may not use this file except in compliance with the License.
1584 * You may obtain a copy of the License at
1585 *
1586 * http://www.apache.org/licenses/LICENSE-2.0
1587 *
1588 * Unless required by applicable law or agreed to in writing, software
1589 * distributed under the License is distributed on an "AS IS" BASIS,
1590 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
1591 * See the License for the specific language governing permissions and
1592 * limitations under the License.
1593 */
1594
1595/* stylelint-disable */
1596
1597/* stylelint-enable */
1598
1599/* ========== Sticky Header ========== */
1600
1601/* stylelint-disable */
1602
1603/* stylelint-enable */
1604
1605/* ========== Accordion ========== */
1606
1607/* ========== Dialog ========== */
1608
1609/* ========== Lightbox ========== */
1610
1611/* ========== Lightboard ========== */
1612
1613/* ========== Carousel ========== */
1614
1615/* ========== Bordered fields ========== */
1616
1617/* ========== Color Themes ========== */
1618
1619ul.mdlext-lightboard {
1620 list-style: none;
1621}
1622
1623.mdlext-lightboard {
1624 box-sizing: border-box;
1625 margin: 0 auto;
1626 padding: 0;
1627 display: -ms-flexbox;
1628 display: flex;
1629 -ms-flex-flow: row wrap;
1630 flex-flow: row wrap;
1631 -ms-flex-align: stretch;
1632 align-items: stretch;
1633}
1634
1635.mdlext-lightboard *,
1636.mdlext-lightboard *::before,
1637.mdlext-lightboard *::after,
1638.mdlext-lightboard input[type="search"] {
1639 box-sizing: border-box;
1640}
1641
1642.mdlext-lightboard .mdlext-lightboard__slide {
1643 background-color: #F8F8F8;
1644 border: 1px solid #D8D8D8;
1645 border-radius: 5px;
1646 box-shadow: 2px 2px 6px -1px rgba(219, 215, 219, 0.5);
1647 position: relative;
1648 display: block;
1649 max-width: 250px;
1650}
1651
1652.mdlext-lightboard .mdlext-lightboard__slide::before {
1653 content: '';
1654 display: block;
1655 padding-top: 100%;
1656}
1657
1658.mdlext-lightboard .mdlext-lightboard__slide:hover,
1659.mdlext-lightboard .mdlext-lightboard__slide:active,
1660.mdlext-lightboard .mdlext-lightboard__slide:focus {
1661 border-color: #B8B8B8;
1662 background-color: #E8E8E8;
1663 box-shadow: 2px 2px 12px -1px #dbd7db;
1664}
1665
1666.mdlext-lightboard .mdlext-lightboard__slide:hover figcaption,
1667.mdlext-lightboard .mdlext-lightboard__slide:active figcaption,
1668.mdlext-lightboard .mdlext-lightboard__slide:focus figcaption {
1669 color: black !important;
1670 background-color: rgba(255, 255, 255, 0.2);
1671}
1672
1673.mdlext-lightboard .mdlext-lightboard__slide:focus {
1674 outline-offset: -2px;
1675 outline-color: inherit;
1676}
1677
1678.mdlext-lightboard .mdlext-lightboard__slide[aria-selected='true'] {
1679 background-color: #E8E8E8;
1680}
1681
1682.mdlext-lightboard .mdlext-lightboard__slide[aria-selected='true'] figcaption {
1683 color: black !important;
1684 background-color: rgba(255, 255, 255, 0.2);
1685}
1686
1687.mdlext-lightboard .mdlext-lightboard__slide__frame,
1688.mdlext-lightboard .mdlext-lightboard__slide__ripple-container {
1689 text-decoration: none;
1690 display: block;
1691 overflow: hidden;
1692 position: absolute;
1693 top: 0;
1694 left: 0;
1695 right: 0;
1696 bottom: 0;
1697}
1698
1699.mdlext-lightboard .mdlext-lightboard__slide__frame:focus,
1700.mdlext-lightboard .mdlext-lightboard__slide__ripple-container:focus {
1701 outline-offset: -2px;
1702 outline-color: inherit;
1703}
1704
1705.mdlext-lightboard .mdlext-lightboard__slide__frame .mdl-ripple,
1706.mdlext-lightboard .mdlext-lightboard__slide__ripple-container .mdl-ripple {
1707 background: rgb(63,81,181);
1708}
1709
1710.mdlext-lightboard .mdlext-lightboard__slide__frame figure,
1711.mdlext-lightboard .mdlext-lightboard__slide__ripple-container figure {
1712 display: block;
1713 position: absolute;
1714 top: 0;
1715 left: 0;
1716 right: 0;
1717 bottom: 0;
1718}
1719
1720.mdlext-lightboard .mdlext-lightboard__slide__frame figure img,
1721.mdlext-lightboard .mdlext-lightboard__slide__ripple-container figure img {
1722 position: absolute;
1723 top: 0;
1724 left: 0;
1725 right: 0;
1726 bottom: 0;
1727 margin: auto;
1728 max-width: 100%;
1729 max-height: 100%;
1730 border-width: 0;
1731 border-radius: 3px;
1732}
1733
1734.mdlext-lightboard .mdlext-lightboard__slide__frame figure figcaption,
1735.mdlext-lightboard .mdlext-lightboard__slide__ripple-container figure figcaption {
1736 font-family: "Roboto", "Helvetica", "Arial", sans-serif;
1737 font-size: 12px;
1738 font-weight: 400;
1739 line-height: 1;
1740 letter-spacing: 0;
1741 color: #bdbdbd;
1742 position: absolute;
1743 bottom: -2px;
1744 white-space: nowrap;
1745 overflow: hidden;
1746 max-width: 100%;
1747 width: 100%;
1748 text-align: center;
1749 text-overflow: ellipsis;
1750 padding: 4px 0;
1751}
1752
1753.mdlext-lightboard .mdlext-lightboard__slide__frame:hover figcaption,
1754.mdlext-lightboard .mdlext-lightboard__slide__ripple-container:hover figcaption {
1755 color: black !important;
1756 background-color: rgba(255, 255, 255, 0.2);
1757}
1758
1759.mdlext-lightboard {
1760 padding: calc((0 - 2px) / 2);
1761}
1762
1763.mdlext-lightboard .mdlext-lightboard__slide {
1764 margin: calc(2px / 2);
1765 width: calc(1 / 2 * 100% - 2px);
1766}
1767
1768.mdlext-lightboard .mdlext-lightboard__slide .mdlext-lightboard__slide__frame figure {
1769 margin: 8px;
1770}
1771
1772.mdlext-lightboard.mdlext-lightboard--no-spacing {
1773 padding: 0;
1774}
1775
1776.mdlext-lightboard.mdlext-lightboard--no-spacing .mdlext-lightboard__slide {
1777 margin: 0;
1778 width: calc(1 / 2 * 100%);
1779}
1780
1781/**
1782 * Copyright 2016 Leif Olsen. All Rights Reserved.
1783 *
1784 * Licensed under the Apache License, Version 2.0 (the "License");
1785 * you may not use this file except in compliance with the License.
1786 * You may obtain a copy of the License at
1787 *
1788 * http://www.apache.org/licenses/LICENSE-2.0
1789 *
1790 * Unless required by applicable law or agreed to in writing, software
1791 * distributed under the License is distributed on an "AS IS" BASIS,
1792 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
1793 * See the License for the specific language governing permissions and
1794 * limitations under the License.
1795 */
1796
1797/* stylelint-disable */
1798
1799/* stylelint-enable */
1800
1801/* ========== Sticky Header ========== */
1802
1803/* stylelint-disable */
1804
1805/* stylelint-enable */
1806
1807/* ========== Accordion ========== */
1808
1809/* ========== Dialog ========== */
1810
1811/* ========== Lightbox ========== */
1812
1813/* ========== Lightboard ========== */
1814
1815/* ========== Carousel ========== */
1816
1817/* ========== Bordered fields ========== */
1818
1819/* ========== Color Themes ========== */
1820
1821/* stylelint-disable */
1822
1823@media (min-width: 480px) and (max-width: 659px) {
1824 /* stylelint-enable */
1825
1826 .mdlext-lightboard {
1827 padding: calc((0 - 4px) / 2);
1828 }
1829
1830 .mdlext-lightboard .mdlext-lightboard__slide {
1831 margin: calc(4px / 2);
1832 width: calc(1 / 4 * 100% - 4px);
1833 }
1834
1835 .mdlext-lightboard .mdlext-lightboard__slide .mdlext-lightboard__slide__frame figure {
1836 margin: 8px;
1837 }
1838
1839 .mdlext-lightboard.mdlext-lightboard--no-spacing {
1840 padding: 0;
1841 }
1842
1843 .mdlext-lightboard.mdlext-lightboard--no-spacing .mdlext-lightboard__slide {
1844 margin: 0;
1845 width: calc(1 / 4 * 100%);
1846 }
1847}
1848
1849/* stylelint-disable */
1850
1851@media (min-width: 660px) and (max-width: 839px) {
1852 /* stylelint-enable */
1853
1854 .mdlext-lightboard {
1855 padding: calc((0 - 4px) / 2);
1856 }
1857
1858 .mdlext-lightboard .mdlext-lightboard__slide {
1859 margin: calc(4px / 2);
1860 width: calc(1 / 5 * 100% - 4px);
1861 }
1862
1863 .mdlext-lightboard .mdlext-lightboard__slide .mdlext-lightboard__slide__frame figure {
1864 margin: 8px;
1865 }
1866
1867 .mdlext-lightboard.mdlext-lightboard--no-spacing {
1868 padding: 0;
1869 }
1870
1871 .mdlext-lightboard.mdlext-lightboard--no-spacing .mdlext-lightboard__slide {
1872 margin: 0;
1873 width: calc(1 / 5 * 100%);
1874 }
1875}
1876
1877/* stylelint-disable */
1878
1879@media (min-width: 840px) and (max-width: 1199px) {
1880 /* stylelint-enable */
1881
1882 .mdlext-lightboard {
1883 padding: calc((0 - 8px) / 2);
1884 }
1885
1886 .mdlext-lightboard .mdlext-lightboard__slide {
1887 margin: calc(8px / 2);
1888 width: calc(1 / 6 * 100% - 8px);
1889 }
1890
1891 .mdlext-lightboard .mdlext-lightboard__slide .mdlext-lightboard__slide__frame figure {
1892 margin: 12px;
1893 }
1894
1895 .mdlext-lightboard.mdlext-lightboard--no-spacing {
1896 padding: 0;
1897 }
1898
1899 .mdlext-lightboard.mdlext-lightboard--no-spacing .mdlext-lightboard__slide {
1900 margin: 0;
1901 width: calc(1 / 6 * 100%);
1902 }
1903}
1904
1905@media (min-width: 1200px) {
1906 .mdlext-lightboard {
1907 padding: calc((0 - 8px) / 2);
1908 }
1909
1910 .mdlext-lightboard .mdlext-lightboard__slide {
1911 margin: calc(8px / 2);
1912 width: calc(1 / 7 * 100% - 8px);
1913 }
1914
1915 .mdlext-lightboard .mdlext-lightboard__slide .mdlext-lightboard__slide__frame figure {
1916 margin: 12px;
1917 }
1918
1919 .mdlext-lightboard.mdlext-lightboard--no-spacing {
1920 padding: 0;
1921 }
1922
1923 .mdlext-lightboard.mdlext-lightboard--no-spacing .mdlext-lightboard__slide {
1924 margin: 0;
1925 width: calc(1 / 7 * 100%);
1926 }
1927}
1928
1929/**
1930 * Copyright 2016 Leif Olsen. All Rights Reserved.
1931 *
1932 * Licensed under the Apache License, Version 2.0 (the "License");
1933 * you may not use this file except in compliance with the License.
1934 * You may obtain a copy of the License at
1935 *
1936 * http://www.apache.org/licenses/LICENSE-2.0
1937 *
1938 * Unless required by applicable law or agreed to in writing, software
1939 * distributed under the License is distributed on an "AS IS" BASIS,
1940 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
1941 * See the License for the specific language governing permissions and
1942 * limitations under the License.
1943 */
1944
1945/**
1946 * Copyright 2016 Leif Olsen. All Rights Reserved.
1947 *
1948 * Licensed under the Apache License, Version 2.0 (the "License");
1949 * you may not use this file except in compliance with the License.
1950 * You may obtain a copy of the License at
1951 *
1952 * http://www.apache.org/licenses/LICENSE-2.0
1953 *
1954 * Unless required by applicable law or agreed to in writing, software
1955 * distributed under the License is distributed on an "AS IS" BASIS,
1956 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
1957 * See the License for the specific language governing permissions and
1958 * limitations under the License.
1959 */
1960
1961/* stylelint-disable */
1962
1963/* stylelint-enable */
1964
1965/* ========== Sticky Header ========== */
1966
1967/* stylelint-disable */
1968
1969/* stylelint-enable */
1970
1971/* ========== Accordion ========== */
1972
1973/* ========== Dialog ========== */
1974
1975/* ========== Lightbox ========== */
1976
1977/* ========== Lightboard ========== */
1978
1979/* ========== Carousel ========== */
1980
1981/* ========== Bordered fields ========== */
1982
1983/* ========== Color Themes ========== */
1984
1985.mdlext-lightbox {
1986 -webkit-user-select: none;
1987 -moz-user-select: none;
1988 -ms-user-select: none;
1989 user-select: none;
1990 cursor: default;
1991 position: relative;
1992 width: auto;
1993 max-width: 100%;
1994 margin: 0 auto;
1995 border: 0;
1996 border-radius: 0;
1997 background-color: rgb(255,255,255);
1998 box-sizing: border-box;
1999 outline: 0;
2000 display: block;
2001}
2002
2003.mdlext-lightbox *,
2004.mdlext-lightbox *::before,
2005.mdlext-lightbox *::after,
2006.mdlext-lightbox input[type="search"] {
2007 box-sizing: border-box;
2008}
2009
2010.mdlext-lightbox .mdlext-lightbox__slider {
2011 position: absolute;
2012 top: 0;
2013 left: 0;
2014 display: -ms-flexbox;
2015 display: flex;
2016 -ms-flex-pack: center;
2017 justify-content: center;
2018}
2019
2020.mdlext-lightbox .mdlext-lightbox__slider .mdlext-lightbox__slider__slide {
2021 -ms-flex-negative: 0;
2022 flex-shrink: 0;
2023 display: block;
2024 text-align: left;
2025 color: #7f7f7f;
2026 background-size: cover;
2027 background-position: center;
2028 background-repeat: no-repeat;
2029}
2030
2031.mdlext-lightbox figure {
2032 margin: 0;
2033 padding: 0;
2034 position: relative;
2035}
2036
2037.mdlext-lightbox figure img {
2038 width: 100%;
2039 max-width: 100%;
2040 height: auto;
2041 border: 0;
2042 outline: 0;
2043}
2044
2045.mdlext-lightbox figure figcaption {
2046 font-family: "Roboto", "Helvetica", "Arial", sans-serif;
2047 font-size: 12px;
2048 font-weight: 400;
2049 line-height: 1;
2050 letter-spacing: 0;
2051 display: block;
2052 position: absolute;
2053 bottom: 0;
2054 left: 0;
2055 right: 0;
2056 max-width: 100%;
2057 height: auto;
2058 max-height: 50%;
2059 overflow: auto;
2060 padding: 8px;
2061 background-color: rgba(255, 255, 255, 0.76);
2062 transform-origin: bottom;
2063 transform: scaleY(0);
2064 transition: 0.2s ease-in-out;
2065}
2066
2067.mdlext-lightbox figure figcaption.mdlext-lightbox__show-figcaption {
2068 transform: scaleY(1);
2069}
2070
2071.mdlext-lightbox figure figcaption tbody th {
2072 text-align: left;
2073}
2074
2075.mdlext-lightbox figure figcaption tbody th,
2076.mdlext-lightbox figure figcaption tbody td {
2077 vertical-align: text-top;
2078}
2079
2080.mdlext-lightbox .mdl-card__menu {
2081 color: #ffffff;
2082 z-index: 1;
2083}
2084
2085.mdlext-lightbox footer {
2086 display: -ms-flexbox;
2087 display: flex;
2088 -ms-flex-pack: justify;
2089 justify-content: space-between;
2090 -ms-flex-align: center;
2091 align-items: center;
2092 background-color: rgba(255, 255, 255, 0.86);
2093}
2094
2095.mdlext-lightbox footer .mdl-card__supporting-text {
2096 -ms-flex: 1;
2097 flex: 1;
2098 overflow: hidden;
2099 padding: 0;
2100 height: 18px;
2101 width: 100%;
2102}
2103
2104.mdlext-lightbox footer nav {
2105 display: -ms-flexbox;
2106 display: flex;
2107}
2108
2109.mdlext-lightbox.mdlext-lightbox--sticky-footer footer {
2110 position: fixed;
2111 bottom: 0;
2112 left: 0;
2113}
2114
2115/**
2116 * Copyright 2016 Leif Olsen. All Rights Reserved.
2117 *
2118 * Licensed under the Apache License, Version 2.0 (the "License");
2119 * you may not use this file except in compliance with the License.
2120 * You may obtain a copy of the License at
2121 *
2122 * http://www.apache.org/licenses/LICENSE-2.0
2123 *
2124 * Unless required by applicable law or agreed to in writing, software
2125 * distributed under the License is distributed on an "AS IS" BASIS,
2126 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
2127 * See the License for the specific language governing permissions and
2128 * limitations under the License.
2129 */
2130
2131/*
2132 * A carousel ...
2133 */
2134
2135ul.mdlext-carousel {
2136 list-style: none;
2137}
2138
2139.mdlext-carousel {
2140 box-sizing: border-box;
2141 margin: 0;
2142 padding: 0;
2143 overflow: hidden;
2144 height: 100%;
2145 width: 100%;
2146 display: block;
2147 white-space: nowrap;
2148 font-size: 0;
2149 background-color: transparent;
2150}
2151
2152.mdlext-carousel__slide {
2153 box-sizing: border-box;
2154 display: inline-block;
2155 position: relative;
2156 outline: 0;
2157 margin: 0 0;
2158 padding: 0;
2159 height: 100%;
2160 border-top: 2px solid transparent;
2161}
2162
2163.mdlext-carousel__slide[aria-selected] figcaption,
2164.mdlext-carousel__slide[aria-selected='true'] figcaption {
2165 color: black !important;
2166 background-color: rgba(255, 255, 255, 0.25);
2167}
2168
2169.mdlext-carousel__slide[aria-selected]::after,
2170.mdlext-carousel__slide[aria-selected='true']::after {
2171 height: 2px;
2172 width: 100%;
2173 display: block;
2174 content: ' ';
2175 top: -2px;
2176 left: 0;
2177 position: absolute;
2178 background: #ff4081;
2179 animation: border-expand 0.2s cubic-bezier(0.4, 0, 0.4, 1) 0.01s alternate forwards;
2180 transition: all 1s cubic-bezier(0.4, 0, 1, 1);
2181}
2182
2183.mdlext-carousel__slide a {
2184 text-decoration: none;
2185}
2186
2187.mdlext-carousel__slide figure {
2188 box-sizing: border-box;
2189 position: relative;
2190 height: 100%;
2191 margin: 0;
2192 padding: 0;
2193}
2194
2195.mdlext-carousel__slide figure img {
2196 box-sizing: border-box;
2197 max-height: 100%;
2198}
2199
2200.mdlext-carousel__slide figure figcaption {
2201 box-sizing: border-box;
2202 font-family: "Roboto", "Helvetica", "Arial", sans-serif;
2203 font-size: 12px;
2204 font-weight: 400;
2205 line-height: 1;
2206 letter-spacing: 0;
2207 color: #bdbdbd;
2208 position: absolute;
2209 bottom: 0;
2210 left: 0;
2211 white-space: nowrap;
2212 overflow: hidden;
2213 max-width: 100%;
2214 width: 100%;
2215 text-align: center;
2216 text-overflow: ellipsis;
2217 padding: 4px 0;
2218}
2219
2220.mdlext-carousel__slide figure:hover figcaption {
2221 color: black !important;
2222 background-color: rgba(255, 255, 255, 0.25);
2223}
2224
2225.mdlext-carousel__slide .mdlext-carousel__slide__ripple-container {
2226 text-decoration: none;
2227 display: block;
2228 overflow: hidden;
2229 position: absolute;
2230 top: 0;
2231 left: 0;
2232 right: 0;
2233 bottom: 0;
2234 outline: 0;
2235}
2236
2237.mdlext-carousel__slide .mdlext-carousel__slide__ripple-container .mdl-ripple {
2238 background: rgb(63,81,181);
2239}
2240
2241/**
2242 * Copyright 2016 Leif Olsen. All Rights Reserved.
2243 *
2244 * Licensed under the Apache License, Version 2.0 (the "License");
2245 * you may not use this file except in compliance with the License.
2246 * You may obtain a copy of the License at
2247 *
2248 * http://www.apache.org/licenses/LICENSE-2.0
2249 *
2250 * Unless required by applicable law or agreed to in writing, software
2251 * distributed under the License is distributed on an "AS IS" BASIS,
2252 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
2253 * See the License for the specific language governing permissions and
2254 * limitations under the License.
2255 */
2256
2257/*
2258 * Copied/Modified/Inspired from/by:
2259 * https://github.com/google/material-design-lite/tree/master/src/textfield
2260 * http://red-team-design.com/making-html-dropdowns-not-suck/
2261 * http://codepen.io/etcpe9/pen/PqyOye,
2262 * http://codepen.io/pudgereyem/pen/PqBxQx
2263 * https://github.com/MEYVN-digital/mdl-selectfield
2264 * https://github.com/mebibou/mdl-selectfield
2265 */
2266
2267/* stylelint-disable */
2268
2269/* stylelint-enable */
2270
2271.mdlext-selectfield {
2272 box-sizing: border-box;
2273 position: relative;
2274 font-size: 16px;
2275 display: inline-block;
2276 width: 300px;
2277 max-width: 100%;
2278 margin: 0;
2279 padding: 20px 0;
2280}
2281
2282.mdlext-selectfield .mdl-button {
2283 bottom: 20px;
2284 position: absolute;
2285}
2286
2287.mdlext-selectfield::after {
2288 content: '';
2289 width: 0;
2290 height: 0;
2291 font-size: inherit;
2292 line-height: inherit;
2293 border-top: 0.5em solid inherit;
2294 border-top-width: 0.5em;
2295 border-top-style: solid;
2296 border-top-color: inherit;
2297 border-left: 0.35em solid transparent;
2298 border-right: 0.35em solid transparent;
2299 position: absolute;
2300 right: 0.5em;
2301 top: 50%;
2302 transform: translateY(-50%);
2303 pointer-events: none;
2304}
2305
2306.mdlext-selectfield.is-disabled::after {
2307 color: rgba(0,0,0, 0.12);
2308 content: '';
2309 width: 0;
2310 height: 0;
2311 font-size: inherit;
2312 line-height: inherit;
2313 border-top: 0.5em solid rgba(0,0,0, 0.12);
2314 border-top-width: 0.5em;
2315 border-top-style: solid;
2316 border-top-color: rgba(0,0,0, 0.12);
2317 border-left: 0.35em solid transparent;
2318 border-right: 0.35em solid transparent;
2319}
2320
2321.mdlext-selectfield--align-right {
2322 text-align: right;
2323}
2324
2325.mdlext-selectfield--full-width {
2326 width: 100%;
2327}
2328
2329.mdlext-selectfield--expandable {
2330 min-height: 32px;
2331 min-width: 32px;
2332 width: auto;
2333}
2334
2335.mdlext-selectfield__select {
2336 box-sizing: border-box;
2337 border: 0;
2338 border-radius: 0;
2339 -webkit-appearance: none;
2340 -moz-appearance: none;
2341 -ms-appearance: none;
2342 appearance: none;
2343 text-indent: 0.01px;
2344 text-overflow: '';
2345 outline: none;
2346 box-shadow: none;
2347 font-size: 16px;
2348 font-family: "Helvetica", "Arial", sans-serif;
2349 padding: 4px calc(1.2em + 4px) 4px 0;
2350 width: 100%;
2351 border-bottom: 1px solid rgba(0,0,0, 0.12);
2352 display: block;
2353 margin: 0;
2354 background: none;
2355 text-align: left;
2356 color: inherit;
2357}
2358
2359.mdlext-selectfield__select:-moz-focusring {
2360 color: transparent;
2361 text-shadow: 0 0 0 #000000;
2362}
2363
2364.mdlext-selectfield__select:focus::-ms-value {
2365 background-color: inherit;
2366 color: inherit;
2367}
2368
2369.mdlext-selectfield__select::-ms-expand {
2370 display: none;
2371}
2372
2373.mdlext-selectfield.is-focused .mdlext-selectfield__select {
2374 outline: none;
2375}
2376
2377.mdlext-selectfield.is-invalid .mdlext-selectfield__select {
2378 border-color: rgb(213,0,0);
2379 box-shadow: none;
2380}
2381
2382fieldset[disabled] .mdlext-selectfield .mdlext-selectfield__select,
2383.mdlext-selectfield.is-disabled .mdlext-selectfield__select {
2384 border-bottom: 1px dotted rgba(0,0,0, 0.12);
2385 color: rgba(0,0,0, 0.26);
2386 background-color: transparent;
2387}
2388
2389.mdlext-selectfield__select option {
2390 color: rgba(0,0,0, 0.87);
2391 box-sizing: border-box;
2392 background-color: inherit;
2393}
2394
2395.mdlext-selectfield__label {
2396 box-sizing: border-box;
2397 color: rgba(0,0,0, 0.26);
2398 font-size: 16px;
2399 top: 24px;
2400 bottom: 0;
2401 left: 0;
2402 right: 0;
2403 pointer-events: none;
2404 position: absolute;
2405 display: block;
2406 width: 100%;
2407 overflow: hidden;
2408 white-space: nowrap;
2409 text-align: left;
2410}
2411
2412.mdlext-selectfield.is-dirty .mdlext-selectfield__label,
2413.mdlext-selectfield.has-placeholder .mdlext-selectfield__label {
2414 visibility: hidden;
2415}
2416
2417.mdlext-selectfield--floating-label .mdlext-selectfield__label {
2418 transition-duration: 0.2s;
2419 transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
2420}
2421
2422.mdlext-selectfield--floating-label.has-placeholder .mdlext-selectfield__label {
2423 transition: none;
2424}
2425
2426fieldset[disabled] .mdlext-selectfield .mdlext-selectfield__label,
2427.mdlext-selectfield.is-disabled.is-disabled .mdlext-selectfield__label {
2428 color: rgba(0,0,0, 0.26);
2429}
2430
2431.mdlext-selectfield--floating-label.is-focused .mdlext-selectfield__label,
2432.mdlext-selectfield--floating-label.is-dirty.is-dirty .mdlext-selectfield__label,
2433.mdlext-selectfield--floating-label.has-placeholder .mdlext-selectfield__label {
2434 color: rgb(63,81,181);
2435 font-size: 12px;
2436 top: 4px;
2437 visibility: visible;
2438}
2439
2440.mdlext-selectfield--floating-label.is-focused .mdlext-selectfield__expandable-holder .mdlext-selectfield__label,
2441.mdlext-selectfield--floating-label.is-dirty .mdlext-selectfield__expandable-holder .mdlext-selectfield__label,
2442.mdlext-selectfield--floating-label.has-placeholder .mdlext-selectfield__expandable-holder .mdlext-selectfield__label {
2443 top: -16px;
2444}
2445
2446.mdlext-selectfield--floating-label.is-invalid .mdlext-selectfield__label {
2447 color: rgb(213,0,0);
2448 font-size: 12px;
2449}
2450
2451.mdlext-selectfield__label::after {
2452 background-color: rgb(63,81,181);
2453 bottom: 20px;
2454 content: '';
2455 height: 2px;
2456 left: 45%;
2457 position: absolute;
2458 transition-duration: 0.2s;
2459 transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
2460 visibility: hidden;
2461 width: 10px;
2462}
2463
2464.mdlext-selectfield.is-focused .mdlext-selectfield__label::after {
2465 left: 0;
2466 visibility: visible;
2467 width: 100%;
2468}
2469
2470.mdlext-selectfield.is-invalid .mdlext-selectfield__label::after {
2471 background-color: rgb(213,0,0);
2472}
2473
2474.mdlext-selectfield__error {
2475 color: rgb(213,0,0);
2476 font-size: 12px;
2477 position: absolute;
2478 margin-top: 3px;
2479 visibility: hidden;
2480 display: block;
2481}
2482
2483.mdlext-selectfield.is-invalid .mdlext-selectfield__error {
2484 visibility: visible;
2485}
2486
2487.mdlext-selectfield__expandable-holder {
2488 display: inline-block;
2489 position: relative;
2490 margin-left: 32px;
2491 transition-duration: 0.2s;
2492 transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
2493 max-width: 0.1px;
2494}
2495
2496.mdlext-selectfield.is-focused .mdlext-selectfield__expandable-holder,
2497.mdlext-selectfield.is-dirty .mdlext-selectfield__expandable-holder {
2498 max-width: 600px;
2499}
2500
2501.mdlext-selectfield__expandable-holder .mdlext-selectfield__label::after {
2502 bottom: 0;
2503}
2504
2505/**
2506 * @license
2507 * Copyright 2016 Leif Olsen. All Rights Reserved.
2508 *
2509 * Licensed under the Apache License, Version 2.0 (the "License");
2510 * you may not use this file except in compliance with the License.
2511 * You may obtain a copy of the License at
2512 *
2513 * http://www.apache.org/licenses/LICENSE-2.0
2514 *
2515 * Unless required by applicable law or agreed to in writing, software
2516 * distributed under the License is distributed on an "AS IS" BASIS,
2517 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
2518 * See the License for the specific language governing permissions and
2519 * limitations under the License.
2520 *
2521 * This code is built with Google Material Design Lite,
2522 * which is Licensed under the Apache License, Version 2.0
2523 */
2524
2525/* Moved to aria-expanded-toggle.scss
2526
2527.mdlext-aria-expanded-plus-minus {
2528 @include mdlext-aria-expanded-toggle($font-family: inherit);
2529}
2530
2531.mdlext-aria-expanded-more-less {
2532 @include mdlext-aria-expanded-toggle($icon: 'expand_more', $icon-expanded: 'expand_less');
2533}
2534*/
2535
2536.mdlext-menu-button {
2537 box-sizing: border-box;
2538 font-family: "Roboto", "Helvetica", "Arial", sans-serif;
2539 font-size: 14px;
2540 font-weight: 500;
2541 line-height: 1;
2542 letter-spacing: 0;
2543 text-transform: none;
2544 position: relative;
2545 height: 36px;
2546 padding: 0 16px;
2547 display: -ms-flexbox;
2548 display: flex;
2549 -ms-flex-align: center;
2550 align-items: center;
2551 -ms-flex-item-align: stretch;
2552 align-self: stretch;
2553}
2554
2555.mdlext-menu-button > * {
2556 margin: 0;
2557 padding: 0 0 0 8px;
2558}
2559
2560.mdlext-menu-button > *:first-child {
2561 padding-left: 0;
2562}
2563
2564.mdlext-menu-button > *:last-child:not(:only-child):not(.mdlext-menu__item__caption) {
2565 margin-left: auto;
2566}
2567
2568.mdlext-menu-button__caption {
2569 white-space: nowrap;
2570 overflow: hidden;
2571 text-overflow: ellipsis;
2572 line-height: 1.2;
2573}
2574
2575.mdlext-menu,
2576.mdlext-menu__item {
2577 box-sizing: border-box;
2578 margin: 0;
2579 padding: 0;
2580 list-style: none;
2581 display: -ms-flexbox;
2582 display: flex;
2583}
2584
2585.mdlext-menu {
2586 position: absolute;
2587 background: rgb(255,255,255);
2588 z-index: 1000;
2589 min-width: 124px;
2590 border-radius: 2px;
2591 box-shadow: 0 3px 4px 0 rgba(0, 0, 0, 0.14), 0 3px 3px -2px rgba(0, 0, 0, 0.2), 0 1px 8px 0 rgba(0, 0, 0, 0.12);
2592 display: -ms-inline-flexbox;
2593 display: inline-flex;
2594 -ms-flex-direction: column;
2595 flex-direction: column;
2596 padding: 0;
2597 overflow: hidden;
2598 overflow-y: auto;
2599}
2600
2601.mdlext-menu:focus {
2602 outline-offset: -1px;
2603 outline-width: 1px;
2604}
2605
2606.mdlext-menu[hidden] {
2607 border: 0;
2608 clip: rect(0 0 0 0);
2609 height: 1px;
2610 margin: -1px;
2611 overflow: hidden;
2612 padding: 0;
2613 position: absolute;
2614 width: 1px;
2615 pointer-events: none;
2616}
2617
2618.mdlext-menu__item {
2619 font-size: 14px;
2620 font-weight: 400;
2621 line-height: 24px;
2622 letter-spacing: 0;
2623 color: rgba(0,0,0, 0.87);
2624 background-color: rgb(255,255,255);
2625 position: relative;
2626 padding: 0 16px 0 24px;
2627 -ms-flex-align: center;
2628 align-items: center;
2629 -ms-flex-item-align: stretch;
2630 -ms-grid-row-align: stretch;
2631 align-self: stretch;
2632 text-decoration: none;
2633 cursor: pointer;
2634 white-space: nowrap;
2635 -webkit-user-select: none;
2636 -moz-user-select: none;
2637 -ms-user-select: none;
2638 user-select: none;
2639 min-height: 40px;
2640 overflow: hidden;
2641}
2642
2643.mdlext-menu__item[aria-selected='true'] {
2644 background-color: rgb(224,224,224);
2645}
2646
2647.mdlext-menu__item[aria-selected='true']::before {
2648 content: '\2713';
2649 position: absolute;
2650 font-size: 1.4em;
2651 left: 4px;
2652 top: 50%;
2653 transform: translateY(-50%);
2654 pointer-events: none;
2655}
2656
2657.mdlext-menu__item:hover:not([disabled]) {
2658 background-color: rgb(238,238,238);
2659}
2660
2661.mdlext-menu__item:focus {
2662 outline-offset: -2px;
2663 outline-width: 1px;
2664 outline-color: rgb(189,189,189);
2665 background-color: rgb(238,238,238);
2666}
2667
2668.mdlext-menu__item::-moz-focus-inner {
2669 border: 0;
2670}
2671
2672.mdlext-menu__item[disabled] {
2673 color: rgb(189,189,189);
2674 background-color: transparent;
2675 cursor: auto;
2676 pointer-events: none;
2677}
2678
2679.mdlext-menu__item[disabled] > * {
2680 color: rgb(189,189,189);
2681}
2682
2683.mdlext-menu__item__caption {
2684 white-space: nowrap;
2685 overflow: hidden;
2686 text-overflow: ellipsis;
2687}
2688
2689.mdlext-menu__item > * {
2690 margin: 0;
2691 padding: 0 0 0 8px;
2692}
2693
2694.mdlext-menu__item > *:first-child {
2695 padding-left: 0;
2696}
2697
2698.mdlext-menu__item > *:last-child:not(:only-child):not(.mdlext-menu__item__caption) {
2699 margin-left: auto;
2700}
2701
2702.mdlext-menu__item-separator {
2703 margin: 0;
2704 padding: 0;
2705 border-bottom: 1px solid rgba(0,0,0, 0.12);
2706}
2707
2708/**
2709 * Copyright 2016 Leif Olsen. All Rights Reserved.
2710 *
2711 * Licensed under the Apache License, Version 2.0 (the "License");
2712 * you may not use this file except in compliance with the License.
2713 * You may obtain a copy of the License at
2714 *
2715 * http://www.apache.org/licenses/LICENSE-2.0
2716 *
2717 * Unless required by applicable law or agreed to in writing, software
2718 * distributed under the License is distributed on an "AS IS" BASIS,
2719 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
2720 * See the License for the specific language governing permissions and
2721 * limitations under the License.
2722 */
2723
2724/*
2725 * The bordered fields are based on / inspired by this CodePen: http://codepen.io/prajwal078/pen/LVJZXz?editors=010
2726 */
2727
2728/**
2729 * Copyright 2016 Leif Olsen. All Rights Reserved.
2730 *
2731 * Licensed under the Apache License, Version 2.0 (the "License");
2732 * you may not use this file except in compliance with the License.
2733 * You may obtain a copy of the License at
2734 *
2735 * http://www.apache.org/licenses/LICENSE-2.0
2736 *
2737 * Unless required by applicable law or agreed to in writing, software
2738 * distributed under the License is distributed on an "AS IS" BASIS,
2739 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
2740 * See the License for the specific language governing permissions and
2741 * limitations under the License.
2742 */
2743
2744/* stylelint-disable */
2745
2746/* stylelint-enable */
2747
2748/* ========== Sticky Header ========== */
2749
2750/* stylelint-disable */
2751
2752/* stylelint-enable */
2753
2754/* ========== Accordion ========== */
2755
2756/* ========== Dialog ========== */
2757
2758/* ========== Lightbox ========== */
2759
2760/* ========== Lightboard ========== */
2761
2762/* ========== Carousel ========== */
2763
2764/* ========== Bordered fields ========== */
2765
2766/* ========== Color Themes ========== */
2767
2768/* stylelint-disable */
2769
2770/* stylelint-enable */
2771
2772.mdlext-bordered-fields {
2773 box-sizing: border-box;
2774}
2775
2776.mdlext-bordered-fields * {
2777 box-sizing: border-box;
2778}
2779
2780.mdlext-bordered-fields .mdl-textfield,
2781.mdlext-bordered-fields .mdlext-selectfield {
2782 padding: 0;
2783 margin: 0 0 20px 0;
2784 /*
2785 &.is-dirty {
2786 .mdl-textfield__input,
2787 .mdlext-selectfield__select {
2788 }
2789 }
2790 */
2791}
2792
2793.mdlext-bordered-fields .mdl-textfield .mdl-textfield__input,
2794.mdlext-bordered-fields .mdl-textfield .mdlext-selectfield__select,
2795.mdlext-bordered-fields .mdlext-selectfield .mdl-textfield__input,
2796.mdlext-bordered-fields .mdlext-selectfield .mdlext-selectfield__select {
2797 height: 46px;
2798 background-color: rgba(255, 255, 255, 0.2);
2799 border: 1px solid rgba(0, 0, 0, 0.26);
2800 border-radius: 3px;
2801 padding: 20px 8px 4px 8px;
2802 font-size: 16px;
2803 font-weight: normal;
2804 color: inherit;
2805}
2806
2807.mdlext-bordered-fields .mdl-textfield .mdl-textfield__input:disabled,
2808.mdlext-bordered-fields .mdl-textfield .mdlext-selectfield__select:disabled,
2809.mdlext-bordered-fields .mdlext-selectfield .mdl-textfield__input:disabled,
2810.mdlext-bordered-fields .mdlext-selectfield .mdlext-selectfield__select:disabled {
2811 color: rgba(0, 0, 0, 0.12);
2812 background-color: rgba(255, 255, 255, 0.2);
2813 border-color: rgba(0, 0, 0, 0.12);
2814}
2815
2816.mdlext-bordered-fields .mdl-textfield .mdl-textfield__input:focus,
2817.mdlext-bordered-fields .mdl-textfield .mdlext-selectfield__select:focus,
2818.mdlext-bordered-fields .mdlext-selectfield .mdl-textfield__input:focus,
2819.mdlext-bordered-fields .mdlext-selectfield .mdlext-selectfield__select:focus {
2820 background-color: rgba(238, 238, 238, 0.2);
2821 border-color: #3f51b5;
2822}
2823
2824.mdlext-bordered-fields .mdl-textfield .mdlext-selectfield__select,
2825.mdlext-bordered-fields .mdlext-selectfield .mdlext-selectfield__select {
2826 padding-right: calc(1em + 8px);
2827}
2828
2829.mdlext-bordered-fields .mdl-textfield.is-invalid .mdl-textfield__input,
2830.mdlext-bordered-fields .mdl-textfield.is-invalid .mdlext-selectfield__select,
2831.mdlext-bordered-fields .mdlext-selectfield.is-invalid .mdl-textfield__input,
2832.mdlext-bordered-fields .mdlext-selectfield.is-invalid .mdlext-selectfield__select {
2833 color: inherit;
2834 border-color: #d50000;
2835 background-color: rgba(255, 213, 213, 0.5);
2836}
2837
2838.mdlext-bordered-fields .mdl-textfield.is-invalid .mdl-textfield__input:focus,
2839.mdlext-bordered-fields .mdl-textfield.is-invalid .mdlext-selectfield__select:focus,
2840.mdlext-bordered-fields .mdlext-selectfield.is-invalid .mdl-textfield__input:focus,
2841.mdlext-bordered-fields .mdlext-selectfield.is-invalid .mdlext-selectfield__select:focus {
2842 border-color: #a20000;
2843 background-color: rgba(255, 213, 213, 0.5);
2844}
2845
2846.mdlext-bordered-fields .mdlext-selectfield::after {
2847 top: auto;
2848 bottom: 4px;
2849}
2850
2851.mdlext-bordered-fields fieldset[disabled] .mdlext-selectfield::after,
2852.mdlext-bordered-fields .mdlext-selectfield.is-disabled::after {
2853 color: rgba(0, 0, 0, 0.12);
2854 content: '';
2855 width: 0;
2856 height: 0;
2857 font-size: inherit;
2858 line-height: inherit;
2859 border-top: 0.5em solid rgba(0, 0, 0, 0.12);
2860 border-top-width: 0.5em;
2861 border-top-style: solid;
2862 border-top-color: rgba(0, 0, 0, 0.12);
2863 border-left: 0.35em solid transparent;
2864 border-right: 0.35em solid transparent;
2865}
2866
2867.mdlext-bordered-fields fieldset[disabled] .mdl-textfield .mdl-textfield__input,
2868.mdlext-bordered-fields fieldset[disabled] .mdlext-selectfield .mdlext-selectfield__select {
2869 color: rgba(0, 0, 0, 0.12);
2870 background-color: rgba(255, 255, 255, 0.2);
2871 border-color: rgba(0, 0, 0, 0.12);
2872}
2873
2874.mdlext-bordered-fields .mdl-textfield.is-dirty .mdl-textfield__label,
2875.mdlext-bordered-fields .mdl-textfield.is-dirty .mdlext-selectfield__label,
2876.mdlext-bordered-fields .mdl-textfield.has-placeholder .mdl-textfield__label,
2877.mdlext-bordered-fields .mdl-textfield.has-placeholder .mdlext-selectfield__label,
2878.mdlext-bordered-fields .mdlext-selectfield.is-dirty .mdl-textfield__label,
2879.mdlext-bordered-fields .mdlext-selectfield.is-dirty .mdlext-selectfield__label,
2880.mdlext-bordered-fields .mdlext-selectfield.has-placeholder .mdl-textfield__label,
2881.mdlext-bordered-fields .mdlext-selectfield.has-placeholder .mdlext-selectfield__label {
2882 visibility: hidden;
2883}
2884
2885.mdlext-bordered-fields .mdl-textfield .mdl-textfield__label,
2886.mdlext-bordered-fields .mdl-textfield .mdlext-selectfield__label,
2887.mdlext-bordered-fields .mdlext-selectfield .mdl-textfield__label,
2888.mdlext-bordered-fields .mdlext-selectfield .mdlext-selectfield__label {
2889 color: rgba(0, 0, 0, 0.26);
2890 font-size: 16px;
2891 font-weight: normal;
2892 padding-left: 8px;
2893 top: auto;
2894 bottom: 4px;
2895}
2896
2897.mdlext-bordered-fields .mdl-textfield .mdl-textfield__label::after,
2898.mdlext-bordered-fields .mdl-textfield .mdlext-selectfield__label::after,
2899.mdlext-bordered-fields .mdlext-selectfield .mdl-textfield__label::after,
2900.mdlext-bordered-fields .mdlext-selectfield .mdlext-selectfield__label::after {
2901 background-color: transparent !important;
2902 visibility: hidden !important;
2903}
2904
2905.mdlext-bordered-fields .mdl-textfield.mdl-textfield--floating-label.is-focused.is-focused .mdl-textfield__label,
2906.mdlext-bordered-fields .mdl-textfield.mdl-textfield--floating-label.is-focused.is-focused .mdlext-selectfield__label,
2907.mdlext-bordered-fields .mdl-textfield.mdl-textfield--floating-label.is-dirty.is-dirty .mdl-textfield__label,
2908.mdlext-bordered-fields .mdl-textfield.mdl-textfield--floating-label.is-dirty.is-dirty .mdlext-selectfield__label,
2909.mdlext-bordered-fields .mdl-textfield.mdl-textfield--floating-label.has-placeholder .mdl-textfield__label,
2910.mdlext-bordered-fields .mdl-textfield.mdl-textfield--floating-label.has-placeholder .mdlext-selectfield__label,
2911.mdlext-bordered-fields .mdl-textfield.mdlext-selectfield--floating-label.is-focused.is-focused .mdl-textfield__label,
2912.mdlext-bordered-fields .mdl-textfield.mdlext-selectfield--floating-label.is-focused.is-focused .mdlext-selectfield__label,
2913.mdlext-bordered-fields .mdl-textfield.mdlext-selectfield--floating-label.is-dirty.is-dirty .mdl-textfield__label,
2914.mdlext-bordered-fields .mdl-textfield.mdlext-selectfield--floating-label.is-dirty.is-dirty .mdlext-selectfield__label,
2915.mdlext-bordered-fields .mdl-textfield.mdlext-selectfield--floating-label.has-placeholder .mdl-textfield__label,
2916.mdlext-bordered-fields .mdl-textfield.mdlext-selectfield--floating-label.has-placeholder .mdlext-selectfield__label,
2917.mdlext-bordered-fields .mdlext-selectfield.mdl-textfield--floating-label.is-focused.is-focused .mdl-textfield__label,
2918.mdlext-bordered-fields .mdlext-selectfield.mdl-textfield--floating-label.is-focused.is-focused .mdlext-selectfield__label,
2919.mdlext-bordered-fields .mdlext-selectfield.mdl-textfield--floating-label.is-dirty.is-dirty .mdl-textfield__label,
2920.mdlext-bordered-fields .mdlext-selectfield.mdl-textfield--floating-label.is-dirty.is-dirty .mdlext-selectfield__label,
2921.mdlext-bordered-fields .mdlext-selectfield.mdl-textfield--floating-label.has-placeholder .mdl-textfield__label,
2922.mdlext-bordered-fields .mdlext-selectfield.mdl-textfield--floating-label.has-placeholder .mdlext-selectfield__label,
2923.mdlext-bordered-fields .mdlext-selectfield.mdlext-selectfield--floating-label.is-focused.is-focused .mdl-textfield__label,
2924.mdlext-bordered-fields .mdlext-selectfield.mdlext-selectfield--floating-label.is-focused.is-focused .mdlext-selectfield__label,
2925.mdlext-bordered-fields .mdlext-selectfield.mdlext-selectfield--floating-label.is-dirty.is-dirty .mdl-textfield__label,
2926.mdlext-bordered-fields .mdlext-selectfield.mdlext-selectfield--floating-label.is-dirty.is-dirty .mdlext-selectfield__label,
2927.mdlext-bordered-fields .mdlext-selectfield.mdlext-selectfield--floating-label.has-placeholder .mdl-textfield__label,
2928.mdlext-bordered-fields .mdlext-selectfield.mdlext-selectfield--floating-label.has-placeholder .mdlext-selectfield__label {
2929 color: #3f51b5;
2930 font-size: 12px;
2931 font-weight: normal;
2932 top: auto;
2933 bottom: 24px;
2934 visibility: visible;
2935}
2936
2937.mdlext-bordered-fields .mdl-textfield.mdl-textfield--floating-label.is-disabled.is-disabled .mdl-textfield__label,
2938.mdlext-bordered-fields .mdl-textfield.mdl-textfield--floating-label.is-disabled.is-disabled .mdlext-selectfield__label,
2939.mdlext-bordered-fields .mdl-textfield.mdlext-selectfield--floating-label.is-disabled.is-disabled .mdl-textfield__label,
2940.mdlext-bordered-fields .mdl-textfield.mdlext-selectfield--floating-label.is-disabled.is-disabled .mdlext-selectfield__label,
2941.mdlext-bordered-fields .mdlext-selectfield.mdl-textfield--floating-label.is-disabled.is-disabled .mdl-textfield__label,
2942.mdlext-bordered-fields .mdlext-selectfield.mdl-textfield--floating-label.is-disabled.is-disabled .mdlext-selectfield__label,
2943.mdlext-bordered-fields .mdlext-selectfield.mdlext-selectfield--floating-label.is-disabled.is-disabled .mdl-textfield__label,
2944.mdlext-bordered-fields .mdlext-selectfield.mdlext-selectfield--floating-label.is-disabled.is-disabled .mdlext-selectfield__label {
2945 color: rgba(0, 0, 0, 0.12);
2946}
2947
2948.mdlext-bordered-fields .mdl-textfield.mdl-textfield--floating-label.is-invalid.is-invalid .mdl-textfield__label,
2949.mdlext-bordered-fields .mdl-textfield.mdl-textfield--floating-label.is-invalid.is-invalid .mdlext-selectfield__label,
2950.mdlext-bordered-fields .mdl-textfield.mdlext-selectfield--floating-label.is-invalid.is-invalid .mdl-textfield__label,
2951.mdlext-bordered-fields .mdl-textfield.mdlext-selectfield--floating-label.is-invalid.is-invalid .mdlext-selectfield__label,
2952.mdlext-bordered-fields .mdlext-selectfield.mdl-textfield--floating-label.is-invalid.is-invalid .mdl-textfield__label,
2953.mdlext-bordered-fields .mdlext-selectfield.mdl-textfield--floating-label.is-invalid.is-invalid .mdlext-selectfield__label,
2954.mdlext-bordered-fields .mdlext-selectfield.mdlext-selectfield--floating-label.is-invalid.is-invalid .mdl-textfield__label,
2955.mdlext-bordered-fields .mdlext-selectfield.mdlext-selectfield--floating-label.is-invalid.is-invalid .mdlext-selectfield__label {
2956 color: #d50000;
2957}
2958
2959.mdlext-bordered-fields fieldset[disabled] .mdl-textfield .mdl-textfield__label,
2960.mdlext-bordered-fields fieldset[disabled] .mdl-selectfield .mdl-selectfield__label {
2961 color: rgba(0, 0, 0, 0.12);
2962}
2963
2964.mdlext-bordered-fields .mdl-textfield.mdlext-bordered-fields__icon-left > i,
2965.mdlext-bordered-fields .mdl-textfield.mdlext-bordered-fields__icon-left > .mdl-button,
2966.mdlext-bordered-fields .mdl-textfield.mdlext-bordered-fields__icon-right > i,
2967.mdlext-bordered-fields .mdl-textfield.mdlext-bordered-fields__icon-right > .mdl-button,
2968.mdlext-bordered-fields .mdlext-selectfield.mdlext-bordered-fields__icon-left > i,
2969.mdlext-bordered-fields .mdlext-selectfield.mdlext-bordered-fields__icon-left > .mdl-button,
2970.mdlext-bordered-fields .mdlext-selectfield.mdlext-bordered-fields__icon-right > i,
2971.mdlext-bordered-fields .mdlext-selectfield.mdlext-bordered-fields__icon-right > .mdl-button {
2972 position: absolute;
2973 bottom: 2px;
2974}
2975
2976.mdlext-bordered-fields .mdl-textfield.mdlext-bordered-fields__icon-left > i,
2977.mdlext-bordered-fields .mdl-textfield.mdlext-bordered-fields__icon-right > i,
2978.mdlext-bordered-fields .mdlext-selectfield.mdlext-bordered-fields__icon-left > i,
2979.mdlext-bordered-fields .mdlext-selectfield.mdlext-bordered-fields__icon-right > i {
2980 bottom: 6px;
2981}
2982
2983.mdlext-bordered-fields .mdl-textfield.mdlext-bordered-fields__icon-left > i:first-child,
2984.mdlext-bordered-fields .mdl-textfield.mdlext-bordered-fields__icon-left > .mdl-button:first-child,
2985.mdlext-bordered-fields .mdlext-selectfield.mdlext-bordered-fields__icon-left > i:first-child,
2986.mdlext-bordered-fields .mdlext-selectfield.mdlext-bordered-fields__icon-left > .mdl-button:first-child {
2987 left: 4px;
2988}
2989
2990.mdlext-bordered-fields .mdl-textfield.mdlext-bordered-fields__icon-left > i ~ .mdl-textfield__input,
2991.mdlext-bordered-fields .mdl-textfield.mdlext-bordered-fields__icon-left > .mdl-button ~ .mdl-textfield__input,
2992.mdlext-bordered-fields .mdl-textfield.mdlext-bordered-fields__icon-left > i ~ .mdlext-selectfield__select,
2993.mdlext-bordered-fields .mdl-textfield.mdlext-bordered-fields__icon-left > .mdl-button ~ .mdlext-selectfield__select,
2994.mdlext-bordered-fields .mdlext-selectfield.mdlext-bordered-fields__icon-left > i ~ .mdl-textfield__input,
2995.mdlext-bordered-fields .mdlext-selectfield.mdlext-bordered-fields__icon-left > .mdl-button ~ .mdl-textfield__input,
2996.mdlext-bordered-fields .mdlext-selectfield.mdlext-bordered-fields__icon-left > i ~ .mdlext-selectfield__select,
2997.mdlext-bordered-fields .mdlext-selectfield.mdlext-bordered-fields__icon-left > .mdl-button ~ .mdlext-selectfield__select {
2998 padding-left: 32px;
2999}
3000
3001.mdlext-bordered-fields .mdl-textfield.mdlext-bordered-fields__icon-left > i ~ .mdl-textfield__label,
3002.mdlext-bordered-fields .mdl-textfield.mdlext-bordered-fields__icon-left > .mdl-button ~ .mdl-textfield__label,
3003.mdlext-bordered-fields .mdlext-selectfield.mdlext-bordered-fields__icon-left > i ~ .mdl-textfield__label,
3004.mdlext-bordered-fields .mdlext-selectfield.mdlext-bordered-fields__icon-left > .mdl-button ~ .mdl-textfield__label {
3005 left: 24px;
3006}
3007
3008.mdlext-bordered-fields .mdl-textfield.mdlext-bordered-fields__icon-left > i ~ .mdlext-selectfield__label,
3009.mdlext-bordered-fields .mdl-textfield.mdlext-bordered-fields__icon-left > .mdl-button ~ .mdlext-selectfield__label,
3010.mdlext-bordered-fields .mdlext-selectfield.mdlext-bordered-fields__icon-left > i ~ .mdlext-selectfield__label,
3011.mdlext-bordered-fields .mdlext-selectfield.mdlext-bordered-fields__icon-left > .mdl-button ~ .mdlext-selectfield__label {
3012 left: 24px;
3013}
3014
3015.mdlext-bordered-fields .mdl-textfield.mdlext-bordered-fields__icon-right > .mdl-textfield__input,
3016.mdlext-bordered-fields .mdlext-selectfield.mdlext-bordered-fields__icon-right > .mdl-textfield__input {
3017 padding-right: 32px;
3018}
3019
3020.mdlext-bordered-fields .mdl-textfield.mdlext-bordered-fields__icon-right > i:last-child,
3021.mdlext-bordered-fields .mdl-textfield.mdlext-bordered-fields__icon-right > .mdl-button:last-child,
3022.mdlext-bordered-fields .mdlext-selectfield.mdlext-bordered-fields__icon-right > i:last-child,
3023.mdlext-bordered-fields .mdlext-selectfield.mdlext-bordered-fields__icon-right > .mdl-button:last-child {
3024 left: auto;
3025 right: 4px;
3026}
3027
3028.mdlext-bordered-fields .mdl-textfield.is-disabled i,
3029.mdlext-bordered-fields .mdl-textfield.is-disabled .mdl-button,
3030.mdlext-bordered-fields .mdlext-selectfield.is-disabled i,
3031.mdlext-bordered-fields .mdlext-selectfield.is-disabled .mdl-button {
3032 color: rgba(0, 0, 0, 0.12);
3033 pointer-events: none;
3034}
3035
3036.mdlext-bordered-fields fieldset[disabled] .mdl-textfield i,
3037.mdlext-bordered-fields fieldset[disabled] .mdl-textfield .mdl-button,
3038.mdlext-bordered-fields fieldset[disabled] .mdlext-selectfield i,
3039.mdlext-bordered-fields fieldset[disabled] .mdlext-selectfield .mdl-button {
3040 color: rgba(0, 0, 0, 0.12);
3041 pointer-events: none;
3042}
3043
3044/**
3045 * @license
3046 * Copyright 2016-2017 Leif Olsen. All Rights Reserved.
3047 *
3048 * Licensed under the Apache License, Version 2.0 (the "License");
3049 * you may not use this file except in compliance with the License.
3050 * You may obtain a copy of the License at
3051 *
3052 * http://www.apache.org/licenses/LICENSE-2.0
3053 *
3054 * Unless required by applicable law or agreed to in writing, software
3055 * distributed under the License is distributed on an "AS IS" BASIS,
3056 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
3057 * See the License for the specific language governing permissions and
3058 * limitations under the License.
3059 *
3060 * This code is built with Google Material Design Lite,
3061 * which is Licensed under the Apache License, Version 2.0
3062 */
3063
3064.mdlext-collapsible {
3065 box-sizing: border-box;
3066 cursor: pointer;
3067}
3068
3069.mdlext-collapsible-group,
3070.mdlext-collapsible-region {
3071 box-sizing: border-box;
3072}
3073
3074.mdlext-collapsible-group[hidden],
3075.mdlext-collapsible-region[hidden] {
3076 border: 0;
3077 clip: rect(0 0 0 0);
3078 height: 1px;
3079 margin: -1px;
3080 overflow: hidden;
3081 padding: 0;
3082 position: absolute;
3083 width: 1px;
3084 pointer-events: none;
3085}
3086
3087/**
3088 * @license
3089 * Copyright 2016 Leif Olsen. All Rights Reserved.
3090 *
3091 * Licensed under the Apache License, Version 2.0 (the "License");
3092 * you may not use this file except in compliance with the License.
3093 * You may obtain a copy of the License at
3094 *
3095 * http://www.apache.org/licenses/LICENSE-2.0
3096 *
3097 * Unless required by applicable law or agreed to in writing, software
3098 * distributed under the License is distributed on an "AS IS" BASIS,
3099 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
3100 * See the License for the specific language governing permissions and
3101 * limitations under the License.
3102 *
3103 * This code is built with Google Material Design Lite,
3104 * which is Licensed under the Apache License, Version 2.0
3105 */
3106
3107.mdlext-aria-toggle-plus-minus {
3108 font-family: inherit;
3109 font-weight: inherit;
3110 font-style: inherit;
3111 font-size: 1.4em;
3112 display: inline-block;
3113 width: 1em;
3114 height: 1em;
3115 line-height: 1;
3116 text-transform: none;
3117 letter-spacing: normal;
3118 word-wrap: normal;
3119 white-space: nowrap;
3120 direction: ltr;
3121 vertical-align: middle;
3122 -webkit-font-smoothing: antialiased;
3123 -webkit-font-feature-settings: 'liga';
3124 text-rendering: optimizeLegibility;
3125 -moz-osx-font-smoothing: grayscale;
3126 font-feature-settings: 'liga';
3127}
3128
3129.mdlext-aria-toggle-plus-minus::after {
3130 content: "+";
3131 margin-left: 0;
3132}
3133
3134[aria-expanded='true'] > .mdlext-aria-toggle-plus-minus::after {
3135 content: "-";
3136 margin-left: 0;
3137}
3138
3139.mdlext-aria-toggle-material-icons {
3140 font-family: "Material Icons";
3141 font-weight: inherit;
3142 font-style: inherit;
3143 font-size: 1.3em;
3144 display: inline-block;
3145 width: 1em;
3146 height: 1em;
3147 line-height: 1;
3148 text-transform: none;
3149 letter-spacing: normal;
3150 word-wrap: normal;
3151 white-space: nowrap;
3152 direction: ltr;
3153 vertical-align: middle;
3154 -webkit-font-smoothing: antialiased;
3155 -webkit-font-feature-settings: 'liga';
3156 text-rendering: optimizeLegibility;
3157 -moz-osx-font-smoothing: grayscale;
3158 font-feature-settings: 'liga';
3159}
3160
3161.mdlext-aria-toggle-material-icons::after {
3162 content: "expand_more";
3163 margin-left: -8px;
3164}
3165
3166[aria-expanded='true'] > .mdlext-aria-toggle-material-icons::after {
3167 content: "expand_less";
3168 margin-left: -8px;
3169}
3170
3171.mdlext-accordion {
3172 box-sizing: border-box;
3173 margin: 0;
3174 padding: 0;
3175 list-style: none;
3176 display: -ms-flexbox;
3177 display: flex;
3178}
3179
3180.mdlext-accordion * {
3181 box-sizing: border-box;
3182}
3183
3184.mdlext-accordion__panel {
3185 box-sizing: border-box;
3186 position: relative;
3187 overflow: hidden;
3188 display: -ms-flexbox;
3189 display: flex;
3190 -ms-flex-wrap: nowrap;
3191 flex-wrap: nowrap;
3192}
3193
3194.mdlext-accordion__tab {
3195 font-family: "Roboto", "Helvetica", "Arial", sans-serif;
3196 font-size: 20px;
3197 font-weight: 500;
3198 line-height: 1;
3199 letter-spacing: 0.02em;
3200 font-weight: 400;
3201 line-height: 1.1;
3202 box-sizing: border-box;
3203 position: relative;
3204 margin: 0;
3205 padding: 0;
3206 min-width: 56px;
3207 min-height: 56px;
3208 display: -ms-flexbox;
3209 display: flex;
3210 -ms-flex-align: center;
3211 align-items: center;
3212 -ms-flex-item-align: stretch;
3213 align-self: stretch;
3214 -webkit-user-select: none;
3215 -moz-user-select: none;
3216 -ms-user-select: none;
3217 user-select: none;
3218 color: #000000;
3219 background-color: rgba(158, 158, 158, 0.2);
3220 cursor: pointer;
3221 overflow: hidden;
3222}
3223
3224.mdlext-accordion__tab:focus {
3225 outline-offset: -2px;
3226 outline-color: invert;
3227 outline-width: 2px;
3228}
3229
3230.mdlext-accordion__tab[aria-expanded='true'] {
3231 background-color: rgba(158, 158, 158, 0.3);
3232}
3233
3234.mdlext-accordion__tab[aria-selected='true'] {
3235 background-color: rgba(158, 158, 158, 0.4);
3236}
3237
3238.mdlext-accordion__tab[disabled] {
3239 background-color: rgba(158, 158, 158, 0.12);
3240 color: rgba(0, 0, 0, 0.26);
3241 pointer-events: none;
3242}
3243
3244.mdlext-accordion__tab[disabled] > * {
3245 color: rgba(0, 0, 0, 0.26);
3246}
3247
3248.mdlext-accordion__tab:hover:not([disabled]) {
3249 background-color: rgba(158, 158, 158, 0.4);
3250}
3251
3252.mdlext-accordion__tab > * {
3253 margin: 0;
3254 padding: 0;
3255}
3256
3257.mdlext-accordion__tab__caption {
3258 padding-left: 8px;
3259 padding-right: 8px;
3260 white-space: nowrap;
3261 overflow: hidden;
3262 text-overflow: ellipsis;
3263}
3264
3265.mdlext-accordion__tab > *:first-child {
3266 padding-left: 0;
3267}
3268
3269.mdlext-accordion__tab--ripple[aria-selected='true']::before {
3270 content: '';
3271 position: absolute;
3272 top: 50%;
3273 left: 50%;
3274 background: rgba(255, 255, 255, 0.5);
3275 opacity: 0;
3276 border-radius: 100%;
3277 transform: scale(1, 1) translate(-50%);
3278 transform-origin: 50% 50%;
3279}
3280
3281.mdlext-accordion__tab--ripple[aria-selected='true']:focus:not(:active)::before {
3282 animation: mdlext-accordion-tab-ripple 1s cubic-bezier(0.4, 0, 0.4, 1) 0.01s alternate forwards;
3283}
3284
3285.mdlext-accordion__tabpanel {
3286 box-sizing: border-box;
3287 margin: 0;
3288 padding: 0 8px;
3289 color: inherit;
3290 background-color: transparent;
3291 display: block;
3292 overflow: auto;
3293 -ms-flex-positive: 1;
3294 flex-grow: 1;
3295}
3296
3297.mdlext-accordion__tabpanel[hidden] {
3298 border: 0;
3299 clip: rect(0 0 0 0);
3300 height: 1px;
3301 margin: -1px;
3302 overflow: hidden;
3303 padding: 0;
3304 position: absolute;
3305 width: 1px;
3306}
3307
3308.mdlext-accordion--vertical {
3309 -ms-flex-direction: column;
3310 flex-direction: column;
3311 -ms-flex-wrap: nowrap;
3312 flex-wrap: nowrap;
3313}
3314
3315.mdlext-accordion--vertical .mdlext-accordion__panel {
3316 min-height: 56px;
3317 -ms-flex-direction: column;
3318 flex-direction: column;
3319}
3320
3321.mdlext-accordion--vertical .mdlext-accordion__tab {
3322 height: 56px;
3323 border-top: 1px solid rgba(158, 158, 158, 0.5);
3324 padding-left: 8px;
3325 padding-right: 8px;
3326}
3327
3328.mdlext-accordion--vertical .mdlext-accordion__tab[aria-selected='true']::after {
3329 position: absolute;
3330 bottom: 0;
3331 left: 0;
3332 height: 1px;
3333 width: 100%;
3334 display: block;
3335 content: " ";
3336 background-color: rgba(150, 150, 150, 0.5);
3337 animation: border-expand 0.2s cubic-bezier(0.4, 0, 0.4, 1) 0.01s alternate forwards;
3338 transition: all 1s cubic-bezier(0.4, 0, 1, 1);
3339}
3340
3341.mdlext-accordion--vertical .mdlext-accordion__tab > * {
3342 padding-left: 8px;
3343}
3344
3345.mdlext-accordion--vertical .mdlext-accordion__tab > *:first-child {
3346 padding-left: 0;
3347}
3348
3349.mdlext-accordion--vertical .mdlext-accordion__tab > *:last-child:not(:only-child):not(.mdlext-accordion__tab__caption) {
3350 margin-left: auto;
3351}
3352
3353.mdlext-accordion--vertical .mdlext-accordion__tab--ripple[aria-selected='true']::before {
3354 width: 5%;
3355 height: 10%;
3356}
3357
3358.mdlext-accordion--vertical .mdlext-accordion__tabpanel {
3359 border-top: 1px solid rgba(158, 158, 158, 0.5);
3360}
3361
3362.mdlext-accordion--vertical .mdlext-accordion__tabpanel--animation {
3363 transform: scaleY(1);
3364 animation: mdlext-accordion-show-tabpanel-y 0.2s ease-in-out;
3365}
3366
3367.mdlext-accordion--vertical .mdlext-accordion__tabpanel--animation[hidden] {
3368 transform: scaleY(0);
3369 animation: mdlext-accordion-hide-tabpanel-y 0.2s ease-out;
3370 animation-delay: 0.1s;
3371}
3372
3373.mdlext-accordion--horizontal .mdlext-accordion__panel {
3374 min-width: 56px;
3375 width: 56px;
3376}
3377
3378.mdlext-accordion--horizontal[aria-multiselectable='true'] .mdlext-accordion__panel.is-expanded {
3379 width: 100%;
3380}
3381
3382.mdlext-accordion--horizontal .mdlext-accordion__tab {
3383 -ms-flex-direction: column-reverse;
3384 flex-direction: column-reverse;
3385 width: 56px;
3386 white-space: nowrap;
3387 border-left: 1px solid rgba(158, 158, 158, 0.5);
3388}
3389
3390.mdlext-accordion--horizontal .mdlext-accordion__tab[aria-selected='true']::after {
3391 position: absolute;
3392 top: 0;
3393 right: 0;
3394 height: 100%;
3395 width: 1px;
3396 display: block;
3397 content: " ";
3398 background-color: rgba(150, 150, 150, 0.5);
3399}
3400
3401.mdlext-accordion--horizontal .mdlext-accordion__tab > * {
3402 transform: rotate(-90deg) translateX(8px);
3403}
3404
3405.mdlext-accordion--horizontal .mdlext-accordion__tab > *:last-child:not(:only-child):not(.mdlext-accordion__tab__caption) {
3406 margin-bottom: auto;
3407 transform: rotate(-90deg) translateX(0);
3408}
3409
3410.mdlext-accordion--horizontal .mdlext-accordion__tab__caption {
3411 transform: rotate(-90deg) translateX(50%);
3412 padding-right: 16px;
3413}
3414
3415.mdlext-accordion--horizontal .mdlext-accordion__tab--ripple[aria-selected='true']::before {
3416 width: 10%;
3417 height: 5%;
3418}
3419
3420.mdlext-accordion--horizontal .mdlext-accordion__tabpanel {
3421 border-left: 1px solid rgba(158, 158, 158, 0.5);
3422}
3423
3424.mdlext-accordion--horizontal .mdlext-accordion__tabpanel--animation {
3425 transform: scaleX(1);
3426 animation: mdlext-accordion-show-tabpanel-x 0.2s ease-in-out;
3427}
3428
3429.mdlext-accordion--horizontal .mdlext-accordion__tabpanel--animation[hidden] {
3430 transform: scaleX(0);
3431 animation: mdlext-accordion-hide-tabpanel-x 0.2s ease-out;
3432}
3433
3434.mdlext-accordion__panel:first-child > .mdlext-accordion__tab {
3435 border-top-color: transparent;
3436 border-left-color: transparent;
3437}
3438
3439.mdlext-accordion[aria-multiselectable="false"] .mdlext-accordion__panel.is-expanded {
3440 -ms-flex-positive: 1;
3441 flex-grow: 1;
3442}
3443
3444.mdlext-accordion[disabled] * {
3445 pointer-events: none;
3446}
3447
3448.mdlext-accordion[disabled] .mdlext-accordion__tab {
3449 background-color: rgba(158, 158, 158, 0.12);
3450 color: rgba(0, 0, 0, 0.26);
3451}
3452
3453.mdlext-accordion[disabled] .mdlext-accordion__tab > * {
3454 color: rgba(0, 0, 0, 0.26);
3455}
3456
3457.mdlext-accordion[disabled] .mdlext-accordion__tabpanel {
3458 opacity: 0.8;
3459 filter: blur(1px) grayscale(80%);
3460}
3461
3462@keyframes mdlext-accordion-tab-ripple {
3463 0% {
3464 transform: scale(0, 0);
3465 opacity: 1;
3466 }
3467
3468 20% {
3469 transform: scale(25, 25);
3470 opacity: 1;
3471 }
3472
3473 100% {
3474 opacity: 0;
3475 transform: scale(40, 40);
3476 }
3477}
3478
3479/*
3480@keyframes mdlext-accordion-show-tabpanel-y {
3481 0% { transform: scaleY(0.1); }
3482 40% { transform: scaleY(1.03); }
3483 60% { transform: scaleY(0.98); }
3484 80% { transform: scaleY(1.03); }
3485 100% { transform: scaleY(0.98); }
3486 80% { transform: scaleY(1.01); }
3487 100% { transform: scaleY(1); }
3488}
3489*/
3490
3491@keyframes mdlext-accordion-show-tabpanel-y {
3492 0% {
3493 transform: scaleY(0);
3494 }
3495
3496 60% {
3497 transform: scaleY(1.01);
3498 }
3499
3500 80% {
3501 transform: scaleY(0.98);
3502 }
3503
3504 100% {
3505 transform: scaleY(1);
3506 }
3507}
3508
3509@keyframes mdlext-accordion-hide-tabpanel-y {
3510 0% {
3511 transform: scaleY(1);
3512 }
3513
3514 60% {
3515 transform: scaleY(0.98);
3516 }
3517
3518 80% {
3519 transform: scaleY(1.01);
3520 }
3521
3522 100% {
3523 transform: scaleY(0);
3524 }
3525}
3526
3527/*
3528@keyframes mdlext-accordion-show-tabpanel-x {
3529 0% { transform: scaleX(0.1); }
3530 40% { transform: scaleX(1.03); }
3531 60% { transform: scaleX(0.98); }
3532 80% { transform: scaleX(1.03); }
3533 100% { transform: scaleX(0.98); }
3534 80% { transform: scaleX(1.01); }
3535 100% { transform: scaleX(1); }
3536}
3537*/
3538
3539@keyframes mdlext-accordion-show-tabpanel-x {
3540 0% {
3541 transform: scaleX(0);
3542 }
3543
3544 60% {
3545 transform: scaleX(1.01);
3546 }
3547
3548 80% {
3549 transform: scaleX(0.98);
3550 }
3551
3552 100% {
3553 transform: scaleX(1);
3554 }
3555}
3556
3557@keyframes mdlext-accordion-hide-tabpanel-x {
3558 0% {
3559 transform: scaleX(1);
3560 }
3561
3562 60% {
3563 transform: scaleX(0.98);
3564 }
3565
3566 80% {
3567 transform: scaleX(1.01);
3568 }
3569
3570 100% {
3571 transform: scaleX(0);
3572 }
3573}
3574
3575/* -------------------------------------------------------------
3576 Palette samples. Not part of build
3577----------------------------------------------------------------
3578
3579$mdlext-light-color-primary: #9E9E9E !default;
3580$mdlext-light-color-primary-dark: #616161 !default;
3581$mdlext-light-color-primary-light: #9E9E9E !default; // Fallback color. Set to color-primary if fallback is not needed
3582$mdlext-light-color-primary-contrast: #212121 !default; // text color on primary/primary dark background
3583$mdlext-light-color-accent: #E040FB !default;
3584$mdlext-light-color-accent-light: #E040FB !default; // Fallback color. Set to color-accent if fallback is not needed
3585$mdlext-light-color-accent-contrast: #FAFAFA !default;
3586
3587$mdlext-light-color-primary: #F5F5F5 !default;
3588$mdlext-light-color-primary-dark: #E0E0E0 !default;
3589$mdlext-light-color-primary-light: #8BC34A !default; // Fallback color. Set to color-primary if fallback is not needed
3590$mdlext-light-color-primary-contrast: #000000 !default; // text color on primary/primary dark background
3591$mdlext-light-color-accent: #FFC107 !default;
3592$mdlext-light-color-accent-light: #FFC107 !default; // Fallback color. Set to color-accent if fallback is not needed
3593$mdlext-light-color-accent-contrast: #FFFFFF !default;
3594
3595
3596$mdlext-light-color-primary: #673AB7 !default;
3597$mdlext-light-color-primary-dark: #512DA8 !default;
3598$mdlext-light-color-primary-light: #673AB7 !default; // Fallback color. Set to color-primary if fallback is not needed
3599$mdlext-light-color-primary-contrast: #D1C4E9 !default; // text color on primary/primary dark background
3600$mdlext-light-color-accent: #4CAF50 !default;
3601$mdlext-light-color-accent-light: #4CAF50 !default; // Fallback color. Set to color-accent if fallback is not needed
3602$mdlext-light-color-accent-contrast: #FFFFFF !default;
3603
3604
3605$mdlext-light-color-primary: #4CAF50 !default;
3606$mdlext-light-color-primary-dark: #388E3C !default;
3607$mdlext-light-color-primary-light: #4CAF50 !default; // Fallback color. Set to color-primary if fallback is not needed
3608$mdlext-light-color-primary-contrast: #C8E6C9 !default; // text color on primary/primary dark background
3609$mdlext-light-color-accent: #FF5252 !default;
3610$mdlext-light-color-accent-light: #FF5252 !default; // Fallback color. Set to color-accent if fallback is not needed
3611$mdlext-light-color-accent-contrast: #FFFFFF !default;
3612
3613
3614$mdlext-light-color-primary: #4CAF50 !default;
3615$mdlext-light-color-primary-dark: #388E3C !default;
3616$mdlext-light-color-primary-light: #4CAF50 !default; // Fallback color. Set to color-primary if fallback is not needed
3617$mdlext-light-color-primary-contrast: #C8E6C9 !default; // text color on primary/primary dark background
3618$mdlext-light-color-accent: #03A9F4 !default;
3619$mdlext-light-color-accent-light: #03A9F4 !default; // Fallback color. Set to color-accent if fallback is not needed
3620$mdlext-light-color-accent-contrast: #FFFFFF !default;
3621
3622
3623$mdlext-dark-color-primary: #212121 !default;
3624$mdlext-dark-color-primary-dark: #000000 !default;
3625$mdlext-dark-color-primary-light: #607D8B !default; // Fallback color. Set to color-primary if fallback is not needed
3626$mdlext-dark-color-primary-contrast: #FFFFFF !default; // text color on primary/primary dark background
3627$mdlext-dark-color-accent: #FF5722 !default;
3628$mdlext-dark-color-accent-light: #FF5722 !default; // Fallback color. Set to color-accent if fallback is not needed
3629$mdlext-dark-color-accent-contrast: #FFFFFF !default;
3630
3631*/
3632
3633.mdlext-light-color-theme {
3634 background-color: #FAFAFA;
3635 color: rgba(0, 0, 0, 0.87);
3636}
3637
3638.mdlext-light-color-theme a {
3639 outline-color: inherit;
3640}
3641
3642.mdlext-light-color-theme .mdl-color--primary {
3643 background-color: #4CAF50 !important;
3644}
3645
3646.mdlext-light-color-theme .mdl-color--primary-contrast {
3647 background-color: #C8E6C9 !important;
3648}
3649
3650.mdlext-light-color-theme .mdl-color--primary-dark {
3651 background-color: #388E3C !important;
3652}
3653
3654.mdlext-light-color-theme .mdl-color--accent {
3655 background-color: #E040FB !important;
3656}
3657
3658.mdlext-light-color-theme .mdl-color--accent-contrast {
3659 background-color: #FAFAFA !important;
3660}
3661
3662.mdlext-light-color-theme .mdl-color-text--primary {
3663 color: #4CAF50 !important;
3664}
3665
3666.mdlext-light-color-theme .mdl-color-text--primary-contrast {
3667 color: #C8E6C9 !important;
3668}
3669
3670.mdlext-light-color-theme .mdl-color-text--primary-dark {
3671 color: #388E3C !important;
3672}
3673
3674.mdlext-light-color-theme .mdl-color-text--accent {
3675 color: #E040FB !important;
3676}
3677
3678.mdlext-light-color-theme .mdl-color-text--accent-contrast {
3679 color: #FAFAFA !important;
3680}
3681
3682.mdlext-light-color-theme a {
3683 color: #E040FB;
3684}
3685
3686.mdlext-light-color-theme .mdl-badge[data-badge]::after {
3687 background: #E040FB;
3688 color: #FAFAFA;
3689}
3690
3691.mdlext-light-color-theme .mdl-badge.mdl-badge--no-background[data-badge]::after {
3692 color: #E040FB;
3693 background: #FAFAFA;
3694}
3695
3696.mdlext-light-color-theme .mdl-button {
3697 background: transparent;
3698 color: #000000;
3699}
3700
3701.mdlext-light-color-theme .mdl-button:hover {
3702 background-color: rgba(158, 158, 158, 0.2);
3703}
3704
3705.mdlext-light-color-theme .mdl-button:focus:not(:active) {
3706 background-color: rgba(0, 0, 0, 0.12);
3707}
3708
3709.mdlext-light-color-theme .mdl-button:active {
3710 background-color: rgba(158, 158, 158, 0.4);
3711}
3712
3713.mdlext-light-color-theme .mdl-button.mdl-button--colored {
3714 color: #4CAF50;
3715}
3716
3717.mdlext-light-color-theme .mdl-button.mdl-button--colored:focus:not(:active) {
3718 background-color: rgba(0, 0, 0, 0.12);
3719}
3720
3721.mdlext-light-color-theme .mdl-button--raised {
3722 background: rgba(158, 158, 158, 0.2);
3723}
3724
3725.mdlext-light-color-theme .mdl-button--raised:active {
3726 background-color: rgba(158, 158, 158, 0.4);
3727}
3728
3729.mdlext-light-color-theme .mdl-button--raised:focus:not(:active) {
3730 background-color: rgba(158, 158, 158, 0.4);
3731}
3732
3733.mdlext-light-color-theme .mdl-button--raised.mdl-button--colored {
3734 background: #4CAF50;
3735 color: #C8E6C9;
3736}
3737
3738.mdlext-light-color-theme .mdl-button--raised.mdl-button--colored:hover {
3739 background-color: #3d8b40;
3740}
3741
3742.mdlext-light-color-theme .mdl-button--raised.mdl-button--colored:active {
3743 background-color: #3d8b40;
3744}
3745
3746.mdlext-light-color-theme .mdl-button--raised.mdl-button--colored:focus:not(:active) {
3747 background-color: #3d8b40;
3748}
3749
3750.mdlext-light-color-theme .mdl-button--raised.mdl-button--colored .mdl-ripple {
3751 background: #C8E6C9;
3752}
3753
3754.mdlext-light-color-theme .mdl-button--fab {
3755 background: rgba(158, 158, 158, 0.2);
3756}
3757
3758.mdlext-light-color-theme .mdl-button--fab:active {
3759 background-color: rgba(158, 158, 158, 0.4);
3760}
3761
3762.mdlext-light-color-theme .mdl-button--fab:focus:not(:active) {
3763 background-color: rgba(158, 158, 158, 0.4);
3764}
3765
3766.mdlext-light-color-theme .mdl-button--fab.mdl-button--colored {
3767 background: #E040FB;
3768 color: #FAFAFA;
3769}
3770
3771.mdlext-light-color-theme .mdl-button--fab.mdl-button--colored:hover {
3772 background-color: #E040FB;
3773}
3774
3775.mdlext-light-color-theme .mdl-button--fab.mdl-button--colored:focus:not(:active) {
3776 background-color: #E040FB;
3777}
3778
3779.mdlext-light-color-theme .mdl-button--fab.mdl-button--colored:active {
3780 background-color: #E040FB;
3781}
3782
3783.mdlext-light-color-theme .mdl-button--fab.mdl-button--colored .mdl-ripple {
3784 background: #FAFAFA;
3785}
3786
3787.mdlext-light-color-theme .mdl-button--icon {
3788 color: inherit;
3789}
3790
3791.mdlext-light-color-theme .mdl-button--primary.mdl-button--primary {
3792 color: #4CAF50;
3793}
3794
3795.mdlext-light-color-theme .mdl-button--primary.mdl-button--primary .mdl-ripple {
3796 background: #C8E6C9;
3797}
3798
3799.mdlext-light-color-theme .mdl-button--primary.mdl-button--primary.mdl-button--raised,
3800.mdlext-light-color-theme .mdl-button--primary.mdl-button--primary.mdl-button--fab {
3801 color: #C8E6C9;
3802 background-color: #4CAF50;
3803}
3804
3805.mdlext-light-color-theme .mdl-button--accent.mdl-button--accent {
3806 color: #E040FB;
3807}
3808
3809.mdlext-light-color-theme .mdl-button--accent.mdl-button--accent .mdl-ripple {
3810 background: #FAFAFA;
3811}
3812
3813.mdlext-light-color-theme .mdl-button--accent.mdl-button--accent.mdl-button--raised,
3814.mdlext-light-color-theme .mdl-button--accent.mdl-button--accent.mdl-button--fab {
3815 color: #FAFAFA;
3816 background-color: #E040FB;
3817}
3818
3819.mdlext-light-color-theme .mdl-button[disabled][disabled],
3820.mdlext-light-color-theme .mdl-button.mdl-button--disabled.mdl-button--disabled {
3821 color: rgba(0, 0, 0, 0.26);
3822 background-color: transparent;
3823}
3824
3825.mdlext-light-color-theme .mdl-button--fab[disabled][disabled],
3826.mdlext-light-color-theme .mdl-button--fab.mdl-button--disabled.mdl-button--disabled {
3827 background-color: rgba(0, 0, 0, 0.12);
3828 color: rgba(0, 0, 0, 0.26);
3829}
3830
3831.mdlext-light-color-theme .mdl-button--raised[disabled][disabled],
3832.mdlext-light-color-theme .mdl-button--raised.mdl-button--disabled.mdl-button--disabled {
3833 background-color: rgba(0, 0, 0, 0.12);
3834 color: rgba(0, 0, 0, 0.26);
3835}
3836
3837.mdlext-light-color-theme .mdl-button--colored[disabled][disabled],
3838.mdlext-light-color-theme .mdl-button--colored.mdl-button--disabled.mdl-button--disabled {
3839 color: rgba(0, 0, 0, 0.26);
3840}
3841
3842.mdlext-light-color-theme .mdl-slider.is-upgraded {
3843 background: transparent;
3844 color: #E040FB;
3845 /* stylelint-disable */
3846 /* stylelint-enable */
3847 /**************************** Thumbs ****************************/
3848 /* stylelint-disable */
3849 /* stylelint-enable */
3850 /**************************** 0-value ****************************/
3851 /* stylelint-disable */
3852 /* stylelint-enable */
3853 /**************************** Disabled ****************************/
3854 /* stylelint-disable */
3855 /* stylelint-enable */
3856}
3857
3858.mdlext-light-color-theme .mdl-slider.is-upgraded::-webkit-slider-runnable-track {
3859 background: transparent;
3860}
3861
3862.mdlext-light-color-theme .mdl-slider.is-upgraded::-moz-range-track {
3863 background: transparent;
3864}
3865
3866.mdlext-light-color-theme .mdl-slider.is-upgraded::-ms-track {
3867 background: none;
3868 color: transparent;
3869}
3870
3871.mdlext-light-color-theme .mdl-slider.is-upgraded::-ms-fill-lower {
3872 background: linear-gradient(to right, transparent, transparent 16px, #E040FB 16px, #E040FB 0);
3873}
3874
3875.mdlext-light-color-theme .mdl-slider.is-upgraded::-ms-fill-upper {
3876 background: linear-gradient(to left, transparent, transparent 16px, rgba(0, 0, 0, 0.26) 16px, rgba(0, 0, 0, 0.26) 0);
3877}
3878
3879.mdlext-light-color-theme .mdl-slider.is-upgraded::-webkit-slider-thumb {
3880 background: #E040FB;
3881}
3882
3883.mdlext-light-color-theme .mdl-slider.is-upgraded::-moz-range-thumb {
3884 background: #E040FB;
3885}
3886
3887.mdlext-light-color-theme .mdl-slider.is-upgraded:focus:not(:active)::-webkit-slider-thumb {
3888 box-shadow: 0 0 0 10px rgba(224, 64, 251, 0.26);
3889}
3890
3891.mdlext-light-color-theme .mdl-slider.is-upgraded:focus:not(:active)::-moz-range-thumb {
3892 box-shadow: 0 0 0 10px rgba(224, 64, 251, 0.26);
3893}
3894
3895.mdlext-light-color-theme .mdl-slider.is-upgraded:active::-webkit-slider-thumb {
3896 background: #E040FB;
3897}
3898
3899.mdlext-light-color-theme .mdl-slider.is-upgraded:active::-moz-range-thumb {
3900 background: #E040FB;
3901}
3902
3903.mdlext-light-color-theme .mdl-slider.is-upgraded::-ms-thumb {
3904 background: #E040FB;
3905}
3906
3907.mdlext-light-color-theme .mdl-slider.is-upgraded:focus:not(:active)::-ms-thumb {
3908 background: radial-gradient(circle closest-side, #E040FB 0%, #E040FB 37.5%, rgba(224, 64, 251, 0.26) 37.5%, rgba(224, 64, 251, 0.26) 100%);
3909}
3910
3911.mdlext-light-color-theme .mdl-slider.is-upgraded:active::-ms-thumb {
3912 background: #E040FB;
3913}
3914
3915.mdlext-light-color-theme .mdl-slider.is-upgraded.is-lowest-value::-webkit-slider-thumb {
3916 border-color: #E040FB;
3917 background: transparent;
3918}
3919
3920.mdlext-light-color-theme .mdl-slider.is-upgraded.is-lowest-value::-moz-range-thumb {
3921 border-color: rgba(0, 0, 0, 0.26);
3922 background: transparent;
3923}
3924
3925.mdlext-light-color-theme .mdl-slider.is-upgraded.is-lowest-value:focus:not(:active)::-webkit-slider-thumb {
3926 box-shadow: 0 0 0 10px rgba(0, 0, 0, 0.12);
3927 background: rgba(0, 0, 0, 0.12);
3928}
3929
3930.mdlext-light-color-theme .mdl-slider.is-upgraded.is-lowest-value:focus:not(:active)::-moz-range-thumb {
3931 box-shadow: 0 0 0 10px rgba(0, 0, 0, 0.12);
3932 background: rgba(0, 0, 0, 0.12);
3933}
3934
3935.mdlext-light-color-theme .mdl-slider.is-upgraded.is-lowest-value:active::-webkit-slider-thumb {
3936 border-color: rgba(0, 0, 0, 0.26);
3937}
3938
3939.mdlext-light-color-theme .mdl-slider.is-upgraded.is-lowest-value:active::-moz-range-thumb {
3940 border-color: rgba(0, 0, 0, 0.26);
3941}
3942
3943.mdlext-light-color-theme .mdl-slider.is-upgraded.is-lowest-value::-ms-thumb {
3944 background: radial-gradient(circle closest-side, transparent 0%, transparent 66.67%, rgba(0, 0, 0, 0.26) 66.67%, rgba(0, 0, 0, 0.26) 100%);
3945}
3946
3947.mdlext-light-color-theme .mdl-slider.is-upgraded.is-lowest-value:focus:not(:active)::-ms-thumb {
3948 background: radial-gradient(circle closest-side, rgba(0, 0, 0, 0.12) 0%, rgba(0, 0, 0, 0.12) 25%, rgba(0, 0, 0, 0.26) 25%, rgba(0, 0, 0, 0.26) 37.5%, rgba(0, 0, 0, 0.12) 37.5%, rgba(0, 0, 0, 0.12) 100%);
3949}
3950
3951.mdlext-light-color-theme .mdl-slider.is-upgraded.is-lowest-value:active::-ms-thumb {
3952 background: radial-gradient(circle closest-side, transparent 0%, transparent 77.78%, rgba(0, 0, 0, 0.26) 77.78%, rgba(0, 0, 0, 0.26) 100%);
3953}
3954
3955.mdlext-light-color-theme .mdl-slider.is-upgraded.is-lowest-value::-ms-fill-lower {
3956 background: transparent;
3957}
3958
3959.mdlext-light-color-theme .mdl-slider.is-upgraded:disabled:focus::-webkit-slider-thumb,
3960.mdlext-light-color-theme .mdl-slider.is-upgraded:disabled:active::-webkit-slider-thumb,
3961.mdlext-light-color-theme .mdl-slider.is-upgraded:disabled::-webkit-slider-thumb {
3962 background: rgba(0, 0, 0, 0.26);
3963}
3964
3965.mdlext-light-color-theme .mdl-slider.is-upgraded:disabled:focus::-moz-range-thumb,
3966.mdlext-light-color-theme .mdl-slider.is-upgraded:disabled:active::-moz-range-thumb,
3967.mdlext-light-color-theme .mdl-slider.is-upgraded:disabled::-moz-range-thumb {
3968 background: rgba(0, 0, 0, 0.26);
3969}
3970
3971.mdlext-light-color-theme .mdl-slider.is-upgraded:disabled + .mdl-slider__background-flex > .mdl-slider__background-lower {
3972 background-color: rgba(0, 0, 0, 0.26);
3973}
3974
3975.mdlext-light-color-theme .mdl-slider.is-upgraded.is-lowest-value:disabled:focus::-webkit-slider-thumb,
3976.mdlext-light-color-theme .mdl-slider.is-upgraded.is-lowest-value:disabled:active::-webkit-slider-thumb,
3977.mdlext-light-color-theme .mdl-slider.is-upgraded.is-lowest-value:disabled::-webkit-slider-thumb {
3978 border-color: rgba(0, 0, 0, 0.26);
3979 background: transparent;
3980}
3981
3982.mdlext-light-color-theme .mdl-slider.is-upgraded.is-lowest-value:disabled:focus::-moz-range-thumb,
3983.mdlext-light-color-theme .mdl-slider.is-upgraded.is-lowest-value:disabled:active::-moz-range-thumb,
3984.mdlext-light-color-theme .mdl-slider.is-upgraded.is-lowest-value:disabled::-moz-range-thumb {
3985 border-color: rgba(0, 0, 0, 0.26);
3986 background: transparent;
3987}
3988
3989.mdlext-light-color-theme .mdl-slider.is-upgraded:disabled:focus::-ms-thumb,
3990.mdlext-light-color-theme .mdl-slider.is-upgraded:disabled:active::-ms-thumb,
3991.mdlext-light-color-theme .mdl-slider.is-upgraded:disabled::-ms-thumb {
3992 background: rgba(0, 0, 0, 0.26);
3993}
3994
3995.mdlext-light-color-theme .mdl-slider.is-upgraded.is-lowest-value:disabled:focus::-ms-thumb,
3996.mdlext-light-color-theme .mdl-slider.is-upgraded.is-lowest-value:disabled:active::-ms-thumb,
3997.mdlext-light-color-theme .mdl-slider.is-upgraded.is-lowest-value:disabled::-ms-thumb {
3998 background: radial-gradient(circle closest-side, transparent 0%, transparent 50%, rgba(0, 0, 0, 0.26) 50%, rgba(0, 0, 0, 0.26) 100%);
3999}
4000
4001.mdlext-light-color-theme .mdl-slider.is-upgraded:disabled::-ms-fill-lower {
4002 background: linear-gradient(to right, transparent, transparent 25px, rgba(0, 0, 0, 0.26) 25px, rgba(0, 0, 0, 0.26) 0);
4003}
4004
4005.mdlext-light-color-theme .mdl-slider__background-flex {
4006 background: transparent;
4007}
4008
4009.mdlext-light-color-theme .mdl-slider__background-lower {
4010 background: #E040FB;
4011}
4012
4013.mdlext-light-color-theme .mdl-slider__background-upper {
4014 background: rgba(0, 0, 0, 0.26);
4015}
4016
4017.mdlext-light-color-theme .mdl-textfield__input {
4018 border-bottom-color: rgba(0, 0, 0, 0.26);
4019}
4020
4021.mdlext-light-color-theme .mdl-textfield.is-invalid .mdl-textfield__input {
4022 border-color: #D32F2F;
4023}
4024
4025.mdlext-light-color-theme fieldset[disabled] .mdl-textfield .mdl-textfield__input,
4026.mdlext-light-color-theme .mdl-textfield.is-disabled .mdl-textfield__input {
4027 background-color: transparent;
4028 border-bottom-color: rgba(0, 0, 0, 0.12);
4029 color: rgba(0, 0, 0, 0.26);
4030}
4031
4032.mdlext-light-color-theme .mdl-textfield__label {
4033 color: rgba(0, 0, 0, 0.54);
4034}
4035
4036.mdlext-light-color-theme .mdl-textfield__label::after {
4037 background-color: #E040FB;
4038}
4039
4040.mdlext-light-color-theme fieldset[disabled] .mdl-textfield .mdl-textfield__label,
4041.mdlext-light-color-theme .mdl-textfield.is-disabled.is-disabled .mdl-textfield__label {
4042 color: rgba(0, 0, 0, 0.26);
4043}
4044
4045.mdlext-light-color-theme .mdl-textfield--floating-label.is-focused .mdl-textfield__label,
4046.mdlext-light-color-theme .mdl-textfield--floating-label.is-dirty .mdl-textfield__label,
4047.mdlext-light-color-theme .mdl-textfield--floating-label.has-placeholder .mdl-textfield__label {
4048 color: #E040FB;
4049}
4050
4051.mdlext-light-color-theme .mdl-textfield--floating-label.is-invalid .mdl-textfield__label {
4052 color: #D32F2F;
4053}
4054
4055.mdlext-light-color-theme .mdl-textfield.is-invalid .mdl-textfield__label::after {
4056 background-color: #D32F2F;
4057}
4058
4059.mdlext-light-color-theme .mdl-textfield__error {
4060 color: #D32F2F;
4061}
4062
4063.mdlext-light-color-theme .mdl-checkbox__box-outline {
4064 border-color: rgba(0, 0, 0, 0.54);
4065}
4066
4067.mdlext-light-color-theme .mdl-checkbox.is-checked .mdl-checkbox__box-outline {
4068 border-color: #E040FB;
4069}
4070
4071.mdlext-light-color-theme fieldset[disabled] .mdl-checkbox .mdl-checkbox__box-outline,
4072.mdlext-light-color-theme .mdl-checkbox.is-disabled .mdl-checkbox__box-outline {
4073 border-color: rgba(0, 0, 0, 0.26);
4074}
4075
4076.mdlext-light-color-theme .mdl-checkbox__focus-helper {
4077 background-color: transparent;
4078}
4079
4080.mdlext-light-color-theme .mdl-checkbox.is-focused.is-checked .mdl-checkbox__focus-helper {
4081 box-shadow: 0 0 0 8px rgba(224, 64, 251, 0.26);
4082 background-color: rgba(224, 64, 251, 0.26);
4083}
4084
4085.mdlext-light-color-theme .mdl-checkbox__tick-outline {
4086 background: transparent;
4087}
4088
4089.mdlext-light-color-theme .mdl-checkbox.is-checked .mdl-checkbox__tick-outline {
4090 background-color: #E040FB;
4091}
4092
4093.mdlext-light-color-theme fieldset[disabled] .mdl-checkbox.is-checked .mdl-checkbox__tick-outline,
4094.mdlext-light-color-theme .mdl-checkbox.is-checked.is-disabled .mdl-checkbox__tick-outline {
4095 background-color: rgba(0, 0, 0, 0.26);
4096}
4097
4098.mdlext-light-color-theme fieldset[disabled] .mdl-checkbox .mdl-checkbox__label,
4099.mdlext-light-color-theme .mdl-checkbox.is-disabled .mdl-checkbox__label {
4100 color: rgba(0, 0, 0, 0.26);
4101}
4102
4103.mdlext-light-color-theme .mdl-checkbox__ripple-container .mdl-ripple {
4104 background: #E040FB;
4105}
4106
4107.mdlext-light-color-theme fieldset[disabled] .mdl-checkbox .mdl-checkbox__ripple-container .mdl-ripple,
4108.mdlext-light-color-theme .mdl-checkbox.is-disabled .mdl-checkbox__ripple-container .mdl-ripple {
4109 background: transparent;
4110}
4111
4112.mdlext-light-color-theme .mdl-radio__outer-circle {
4113 border-color: rgba(0, 0, 0, 0.54);
4114}
4115
4116.mdlext-light-color-theme .mdl-radio.is-checked .mdl-radio__outer-circle {
4117 border-color: #E040FB;
4118}
4119
4120.mdlext-light-color-theme .mdl-radio__outer-circle fieldset[disabled] .mdl-radio,
4121.mdlext-light-color-theme .mdl-radio.is-disabled .mdl-radio__outer-circle {
4122 border-color: rgba(0, 0, 0, 0.26);
4123}
4124
4125.mdlext-light-color-theme .mdl-radio__inner-circle {
4126 background: #E040FB;
4127}
4128
4129.mdlext-light-color-theme fieldset[disabled] .mdl-radio .mdl-radio__inner-circle,
4130.mdlext-light-color-theme .mdl-radio.is-disabled .mdl-radio__inner-circle {
4131 background: rgba(0, 0, 0, 0.26);
4132}
4133
4134.mdlext-light-color-theme fieldset[disabled] .mdl-radio .mdl-radio__label,
4135.mdlext-light-color-theme .mdl-radio.is-disabled .mdl-radio__label {
4136 color: rgba(0, 0, 0, 0.26);
4137}
4138
4139.mdlext-light-color-theme .mdl-radio__ripple-container .mdl-ripple {
4140 background: #E040FB;
4141}
4142
4143.mdlext-light-color-theme fieldset[disabled] .mdl-radio .mdl-radio__ripple-container .mdl-ripple,
4144.mdlext-light-color-theme .mdl-radio.is-disabled .mdl-radio__ripple-container .mdl-ripple {
4145 background: transparent;
4146}
4147
4148.mdlext-light-color-theme .mdl-icon-toggle__label {
4149 color: #616161;
4150}
4151
4152.mdlext-light-color-theme .mdl-icon-toggle.is-checked .mdl-icon-toggle__label {
4153 color: #E040FB;
4154}
4155
4156.mdlext-light-color-theme .mdl-icon-toggle.is-disabled .mdl-icon-toggle__label {
4157 color: rgba(0, 0, 0, 0.26);
4158}
4159
4160.mdlext-light-color-theme .mdl-icon-toggle.is-focused .mdl-icon-toggle__label {
4161 background-color: rgba(0, 0, 0, 0.12);
4162}
4163
4164.mdlext-light-color-theme .mdl-icon-toggle.is-focused.is-checked .mdl-icon-toggle__label {
4165 background-color: rgba(224, 64, 251, 0.26);
4166}
4167
4168.mdlext-light-color-theme .mdl-icon-toggle__ripple-container .mdl-ripple {
4169 background: #616161;
4170}
4171
4172.mdlext-light-color-theme .mdl-icon-toggle.is-disabled .mdl-icon-toggle__ripple-container .mdl-ripple {
4173 background: transparent;
4174}
4175
4176.mdlext-light-color-theme .mdl-switch__track {
4177 background: rgba(0, 0, 0, 0.26);
4178}
4179
4180.mdlext-light-color-theme .mdl-switch.is-checked .mdl-switch__track {
4181 background: rgba(224, 64, 251, 0.54);
4182}
4183
4184.mdlext-light-color-theme .mdl-switch__track fieldset[disabled] .mdl-switch,
4185.mdlext-light-color-theme .mdl-switch.is-disabled .mdl-switch__track {
4186 background: rgba(0, 0, 0, 0.12);
4187}
4188
4189.mdlext-light-color-theme .mdl-switch__thumb {
4190 background: #FAFAFA;
4191}
4192
4193.mdlext-light-color-theme .mdl-switch.is-checked .mdl-switch__thumb {
4194 background: #E040FB;
4195}
4196
4197.mdlext-light-color-theme .mdl-switch__thumb fieldset[disabled] .mdl-switch,
4198.mdlext-light-color-theme .mdl-switch.is-disabled .mdl-switch__thumb {
4199 background: #BDBDBD;
4200}
4201
4202.mdlext-light-color-theme .mdl-switch__focus-helper {
4203 background-color: transparent;
4204}
4205
4206.mdlext-light-color-theme .mdl-switch.is-focused .mdl-switch__focus-helper {
4207 background-color: rgba(0, 0, 0, 0.1);
4208}
4209
4210.mdlext-light-color-theme .mdl-switch.is-focused.is-checked .mdl-switch__focus-helper {
4211 box-shadow: 0 0 0 20px rgba(224, 64, 251, 0.26);
4212 background-color: rgba(224, 64, 251, 0.26);
4213}
4214
4215.mdlext-light-color-theme .mdl-switch__label fieldset[disabled] .mdl-switch,
4216.mdlext-light-color-theme .mdl-switch.is-disabled .mdl-switch__label {
4217 color: #BDBDBD;
4218}
4219
4220.mdlext-light-color-theme .mdl-switch__ripple-container .mdl-ripple {
4221 background: #E040FB;
4222}
4223
4224.mdlext-light-color-theme fieldset[disabled] .mdl-switch .mdl-switch__ripple-container .mdl-ripple,
4225.mdlext-light-color-theme .mdl-switch.is-disabled .mdl-switch__ripple-container .mdl-ripple {
4226 background: transparent;
4227}
4228
4229.mdlext-light-color-theme .mdl-data-table {
4230 border-color: rgba(0, 0, 0, 0.12);
4231 background-color: #FAFAFA;
4232}
4233
4234.mdlext-light-color-theme .mdl-data-table tbody tr.is-selected {
4235 background-color: #EEEEEE;
4236}
4237
4238.mdlext-light-color-theme .mdl-data-table tbody tr:hover {
4239 background-color: #EEEEEE;
4240}
4241
4242.mdlext-light-color-theme .mdl-data-table th {
4243 color: rgba(0, 0, 0, 0.54);
4244}
4245
4246.mdlext-light-color-theme .mdl-data-table th.mdl-data-table__header--sorted-ascending,
4247.mdlext-light-color-theme .mdl-data-table th.mdl-data-table__header--sorted-descending {
4248 color: rgba(0, 0, 0, 0.87);
4249}
4250
4251.mdlext-light-color-theme .mdl-data-table th.mdl-data-table__header--sorted-ascending:hover::before,
4252.mdlext-light-color-theme .mdl-data-table th.mdl-data-table__header--sorted-descending:hover::before {
4253 color: rgba(0, 0, 0, 0.26);
4254}
4255
4256.mdlext-light-color-theme .mdl-menu__outline {
4257 background: #FFFFFF;
4258}
4259
4260.mdlext-light-color-theme .mdl-menu__item {
4261 color: rgba(0, 0, 0, 0.87);
4262 background-color: transparent;
4263 outline-color: #BDBDBD;
4264}
4265
4266.mdlext-light-color-theme .mdl-menu__item--full-bleed-divider {
4267 border-bottom-color: rgba(0, 0, 0, 0.12);
4268}
4269
4270.mdlext-light-color-theme .mdl-menu__item[disabled],
4271.mdlext-light-color-theme .mdl-menu__item[data-mdl-disabled] {
4272 color: #BDBDBD;
4273 background-color: transparent;
4274}
4275
4276.mdlext-light-color-theme .mdl-menu__item[disabled]:hover,
4277.mdlext-light-color-theme .mdl-menu__item[data-mdl-disabled]:hover {
4278 background-color: transparent;
4279}
4280
4281.mdlext-light-color-theme .mdl-menu__item[disabled]:focus,
4282.mdlext-light-color-theme .mdl-menu__item[data-mdl-disabled]:focus {
4283 background-color: transparent;
4284}
4285
4286.mdlext-light-color-theme .mdl-menu__item[disabled] .mdl-ripple,
4287.mdlext-light-color-theme .mdl-menu__item[data-mdl-disabled] .mdl-ripple {
4288 background: transparent;
4289}
4290
4291.mdlext-light-color-theme .mdl-menu__item:hover {
4292 background-color: #EEEEEE;
4293}
4294
4295.mdlext-light-color-theme .mdl-menu__item:focus {
4296 background-color: #EEEEEE;
4297}
4298
4299.mdlext-light-color-theme .mdl-menu__item:active {
4300 background-color: #E0E0E0;
4301}
4302
4303.mdlext-light-color-theme .mdl-card {
4304 background: #FAFAFA;
4305}
4306
4307.mdlext-light-color-theme .mdl-card__media {
4308 background-color: #E040FB;
4309}
4310
4311.mdlext-light-color-theme .mdl-card__title {
4312 color: rgba(0, 0, 0, 0.87);
4313}
4314
4315.mdlext-light-color-theme .mdl-card__title.mdl-card--border {
4316 border-bottom-color: rgba(0, 0, 0, 0.1);
4317}
4318
4319.mdlext-light-color-theme .mdl-card__title-text {
4320 color: inherit;
4321}
4322
4323.mdlext-light-color-theme .mdl-card__subtitle-text {
4324 color: rgba(0, 0, 0, 0.54);
4325}
4326
4327.mdlext-light-color-theme .mdl-card__supporting-text {
4328 color: rgba(0, 0, 0, 0.54);
4329}
4330
4331.mdlext-light-color-theme .mdl-card__actions {
4332 background-color: transparent;
4333}
4334
4335.mdlext-light-color-theme .mdl-card__actions.mdl-card--border {
4336 border-top-color: rgba(0, 0, 0, 0.1);
4337}
4338
4339.mdlext-light-color-theme .mdlext-selectfield.is-disabled::after {
4340 color: rgba(0, 0, 0, 0.12);
4341 content: '';
4342 width: 0;
4343 height: 0;
4344 font-size: inherit;
4345 line-height: inherit;
4346 border-top: 0.5em solid rgba(0, 0, 0, 0.12);
4347 border-top-width: 0.5em;
4348 border-top-style: solid;
4349 border-top-color: rgba(0, 0, 0, 0.12);
4350 border-left: 0.35em solid transparent;
4351 border-right: 0.35em solid transparent;
4352}
4353
4354.mdlext-light-color-theme .mdlext-selectfield__select {
4355 border-bottom-color: rgba(0, 0, 0, 0.26);
4356 color: inherit;
4357}
4358
4359.mdlext-light-color-theme .mdlext-selectfield__select option {
4360 background-color: #FAFAFA;
4361 color: rgba(0, 0, 0, 0.87);
4362}
4363
4364.mdlext-light-color-theme .mdlext-selectfield.is-invalid .mdlext-selectfield__select {
4365 border-color: #D32F2F;
4366}
4367
4368.mdlext-light-color-theme fieldset[disabled] .mdlext-selectfield .mdlext-selectfield__select,
4369.mdlext-light-color-theme .mdlext-selectfield.is-disabled .mdlext-selectfield__select {
4370 background-color: transparent;
4371 border-bottom-color: rgba(0, 0, 0, 0.12);
4372 color: rgba(0, 0, 0, 0.26);
4373}
4374
4375.mdlext-light-color-theme .mdlext-selectfield__label {
4376 color: rgba(0, 0, 0, 0.54);
4377}
4378
4379.mdlext-light-color-theme fieldset[disabled] .mdlext-selectfield .mdlext-selectfield__label,
4380.mdlext-light-color-theme .mdlext-selectfield.is-disabled.is-disabled .mdlext-selectfield__label {
4381 color: rgba(0, 0, 0, 0.26);
4382}
4383
4384.mdlext-light-color-theme .mdlext-selectfield--floating-label.is-focused .mdlext-selectfield__label,
4385.mdlext-light-color-theme .mdlext-selectfield--floating-label.is-dirty .mdlext-selectfield__label,
4386.mdlext-light-color-theme .mdlext-selectfield--floating-label.is-dirty.is-dirty .mdlext-selectfield__label,
4387.mdlext-light-color-theme .mdlext-selectfield--floating-label.has-placeholder .mdlext-selectfield__label {
4388 color: #E040FB;
4389}
4390
4391.mdlext-light-color-theme .mdlext-selectfield--floating-label.is-invalid .mdlext-selectfield__label {
4392 color: #D32F2F;
4393}
4394
4395.mdlext-light-color-theme .mdlext-selectfield__label::after {
4396 background-color: #E040FB;
4397}
4398
4399.mdlext-light-color-theme .mdlext-selectfield.is-invalid .mdlext-selectfield__label::after {
4400 background-color: #D32F2F;
4401}
4402
4403.mdlext-light-color-theme .mdlext-selectfield__error {
4404 color: #D32F2F;
4405}
4406
4407.mdlext-menu.mdlext-light-color-theme {
4408 background: #FFFFFF;
4409}
4410
4411.mdlext-light-color-theme .mdlext-menu {
4412 background: #FFFFFF;
4413}
4414
4415.mdlext-light-color-theme .mdlext-menu__item {
4416 color: rgba(0, 0, 0, 0.87);
4417 background-color: #FFFFFF;
4418}
4419
4420.mdlext-light-color-theme .mdlext-menu__item:active,
4421.mdlext-light-color-theme .mdlext-menu__item[aria-selected='true'] {
4422 background-color: #E0E0E0;
4423}
4424
4425.mdlext-light-color-theme .mdlext-menu__item:hover:not([disabled]) {
4426 background-color: #EEEEEE;
4427}
4428
4429.mdlext-light-color-theme .mdlext-menu__item:focus {
4430 outline-color: #BDBDBD;
4431 background-color: #EEEEEE;
4432}
4433
4434.mdlext-light-color-theme .mdlext-menu__item[disabled] {
4435 color: #BDBDBD;
4436}
4437
4438.mdlext-light-color-theme .mdlext-menu__item[disabled] > * {
4439 color: #BDBDBD;
4440}
4441
4442.mdlext-light-color-theme .mdlext-menu__item-separator {
4443 border-bottom: 1px solid rgba(0, 0, 0, 0.12);
4444}
4445
4446.mdlext-light-color-theme .mdlext-bordered-fields .mdl-textfield .mdl-textfield__input,
4447.mdlext-light-color-theme .mdlext-bordered-fields .mdl-textfield .mdlext-selectfield__select,
4448.mdlext-light-color-theme .mdlext-bordered-fields .mdlext-selectfield .mdl-textfield__input,
4449.mdlext-light-color-theme .mdlext-bordered-fields .mdlext-selectfield .mdlext-selectfield__select {
4450 background-color: rgba(250, 250, 250, 0.1);
4451 border-color: rgba(0, 0, 0, 0.26);
4452 color: inherit;
4453}
4454
4455.mdlext-light-color-theme .mdlext-bordered-fields .mdl-textfield .mdl-textfield__input:disabled,
4456.mdlext-light-color-theme .mdlext-bordered-fields .mdl-textfield .mdlext-selectfield__select:disabled,
4457.mdlext-light-color-theme .mdlext-bordered-fields .mdlext-selectfield .mdl-textfield__input:disabled,
4458.mdlext-light-color-theme .mdlext-bordered-fields .mdlext-selectfield .mdlext-selectfield__select:disabled {
4459 color: rgba(0, 0, 0, 0.26);
4460 background-color: rgba(250, 250, 250, 0.1);
4461 border-color: rgba(0, 0, 0, 0.12);
4462}
4463
4464.mdlext-light-color-theme .mdlext-bordered-fields .mdl-textfield .mdl-textfield__input:focus,
4465.mdlext-light-color-theme .mdlext-bordered-fields .mdl-textfield .mdlext-selectfield__select:focus,
4466.mdlext-light-color-theme .mdlext-bordered-fields .mdlext-selectfield .mdl-textfield__input:focus,
4467.mdlext-light-color-theme .mdlext-bordered-fields .mdlext-selectfield .mdlext-selectfield__select:focus {
4468 background-color: rgba(225, 225, 225, 0.1);
4469 border-color: #E040FB;
4470}
4471
4472.mdlext-light-color-theme .mdlext-bordered-fields .mdl-textfield.is-invalid .mdl-textfield__input,
4473.mdlext-light-color-theme .mdlext-bordered-fields .mdl-textfield.is-invalid .mdlext-selectfield__select,
4474.mdlext-light-color-theme .mdlext-bordered-fields .mdlext-selectfield.is-invalid .mdl-textfield__input,
4475.mdlext-light-color-theme .mdlext-bordered-fields .mdlext-selectfield.is-invalid .mdlext-selectfield__select {
4476 color: inherit;
4477 border-color: #D32F2F;
4478 background-color: rgba(255, 255, 255, 0.5);
4479}
4480
4481.mdlext-light-color-theme .mdlext-bordered-fields .mdl-textfield.is-invalid .mdl-textfield__input:focus,
4482.mdlext-light-color-theme .mdlext-bordered-fields .mdl-textfield.is-invalid .mdlext-selectfield__select:focus,
4483.mdlext-light-color-theme .mdlext-bordered-fields .mdlext-selectfield.is-invalid .mdl-textfield__input:focus,
4484.mdlext-light-color-theme .mdlext-bordered-fields .mdlext-selectfield.is-invalid .mdlext-selectfield__select:focus {
4485 border-color: #ab2424;
4486 background-color: rgba(255, 255, 255, 0.5);
4487}
4488
4489.mdlext-light-color-theme .mdlext-bordered-fields fieldset[disabled] .mdlext-selectfield::after,
4490.mdlext-light-color-theme .mdlext-bordered-fields .mdlext-selectfield.is-disabled::after {
4491 color: rgba(0, 0, 0, 0.26);
4492 content: '';
4493 width: 0;
4494 height: 0;
4495 font-size: inherit;
4496 line-height: inherit;
4497 border-top: 0.5em solid rgba(0, 0, 0, 0.26);
4498 border-top-width: 0.5em;
4499 border-top-style: solid;
4500 border-top-color: rgba(0, 0, 0, 0.26);
4501 border-left: 0.35em solid transparent;
4502 border-right: 0.35em solid transparent;
4503}
4504
4505.mdlext-light-color-theme .mdlext-bordered-fields fieldset[disabled] .mdl-textfield .mdl-textfield__input,
4506.mdlext-light-color-theme .mdlext-bordered-fields fieldset[disabled] .mdlext-selectfield .mdlext-selectfield__select {
4507 color: rgba(0, 0, 0, 0.26);
4508 background-color: rgba(250, 250, 250, 0.1);
4509 border-color: rgba(0, 0, 0, 0.12);
4510}
4511
4512.mdlext-light-color-theme .mdlext-bordered-fields .mdl-textfield .mdl-textfield__label,
4513.mdlext-light-color-theme .mdlext-bordered-fields .mdl-textfield .mdlext-selectfield__label,
4514.mdlext-light-color-theme .mdlext-bordered-fields .mdlext-selectfield .mdl-textfield__label,
4515.mdlext-light-color-theme .mdlext-bordered-fields .mdlext-selectfield .mdlext-selectfield__label {
4516 color: rgba(0, 0, 0, 0.54);
4517}
4518
4519.mdlext-light-color-theme .mdlext-bordered-fields .mdl-textfield.mdl-textfield--floating-label.is-focused.is-focused .mdl-textfield__label,
4520.mdlext-light-color-theme .mdlext-bordered-fields .mdl-textfield.mdl-textfield--floating-label.is-focused.is-focused .mdlext-selectfield__label,
4521.mdlext-light-color-theme .mdlext-bordered-fields .mdl-textfield.mdl-textfield--floating-label.is-dirty.is-dirty .mdl-textfield__label,
4522.mdlext-light-color-theme .mdlext-bordered-fields .mdl-textfield.mdl-textfield--floating-label.is-dirty.is-dirty .mdlext-selectfield__label,
4523.mdlext-light-color-theme .mdlext-bordered-fields .mdl-textfield.mdl-textfield--floating-label.has-placeholder .mdl-textfield__label,
4524.mdlext-light-color-theme .mdlext-bordered-fields .mdl-textfield.mdl-textfield--floating-label.has-placeholder .mdlext-selectfield__label,
4525.mdlext-light-color-theme .mdlext-bordered-fields .mdl-textfield.mdlext-selectfield--floating-label.is-focused.is-focused .mdl-textfield__label,
4526.mdlext-light-color-theme .mdlext-bordered-fields .mdl-textfield.mdlext-selectfield--floating-label.is-focused.is-focused .mdlext-selectfield__label,
4527.mdlext-light-color-theme .mdlext-bordered-fields .mdl-textfield.mdlext-selectfield--floating-label.is-dirty.is-dirty .mdl-textfield__label,
4528.mdlext-light-color-theme .mdlext-bordered-fields .mdl-textfield.mdlext-selectfield--floating-label.is-dirty.is-dirty .mdlext-selectfield__label,
4529.mdlext-light-color-theme .mdlext-bordered-fields .mdl-textfield.mdlext-selectfield--floating-label.has-placeholder .mdl-textfield__label,
4530.mdlext-light-color-theme .mdlext-bordered-fields .mdl-textfield.mdlext-selectfield--floating-label.has-placeholder .mdlext-selectfield__label,
4531.mdlext-light-color-theme .mdlext-bordered-fields .mdlext-selectfield.mdl-textfield--floating-label.is-focused.is-focused .mdl-textfield__label,
4532.mdlext-light-color-theme .mdlext-bordered-fields .mdlext-selectfield.mdl-textfield--floating-label.is-focused.is-focused .mdlext-selectfield__label,
4533.mdlext-light-color-theme .mdlext-bordered-fields .mdlext-selectfield.mdl-textfield--floating-label.is-dirty.is-dirty .mdl-textfield__label,
4534.mdlext-light-color-theme .mdlext-bordered-fields .mdlext-selectfield.mdl-textfield--floating-label.is-dirty.is-dirty .mdlext-selectfield__label,
4535.mdlext-light-color-theme .mdlext-bordered-fields .mdlext-selectfield.mdl-textfield--floating-label.has-placeholder .mdl-textfield__label,
4536.mdlext-light-color-theme .mdlext-bordered-fields .mdlext-selectfield.mdl-textfield--floating-label.has-placeholder .mdlext-selectfield__label,
4537.mdlext-light-color-theme .mdlext-bordered-fields .mdlext-selectfield.mdlext-selectfield--floating-label.is-focused.is-focused .mdl-textfield__label,
4538.mdlext-light-color-theme .mdlext-bordered-fields .mdlext-selectfield.mdlext-selectfield--floating-label.is-focused.is-focused .mdlext-selectfield__label,
4539.mdlext-light-color-theme .mdlext-bordered-fields .mdlext-selectfield.mdlext-selectfield--floating-label.is-dirty.is-dirty .mdl-textfield__label,
4540.mdlext-light-color-theme .mdlext-bordered-fields .mdlext-selectfield.mdlext-selectfield--floating-label.is-dirty.is-dirty .mdlext-selectfield__label,
4541.mdlext-light-color-theme .mdlext-bordered-fields .mdlext-selectfield.mdlext-selectfield--floating-label.has-placeholder .mdl-textfield__label,
4542.mdlext-light-color-theme .mdlext-bordered-fields .mdlext-selectfield.mdlext-selectfield--floating-label.has-placeholder .mdlext-selectfield__label {
4543 color: #E040FB;
4544}
4545
4546.mdlext-light-color-theme .mdlext-bordered-fields .mdl-textfield.mdl-textfield--floating-label.is-disabled.is-disabled .mdl-textfield__label,
4547.mdlext-light-color-theme .mdlext-bordered-fields .mdl-textfield.mdl-textfield--floating-label.is-disabled.is-disabled .mdlext-selectfield__label,
4548.mdlext-light-color-theme .mdlext-bordered-fields .mdl-textfield.mdlext-selectfield--floating-label.is-disabled.is-disabled .mdl-textfield__label,
4549.mdlext-light-color-theme .mdlext-bordered-fields .mdl-textfield.mdlext-selectfield--floating-label.is-disabled.is-disabled .mdlext-selectfield__label,
4550.mdlext-light-color-theme .mdlext-bordered-fields .mdlext-selectfield.mdl-textfield--floating-label.is-disabled.is-disabled .mdl-textfield__label,
4551.mdlext-light-color-theme .mdlext-bordered-fields .mdlext-selectfield.mdl-textfield--floating-label.is-disabled.is-disabled .mdlext-selectfield__label,
4552.mdlext-light-color-theme .mdlext-bordered-fields .mdlext-selectfield.mdlext-selectfield--floating-label.is-disabled.is-disabled .mdl-textfield__label,
4553.mdlext-light-color-theme .mdlext-bordered-fields .mdlext-selectfield.mdlext-selectfield--floating-label.is-disabled.is-disabled .mdlext-selectfield__label {
4554 color: rgba(0, 0, 0, 0.26);
4555}
4556
4557.mdlext-light-color-theme .mdlext-bordered-fields .mdl-textfield.mdl-textfield--floating-label.is-invalid.is-invalid .mdl-textfield__label,
4558.mdlext-light-color-theme .mdlext-bordered-fields .mdl-textfield.mdl-textfield--floating-label.is-invalid.is-invalid .mdlext-selectfield__label,
4559.mdlext-light-color-theme .mdlext-bordered-fields .mdl-textfield.mdlext-selectfield--floating-label.is-invalid.is-invalid .mdl-textfield__label,
4560.mdlext-light-color-theme .mdlext-bordered-fields .mdl-textfield.mdlext-selectfield--floating-label.is-invalid.is-invalid .mdlext-selectfield__label,
4561.mdlext-light-color-theme .mdlext-bordered-fields .mdlext-selectfield.mdl-textfield--floating-label.is-invalid.is-invalid .mdl-textfield__label,
4562.mdlext-light-color-theme .mdlext-bordered-fields .mdlext-selectfield.mdl-textfield--floating-label.is-invalid.is-invalid .mdlext-selectfield__label,
4563.mdlext-light-color-theme .mdlext-bordered-fields .mdlext-selectfield.mdlext-selectfield--floating-label.is-invalid.is-invalid .mdl-textfield__label,
4564.mdlext-light-color-theme .mdlext-bordered-fields .mdlext-selectfield.mdlext-selectfield--floating-label.is-invalid.is-invalid .mdlext-selectfield__label {
4565 color: #D32F2F;
4566}
4567
4568.mdlext-light-color-theme .mdlext-bordered-fields fieldset[disabled] .mdl-textfield .mdl-textfield__label,
4569.mdlext-light-color-theme .mdlext-bordered-fields fieldset[disabled] .mdl-selectfield .mdl-selectfield__label {
4570 color: rgba(0, 0, 0, 0.26);
4571}
4572
4573.mdlext-light-color-theme .mdlext-bordered-fields .mdl-textfield.is-disabled i,
4574.mdlext-light-color-theme .mdlext-bordered-fields .mdl-textfield.is-disabled .mdl-button,
4575.mdlext-light-color-theme .mdlext-bordered-fields .mdlext-selectfield.is-disabled i,
4576.mdlext-light-color-theme .mdlext-bordered-fields .mdlext-selectfield.is-disabled .mdl-button {
4577 color: rgba(0, 0, 0, 0.12);
4578}
4579
4580.mdlext-light-color-theme .mdlext-bordered-fields fieldset[disabled] .mdl-textfield i,
4581.mdlext-light-color-theme .mdlext-bordered-fields fieldset[disabled] .mdl-textfield .mdl-button,
4582.mdlext-light-color-theme .mdlext-bordered-fields fieldset[disabled] .mdlext-selectfield i,
4583.mdlext-light-color-theme .mdlext-bordered-fields fieldset[disabled] .mdlext-selectfield .mdl-button {
4584 color: rgba(0, 0, 0, 0.12);
4585}
4586
4587.mdlext-light-color-theme .mdlext-accordion__tab {
4588 color: #000000;
4589 background-color: rgba(117, 117, 117, 0.2);
4590}
4591
4592.mdlext-light-color-theme .mdlext-accordion__tab:focus {
4593 outline-color: rgba(109, 109, 109, 0.5);
4594}
4595
4596.mdlext-light-color-theme .mdlext-accordion__tab[aria-expanded='true'] {
4597 background-color: rgba(117, 117, 117, 0.3);
4598}
4599
4600.mdlext-light-color-theme .mdlext-accordion__tab[aria-selected='true'] {
4601 background-color: rgba(117, 117, 117, 0.4);
4602}
4603
4604.mdlext-light-color-theme .mdlext-accordion__tab[disabled] {
4605 background-color: rgba(117, 117, 117, 0.12);
4606 color: rgba(0, 0, 0, 0.26);
4607 pointer-events: none;
4608}
4609
4610.mdlext-light-color-theme .mdlext-accordion__tab[disabled] > * {
4611 color: rgba(0, 0, 0, 0.26);
4612}
4613
4614.mdlext-light-color-theme .mdlext-accordion__tab:hover:not([disabled]) {
4615 background-color: rgba(117, 117, 117, 0.4);
4616}
4617
4618.mdlext-light-color-theme .mdlext-accordion__tab--ripple[aria-selected='true']::before {
4619 background: rgba(117, 117, 117, 0.4);
4620}
4621
4622.mdlext-light-color-theme .mdlext-accordion__tabpanel {
4623 color: inherit;
4624 background-color: transparent;
4625}
4626
4627.mdlext-light-color-theme .mdlext-accordion--vertical .mdlext-accordion__tab {
4628 border-top: 1px solid rgba(117, 117, 117, 0.5);
4629}
4630
4631.mdlext-light-color-theme .mdlext-accordion--vertical .mdlext-accordion__tab[aria-selected='true']::after {
4632 background-color: rgba(102, 102, 102, 0.5);
4633}
4634
4635.mdlext-light-color-theme .mdlext-accordion--vertical .mdlext-accordion__tabpanel {
4636 border-top: 1px solid rgba(117, 117, 117, 0.5);
4637}
4638
4639.mdlext-light-color-theme .mdlext-accordion--horizontal .mdlext-accordion__tab {
4640 border-left: 1px solid rgba(117, 117, 117, 0.5);
4641}
4642
4643.mdlext-light-color-theme .mdlext-accordion--horizontal .mdlext-accordion__tab[aria-selected='true']::after {
4644 background-color: rgba(102, 102, 102, 0.5);
4645}
4646
4647.mdlext-light-color-theme .mdlext-accordion--horizontal .mdlext-accordion__tabpanel {
4648 border-left: 1px solid rgba(117, 117, 117, 0.5);
4649}
4650
4651.mdlext-light-color-theme .mdlext-accordion__panel:first-child > .mdlext-light-color-theme .mdlext-accordion__tab {
4652 border-top-color: transparent;
4653 border-left-color: transparent;
4654}
4655
4656.mdlext-light-color-theme .mdlext-accordion[disabled] .mdlext-accordion__tab {
4657 background-color: rgba(117, 117, 117, 0.12);
4658 color: rgba(0, 0, 0, 0.26);
4659}
4660
4661.mdlext-light-color-theme .mdlext-accordion[disabled] .mdlext-accordion__tab > * {
4662 color: rgba(0, 0, 0, 0.26);
4663}
4664
4665.mdlext-light-color-theme .mdlext-accordion[disabled] .mdlext-accordion__tabpanel {
4666 opacity: 0.8;
4667 filter: blur(1px) grayscale(80%);
4668}
4669
4670/* -------------------------------------------------------------
4671 Palette samples. Not part of build
4672----------------------------------------------------------------
4673
4674$mdlext-light-color-primary: #9E9E9E !default;
4675$mdlext-light-color-primary-dark: #616161 !default;
4676$mdlext-light-color-primary-light: #9E9E9E !default; // Fallback color. Set to color-primary if fallback is not needed
4677$mdlext-light-color-primary-contrast: #212121 !default; // text color on primary/primary dark background
4678$mdlext-light-color-accent: #E040FB !default;
4679$mdlext-light-color-accent-light: #E040FB !default; // Fallback color. Set to color-accent if fallback is not needed
4680$mdlext-light-color-accent-contrast: #FAFAFA !default;
4681
4682$mdlext-light-color-primary: #F5F5F5 !default;
4683$mdlext-light-color-primary-dark: #E0E0E0 !default;
4684$mdlext-light-color-primary-light: #8BC34A !default; // Fallback color. Set to color-primary if fallback is not needed
4685$mdlext-light-color-primary-contrast: #000000 !default; // text color on primary/primary dark background
4686$mdlext-light-color-accent: #FFC107 !default;
4687$mdlext-light-color-accent-light: #FFC107 !default; // Fallback color. Set to color-accent if fallback is not needed
4688$mdlext-light-color-accent-contrast: #FFFFFF !default;
4689
4690
4691$mdlext-light-color-primary: #673AB7 !default;
4692$mdlext-light-color-primary-dark: #512DA8 !default;
4693$mdlext-light-color-primary-light: #673AB7 !default; // Fallback color. Set to color-primary if fallback is not needed
4694$mdlext-light-color-primary-contrast: #D1C4E9 !default; // text color on primary/primary dark background
4695$mdlext-light-color-accent: #4CAF50 !default;
4696$mdlext-light-color-accent-light: #4CAF50 !default; // Fallback color. Set to color-accent if fallback is not needed
4697$mdlext-light-color-accent-contrast: #FFFFFF !default;
4698
4699
4700$mdlext-light-color-primary: #4CAF50 !default;
4701$mdlext-light-color-primary-dark: #388E3C !default;
4702$mdlext-light-color-primary-light: #4CAF50 !default; // Fallback color. Set to color-primary if fallback is not needed
4703$mdlext-light-color-primary-contrast: #C8E6C9 !default; // text color on primary/primary dark background
4704$mdlext-light-color-accent: #FF5252 !default;
4705$mdlext-light-color-accent-light: #FF5252 !default; // Fallback color. Set to color-accent if fallback is not needed
4706$mdlext-light-color-accent-contrast: #FFFFFF !default;
4707
4708
4709$mdlext-light-color-primary: #4CAF50 !default;
4710$mdlext-light-color-primary-dark: #388E3C !default;
4711$mdlext-light-color-primary-light: #4CAF50 !default; // Fallback color. Set to color-primary if fallback is not needed
4712$mdlext-light-color-primary-contrast: #C8E6C9 !default; // text color on primary/primary dark background
4713$mdlext-light-color-accent: #03A9F4 !default;
4714$mdlext-light-color-accent-light: #03A9F4 !default; // Fallback color. Set to color-accent if fallback is not needed
4715$mdlext-light-color-accent-contrast: #FFFFFF !default;
4716
4717
4718$mdlext-dark-color-primary: #212121 !default;
4719$mdlext-dark-color-primary-dark: #000000 !default;
4720$mdlext-dark-color-primary-light: #607D8B !default; // Fallback color. Set to color-primary if fallback is not needed
4721$mdlext-dark-color-primary-contrast: #FFFFFF !default; // text color on primary/primary dark background
4722$mdlext-dark-color-accent: #FF5722 !default;
4723$mdlext-dark-color-accent-light: #FF5722 !default; // Fallback color. Set to color-accent if fallback is not needed
4724$mdlext-dark-color-accent-contrast: #FFFFFF !default;
4725
4726*/
4727
4728.mdlext-dark-color-theme {
4729 background-color: #303030;
4730 color: white;
4731}
4732
4733.mdlext-dark-color-theme a {
4734 outline-color: inherit;
4735}
4736
4737.mdlext-dark-color-theme .mdl-color--primary {
4738 background-color: #FFC107 !important;
4739}
4740
4741.mdlext-dark-color-theme .mdl-color--primary-contrast {
4742 background-color: #FFF8E1 !important;
4743}
4744
4745.mdlext-dark-color-theme .mdl-color--primary-dark {
4746 background-color: #FFA000 !important;
4747}
4748
4749.mdlext-dark-color-theme .mdl-color--accent {
4750 background-color: #536DFE !important;
4751}
4752
4753.mdlext-dark-color-theme .mdl-color--accent-contrast {
4754 background-color: #FFFFFF !important;
4755}
4756
4757.mdlext-dark-color-theme .mdl-color-text--primary {
4758 color: #FFC107 !important;
4759}
4760
4761.mdlext-dark-color-theme .mdl-color-text--primary-contrast {
4762 color: #FFF8E1 !important;
4763}
4764
4765.mdlext-dark-color-theme .mdl-color-text--primary-dark {
4766 color: #FFA000 !important;
4767}
4768
4769.mdlext-dark-color-theme .mdl-color-text--accent {
4770 color: #536DFE !important;
4771}
4772
4773.mdlext-dark-color-theme .mdl-color-text--accent-contrast {
4774 color: #FFFFFF !important;
4775}
4776
4777.mdlext-dark-color-theme a {
4778 color: #536DFE;
4779}
4780
4781.mdlext-dark-color-theme .mdl-badge[data-badge]::after {
4782 background: #536DFE;
4783 color: #FFFFFF;
4784}
4785
4786.mdlext-dark-color-theme .mdl-badge.mdl-badge--no-background[data-badge]::after {
4787 color: #536DFE;
4788 background: #FFFFFF;
4789}
4790
4791.mdlext-dark-color-theme .mdl-button {
4792 background: transparent;
4793 color: #FFFFFF;
4794}
4795
4796.mdlext-dark-color-theme .mdl-button:hover {
4797 background-color: rgba(158, 158, 158, 0.2);
4798}
4799
4800.mdlext-dark-color-theme .mdl-button:focus:not(:active) {
4801 background-color: rgba(0, 0, 0, 0.12);
4802}
4803
4804.mdlext-dark-color-theme .mdl-button:active {
4805 background-color: rgba(158, 158, 158, 0.4);
4806}
4807
4808.mdlext-dark-color-theme .mdl-button.mdl-button--colored {
4809 color: #FFC107;
4810}
4811
4812.mdlext-dark-color-theme .mdl-button.mdl-button--colored:focus:not(:active) {
4813 background-color: rgba(0, 0, 0, 0.12);
4814}
4815
4816.mdlext-dark-color-theme .mdl-button--raised {
4817 background: rgba(158, 158, 158, 0.2);
4818}
4819
4820.mdlext-dark-color-theme .mdl-button--raised:active {
4821 background-color: rgba(158, 158, 158, 0.4);
4822}
4823
4824.mdlext-dark-color-theme .mdl-button--raised:focus:not(:active) {
4825 background-color: rgba(158, 158, 158, 0.4);
4826}
4827
4828.mdlext-dark-color-theme .mdl-button--raised.mdl-button--colored {
4829 background: #FFC107;
4830 color: #FFF8E1;
4831}
4832
4833.mdlext-dark-color-theme .mdl-button--raised.mdl-button--colored:hover {
4834 background-color: #d39e00;
4835}
4836
4837.mdlext-dark-color-theme .mdl-button--raised.mdl-button--colored:active {
4838 background-color: #d39e00;
4839}
4840
4841.mdlext-dark-color-theme .mdl-button--raised.mdl-button--colored:focus:not(:active) {
4842 background-color: #d39e00;
4843}
4844
4845.mdlext-dark-color-theme .mdl-button--raised.mdl-button--colored .mdl-ripple {
4846 background: #FFF8E1;
4847}
4848
4849.mdlext-dark-color-theme .mdl-button--fab {
4850 background: rgba(158, 158, 158, 0.2);
4851}
4852
4853.mdlext-dark-color-theme .mdl-button--fab:active {
4854 background-color: rgba(158, 158, 158, 0.4);
4855}
4856
4857.mdlext-dark-color-theme .mdl-button--fab:focus:not(:active) {
4858 background-color: rgba(158, 158, 158, 0.4);
4859}
4860
4861.mdlext-dark-color-theme .mdl-button--fab.mdl-button--colored {
4862 background: #536DFE;
4863 color: #FFFFFF;
4864}
4865
4866.mdlext-dark-color-theme .mdl-button--fab.mdl-button--colored:hover {
4867 background-color: #536DFE;
4868}
4869
4870.mdlext-dark-color-theme .mdl-button--fab.mdl-button--colored:focus:not(:active) {
4871 background-color: #536DFE;
4872}
4873
4874.mdlext-dark-color-theme .mdl-button--fab.mdl-button--colored:active {
4875 background-color: #536DFE;
4876}
4877
4878.mdlext-dark-color-theme .mdl-button--fab.mdl-button--colored .mdl-ripple {
4879 background: #FFFFFF;
4880}
4881
4882.mdlext-dark-color-theme .mdl-button--icon {
4883 color: inherit;
4884}
4885
4886.mdlext-dark-color-theme .mdl-button--primary.mdl-button--primary {
4887 color: #FFC107;
4888}
4889
4890.mdlext-dark-color-theme .mdl-button--primary.mdl-button--primary .mdl-ripple {
4891 background: #FFF8E1;
4892}
4893
4894.mdlext-dark-color-theme .mdl-button--primary.mdl-button--primary.mdl-button--raised,
4895.mdlext-dark-color-theme .mdl-button--primary.mdl-button--primary.mdl-button--fab {
4896 color: #FFF8E1;
4897 background-color: #FFC107;
4898}
4899
4900.mdlext-dark-color-theme .mdl-button--accent.mdl-button--accent {
4901 color: #536DFE;
4902}
4903
4904.mdlext-dark-color-theme .mdl-button--accent.mdl-button--accent .mdl-ripple {
4905 background: #FFFFFF;
4906}
4907
4908.mdlext-dark-color-theme .mdl-button--accent.mdl-button--accent.mdl-button--raised,
4909.mdlext-dark-color-theme .mdl-button--accent.mdl-button--accent.mdl-button--fab {
4910 color: #FFFFFF;
4911 background-color: #536DFE;
4912}
4913
4914.mdlext-dark-color-theme .mdl-button[disabled][disabled],
4915.mdlext-dark-color-theme .mdl-button.mdl-button--disabled.mdl-button--disabled {
4916 color: rgba(255, 255, 255, 0.26);
4917 background-color: transparent;
4918}
4919
4920.mdlext-dark-color-theme .mdl-button--fab[disabled][disabled],
4921.mdlext-dark-color-theme .mdl-button--fab.mdl-button--disabled.mdl-button--disabled {
4922 background-color: rgba(255, 255, 255, 0.12);
4923 color: rgba(255, 255, 255, 0.26);
4924}
4925
4926.mdlext-dark-color-theme .mdl-button--raised[disabled][disabled],
4927.mdlext-dark-color-theme .mdl-button--raised.mdl-button--disabled.mdl-button--disabled {
4928 background-color: rgba(255, 255, 255, 0.12);
4929 color: rgba(255, 255, 255, 0.26);
4930}
4931
4932.mdlext-dark-color-theme .mdl-button--colored[disabled][disabled],
4933.mdlext-dark-color-theme .mdl-button--colored.mdl-button--disabled.mdl-button--disabled {
4934 color: rgba(255, 255, 255, 0.26);
4935}
4936
4937.mdlext-dark-color-theme .mdl-slider.is-upgraded {
4938 background: transparent;
4939 color: #536DFE;
4940 /* stylelint-disable */
4941 /* stylelint-enable */
4942 /* stylelint-disable */
4943 /* stylelint-enable */
4944 /**************************** 0-value ****************************/
4945 /* stylelint-disable */
4946 /* stylelint-enable */
4947 /**************************** Disabled ****************************/
4948 /* stylelint-disable */
4949 /* stylelint-enable */
4950}
4951
4952.mdlext-dark-color-theme .mdl-slider.is-upgraded::-webkit-slider-runnable-track {
4953 background: transparent;
4954}
4955
4956.mdlext-dark-color-theme .mdl-slider.is-upgraded::-moz-range-track {
4957 background: transparent;
4958}
4959
4960.mdlext-dark-color-theme .mdl-slider.is-upgraded::-ms-track {
4961 background: none;
4962 color: transparent;
4963}
4964
4965.mdlext-dark-color-theme .mdl-slider.is-upgraded::-ms-fill-lower {
4966 background: linear-gradient(to right, transparent, transparent 16px, #536DFE 16px, #536DFE 0);
4967}
4968
4969.mdlext-dark-color-theme .mdl-slider.is-upgraded::-ms-fill-upper {
4970 background: linear-gradient(to left, transparent, transparent 16px, rgba(255, 255, 255, 0.87) 16px, rgba(255, 255, 255, 0.87) 0);
4971}
4972
4973.mdlext-dark-color-theme .mdl-slider.is-upgraded::-webkit-slider-thumb {
4974 background: #536DFE;
4975}
4976
4977.mdlext-dark-color-theme .mdl-slider.is-upgraded::-moz-range-thumb {
4978 background: #536DFE;
4979}
4980
4981.mdlext-dark-color-theme .mdl-slider.is-upgraded:focus:not(:active)::-webkit-slider-thumb {
4982 box-shadow: 0 0 0 10px rgba(83, 109, 254, 0.5);
4983}
4984
4985.mdlext-dark-color-theme .mdl-slider.is-upgraded:focus:not(:active)::-moz-range-thumb {
4986 box-shadow: 0 0 0 10px rgba(83, 109, 254, 0.5);
4987}
4988
4989.mdlext-dark-color-theme .mdl-slider.is-upgraded:active::-webkit-slider-thumb {
4990 background: #536DFE;
4991}
4992
4993.mdlext-dark-color-theme .mdl-slider.is-upgraded:active::-moz-range-thumb {
4994 background: #536DFE;
4995}
4996
4997.mdlext-dark-color-theme .mdl-slider.is-upgraded::-ms-thumb {
4998 background: #536DFE;
4999}
5000
5001.mdlext-dark-color-theme .mdl-slider.is-upgraded:focus:not(:active)::-ms-thumb {
5002 background: radial-gradient(circle closest-side, #536DFE 0%, #536DFE 37.5%, rgba(83, 109, 254, 0.5) 37.5%, rgba(83, 109, 254, 0.5) 100%);
5003}
5004
5005.mdlext-dark-color-theme .mdl-slider.is-upgraded:active::-ms-thumb {
5006 background: #536DFE;
5007}
5008
5009.mdlext-dark-color-theme .mdl-slider.is-upgraded.is-lowest-value::-webkit-slider-thumb {
5010 border-color: #536DFE;
5011 background: transparent;
5012}
5013
5014.mdlext-dark-color-theme .mdl-slider.is-upgraded.is-lowest-value::-moz-range-thumb {
5015 border-color: rgba(255, 255, 255, 0.87);
5016 background: transparent;
5017}
5018
5019.mdlext-dark-color-theme .mdl-slider.is-upgraded.is-lowest-value:focus:not(:active)::-webkit-slider-thumb {
5020 box-shadow: 0 0 0 10px rgba(255, 255, 255, 0.5);
5021 background: rgba(255, 255, 255, 0.5);
5022}
5023
5024.mdlext-dark-color-theme .mdl-slider.is-upgraded.is-lowest-value:focus:not(:active)::-moz-range-thumb {
5025 box-shadow: 0 0 0 10px rgba(255, 255, 255, 0.5);
5026 background: rgba(255, 255, 255, 0.5);
5027}
5028
5029.mdlext-dark-color-theme .mdl-slider.is-upgraded.is-lowest-value:active::-webkit-slider-thumb {
5030 border-color: rgba(255, 255, 255, 0.87);
5031}
5032
5033.mdlext-dark-color-theme .mdl-slider.is-upgraded.is-lowest-value:active::-moz-range-thumb {
5034 border-color: rgba(255, 255, 255, 0.87);
5035}
5036
5037.mdlext-dark-color-theme .mdl-slider.is-upgraded.is-lowest-value::-ms-thumb {
5038 background: radial-gradient(circle closest-side, transparent 0%, transparent 66.67%, rgba(255, 255, 255, 0.87) 66.67%, rgba(255, 255, 255, 0.87) 100%);
5039}
5040
5041.mdlext-dark-color-theme .mdl-slider.is-upgraded.is-lowest-value:focus:not(:active)::-ms-thumb {
5042 background: radial-gradient(circle closest-side, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0.5) 25%, rgba(255, 255, 255, 0.87) 25%, rgba(255, 255, 255, 0.87) 37.5%, rgba(255, 255, 255, 0.5) 37.5%, rgba(255, 255, 255, 0.5) 100%);
5043}
5044
5045.mdlext-dark-color-theme .mdl-slider.is-upgraded.is-lowest-value:active::-ms-thumb {
5046 background: radial-gradient(circle closest-side, transparent 0%, transparent 77.78%, rgba(255, 255, 255, 0.87) 77.78%, rgba(255, 255, 255, 0.87) 100%);
5047}
5048
5049.mdlext-dark-color-theme .mdl-slider.is-upgraded.is-lowest-value::-ms-fill-lower {
5050 background: transparent;
5051}
5052
5053.mdlext-dark-color-theme .mdl-slider.is-upgraded:disabled:focus::-webkit-slider-thumb,
5054.mdlext-dark-color-theme .mdl-slider.is-upgraded:disabled:active::-webkit-slider-thumb,
5055.mdlext-dark-color-theme .mdl-slider.is-upgraded:disabled::-webkit-slider-thumb {
5056 background: rgba(255, 255, 255, 0.87);
5057}
5058
5059.mdlext-dark-color-theme .mdl-slider.is-upgraded:disabled:focus::-moz-range-thumb,
5060.mdlext-dark-color-theme .mdl-slider.is-upgraded:disabled:active::-moz-range-thumb,
5061.mdlext-dark-color-theme .mdl-slider.is-upgraded:disabled::-moz-range-thumb {
5062 background: rgba(255, 255, 255, 0.87);
5063}
5064
5065.mdlext-dark-color-theme .mdl-slider.is-upgraded:disabled + .mdl-slider__background-flex > .mdl-slider__background-lower {
5066 background-color: rgba(255, 255, 255, 0.87);
5067}
5068
5069.mdlext-dark-color-theme .mdl-slider.is-upgraded.is-lowest-value:disabled:focus::-webkit-slider-thumb,
5070.mdlext-dark-color-theme .mdl-slider.is-upgraded.is-lowest-value:disabled:active::-webkit-slider-thumb,
5071.mdlext-dark-color-theme .mdl-slider.is-upgraded.is-lowest-value:disabled::-webkit-slider-thumb {
5072 border-color: rgba(255, 255, 255, 0.87);
5073 background: transparent;
5074}
5075
5076.mdlext-dark-color-theme .mdl-slider.is-upgraded.is-lowest-value:disabled:focus::-moz-range-thumb,
5077.mdlext-dark-color-theme .mdl-slider.is-upgraded.is-lowest-value:disabled:active::-moz-range-thumb,
5078.mdlext-dark-color-theme .mdl-slider.is-upgraded.is-lowest-value:disabled::-moz-range-thumb {
5079 border-color: rgba(255, 255, 255, 0.87);
5080 background: transparent;
5081}
5082
5083.mdlext-dark-color-theme .mdl-slider.is-upgraded:disabled:focus::-ms-thumb,
5084.mdlext-dark-color-theme .mdl-slider.is-upgraded:disabled:active::-ms-thumb,
5085.mdlext-dark-color-theme .mdl-slider.is-upgraded:disabled::-ms-thumb {
5086 background: rgba(255, 255, 255, 0.87);
5087}
5088
5089.mdlext-dark-color-theme .mdl-slider.is-upgraded.is-lowest-value:disabled:focus::-ms-thumb,
5090.mdlext-dark-color-theme .mdl-slider.is-upgraded.is-lowest-value:disabled:active::-ms-thumb,
5091.mdlext-dark-color-theme .mdl-slider.is-upgraded.is-lowest-value:disabled::-ms-thumb {
5092 background: radial-gradient(circle closest-side, transparent 0%, transparent 50%, rgba(255, 255, 255, 0.87) 50%, rgba(255, 255, 255, 0.87) 100%);
5093}
5094
5095.mdlext-dark-color-theme .mdl-slider.is-upgraded:disabled::-ms-fill-lower {
5096 background: linear-gradient(to right, transparent, transparent 25px, rgba(255, 255, 255, 0.87) 25px, rgba(255, 255, 255, 0.87) 0);
5097}
5098
5099.mdlext-dark-color-theme .mdl-slider__background-flex {
5100 background: transparent;
5101}
5102
5103.mdlext-dark-color-theme .mdl-slider__background-lower {
5104 background: #536DFE;
5105}
5106
5107.mdlext-dark-color-theme .mdl-slider__background-upper {
5108 background: rgba(255, 255, 255, 0.87);
5109}
5110
5111.mdlext-dark-color-theme .mdl-textfield__input {
5112 border-bottom-color: rgba(255, 255, 255, 0.26);
5113}
5114
5115.mdlext-dark-color-theme .mdl-textfield.is-invalid .mdl-textfield__input {
5116 border-color: #FF1744;
5117}
5118
5119.mdlext-dark-color-theme fieldset[disabled] .mdl-textfield .mdl-textfield__input,
5120.mdlext-dark-color-theme .mdl-textfield.is-disabled .mdl-textfield__input {
5121 background-color: transparent;
5122 border-bottom-color: rgba(255, 255, 255, 0.12);
5123 color: rgba(255, 255, 255, 0.26);
5124}
5125
5126.mdlext-dark-color-theme .mdl-textfield__label {
5127 color: rgba(255, 255, 255, 0.5);
5128}
5129
5130.mdlext-dark-color-theme .mdl-textfield__label::after {
5131 background-color: #536DFE;
5132}
5133
5134.mdlext-dark-color-theme fieldset[disabled] .mdl-textfield .mdl-textfield__label,
5135.mdlext-dark-color-theme .mdl-textfield.is-disabled.is-disabled .mdl-textfield__label {
5136 color: rgba(255, 255, 255, 0.26);
5137}
5138
5139.mdlext-dark-color-theme .mdl-textfield--floating-label.is-focused .mdl-textfield__label,
5140.mdlext-dark-color-theme .mdl-textfield--floating-label.is-dirty .mdl-textfield__label,
5141.mdlext-dark-color-theme .mdl-textfield--floating-label.has-placeholder .mdl-textfield__label {
5142 color: #536DFE;
5143}
5144
5145.mdlext-dark-color-theme .mdl-textfield--floating-label.is-invalid .mdl-textfield__label {
5146 color: #FF1744;
5147}
5148
5149.mdlext-dark-color-theme .mdl-textfield.is-invalid .mdl-textfield__label::after {
5150 background-color: #FF1744;
5151}
5152
5153.mdlext-dark-color-theme .mdl-textfield__error {
5154 color: #FF1744;
5155}
5156
5157.mdlext-dark-color-theme .mdl-checkbox__box-outline {
5158 border-color: rgba(255, 255, 255, 0.5);
5159}
5160
5161.mdlext-dark-color-theme .mdl-checkbox.is-checked .mdl-checkbox__box-outline {
5162 border-color: #536DFE;
5163}
5164
5165.mdlext-dark-color-theme fieldset[disabled] .mdl-checkbox .mdl-checkbox__box-outline,
5166.mdlext-dark-color-theme .mdl-checkbox.is-disabled .mdl-checkbox__box-outline {
5167 border-color: rgba(255, 255, 255, 0.26);
5168}
5169
5170.mdlext-dark-color-theme .mdl-checkbox__focus-helper {
5171 background-color: transparent;
5172}
5173
5174.mdlext-dark-color-theme .mdl-checkbox.is-focused.is-checked .mdl-checkbox__focus-helper {
5175 box-shadow: 0 0 0 8px rgba(83, 109, 254, 0.26);
5176 background-color: rgba(83, 109, 254, 0.26);
5177}
5178
5179.mdlext-dark-color-theme .mdl-checkbox__tick-outline {
5180 background: transparent;
5181}
5182
5183.mdlext-dark-color-theme .mdl-checkbox.is-checked .mdl-checkbox__tick-outline {
5184 background-color: #536DFE;
5185}
5186
5187.mdlext-dark-color-theme fieldset[disabled] .mdl-checkbox.is-checked .mdl-checkbox__tick-outline,
5188.mdlext-dark-color-theme .mdl-checkbox.is-checked.is-disabled .mdl-checkbox__tick-outline {
5189 background-color: rgba(255, 255, 255, 0.26);
5190}
5191
5192.mdlext-dark-color-theme fieldset[disabled] .mdl-checkbox .mdl-checkbox__label,
5193.mdlext-dark-color-theme .mdl-checkbox.is-disabled .mdl-checkbox__label {
5194 color: rgba(255, 255, 255, 0.26);
5195}
5196
5197.mdlext-dark-color-theme .mdl-checkbox__ripple-container .mdl-ripple {
5198 background: #536DFE;
5199}
5200
5201.mdlext-dark-color-theme fieldset[disabled] .mdl-checkbox .mdl-checkbox__ripple-container .mdl-ripple,
5202.mdlext-dark-color-theme .mdl-checkbox.is-disabled .mdl-checkbox__ripple-container .mdl-ripple {
5203 background: transparent;
5204}
5205
5206.mdlext-dark-color-theme .mdl-radio__outer-circle {
5207 border-color: rgba(255, 255, 255, 0.5);
5208}
5209
5210.mdlext-dark-color-theme .mdl-radio.is-checked .mdl-radio__outer-circle {
5211 border-color: #536DFE;
5212}
5213
5214.mdlext-dark-color-theme .mdl-radio__outer-circle fieldset[disabled] .mdl-radio,
5215.mdlext-dark-color-theme .mdl-radio.is-disabled .mdl-radio__outer-circle {
5216 border-color: rgba(255, 255, 255, 0.26);
5217}
5218
5219.mdlext-dark-color-theme .mdl-radio__inner-circle {
5220 background: #536DFE;
5221}
5222
5223.mdlext-dark-color-theme fieldset[disabled] .mdl-radio .mdl-radio__inner-circle,
5224.mdlext-dark-color-theme .mdl-radio.is-disabled .mdl-radio__inner-circle {
5225 background: rgba(255, 255, 255, 0.26);
5226}
5227
5228.mdlext-dark-color-theme fieldset[disabled] .mdl-radio .mdl-radio__label,
5229.mdlext-dark-color-theme .mdl-radio.is-disabled .mdl-radio__label {
5230 color: rgba(255, 255, 255, 0.26);
5231}
5232
5233.mdlext-dark-color-theme .mdl-radio__ripple-container .mdl-ripple {
5234 background: #536DFE;
5235}
5236
5237.mdlext-dark-color-theme fieldset[disabled] .mdl-radio .mdl-radio__ripple-container .mdl-ripple,
5238.mdlext-dark-color-theme .mdl-radio.is-disabled .mdl-radio__ripple-container .mdl-ripple {
5239 background: transparent;
5240}
5241
5242.mdlext-dark-color-theme .mdl-icon-toggle__label {
5243 color: #616161;
5244}
5245
5246.mdlext-dark-color-theme .mdl-icon-toggle.is-checked .mdl-icon-toggle__label {
5247 color: #536DFE;
5248}
5249
5250.mdlext-dark-color-theme .mdl-icon-toggle.is-disabled .mdl-icon-toggle__label {
5251 color: rgba(255, 255, 255, 0.5);
5252}
5253
5254.mdlext-dark-color-theme .mdl-icon-toggle.is-focused .mdl-icon-toggle__label {
5255 background-color: rgba(0, 0, 0, 0.12);
5256}
5257
5258.mdlext-dark-color-theme .mdl-icon-toggle.is-focused.is-checked .mdl-icon-toggle__label {
5259 background-color: rgba(83, 109, 254, 0.26);
5260}
5261
5262.mdlext-dark-color-theme .mdl-icon-toggle__ripple-container .mdl-ripple {
5263 background: #616161;
5264}
5265
5266.mdlext-dark-color-theme .mdl-icon-toggle.is-disabled .mdl-icon-toggle__ripple-container .mdl-ripple {
5267 background: transparent;
5268}
5269
5270.mdlext-dark-color-theme .mdl-switch__track {
5271 background: rgba(255, 255, 255, 0.26);
5272}
5273
5274.mdlext-dark-color-theme .mdl-switch.is-checked .mdl-switch__track {
5275 background: rgba(83, 109, 254, 0.5);
5276}
5277
5278.mdlext-dark-color-theme .mdl-switch__track fieldset[disabled] .mdl-switch,
5279.mdlext-dark-color-theme .mdl-switch.is-disabled .mdl-switch__track {
5280 background: rgba(255, 255, 255, 0.12);
5281}
5282
5283.mdlext-dark-color-theme .mdl-switch__thumb {
5284 background: #FAFAFA;
5285}
5286
5287.mdlext-dark-color-theme .mdl-switch.is-checked .mdl-switch__thumb {
5288 background: #536DFE;
5289}
5290
5291.mdlext-dark-color-theme .mdl-switch__thumb fieldset[disabled] .mdl-switch,
5292.mdlext-dark-color-theme .mdl-switch.is-disabled .mdl-switch__thumb {
5293 background: #FAFAFA;
5294}
5295
5296.mdlext-dark-color-theme .mdl-switch__focus-helper {
5297 background-color: transparent;
5298}
5299
5300.mdlext-dark-color-theme .mdl-switch.is-focused .mdl-switch__focus-helper {
5301 background-color: rgba(0, 0, 0, 0.1);
5302}
5303
5304.mdlext-dark-color-theme .mdl-switch.is-focused.is-checked .mdl-switch__focus-helper {
5305 box-shadow: 0 0 0 20px rgba(83, 109, 254, 0.26);
5306 background-color: rgba(83, 109, 254, 0.26);
5307}
5308
5309.mdlext-dark-color-theme .mdl-switch__label fieldset[disabled] .mdl-switch,
5310.mdlext-dark-color-theme .mdl-switch.is-disabled .mdl-switch__label {
5311 color: #FAFAFA;
5312}
5313
5314.mdlext-dark-color-theme .mdl-switch__ripple-container .mdl-ripple {
5315 background: #536DFE;
5316}
5317
5318.mdlext-dark-color-theme fieldset[disabled] .mdl-switch .mdl-switch__ripple-container .mdl-ripple,
5319.mdlext-dark-color-theme .mdl-switch.is-disabled .mdl-switch__ripple-container .mdl-ripple {
5320 background: transparent;
5321}
5322
5323.mdlext-dark-color-theme .mdl-data-table {
5324 border-color: rgba(255, 255, 255, 0.12);
5325 background-color: #303030;
5326}
5327
5328.mdlext-dark-color-theme .mdl-data-table tbody tr.is-selected {
5329 background-color: #424242;
5330}
5331
5332.mdlext-dark-color-theme .mdl-data-table tbody tr:hover {
5333 background-color: #212121;
5334}
5335
5336.mdlext-dark-color-theme .mdl-data-table th {
5337 color: rgba(255, 255, 255, 0.87);
5338}
5339
5340.mdlext-dark-color-theme .mdl-data-table th.mdl-data-table__header--sorted-ascending,
5341.mdlext-dark-color-theme .mdl-data-table th.mdl-data-table__header--sorted-descending {
5342 color: rgba(255, 255, 255, 0.87);
5343}
5344
5345.mdlext-dark-color-theme .mdl-data-table th.mdl-data-table__header--sorted-ascending:hover::before,
5346.mdlext-dark-color-theme .mdl-data-table th.mdl-data-table__header--sorted-descending:hover::before {
5347 color: rgba(255, 255, 255, 0.26);
5348}
5349
5350.mdlext-dark-color-theme .mdl-menu__outline {
5351 background: #000000;
5352}
5353
5354.mdlext-dark-color-theme .mdl-menu__item {
5355 color: rgba(255, 255, 255, 0.87);
5356 background-color: transparent;
5357 outline-color: #616161;
5358}
5359
5360.mdlext-dark-color-theme .mdl-menu__item--full-bleed-divider {
5361 border-bottom-color: rgba(255, 255, 255, 0.2);
5362}
5363
5364.mdlext-dark-color-theme .mdl-menu__item[disabled],
5365.mdlext-dark-color-theme .mdl-menu__item[data-mdl-disabled] {
5366 color: #9E9E9E;
5367 background-color: transparent;
5368}
5369
5370.mdlext-dark-color-theme .mdl-menu__item[disabled]:hover,
5371.mdlext-dark-color-theme .mdl-menu__item[data-mdl-disabled]:hover {
5372 background-color: transparent;
5373}
5374
5375.mdlext-dark-color-theme .mdl-menu__item[disabled]:focus,
5376.mdlext-dark-color-theme .mdl-menu__item[data-mdl-disabled]:focus {
5377 background-color: transparent;
5378}
5379
5380.mdlext-dark-color-theme .mdl-menu__item[disabled] .mdl-ripple,
5381.mdlext-dark-color-theme .mdl-menu__item[data-mdl-disabled] .mdl-ripple {
5382 background: transparent;
5383}
5384
5385.mdlext-dark-color-theme .mdl-menu__item:hover {
5386 background-color: #212121;
5387}
5388
5389.mdlext-dark-color-theme .mdl-menu__item:focus {
5390 background-color: #212121;
5391}
5392
5393.mdlext-dark-color-theme .mdl-menu__item:active {
5394 background-color: #424242;
5395}
5396
5397.mdlext-dark-color-theme .mdl-card {
5398 background: #303030;
5399}
5400
5401.mdlext-dark-color-theme .mdl-card__media {
5402 background-color: #536DFE;
5403}
5404
5405.mdlext-dark-color-theme .mdl-card__title {
5406 color: white;
5407}
5408
5409.mdlext-dark-color-theme .mdl-card__title.mdl-card--border {
5410 border-bottom-color: rgba(0, 0, 0, 0.1);
5411}
5412
5413.mdlext-dark-color-theme .mdl-card__title-text {
5414 color: inherit;
5415}
5416
5417.mdlext-dark-color-theme .mdl-card__subtitle-text {
5418 color: rgba(0, 0, 0, 0.7);
5419}
5420
5421.mdlext-dark-color-theme .mdl-card__supporting-text {
5422 color: rgba(255, 255, 255, 0.7);
5423}
5424
5425.mdlext-dark-color-theme .mdl-card__actions {
5426 background-color: rgba(255, 255, 255, 0);
5427}
5428
5429.mdlext-dark-color-theme .mdl-card__actions.mdl-card--border {
5430 border-top-color: rgba(0, 0, 0, 0.1);
5431}
5432
5433.mdlext-dark-color-theme .mdlext-selectfield.is-disabled::after {
5434 color: rgba(255, 255, 255, 0.12);
5435 content: '';
5436 width: 0;
5437 height: 0;
5438 font-size: inherit;
5439 line-height: inherit;
5440 border-top: 0.5em solid rgba(255, 255, 255, 0.12);
5441 border-top-width: 0.5em;
5442 border-top-style: solid;
5443 border-top-color: rgba(255, 255, 255, 0.12);
5444 border-left: 0.35em solid transparent;
5445 border-right: 0.35em solid transparent;
5446}
5447
5448.mdlext-dark-color-theme .mdlext-selectfield__select {
5449 border-bottom-color: rgba(255, 255, 255, 0.26);
5450 color: inherit;
5451}
5452
5453.mdlext-dark-color-theme .mdlext-selectfield__select option {
5454 background-color: #303030;
5455 color: white;
5456}
5457
5458.mdlext-dark-color-theme .mdlext-selectfield.is-invalid .mdlext-selectfield__select {
5459 border-color: #FF1744;
5460}
5461
5462.mdlext-dark-color-theme fieldset[disabled] .mdlext-selectfield .mdlext-selectfield__select,
5463.mdlext-dark-color-theme .mdlext-selectfield.is-disabled .mdlext-selectfield__select {
5464 background-color: transparent;
5465 border-bottom-color: rgba(255, 255, 255, 0.12);
5466 color: rgba(255, 255, 255, 0.26);
5467}
5468
5469.mdlext-dark-color-theme .mdlext-selectfield__label {
5470 color: rgba(255, 255, 255, 0.5);
5471}
5472
5473.mdlext-dark-color-theme fieldset[disabled] .mdlext-selectfield .mdlext-selectfield__label,
5474.mdlext-dark-color-theme .mdlext-selectfield.is-disabled.is-disabled .mdlext-selectfield__label {
5475 color: rgba(255, 255, 255, 0.26);
5476}
5477
5478.mdlext-dark-color-theme .mdlext-selectfield--floating-label.is-focused .mdlext-selectfield__label,
5479.mdlext-dark-color-theme .mdlext-selectfield--floating-label.is-dirty .mdlext-selectfield__label,
5480.mdlext-dark-color-theme .mdlext-selectfield--floating-label.is-dirty.is-dirty .mdlext-selectfield__label,
5481.mdlext-dark-color-theme .mdlext-selectfield--floating-label.has-placeholder .mdlext-selectfield__label {
5482 color: #536DFE;
5483}
5484
5485.mdlext-dark-color-theme .mdlext-selectfield--floating-label.is-invalid .mdlext-selectfield__label {
5486 color: #FF1744;
5487}
5488
5489.mdlext-dark-color-theme .mdlext-selectfield__label::after {
5490 background-color: #536DFE;
5491}
5492
5493.mdlext-dark-color-theme .mdlext-selectfield.is-invalid .mdlext-selectfield__label::after {
5494 background-color: #FF1744;
5495}
5496
5497.mdlext-dark-color-theme .mdlext-selectfield__error {
5498 color: #FF1744;
5499}
5500
5501.mdlext-menu.mdlext-dark-color-theme {
5502 background: #000000;
5503}
5504
5505.mdlext-dark-color-theme .mdlext-menu {
5506 background: #000000;
5507}
5508
5509.mdlext-dark-color-theme .mdlext-menu__item {
5510 color: rgba(255, 255, 255, 0.87);
5511 background-color: #000000;
5512}
5513
5514.mdlext-dark-color-theme .mdlext-menu__item:active,
5515.mdlext-dark-color-theme .mdlext-menu__item[aria-selected='true'] {
5516 background-color: #424242;
5517}
5518
5519.mdlext-dark-color-theme .mdlext-menu__item:hover:not([disabled]) {
5520 background-color: #212121;
5521}
5522
5523.mdlext-dark-color-theme .mdlext-menu__item:focus {
5524 outline-color: #616161;
5525 background-color: #212121;
5526}
5527
5528.mdlext-dark-color-theme .mdlext-menu__item[disabled] {
5529 color: #9E9E9E;
5530}
5531
5532.mdlext-dark-color-theme .mdlext-menu__item[disabled] > * {
5533 color: #9E9E9E;
5534}
5535
5536.mdlext-dark-color-theme .mdlext-menu__item-separator {
5537 border-bottom: 1px solid rgba(255, 255, 255, 0.2);
5538}
5539
5540.mdlext-dark-color-theme .mdlext-bordered-fields .mdl-textfield .mdl-textfield__input,
5541.mdlext-dark-color-theme .mdlext-bordered-fields .mdl-textfield .mdlext-selectfield__select,
5542.mdlext-dark-color-theme .mdlext-bordered-fields .mdlext-selectfield .mdl-textfield__input,
5543.mdlext-dark-color-theme .mdlext-bordered-fields .mdlext-selectfield .mdlext-selectfield__select {
5544 background-color: rgba(48, 48, 48, 0.1);
5545 border-color: rgba(255, 255, 255, 0.26);
5546 color: inherit;
5547}
5548
5549.mdlext-dark-color-theme .mdlext-bordered-fields .mdl-textfield .mdl-textfield__input:disabled,
5550.mdlext-dark-color-theme .mdlext-bordered-fields .mdl-textfield .mdlext-selectfield__select:disabled,
5551.mdlext-dark-color-theme .mdlext-bordered-fields .mdlext-selectfield .mdl-textfield__input:disabled,
5552.mdlext-dark-color-theme .mdlext-bordered-fields .mdlext-selectfield .mdlext-selectfield__select:disabled {
5553 color: rgba(255, 255, 255, 0.26);
5554 background-color: rgba(48, 48, 48, 0.1);
5555 border-color: rgba(255, 255, 255, 0.12);
5556}
5557
5558.mdlext-dark-color-theme .mdlext-bordered-fields .mdl-textfield .mdl-textfield__input:focus,
5559.mdlext-dark-color-theme .mdlext-bordered-fields .mdl-textfield .mdlext-selectfield__select:focus,
5560.mdlext-dark-color-theme .mdlext-bordered-fields .mdlext-selectfield .mdl-textfield__input:focus,
5561.mdlext-dark-color-theme .mdlext-bordered-fields .mdlext-selectfield .mdlext-selectfield__select:focus {
5562 background-color: rgba(23, 23, 23, 0.1);
5563 border-color: #536DFE;
5564}
5565
5566.mdlext-dark-color-theme .mdlext-bordered-fields .mdl-textfield.is-invalid .mdl-textfield__input,
5567.mdlext-dark-color-theme .mdlext-bordered-fields .mdl-textfield.is-invalid .mdlext-selectfield__select,
5568.mdlext-dark-color-theme .mdlext-bordered-fields .mdlext-selectfield.is-invalid .mdl-textfield__input,
5569.mdlext-dark-color-theme .mdlext-bordered-fields .mdlext-selectfield.is-invalid .mdlext-selectfield__select {
5570 color: inherit;
5571 border-color: #FF1744;
5572 background-color: rgba(255, 23, 68, 0.1);
5573}
5574
5575.mdlext-dark-color-theme .mdlext-bordered-fields .mdl-textfield.is-invalid .mdl-textfield__input:focus,
5576.mdlext-dark-color-theme .mdlext-bordered-fields .mdl-textfield.is-invalid .mdlext-selectfield__select:focus,
5577.mdlext-dark-color-theme .mdlext-bordered-fields .mdlext-selectfield.is-invalid .mdl-textfield__input:focus,
5578.mdlext-dark-color-theme .mdlext-bordered-fields .mdlext-selectfield.is-invalid .mdlext-selectfield__select:focus {
5579 border-color: #e3002c;
5580 background-color: rgba(255, 23, 68, 0.1);
5581}
5582
5583.mdlext-dark-color-theme .mdlext-bordered-fields fieldset[disabled] .mdlext-selectfield::after,
5584.mdlext-dark-color-theme .mdlext-bordered-fields .mdlext-selectfield.is-disabled::after {
5585 color: rgba(255, 255, 255, 0.26);
5586 content: '';
5587 width: 0;
5588 height: 0;
5589 font-size: inherit;
5590 line-height: inherit;
5591 border-top: 0.5em solid rgba(255, 255, 255, 0.26);
5592 border-top-width: 0.5em;
5593 border-top-style: solid;
5594 border-top-color: rgba(255, 255, 255, 0.26);
5595 border-left: 0.35em solid transparent;
5596 border-right: 0.35em solid transparent;
5597}
5598
5599.mdlext-dark-color-theme .mdlext-bordered-fields fieldset[disabled] .mdl-textfield .mdl-textfield__input,
5600.mdlext-dark-color-theme .mdlext-bordered-fields fieldset[disabled] .mdlext-selectfield .mdlext-selectfield__select {
5601 color: rgba(255, 255, 255, 0.26);
5602 background-color: rgba(48, 48, 48, 0.1);
5603 border-color: rgba(255, 255, 255, 0.12);
5604}
5605
5606.mdlext-dark-color-theme .mdlext-bordered-fields .mdl-textfield .mdl-textfield__label,
5607.mdlext-dark-color-theme .mdlext-bordered-fields .mdl-textfield .mdlext-selectfield__label,
5608.mdlext-dark-color-theme .mdlext-bordered-fields .mdlext-selectfield .mdl-textfield__label,
5609.mdlext-dark-color-theme .mdlext-bordered-fields .mdlext-selectfield .mdlext-selectfield__label {
5610 color: rgba(255, 255, 255, 0.5);
5611}
5612
5613.mdlext-dark-color-theme .mdlext-bordered-fields .mdl-textfield.mdl-textfield--floating-label.is-focused.is-focused .mdl-textfield__label,
5614.mdlext-dark-color-theme .mdlext-bordered-fields .mdl-textfield.mdl-textfield--floating-label.is-focused.is-focused .mdlext-selectfield__label,
5615.mdlext-dark-color-theme .mdlext-bordered-fields .mdl-textfield.mdl-textfield--floating-label.is-dirty.is-dirty .mdl-textfield__label,
5616.mdlext-dark-color-theme .mdlext-bordered-fields .mdl-textfield.mdl-textfield--floating-label.is-dirty.is-dirty .mdlext-selectfield__label,
5617.mdlext-dark-color-theme .mdlext-bordered-fields .mdl-textfield.mdl-textfield--floating-label.has-placeholder .mdl-textfield__label,
5618.mdlext-dark-color-theme .mdlext-bordered-fields .mdl-textfield.mdl-textfield--floating-label.has-placeholder .mdlext-selectfield__label,
5619.mdlext-dark-color-theme .mdlext-bordered-fields .mdl-textfield.mdlext-selectfield--floating-label.is-focused.is-focused .mdl-textfield__label,
5620.mdlext-dark-color-theme .mdlext-bordered-fields .mdl-textfield.mdlext-selectfield--floating-label.is-focused.is-focused .mdlext-selectfield__label,
5621.mdlext-dark-color-theme .mdlext-bordered-fields .mdl-textfield.mdlext-selectfield--floating-label.is-dirty.is-dirty .mdl-textfield__label,
5622.mdlext-dark-color-theme .mdlext-bordered-fields .mdl-textfield.mdlext-selectfield--floating-label.is-dirty.is-dirty .mdlext-selectfield__label,
5623.mdlext-dark-color-theme .mdlext-bordered-fields .mdl-textfield.mdlext-selectfield--floating-label.has-placeholder .mdl-textfield__label,
5624.mdlext-dark-color-theme .mdlext-bordered-fields .mdl-textfield.mdlext-selectfield--floating-label.has-placeholder .mdlext-selectfield__label,
5625.mdlext-dark-color-theme .mdlext-bordered-fields .mdlext-selectfield.mdl-textfield--floating-label.is-focused.is-focused .mdl-textfield__label,
5626.mdlext-dark-color-theme .mdlext-bordered-fields .mdlext-selectfield.mdl-textfield--floating-label.is-focused.is-focused .mdlext-selectfield__label,
5627.mdlext-dark-color-theme .mdlext-bordered-fields .mdlext-selectfield.mdl-textfield--floating-label.is-dirty.is-dirty .mdl-textfield__label,
5628.mdlext-dark-color-theme .mdlext-bordered-fields .mdlext-selectfield.mdl-textfield--floating-label.is-dirty.is-dirty .mdlext-selectfield__label,
5629.mdlext-dark-color-theme .mdlext-bordered-fields .mdlext-selectfield.mdl-textfield--floating-label.has-placeholder .mdl-textfield__label,
5630.mdlext-dark-color-theme .mdlext-bordered-fields .mdlext-selectfield.mdl-textfield--floating-label.has-placeholder .mdlext-selectfield__label,
5631.mdlext-dark-color-theme .mdlext-bordered-fields .mdlext-selectfield.mdlext-selectfield--floating-label.is-focused.is-focused .mdl-textfield__label,
5632.mdlext-dark-color-theme .mdlext-bordered-fields .mdlext-selectfield.mdlext-selectfield--floating-label.is-focused.is-focused .mdlext-selectfield__label,
5633.mdlext-dark-color-theme .mdlext-bordered-fields .mdlext-selectfield.mdlext-selectfield--floating-label.is-dirty.is-dirty .mdl-textfield__label,
5634.mdlext-dark-color-theme .mdlext-bordered-fields .mdlext-selectfield.mdlext-selectfield--floating-label.is-dirty.is-dirty .mdlext-selectfield__label,
5635.mdlext-dark-color-theme .mdlext-bordered-fields .mdlext-selectfield.mdlext-selectfield--floating-label.has-placeholder .mdl-textfield__label,
5636.mdlext-dark-color-theme .mdlext-bordered-fields .mdlext-selectfield.mdlext-selectfield--floating-label.has-placeholder .mdlext-selectfield__label {
5637 color: #536DFE;
5638}
5639
5640.mdlext-dark-color-theme .mdlext-bordered-fields .mdl-textfield.mdl-textfield--floating-label.is-disabled.is-disabled .mdl-textfield__label,
5641.mdlext-dark-color-theme .mdlext-bordered-fields .mdl-textfield.mdl-textfield--floating-label.is-disabled.is-disabled .mdlext-selectfield__label,
5642.mdlext-dark-color-theme .mdlext-bordered-fields .mdl-textfield.mdlext-selectfield--floating-label.is-disabled.is-disabled .mdl-textfield__label,
5643.mdlext-dark-color-theme .mdlext-bordered-fields .mdl-textfield.mdlext-selectfield--floating-label.is-disabled.is-disabled .mdlext-selectfield__label,
5644.mdlext-dark-color-theme .mdlext-bordered-fields .mdlext-selectfield.mdl-textfield--floating-label.is-disabled.is-disabled .mdl-textfield__label,
5645.mdlext-dark-color-theme .mdlext-bordered-fields .mdlext-selectfield.mdl-textfield--floating-label.is-disabled.is-disabled .mdlext-selectfield__label,
5646.mdlext-dark-color-theme .mdlext-bordered-fields .mdlext-selectfield.mdlext-selectfield--floating-label.is-disabled.is-disabled .mdl-textfield__label,
5647.mdlext-dark-color-theme .mdlext-bordered-fields .mdlext-selectfield.mdlext-selectfield--floating-label.is-disabled.is-disabled .mdlext-selectfield__label {
5648 color: rgba(255, 255, 255, 0.26);
5649}
5650
5651.mdlext-dark-color-theme .mdlext-bordered-fields .mdl-textfield.mdl-textfield--floating-label.is-invalid.is-invalid .mdl-textfield__label,
5652.mdlext-dark-color-theme .mdlext-bordered-fields .mdl-textfield.mdl-textfield--floating-label.is-invalid.is-invalid .mdlext-selectfield__label,
5653.mdlext-dark-color-theme .mdlext-bordered-fields .mdl-textfield.mdlext-selectfield--floating-label.is-invalid.is-invalid .mdl-textfield__label,
5654.mdlext-dark-color-theme .mdlext-bordered-fields .mdl-textfield.mdlext-selectfield--floating-label.is-invalid.is-invalid .mdlext-selectfield__label,
5655.mdlext-dark-color-theme .mdlext-bordered-fields .mdlext-selectfield.mdl-textfield--floating-label.is-invalid.is-invalid .mdl-textfield__label,
5656.mdlext-dark-color-theme .mdlext-bordered-fields .mdlext-selectfield.mdl-textfield--floating-label.is-invalid.is-invalid .mdlext-selectfield__label,
5657.mdlext-dark-color-theme .mdlext-bordered-fields .mdlext-selectfield.mdlext-selectfield--floating-label.is-invalid.is-invalid .mdl-textfield__label,
5658.mdlext-dark-color-theme .mdlext-bordered-fields .mdlext-selectfield.mdlext-selectfield--floating-label.is-invalid.is-invalid .mdlext-selectfield__label {
5659 color: #FF1744;
5660}
5661
5662.mdlext-dark-color-theme .mdlext-bordered-fields fieldset[disabled] .mdl-textfield .mdl-textfield__label,
5663.mdlext-dark-color-theme .mdlext-bordered-fields fieldset[disabled] .mdl-selectfield .mdl-selectfield__label {
5664 color: rgba(255, 255, 255, 0.26);
5665}
5666
5667.mdlext-dark-color-theme .mdlext-bordered-fields .mdl-textfield.is-disabled i,
5668.mdlext-dark-color-theme .mdlext-bordered-fields .mdl-textfield.is-disabled .mdl-button,
5669.mdlext-dark-color-theme .mdlext-bordered-fields .mdlext-selectfield.is-disabled i,
5670.mdlext-dark-color-theme .mdlext-bordered-fields .mdlext-selectfield.is-disabled .mdl-button {
5671 color: rgba(255, 255, 255, 0.12);
5672}
5673
5674.mdlext-dark-color-theme .mdlext-bordered-fields fieldset[disabled] .mdl-textfield i,
5675.mdlext-dark-color-theme .mdlext-bordered-fields fieldset[disabled] .mdl-textfield .mdl-button,
5676.mdlext-dark-color-theme .mdlext-bordered-fields fieldset[disabled] .mdlext-selectfield i,
5677.mdlext-dark-color-theme .mdlext-bordered-fields fieldset[disabled] .mdlext-selectfield .mdl-button {
5678 color: rgba(255, 255, 255, 0.12);
5679}
5680
5681.mdlext-dark-color-theme .mdlext-accordion__tab {
5682 color: white;
5683 background-color: black;
5684}
5685
5686.mdlext-dark-color-theme .mdlext-accordion__tab:focus {
5687 outline-color: #a8a8a8;
5688}
5689
5690.mdlext-dark-color-theme .mdlext-accordion__tab[aria-expanded='true'] {
5691 background-color: rgba(0, 0, 0, 0.9);
5692}
5693
5694.mdlext-dark-color-theme .mdlext-accordion__tab[aria-selected='true'] {
5695 background-color: rgba(0, 0, 0, 0.6);
5696}
5697
5698.mdlext-dark-color-theme .mdlext-accordion__tab[disabled] {
5699 background-color: rgba(0, 0, 0, 0.4);
5700 color: rgba(255, 255, 255, 0.5);
5701 pointer-events: none;
5702}
5703
5704.mdlext-dark-color-theme .mdlext-accordion__tab[disabled] > * {
5705 color: rgba(255, 255, 255, 0.5);
5706}
5707
5708.mdlext-dark-color-theme .mdlext-accordion__tab:hover:not([disabled]) {
5709 background-color: rgba(0, 0, 0, 0.5);
5710}
5711
5712.mdlext-dark-color-theme .mdlext-accordion__tab--ripple[aria-selected='true']::before {
5713 background: rgba(0, 0, 0, 0.3);
5714}
5715
5716.mdlext-dark-color-theme .mdlext-accordion__tabpanel {
5717 color: inherit;
5718 background-color: transparent;
5719}
5720
5721.mdlext-dark-color-theme .mdlext-accordion--vertical .mdlext-accordion__tab {
5722 border-top: 1px solid #424242;
5723}
5724
5725.mdlext-dark-color-theme .mdlext-accordion--vertical .mdlext-accordion__tab[aria-selected='true']::after {
5726 background-color: #a8a8a8;
5727}
5728
5729.mdlext-dark-color-theme .mdlext-accordion--vertical .mdlext-accordion__tabpanel {
5730 border-top: 1px solid #424242;
5731}
5732
5733.mdlext-dark-color-theme .mdlext-accordion--horizontal .mdlext-accordion__tab {
5734 border-left: 1px solid #424242;
5735}
5736
5737.mdlext-dark-color-theme .mdlext-accordion--horizontal .mdlext-accordion__tab[aria-selected='true']::after {
5738 background-color: #a8a8a8;
5739}
5740
5741.mdlext-dark-color-theme .mdlext-accordion--horizontal .mdlext-accordion__tabpanel {
5742 border-left: 1px solid #424242;
5743}
5744
5745.mdlext-dark-color-theme .mdlext-accordion__panel:first-child > .mdlext-dark-color-theme .mdlext-accordion__tab {
5746 border-top-color: transparent;
5747 border-left-color: transparent;
5748}
5749
5750.mdlext-dark-color-theme .mdlext-accordion[disabled] .mdlext-accordion__tab {
5751 background-color: rgba(0, 0, 0, 0.4);
5752 color: rgba(255, 255, 255, 0.5);
5753}
5754
5755.mdlext-dark-color-theme .mdlext-accordion[disabled] .mdlext-accordion__tab > * {
5756 color: rgba(255, 255, 255, 0.5);
5757}
5758
5759.mdlext-dark-color-theme .mdlext-accordion[disabled] .mdlext-accordion__tabpanel {
5760 opacity: 0.8;
5761 filter: blur(1px) grayscale(80%);
5762}
5763
5764
5765/*# sourceMappingURL=mdl-ext.css.map*/