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