blob: abd3392fa7357bf585d8d0c0ce9becbb79666249 [file] [log] [blame]
Copybara botbe50d492023-11-30 00:16:42 +01001/**
2 * material-design-lite - Material Design Components in CSS, JS and HTML
3 * @version v1.3.0
4 * @license Apache-2.0
5 * @copyright 2015 Google, Inc.
6 * @link https://github.com/google/material-design-lite
7 */
8/**
9 * Copyright 2015 Google Inc. All Rights Reserved.
10 *
11 * Licensed under the Apache License, Version 2.0 (the "License");
12 * you may not use this file except in compliance with the License.
13 * You may obtain a copy of the License at
14 *
15 * http://www.apache.org/licenses/LICENSE-2.0
16 *
17 * Unless required by applicable law or agreed to in writing, software
18 * distributed under the License is distributed on an "AS IS" BASIS,
19 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
20 * See the License for the specific language governing permissions and
21 * limitations under the License.
22 */
23/* Material Design Lite Grid*/
24/**
25 * Copyright 2015 Google Inc. All Rights Reserved.
26 *
27 * Licensed under the Apache License, Version 2.0 (the "License");
28 * you may not use this file except in compliance with the License.
29 * You may obtain a copy of the License at
30 *
31 * http://www.apache.org/licenses/LICENSE-2.0
32 *
33 * Unless required by applicable law or agreed to in writing, software
34 * distributed under the License is distributed on an "AS IS" BASIS,
35 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
36 * See the License for the specific language governing permissions and
37 * limitations under the License.
38 */
39/*------------------------------------* $CONTENTS
40\*------------------------------------*/
41/**
42 * STYLE GUIDE VARIABLES------------------Declarations of Sass variables
43 * -----Typography
44 * -----Colors
45 * -----Textfield
46 * -----Switch
47 * -----Spinner
48 * -----Radio
49 * -----Menu
50 * -----List
51 * -----Layout
52 * -----Icon toggles
53 * -----Footer
54 * -----Column
55 * -----Checkbox
56 * -----Card
57 * -----Button
58 * -----Animation
59 * -----Progress
60 * -----Badge
61 * -----Shadows
62 * -----Grid
63 * -----Data table
64 * -----Dialog
65 * -----Snackbar
66 * -----Tooltip
67 * -----Chip
68 *
69 * Even though all variables have the `!default` directive, most of them
70 * should not be changed as they are dependent one another. This can cause
71 * visual distortions (like alignment issues) that are hard to track down
72 * and fix.
73 */
74/* ========== TYPOGRAPHY ========== */
75/* We're splitting fonts into "preferred" and "performance" in order to optimize
76 page loading. For important text, such as the body, we want it to load
77 immediately and not wait for the web font load, whereas for other sections,
78 such as headers and titles, we're OK with things taking a bit longer to load.
79 We do have some optional classes and parameters in the mixins, in case you
80 definitely want to make sure you're using the preferred font and don't mind
81 the performance hit.
82 We should be able to improve on this once CSS Font Loading L3 becomes more
83 widely available.
84*/
85/* ========== COLORS ========== */
86/**
87*
88* Material design color palettes.
89* @see http://www.google.com/design/spec/style/color.html
90*
91**/
92/**
93 * Copyright 2015 Google Inc. All Rights Reserved.
94 *
95 * Licensed under the Apache License, Version 2.0 (the "License");
96 * you may not use this file except in compliance with the License.
97 * You may obtain a copy of the License at
98 *
99 * http://www.apache.org/licenses/LICENSE-2.0
100 *
101 * Unless required by applicable law or agreed to in writing, software
102 * distributed under the License is distributed on an "AS IS" BASIS,
103 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
104 * See the License for the specific language governing permissions and
105 * limitations under the License.
106 */
107/* ========== Color Palettes ========== */
108/* colors.scss */
109/**
110 * Copyright 2015 Google Inc. All Rights Reserved.
111 *
112 * Licensed under the Apache License, Version 2.0 (the "License");
113 * you may not use this file except in compliance with the License.
114 * You may obtain a copy of the License at
115 *
116 * http://www.apache.org/licenses/LICENSE-2.0
117 *
118 * Unless required by applicable law or agreed to in writing, software
119 * distributed under the License is distributed on an "AS IS" BASIS,
120 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
121 * See the License for the specific language governing permissions and
122 * limitations under the License.
123 */
124/* ========== IMAGES ========== */
125/* ========== Color & Themes ========== */
126/* ========== Typography ========== */
127/* ========== Components ========== */
128/* ========== Standard Buttons ========== */
129/* ========== Icon Toggles ========== */
130/* ========== Radio Buttons ========== */
131/* ========== Ripple effect ========== */
132/* ========== Layout ========== */
133/* ========== Content Tabs ========== */
134/* ========== Checkboxes ========== */
135/* ========== Switches ========== */
136/* ========== Spinner ========== */
137/* ========== Text fields ========== */
138/* ========== Card ========== */
139/* ========== Sliders ========== */
140/* ========== Progress ========== */
141/* ========== List ========== */
142/* ========== Item ========== */
143/* ========== Dropdown menu ========== */
144/* ========== Tooltips ========== */
145/* ========== Footer ========== */
146/* TEXTFIELD */
147/* SWITCH */
148/* SPINNER */
149/* RADIO */
150/* MENU */
151/* LIST */
152/* LAYOUT */
153/* ICON TOGGLE */
154/* FOOTER */
155/*mega-footer*/
156/*mini-footer*/
157/* CHECKBOX */
158/* CARD */
159/* Card dimensions */
160/* Cover image */
161/* BUTTON */
162/**
163 *
164 * Dimensions
165 *
166 */
167/* ANIMATION */
168/* PROGRESS */
169/* BADGE */
170/* SHADOWS */
171/* GRID */
172/* DATA TABLE */
173/* DIALOG */
174/* SNACKBAR */
175/* TOOLTIP */
176/* CHIP */
177/**
178 * Copyright 2015 Google Inc. All Rights Reserved.
179 *
180 * Licensed under the Apache License, Version 2.0 (the "License");
181 * you may not use this file except in compliance with the License.
182 * You may obtain a copy of the License at
183 *
184 * http://www.apache.org/licenses/LICENSE-2.0
185 *
186 * Unless required by applicable law or agreed to in writing, software
187 * distributed under the License is distributed on an "AS IS" BASIS,
188 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
189 * See the License for the specific language governing permissions and
190 * limitations under the License.
191 */
192/* Typography */
193/* Shadows */
194/* Animations */
195/* Dialog */
196/**
197 * Copyright 2015 Google Inc. All Rights Reserved.
198 *
199 * Licensed under the Apache License, Version 2.0 (the "License");
200 * you may not use this file except in compliance with the License.
201 * You may obtain a copy of the License at
202 *
203 * http://www.apache.org/licenses/LICENSE-2.0
204 *
205 * Unless required by applicable law or agreed to in writing, software
206 * distributed under the License is distributed on an "AS IS" BASIS,
207 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
208 * See the License for the specific language governing permissions and
209 * limitations under the License.
210 */
211/*
212* NOTE: Some rules here are applied using duplicate selectors.
213* This is on purpose to increase their specificity when applied.
214* For example: `.mdl-cell--1-col-phone.mdl-cell--1-col-phone`
215*/
216/**
217 * Copyright 2015 Google Inc. All Rights Reserved.
218 *
219 * Licensed under the Apache License, Version 2.0 (the "License");
220 * you may not use this file except in compliance with the License.
221 * You may obtain a copy of the License at
222 *
223 * http://www.apache.org/licenses/LICENSE-2.0
224 *
225 * Unless required by applicable law or agreed to in writing, software
226 * distributed under the License is distributed on an "AS IS" BASIS,
227 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
228 * See the License for the specific language governing permissions and
229 * limitations under the License.
230 */
231/*------------------------------------* $CONTENTS
232\*------------------------------------*/
233/**
234 * STYLE GUIDE VARIABLES------------------Declarations of Sass variables
235 * -----Typography
236 * -----Colors
237 * -----Textfield
238 * -----Switch
239 * -----Spinner
240 * -----Radio
241 * -----Menu
242 * -----List
243 * -----Layout
244 * -----Icon toggles
245 * -----Footer
246 * -----Column
247 * -----Checkbox
248 * -----Card
249 * -----Button
250 * -----Animation
251 * -----Progress
252 * -----Badge
253 * -----Shadows
254 * -----Grid
255 * -----Data table
256 * -----Dialog
257 * -----Snackbar
258 * -----Tooltip
259 * -----Chip
260 *
261 * Even though all variables have the `!default` directive, most of them
262 * should not be changed as they are dependent one another. This can cause
263 * visual distortions (like alignment issues) that are hard to track down
264 * and fix.
265 */
266/* ========== TYPOGRAPHY ========== */
267/* We're splitting fonts into "preferred" and "performance" in order to optimize
268 page loading. For important text, such as the body, we want it to load
269 immediately and not wait for the web font load, whereas for other sections,
270 such as headers and titles, we're OK with things taking a bit longer to load.
271 We do have some optional classes and parameters in the mixins, in case you
272 definitely want to make sure you're using the preferred font and don't mind
273 the performance hit.
274 We should be able to improve on this once CSS Font Loading L3 becomes more
275 widely available.
276*/
277/* ========== COLORS ========== */
278/**
279*
280* Material design color palettes.
281* @see http://www.google.com/design/spec/style/color.html
282*
283**/
284/**
285 * Copyright 2015 Google Inc. All Rights Reserved.
286 *
287 * Licensed under the Apache License, Version 2.0 (the "License");
288 * you may not use this file except in compliance with the License.
289 * You may obtain a copy of the License at
290 *
291 * http://www.apache.org/licenses/LICENSE-2.0
292 *
293 * Unless required by applicable law or agreed to in writing, software
294 * distributed under the License is distributed on an "AS IS" BASIS,
295 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
296 * See the License for the specific language governing permissions and
297 * limitations under the License.
298 */
299/* ========== Color Palettes ========== */
300/* colors.scss */
301/**
302 * Copyright 2015 Google Inc. All Rights Reserved.
303 *
304 * Licensed under the Apache License, Version 2.0 (the "License");
305 * you may not use this file except in compliance with the License.
306 * You may obtain a copy of the License at
307 *
308 * http://www.apache.org/licenses/LICENSE-2.0
309 *
310 * Unless required by applicable law or agreed to in writing, software
311 * distributed under the License is distributed on an "AS IS" BASIS,
312 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
313 * See the License for the specific language governing permissions and
314 * limitations under the License.
315 */
316/* ========== IMAGES ========== */
317/* ========== Color & Themes ========== */
318/* ========== Typography ========== */
319/* ========== Components ========== */
320/* ========== Standard Buttons ========== */
321/* ========== Icon Toggles ========== */
322/* ========== Radio Buttons ========== */
323/* ========== Ripple effect ========== */
324/* ========== Layout ========== */
325/* ========== Content Tabs ========== */
326/* ========== Checkboxes ========== */
327/* ========== Switches ========== */
328/* ========== Spinner ========== */
329/* ========== Text fields ========== */
330/* ========== Card ========== */
331/* ========== Sliders ========== */
332/* ========== Progress ========== */
333/* ========== List ========== */
334/* ========== Item ========== */
335/* ========== Dropdown menu ========== */
336/* ========== Tooltips ========== */
337/* ========== Footer ========== */
338/* TEXTFIELD */
339/* SWITCH */
340/* SPINNER */
341/* RADIO */
342/* MENU */
343/* LIST */
344/* LAYOUT */
345/* ICON TOGGLE */
346/* FOOTER */
347/*mega-footer*/
348/*mini-footer*/
349/* CHECKBOX */
350/* CARD */
351/* Card dimensions */
352/* Cover image */
353/* BUTTON */
354/**
355 *
356 * Dimensions
357 *
358 */
359/* ANIMATION */
360/* PROGRESS */
361/* BADGE */
362/* SHADOWS */
363/* GRID */
364/* DATA TABLE */
365/* DIALOG */
366/* SNACKBAR */
367/* TOOLTIP */
368/* CHIP */
369.mdl-grid {
370 display: -webkit-flex;
371 display: -ms-flexbox;
372 display: flex;
373 -webkit-flex-flow: row wrap;
374 -ms-flex-flow: row wrap;
375 flex-flow: row wrap;
376 margin: 0 auto 0 auto;
377 -webkit-align-items: stretch;
378 -ms-flex-align: stretch;
379 align-items: stretch; }
380 .mdl-grid.mdl-grid--no-spacing {
381 padding: 0; }
382
383.mdl-cell {
384 box-sizing: border-box; }
385
386.mdl-cell--top {
387 -webkit-align-self: flex-start;
388 -ms-flex-item-align: start;
389 align-self: flex-start; }
390
391.mdl-cell--middle {
392 -webkit-align-self: center;
393 -ms-flex-item-align: center;
394 -ms-grid-row-align: center;
395 align-self: center; }
396
397.mdl-cell--bottom {
398 -webkit-align-self: flex-end;
399 -ms-flex-item-align: end;
400 align-self: flex-end; }
401
402.mdl-cell--stretch {
403 -webkit-align-self: stretch;
404 -ms-flex-item-align: stretch;
405 -ms-grid-row-align: stretch;
406 align-self: stretch; }
407
408.mdl-grid.mdl-grid--no-spacing > .mdl-cell {
409 margin: 0; }
410
411.mdl-cell--order-1 {
412 -webkit-order: 1;
413 -ms-flex-order: 1;
414 order: 1; }
415
416.mdl-cell--order-2 {
417 -webkit-order: 2;
418 -ms-flex-order: 2;
419 order: 2; }
420
421.mdl-cell--order-3 {
422 -webkit-order: 3;
423 -ms-flex-order: 3;
424 order: 3; }
425
426.mdl-cell--order-4 {
427 -webkit-order: 4;
428 -ms-flex-order: 4;
429 order: 4; }
430
431.mdl-cell--order-5 {
432 -webkit-order: 5;
433 -ms-flex-order: 5;
434 order: 5; }
435
436.mdl-cell--order-6 {
437 -webkit-order: 6;
438 -ms-flex-order: 6;
439 order: 6; }
440
441.mdl-cell--order-7 {
442 -webkit-order: 7;
443 -ms-flex-order: 7;
444 order: 7; }
445
446.mdl-cell--order-8 {
447 -webkit-order: 8;
448 -ms-flex-order: 8;
449 order: 8; }
450
451.mdl-cell--order-9 {
452 -webkit-order: 9;
453 -ms-flex-order: 9;
454 order: 9; }
455
456.mdl-cell--order-10 {
457 -webkit-order: 10;
458 -ms-flex-order: 10;
459 order: 10; }
460
461.mdl-cell--order-11 {
462 -webkit-order: 11;
463 -ms-flex-order: 11;
464 order: 11; }
465
466.mdl-cell--order-12 {
467 -webkit-order: 12;
468 -ms-flex-order: 12;
469 order: 12; }
470
471@media (max-width: 479px) {
472 .mdl-grid {
473 padding: 8px; }
474 .mdl-cell {
475 margin: 8px;
476 width: calc(100% - 16px); }
477 .mdl-grid--no-spacing > .mdl-cell {
478 width: 100%; }
479 .mdl-cell--hide-phone {
480 display: none !important; }
481 .mdl-cell--order-1-phone.mdl-cell--order-1-phone {
482 -webkit-order: 1;
483 -ms-flex-order: 1;
484 order: 1; }
485 .mdl-cell--order-2-phone.mdl-cell--order-2-phone {
486 -webkit-order: 2;
487 -ms-flex-order: 2;
488 order: 2; }
489 .mdl-cell--order-3-phone.mdl-cell--order-3-phone {
490 -webkit-order: 3;
491 -ms-flex-order: 3;
492 order: 3; }
493 .mdl-cell--order-4-phone.mdl-cell--order-4-phone {
494 -webkit-order: 4;
495 -ms-flex-order: 4;
496 order: 4; }
497 .mdl-cell--order-5-phone.mdl-cell--order-5-phone {
498 -webkit-order: 5;
499 -ms-flex-order: 5;
500 order: 5; }
501 .mdl-cell--order-6-phone.mdl-cell--order-6-phone {
502 -webkit-order: 6;
503 -ms-flex-order: 6;
504 order: 6; }
505 .mdl-cell--order-7-phone.mdl-cell--order-7-phone {
506 -webkit-order: 7;
507 -ms-flex-order: 7;
508 order: 7; }
509 .mdl-cell--order-8-phone.mdl-cell--order-8-phone {
510 -webkit-order: 8;
511 -ms-flex-order: 8;
512 order: 8; }
513 .mdl-cell--order-9-phone.mdl-cell--order-9-phone {
514 -webkit-order: 9;
515 -ms-flex-order: 9;
516 order: 9; }
517 .mdl-cell--order-10-phone.mdl-cell--order-10-phone {
518 -webkit-order: 10;
519 -ms-flex-order: 10;
520 order: 10; }
521 .mdl-cell--order-11-phone.mdl-cell--order-11-phone {
522 -webkit-order: 11;
523 -ms-flex-order: 11;
524 order: 11; }
525 .mdl-cell--order-12-phone.mdl-cell--order-12-phone {
526 -webkit-order: 12;
527 -ms-flex-order: 12;
528 order: 12; }
529 .mdl-cell--1-col,
530 .mdl-cell--1-col-phone.mdl-cell--1-col-phone {
531 width: calc(25% - 16px); }
532 .mdl-grid--no-spacing > .mdl-cell--1-col, .mdl-grid--no-spacing >
533 .mdl-cell--1-col-phone.mdl-cell--1-col-phone {
534 width: 25%; }
535 .mdl-cell--2-col,
536 .mdl-cell--2-col-phone.mdl-cell--2-col-phone {
537 width: calc(50% - 16px); }
538 .mdl-grid--no-spacing > .mdl-cell--2-col, .mdl-grid--no-spacing >
539 .mdl-cell--2-col-phone.mdl-cell--2-col-phone {
540 width: 50%; }
541 .mdl-cell--3-col,
542 .mdl-cell--3-col-phone.mdl-cell--3-col-phone {
543 width: calc(75% - 16px); }
544 .mdl-grid--no-spacing > .mdl-cell--3-col, .mdl-grid--no-spacing >
545 .mdl-cell--3-col-phone.mdl-cell--3-col-phone {
546 width: 75%; }
547 .mdl-cell--4-col,
548 .mdl-cell--4-col-phone.mdl-cell--4-col-phone {
549 width: calc(100% - 16px); }
550 .mdl-grid--no-spacing > .mdl-cell--4-col, .mdl-grid--no-spacing >
551 .mdl-cell--4-col-phone.mdl-cell--4-col-phone {
552 width: 100%; }
553 .mdl-cell--5-col,
554 .mdl-cell--5-col-phone.mdl-cell--5-col-phone {
555 width: calc(100% - 16px); }
556 .mdl-grid--no-spacing > .mdl-cell--5-col, .mdl-grid--no-spacing >
557 .mdl-cell--5-col-phone.mdl-cell--5-col-phone {
558 width: 100%; }
559 .mdl-cell--6-col,
560 .mdl-cell--6-col-phone.mdl-cell--6-col-phone {
561 width: calc(100% - 16px); }
562 .mdl-grid--no-spacing > .mdl-cell--6-col, .mdl-grid--no-spacing >
563 .mdl-cell--6-col-phone.mdl-cell--6-col-phone {
564 width: 100%; }
565 .mdl-cell--7-col,
566 .mdl-cell--7-col-phone.mdl-cell--7-col-phone {
567 width: calc(100% - 16px); }
568 .mdl-grid--no-spacing > .mdl-cell--7-col, .mdl-grid--no-spacing >
569 .mdl-cell--7-col-phone.mdl-cell--7-col-phone {
570 width: 100%; }
571 .mdl-cell--8-col,
572 .mdl-cell--8-col-phone.mdl-cell--8-col-phone {
573 width: calc(100% - 16px); }
574 .mdl-grid--no-spacing > .mdl-cell--8-col, .mdl-grid--no-spacing >
575 .mdl-cell--8-col-phone.mdl-cell--8-col-phone {
576 width: 100%; }
577 .mdl-cell--9-col,
578 .mdl-cell--9-col-phone.mdl-cell--9-col-phone {
579 width: calc(100% - 16px); }
580 .mdl-grid--no-spacing > .mdl-cell--9-col, .mdl-grid--no-spacing >
581 .mdl-cell--9-col-phone.mdl-cell--9-col-phone {
582 width: 100%; }
583 .mdl-cell--10-col,
584 .mdl-cell--10-col-phone.mdl-cell--10-col-phone {
585 width: calc(100% - 16px); }
586 .mdl-grid--no-spacing > .mdl-cell--10-col, .mdl-grid--no-spacing >
587 .mdl-cell--10-col-phone.mdl-cell--10-col-phone {
588 width: 100%; }
589 .mdl-cell--11-col,
590 .mdl-cell--11-col-phone.mdl-cell--11-col-phone {
591 width: calc(100% - 16px); }
592 .mdl-grid--no-spacing > .mdl-cell--11-col, .mdl-grid--no-spacing >
593 .mdl-cell--11-col-phone.mdl-cell--11-col-phone {
594 width: 100%; }
595 .mdl-cell--12-col,
596 .mdl-cell--12-col-phone.mdl-cell--12-col-phone {
597 width: calc(100% - 16px); }
598 .mdl-grid--no-spacing > .mdl-cell--12-col, .mdl-grid--no-spacing >
599 .mdl-cell--12-col-phone.mdl-cell--12-col-phone {
600 width: 100%; }
601 .mdl-cell--1-offset,
602 .mdl-cell--1-offset-phone.mdl-cell--1-offset-phone {
603 margin-left: calc(25% + 8px); }
604 .mdl-grid.mdl-grid--no-spacing > .mdl-cell--1-offset, .mdl-grid.mdl-grid--no-spacing >
605 .mdl-cell--1-offset-phone.mdl-cell--1-offset-phone {
606 margin-left: 25%; }
607 .mdl-cell--2-offset,
608 .mdl-cell--2-offset-phone.mdl-cell--2-offset-phone {
609 margin-left: calc(50% + 8px); }
610 .mdl-grid.mdl-grid--no-spacing > .mdl-cell--2-offset, .mdl-grid.mdl-grid--no-spacing >
611 .mdl-cell--2-offset-phone.mdl-cell--2-offset-phone {
612 margin-left: 50%; }
613 .mdl-cell--3-offset,
614 .mdl-cell--3-offset-phone.mdl-cell--3-offset-phone {
615 margin-left: calc(75% + 8px); }
616 .mdl-grid.mdl-grid--no-spacing > .mdl-cell--3-offset, .mdl-grid.mdl-grid--no-spacing >
617 .mdl-cell--3-offset-phone.mdl-cell--3-offset-phone {
618 margin-left: 75%; } }
619
620@media (min-width: 480px) and (max-width: 839px) {
621 .mdl-grid {
622 padding: 8px; }
623 .mdl-cell {
624 margin: 8px;
625 width: calc(50% - 16px); }
626 .mdl-grid--no-spacing > .mdl-cell {
627 width: 50%; }
628 .mdl-cell--hide-tablet {
629 display: none !important; }
630 .mdl-cell--order-1-tablet.mdl-cell--order-1-tablet {
631 -webkit-order: 1;
632 -ms-flex-order: 1;
633 order: 1; }
634 .mdl-cell--order-2-tablet.mdl-cell--order-2-tablet {
635 -webkit-order: 2;
636 -ms-flex-order: 2;
637 order: 2; }
638 .mdl-cell--order-3-tablet.mdl-cell--order-3-tablet {
639 -webkit-order: 3;
640 -ms-flex-order: 3;
641 order: 3; }
642 .mdl-cell--order-4-tablet.mdl-cell--order-4-tablet {
643 -webkit-order: 4;
644 -ms-flex-order: 4;
645 order: 4; }
646 .mdl-cell--order-5-tablet.mdl-cell--order-5-tablet {
647 -webkit-order: 5;
648 -ms-flex-order: 5;
649 order: 5; }
650 .mdl-cell--order-6-tablet.mdl-cell--order-6-tablet {
651 -webkit-order: 6;
652 -ms-flex-order: 6;
653 order: 6; }
654 .mdl-cell--order-7-tablet.mdl-cell--order-7-tablet {
655 -webkit-order: 7;
656 -ms-flex-order: 7;
657 order: 7; }
658 .mdl-cell--order-8-tablet.mdl-cell--order-8-tablet {
659 -webkit-order: 8;
660 -ms-flex-order: 8;
661 order: 8; }
662 .mdl-cell--order-9-tablet.mdl-cell--order-9-tablet {
663 -webkit-order: 9;
664 -ms-flex-order: 9;
665 order: 9; }
666 .mdl-cell--order-10-tablet.mdl-cell--order-10-tablet {
667 -webkit-order: 10;
668 -ms-flex-order: 10;
669 order: 10; }
670 .mdl-cell--order-11-tablet.mdl-cell--order-11-tablet {
671 -webkit-order: 11;
672 -ms-flex-order: 11;
673 order: 11; }
674 .mdl-cell--order-12-tablet.mdl-cell--order-12-tablet {
675 -webkit-order: 12;
676 -ms-flex-order: 12;
677 order: 12; }
678 .mdl-cell--1-col,
679 .mdl-cell--1-col-tablet.mdl-cell--1-col-tablet {
680 width: calc(12.5% - 16px); }
681 .mdl-grid--no-spacing > .mdl-cell--1-col, .mdl-grid--no-spacing >
682 .mdl-cell--1-col-tablet.mdl-cell--1-col-tablet {
683 width: 12.5%; }
684 .mdl-cell--2-col,
685 .mdl-cell--2-col-tablet.mdl-cell--2-col-tablet {
686 width: calc(25% - 16px); }
687 .mdl-grid--no-spacing > .mdl-cell--2-col, .mdl-grid--no-spacing >
688 .mdl-cell--2-col-tablet.mdl-cell--2-col-tablet {
689 width: 25%; }
690 .mdl-cell--3-col,
691 .mdl-cell--3-col-tablet.mdl-cell--3-col-tablet {
692 width: calc(37.5% - 16px); }
693 .mdl-grid--no-spacing > .mdl-cell--3-col, .mdl-grid--no-spacing >
694 .mdl-cell--3-col-tablet.mdl-cell--3-col-tablet {
695 width: 37.5%; }
696 .mdl-cell--4-col,
697 .mdl-cell--4-col-tablet.mdl-cell--4-col-tablet {
698 width: calc(50% - 16px); }
699 .mdl-grid--no-spacing > .mdl-cell--4-col, .mdl-grid--no-spacing >
700 .mdl-cell--4-col-tablet.mdl-cell--4-col-tablet {
701 width: 50%; }
702 .mdl-cell--5-col,
703 .mdl-cell--5-col-tablet.mdl-cell--5-col-tablet {
704 width: calc(62.5% - 16px); }
705 .mdl-grid--no-spacing > .mdl-cell--5-col, .mdl-grid--no-spacing >
706 .mdl-cell--5-col-tablet.mdl-cell--5-col-tablet {
707 width: 62.5%; }
708 .mdl-cell--6-col,
709 .mdl-cell--6-col-tablet.mdl-cell--6-col-tablet {
710 width: calc(75% - 16px); }
711 .mdl-grid--no-spacing > .mdl-cell--6-col, .mdl-grid--no-spacing >
712 .mdl-cell--6-col-tablet.mdl-cell--6-col-tablet {
713 width: 75%; }
714 .mdl-cell--7-col,
715 .mdl-cell--7-col-tablet.mdl-cell--7-col-tablet {
716 width: calc(87.5% - 16px); }
717 .mdl-grid--no-spacing > .mdl-cell--7-col, .mdl-grid--no-spacing >
718 .mdl-cell--7-col-tablet.mdl-cell--7-col-tablet {
719 width: 87.5%; }
720 .mdl-cell--8-col,
721 .mdl-cell--8-col-tablet.mdl-cell--8-col-tablet {
722 width: calc(100% - 16px); }
723 .mdl-grid--no-spacing > .mdl-cell--8-col, .mdl-grid--no-spacing >
724 .mdl-cell--8-col-tablet.mdl-cell--8-col-tablet {
725 width: 100%; }
726 .mdl-cell--9-col,
727 .mdl-cell--9-col-tablet.mdl-cell--9-col-tablet {
728 width: calc(100% - 16px); }
729 .mdl-grid--no-spacing > .mdl-cell--9-col, .mdl-grid--no-spacing >
730 .mdl-cell--9-col-tablet.mdl-cell--9-col-tablet {
731 width: 100%; }
732 .mdl-cell--10-col,
733 .mdl-cell--10-col-tablet.mdl-cell--10-col-tablet {
734 width: calc(100% - 16px); }
735 .mdl-grid--no-spacing > .mdl-cell--10-col, .mdl-grid--no-spacing >
736 .mdl-cell--10-col-tablet.mdl-cell--10-col-tablet {
737 width: 100%; }
738 .mdl-cell--11-col,
739 .mdl-cell--11-col-tablet.mdl-cell--11-col-tablet {
740 width: calc(100% - 16px); }
741 .mdl-grid--no-spacing > .mdl-cell--11-col, .mdl-grid--no-spacing >
742 .mdl-cell--11-col-tablet.mdl-cell--11-col-tablet {
743 width: 100%; }
744 .mdl-cell--12-col,
745 .mdl-cell--12-col-tablet.mdl-cell--12-col-tablet {
746 width: calc(100% - 16px); }
747 .mdl-grid--no-spacing > .mdl-cell--12-col, .mdl-grid--no-spacing >
748 .mdl-cell--12-col-tablet.mdl-cell--12-col-tablet {
749 width: 100%; }
750 .mdl-cell--1-offset,
751 .mdl-cell--1-offset-tablet.mdl-cell--1-offset-tablet {
752 margin-left: calc(12.5% + 8px); }
753 .mdl-grid.mdl-grid--no-spacing > .mdl-cell--1-offset, .mdl-grid.mdl-grid--no-spacing >
754 .mdl-cell--1-offset-tablet.mdl-cell--1-offset-tablet {
755 margin-left: 12.5%; }
756 .mdl-cell--2-offset,
757 .mdl-cell--2-offset-tablet.mdl-cell--2-offset-tablet {
758 margin-left: calc(25% + 8px); }
759 .mdl-grid.mdl-grid--no-spacing > .mdl-cell--2-offset, .mdl-grid.mdl-grid--no-spacing >
760 .mdl-cell--2-offset-tablet.mdl-cell--2-offset-tablet {
761 margin-left: 25%; }
762 .mdl-cell--3-offset,
763 .mdl-cell--3-offset-tablet.mdl-cell--3-offset-tablet {
764 margin-left: calc(37.5% + 8px); }
765 .mdl-grid.mdl-grid--no-spacing > .mdl-cell--3-offset, .mdl-grid.mdl-grid--no-spacing >
766 .mdl-cell--3-offset-tablet.mdl-cell--3-offset-tablet {
767 margin-left: 37.5%; }
768 .mdl-cell--4-offset,
769 .mdl-cell--4-offset-tablet.mdl-cell--4-offset-tablet {
770 margin-left: calc(50% + 8px); }
771 .mdl-grid.mdl-grid--no-spacing > .mdl-cell--4-offset, .mdl-grid.mdl-grid--no-spacing >
772 .mdl-cell--4-offset-tablet.mdl-cell--4-offset-tablet {
773 margin-left: 50%; }
774 .mdl-cell--5-offset,
775 .mdl-cell--5-offset-tablet.mdl-cell--5-offset-tablet {
776 margin-left: calc(62.5% + 8px); }
777 .mdl-grid.mdl-grid--no-spacing > .mdl-cell--5-offset, .mdl-grid.mdl-grid--no-spacing >
778 .mdl-cell--5-offset-tablet.mdl-cell--5-offset-tablet {
779 margin-left: 62.5%; }
780 .mdl-cell--6-offset,
781 .mdl-cell--6-offset-tablet.mdl-cell--6-offset-tablet {
782 margin-left: calc(75% + 8px); }
783 .mdl-grid.mdl-grid--no-spacing > .mdl-cell--6-offset, .mdl-grid.mdl-grid--no-spacing >
784 .mdl-cell--6-offset-tablet.mdl-cell--6-offset-tablet {
785 margin-left: 75%; }
786 .mdl-cell--7-offset,
787 .mdl-cell--7-offset-tablet.mdl-cell--7-offset-tablet {
788 margin-left: calc(87.5% + 8px); }
789 .mdl-grid.mdl-grid--no-spacing > .mdl-cell--7-offset, .mdl-grid.mdl-grid--no-spacing >
790 .mdl-cell--7-offset-tablet.mdl-cell--7-offset-tablet {
791 margin-left: 87.5%; } }
792
793@media (min-width: 840px) {
794 .mdl-grid {
795 padding: 8px; }
796 .mdl-cell {
797 margin: 8px;
798 width: calc(33.3333333333% - 16px); }
799 .mdl-grid--no-spacing > .mdl-cell {
800 width: 33.3333333333%; }
801 .mdl-cell--hide-desktop {
802 display: none !important; }
803 .mdl-cell--order-1-desktop.mdl-cell--order-1-desktop {
804 -webkit-order: 1;
805 -ms-flex-order: 1;
806 order: 1; }
807 .mdl-cell--order-2-desktop.mdl-cell--order-2-desktop {
808 -webkit-order: 2;
809 -ms-flex-order: 2;
810 order: 2; }
811 .mdl-cell--order-3-desktop.mdl-cell--order-3-desktop {
812 -webkit-order: 3;
813 -ms-flex-order: 3;
814 order: 3; }
815 .mdl-cell--order-4-desktop.mdl-cell--order-4-desktop {
816 -webkit-order: 4;
817 -ms-flex-order: 4;
818 order: 4; }
819 .mdl-cell--order-5-desktop.mdl-cell--order-5-desktop {
820 -webkit-order: 5;
821 -ms-flex-order: 5;
822 order: 5; }
823 .mdl-cell--order-6-desktop.mdl-cell--order-6-desktop {
824 -webkit-order: 6;
825 -ms-flex-order: 6;
826 order: 6; }
827 .mdl-cell--order-7-desktop.mdl-cell--order-7-desktop {
828 -webkit-order: 7;
829 -ms-flex-order: 7;
830 order: 7; }
831 .mdl-cell--order-8-desktop.mdl-cell--order-8-desktop {
832 -webkit-order: 8;
833 -ms-flex-order: 8;
834 order: 8; }
835 .mdl-cell--order-9-desktop.mdl-cell--order-9-desktop {
836 -webkit-order: 9;
837 -ms-flex-order: 9;
838 order: 9; }
839 .mdl-cell--order-10-desktop.mdl-cell--order-10-desktop {
840 -webkit-order: 10;
841 -ms-flex-order: 10;
842 order: 10; }
843 .mdl-cell--order-11-desktop.mdl-cell--order-11-desktop {
844 -webkit-order: 11;
845 -ms-flex-order: 11;
846 order: 11; }
847 .mdl-cell--order-12-desktop.mdl-cell--order-12-desktop {
848 -webkit-order: 12;
849 -ms-flex-order: 12;
850 order: 12; }
851 .mdl-cell--1-col,
852 .mdl-cell--1-col-desktop.mdl-cell--1-col-desktop {
853 width: calc(8.3333333333% - 16px); }
854 .mdl-grid--no-spacing > .mdl-cell--1-col, .mdl-grid--no-spacing >
855 .mdl-cell--1-col-desktop.mdl-cell--1-col-desktop {
856 width: 8.3333333333%; }
857 .mdl-cell--2-col,
858 .mdl-cell--2-col-desktop.mdl-cell--2-col-desktop {
859 width: calc(16.6666666667% - 16px); }
860 .mdl-grid--no-spacing > .mdl-cell--2-col, .mdl-grid--no-spacing >
861 .mdl-cell--2-col-desktop.mdl-cell--2-col-desktop {
862 width: 16.6666666667%; }
863 .mdl-cell--3-col,
864 .mdl-cell--3-col-desktop.mdl-cell--3-col-desktop {
865 width: calc(25% - 16px); }
866 .mdl-grid--no-spacing > .mdl-cell--3-col, .mdl-grid--no-spacing >
867 .mdl-cell--3-col-desktop.mdl-cell--3-col-desktop {
868 width: 25%; }
869 .mdl-cell--4-col,
870 .mdl-cell--4-col-desktop.mdl-cell--4-col-desktop {
871 width: calc(33.3333333333% - 16px); }
872 .mdl-grid--no-spacing > .mdl-cell--4-col, .mdl-grid--no-spacing >
873 .mdl-cell--4-col-desktop.mdl-cell--4-col-desktop {
874 width: 33.3333333333%; }
875 .mdl-cell--5-col,
876 .mdl-cell--5-col-desktop.mdl-cell--5-col-desktop {
877 width: calc(41.6666666667% - 16px); }
878 .mdl-grid--no-spacing > .mdl-cell--5-col, .mdl-grid--no-spacing >
879 .mdl-cell--5-col-desktop.mdl-cell--5-col-desktop {
880 width: 41.6666666667%; }
881 .mdl-cell--6-col,
882 .mdl-cell--6-col-desktop.mdl-cell--6-col-desktop {
883 width: calc(50% - 16px); }
884 .mdl-grid--no-spacing > .mdl-cell--6-col, .mdl-grid--no-spacing >
885 .mdl-cell--6-col-desktop.mdl-cell--6-col-desktop {
886 width: 50%; }
887 .mdl-cell--7-col,
888 .mdl-cell--7-col-desktop.mdl-cell--7-col-desktop {
889 width: calc(58.3333333333% - 16px); }
890 .mdl-grid--no-spacing > .mdl-cell--7-col, .mdl-grid--no-spacing >
891 .mdl-cell--7-col-desktop.mdl-cell--7-col-desktop {
892 width: 58.3333333333%; }
893 .mdl-cell--8-col,
894 .mdl-cell--8-col-desktop.mdl-cell--8-col-desktop {
895 width: calc(66.6666666667% - 16px); }
896 .mdl-grid--no-spacing > .mdl-cell--8-col, .mdl-grid--no-spacing >
897 .mdl-cell--8-col-desktop.mdl-cell--8-col-desktop {
898 width: 66.6666666667%; }
899 .mdl-cell--9-col,
900 .mdl-cell--9-col-desktop.mdl-cell--9-col-desktop {
901 width: calc(75% - 16px); }
902 .mdl-grid--no-spacing > .mdl-cell--9-col, .mdl-grid--no-spacing >
903 .mdl-cell--9-col-desktop.mdl-cell--9-col-desktop {
904 width: 75%; }
905 .mdl-cell--10-col,
906 .mdl-cell--10-col-desktop.mdl-cell--10-col-desktop {
907 width: calc(83.3333333333% - 16px); }
908 .mdl-grid--no-spacing > .mdl-cell--10-col, .mdl-grid--no-spacing >
909 .mdl-cell--10-col-desktop.mdl-cell--10-col-desktop {
910 width: 83.3333333333%; }
911 .mdl-cell--11-col,
912 .mdl-cell--11-col-desktop.mdl-cell--11-col-desktop {
913 width: calc(91.6666666667% - 16px); }
914 .mdl-grid--no-spacing > .mdl-cell--11-col, .mdl-grid--no-spacing >
915 .mdl-cell--11-col-desktop.mdl-cell--11-col-desktop {
916 width: 91.6666666667%; }
917 .mdl-cell--12-col,
918 .mdl-cell--12-col-desktop.mdl-cell--12-col-desktop {
919 width: calc(100% - 16px); }
920 .mdl-grid--no-spacing > .mdl-cell--12-col, .mdl-grid--no-spacing >
921 .mdl-cell--12-col-desktop.mdl-cell--12-col-desktop {
922 width: 100%; }
923 .mdl-cell--1-offset,
924 .mdl-cell--1-offset-desktop.mdl-cell--1-offset-desktop {
925 margin-left: calc(8.3333333333% + 8px); }
926 .mdl-grid.mdl-grid--no-spacing > .mdl-cell--1-offset, .mdl-grid.mdl-grid--no-spacing >
927 .mdl-cell--1-offset-desktop.mdl-cell--1-offset-desktop {
928 margin-left: 8.3333333333%; }
929 .mdl-cell--2-offset,
930 .mdl-cell--2-offset-desktop.mdl-cell--2-offset-desktop {
931 margin-left: calc(16.6666666667% + 8px); }
932 .mdl-grid.mdl-grid--no-spacing > .mdl-cell--2-offset, .mdl-grid.mdl-grid--no-spacing >
933 .mdl-cell--2-offset-desktop.mdl-cell--2-offset-desktop {
934 margin-left: 16.6666666667%; }
935 .mdl-cell--3-offset,
936 .mdl-cell--3-offset-desktop.mdl-cell--3-offset-desktop {
937 margin-left: calc(25% + 8px); }
938 .mdl-grid.mdl-grid--no-spacing > .mdl-cell--3-offset, .mdl-grid.mdl-grid--no-spacing >
939 .mdl-cell--3-offset-desktop.mdl-cell--3-offset-desktop {
940 margin-left: 25%; }
941 .mdl-cell--4-offset,
942 .mdl-cell--4-offset-desktop.mdl-cell--4-offset-desktop {
943 margin-left: calc(33.3333333333% + 8px); }
944 .mdl-grid.mdl-grid--no-spacing > .mdl-cell--4-offset, .mdl-grid.mdl-grid--no-spacing >
945 .mdl-cell--4-offset-desktop.mdl-cell--4-offset-desktop {
946 margin-left: 33.3333333333%; }
947 .mdl-cell--5-offset,
948 .mdl-cell--5-offset-desktop.mdl-cell--5-offset-desktop {
949 margin-left: calc(41.6666666667% + 8px); }
950 .mdl-grid.mdl-grid--no-spacing > .mdl-cell--5-offset, .mdl-grid.mdl-grid--no-spacing >
951 .mdl-cell--5-offset-desktop.mdl-cell--5-offset-desktop {
952 margin-left: 41.6666666667%; }
953 .mdl-cell--6-offset,
954 .mdl-cell--6-offset-desktop.mdl-cell--6-offset-desktop {
955 margin-left: calc(50% + 8px); }
956 .mdl-grid.mdl-grid--no-spacing > .mdl-cell--6-offset, .mdl-grid.mdl-grid--no-spacing >
957 .mdl-cell--6-offset-desktop.mdl-cell--6-offset-desktop {
958 margin-left: 50%; }
959 .mdl-cell--7-offset,
960 .mdl-cell--7-offset-desktop.mdl-cell--7-offset-desktop {
961 margin-left: calc(58.3333333333% + 8px); }
962 .mdl-grid.mdl-grid--no-spacing > .mdl-cell--7-offset, .mdl-grid.mdl-grid--no-spacing >
963 .mdl-cell--7-offset-desktop.mdl-cell--7-offset-desktop {
964 margin-left: 58.3333333333%; }
965 .mdl-cell--8-offset,
966 .mdl-cell--8-offset-desktop.mdl-cell--8-offset-desktop {
967 margin-left: calc(66.6666666667% + 8px); }
968 .mdl-grid.mdl-grid--no-spacing > .mdl-cell--8-offset, .mdl-grid.mdl-grid--no-spacing >
969 .mdl-cell--8-offset-desktop.mdl-cell--8-offset-desktop {
970 margin-left: 66.6666666667%; }
971 .mdl-cell--9-offset,
972 .mdl-cell--9-offset-desktop.mdl-cell--9-offset-desktop {
973 margin-left: calc(75% + 8px); }
974 .mdl-grid.mdl-grid--no-spacing > .mdl-cell--9-offset, .mdl-grid.mdl-grid--no-spacing >
975 .mdl-cell--9-offset-desktop.mdl-cell--9-offset-desktop {
976 margin-left: 75%; }
977 .mdl-cell--10-offset,
978 .mdl-cell--10-offset-desktop.mdl-cell--10-offset-desktop {
979 margin-left: calc(83.3333333333% + 8px); }
980 .mdl-grid.mdl-grid--no-spacing > .mdl-cell--10-offset, .mdl-grid.mdl-grid--no-spacing >
981 .mdl-cell--10-offset-desktop.mdl-cell--10-offset-desktop {
982 margin-left: 83.3333333333%; }
983 .mdl-cell--11-offset,
984 .mdl-cell--11-offset-desktop.mdl-cell--11-offset-desktop {
985 margin-left: calc(91.6666666667% + 8px); }
986 .mdl-grid.mdl-grid--no-spacing > .mdl-cell--11-offset, .mdl-grid.mdl-grid--no-spacing >
987 .mdl-cell--11-offset-desktop.mdl-cell--11-offset-desktop {
988 margin-left: 91.6666666667%; } }