]> git.proxmox.com Git - framework7.git/blame - framework7/css/framework7.md.css
bump version to 4.4.7-2
[framework7.git] / framework7 / css / framework7.md.css
CommitLineData
5309fbda
DC
1/**
2 * Framework7 3.6.6
3 * Full featured mobile HTML framework for building iOS & Android apps
4 * http://framework7.io/
5 *
6 * Copyright 2014-2019 Vladimir Kharlampidi
7 *
8 * Released under the MIT License
9 *
10 * Released on: February 5, 2019
11 */
12html,
13body,
14.framework7-root {
15 position: relative;
16 height: 100%;
17 width: 100%;
18 overflow-x: hidden;
19}
20body {
21 margin: 0;
22 padding: 0;
23 font-size: 14px;
24 width: 100%;
25 background: #fff;
26 overflow: hidden;
27 -webkit-text-size-adjust: 100%;
28 -webkit-font-smoothing: antialiased;
29}
30.framework7-root {
31 overflow: hidden;
32 -webkit-box-sizing: border-box;
33 box-sizing: border-box;
34}
35.framework7-initializing *,
36.framework7-initializing *:before,
37.framework7-initializing *:after {
38 -webkit-transition-duration: 0ms !important;
39 transition-duration: 0ms !important;
40}
41/*
42a, button, input, textarea, .link, .button, label, .sortable-handler {
43 touch-action: manipulation;
44 -ms-touch-action: manipulation;
45}
46*/
47@media (width: 1024px) and (height: 691px) and (orientation: landscape) {
48 html,
49 body,
50 .framework7-root {
51 height: 671px;
52 }
53}
54@media (width: 1024px) and (height: 692px) and (orientation: landscape) {
55 html,
56 body,
57 .framework7-root {
58 height: 672px;
59 }
60}
61* {
62 -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
63 -webkit-touch-callout: none;
64}
65a,
66input,
67textarea,
68select {
69 outline: 0;
70}
71a {
72 cursor: pointer;
73 text-decoration: none;
74}
75p {
76 margin: 1em 0;
77}
78.disabled {
79 opacity: 0.55 !important;
80 pointer-events: none !important;
81}
82.md body {
83 font-family: Roboto, system-ui, Noto, Helvetica, Arial, sans-serif;
84 color: #212121;
85 line-height: 1.5;
86}
87.md .ios-only,
88.md .if-ios {
89 display: none !important;
90}
91.md a {
92 color: #2196f3;
93}
94.md .theme-dark {
95 color: rgba(255, 255, 255, 0.87);
96}
97.md .color-theme-red a {
98 color: #f44336;
99}
100.md .color-theme-green a {
101 color: #4caf50;
102}
103.md .color-theme-blue a {
104 color: #2196f3;
105}
106.md .color-theme-pink a {
107 color: #e91e63;
108}
109.md .color-theme-yellow a {
110 color: #ffeb3b;
111}
112.md .color-theme-orange a {
113 color: #ff9800;
114}
115.md .color-theme-gray a {
116 color: #9e9e9e;
117}
118.md .color-theme-white a {
119 color: #ffffff;
120}
121.md .color-theme-black a {
122 color: #000000;
123}
124.md a.color-red {
125 color: #f44336;
126}
127.md a.color-green {
128 color: #4caf50;
129}
130.md a.color-blue {
131 color: #2196f3;
132}
133.md a.color-pink {
134 color: #e91e63;
135}
136.md a.color-yellow {
137 color: #ffeb3b;
138}
139.md a.color-orange {
140 color: #ff9800;
141}
142.md a.color-gray {
143 color: #9e9e9e;
144}
145.md a.color-white {
146 color: #ffffff;
147}
148.md a.color-black {
149 color: #000000;
150}
151/* === Statusbar === */
152.statusbar {
153 position: absolute;
154 left: 0;
155 top: 0;
156 width: 100%;
157 z-index: 10000;
158 -webkit-box-sizing: border-box;
159 box-sizing: border-box;
160 display: none;
161}
162html.device-ios .statusbar,
163html.ios:not(.device-ios):not(.device-android) .statusbar {
164 height: 20px;
165}
166html.device-android .statusbar,
167html.md:not(.device-ios):not(.device-android) .statusbar {
168 height: 24px;
169}
170html.device-ios.device-iphone-x .statusbar {
171 height: constant(safe-area-inset-top);
172 height: env(safe-area-inset-top);
173}
174html.with-statusbar .statusbar {
175 display: block;
176}
177html.with-statusbar.device-ios .framework7-root,
178html.with-statusbar.ios:not(.device-ios):not(.device-android) .framework7-root {
179 padding-top: 20px;
180}
181html.with-statusbar.device-android .framework7-root,
182html.with-statusbar.md:not(.device-ios):not(.device-android) .framework7-root {
183 padding-top: 24px;
184}
185html.with-statusbar.device-iphone-x .framework7-root {
186 padding-top: constant(safe-area-inset-top);
187 padding-top: env(safe-area-inset-top);
188}
189.md .statusbar {
190 background: #0a6ebd;
191}
192.md .color-theme-red .statusbar {
193 background: #d2190b;
194}
195.md .color-theme-green .statusbar {
196 background: #357a38;
197}
198.md .color-theme-blue .statusbar {
199 background: #0a6ebd;
200}
201.md .color-theme-pink .statusbar {
202 background: #aa1145;
203}
204.md .color-theme-yellow .statusbar {
205 background: #eed500;
206}
207.md .color-theme-orange .statusbar {
208 background: #b36a00;
209}
210.md .color-theme-gray .statusbar {
211 background: #787878;
212}
213.md .color-theme-white .statusbar {
214 background: #d9d9d9;
215}
216.md .color-theme-black .statusbar {
217 background: #000000;
218}
219/* === Views === */
220.views,
221.view {
222 position: relative;
223 height: 100%;
224 z-index: 5000;
225 overflow: hidden;
226 -webkit-box-sizing: border-box;
227 box-sizing: border-box;
228}
229/* === Pages === */
230.pages {
231 position: relative;
232 width: 100%;
233 height: 100%;
234 overflow: hidden;
235}
236.page {
237 -webkit-box-sizing: border-box;
238 box-sizing: border-box;
239 position: absolute;
240 left: 0;
241 top: 0;
242 width: 100%;
243 height: 100%;
244 -webkit-transform: translate3d(0, 0, 0);
245 transform: translate3d(0, 0, 0);
246}
247.page.stacked {
248 display: none;
249}
250.page-previous {
251 pointer-events: none;
252}
253.page-content {
254 overflow: auto;
255 -webkit-overflow-scrolling: touch;
256 -webkit-box-sizing: border-box;
257 box-sizing: border-box;
258 height: 100%;
259 position: relative;
260 z-index: 1;
261}
262.md .page-shadow-effect {
263 position: absolute;
264 top: 0;
265 width: 16px;
266 bottom: 0;
267 z-index: -1;
268 content: '';
269 opacity: 0;
270 right: 100%;
271 background: -webkit-gradient(linear, left top, right top, from(rgba(0, 0, 0, 0)), color-stop(10%, rgba(0, 0, 0, 0)), color-stop(50%, rgba(0, 0, 0, 0.01)), to(rgba(0, 0, 0, 0.2)));
272 background: -webkit-linear-gradient(left, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, rgba(0, 0, 0, 0.01) 50%, rgba(0, 0, 0, 0.2) 100%);
273 background: linear-gradient(to right, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, rgba(0, 0, 0, 0.01) 50%, rgba(0, 0, 0, 0.2) 100%);
274}
275.md .page-opacity-effect {
276 position: absolute;
277 left: 0;
278 top: 0;
279 background: rgba(0, 0, 0, 0.1);
280 width: 100%;
281 bottom: 0;
282 content: '';
283 opacity: 0;
284 z-index: 10000;
285}
286.md .page {
287 background: #fff;
288}
289.md .page-next {
290 -webkit-transform: translate3d(0, 56px, 0);
291 transform: translate3d(0, 56px, 0);
292 opacity: 0;
293 pointer-events: none;
294}
295.md .page-next.page-next-on-right {
296 -webkit-transform: translate3d(100%, 0, 0);
297 transform: translate3d(100%, 0, 0);
298}
299.md .page-transitioning,
300.md .page-transitioning .page-shadow-effect,
301.md .page-transitioning .page-opacity-effect {
302 -webkit-transition-duration: 250ms;
303 transition-duration: 250ms;
304}
305.md .page-transitioning-swipeback,
306.md .page-transitioning-swipeback .page-shadow-effect,
307.md .page-transitioning-swipeback .page-opacity-effect {
308 -webkit-transition-duration: 400ms;
309 transition-duration: 400ms;
310}
311.md .router-transition-forward .page,
312.md .router-transition-backward .page {
313 pointer-events: none;
314}
315.md .router-transition-css-forward .page-next {
316 -webkit-animation: md-page-next-to-current 250ms forwards;
317 animation: md-page-next-to-current 250ms forwards;
318}
319.md .router-transition-css-forward .page-current {
320 -webkit-animation: none;
321 animation: none;
322}
323.md .router-transition-css-backward .page-current {
324 -webkit-animation: md-page-current-to-next 250ms forwards;
325 animation: md-page-current-to-next 250ms forwards;
326}
327.md .router-transition-css-backward .page-previous {
328 -webkit-animation: none;
329 animation: none;
330}
331.md .theme-dark .page,
332.page.md .theme-dark {
333 background: #171717;
334}
335@-webkit-keyframes md-page-next-to-current {
336 from {
337 -webkit-transform: translate3d(0, 56px, 0);
338 transform: translate3d(0, 56px, 0);
339 opacity: 0;
340 }
341 to {
342 -webkit-transform: translate3d(0, 0px, 0);
343 transform: translate3d(0, 0px, 0);
344 opacity: 1;
345 }
346}
347@keyframes md-page-next-to-current {
348 from {
349 -webkit-transform: translate3d(0, 56px, 0);
350 transform: translate3d(0, 56px, 0);
351 opacity: 0;
352 }
353 to {
354 -webkit-transform: translate3d(0, 0px, 0);
355 transform: translate3d(0, 0px, 0);
356 opacity: 1;
357 }
358}
359@-webkit-keyframes md-page-current-to-next {
360 from {
361 -webkit-transform: translate3d(0, 0, 0);
362 transform: translate3d(0, 0, 0);
363 opacity: 1;
364 }
365 to {
366 -webkit-transform: translate3d(0, 56px, 0);
367 transform: translate3d(0, 56px, 0);
368 opacity: 0;
369 }
370}
371@keyframes md-page-current-to-next {
372 from {
373 -webkit-transform: translate3d(0, 0, 0);
374 transform: translate3d(0, 0, 0);
375 opacity: 1;
376 }
377 to {
378 -webkit-transform: translate3d(0, 56px, 0);
379 transform: translate3d(0, 56px, 0);
380 opacity: 0;
381 }
382}
383/* === Link === */
384.link,
385.tab-link {
386 display: -webkit-inline-box;
387 display: -webkit-inline-flex;
388 display: -ms-inline-flexbox;
389 display: inline-flex;
390 -webkit-box-align: center;
391 -webkit-align-items: center;
392 -ms-flex-align: center;
393 align-items: center;
394 -webkit-align-content: center;
395 -ms-flex-line-pack: center;
396 align-content: center;
397 -webkit-box-pack: center;
398 -webkit-justify-content: center;
399 -ms-flex-pack: center;
400 justify-content: center;
401 position: relative;
402 -webkit-box-sizing: border-box;
403 box-sizing: border-box;
404 -webkit-transform: translate3d(0, 0, 0);
405 transform: translate3d(0, 0, 0);
406 z-index: 1;
407}
408.md .link i + span,
409.md .link i + i,
410.md .link span + i,
411.md .link span + span {
412 margin-left: 8px;
413}
414/* === Navbar === */
415.navbar {
416 position: relative;
417 left: 0;
418 top: 0;
419 width: 100%;
420 z-index: 500;
421 -webkit-backface-visibility: hidden;
422 backface-visibility: hidden;
423 -webkit-box-sizing: border-box;
424 box-sizing: border-box;
425 margin: 0;
426 -webkit-transform: translate3d(0, 0, 0);
427 transform: translate3d(0, 0, 0);
428}
429.navbar b {
430 font-weight: 500;
431}
432.navbar a.link {
433 display: -webkit-box;
434 display: -webkit-flex;
435 display: -ms-flexbox;
436 display: flex;
437}
438.navbar .title,
439.navbar .left,
440.navbar .right {
441 position: relative;
442 z-index: 1;
443}
444.navbar .title {
445 text-align: center;
446 position: relative;
447 overflow: hidden;
448 text-overflow: ellipsis;
449 white-space: nowrap;
450 -webkit-flex-shrink: 10;
451 -ms-flex-negative: 10;
452 flex-shrink: 10;
453 font-weight: 500;
454 display: inline-block;
455}
456.navbar .subtitle {
457 display: block;
458}
459.navbar .left,
460.navbar .right {
461 -webkit-flex-shrink: 0;
462 -ms-flex-negative: 0;
463 flex-shrink: 0;
464 display: -webkit-box;
465 display: -webkit-flex;
466 display: -ms-flexbox;
467 display: flex;
468 -webkit-box-pack: start;
469 -webkit-justify-content: flex-start;
470 -ms-flex-pack: start;
471 justify-content: flex-start;
472 -webkit-box-align: center;
473 -webkit-align-items: center;
474 -ms-flex-align: center;
475 align-items: center;
476 -webkit-transform: translate3d(0, 0, 0);
477 transform: translate3d(0, 0, 0);
478}
479.navbar .right:first-child {
480 position: absolute;
481 height: 100%;
482}
483.navbar-inner {
484 position: absolute;
485 left: 0;
486 top: 0;
487 width: 100%;
488 height: 100%;
489 display: -webkit-box;
490 display: -webkit-flex;
491 display: -ms-flexbox;
492 display: flex;
493 -webkit-box-align: center;
494 -webkit-align-items: center;
495 -ms-flex-align: center;
496 align-items: center;
497 -webkit-box-sizing: border-box;
498 box-sizing: border-box;
499}
500.navbar-inner.stacked {
501 display: none;
502}
503.views > .navbar,
504.view > .navbar,
505.page > .navbar {
506 position: absolute;
507}
508.md .navbar {
509 height: 56px;
510 background: #2196f3;
511 color: #fff;
512 font-size: 20px;
513}
514.md .navbar:after {
515 content: '';
516 position: absolute;
517 right: 0;
518 width: 100%;
519 top: 100%;
520 bottom: auto;
521 height: 10px;
522 pointer-events: none;
523 background: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0.3)), color-stop(40%, rgba(0, 0, 0, 0.1)), color-stop(50%, rgba(0, 0, 0, 0.05)), color-stop(80%, rgba(0, 0, 0, 0)), to(rgba(0, 0, 0, 0)));
524 background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0.3) 0%, rgba(0, 0, 0, 0.1) 40%, rgba(0, 0, 0, 0.05) 50%, rgba(0, 0, 0, 0) 80%, rgba(0, 0, 0, 0) 100%);
525 background: linear-gradient(to bottom, rgba(0, 0, 0, 0.3) 0%, rgba(0, 0, 0, 0.1) 40%, rgba(0, 0, 0, 0.05) 50%, rgba(0, 0, 0, 0) 80%, rgba(0, 0, 0, 0) 100%);
526}
527.md .navbar.no-shadow:after {
528 display: none;
529}
530.md .navbar a {
531 color: inherit;
532}
533.md .navbar a.link {
534 -webkit-box-pack: center;
535 -webkit-justify-content: center;
536 -ms-flex-pack: center;
537 justify-content: center;
538 padding: 0 16px;
539 min-width: 48px;
540 height: 56px;
541 line-height: 56px;
542}
543.md .navbar a.link:before {
544 content: '';
545 width: 152%;
546 height: 152%;
547 position: absolute;
548 left: -26%;
549 top: -26%;
550 background-image: -webkit-radial-gradient(center, circle, rgba(255, 255, 255, 0.15) 66%, rgba(255, 255, 255, 0) 66%);
551 background-image: radial-gradient(circle at center, rgba(255, 255, 255, 0.15) 66%, rgba(255, 255, 255, 0) 66%);
552 background-repeat: no-repeat;
553 background-position: center;
554 background-size: 100% 100%;
555 opacity: 0;
556 pointer-events: none;
557 -webkit-transition-duration: 600ms;
558 transition-duration: 600ms;
559}
560.md .navbar a.link.active-state:before {
561 opacity: 1;
562 -webkit-transition-duration: 150ms;
563 transition-duration: 150ms;
564}
565.md .navbar a.icon-only {
566 min-width: 0;
567 -webkit-flex-shrink: 0;
568 -ms-flex-negative: 0;
569 flex-shrink: 0;
570}
571.md .navbar .title {
572 margin: 0 16px;
573 line-height: 1.2;
574 text-align: left;
575}
576.md .navbar .subtitle {
577 line-height: 1.2;
578 font-size: 14px;
579 font-weight: normal;
580 color: rgba(255, 255, 255, 0.85);
581}
582.md .navbar .right {
583 margin-left: auto;
584}
585.md .navbar .right:first-child {
586 right: 16px;
587}
588.md .navbar-inner {
589 -webkit-box-pack: start;
590 -webkit-justify-content: flex-start;
591 -ms-flex-pack: start;
592 justify-content: flex-start;
593 overflow: hidden;
594}
595.md .page-with-subnavbar .navbar-inner {
596 overflow: visible;
597}
598.md .navbar ~ * .page-content,
599.md .navbar ~ .page-content {
600 padding-top: 56px;
601}
602@media (min-width: 768px) {
603 .md .navbar {
604 height: 64px;
605 }
606 .md .navbar a.link {
607 height: 64px;
608 line-height: 64px;
609 }
610 .md .navbar ~ * .page-content,
611 .md .navbar ~ .page-content {
612 padding-top: 64px;
613 }
614}
615.md .navbar-transitioning {
616 -webkit-transition-duration: 400ms;
617 transition-duration: 400ms;
618}
619.md .navbar-hidden {
620 -webkit-transform: translate3d(0, -100%, 0);
621 transform: translate3d(0, -100%, 0);
622}
623.md .navbar-hidden:after {
624 display: none;
625}
626.md .color-theme-red .navbar,
627.md .color-theme-red.navbar {
628 background: #f44336;
629}
630.md .color-theme-green .navbar,
631.md .color-theme-green.navbar {
632 background: #4caf50;
633}
634.md .color-theme-blue .navbar,
635.md .color-theme-blue.navbar {
636 background: #2196f3;
637}
638.md .color-theme-pink .navbar,
639.md .color-theme-pink.navbar {
640 background: #e91e63;
641}
642.md .color-theme-yellow .navbar,
643.md .color-theme-yellow.navbar {
644 background: #ffeb3b;
645}
646.md .color-theme-orange .navbar,
647.md .color-theme-orange.navbar {
648 background: #ff9800;
649}
650.md .color-theme-gray .navbar,
651.md .color-theme-gray.navbar {
652 background: #9e9e9e;
653}
654.md .color-theme-white .navbar,
655.md .color-theme-white.navbar {
656 background: #ffffff;
657}
658.md .color-theme-black .navbar,
659.md .color-theme-black.navbar {
660 background: #000000;
661}
662.md .navbar.color-red {
663 background: #f44336;
664}
665.md .navbar.color-green {
666 background: #4caf50;
667}
668.md .navbar.color-blue {
669 background: #2196f3;
670}
671.md .navbar.color-pink {
672 background: #e91e63;
673}
674.md .navbar.color-yellow {
675 background: #ffeb3b;
676}
677.md .navbar.color-orange {
678 background: #ff9800;
679}
680.md .navbar.color-gray {
681 background: #9e9e9e;
682}
683.md .navbar.color-white {
684 background: #ffffff;
685}
686.md .navbar.color-black {
687 background: #000000;
688}
689@media (orientation: landscape) {
690 .md.device-iphone-x .ios-left-edge .navbar-inner,
691 .md.device-iphone-x .ios-edges .navbar-inner,
692 .md.device-iphone-x .popup .navbar-inner,
693 .md.device-iphone-x .sheet-modal .navbar-inner,
694 .md.device-iphone-x .panel-left .navbar-inner {
695 padding-left: constant(safe-area-inset-left);
696 padding-left: env(safe-area-inset-left);
697 }
698 .md.device-iphone-x .ios-right-edge .navbar-inner,
699 .md.device-iphone-x .ios-edges .navbar-inner,
700 .md.device-iphone-x .popup .navbar-inner,
701 .md.device-iphone-x .sheet-modal .navbar-inner,
702 .md.device-iphone-x .panel-right .navbar-inner {
703 padding-right: constant(safe-area-inset-right);
704 padding-right: env(safe-area-inset-right);
705 }
706}
707/* === Toolbar === */
708.toolbar {
709 width: 100%;
710 position: relative;
711 margin: 0;
712 -webkit-transform: translate3d(0, 0, 0);
713 transform: translate3d(0, 0, 0);
714 -webkit-backface-visibility: hidden;
715 backface-visibility: hidden;
716 z-index: 500;
717 -webkit-box-sizing: border-box;
718 box-sizing: border-box;
719 left: 0;
720}
721.toolbar b {
722 font-weight: 500;
723}
724.toolbar a {
725 -webkit-box-sizing: border-box;
726 box-sizing: border-box;
727 -webkit-flex-shrink: 1;
728 -ms-flex-negative: 1;
729 flex-shrink: 1;
730 position: relative;
731 white-space: nowrap;
732 text-overflow: ellipsis;
733}
734.toolbar a.link {
735 display: -webkit-box;
736 display: -webkit-flex;
737 display: -ms-flexbox;
738 display: flex;
739}
740.toolbar i.icon {
741 display: block;
742}
743.toolbar-inner {
744 position: absolute;
745 left: 0;
746 top: 0;
747 width: 100%;
748 height: 100%;
749 display: -webkit-box;
750 display: -webkit-flex;
751 display: -ms-flexbox;
752 display: flex;
753 -webkit-box-pack: justify;
754 -webkit-justify-content: space-between;
755 -ms-flex-pack: justify;
756 justify-content: space-between;
757 -webkit-box-sizing: border-box;
758 box-sizing: border-box;
759 -webkit-box-align: center;
760 -webkit-align-items: center;
761 -ms-flex-align: center;
762 align-items: center;
763 -webkit-align-content: center;
764 -ms-flex-line-pack: center;
765 align-content: center;
766}
767.views > .tabbar,
768.views > .tabbar-labels {
769 z-index: 5001;
770}
771.tabbar a.link,
772.tabbar-labels a.link {
773 line-height: 1.4;
774}
775.tabbar a.tab-link,
776.tabbar-labels a.tab-link,
777.tabbar a.link,
778.tabbar-labels a.link {
779 height: 100%;
780 width: 100%;
781 -webkit-box-sizing: border-box;
782 box-sizing: border-box;
783 display: -webkit-box;
784 display: -webkit-flex;
785 display: -ms-flexbox;
786 display: flex;
787 -webkit-box-pack: center;
788 -webkit-justify-content: center;
789 -ms-flex-pack: center;
790 justify-content: center;
791 -webkit-box-align: center;
792 -webkit-align-items: center;
793 -ms-flex-align: center;
794 align-items: center;
795 -webkit-box-orient: vertical;
796 -webkit-box-direction: normal;
797 -webkit-flex-direction: column;
798 -ms-flex-direction: column;
799 flex-direction: column;
800}
801.tabbar-labels a.tab-link,
802.tabbar-labels a.link {
803 height: 100%;
804 -webkit-box-pack: justify;
805 -webkit-justify-content: space-between;
806 -ms-flex-pack: justify;
807 justify-content: space-between;
808 -webkit-box-align: center;
809 -webkit-align-items: center;
810 -ms-flex-align: center;
811 align-items: center;
812}
813.tabbar-labels a.tab-link .tabbar-label,
814.tabbar-labels a.link .tabbar-label {
815 display: block;
816 line-height: 1;
817 margin: 0;
818 position: relative;
819 text-overflow: ellipsis;
820 white-space: nowrap;
821}
822.tabbar-scrollable .toolbar-inner {
823 overflow: auto;
824 -webkit-overflow-scrolling: touch;
825}
826.tabbar-scrollable .toolbar-inner::-webkit-scrollbar {
827 display: none !important;
828 width: 0 !important;
829 height: 0 !important;
830 -webkit-appearance: none;
831 opacity: 0 !important;
832}
833.tabbar-scrollable a.tab-link,
834.tabbar-scrollable a.link {
835 width: auto;
836 -webkit-flex-shrink: 0;
837 -ms-flex-negative: 0;
838 flex-shrink: 0;
839}
840.views > .toolbar,
841.view > .toolbar,
842.page > .toolbar {
843 position: absolute;
844}
845.md .toolbar {
846 background: #2196f3;
847 height: 48px;
848 color: #fff;
849 font-size: 14px;
850 top: 0;
851}
852.md .toolbar:after {
853 content: '';
854 position: absolute;
855 right: 0;
856 width: 100%;
857 top: 100%;
858 bottom: auto;
859 height: 10px;
860 pointer-events: none;
861 background: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0.3)), color-stop(40%, rgba(0, 0, 0, 0.1)), color-stop(50%, rgba(0, 0, 0, 0.05)), color-stop(80%, rgba(0, 0, 0, 0)), to(rgba(0, 0, 0, 0)));
862 background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0.3) 0%, rgba(0, 0, 0, 0.1) 40%, rgba(0, 0, 0, 0.05) 50%, rgba(0, 0, 0, 0) 80%, rgba(0, 0, 0, 0) 100%);
863 background: linear-gradient(to bottom, rgba(0, 0, 0, 0.3) 0%, rgba(0, 0, 0, 0.1) 40%, rgba(0, 0, 0, 0.05) 50%, rgba(0, 0, 0, 0) 80%, rgba(0, 0, 0, 0) 100%);
864}
865.md .toolbar.no-shadow:after {
866 display: none;
867}
868.md .toolbar a {
869 color: #fff;
870}
871.md .toolbar a.link {
872 -webkit-box-pack: center;
873 -webkit-justify-content: center;
874 -ms-flex-pack: center;
875 justify-content: center;
876 padding: 0 16px;
877 min-width: 48px;
878 line-height: 48px;
879 height: 48px;
880}
881.md .toolbar a.link:before {
882 content: '';
883 width: 152%;
884 height: 152%;
885 position: absolute;
886 left: -26%;
887 top: -26%;
888 background-image: -webkit-radial-gradient(center, circle, rgba(255, 255, 255, 0.15) 66%, rgba(255, 255, 255, 0) 66%);
889 background-image: radial-gradient(circle at center, rgba(255, 255, 255, 0.15) 66%, rgba(255, 255, 255, 0) 66%);
890 background-repeat: no-repeat;
891 background-position: center;
892 background-size: 100% 100%;
893 opacity: 0;
894 pointer-events: none;
895 -webkit-transition-duration: 600ms;
896 transition-duration: 600ms;
897}
898.md .toolbar a.link.active-state:before {
899 opacity: 1;
900 -webkit-transition-duration: 150ms;
901 transition-duration: 150ms;
902}
903.md .toolbar a.link i + span,
904.md .toolbar a.link i + i,
905.md .toolbar a.link span + i,
906.md .toolbar a.link span + span {
907 margin-left: 8px;
908}
909.md .toolbar a.icon-only {
910 min-width: 0;
911 -webkit-flex-shrink: 0;
912 -ms-flex-negative: 0;
913 flex-shrink: 0;
914}
915.md .toolbar-inner {
916 overflow: hidden;
917}
918.md .tabbar a.link,
919.md .tabbar-labels a.link,
920.md .tabbar a.tab-link,
921.md .tabbar-labels a.tab-link {
922 padding-left: 0;
923 padding-right: 0;
924 font-size: 14px;
925 text-transform: uppercase;
926 font-weight: 500;
927 letter-spacing: 0.03em;
928}
929.md .tabbar i.icon,
930.md .tabbar-labels i.icon {
931 height: 24px;
932}
933.md .tabbar a.tab-link,
934.md .tabbar-labels a.tab-link {
935 -webkit-transition-duration: 300ms;
936 transition-duration: 300ms;
937 overflow: hidden;
938 color: rgba(255, 255, 255, 0.7);
939 position: relative;
940}
941.md .tabbar a.tab-link.tab-link-active,
942.md .tabbar-labels a.tab-link.tab-link-active,
943.md .tabbar a.tab-link.active-state,
944.md .tabbar-labels a.tab-link.active-state {
945 color: #ffffff;
946}
947.md .tabbar .tab-link-highlight,
948.md .tabbar-labels .tab-link-highlight {
949 position: absolute;
950 bottom: 0;
951 height: 2px;
952 background: #fff;
953 -webkit-transition-duration: 300ms;
954 transition-duration: 300ms;
955 left: 0;
956}
957.md .toolbar-bottom-md,
958.md .messagebar {
959 top: auto !important;
960 bottom: 0 !important;
961}
962.md .toolbar-bottom-md:after,
963.md .messagebar:after {
964 content: '';
965 position: absolute;
966 right: 0;
967 width: 100%;
968 bottom: 100%;
969 height: 10px;
970 top: auto;
971 pointer-events: none;
972 background: -webkit-gradient(linear, left bottom, left top, from(rgba(0, 0, 0, 0.3)), color-stop(40%, rgba(0, 0, 0, 0.1)), color-stop(50%, rgba(0, 0, 0, 0.05)), color-stop(80%, rgba(0, 0, 0, 0)), to(rgba(0, 0, 0, 0)));
973 background: -webkit-linear-gradient(bottom, rgba(0, 0, 0, 0.3) 0%, rgba(0, 0, 0, 0.1) 40%, rgba(0, 0, 0, 0.05) 50%, rgba(0, 0, 0, 0) 80%, rgba(0, 0, 0, 0) 100%);
974 background: linear-gradient(to top, rgba(0, 0, 0, 0.3) 0%, rgba(0, 0, 0, 0.1) 40%, rgba(0, 0, 0, 0.05) 50%, rgba(0, 0, 0, 0) 80%, rgba(0, 0, 0, 0) 100%);
975}
976.md .toolbar-bottom-md .tab-link-highlight,
977.md .messagebar .tab-link-highlight {
978 bottom: auto;
979 top: 0;
980}
981.md .tabbar-labels {
982 height: 72px;
983}
984.md .tabbar-labels a.tab-link,
985.md .tabbar-labels a.link {
986 padding-top: 12px;
987 padding-bottom: 12px;
988}
989.md .tabbar-labels .tabbar-label {
990 margin-top: 10px;
991 max-width: 100%;
992 overflow: hidden;
993}
994.md .tabbar-labels.toolbar-bottom-md {
995 height: 56px;
996}
997.md .tabbar-labels.toolbar-bottom-md a.tab-link,
998.md .tabbar-labels.toolbar-bottom-md a.link {
999 padding-top: 7px;
1000 padding-bottom: 7px;
1001}
1002.md .tabbar-labels.toolbar-bottom-md .tabbar-label {
1003 text-transform: none;
1004 line-height: 1.2;
1005 font-weight: normal;
1006 letter-spacing: 0;
1007}
1008.md .tabbar-scrollable .toolbar-inner {
1009 overflow: auto;
1010 -webkit-box-pack: start;
1011 -webkit-justify-content: flex-start;
1012 -ms-flex-pack: start;
1013 justify-content: flex-start;
1014}
1015.md .tabbar-scrollable a.tab-link,
1016.md .tabbar-scrollable a.link {
1017 padding: 0 16px;
1018}
1019.md .toolbar:not(.toolbar-bottom-md):not(.messagebar) ~ * .page-content,
1020.md .toolbar:not(.toolbar-bottom-md):not(.messagebar) ~ .page-content {
1021 padding-top: 48px;
1022}
1023.md .toolbar.tabbar-labels:not(.toolbar-bottom-md) ~ * .page-content,
1024.md .toolbar.tabbar-labels:not(.toolbar-bottom-md) ~ .page-content {
1025 padding-top: 72px;
1026}
1027.md .toolbar-hidden {
1028 -webkit-transform: translate3d(0, -100%, 0);
1029 transform: translate3d(0, -100%, 0);
1030}
1031.md .toolbar-hidden:after {
1032 display: none;
1033}
1034.md .toolbar-hidden.toolbar-bottom-md,
1035.md .toolbar-hidden.messagebar {
1036 -webkit-transform: translate3d(0, 100%, 0);
1037 transform: translate3d(0, 100%, 0);
1038}
1039.md .navbar + .toolbar:not(.toolbar-bottom-md):not(.messagebar) {
1040 top: 56px;
1041}
1042.md .navbar + .toolbar:not(.toolbar-bottom-md):not(.messagebar) ~ * .page-content,
1043.md .navbar + .toolbar:not(.toolbar-bottom-md):not(.messagebar) ~ .page-content {
1044 padding-top: 104px;
1045}
1046.md .navbar + .toolbar.tabbar-labels:not(.toolbar-bottom-md) ~ * .page-content,
1047.md .navbar + .toolbar.tabbar-labels:not(.toolbar-bottom-md) ~ .page-content {
1048 padding-top: 128px;
1049}
1050.md .navbar + .toolbar-hidden:not(.toolbar-bottom-md):not(.messagebar) {
1051 -webkit-transform: translate3d(0, -104px, 0);
1052 transform: translate3d(0, -104px, 0);
1053}
1054.md .navbar + .toolbar-hidden.tabbar-labels:not(.toolbar-bottom-md) {
1055 -webkit-transform: translate3d(0, -128px, 0);
1056 transform: translate3d(0, -128px, 0);
1057}
1058.md .navbar.navbar-hidden + .toolbar:not(.toolbar-bottom-md):not(.messagebar):not(.toolbar-hidden) {
1059 -webkit-transform: translate3d(0, -56px, 0);
1060 transform: translate3d(0, -56px, 0);
1061}
1062@media (min-width: 768px) {
1063 .md .navbar + .toolbar:not(.toolbar-bottom-md):not(.messagebar) {
1064 top: 64px;
1065 }
1066 .md .navbar + .toolbar:not(.toolbar-bottom-md):not(.messagebar) ~ * .page-content,
1067 .md .navbar + .toolbar:not(.toolbar-bottom-md):not(.messagebar) ~ .page-content {
1068 padding-top: 112px;
1069 }
1070 .md .navbar + .toolbar.tabbar-labels:not(.toolbar-bottom-md) ~ * .page-content,
1071 .md .navbar + .toolbar.tabbar-labels:not(.toolbar-bottom-md) ~ .page-content {
1072 padding-top: 136px;
1073 }
1074 .md .navbar.navbar-hidden + .toolbar:not(.toolbar-bottom-md):not(.messagebar):not(.toolbar-hidden) {
1075 -webkit-transform: translate3d(0, -64px, 0);
1076 transform: translate3d(0, -64px, 0);
1077 }
1078 .md .navbar + .toolbar-hidden:not(.toolbar-bottom-md):not(.messagebar) {
1079 -webkit-transform: translate3d(0, -112px, 0);
1080 transform: translate3d(0, -112px, 0);
1081 }
1082 .md .navbar + .toolbar-hidden.tabbar-labels:not(.toolbar-bottom-md):not(.messagebar) {
1083 -webkit-transform: translate3d(0, -136px, 0);
1084 transform: translate3d(0, -136px, 0);
1085 }
1086}
1087.md .toolbar-bottom-md ~ * .page-content,
1088.md .toolbar-bottom-md ~ .page-content,
1089.md .messagebar ~ * .page-content,
1090.md .messagebar ~ .page-content {
1091 padding-bottom: 48px;
1092}
1093.md .toolbar-bottom-md.tabbar-labels ~ * .page-content,
1094.md .toolbar-bottom-md.tabbar-labels ~ .page-content {
1095 padding-bottom: 56px;
1096}
1097.md .toolbar-transitioning,
1098.md .navbar-transitioning + .toolbar {
1099 -webkit-transition-duration: 400ms;
1100 transition-duration: 400ms;
1101}
1102.md .color-theme-red .toolbar:not(.messagebar),
1103.md .color-theme-red.toolbar:not(.messagebar) {
1104 background: #f44336;
1105}
1106.md .color-theme-green .toolbar:not(.messagebar),
1107.md .color-theme-green.toolbar:not(.messagebar) {
1108 background: #4caf50;
1109}
1110.md .color-theme-blue .toolbar:not(.messagebar),
1111.md .color-theme-blue.toolbar:not(.messagebar) {
1112 background: #2196f3;
1113}
1114.md .color-theme-pink .toolbar:not(.messagebar),
1115.md .color-theme-pink.toolbar:not(.messagebar) {
1116 background: #e91e63;
1117}
1118.md .color-theme-yellow .toolbar:not(.messagebar),
1119.md .color-theme-yellow.toolbar:not(.messagebar) {
1120 background: #ffeb3b;
1121}
1122.md .color-theme-orange .toolbar:not(.messagebar),
1123.md .color-theme-orange.toolbar:not(.messagebar) {
1124 background: #ff9800;
1125}
1126.md .color-theme-gray .toolbar:not(.messagebar),
1127.md .color-theme-gray.toolbar:not(.messagebar) {
1128 background: #9e9e9e;
1129}
1130.md .color-theme-white .toolbar:not(.messagebar),
1131.md .color-theme-white.toolbar:not(.messagebar) {
1132 background: #ffffff;
1133}
1134.md .color-theme-black .toolbar:not(.messagebar),
1135.md .color-theme-black.toolbar:not(.messagebar) {
1136 background: #000000;
1137}
1138.md .toolbar:not(.messagebar).color-red {
1139 background: #f44336;
1140}
1141.md .toolbar:not(.messagebar).color-green {
1142 background: #4caf50;
1143}
1144.md .toolbar:not(.messagebar).color-blue {
1145 background: #2196f3;
1146}
1147.md .toolbar:not(.messagebar).color-pink {
1148 background: #e91e63;
1149}
1150.md .toolbar:not(.messagebar).color-yellow {
1151 background: #ffeb3b;
1152}
1153.md .toolbar:not(.messagebar).color-orange {
1154 background: #ff9800;
1155}
1156.md .toolbar:not(.messagebar).color-gray {
1157 background: #9e9e9e;
1158}
1159.md .toolbar:not(.messagebar).color-white {
1160 background: #ffffff;
1161}
1162.md .toolbar:not(.messagebar).color-black {
1163 background: #000000;
1164}
1165.md.device-iphone-x .views > .toolbar:first-child:not(.toolbar-bottom-md),
1166.md.device-iphone-x .view > .toolbar:first-child:not(.toolbar-bottom-md),
1167.md.device-iphone-x .page > .toolbar:first-child:not(.toolbar-bottom-md),
1168.md.device-iphone-x .popup > .toolbar:first-child:not(.toolbar-bottom-md),
1169.md.device-iphone-x .panel > .toolbar:first-child:not(.toolbar-bottom-md),
1170.md.device-iphone-x .login-screen > .toolbar:first-child:not(.toolbar-bottom-md) {
1171 height: calc(48px + constant(safe-area-inset-top));
1172 height: calc(48px + env(safe-area-inset-top));
1173}
1174.md.device-iphone-x .views > .toolbar:first-child:not(.toolbar-bottom-md) .toolbar-inner,
1175.md.device-iphone-x .view > .toolbar:first-child:not(.toolbar-bottom-md) .toolbar-inner,
1176.md.device-iphone-x .page > .toolbar:first-child:not(.toolbar-bottom-md) .toolbar-inner,
1177.md.device-iphone-x .popup > .toolbar:first-child:not(.toolbar-bottom-md) .toolbar-inner,
1178.md.device-iphone-x .panel > .toolbar:first-child:not(.toolbar-bottom-md) .toolbar-inner,
1179.md.device-iphone-x .login-screen > .toolbar:first-child:not(.toolbar-bottom-md) .toolbar-inner {
1180 height: auto;
1181}
1182.md.device-iphone-x .views > .toolbar:first-child:not(.toolbar-bottom-md) .toolbar-inner,
1183.md.device-iphone-x .view > .toolbar:first-child:not(.toolbar-bottom-md) .toolbar-inner,
1184.md.device-iphone-x .page > .toolbar:first-child:not(.toolbar-bottom-md) .toolbar-inner,
1185.md.device-iphone-x .popup > .toolbar:first-child:not(.toolbar-bottom-md) .toolbar-inner,
1186.md.device-iphone-x .panel > .toolbar:first-child:not(.toolbar-bottom-md) .toolbar-inner,
1187.md.device-iphone-x .login-screen > .toolbar:first-child:not(.toolbar-bottom-md) .toolbar-inner {
1188 bottom: 0;
1189 top: constant(safe-area-inset-top);
1190 top: env(safe-area-inset-top);
1191}
1192.md.device-iphone-x .views > .toolbar:first-child:not(.toolbar-bottom-md).tabbar-labels,
1193.md.device-iphone-x .view > .toolbar:first-child:not(.toolbar-bottom-md).tabbar-labels,
1194.md.device-iphone-x .page > .toolbar:first-child:not(.toolbar-bottom-md).tabbar-labels,
1195.md.device-iphone-x .popup > .toolbar:first-child:not(.toolbar-bottom-md).tabbar-labels,
1196.md.device-iphone-x .panel > .toolbar:first-child:not(.toolbar-bottom-md).tabbar-labels,
1197.md.device-iphone-x .login-screen > .toolbar:first-child:not(.toolbar-bottom-md).tabbar-labels {
1198 height: calc(72px + constant(safe-area-inset-top));
1199 height: calc(72px + env(safe-area-inset-top));
1200}
1201.md.device-iphone-x .views > .toolbar-bottom-md,
1202.md.device-iphone-x .view > .toolbar-bottom-md,
1203.md.device-iphone-x .page > .toolbar-bottom-md,
1204.md.device-iphone-x .popup > .toolbar-bottom-md,
1205.md.device-iphone-x .panel > .toolbar-bottom-md,
1206.md.device-iphone-x .login-screen > .toolbar-bottom-md {
1207 height: calc(48px + constant(safe-area-inset-bottom));
1208 height: calc(48px + env(safe-area-inset-bottom));
1209}
1210.md.device-iphone-x .views > .toolbar-bottom-md .toolbar-inner,
1211.md.device-iphone-x .view > .toolbar-bottom-md .toolbar-inner,
1212.md.device-iphone-x .page > .toolbar-bottom-md .toolbar-inner,
1213.md.device-iphone-x .popup > .toolbar-bottom-md .toolbar-inner,
1214.md.device-iphone-x .panel > .toolbar-bottom-md .toolbar-inner,
1215.md.device-iphone-x .login-screen > .toolbar-bottom-md .toolbar-inner {
1216 height: auto;
1217 top: 0;
1218 bottom: constant(safe-area-inset-bottom);
1219 bottom: env(safe-area-inset-bottom);
1220}
1221.md.device-iphone-x .views > .toolbar-bottom-md.tabbar-labels,
1222.md.device-iphone-x .view > .toolbar-bottom-md.tabbar-labels,
1223.md.device-iphone-x .page > .toolbar-bottom-md.tabbar-labels,
1224.md.device-iphone-x .popup > .toolbar-bottom-md.tabbar-labels,
1225.md.device-iphone-x .panel > .toolbar-bottom-md.tabbar-labels,
1226.md.device-iphone-x .login-screen > .toolbar-bottom-md.tabbar-labels {
1227 height: calc(56px + constant(safe-area-inset-bottom));
1228 height: calc(56px + env(safe-area-inset-bottom));
1229}
1230.md.device-iphone-x .toolbar-bottom-md ~ * .page-content,
1231.md.device-iphone-x .toolbar-bottom-md ~ .page-content,
1232.md.device-iphone-x .messagebar ~ * .page-content,
1233.md.device-iphone-x .messagebar ~ .page-content {
1234 padding-bottom: calc(48px + constant(safe-area-inset-bottom));
1235 padding-bottom: calc(48px + env(safe-area-inset-bottom));
1236}
1237.md.device-iphone-x .toolbar-bottom-md.tabbar-labels ~ * .page-content,
1238.md.device-iphone-x .toolbar-bottom-md.tabbar-labels ~ .page-content {
1239 padding-bottom: calc(56px + constant(safe-area-inset-bottom));
1240 padding-bottom: calc(56px + env(safe-area-inset-bottom));
1241}
1242@media (orientation: landscape) {
1243 .md.device-iphone-x .ios-left-edge .toolbar-inner,
1244 .md.device-iphone-x .ios-edges .toolbar-inner,
1245 .md.device-iphone-x .popup .toolbar-inner,
1246 .md.device-iphone-x .sheet-modal .toolbar-inner,
1247 .md.device-iphone-x .panel-left .toolbar-inner {
1248 padding-left: constant(safe-area-inset-left);
1249 padding-left: env(safe-area-inset-left);
1250 }
1251 .md.device-iphone-x .ios-right-edge .toolbar-inner,
1252 .md.device-iphone-x .ios-edges .toolbar-inner,
1253 .md.device-iphone-x .popup .toolbar-inner,
1254 .md.device-iphone-x .sheet-modal .toolbar-inner,
1255 .md.device-iphone-x .panel-right .toolbar-inner {
1256 padding-right: constant(safe-area-inset-right);
1257 padding-right: env(safe-area-inset-right);
1258 }
1259}
1260/* === Subnavbar === */
1261.subnavbar {
1262 width: 100%;
1263 position: absolute;
1264 left: 0;
1265 top: 0;
1266 z-index: 500;
1267 -webkit-box-sizing: border-box;
1268 box-sizing: border-box;
1269 display: -webkit-box;
1270 display: -webkit-flex;
1271 display: -ms-flexbox;
1272 display: flex;
1273 -webkit-box-pack: justify;
1274 -webkit-justify-content: space-between;
1275 -ms-flex-pack: justify;
1276 justify-content: space-between;
1277 -webkit-box-align: center;
1278 -webkit-align-items: center;
1279 -ms-flex-align: center;
1280 align-items: center;
1281}
1282.subnavbar .title {
1283 position: relative;
1284 overflow: hidden;
1285 text-overflow: ellpsis;
1286 white-space: nowrap;
1287}
1288.subnavbar .left,
1289.subnavbar .right {
1290 -webkit-flex-shrink: 0;
1291 -ms-flex-negative: 0;
1292 flex-shrink: 0;
1293 display: -webkit-box;
1294 display: -webkit-flex;
1295 display: -ms-flexbox;
1296 display: flex;
1297 -webkit-box-pack: start;
1298 -webkit-justify-content: flex-start;
1299 -ms-flex-pack: start;
1300 justify-content: flex-start;
1301 -webkit-box-align: center;
1302 -webkit-align-items: center;
1303 -ms-flex-align: center;
1304 align-items: center;
1305}
1306.subnavbar .right:first-child {
1307 position: absolute;
1308 height: 100%;
1309}
1310.subnavbar-inner {
1311 width: 100%;
1312 height: 100%;
1313 display: -webkit-box;
1314 display: -webkit-flex;
1315 display: -ms-flexbox;
1316 display: flex;
1317 -webkit-box-align: center;
1318 -webkit-align-items: center;
1319 -ms-flex-align: center;
1320 align-items: center;
1321 -webkit-box-sizing: border-box;
1322 box-sizing: border-box;
1323 -webkit-box-pack: justify;
1324 -webkit-justify-content: space-between;
1325 -ms-flex-pack: justify;
1326 justify-content: space-between;
1327 overflow: hidden;
1328}
1329.subnavbar-inner.stacked {
1330 display: none;
1331}
1332.navbar .subnavbar {
1333 top: 100%;
1334}
1335.views > .navbar,
1336.view > .navbar,
1337.page > .navbar {
1338 position: absolute;
1339}
1340.md .subnavbar {
1341 height: 48px;
1342 background: #2196f3;
1343 color: #fff;
1344}
1345.md .subnavbar:after {
1346 content: '';
1347 position: absolute;
1348 right: 0;
1349 width: 100%;
1350 top: 100%;
1351 bottom: auto;
1352 height: 10px;
1353 pointer-events: none;
1354 background: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0.3)), color-stop(40%, rgba(0, 0, 0, 0.1)), color-stop(50%, rgba(0, 0, 0, 0.05)), color-stop(80%, rgba(0, 0, 0, 0)), to(rgba(0, 0, 0, 0)));
1355 background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0.3) 0%, rgba(0, 0, 0, 0.1) 40%, rgba(0, 0, 0, 0.05) 50%, rgba(0, 0, 0, 0) 80%, rgba(0, 0, 0, 0) 100%);
1356 background: linear-gradient(to bottom, rgba(0, 0, 0, 0.3) 0%, rgba(0, 0, 0, 0.1) 40%, rgba(0, 0, 0, 0.05) 50%, rgba(0, 0, 0, 0) 80%, rgba(0, 0, 0, 0) 100%);
1357}
1358.md .subnavbar.no-shadow:after {
1359 display: none;
1360}
1361.md .subnavbar .title {
1362 margin: 0 16px;
1363 font-size: 20px;
1364 line-height: 48px;
1365 display: inline-block;
1366 text-align: left;
1367 font-weight: 500;
1368}
1369.md .subnavbar .title:first-child {
1370 margin-left: 56px;
1371}
1372.md .subnavbar .right {
1373 margin-left: auto;
1374}
1375.md .subnavbar .right:first-child {
1376 right: 16px;
1377}
1378.md .subnavbar a {
1379 color: inherit;
1380}
1381.md .subnavbar a.link {
1382 line-height: 48px;
1383 height: 48px;
1384 min-width: 48px;
1385 -webkit-box-pack: center;
1386 -webkit-justify-content: center;
1387 -ms-flex-pack: center;
1388 justify-content: center;
1389 padding: 0 16px;
1390}
1391.md .subnavbar a.link:before {
1392 content: '';
1393 width: 152%;
1394 height: 152%;
1395 position: absolute;
1396 left: -26%;
1397 top: -26%;
1398 background-image: -webkit-radial-gradient(center, circle, rgba(255, 255, 255, 0.15) 66%, rgba(255, 255, 255, 0) 66%);
1399 background-image: radial-gradient(circle at center, rgba(255, 255, 255, 0.15) 66%, rgba(255, 255, 255, 0) 66%);
1400 background-repeat: no-repeat;
1401 background-position: center;
1402 background-size: 100% 100%;
1403 opacity: 0;
1404 pointer-events: none;
1405 -webkit-transition-duration: 600ms;
1406 transition-duration: 600ms;
1407}
1408.md .subnavbar a.link.active-state:before {
1409 opacity: 1;
1410 -webkit-transition-duration: 150ms;
1411 transition-duration: 150ms;
1412}
1413.md .subnavbar a.icon-only {
1414 -webkit-flex-shrink: 0;
1415 -ms-flex-negative: 0;
1416 flex-shrink: 0;
1417 min-width: 0;
1418}
1419.md .subnavbar-inner {
1420 padding: 0 16px;
1421}
1422.md .subnavbar-inner > a.link:first-child {
1423 margin-left: -16px;
1424}
1425.md .subnavbar-inner > a.link:last-child {
1426 margin-right: -16px;
1427}
1428.md .subnavbar ~ * .page-content,
1429.md .subnavbar ~ .page-content,
1430.md .page-with-subnavbar .page-content {
1431 padding-top: 48px;
1432}
1433.md .navbar ~ .subnavbar ~ .page-content,
1434.md .navbar ~ .subnavbar ~ * .page-content,
1435.md .page-with-subnavbar .navbar ~ * .page-content,
1436.md .page-with-subnavbar .navbar ~ .page-content {
1437 padding-top: 104px;
1438}
1439@media (min-width: 768px) {
1440 .md .navbar ~ .subnavbar ~ .page-content,
1441 .md .navbar ~ .subnavbar ~ * .page-content,
1442 .md .page-with-subnavbar .navbar ~ * .page-content,
1443 .md .page-with-subnavbar .navbar ~ .page-content {
1444 padding-top: 112px;
1445 }
1446}
1447.md .navbar ~ .subnavbar,
1448.md .navbar ~ * .subnavbar,
1449.md .page-with-subnavbar .navbar ~ .subnavbar,
1450.md .page-with-subnavbar .navbar ~ * .subnavbar {
1451 top: 56px;
1452}
1453@media (min-width: 768px) {
1454 .md .navbar ~ .subnavbar,
1455 .md .navbar ~ * .subnavbar,
1456 .md .page-with-subnavbar .navbar ~ .subnavbar,
1457 .md .page-with-subnavbar .navbar ~ * .subnavbar {
1458 top: 64px;
1459 }
1460}
1461.md .color-theme-red .subnavbar,
1462.md .color-theme-red.subnavbar {
1463 background: #f44336;
1464}
1465.md .color-theme-green .subnavbar,
1466.md .color-theme-green.subnavbar {
1467 background: #4caf50;
1468}
1469.md .color-theme-blue .subnavbar,
1470.md .color-theme-blue.subnavbar {
1471 background: #2196f3;
1472}
1473.md .color-theme-pink .subnavbar,
1474.md .color-theme-pink.subnavbar {
1475 background: #e91e63;
1476}
1477.md .color-theme-yellow .subnavbar,
1478.md .color-theme-yellow.subnavbar {
1479 background: #ffeb3b;
1480}
1481.md .color-theme-orange .subnavbar,
1482.md .color-theme-orange.subnavbar {
1483 background: #ff9800;
1484}
1485.md .color-theme-gray .subnavbar,
1486.md .color-theme-gray.subnavbar {
1487 background: #9e9e9e;
1488}
1489.md .color-theme-white .subnavbar,
1490.md .color-theme-white.subnavbar {
1491 background: #ffffff;
1492}
1493.md .color-theme-black .subnavbar,
1494.md .color-theme-black.subnavbar {
1495 background: #000000;
1496}
1497.md .subnavbar.color-red {
1498 background: #f44336;
1499}
1500.md .subnavbar.color-green {
1501 background: #4caf50;
1502}
1503.md .subnavbar.color-blue {
1504 background: #2196f3;
1505}
1506.md .subnavbar.color-pink {
1507 background: #e91e63;
1508}
1509.md .subnavbar.color-yellow {
1510 background: #ffeb3b;
1511}
1512.md .subnavbar.color-orange {
1513 background: #ff9800;
1514}
1515.md .subnavbar.color-gray {
1516 background: #9e9e9e;
1517}
1518.md .subnavbar.color-white {
1519 background: #ffffff;
1520}
1521.md .subnavbar.color-black {
1522 background: #000000;
1523}
1524@media (orientation: landscape) {
1525 .md.device-iphone-x .ios-left-edge .subnavbar-inner,
1526 .md.device-iphone-x .ios-edges .subnavbar-inner,
1527 .md.device-iphone-x .popup .subnavbar-inner,
1528 .md.device-iphone-x .sheet-modal .subnavbar-inner,
1529 .md.device-iphone-x .panel-left .subnavbar-inner {
1530 padding-left: calc(16px + constant(safe-area-inset-left));
1531 padding-left: calc(16px + env(safe-area-inset-left));
1532 }
1533 .md.device-iphone-x .ios-right-edge .subnavbar-inner,
1534 .md.device-iphone-x .ios-edges .subnavbar-inner,
1535 .md.device-iphone-x .popup .subnavbar-inner,
1536 .md.device-iphone-x .sheet-modal .subnavbar-inner,
1537 .md.device-iphone-x .panel-right .subnavbar-inner {
1538 padding-right: calc(16px + constant(safe-area-inset-right));
1539 padding-right: calc(16px + env(safe-area-inset-right));
1540 }
1541}
1542/* === Content Block === */
1543.block {
1544 -webkit-box-sizing: border-box;
1545 box-sizing: border-box;
1546 position: relative;
1547 z-index: 1;
1548}
1549.block.no-hairlines:before,
1550.block.no-hairlines ul:before,
1551.md .block.no-hairlines-md:before,
1552.md .block.no-hairlines-md ul:before,
1553.ios .block.no-hairlines-ios:before,
1554.ios .block.no-hairlines-ios ul:before {
1555 display: none !important;
1556}
1557.block.no-hairlines:after,
1558.block.no-hairlines ul:after,
1559.md .block.no-hairlines-md:after,
1560.md .block.no-hairlines-md ul:after,
1561.ios .block.no-hairlines-ios:after,
1562.ios .block.no-hairlines-ios ul:after {
1563 display: none !important;
1564}
1565.block.no-hairline-top:before,
1566.block.no-hairline-top ul:before,
1567.md .block.no-hairline-top-md:before,
1568.md .block.no-hairline-top-md ul:before,
1569.ios .block.no-hairline-top-ios:before,
1570.ios .block.no-hairline-top-ios ul:before {
1571 display: none !important;
1572}
1573.block.no-hairline-bottom:after,
1574.block.no-hairline-bottom ul:after,
1575.md .block.no-hairline-bottom-md:after,
1576.md .block.no-hairline-bottom-md ul:after,
1577.ios .block.no-hairline-bottom-ios:after,
1578.ios .block.no-hairline-bottom-ios ul:after {
1579 display: none !important;
1580}
1581.block > h1:first-child,
1582.block > h2:first-child,
1583.block > h3:first-child,
1584.block > h4:first-child,
1585.block > p:first-child {
1586 margin-top: 0;
1587}
1588.block > h1:last-child,
1589.block > h2:last-child,
1590.block > h3:last-child,
1591.block > h4:last-child,
1592.block > p:last-child {
1593 margin-bottom: 0;
1594}
1595.block-title {
1596 position: relative;
1597 overflow: hidden;
1598 margin: 0;
1599 white-space: nowrap;
1600 text-overflow: ellipsis;
1601 font-size: 14px;
1602 line-height: 1;
1603}
1604.block-strong.inset {
1605 border-radius: 7px;
1606}
1607.block-strong.inset:before {
1608 display: none !important;
1609}
1610.block-strong.inset:after {
1611 display: none !important;
1612}
1613.block-footer,
1614.block-header {
1615 font-size: 14px;
1616}
1617.block-footer ul:first-child,
1618.block-header ul:first-child,
1619.block-footer p:first-child,
1620.block-header p:first-child,
1621.block-footer h1:first-child,
1622.block-header h1:first-child,
1623.block-footer h2:first-child,
1624.block-header h2:first-child,
1625.block-footer h3:first-child,
1626.block-header h3:first-child,
1627.block-footer h4:first-child,
1628.block-header h4:first-child {
1629 margin-top: 0;
1630}
1631.block-footer ul:last-child,
1632.block-header ul:last-child,
1633.block-footer p:last-child,
1634.block-header p:last-child,
1635.block-footer h1:last-child,
1636.block-header h1:last-child,
1637.block-footer h2:last-child,
1638.block-header h2:last-child,
1639.block-footer h3:last-child,
1640.block-header h3:last-child,
1641.block-footer h4:last-child,
1642.block-header h4:last-child {
1643 margin-bottom: 0;
1644}
1645.block-footer ul:first-child:last-child,
1646.block-header ul:first-child:last-child,
1647.block-footer p:first-child:last-child,
1648.block-header p:first-child:last-child,
1649.block-footer h1:first-child:last-child,
1650.block-header h1:first-child:last-child,
1651.block-footer h2:first-child:last-child,
1652.block-header h2:first-child:last-child,
1653.block-footer h3:first-child:last-child,
1654.block-header h3:first-child:last-child,
1655.block-footer h4:first-child:last-child,
1656.block-header h4:first-child:last-child {
1657 margin-top: 0;
1658 margin-bottom: 0;
1659}
1660.block-header {
1661 margin-bottom: 10px;
1662}
1663.block-footer {
1664 margin-top: 10px;
1665}
1666@media (min-width: 768px) {
1667 .block-strong.tablet-inset:before {
1668 display: none !important;
1669 }
1670 .block-strong.tablet-inset:after {
1671 display: none !important;
1672 }
1673}
1674.md .block {
1675 margin: 32px 0;
1676 padding: 0 16px;
1677}
1678.md .block-title {
1679 color: rgba(0, 0, 0, 0.54);
1680 margin: 32px 16px 16px;
1681 line-height: 16px;
1682 font-weight: 500;
1683}
1684.md .block-title + .list,
1685.md .block-title + .block,
1686.md .block-title + .card,
1687.md .block-title + .timeline,
1688.md .block-title + .block-header {
1689 margin-top: 0px;
1690}
1691.md .block-strong {
1692 padding: 16px;
1693}
1694.md .block-strong:before {
1695 content: '';
1696 position: absolute;
1697 background-color: rgba(0, 0, 0, 0.12);
1698 display: block;
1699 z-index: 15;
1700 top: 0;
1701 right: auto;
1702 bottom: auto;
1703 left: 0;
1704 height: 1px;
1705 width: 100%;
1706 -webkit-transform-origin: 50% 0%;
1707 transform-origin: 50% 0%;
1708}
1709.md.device-pixel-ratio-2 .block-strong:before {
1710 -webkit-transform: scaleY(0.5);
1711 transform: scaleY(0.5);
1712}
1713.md.device-pixel-ratio-3 .block-strong:before {
1714 -webkit-transform: scaleY(0.33);
1715 transform: scaleY(0.33);
1716}
1717.md .block-strong:after {
1718 content: '';
1719 position: absolute;
1720 background-color: rgba(0, 0, 0, 0.12);
1721 display: block;
1722 z-index: 15;
1723 top: auto;
1724 right: auto;
1725 bottom: 0;
1726 left: 0;
1727 height: 1px;
1728 width: 100%;
1729 -webkit-transform-origin: 50% 100%;
1730 transform-origin: 50% 100%;
1731}
1732.md.device-pixel-ratio-2 .block-strong:after {
1733 -webkit-transform: scaleY(0.5);
1734 transform: scaleY(0.5);
1735}
1736.md.device-pixel-ratio-3 .block-strong:after {
1737 -webkit-transform: scaleY(0.33);
1738 transform: scaleY(0.33);
1739}
1740.md .block.inset {
1741 margin-left: 16px;
1742 margin-right: 16px;
1743}
1744.md .block-strong.inset {
1745 border-radius: 4px;
1746}
1747.md .block-header,
1748.md .block-footer {
1749 padding: 0 16px;
1750 color: rgba(0, 0, 0, 0.54);
1751}
1752.md .block .block-header,
1753.md .block .block-footer {
1754 padding: 0;
1755}
1756.md .block-header {
1757 margin-top: 32px;
1758}
1759.md .block-header + .list,
1760.md .block-header + .block,
1761.md .block-header + .card,
1762.md .block-header + .timeline {
1763 margin-top: 10px;
1764}
1765.md .block-footer {
1766 margin-bottom: 32px;
1767}
1768.md .list .block-header,
1769.md .block .block-header,
1770.md .card .block-header,
1771.md .timeline .block-header {
1772 margin-top: 0;
1773}
1774.md .list .block-footer,
1775.md .block .block-footer,
1776.md .card .block-footer,
1777.md .timeline .block-footer {
1778 margin-bottom: 0;
1779}
1780.md .list + .block-footer,
1781.md .block + .block-footer,
1782.md .card + .block-footer,
1783.md .timeline + .block-footer {
1784 margin-top: -22px;
1785}
1786.md .block + .block-footer {
1787 margin-top: -22px;
1788 margin-bottom: 32px;
1789}
1790@media (min-width: 768px) {
1791 .md .block.tablet-inset {
1792 margin-left: 16px;
1793 margin-right: 16px;
1794 border-radius: 4px;
1795 }
1796 .md .block-strong.tablet-inset {
1797 border-radius: 4px;
1798 }
1799}
1800.md .theme-dark .block-title {
1801 color: #fff;
1802}
1803.md .theme-dark .block-header,
1804.md .theme-dark .block-footer {
1805 color: rgba(255, 255, 255, 0.54);
1806}
1807@media (orientation: landscape) {
1808 .md.device-iphone-x .ios-left-edge .block:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge),
1809 .md.device-iphone-x .ios-edges .block:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge),
1810 .md.device-iphone-x .popup .block:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge),
1811 .md.device-iphone-x .sheet-modal .block:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge),
1812 .md.device-iphone-x .panel-left .block:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge),
1813 .md.device-iphone-x .ios-left-edge .block-header,
1814 .md.device-iphone-x .ios-edges .block-header,
1815 .md.device-iphone-x .popup .block-header,
1816 .md.device-iphone-x .sheet-modal .block-header,
1817 .md.device-iphone-x .panel-left .block-header,
1818 .md.device-iphone-x .ios-left-edge .block-footer,
1819 .md.device-iphone-x .ios-edges .block-footer,
1820 .md.device-iphone-x .popup .block-footer,
1821 .md.device-iphone-x .sheet-modal .block-footer,
1822 .md.device-iphone-x .panel-left .block-footer {
1823 padding-left: calc(16px + constant(safe-area-inset-left));
1824 padding-left: calc(16px + env(safe-area-inset-left));
1825 }
1826 .md.device-iphone-x .ios-left-edge .block:not(.no-ios-edges):not(.no-ios-left-edge) .block-header,
1827 .md.device-iphone-x .ios-edges .block:not(.no-ios-edges):not(.no-ios-left-edge) .block-header,
1828 .md.device-iphone-x .popup .block:not(.no-ios-edges):not(.no-ios-left-edge) .block-header,
1829 .md.device-iphone-x .sheet-modal .block:not(.no-ios-edges):not(.no-ios-left-edge) .block-header,
1830 .md.device-iphone-x .panel-left .block:not(.no-ios-edges):not(.no-ios-left-edge) .block-header,
1831 .md.device-iphone-x .ios-left-edge .block:not(.no-ios-edges):not(.no-ios-left-edge) .block-footer,
1832 .md.device-iphone-x .ios-edges .block:not(.no-ios-edges):not(.no-ios-left-edge) .block-footer,
1833 .md.device-iphone-x .popup .block:not(.no-ios-edges):not(.no-ios-left-edge) .block-footer,
1834 .md.device-iphone-x .sheet-modal .block:not(.no-ios-edges):not(.no-ios-left-edge) .block-footer,
1835 .md.device-iphone-x .panel-left .block:not(.no-ios-edges):not(.no-ios-left-edge) .block-footer {
1836 padding-left: 0;
1837 }
1838 .md.device-iphone-x .ios-left-edge .block.inset:not(.no-ios-edges):not(.no-ios-left-edge),
1839 .md.device-iphone-x .ios-edges .block.inset:not(.no-ios-edges):not(.no-ios-left-edge),
1840 .md.device-iphone-x .popup .block.inset:not(.no-ios-edges):not(.no-ios-left-edge),
1841 .md.device-iphone-x .sheet-modal .block.inset:not(.no-ios-edges):not(.no-ios-left-edge),
1842 .md.device-iphone-x .panel-left .block.inset:not(.no-ios-edges):not(.no-ios-left-edge),
1843 .md.device-iphone-x .ios-left-edge .block-title:not(.no-ios-edges):not(.no-ios-left-edge),
1844 .md.device-iphone-x .ios-edges .block-title:not(.no-ios-edges):not(.no-ios-left-edge),
1845 .md.device-iphone-x .popup .block-title:not(.no-ios-edges):not(.no-ios-left-edge),
1846 .md.device-iphone-x .sheet-modal .block-title:not(.no-ios-edges):not(.no-ios-left-edge),
1847 .md.device-iphone-x .panel-left .block-title:not(.no-ios-edges):not(.no-ios-left-edge) {
1848 margin-left: calc(16px + constant(safe-area-inset-left));
1849 margin-left: calc(16px + env(safe-area-inset-left));
1850 }
1851 .md.device-iphone-x .ios-right-edge .block:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge),
1852 .md.device-iphone-x .ios-edges .block:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge),
1853 .md.device-iphone-x .popup .block:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge),
1854 .md.device-iphone-x .sheet-modal .block:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge),
1855 .md.device-iphone-x .panel-right .block:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge),
1856 .md.device-iphone-x .ios-right-edge .block-header,
1857 .md.device-iphone-x .ios-edges .block-header,
1858 .md.device-iphone-x .popup .block-header,
1859 .md.device-iphone-x .sheet-modal .block-header,
1860 .md.device-iphone-x .panel-right .block-header,
1861 .md.device-iphone-x .ios-right-edge .block-footer,
1862 .md.device-iphone-x .ios-edges .block-footer,
1863 .md.device-iphone-x .popup .block-footer,
1864 .md.device-iphone-x .sheet-modal .block-footer,
1865 .md.device-iphone-x .panel-right .block-footer {
1866 padding-right: calc(16px + constant(safe-area-inset-right));
1867 padding-right: calc(16px + env(safe-area-inset-right));
1868 }
1869 .md.device-iphone-x .ios-right-edge .block:not(.no-ios-edges):not(.no-ios-right-edge) .block-header,
1870 .md.device-iphone-x .ios-edges .block:not(.no-ios-edges):not(.no-ios-right-edge) .block-header,
1871 .md.device-iphone-x .popup .block:not(.no-ios-edges):not(.no-ios-right-edge) .block-header,
1872 .md.device-iphone-x .sheet-modal .block:not(.no-ios-edges):not(.no-ios-right-edge) .block-header,
1873 .md.device-iphone-x .panel-right .block:not(.no-ios-edges):not(.no-ios-right-edge) .block-header,
1874 .md.device-iphone-x .ios-right-edge .block:not(.no-ios-edges):not(.no-ios-right-edge) .block-footer,
1875 .md.device-iphone-x .ios-edges .block:not(.no-ios-edges):not(.no-ios-right-edge) .block-footer,
1876 .md.device-iphone-x .popup .block:not(.no-ios-edges):not(.no-ios-right-edge) .block-footer,
1877 .md.device-iphone-x .sheet-modal .block:not(.no-ios-edges):not(.no-ios-right-edge) .block-footer,
1878 .md.device-iphone-x .panel-right .block:not(.no-ios-edges):not(.no-ios-right-edge) .block-footer {
1879 padding-right: 0;
1880 }
1881 .md.device-iphone-x .ios-right-edge .block.inset:not(.no-ios-edges):not(.no-ios-right-edge),
1882 .md.device-iphone-x .ios-edges .block.inset:not(.no-ios-edges):not(.no-ios-right-edge),
1883 .md.device-iphone-x .popup .block.inset:not(.no-ios-edges):not(.no-ios-right-edge),
1884 .md.device-iphone-x .sheet-modal .block.inset:not(.no-ios-edges):not(.no-ios-right-edge),
1885 .md.device-iphone-x .panel-right .block.inset:not(.no-ios-edges):not(.no-ios-right-edge),
1886 .md.device-iphone-x .ios-right-edge .block-title:not(.no-ios-edges):not(.no-ios-right-edge),
1887 .md.device-iphone-x .ios-edges .block-title:not(.no-ios-edges):not(.no-ios-right-edge),
1888 .md.device-iphone-x .popup .block-title:not(.no-ios-edges):not(.no-ios-right-edge),
1889 .md.device-iphone-x .sheet-modal .block-title:not(.no-ios-edges):not(.no-ios-right-edge),
1890 .md.device-iphone-x .panel-right .block-title:not(.no-ios-edges):not(.no-ios-right-edge) {
1891 margin-right: calc(16px + constant(safe-area-inset-right));
1892 margin-right: calc(16px + env(safe-area-inset-right));
1893 }
1894}
1895@media (orientation: landscape) and (min-width: 768px) {
1896 .md.device-iphone-x .ios-left-edge .block.tablet-inset:not(.no-ios-edges):not(.no-ios-left-edge),
1897 .md.device-iphone-x .ios-edges .block.tablet-inset:not(.no-ios-edges):not(.no-ios-left-edge),
1898 .md.device-iphone-x .popup .block.tablet-inset:not(.no-ios-edges):not(.no-ios-left-edge),
1899 .md.device-iphone-x .sheet-modal .block.tablet-inset:not(.no-ios-edges):not(.no-ios-left-edge),
1900 .md.device-iphone-x .panel-left .block.tablet-inset:not(.no-ios-edges):not(.no-ios-left-edge) {
1901 margin-left: calc(16px + constant(safe-area-inset-left));
1902 margin-left: calc(16px + env(safe-area-inset-left));
1903 }
1904}
1905@media (orientation: landscape) and (min-width: 768px) {
1906 .md.device-iphone-x .ios-right-edge .block.tablet-inset:not(.no-ios-edges):not(.no-ios-right-edge),
1907 .md.device-iphone-x .ios-edges .block.tablet-inset:not(.no-ios-edges):not(.no-ios-right-edge),
1908 .md.device-iphone-x .popup .block.tablet-inset:not(.no-ios-edges):not(.no-ios-right-edge),
1909 .md.device-iphone-x .sheet-modal .block.tablet-inset:not(.no-ios-edges):not(.no-ios-right-edge),
1910 .md.device-iphone-x .panel-right .block.tablet-inset:not(.no-ios-edges):not(.no-ios-right-edge) {
1911 margin-right: calc(16px + constant(safe-area-inset-right));
1912 margin-right: calc(16px + env(safe-area-inset-right));
1913 }
1914}
1915/* === List View === */
1916.list {
1917 position: relative;
1918 z-index: 1;
1919}
1920.list ul {
1921 list-style: none;
1922 margin: 0;
1923 padding: 0;
1924 position: relative;
1925}
1926.list ul ul:before {
1927 display: none !important;
1928}
1929.list ul ul:after {
1930 display: none !important;
1931}
1932.list li {
1933 position: relative;
1934 -webkit-box-sizing: border-box;
1935 box-sizing: border-box;
1936}
1937.list .item-media {
1938 display: -webkit-box;
1939 display: -webkit-flex;
1940 display: -ms-flexbox;
1941 display: flex;
1942 -webkit-flex-shrink: 0;
1943 -ms-flex-negative: 0;
1944 flex-shrink: 0;
1945 -webkit-flex-wrap: nowrap;
1946 -ms-flex-wrap: nowrap;
1947 flex-wrap: nowrap;
1948 -webkit-box-align: center;
1949 -webkit-align-items: center;
1950 -ms-flex-align: center;
1951 align-items: center;
1952 -webkit-box-sizing: border-box;
1953 box-sizing: border-box;
1954 padding-bottom: 8px;
1955}
1956.list .item-inner {
1957 position: relative;
1958 width: 100%;
1959 padding-top: 8px;
1960 padding-bottom: 8px;
1961 min-width: 0;
1962 display: -webkit-box;
1963 display: -webkit-flex;
1964 display: -ms-flexbox;
1965 display: flex;
1966 -webkit-box-pack: justify;
1967 -webkit-justify-content: space-between;
1968 -ms-flex-pack: justify;
1969 justify-content: space-between;
1970 -webkit-box-sizing: border-box;
1971 box-sizing: border-box;
1972 -webkit-box-align: center;
1973 -webkit-align-items: center;
1974 -ms-flex-align: center;
1975 align-items: center;
1976 -webkit-align-self: stretch;
1977 -ms-flex-item-align: stretch;
1978 align-self: stretch;
1979}
1980.list .item-title {
1981 min-width: 0;
1982 -webkit-flex-shrink: 1;
1983 -ms-flex-negative: 1;
1984 flex-shrink: 1;
1985 white-space: nowrap;
1986 position: relative;
1987 overflow: hidden;
1988 text-overflow: ellipsis;
1989 max-width: 100%;
1990}
1991.list .item-after {
1992 white-space: nowrap;
1993 -webkit-flex-shrink: 0;
1994 -ms-flex-negative: 0;
1995 flex-shrink: 0;
1996 display: -webkit-box;
1997 display: -webkit-flex;
1998 display: -ms-flexbox;
1999 display: flex;
2000 margin-left: auto;
2001}
2002.list .item-link,
2003.list .list-button {
2004 -webkit-transition-duration: 300ms;
2005 transition-duration: 300ms;
2006 -webkit-transition-property: background-color;
2007 transition-property: background-color;
2008 display: block;
2009 position: relative;
2010 overflow: hidden;
2011 z-index: 0;
2012}
2013.list .item-content {
2014 display: -webkit-box;
2015 display: -webkit-flex;
2016 display: -ms-flexbox;
2017 display: flex;
2018 -webkit-box-pack: justify;
2019 -webkit-justify-content: space-between;
2020 -ms-flex-pack: justify;
2021 justify-content: space-between;
2022 -webkit-box-sizing: border-box;
2023 box-sizing: border-box;
2024 -webkit-box-align: center;
2025 -webkit-align-items: center;
2026 -ms-flex-align: center;
2027 align-items: center;
2028}
2029.list .item-subtitle {
2030 position: relative;
2031 overflow: hidden;
2032 white-space: nowrap;
2033 max-width: 100%;
2034 text-overflow: ellipsis;
2035}
2036.list .item-text {
2037 position: relative;
2038 overflow: hidden;
2039 text-overflow: hidden;
2040 -webkit-line-clamp: 2;
2041 -webkit-box-orient: vertical;
2042 display: -webkit-box;
2043}
2044.list .item-title-row {
2045 display: -webkit-box;
2046 display: -webkit-flex;
2047 display: -ms-flexbox;
2048 display: flex;
2049 -webkit-box-pack: justify;
2050 -webkit-justify-content: space-between;
2051 -ms-flex-pack: justify;
2052 justify-content: space-between;
2053 -webkit-box-sizing: border-box;
2054 box-sizing: border-box;
2055}
2056.list .item-title-row .item-after {
2057 -webkit-align-self: center;
2058 -ms-flex-item-align: center;
2059 align-self: center;
2060}
2061.list .item-row {
2062 display: -webkit-box;
2063 display: -webkit-flex;
2064 display: -ms-flexbox;
2065 display: flex;
2066 -webkit-box-pack: justify;
2067 -webkit-justify-content: space-between;
2068 -ms-flex-pack: justify;
2069 justify-content: space-between;
2070 -webkit-box-sizing: border-box;
2071 box-sizing: border-box;
2072}
2073.list .item-cell {
2074 display: block;
2075 -webkit-align-self: center;
2076 -ms-flex-item-align: center;
2077 align-self: center;
2078 -webkit-box-sizing: border-box;
2079 box-sizing: border-box;
2080 -webkit-flex-shrink: 1;
2081 -ms-flex-negative: 1;
2082 flex-shrink: 1;
2083}
2084.list li:last-child .list-button:after {
2085 display: none !important;
2086}
2087.list li:last-child > .item-inner:after,
2088.list li:last-child li:last-child > .item-inner:after,
2089.list li:last-child > .item-content > .item-inner:after,
2090.list li:last-child li:last-child > .item-content > .item-inner:after,
2091.list li:last-child > .swipeout-content > .item-content > .item-inner:after,
2092.list li:last-child li:last-child > .swipeout-content > .item-content > .item-inner:after,
2093.list li:last-child > .item-link > .item-content > .item-inner:after,
2094.list li:last-child li:last-child > .item-link > .item-content > .item-inner:after {
2095 display: none !important;
2096}
2097.list.no-hairlines:before,
2098.list.no-hairlines ul:before,
2099.md .list.no-hairlines-md:before,
2100.md .list.no-hairlines-md ul:before,
2101.ios .list.no-hairlines-ios:before,
2102.ios .list.no-hairlines-ios ul:before {
2103 display: none !important;
2104}
2105.list.no-hairlines:after,
2106.list.no-hairlines ul:after,
2107.md .list.no-hairlines-md:after,
2108.md .list.no-hairlines-md ul:after,
2109.ios .list.no-hairlines-ios:after,
2110.ios .list.no-hairlines-ios ul:after {
2111 display: none !important;
2112}
2113.list.no-hairline-top:before,
2114.list.no-hairline-top ul:before,
2115.md .list.no-hairline-top-md:before,
2116.md .list.no-hairline-top-md ul:before,
2117.ios .list.no-hairline-top-ios:before,
2118.ios .list.no-hairline-top-ios ul:before {
2119 display: none !important;
2120}
2121.list.no-hairline-bottom:after,
2122.list.no-hairline-bottom ul:after,
2123.md .list.no-hairline-bottom-md:after,
2124.md .list.no-hairline-bottom-md ul:after,
2125.ios .list.no-hairline-bottom-ios:after,
2126.ios .list.no-hairline-bottom-ios ul:after {
2127 display: none !important;
2128}
2129.list.no-hairlines-between .item-inner:after,
2130.md .list.no-hairlines-between-md .item-inner:after,
2131.ios .list.no-hairlines-between-ios .item-inner:after,
2132.list.no-hairlines-between .list-button:after,
2133.md .list.no-hairlines-between-md .list-button:after,
2134.ios .list.no-hairlines-between-ios .list-button:after,
2135.list.no-hairlines-between .item-divider:after,
2136.md .list.no-hairlines-between-md .item-divider:after,
2137.ios .list.no-hairlines-between-ios .item-divider:after,
2138.list.no-hairlines-between .list-group-title:after,
2139.md .list.no-hairlines-between-md .list-group-title:after,
2140.ios .list.no-hairlines-between-ios .list-group-title:after,
2141.list.no-hairlines-between .list-group-title:after,
2142.md .list.no-hairlines-between-md .list-group-title:after,
2143.ios .list.no-hairlines-between-ios .list-group-title:after {
2144 display: none !important;
2145}
2146.list.no-hairlines-between.simple-list li:after,
2147.md .list.no-hairlines-between-md.simple-list li:after,
2148.ios .list.no-hairlines-between-ios.simple-list li:after {
2149 display: none !important;
2150}
2151.list.no-hairlines-between.links-list a:after,
2152.md .list.no-hairlines-between-md.links-list a:after,
2153.ios .list.no-hairlines-between-ios.links-list a:after {
2154 display: none !important;
2155}
2156.list.simple-list li {
2157 position: relative;
2158 white-space: nowrap;
2159 text-overflow: ellipsis;
2160 max-width: 100%;
2161 -webkit-box-sizing: border-box;
2162 box-sizing: border-box;
2163 display: -webkit-box;
2164 display: -webkit-flex;
2165 display: -ms-flexbox;
2166 display: flex;
2167 -webkit-box-pack: justify;
2168 -webkit-justify-content: space-between;
2169 -ms-flex-pack: justify;
2170 justify-content: space-between;
2171 -webkit-box-align: center;
2172 -webkit-align-items: center;
2173 -ms-flex-align: center;
2174 align-items: center;
2175 -webkit-align-content: center;
2176 -ms-flex-line-pack: center;
2177 align-content: center;
2178}
2179.list.simple-list li:last-child:after {
2180 display: none !important;
2181}
2182.list.links-list a {
2183 -webkit-transition-duration: 300ms;
2184 transition-duration: 300ms;
2185 -webkit-transition-property: background-color;
2186 transition-property: background-color;
2187 display: block;
2188 position: relative;
2189 overflow: hidden;
2190 display: -webkit-box;
2191 display: -webkit-flex;
2192 display: -ms-flexbox;
2193 display: flex;
2194 -webkit-box-align: center;
2195 -webkit-align-items: center;
2196 -ms-flex-align: center;
2197 align-items: center;
2198 -webkit-align-content: center;
2199 -ms-flex-line-pack: center;
2200 align-content: center;
2201 -webkit-box-pack: justify;
2202 -webkit-justify-content: space-between;
2203 -ms-flex-pack: justify;
2204 justify-content: space-between;
2205 -webkit-box-sizing: border-box;
2206 box-sizing: border-box;
2207 white-space: nowrap;
2208 text-overflow: ellipsis;
2209 max-width: 100%;
2210}
2211.list.links-list li:last-child a:after {
2212 display: none !important;
2213}
2214.media-list .item-inner,
2215li.media-item .item-inner {
2216 display: block;
2217 -webkit-align-self: stretch;
2218 -ms-flex-item-align: stretch;
2219 align-self: stretch;
2220}
2221.media-list .item-link .item-inner,
2222li.media-item .item-link .item-inner {
2223 background: none;
2224}
2225.media-list .item-media,
2226li.media-item .item-media {
2227 -webkit-align-self: flex-start;
2228 -ms-flex-item-align: start;
2229 align-self: flex-start;
2230}
2231.media-list .item-media img,
2232li.media-item .item-media img {
2233 display: block;
2234}
2235.list .item-link .item-inner,
2236.links-list a,
2237.media-list .item-link .item-title-row,
2238li.media-item .item-link .item-title-row,
2239.media-list.chevron-center .item-link .item-inner,
2240.media-list .chevron-center .item-link .item-inner,
2241.media-list .item-link.chevron-center .item-inner,
2242li.media-item.chevron-center .item-link .item-inner,
2243li.media-item .chevron-center .item-link .item-inner,
2244li.media-item .item-link.chevron-center .item-inner {
2245 background-size: 8px 13px;
2246 background-repeat: no-repeat;
2247 background-position: 95% center;
2248 background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D'8px'%20height%3D'13px'%20viewBox%3D'0%200%208%2013'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%3Cpolygon%20fill%3D'%23c7c7cc'%20transform%3D'translate(1.500000%2C%206.500000)%20rotate(-45.000000)%20translate(-1.500000%2C%20-6.500000)%20'%20points%3D'6%2011%206%202%204%202%204%209%20-3%209%20-3%2011%205%2011'%3E%3C%2Fpolygon%3E%3C%2Fsvg%3E");
2249}
2250.links-list.no-chevron a,
2251.no-chevron .links-list a,
2252.links-list .no-chevron a,
2253.item-link.no-chevron .item-inner,
2254.no-chevron .item-link .item-inner,
2255.media-list.no-chevron .item-link .item-title-row,
2256.no-chevron .media-list .item-link .item-title-row,
2257li.media-item .no-chevron .item-title-row,
2258li.media-item.no-chevron .item-title-row,
2259.media-list.chevron-center .item-title-row,
2260.media-list .chevron-center .item-title-row,
2261li.media-item.chevron-center .item-title-row,
2262li.media-item .chevron-center .item-title-row {
2263 background-image: none !important;
2264}
2265.media-list .item-link .item-inner,
2266li.media-item .item-link .item-inner {
2267 background-image: none;
2268}
2269.media-list .item-link .item-title-row,
2270li.media-item .item-link .item-title-row {
2271 background-position: right center !important;
2272}
2273.list-group ul:after,
2274.list-group ul:before {
2275 z-index: 25 !important;
2276}
2277.list-group + .list-group ul:before {
2278 display: none !important;
2279}
2280li.item-divider,
2281.item-divider,
2282li.list-group-title {
2283 white-space: nowrap;
2284 position: relative;
2285 max-width: 100%;
2286 text-overflow: ellipsis;
2287 overflow: hidden;
2288 z-index: 15;
2289}
2290li.list-group-title,
2291.list li.list-group-title {
2292 position: relative;
2293 position: -webkit-sticky;
2294 position: sticky;
2295 top: 0;
2296 margin-top: 0;
2297 z-index: 20;
2298}
2299li.list-group-title:before,
2300.list li.list-group-title:before {
2301 display: none !important;
2302}
2303.list.inset .block-title {
2304 margin-left: 0;
2305 margin-right: 0;
2306}
2307.list.inset ul:before {
2308 display: none !important;
2309}
2310.list.inset ul:after {
2311 display: none !important;
2312}
2313@media (min-width: 768px) {
2314 .list.tablet-inset .block-title {
2315 margin-left: 0;
2316 margin-right: 0;
2317 }
2318 .list.tablet-inset ul:before {
2319 display: none !important;
2320 }
2321 .list.tablet-inset ul:after {
2322 display: none !important;
2323 }
2324}
2325.theme-dark .list .item-link .item-inner,
2326.list.theme-dark .item-link .item-inner,
2327.theme-dark .links-list a,
2328.links-list.theme-dark a,
2329.theme-dark .media-list .item-link .item-title-row,
2330.media-list.theme-dark .item-link .item-title-row,
2331.theme-dark li.media-item .item-link .item-title-row {
2332 background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D'8px'%20height%3D'13px'%20viewBox%3D'0%200%208%2013'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%3Cpolygon%20fill%3D'%23434345'%20transform%3D'translate(1.500000%2C%206.500000)%20rotate(-45.000000)%20translate(-1.500000%2C%20-6.500000)%20'%20points%3D'6%2011%206%202%204%202%204%209%20-3%209%20-3%2011%205%2011'%3E%3C%2Fpolygon%3E%3C%2Fsvg%3E");
2333}
2334.theme-dark .media-list .item-link .item-inner,
2335.media-list.theme-dark .item-link .item-inner,
2336.theme-dark li.media-item .item-link .item-inner {
2337 background-image: none;
2338}
2339.md .list {
2340 margin: 32px 0;
2341 font-size: 16px;
2342}
2343.md .list .item-cell {
2344 width: 100%;
2345 min-width: 0;
2346 margin-left: 16px;
2347}
2348.md .list .item-cell:first-child {
2349 margin-left: 0;
2350}
2351.md .list .ripple-wave + .item-cell {
2352 margin-left: 0;
2353}
2354.md .list ul ul {
2355 padding-left: 56px;
2356}
2357.md .list .item-media {
2358 padding-top: 8px;
2359 min-width: 40px;
2360}
2361.md .list .item-media i + i,
2362.md .list .item-media i + img {
2363 margin-left: 8px;
2364}
2365.md .list .item-media + .item-inner {
2366 margin-left: 16px;
2367}
2368.md .list .item-inner {
2369 min-height: 48px;
2370 padding-right: 16px;
2371}
2372.md .list .item-after {
2373 color: #757575;
2374 font-size: 14px;
2375 padding-left: 8px;
2376}
2377.md .list .item-link,
2378.md .list .list-button {
2379 color: inherit;
2380}
2381.md .list .item-link .item-inner,
2382.md .list .list-button .item-inner {
2383 padding-right: 42px;
2384}
2385.md .list .item-link.active-state,
2386.md .list .list-button.active-state {
2387 background-color: rgba(0, 0, 0, 0.1);
2388}
2389.md .list .list-button {
2390 padding: 0 16px;
2391 font-size: 16px;
2392 line-height: 48px;
2393}
2394.md .list .item-content {
2395 min-height: 48px;
2396 padding-left: 16px;
2397}
2398.md .list .item-subtitle {
2399 font-size: 14px;
2400}
2401.md .list .item-text {
2402 font-size: 14px;
2403 color: #757575;
2404 line-height: 20px;
2405 max-height: 40px;
2406}
2407.md .list .item-header,
2408.md .list .item-footer {
2409 font-weight: normal;
2410 font-size: 12px;
2411 line-height: 1.2;
2412 white-space: normal;
2413}
2414.md .list .item-footer {
2415 color: rgba(0, 0, 0, 0.5);
2416}
2417.md .list .item-link.no-chevron .item-inner,
2418.md .list.no-chevron .item-link .item-inner,
2419.md .list .no-chevron .item-link .item-inner,
2420.md .no-chevron .list .item-link .item-inner {
2421 padding-right: 16px;
2422}
2423.md .simple-list li:after {
2424 content: '';
2425 position: absolute;
2426 background-color: rgba(0, 0, 0, 0.12);
2427 display: block;
2428 z-index: 15;
2429 top: auto;
2430 right: auto;
2431 bottom: 0;
2432 left: 0;
2433 height: 1px;
2434 width: 100%;
2435 -webkit-transform-origin: 50% 100%;
2436 transform-origin: 50% 100%;
2437}
2438.md.device-pixel-ratio-2 .simple-list li:after {
2439 -webkit-transform: scaleY(0.5);
2440 transform: scaleY(0.5);
2441}
2442.md.device-pixel-ratio-3 .simple-list li:after {
2443 -webkit-transform: scaleY(0.33);
2444 transform: scaleY(0.33);
2445}
2446.md .simple-list li {
2447 padding-left: 16px;
2448 padding-right: 16px;
2449 line-height: 48px;
2450 height: 48px;
2451}
2452.md .simple-list li:after {
2453 width: auto;
2454 left: 16px;
2455 right: 0;
2456}
2457.md .links-list a:after {
2458 content: '';
2459 position: absolute;
2460 background-color: rgba(0, 0, 0, 0.12);
2461 display: block;
2462 z-index: 15;
2463 top: auto;
2464 right: auto;
2465 bottom: 0;
2466 left: 0;
2467 height: 1px;
2468 width: 100%;
2469 -webkit-transform-origin: 50% 100%;
2470 transform-origin: 50% 100%;
2471}
2472.md.device-pixel-ratio-2 .links-list a:after {
2473 -webkit-transform: scaleY(0.5);
2474 transform: scaleY(0.5);
2475}
2476.md.device-pixel-ratio-3 .links-list a:after {
2477 -webkit-transform: scaleY(0.33);
2478 transform: scaleY(0.33);
2479}
2480.md .links-list a {
2481 height: 48px;
2482 color: inherit;
2483}
2484.md .links-list a.active-state {
2485 background-color: rgba(0, 0, 0, 0.1);
2486}
2487.md .links-list a:after {
2488 width: auto;
2489}
2490.md .links-list a {
2491 padding-left: 16px;
2492 padding-right: 42px;
2493}
2494.md .links-list a:after {
2495 left: 16px;
2496 right: 0;
2497}
2498.md .links-list.no-chevron a,
2499.md .no-chevron .links-list a,
2500.md .links-list a.no-chevron,
2501.md .links-list .no-chevron a {
2502 padding-right: 16px;
2503}
2504.md .media-list .item-inner,
2505.md li.media-item .item-inner {
2506 padding-top: 14px;
2507 padding-bottom: 14px;
2508}
2509.md .media-list .item-link .item-inner,
2510.md li.media-item .item-link .item-inner {
2511 padding-right: 16px;
2512}
2513.md .media-list .item-link .item-title-row,
2514.md li.media-item .item-link .item-title-row {
2515 padding-right: 26px;
2516}
2517.md .media-list .item-media,
2518.md li.media-item .item-media {
2519 padding-top: 14px;
2520 padding-bottom: 14px;
2521}
2522.md .media-list.chevron-center .item-link .item-inner,
2523.md .media-list .chevron-center .item-link .item-inner,
2524.md .media-list .item-link.chevron-center .item-inner,
2525.md li.media-item.chevron-center .item-link .item-inner,
2526.md li.media-item .item-link.chevron-center .item-inner,
2527.md li.media-item .chevron-center .item-link .item-inner {
2528 padding-right: 42px;
2529}
2530.md .media-list.no-chevron .item-link .item-title-row,
2531.md .no-chevron .media-list .item-link .item-title-row,
2532.md .media-list .no-chevron .item-link .item-title-row,
2533.md li.media-item.no-chevron .item-link .item-title-row,
2534.md .no-chevron li.media-item .item-link .item-title-row,
2535.md .media-list.chevron-center .item-title-row,
2536.md .media-list .chevron-center .item-title-row,
2537.md li.media-item.chevron-center .item-title-row,
2538.md li.media-item .chevron-center .item-title-row {
2539 padding-right: 0 !important;
2540}
2541.md .list .item-link .item-inner,
2542.md .links-list a {
2543 background-position: calc(100% - 16px) center;
2544}
2545.md .item-divider,
2546.md .list-group-title {
2547 padding: 0 16px;
2548 background: #f4f4f4;
2549 color: rgba(0, 0, 0, 0.54);
2550 height: 48px;
2551 line-height: 48px;
2552 -webkit-box-sizing: border-box;
2553 box-sizing: border-box;
2554 font-size: 14px;
2555}
2556.md .item-divider:before,
2557.md .list-group-title:before {
2558 display: none !important;
2559}
2560.md .item-divider:after,
2561.md .list-group-title:after {
2562 display: none !important;
2563}
2564.md .list-group-title {
2565 margin-top: 0;
2566}
2567.md .list .item-inner:after {
2568 content: '';
2569 position: absolute;
2570 background-color: rgba(0, 0, 0, 0.12);
2571 display: block;
2572 z-index: 15;
2573 top: auto;
2574 right: auto;
2575 bottom: 0;
2576 left: 0;
2577 height: 1px;
2578 width: 100%;
2579 -webkit-transform-origin: 50% 100%;
2580 transform-origin: 50% 100%;
2581}
2582.md.device-pixel-ratio-2 .list .item-inner:after {
2583 -webkit-transform: scaleY(0.5);
2584 transform: scaleY(0.5);
2585}
2586.md.device-pixel-ratio-3 .list .item-inner:after {
2587 -webkit-transform: scaleY(0.33);
2588 transform: scaleY(0.33);
2589}
2590.md .list ul:before {
2591 content: '';
2592 position: absolute;
2593 background-color: rgba(0, 0, 0, 0.12);
2594 display: block;
2595 z-index: 15;
2596 top: 0;
2597 right: auto;
2598 bottom: auto;
2599 left: 0;
2600 height: 1px;
2601 width: 100%;
2602 -webkit-transform-origin: 50% 0%;
2603 transform-origin: 50% 0%;
2604}
2605.md.device-pixel-ratio-2 .list ul:before {
2606 -webkit-transform: scaleY(0.5);
2607 transform: scaleY(0.5);
2608}
2609.md.device-pixel-ratio-3 .list ul:before {
2610 -webkit-transform: scaleY(0.33);
2611 transform: scaleY(0.33);
2612}
2613.md .list ul:after {
2614 content: '';
2615 position: absolute;
2616 background-color: rgba(0, 0, 0, 0.12);
2617 display: block;
2618 z-index: 15;
2619 top: auto;
2620 right: auto;
2621 bottom: 0;
2622 left: 0;
2623 height: 1px;
2624 width: 100%;
2625 -webkit-transform-origin: 50% 100%;
2626 transform-origin: 50% 100%;
2627}
2628.md.device-pixel-ratio-2 .list ul:after {
2629 -webkit-transform: scaleY(0.5);
2630 transform: scaleY(0.5);
2631}
2632.md.device-pixel-ratio-3 .list ul:after {
2633 -webkit-transform: scaleY(0.33);
2634 transform: scaleY(0.33);
2635}
2636.md .list.inset {
2637 margin-left: 16px;
2638 margin-right: 16px;
2639 border-radius: 4px;
2640}
2641.md .list.inset ul {
2642 border-radius: 4px;
2643}
2644.md .list.inset li:first-child > a {
2645 border-radius: 4px 4px 0 0;
2646}
2647.md .list.inset li:last-child > a {
2648 border-radius: 0 0 4px 4px;
2649}
2650.md .list.inset li:first-child:last-child > a {
2651 border-radius: 4px;
2652}
2653@media (min-width: 768px) {
2654 .md .list.tablet-inset {
2655 margin-left: 16px;
2656 margin-right: 16px;
2657 border-radius: 4px;
2658 }
2659 .md .list.tablet-inset li:first-child > a {
2660 border-radius: 4px 4px 0 0;
2661 }
2662 .md .list.tablet-inset li:last-child > a {
2663 border-radius: 0 0 4px 4px;
2664 }
2665 .md .list.tablet-inset li:first-child:last-child > a {
2666 border-radius: 4px;
2667 }
2668}
2669.md li li:last-child .item-inner:after,
2670.md li:last-child li .item-inner:after {
2671 content: '';
2672 position: absolute;
2673 background-color: rgba(0, 0, 0, 0.12);
2674 display: block;
2675 z-index: 15;
2676 top: auto;
2677 right: auto;
2678 bottom: 0;
2679 left: 0;
2680 height: 1px;
2681 width: 100%;
2682 -webkit-transform-origin: 50% 100%;
2683 transform-origin: 50% 100%;
2684}
2685html.device-pixel-ratio-2 .md li li:last-child .item-inner:after,
2686html.device-pixel-ratio-2 .md li:last-child li .item-inner:after {
2687 -webkit-transform: scaleY(0.5);
2688 transform: scaleY(0.5);
2689}
2690html.device-pixel-ratio-3 .md li li:last-child .item-inner:after,
2691html.device-pixel-ratio-3 .md li:last-child li .item-inner:after {
2692 -webkit-transform: scaleY(0.33);
2693 transform: scaleY(0.33);
2694}
2695@media (orientation: landscape) {
2696 .md.device-iphone-x .ios-left-edge .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge).simple-list li,
2697 .md.device-iphone-x .ios-edges .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge).simple-list li,
2698 .md.device-iphone-x .popup .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge).simple-list li,
2699 .md.device-iphone-x .sheet-modal .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge).simple-list li,
2700 .md.device-iphone-x .panel-left .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge).simple-list li {
2701 padding-left: calc(16px + constant(safe-area-inset-left));
2702 padding-left: calc(16px + env(safe-area-inset-left));
2703 }
2704 .md.device-iphone-x .ios-left-edge .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge) .item-divider,
2705 .md.device-iphone-x .ios-edges .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge) .item-divider,
2706 .md.device-iphone-x .popup .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge) .item-divider,
2707 .md.device-iphone-x .sheet-modal .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge) .item-divider,
2708 .md.device-iphone-x .panel-left .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge) .item-divider,
2709 .md.device-iphone-x .ios-left-edge .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge) .list-group-title,
2710 .md.device-iphone-x .ios-edges .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge) .list-group-title,
2711 .md.device-iphone-x .popup .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge) .list-group-title,
2712 .md.device-iphone-x .sheet-modal .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge) .list-group-title,
2713 .md.device-iphone-x .panel-left .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge) .list-group-title {
2714 padding-left: calc(16px + constant(safe-area-inset-left));
2715 padding-left: calc(16px + env(safe-area-inset-left));
2716 }
2717 .md.device-iphone-x .ios-left-edge .list.inset:not(.no-ios-edges):not(.no-ios-left-edge),
2718 .md.device-iphone-x .ios-edges .list.inset:not(.no-ios-edges):not(.no-ios-left-edge),
2719 .md.device-iphone-x .popup .list.inset:not(.no-ios-edges):not(.no-ios-left-edge),
2720 .md.device-iphone-x .sheet-modal .list.inset:not(.no-ios-edges):not(.no-ios-left-edge),
2721 .md.device-iphone-x .panel-left .list.inset:not(.no-ios-edges):not(.no-ios-left-edge) {
2722 margin-left: calc(16px + constant(safe-area-inset-left));
2723 margin-left: calc(16px + env(safe-area-inset-left));
2724 }
2725 .md.device-iphone-x .ios-left-edge .list.inset:not(.no-ios-edges):not(.no-ios-left-edge) .block-header,
2726 .md.device-iphone-x .ios-edges .list.inset:not(.no-ios-edges):not(.no-ios-left-edge) .block-header,
2727 .md.device-iphone-x .popup .list.inset:not(.no-ios-edges):not(.no-ios-left-edge) .block-header,
2728 .md.device-iphone-x .sheet-modal .list.inset:not(.no-ios-edges):not(.no-ios-left-edge) .block-header,
2729 .md.device-iphone-x .panel-left .list.inset:not(.no-ios-edges):not(.no-ios-left-edge) .block-header,
2730 .md.device-iphone-x .ios-left-edge .list.inset:not(.no-ios-edges):not(.no-ios-left-edge) .block-footer,
2731 .md.device-iphone-x .ios-edges .list.inset:not(.no-ios-edges):not(.no-ios-left-edge) .block-footer,
2732 .md.device-iphone-x .popup .list.inset:not(.no-ios-edges):not(.no-ios-left-edge) .block-footer,
2733 .md.device-iphone-x .sheet-modal .list.inset:not(.no-ios-edges):not(.no-ios-left-edge) .block-footer,
2734 .md.device-iphone-x .panel-left .list.inset:not(.no-ios-edges):not(.no-ios-left-edge) .block-footer {
2735 padding-left: 15px;
2736 }
2737 .md.device-iphone-x .ios-left-edge .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge) .item-content,
2738 .md.device-iphone-x .ios-edges .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge) .item-content,
2739 .md.device-iphone-x .popup .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge) .item-content,
2740 .md.device-iphone-x .sheet-modal .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge) .item-content,
2741 .md.device-iphone-x .panel-left .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge) .item-content {
2742 padding-left: calc(16px + constant(safe-area-inset-left));
2743 padding-left: calc(16px + env(safe-area-inset-left));
2744 }
2745 .md.device-iphone-x .ios-left-edge .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge).simple-list li:after,
2746 .md.device-iphone-x .ios-edges .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge).simple-list li:after,
2747 .md.device-iphone-x .popup .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge).simple-list li:after,
2748 .md.device-iphone-x .sheet-modal .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge).simple-list li:after,
2749 .md.device-iphone-x .panel-left .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge).simple-list li:after {
2750 left: calc(16px + constant(safe-area-inset-left));
2751 left: calc(16px + env(safe-area-inset-left));
2752 }
2753 .md.device-iphone-x .ios-left-edge .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge).links-list a,
2754 .md.device-iphone-x .ios-edges .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge).links-list a,
2755 .md.device-iphone-x .popup .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge).links-list a,
2756 .md.device-iphone-x .sheet-modal .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge).links-list a,
2757 .md.device-iphone-x .panel-left .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge).links-list a {
2758 padding-left: calc(16px + constant(safe-area-inset-left));
2759 padding-left: calc(16px + env(safe-area-inset-left));
2760 }
2761 .md.device-iphone-x .ios-left-edge .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge).links-list a:after,
2762 .md.device-iphone-x .ios-edges .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge).links-list a:after,
2763 .md.device-iphone-x .popup .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge).links-list a:after,
2764 .md.device-iphone-x .sheet-modal .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge).links-list a:after,
2765 .md.device-iphone-x .panel-left .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge).links-list a:after {
2766 left: calc(16px + constant(safe-area-inset-left));
2767 left: calc(16px + env(safe-area-inset-left));
2768 }
2769 .md.device-iphone-x .ios-right-edge .list.inset:not(.no-ios-edges):not(.no-ios-right-edge),
2770 .md.device-iphone-x .ios-edges .list.inset:not(.no-ios-edges):not(.no-ios-right-edge),
2771 .md.device-iphone-x .popup .list.inset:not(.no-ios-edges):not(.no-ios-right-edge),
2772 .md.device-iphone-x .sheet-modal .list.inset:not(.no-ios-edges):not(.no-ios-right-edge),
2773 .md.device-iphone-x .panel-right .list.inset:not(.no-ios-edges):not(.no-ios-right-edge) {
2774 margin-right: calc(16px + constant(safe-area-inset-right));
2775 margin-right: calc(16px + env(safe-area-inset-right));
2776 }
2777 .md.device-iphone-x .ios-right-edge .list.inset:not(.no-ios-edges):not(.no-ios-right-edge) .block-header,
2778 .md.device-iphone-x .ios-edges .list.inset:not(.no-ios-edges):not(.no-ios-right-edge) .block-header,
2779 .md.device-iphone-x .popup .list.inset:not(.no-ios-edges):not(.no-ios-right-edge) .block-header,
2780 .md.device-iphone-x .sheet-modal .list.inset:not(.no-ios-edges):not(.no-ios-right-edge) .block-header,
2781 .md.device-iphone-x .panel-right .list.inset:not(.no-ios-edges):not(.no-ios-right-edge) .block-header,
2782 .md.device-iphone-x .ios-right-edge .list.inset:not(.no-ios-edges):not(.no-ios-right-edge) .block-footer,
2783 .md.device-iphone-x .ios-edges .list.inset:not(.no-ios-edges):not(.no-ios-right-edge) .block-footer,
2784 .md.device-iphone-x .popup .list.inset:not(.no-ios-edges):not(.no-ios-right-edge) .block-footer,
2785 .md.device-iphone-x .sheet-modal .list.inset:not(.no-ios-edges):not(.no-ios-right-edge) .block-footer,
2786 .md.device-iphone-x .panel-right .list.inset:not(.no-ios-edges):not(.no-ios-right-edge) .block-footer {
2787 padding-right: 16px;
2788 }
2789 .md.device-iphone-x .ios-right-edge .list.tablet-inset:not(.no-ios-edges):not(.no-ios-right-edge) .block-header,
2790 .md.device-iphone-x .ios-edges .list.tablet-inset:not(.no-ios-edges):not(.no-ios-right-edge) .block-header,
2791 .md.device-iphone-x .popup .list.tablet-inset:not(.no-ios-edges):not(.no-ios-right-edge) .block-header,
2792 .md.device-iphone-x .sheet-modal .list.tablet-inset:not(.no-ios-edges):not(.no-ios-right-edge) .block-header,
2793 .md.device-iphone-x .panel-right .list.tablet-inset:not(.no-ios-edges):not(.no-ios-right-edge) .block-header,
2794 .md.device-iphone-x .ios-right-edge .list.tablet-inset:not(.no-ios-edges):not(.no-ios-right-edge) .block-footer,
2795 .md.device-iphone-x .ios-edges .list.tablet-inset:not(.no-ios-edges):not(.no-ios-right-edge) .block-footer,
2796 .md.device-iphone-x .popup .list.tablet-inset:not(.no-ios-edges):not(.no-ios-right-edge) .block-footer,
2797 .md.device-iphone-x .sheet-modal .list.tablet-inset:not(.no-ios-edges):not(.no-ios-right-edge) .block-footer,
2798 .md.device-iphone-x .panel-right .list.tablet-inset:not(.no-ios-edges):not(.no-ios-right-edge) .block-footer {
2799 padding-right: 16px;
2800 }
2801 .md.device-iphone-x .ios-right-edge .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) .item-divider,
2802 .md.device-iphone-x .ios-edges .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) .item-divider,
2803 .md.device-iphone-x .popup .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) .item-divider,
2804 .md.device-iphone-x .sheet-modal .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) .item-divider,
2805 .md.device-iphone-x .panel-right .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) .item-divider,
2806 .md.device-iphone-x .ios-right-edge .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) .list-group-title,
2807 .md.device-iphone-x .ios-edges .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) .list-group-title,
2808 .md.device-iphone-x .popup .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) .list-group-title,
2809 .md.device-iphone-x .sheet-modal .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) .list-group-title,
2810 .md.device-iphone-x .panel-right .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) .list-group-title {
2811 padding-right: calc(16px + constant(safe-area-inset-right));
2812 padding-right: calc(16px + env(safe-area-inset-right));
2813 }
2814 .md.device-iphone-x .ios-right-edge .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).simple-list li,
2815 .md.device-iphone-x .ios-edges .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).simple-list li,
2816 .md.device-iphone-x .popup .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).simple-list li,
2817 .md.device-iphone-x .sheet-modal .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).simple-list li,
2818 .md.device-iphone-x .panel-right .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).simple-list li {
2819 padding-right: calc(16px + constant(safe-area-inset-right));
2820 padding-right: calc(16px + env(safe-area-inset-right));
2821 }
2822 .md.device-iphone-x .ios-right-edge .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) .item-link .item-inner,
2823 .md.device-iphone-x .ios-edges .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) .item-link .item-inner,
2824 .md.device-iphone-x .popup .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) .item-link .item-inner,
2825 .md.device-iphone-x .sheet-modal .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) .item-link .item-inner,
2826 .md.device-iphone-x .panel-right .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) .item-link .item-inner,
2827 .md.device-iphone-x .ios-right-edge .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).links-list a,
2828 .md.device-iphone-x .ios-edges .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).links-list a,
2829 .md.device-iphone-x .popup .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).links-list a,
2830 .md.device-iphone-x .sheet-modal .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).links-list a,
2831 .md.device-iphone-x .panel-right .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).links-list a {
2832 background-position: calc(100% - 16px - constant(safe-area-inset-right)) center;
2833 background-position: calc(100% - 16px - env(safe-area-inset-right)) center;
2834 }
2835 .md.device-iphone-x .ios-right-edge .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) .item-inner,
2836 .md.device-iphone-x .ios-edges .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) .item-inner,
2837 .md.device-iphone-x .popup .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) .item-inner,
2838 .md.device-iphone-x .sheet-modal .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) .item-inner,
2839 .md.device-iphone-x .panel-right .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) .item-inner {
2840 padding-right: calc(16px + constant(safe-area-inset-right));
2841 padding-right: calc(16px + env(safe-area-inset-right));
2842 }
2843 .md.device-iphone-x .ios-right-edge .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) .item-link .item-inner,
2844 .md.device-iphone-x .ios-edges .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) .item-link .item-inner,
2845 .md.device-iphone-x .popup .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) .item-link .item-inner,
2846 .md.device-iphone-x .sheet-modal .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) .item-link .item-inner,
2847 .md.device-iphone-x .panel-right .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) .item-link .item-inner {
2848 padding-right: calc(42px + constant(safe-area-inset-right));
2849 padding-right: calc(42px + env(safe-area-inset-right));
2850 }
2851 .md.device-iphone-x .ios-right-edge .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).media-list .item-link .item-inner,
2852 .md.device-iphone-x .ios-edges .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).media-list .item-link .item-inner,
2853 .md.device-iphone-x .popup .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).media-list .item-link .item-inner,
2854 .md.device-iphone-x .sheet-modal .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).media-list .item-link .item-inner,
2855 .md.device-iphone-x .panel-right .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).media-list .item-link .item-inner,
2856 .md.device-iphone-x .ios-right-edge .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) li.media-item .item-link .item-inner,
2857 .md.device-iphone-x .ios-edges .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) li.media-item .item-link .item-inner,
2858 .md.device-iphone-x .popup .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) li.media-item .item-link .item-inner,
2859 .md.device-iphone-x .sheet-modal .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) li.media-item .item-link .item-inner,
2860 .md.device-iphone-x .panel-right .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) li.media-item .item-link .item-inner {
2861 padding-right: calc(16px + constant(safe-area-inset-right));
2862 padding-right: calc(16px + env(safe-area-inset-right));
2863 }
2864 .md.device-iphone-x .ios-right-edge .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).links-list a,
2865 .md.device-iphone-x .ios-edges .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).links-list a,
2866 .md.device-iphone-x .popup .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).links-list a,
2867 .md.device-iphone-x .sheet-modal .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).links-list a,
2868 .md.device-iphone-x .panel-right .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).links-list a {
2869 padding-right: calc(42px + constant(safe-area-inset-right));
2870 padding-right: calc(42px + env(safe-area-inset-right));
2871 }
2872 .md.device-iphone-x .ios-right-edge .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).media-list.chevron-center .item-link .item-inner,
2873 .md.device-iphone-x .ios-edges .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).media-list.chevron-center .item-link .item-inner,
2874 .md.device-iphone-x .popup .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).media-list.chevron-center .item-link .item-inner,
2875 .md.device-iphone-x .sheet-modal .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).media-list.chevron-center .item-link .item-inner,
2876 .md.device-iphone-x .panel-right .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).media-list.chevron-center .item-link .item-inner,
2877 .md.device-iphone-x .ios-right-edge .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).media-list .chevron-center .item-link .item-inner,
2878 .md.device-iphone-x .ios-edges .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).media-list .chevron-center .item-link .item-inner,
2879 .md.device-iphone-x .popup .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).media-list .chevron-center .item-link .item-inner,
2880 .md.device-iphone-x .sheet-modal .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).media-list .chevron-center .item-link .item-inner,
2881 .md.device-iphone-x .panel-right .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).media-list .chevron-center .item-link .item-inner,
2882 .md.device-iphone-x .ios-right-edge .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).media-list .item-link.chevron-center .item-inner,
2883 .md.device-iphone-x .ios-edges .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).media-list .item-link.chevron-center .item-inner,
2884 .md.device-iphone-x .popup .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).media-list .item-link.chevron-center .item-inner,
2885 .md.device-iphone-x .sheet-modal .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).media-list .item-link.chevron-center .item-inner,
2886 .md.device-iphone-x .panel-right .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).media-list .item-link.chevron-center .item-inner,
2887 .md.device-iphone-x .ios-right-edge .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) li.media-item.chevron-center .item-link .item-inner,
2888 .md.device-iphone-x .ios-edges .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) li.media-item.chevron-center .item-link .item-inner,
2889 .md.device-iphone-x .popup .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) li.media-item.chevron-center .item-link .item-inner,
2890 .md.device-iphone-x .sheet-modal .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) li.media-item.chevron-center .item-link .item-inner,
2891 .md.device-iphone-x .panel-right .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) li.media-item.chevron-center .item-link .item-inner,
2892 .md.device-iphone-x .ios-right-edge .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) li.media-item .item-link.chevron-center .item-inner,
2893 .md.device-iphone-x .ios-edges .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) li.media-item .item-link.chevron-center .item-inner,
2894 .md.device-iphone-x .popup .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) li.media-item .item-link.chevron-center .item-inner,
2895 .md.device-iphone-x .sheet-modal .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) li.media-item .item-link.chevron-center .item-inner,
2896 .md.device-iphone-x .panel-right .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) li.media-item .item-link.chevron-center .item-inner,
2897 .md.device-iphone-x .ios-right-edge .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) li.media-item .chevron-center .item-link .item-inner,
2898 .md.device-iphone-x .ios-edges .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) li.media-item .chevron-center .item-link .item-inner,
2899 .md.device-iphone-x .popup .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) li.media-item .chevron-center .item-link .item-inner,
2900 .md.device-iphone-x .sheet-modal .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) li.media-item .chevron-center .item-link .item-inner,
2901 .md.device-iphone-x .panel-right .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) li.media-item .chevron-center .item-link .item-inner {
2902 padding-right: calc(42px + constant(safe-area-inset-right));
2903 padding-right: calc(42px + env(safe-area-inset-right));
2904 }
2905 .md.device-iphone-x .ios-right-edge .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) .item-link.no-chevron .item-inner,
2906 .md.device-iphone-x .ios-edges .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) .item-link.no-chevron .item-inner,
2907 .md.device-iphone-x .popup .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) .item-link.no-chevron .item-inner,
2908 .md.device-iphone-x .sheet-modal .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) .item-link.no-chevron .item-inner,
2909 .md.device-iphone-x .panel-right .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) .item-link.no-chevron .item-inner,
2910 .md.device-iphone-x .ios-right-edge .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).no-chevron .item-link .item-inner,
2911 .md.device-iphone-x .ios-edges .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).no-chevron .item-link .item-inner,
2912 .md.device-iphone-x .popup .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).no-chevron .item-link .item-inner,
2913 .md.device-iphone-x .sheet-modal .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).no-chevron .item-link .item-inner,
2914 .md.device-iphone-x .panel-right .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).no-chevron .item-link .item-inner,
2915 .md.device-iphone-x .ios-right-edge .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) .no-chevron .item-link .item-inner,
2916 .md.device-iphone-x .ios-edges .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) .no-chevron .item-link .item-inner,
2917 .md.device-iphone-x .popup .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) .no-chevron .item-link .item-inner,
2918 .md.device-iphone-x .sheet-modal .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) .no-chevron .item-link .item-inner,
2919 .md.device-iphone-x .panel-right .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) .no-chevron .item-link .item-inner,
2920 .md.device-iphone-x .ios-right-edge .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).links-list.no-chevron a,
2921 .md.device-iphone-x .ios-edges .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).links-list.no-chevron a,
2922 .md.device-iphone-x .popup .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).links-list.no-chevron a,
2923 .md.device-iphone-x .sheet-modal .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).links-list.no-chevron a,
2924 .md.device-iphone-x .panel-right .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).links-list.no-chevron a,
2925 .md.device-iphone-x .ios-right-edge .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).links-list a.no-chevron,
2926 .md.device-iphone-x .ios-edges .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).links-list a.no-chevron,
2927 .md.device-iphone-x .popup .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).links-list a.no-chevron,
2928 .md.device-iphone-x .sheet-modal .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).links-list a.no-chevron,
2929 .md.device-iphone-x .panel-right .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).links-list a.no-chevron,
2930 .md.device-iphone-x .ios-right-edge .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).links-list .no-chevron a,
2931 .md.device-iphone-x .ios-edges .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).links-list .no-chevron a,
2932 .md.device-iphone-x .popup .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).links-list .no-chevron a,
2933 .md.device-iphone-x .sheet-modal .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).links-list .no-chevron a,
2934 .md.device-iphone-x .panel-right .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).links-list .no-chevron a {
2935 padding-right: calc(16px + constant(safe-area-inset-right));
2936 padding-right: calc(16px + env(safe-area-inset-right));
2937 }
2938 .md.device-iphone-x .ios-right-edge .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).media-list.no-chevron .item-link .item-title-row,
2939 .md.device-iphone-x .ios-edges .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).media-list.no-chevron .item-link .item-title-row,
2940 .md.device-iphone-x .popup .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).media-list.no-chevron .item-link .item-title-row,
2941 .md.device-iphone-x .sheet-modal .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).media-list.no-chevron .item-link .item-title-row,
2942 .md.device-iphone-x .panel-right .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).media-list.no-chevron .item-link .item-title-row,
2943 .md.device-iphone-x .ios-right-edge .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).media-list .no-chevron .item-link .item-title-row,
2944 .md.device-iphone-x .ios-edges .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).media-list .no-chevron .item-link .item-title-row,
2945 .md.device-iphone-x .popup .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).media-list .no-chevron .item-link .item-title-row,
2946 .md.device-iphone-x .sheet-modal .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).media-list .no-chevron .item-link .item-title-row,
2947 .md.device-iphone-x .panel-right .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).media-list .no-chevron .item-link .item-title-row,
2948 .md.device-iphone-x .ios-right-edge .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) li.media-item.no-chevron .item-link .item-title-row,
2949 .md.device-iphone-x .ios-edges .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) li.media-item.no-chevron .item-link .item-title-row,
2950 .md.device-iphone-x .popup .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) li.media-item.no-chevron .item-link .item-title-row,
2951 .md.device-iphone-x .sheet-modal .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) li.media-item.no-chevron .item-link .item-title-row,
2952 .md.device-iphone-x .panel-right .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) li.media-item.no-chevron .item-link .item-title-row,
2953 .md.device-iphone-x .ios-right-edge .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).no-chevron li.media-item .item-link .item-title-row,
2954 .md.device-iphone-x .ios-edges .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).no-chevron li.media-item .item-link .item-title-row,
2955 .md.device-iphone-x .popup .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).no-chevron li.media-item .item-link .item-title-row,
2956 .md.device-iphone-x .sheet-modal .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).no-chevron li.media-item .item-link .item-title-row,
2957 .md.device-iphone-x .panel-right .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).no-chevron li.media-item .item-link .item-title-row {
2958 padding-right: 0;
2959 }
2960}
2961@media (orientation: landscape) and (min-width: 768px) {
2962 .md.device-iphone-x .ios-left-edge .list.tablet-inset:not(.no-ios-edges):not(.no-ios-left-edge),
2963 .md.device-iphone-x .ios-edges .list.tablet-inset:not(.no-ios-edges):not(.no-ios-left-edge),
2964 .md.device-iphone-x .popup .list.tablet-inset:not(.no-ios-edges):not(.no-ios-left-edge),
2965 .md.device-iphone-x .sheet-modal .list.tablet-inset:not(.no-ios-edges):not(.no-ios-left-edge),
2966 .md.device-iphone-x .panel-left .list.tablet-inset:not(.no-ios-edges):not(.no-ios-left-edge) {
2967 margin-left: calc(16px + constant(safe-area-inset-left));
2968 margin-left: calc(16px + env(safe-area-inset-left));
2969 }
2970 .md.device-iphone-x .ios-left-edge .list.tablet-inset:not(.no-ios-edges):not(.no-ios-left-edge) .block-header,
2971 .md.device-iphone-x .ios-edges .list.tablet-inset:not(.no-ios-edges):not(.no-ios-left-edge) .block-header,
2972 .md.device-iphone-x .popup .list.tablet-inset:not(.no-ios-edges):not(.no-ios-left-edge) .block-header,
2973 .md.device-iphone-x .sheet-modal .list.tablet-inset:not(.no-ios-edges):not(.no-ios-left-edge) .block-header,
2974 .md.device-iphone-x .panel-left .list.tablet-inset:not(.no-ios-edges):not(.no-ios-left-edge) .block-header,
2975 .md.device-iphone-x .ios-left-edge .list.tablet-inset:not(.no-ios-edges):not(.no-ios-left-edge) .block-footer,
2976 .md.device-iphone-x .ios-edges .list.tablet-inset:not(.no-ios-edges):not(.no-ios-left-edge) .block-footer,
2977 .md.device-iphone-x .popup .list.tablet-inset:not(.no-ios-edges):not(.no-ios-left-edge) .block-footer,
2978 .md.device-iphone-x .sheet-modal .list.tablet-inset:not(.no-ios-edges):not(.no-ios-left-edge) .block-footer,
2979 .md.device-iphone-x .panel-left .list.tablet-inset:not(.no-ios-edges):not(.no-ios-left-edge) .block-footer {
2980 padding-left: 15px;
2981 }
2982}
2983@media (orientation: landscape) and (min-width: 768px) {
2984 .md.device-iphone-x .ios-right-edge .list.tablet-inset:not(.no-ios-edges):not(.no-ios-right-edge),
2985 .md.device-iphone-x .ios-edges .list.tablet-inset:not(.no-ios-edges):not(.no-ios-right-edge),
2986 .md.device-iphone-x .popup .list.tablet-inset:not(.no-ios-edges):not(.no-ios-right-edge),
2987 .md.device-iphone-x .sheet-modal .list.tablet-inset:not(.no-ios-edges):not(.no-ios-right-edge),
2988 .md.device-iphone-x .panel-right .list.tablet-inset:not(.no-ios-edges):not(.no-ios-right-edge) {
2989 margin-right: calc(16px + constant(safe-area-inset-right));
2990 margin-right: calc(16px + env(safe-area-inset-right));
2991 }
2992}
2993.md .theme-dark .list ul:before,
2994.list.md .theme-dark ul:before {
2995 background-color: rgba(255, 255, 255, 0.08);
2996}
2997.md .theme-dark .list ul:after,
2998.list.md .theme-dark ul:after {
2999 background-color: rgba(255, 255, 255, 0.08);
3000}
3001.md .theme-dark .list li li:last-child .item-inner:after,
3002.list.md .theme-dark li li:last-child .item-inner:after,
3003.md .theme-dark .list li:last-child li .item-inner:after,
3004.list.md .theme-dark li:last-child li .item-inner:after {
3005 background-color: rgba(255, 255, 255, 0.08);
3006}
3007.md .theme-dark .item-divider:before {
3008 background-color: rgba(255, 255, 255, 0.08);
3009}
3010.md .theme-dark .list-group-title:before {
3011 background-color: rgba(255, 255, 255, 0.08);
3012}
3013.md .theme-dark .list-button:after {
3014 background-color: rgba(255, 255, 255, 0.08);
3015}
3016.md .theme-dark .item-inner:after {
3017 background-color: rgba(255, 255, 255, 0.08);
3018}
3019.md .theme-dark .item-divider,
3020.md .theme-dark .list-group-title {
3021 background-color: #111;
3022 color: #fff;
3023}
3024.md .theme-dark .links-list a:after,
3025.md .theme-dark .simple-list li:after,
3026.md .theme-dark .links-list a:after,
3027.links-list.md .theme-dark a .simple-list li:after,
3028.simple-list.md .theme-dark li:after {
3029 background-color: rgba(255, 255, 255, 0.08);
3030}
3031.md .theme-dark .list .item-link.active-state,
3032.list.md .theme-dark .item-link.active-state,
3033.md .theme-dark .list .list-button.active-state,
3034.list.md .theme-dark .list-button.active-state,
3035.md .theme-dark .links-list a.active-state,
3036.links-list.md .theme-dark a.active-state {
3037 background-color: rgba(255, 255, 255, 0.05);
3038}
3039.md .theme-dark .item-after,
3040.md .theme-dark .item-text {
3041 color: rgba(255, 255, 255, 0.54);
3042}
3043.md .color-theme-red .list-button {
3044 color: #f44336;
3045}
3046.md .color-theme-green .list-button {
3047 color: #4caf50;
3048}
3049.md .color-theme-blue .list-button {
3050 color: #2196f3;
3051}
3052.md .color-theme-pink .list-button {
3053 color: #e91e63;
3054}
3055.md .color-theme-yellow .list-button {
3056 color: #ffeb3b;
3057}
3058.md .color-theme-orange .list-button {
3059 color: #ff9800;
3060}
3061.md .color-theme-gray .list-button {
3062 color: #9e9e9e;
3063}
3064.md .color-theme-white .list-button {
3065 color: #ffffff;
3066}
3067.md .color-theme-black .list-button {
3068 color: #000000;
3069}
3070.md .list .list-button.color-red,
3071.md .list li.color-red .list-button,
3072.md .links-list li.color-red a,
3073.md .simple-list li.color-red,
3074.md .links-list a.color-red,
3075.md .list .item-link.color-red,
3076.md .list li.color-red .item-link {
3077 color: #f44336;
3078}
3079.md .list .list-button.color-green,
3080.md .list li.color-green .list-button,
3081.md .links-list li.color-green a,
3082.md .simple-list li.color-green,
3083.md .links-list a.color-green,
3084.md .list .item-link.color-green,
3085.md .list li.color-green .item-link {
3086 color: #4caf50;
3087}
3088.md .list .list-button.color-blue,
3089.md .list li.color-blue .list-button,
3090.md .links-list li.color-blue a,
3091.md .simple-list li.color-blue,
3092.md .links-list a.color-blue,
3093.md .list .item-link.color-blue,
3094.md .list li.color-blue .item-link {
3095 color: #2196f3;
3096}
3097.md .list .list-button.color-pink,
3098.md .list li.color-pink .list-button,
3099.md .links-list li.color-pink a,
3100.md .simple-list li.color-pink,
3101.md .links-list a.color-pink,
3102.md .list .item-link.color-pink,
3103.md .list li.color-pink .item-link {
3104 color: #e91e63;
3105}
3106.md .list .list-button.color-yellow,
3107.md .list li.color-yellow .list-button,
3108.md .links-list li.color-yellow a,
3109.md .simple-list li.color-yellow,
3110.md .links-list a.color-yellow,
3111.md .list .item-link.color-yellow,
3112.md .list li.color-yellow .item-link {
3113 color: #ffeb3b;
3114}
3115.md .list .list-button.color-orange,
3116.md .list li.color-orange .list-button,
3117.md .links-list li.color-orange a,
3118.md .simple-list li.color-orange,
3119.md .links-list a.color-orange,
3120.md .list .item-link.color-orange,
3121.md .list li.color-orange .item-link {
3122 color: #ff9800;
3123}
3124.md .list .list-button.color-gray,
3125.md .list li.color-gray .list-button,
3126.md .links-list li.color-gray a,
3127.md .simple-list li.color-gray,
3128.md .links-list a.color-gray,
3129.md .list .item-link.color-gray,
3130.md .list li.color-gray .item-link {
3131 color: #9e9e9e;
3132}
3133.md .list .list-button.color-white,
3134.md .list li.color-white .list-button,
3135.md .links-list li.color-white a,
3136.md .simple-list li.color-white,
3137.md .links-list a.color-white,
3138.md .list .item-link.color-white,
3139.md .list li.color-white .item-link {
3140 color: #ffffff;
3141}
3142.md .list .list-button.color-black,
3143.md .list li.color-black .list-button,
3144.md .links-list li.color-black a,
3145.md .simple-list li.color-black,
3146.md .links-list a.color-black,
3147.md .list .item-link.color-black,
3148.md .list li.color-black .item-link {
3149 color: #000000;
3150}
3151/* === Badge === */
3152.badge {
3153 display: inline-block;
3154 color: #fff;
3155 background: #8e8e93;
3156 position: relative;
3157 -webkit-box-sizing: border-box;
3158 box-sizing: border-box;
3159 text-align: center;
3160}
3161.icon .badge,
3162.f7-icons .badge,
3163.framework7-icons .badge,
3164.material-icons .badge {
3165 position: absolute;
3166 left: 100%;
3167 margin-left: -10px;
3168 top: -2px;
3169}
3170.md .badge {
3171 font-size: 10px;
3172 border-radius: 3px;
3173 padding: 1px 6px;
3174 vertical-align: middle;
3175}
3176.md .icon .badge,
3177.md .f7-icons .badge,
3178.md .framework7-icons .badge,
3179.md .material-icons .badge {
3180 line-height: 1.4;
3181 padding: 1px 5px;
3182 font-family: Roboto, Noto, Helvetica, Arial, sans-serif;
3183 font-size: 10px;
3184}
3185.md .badge.color-red {
3186 background-color: #f44336;
3187}
3188.md .badge.color-green {
3189 background-color: #4caf50;
3190}
3191.md .badge.color-blue {
3192 background-color: #2196f3;
3193}
3194.md .badge.color-pink {
3195 background-color: #e91e63;
3196}
3197.md .badge.color-yellow {
3198 background-color: #ffeb3b;
3199}
3200.md .badge.color-orange {
3201 background-color: #ff9800;
3202}
3203.md .badge.color-gray {
3204 background-color: #9e9e9e;
3205}
3206.md .badge.color-white {
3207 background-color: #ffffff;
3208}
3209.md .badge.color-black {
3210 background-color: #000000;
3211}
3212button {
3213 -webkit-appearance: none;
3214 -moz-appearance: none;
3215 appearance: none;
3216}
3217.button {
3218 text-decoration: none;
3219 text-align: center;
3220 display: block;
3221 -webkit-appearance: none;
3222 -moz-appearance: none;
3223 appearance: none;
3224 background: none;
3225 padding: 0 10px;
3226 margin: 0;
3227 white-space: nowrap;
3228 text-overflow: ellipsis;
3229 font-size: 14px;
3230 position: relative;
3231 overflow: hidden;
3232 font-family: inherit;
3233 cursor: pointer;
3234 outline: 0;
3235 -webkit-box-sizing: border-box;
3236 box-sizing: border-box;
3237 vertical-align: middle;
3238}
3239input[type="submit"].button,
3240input[type="button"].button {
3241 width: 100%;
3242}
3243button {
3244 width: 100%;
3245}
3246.segmented {
3247 -webkit-align-self: center;
3248 -ms-flex-item-align: center;
3249 align-self: center;
3250 display: -webkit-box;
3251 display: -webkit-flex;
3252 display: -ms-flexbox;
3253 display: flex;
3254 -webkit-flex-wrap: nowrap;
3255 -ms-flex-wrap: nowrap;
3256 flex-wrap: nowrap;
3257}
3258.segmented .button,
3259.segmented button {
3260 width: 100%;
3261 -webkit-flex-shrink: 1;
3262 -ms-flex-negative: 1;
3263 flex-shrink: 1;
3264 min-width: 0;
3265}
3266.subnavbar .segmented {
3267 width: 100%;
3268}
3269.md .button {
3270 color: #2196f3;
3271 border-radius: 4px;
3272 line-height: 36px;
3273 height: 36px;
3274 text-transform: uppercase;
3275 min-width: 64px;
3276 padding: 0 8px;
3277 border: none;
3278 -webkit-transition-duration: 300ms;
3279 transition-duration: 300ms;
3280 -webkit-transform: translate3d(0, 0, 0);
3281 transform: translate3d(0, 0, 0);
3282 font-weight: 500;
3283 letter-spacing: 0.03em;
3284}
3285.md .button.active-state {
3286 background: rgba(0, 0, 0, 0.1);
3287}
3288.md .button.button-fill,
3289.md .button.button-fill-md,
3290.md .button.button-active,
3291.md .button.tab-link-active {
3292 background-color: #2196f3;
3293 color: #fff;
3294}
3295.md .button.button-fill.active-state,
3296.md .button.button-fill-md.active-state,
3297.md .button.button-active.active-state,
3298.md .button.tab-link-active.active-state {
3299 background: #0c82df;
3300}
3301.md .button.button-big,
3302.md .button.button-big-md {
3303 height: 48px;
3304 line-height: 48px;
3305 border-radius: 4px;
3306}
3307.md .button.button-round,
3308.md .button.button-round-md {
3309 border-radius: 36px;
3310}
3311.md .button.button-outline {
3312 border: 2px solid #2196f3;
3313 line-height: 32px;
3314}
3315.md .button.button-outline.button-big,
3316.md .button.button-outline.button-big-md {
3317 line-height: 44px;
3318}
3319.md .button.button-small,
3320.md .button.button-small-md {
3321 height: 28px;
3322 line-height: 28px;
3323 font-size: 13px;
3324 font-weight: 500;
3325 letter-spacing: 0.03em;
3326}
3327.md .button.button-small.button-outline,
3328.md .button.button-small-md.button-outline {
3329 border-width: 2px;
3330 line-height: 24px;
3331}
3332.md .button > i.icon + span,
3333.md .button > span:not(.ripple-wave) + span,
3334.md .button > span:not(.ripple-wave) + i.icon,
3335.md .button > i.icon + i.icon {
3336 margin-left: 8px;
3337}
3338.md .button.button-raised {
3339 -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
3340 box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
3341}
3342.md .button.button-raised.active-state {
3343 -webkit-box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23);
3344 box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23);
3345}
3346.md .navbar .button:not(.button-fill):not(.button-fill-md),
3347.md .subnavbar .button:not(.button-fill):not(.button-fill-md),
3348.md .toolbar .button:not(.button-fill):not(.button-fill-md) {
3349 color: #fff;
3350}
3351.md .navbar .button:not(.button-fill):not(.button-fill-md).active-state,
3352.md .subnavbar .button:not(.button-fill):not(.button-fill-md).active-state,
3353.md .toolbar .button:not(.button-fill):not(.button-fill-md).active-state {
3354 background: rgba(255, 255, 255, 0.15);
3355}
3356.md .toast .button:not(.button-fill):not(.button-fill-md).active-state {
3357 background: rgba(255, 255, 255, 0.15);
3358}
3359.md .segmented {
3360 border-radius: 4px;
3361}
3362.md .segmented.segmented-raised {
3363 -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
3364 box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
3365}
3366.md .segmented.segmented-round {
3367 border-radius: 36px;
3368}
3369.md .segmented .button {
3370 border-radius: 0;
3371 min-width: 0;
3372 border-left: 1px solid rgba(0, 0, 0, 0.1);
3373}
3374.md .segmented .button:first-child {
3375 border-radius: 4px 0 0 4px;
3376 border-left: none;
3377}
3378.md .segmented .button.button-outline {
3379 border: 2px solid #2196f3;
3380}
3381.md .segmented .button.button-outline:nth-child(n + 2) {
3382 border-left: none;
3383}
3384.md .segmented .button:last-child {
3385 border-radius: 0 4px 4px 0;
3386}
3387.md .segmented .button:first-child:last-child {
3388 border-radius: 4px;
3389}
3390.md .segmented .button.button-round:first-child {
3391 border-radius: 36px 0 0 36px;
3392}
3393.md .segmented .button.button-round:last-child {
3394 border-radius: 0 36px 36px 0;
3395}
3396.md .theme-dark .button:not(.button-fill):not(.button-fill-md):not(.button-active):not(.tab-link-active).active-state {
3397 background-color: rgba(255, 255, 255, 0.1);
3398}
3399.md .color-theme-red .button,
3400.md .color-red .button {
3401 color: #f44336;
3402}
3403.md .color-theme-red .button.button-fill,
3404.md .color-red .button.button-fill,
3405.md .color-theme-red .button.button-fill-md,
3406.md .color-red .button.button-fill-md,
3407.md .color-theme-red .button.button-active,
3408.md .color-red .button.button-active,
3409.md .color-theme-red .button.tab-link-active,
3410.md .color-red .button.tab-link-active {
3411 background-color: #f44336;
3412 color: #fff;
3413}
3414.md .color-theme-red .button.button-fill.active-state,
3415.md .color-red .button.button-fill.active-state,
3416.md .color-theme-red .button.button-fill-md.active-state,
3417.md .color-red .button.button-fill-md.active-state,
3418.md .color-theme-red .button.button-active.active-state,
3419.md .color-red .button.button-active.active-state,
3420.md .color-theme-red .button.tab-link-active.active-state,
3421.md .color-red .button.tab-link-active.active-state {
3422 background: #f21f0f;
3423}
3424.md .color-theme-red .button.button-outline,
3425.md .color-red .button.button-outline {
3426 border-color: #f44336;
3427}
3428.md .color-theme-green .button,
3429.md .color-green .button {
3430 color: #4caf50;
3431}
3432.md .color-theme-green .button.button-fill,
3433.md .color-green .button.button-fill,
3434.md .color-theme-green .button.button-fill-md,
3435.md .color-green .button.button-fill-md,
3436.md .color-theme-green .button.button-active,
3437.md .color-green .button.button-active,
3438.md .color-theme-green .button.tab-link-active,
3439.md .color-green .button.tab-link-active {
3440 background-color: #4caf50;
3441 color: #fff;
3442}
3443.md .color-theme-green .button.button-fill.active-state,
3444.md .color-green .button.button-fill.active-state,
3445.md .color-theme-green .button.button-fill-md.active-state,
3446.md .color-green .button.button-fill-md.active-state,
3447.md .color-theme-green .button.button-active.active-state,
3448.md .color-green .button.button-active.active-state,
3449.md .color-theme-green .button.tab-link-active.active-state,
3450.md .color-green .button.tab-link-active.active-state {
3451 background: #409343;
3452}
3453.md .color-theme-green .button.button-outline,
3454.md .color-green .button.button-outline {
3455 border-color: #4caf50;
3456}
3457.md .color-theme-blue .button,
3458.md .color-blue .button {
3459 color: #2196f3;
3460}
3461.md .color-theme-blue .button.button-fill,
3462.md .color-blue .button.button-fill,
3463.md .color-theme-blue .button.button-fill-md,
3464.md .color-blue .button.button-fill-md,
3465.md .color-theme-blue .button.button-active,
3466.md .color-blue .button.button-active,
3467.md .color-theme-blue .button.tab-link-active,
3468.md .color-blue .button.tab-link-active {
3469 background-color: #2196f3;
3470 color: #fff;
3471}
3472.md .color-theme-blue .button.button-fill.active-state,
3473.md .color-blue .button.button-fill.active-state,
3474.md .color-theme-blue .button.button-fill-md.active-state,
3475.md .color-blue .button.button-fill-md.active-state,
3476.md .color-theme-blue .button.button-active.active-state,
3477.md .color-blue .button.button-active.active-state,
3478.md .color-theme-blue .button.tab-link-active.active-state,
3479.md .color-blue .button.tab-link-active.active-state {
3480 background: #0c82df;
3481}
3482.md .color-theme-blue .button.button-outline,
3483.md .color-blue .button.button-outline {
3484 border-color: #2196f3;
3485}
3486.md .color-theme-pink .button,
3487.md .color-pink .button {
3488 color: #e91e63;
3489}
3490.md .color-theme-pink .button.button-fill,
3491.md .color-pink .button.button-fill,
3492.md .color-theme-pink .button.button-fill-md,
3493.md .color-pink .button.button-fill-md,
3494.md .color-theme-pink .button.button-active,
3495.md .color-pink .button.button-active,
3496.md .color-theme-pink .button.tab-link-active,
3497.md .color-pink .button.tab-link-active {
3498 background-color: #e91e63;
3499 color: #fff;
3500}
3501.md .color-theme-pink .button.button-fill.active-state,
3502.md .color-pink .button.button-fill.active-state,
3503.md .color-theme-pink .button.button-fill-md.active-state,
3504.md .color-pink .button.button-fill-md.active-state,
3505.md .color-theme-pink .button.button-active.active-state,
3506.md .color-pink .button.button-active.active-state,
3507.md .color-theme-pink .button.tab-link-active.active-state,
3508.md .color-pink .button.tab-link-active.active-state {
3509 background: #ca1452;
3510}
3511.md .color-theme-pink .button.button-outline,
3512.md .color-pink .button.button-outline {
3513 border-color: #e91e63;
3514}
3515.md .color-theme-yellow .button,
3516.md .color-yellow .button {
3517 color: #ffeb3b;
3518}
3519.md .color-theme-yellow .button.button-fill,
3520.md .color-yellow .button.button-fill,
3521.md .color-theme-yellow .button.button-fill-md,
3522.md .color-yellow .button.button-fill-md,
3523.md .color-theme-yellow .button.button-active,
3524.md .color-yellow .button.button-active,
3525.md .color-theme-yellow .button.tab-link-active,
3526.md .color-yellow .button.tab-link-active {
3527 background-color: #ffeb3b;
3528 color: #fff;
3529}
3530.md .color-theme-yellow .button.button-fill.active-state,
3531.md .color-yellow .button.button-fill.active-state,
3532.md .color-theme-yellow .button.button-fill-md.active-state,
3533.md .color-yellow .button.button-fill-md.active-state,
3534.md .color-theme-yellow .button.button-active.active-state,
3535.md .color-yellow .button.button-active.active-state,
3536.md .color-theme-yellow .button.tab-link-active.active-state,
3537.md .color-yellow .button.tab-link-active.active-state {
3538 background: #ffe712;
3539}
3540.md .color-theme-yellow .button.button-outline,
3541.md .color-yellow .button.button-outline {
3542 border-color: #ffeb3b;
3543}
3544.md .color-theme-orange .button,
3545.md .color-orange .button {
3546 color: #ff9800;
3547}
3548.md .color-theme-orange .button.button-fill,
3549.md .color-orange .button.button-fill,
3550.md .color-theme-orange .button.button-fill-md,
3551.md .color-orange .button.button-fill-md,
3552.md .color-theme-orange .button.button-active,
3553.md .color-orange .button.button-active,
3554.md .color-theme-orange .button.tab-link-active,
3555.md .color-orange .button.tab-link-active {
3556 background-color: #ff9800;
3557 color: #fff;
3558}
3559.md .color-theme-orange .button.button-fill.active-state,
3560.md .color-orange .button.button-fill.active-state,
3561.md .color-theme-orange .button.button-fill-md.active-state,
3562.md .color-orange .button.button-fill-md.active-state,
3563.md .color-theme-orange .button.button-active.active-state,
3564.md .color-orange .button.button-active.active-state,
3565.md .color-theme-orange .button.tab-link-active.active-state,
3566.md .color-orange .button.tab-link-active.active-state {
3567 background: #d68000;
3568}
3569.md .color-theme-orange .button.button-outline,
3570.md .color-orange .button.button-outline {
3571 border-color: #ff9800;
3572}
3573.md .color-theme-gray .button,
3574.md .color-gray .button {
3575 color: #9e9e9e;
3576}
3577.md .color-theme-gray .button.button-fill,
3578.md .color-gray .button.button-fill,
3579.md .color-theme-gray .button.button-fill-md,
3580.md .color-gray .button.button-fill-md,
3581.md .color-theme-gray .button.button-active,
3582.md .color-gray .button.button-active,
3583.md .color-theme-gray .button.tab-link-active,
3584.md .color-gray .button.tab-link-active {
3585 background-color: #9e9e9e;
3586 color: #fff;
3587}
3588.md .color-theme-gray .button.button-fill.active-state,
3589.md .color-gray .button.button-fill.active-state,
3590.md .color-theme-gray .button.button-fill-md.active-state,
3591.md .color-gray .button.button-fill-md.active-state,
3592.md .color-theme-gray .button.button-active.active-state,
3593.md .color-gray .button.button-active.active-state,
3594.md .color-theme-gray .button.tab-link-active.active-state,
3595.md .color-gray .button.tab-link-active.active-state {
3596 background: #8a8a8a;
3597}
3598.md .color-theme-gray .button.button-outline,
3599.md .color-gray .button.button-outline {
3600 border-color: #9e9e9e;
3601}
3602.md .color-theme-white .button,
3603.md .color-white .button {
3604 color: #ffffff;
3605}
3606.md .color-theme-white .button.button-fill,
3607.md .color-white .button.button-fill,
3608.md .color-theme-white .button.button-fill-md,
3609.md .color-white .button.button-fill-md,
3610.md .color-theme-white .button.button-active,
3611.md .color-white .button.button-active,
3612.md .color-theme-white .button.tab-link-active,
3613.md .color-white .button.tab-link-active {
3614 background-color: #ffffff;
3615 color: #fff;
3616}
3617.md .color-theme-white .button.button-fill.active-state,
3618.md .color-white .button.button-fill.active-state,
3619.md .color-theme-white .button.button-fill-md.active-state,
3620.md .color-white .button.button-fill-md.active-state,
3621.md .color-theme-white .button.button-active.active-state,
3622.md .color-white .button.button-active.active-state,
3623.md .color-theme-white .button.tab-link-active.active-state,
3624.md .color-white .button.tab-link-active.active-state {
3625 background: #ebebeb;
3626}
3627.md .color-theme-white .button.button-outline,
3628.md .color-white .button.button-outline {
3629 border-color: #ffffff;
3630}
3631.md .color-theme-black .button,
3632.md .color-black .button {
3633 color: #000000;
3634}
3635.md .color-theme-black .button.button-fill,
3636.md .color-black .button.button-fill,
3637.md .color-theme-black .button.button-fill-md,
3638.md .color-black .button.button-fill-md,
3639.md .color-theme-black .button.button-active,
3640.md .color-black .button.button-active,
3641.md .color-theme-black .button.tab-link-active,
3642.md .color-black .button.tab-link-active {
3643 background-color: #000000;
3644 color: #fff;
3645}
3646.md .color-theme-black .button.button-fill.active-state,
3647.md .color-black .button.button-fill.active-state,
3648.md .color-theme-black .button.button-fill-md.active-state,
3649.md .color-black .button.button-fill-md.active-state,
3650.md .color-theme-black .button.button-active.active-state,
3651.md .color-black .button.button-active.active-state,
3652.md .color-theme-black .button.tab-link-active.active-state,
3653.md .color-black .button.tab-link-active.active-state {
3654 background: #000000;
3655}
3656.md .color-theme-black .button.button-outline,
3657.md .color-black .button.button-outline {
3658 border-color: #000000;
3659}
3660.md .button.color-red {
3661 color: #f44336;
3662}
3663.md .button.color-red.button-fill,
3664.md .button.color-red.button-fill-md,
3665.md .button.color-red.button-active,
3666.md .button.color-red.tab-link-active {
3667 background-color: #f44336;
3668 color: #fff;
3669}
3670.md .button.color-red.button-fill.active-state,
3671.md .button.color-red.button-fill-md.active-state,
3672.md .button.color-red.button-active.active-state,
3673.md .button.color-red.tab-link-active.active-state {
3674 background: #f21f0f;
3675}
3676.md .button.color-red.button-outline {
3677 border-color: #f44336;
3678}
3679.md .button.color-green {
3680 color: #4caf50;
3681}
3682.md .button.color-green.button-fill,
3683.md .button.color-green.button-fill-md,
3684.md .button.color-green.button-active,
3685.md .button.color-green.tab-link-active {
3686 background-color: #4caf50;
3687 color: #fff;
3688}
3689.md .button.color-green.button-fill.active-state,
3690.md .button.color-green.button-fill-md.active-state,
3691.md .button.color-green.button-active.active-state,
3692.md .button.color-green.tab-link-active.active-state {
3693 background: #409343;
3694}
3695.md .button.color-green.button-outline {
3696 border-color: #4caf50;
3697}
3698.md .button.color-blue {
3699 color: #2196f3;
3700}
3701.md .button.color-blue.button-fill,
3702.md .button.color-blue.button-fill-md,
3703.md .button.color-blue.button-active,
3704.md .button.color-blue.tab-link-active {
3705 background-color: #2196f3;
3706 color: #fff;
3707}
3708.md .button.color-blue.button-fill.active-state,
3709.md .button.color-blue.button-fill-md.active-state,
3710.md .button.color-blue.button-active.active-state,
3711.md .button.color-blue.tab-link-active.active-state {
3712 background: #0c82df;
3713}
3714.md .button.color-blue.button-outline {
3715 border-color: #2196f3;
3716}
3717.md .button.color-pink {
3718 color: #e91e63;
3719}
3720.md .button.color-pink.button-fill,
3721.md .button.color-pink.button-fill-md,
3722.md .button.color-pink.button-active,
3723.md .button.color-pink.tab-link-active {
3724 background-color: #e91e63;
3725 color: #fff;
3726}
3727.md .button.color-pink.button-fill.active-state,
3728.md .button.color-pink.button-fill-md.active-state,
3729.md .button.color-pink.button-active.active-state,
3730.md .button.color-pink.tab-link-active.active-state {
3731 background: #ca1452;
3732}
3733.md .button.color-pink.button-outline {
3734 border-color: #e91e63;
3735}
3736.md .button.color-yellow {
3737 color: #ffeb3b;
3738}
3739.md .button.color-yellow.button-fill,
3740.md .button.color-yellow.button-fill-md,
3741.md .button.color-yellow.button-active,
3742.md .button.color-yellow.tab-link-active {
3743 background-color: #ffeb3b;
3744 color: #fff;
3745}
3746.md .button.color-yellow.button-fill.active-state,
3747.md .button.color-yellow.button-fill-md.active-state,
3748.md .button.color-yellow.button-active.active-state,
3749.md .button.color-yellow.tab-link-active.active-state {
3750 background: #ffe712;
3751}
3752.md .button.color-yellow.button-outline {
3753 border-color: #ffeb3b;
3754}
3755.md .button.color-orange {
3756 color: #ff9800;
3757}
3758.md .button.color-orange.button-fill,
3759.md .button.color-orange.button-fill-md,
3760.md .button.color-orange.button-active,
3761.md .button.color-orange.tab-link-active {
3762 background-color: #ff9800;
3763 color: #fff;
3764}
3765.md .button.color-orange.button-fill.active-state,
3766.md .button.color-orange.button-fill-md.active-state,
3767.md .button.color-orange.button-active.active-state,
3768.md .button.color-orange.tab-link-active.active-state {
3769 background: #d68000;
3770}
3771.md .button.color-orange.button-outline {
3772 border-color: #ff9800;
3773}
3774.md .button.color-gray {
3775 color: #9e9e9e;
3776}
3777.md .button.color-gray.button-fill,
3778.md .button.color-gray.button-fill-md,
3779.md .button.color-gray.button-active,
3780.md .button.color-gray.tab-link-active {
3781 background-color: #9e9e9e;
3782 color: #fff;
3783}
3784.md .button.color-gray.button-fill.active-state,
3785.md .button.color-gray.button-fill-md.active-state,
3786.md .button.color-gray.button-active.active-state,
3787.md .button.color-gray.tab-link-active.active-state {
3788 background: #8a8a8a;
3789}
3790.md .button.color-gray.button-outline {
3791 border-color: #9e9e9e;
3792}
3793.md .button.color-white {
3794 color: #ffffff;
3795}
3796.md .button.color-white.button-fill,
3797.md .button.color-white.button-fill-md,
3798.md .button.color-white.button-active,
3799.md .button.color-white.tab-link-active {
3800 background-color: #ffffff;
3801 color: #fff;
3802}
3803.md .button.color-white.button-fill.active-state,
3804.md .button.color-white.button-fill-md.active-state,
3805.md .button.color-white.button-active.active-state,
3806.md .button.color-white.tab-link-active.active-state {
3807 background: #ebebeb;
3808}
3809.md .button.color-white.button-outline {
3810 border-color: #ffffff;
3811}
3812.md .button.color-black {
3813 color: #000000;
3814}
3815.md .button.color-black.button-fill,
3816.md .button.color-black.button-fill-md,
3817.md .button.color-black.button-active,
3818.md .button.color-black.tab-link-active {
3819 background-color: #000000;
3820 color: #fff;
3821}
3822.md .button.color-black.button-fill.active-state,
3823.md .button.color-black.button-fill-md.active-state,
3824.md .button.color-black.button-active.active-state,
3825.md .button.color-black.tab-link-active.active-state {
3826 background: #000000;
3827}
3828.md .button.color-black.button-outline {
3829 border-color: #000000;
3830}
3831/* === Touch Ripple === */
3832.md .ripple,
3833.md .fab a,
3834.md a.link,
3835.md a.item-link,
3836.md .button,
3837.md .dialog-button,
3838.md .tab-link,
3839.md .radio,
3840.md .checkbox,
3841.md .actions-button,
3842.md .speed-dial-buttons a {
3843 -webkit-user-select: none;
3844 -moz-user-select: none;
3845 -ms-user-select: none;
3846 user-select: none;
3847}
3848.md .ripple-wave {
3849 left: 0;
3850 top: 0;
3851 position: absolute !important;
3852 border-radius: 50%;
3853 pointer-events: none;
3854 z-index: -1;
3855 background: rgba(0, 0, 0, 0.1);
3856 padding: 0;
3857 margin: 0;
3858 font-size: 0;
3859 -webkit-transform: translate3d(0px, 0px, 0) scale(0);
3860 transform: translate3d(0px, 0px, 0) scale(0);
3861 -webkit-transition-duration: 1400ms;
3862 transition-duration: 1400ms;
3863}
3864.md .ripple-wave.ripple-wave-fill {
3865 -webkit-transition-duration: 300ms;
3866 transition-duration: 300ms;
3867 opacity: 0.35;
3868}
3869.md .ripple-wave.ripple-wave-out {
3870 -webkit-transition-duration: 600ms;
3871 transition-duration: 600ms;
3872 opacity: 0;
3873}
3874.button-fill .md .ripple-wave,
3875.picker-calendar-day .md .ripple-wave {
3876 z-index: 1;
3877}
3878.md .button-fill .ripple-wave,
3879.md .button-active .ripple-wave,
3880.md .navbar .ripple-wave,
3881.md .toolbar .ripple-wave,
3882.md .subnavbar .ripple-wave,
3883.md .toast .ripple-wave,
3884.md .fab a .ripple-wave,
3885.md .stepper-fill .ripple-wave {
3886 background: rgba(255, 255, 255, 0.3);
3887}
3888.md .messagebar .ripple-wave,
3889.md .searchbar .ripple-wave {
3890 background: rgba(0, 0, 0, 0.1);
3891}
3892.md .data-table .sortable-cell .ripple-wave {
3893 z-index: 0;
3894}
3895.md .checkbox .ripple-wave,
3896.md .radio .ripple-wave {
3897 background: rgba(33, 150, 243, 0.5);
3898 z-index: 0;
3899}
3900.md .theme-dark .page-content .ripple-wave,
3901.md .theme-dark .messagebar .ripple-wave,
3902.md .theme-dark .popover .ripple-wave,
3903.md .theme-dark .calendar .ripple-wave,
3904.calendar.md .theme-dark .ripple-wave {
3905 background-color: rgba(255, 255, 255, 0.3);
3906}
3907.md .ripple-color-red .ripple-wave,
3908.md .ripple-red .ripple-wave {
3909 background-color: rgba(244, 67, 54, 0.3);
3910}
3911.md .ripple-color-green .ripple-wave,
3912.md .ripple-green .ripple-wave {
3913 background-color: rgba(76, 175, 80, 0.3);
3914}
3915.md .ripple-color-blue .ripple-wave,
3916.md .ripple-blue .ripple-wave {
3917 background-color: rgba(33, 150, 243, 0.3);
3918}
3919.md .ripple-color-pink .ripple-wave,
3920.md .ripple-pink .ripple-wave {
3921 background-color: rgba(233, 30, 99, 0.3);
3922}
3923.md .ripple-color-yellow .ripple-wave,
3924.md .ripple-yellow .ripple-wave {
3925 background-color: rgba(255, 235, 59, 0.3);
3926}
3927.md .ripple-color-orange .ripple-wave,
3928.md .ripple-orange .ripple-wave {
3929 background-color: rgba(255, 152, 0, 0.3);
3930}
3931.md .ripple-color-gray .ripple-wave,
3932.md .ripple-gray .ripple-wave {
3933 background-color: rgba(158, 158, 158, 0.3);
3934}
3935.md .ripple-color-white .ripple-wave,
3936.md .ripple-white .ripple-wave {
3937 background-color: rgba(255, 255, 255, 0.3);
3938}
3939.md .ripple-color-black .ripple-wave,
3940.md .ripple-black .ripple-wave {
3941 background-color: rgba(0, 0, 0, 0.3);
3942}
3943/* === Icon === */
3944i.icon {
3945 display: inline-block;
3946 vertical-align: middle;
3947 background-size: 100% auto;
3948 background-position: center;
3949 background-repeat: no-repeat;
3950 font-style: normal;
3951 position: relative;
3952}
3953.md .icon-back {
3954 width: 24px;
3955 height: 24px;
3956}
3957.md .icon-forward {
3958 width: 24px;
3959 height: 24px;
3960}
3961.md .icon-next,
3962.md .icon-prev {
3963 width: 24px;
3964 height: 24px;
3965}
3966.md .item-media .icon {
3967 color: #737373;
3968}
3969.md .item-media .material-icons {
3970 font-size: 24px;
3971 width: 24px;
3972 height: 24px;
3973}
3974.md .icon-back {
3975 background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M20%2011H7.83l5.59-5.59L12%204l-8%208%208%208%201.41-1.41L7.83%2013H20v-2z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E");
3976}
3977.md .icon-forward {
3978 background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M12%204l-1.41%201.41L16.17%2011H4v2h12.17l-5.58%205.59L12%2020l8-8z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E");
3979}
3980.md .icon-next {
3981 background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%23ffffff'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M10%206L8.59%207.41%2013.17%2012l-4.58%204.59L10%2018l6-6z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E");
3982}
3983.md .icon-prev {
3984 background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%23ffffff'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M15.41%207.41L14%206l-6%206%206%206%201.41-1.41L10.83%2012z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E");
3985}
3986.md .icon-back.color-red,
3987.md a.link .color-red .icon-back {
3988 background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M20%2011H7.83l5.59-5.59L12%204l-8%208%208%208%201.41-1.41L7.83%2013H20v-2z'%20fill%3D'%23f44336'%2F%3E%3C%2Fsvg%3E");
3989}
3990.md .icon-forward.color-red,
3991.md a.link .color-red .icon-forward {
3992 background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M12%204l-1.41%201.41L16.17%2011H4v2h12.17l-5.58%205.59L12%2020l8-8z'%20fill%3D'%23f44336'%2F%3E%3C%2Fsvg%3E");
3993}
3994.md .icon-next.color-red,
3995.md a.link .color-red .icon-next {
3996 background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%23f44336'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M10%206L8.59%207.41%2013.17%2012l-4.58%204.59L10%2018l6-6z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E");
3997}
3998.md .icon-prev.color-red,
3999.md a.link .color-red .icon-prev {
4000 background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%23f44336'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M15.41%207.41L14%206l-6%206%206%206%201.41-1.41L10.83%2012z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E");
4001}
4002.md .icon-back.color-green,
4003.md a.link .color-green .icon-back {
4004 background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M20%2011H7.83l5.59-5.59L12%204l-8%208%208%208%201.41-1.41L7.83%2013H20v-2z'%20fill%3D'%234caf50'%2F%3E%3C%2Fsvg%3E");
4005}
4006.md .icon-forward.color-green,
4007.md a.link .color-green .icon-forward {
4008 background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M12%204l-1.41%201.41L16.17%2011H4v2h12.17l-5.58%205.59L12%2020l8-8z'%20fill%3D'%234caf50'%2F%3E%3C%2Fsvg%3E");
4009}
4010.md .icon-next.color-green,
4011.md a.link .color-green .icon-next {
4012 background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%234caf50'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M10%206L8.59%207.41%2013.17%2012l-4.58%204.59L10%2018l6-6z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E");
4013}
4014.md .icon-prev.color-green,
4015.md a.link .color-green .icon-prev {
4016 background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%234caf50'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M15.41%207.41L14%206l-6%206%206%206%201.41-1.41L10.83%2012z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E");
4017}
4018.md .icon-back.color-blue,
4019.md a.link .color-blue .icon-back {
4020 background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M20%2011H7.83l5.59-5.59L12%204l-8%208%208%208%201.41-1.41L7.83%2013H20v-2z'%20fill%3D'%232196f3'%2F%3E%3C%2Fsvg%3E");
4021}
4022.md .icon-forward.color-blue,
4023.md a.link .color-blue .icon-forward {
4024 background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M12%204l-1.41%201.41L16.17%2011H4v2h12.17l-5.58%205.59L12%2020l8-8z'%20fill%3D'%232196f3'%2F%3E%3C%2Fsvg%3E");
4025}
4026.md .icon-next.color-blue,
4027.md a.link .color-blue .icon-next {
4028 background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%232196f3'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M10%206L8.59%207.41%2013.17%2012l-4.58%204.59L10%2018l6-6z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E");
4029}
4030.md .icon-prev.color-blue,
4031.md a.link .color-blue .icon-prev {
4032 background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%232196f3'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M15.41%207.41L14%206l-6%206%206%206%201.41-1.41L10.83%2012z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E");
4033}
4034.md .icon-back.color-pink,
4035.md a.link .color-pink .icon-back {
4036 background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M20%2011H7.83l5.59-5.59L12%204l-8%208%208%208%201.41-1.41L7.83%2013H20v-2z'%20fill%3D'%23e91e63'%2F%3E%3C%2Fsvg%3E");
4037}
4038.md .icon-forward.color-pink,
4039.md a.link .color-pink .icon-forward {
4040 background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M12%204l-1.41%201.41L16.17%2011H4v2h12.17l-5.58%205.59L12%2020l8-8z'%20fill%3D'%23e91e63'%2F%3E%3C%2Fsvg%3E");
4041}
4042.md .icon-next.color-pink,
4043.md a.link .color-pink .icon-next {
4044 background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%23e91e63'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M10%206L8.59%207.41%2013.17%2012l-4.58%204.59L10%2018l6-6z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E");
4045}
4046.md .icon-prev.color-pink,
4047.md a.link .color-pink .icon-prev {
4048 background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%23e91e63'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M15.41%207.41L14%206l-6%206%206%206%201.41-1.41L10.83%2012z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E");
4049}
4050.md .icon-back.color-yellow,
4051.md a.link .color-yellow .icon-back {
4052 background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M20%2011H7.83l5.59-5.59L12%204l-8%208%208%208%201.41-1.41L7.83%2013H20v-2z'%20fill%3D'%23ffeb3b'%2F%3E%3C%2Fsvg%3E");
4053}
4054.md .icon-forward.color-yellow,
4055.md a.link .color-yellow .icon-forward {
4056 background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M12%204l-1.41%201.41L16.17%2011H4v2h12.17l-5.58%205.59L12%2020l8-8z'%20fill%3D'%23ffeb3b'%2F%3E%3C%2Fsvg%3E");
4057}
4058.md .icon-next.color-yellow,
4059.md a.link .color-yellow .icon-next {
4060 background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%23ffeb3b'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M10%206L8.59%207.41%2013.17%2012l-4.58%204.59L10%2018l6-6z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E");
4061}
4062.md .icon-prev.color-yellow,
4063.md a.link .color-yellow .icon-prev {
4064 background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%23ffeb3b'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M15.41%207.41L14%206l-6%206%206%206%201.41-1.41L10.83%2012z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E");
4065}
4066.md .icon-back.color-orange,
4067.md a.link .color-orange .icon-back {
4068 background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M20%2011H7.83l5.59-5.59L12%204l-8%208%208%208%201.41-1.41L7.83%2013H20v-2z'%20fill%3D'%23ff9800'%2F%3E%3C%2Fsvg%3E");
4069}
4070.md .icon-forward.color-orange,
4071.md a.link .color-orange .icon-forward {
4072 background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M12%204l-1.41%201.41L16.17%2011H4v2h12.17l-5.58%205.59L12%2020l8-8z'%20fill%3D'%23ff9800'%2F%3E%3C%2Fsvg%3E");
4073}
4074.md .icon-next.color-orange,
4075.md a.link .color-orange .icon-next {
4076 background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%23ff9800'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M10%206L8.59%207.41%2013.17%2012l-4.58%204.59L10%2018l6-6z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E");
4077}
4078.md .icon-prev.color-orange,
4079.md a.link .color-orange .icon-prev {
4080 background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%23ff9800'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M15.41%207.41L14%206l-6%206%206%206%201.41-1.41L10.83%2012z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E");
4081}
4082.md .icon-back.color-gray,
4083.md a.link .color-gray .icon-back {
4084 background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M20%2011H7.83l5.59-5.59L12%204l-8%208%208%208%201.41-1.41L7.83%2013H20v-2z'%20fill%3D'%239e9e9e'%2F%3E%3C%2Fsvg%3E");
4085}
4086.md .icon-forward.color-gray,
4087.md a.link .color-gray .icon-forward {
4088 background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M12%204l-1.41%201.41L16.17%2011H4v2h12.17l-5.58%205.59L12%2020l8-8z'%20fill%3D'%239e9e9e'%2F%3E%3C%2Fsvg%3E");
4089}
4090.md .icon-next.color-gray,
4091.md a.link .color-gray .icon-next {
4092 background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%239e9e9e'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M10%206L8.59%207.41%2013.17%2012l-4.58%204.59L10%2018l6-6z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E");
4093}
4094.md .icon-prev.color-gray,
4095.md a.link .color-gray .icon-prev {
4096 background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%239e9e9e'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M15.41%207.41L14%206l-6%206%206%206%201.41-1.41L10.83%2012z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E");
4097}
4098.md .icon-back.color-white,
4099.md a.link .color-white .icon-back {
4100 background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M20%2011H7.83l5.59-5.59L12%204l-8%208%208%208%201.41-1.41L7.83%2013H20v-2z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E");
4101}
4102.md .icon-forward.color-white,
4103.md a.link .color-white .icon-forward {
4104 background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M12%204l-1.41%201.41L16.17%2011H4v2h12.17l-5.58%205.59L12%2020l8-8z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E");
4105}
4106.md .icon-next.color-white,
4107.md a.link .color-white .icon-next {
4108 background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%23ffffff'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M10%206L8.59%207.41%2013.17%2012l-4.58%204.59L10%2018l6-6z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E");
4109}
4110.md .icon-prev.color-white,
4111.md a.link .color-white .icon-prev {
4112 background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%23ffffff'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M15.41%207.41L14%206l-6%206%206%206%201.41-1.41L10.83%2012z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E");
4113}
4114.md .icon-back.color-black,
4115.md a.link .color-black .icon-back {
4116 background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M20%2011H7.83l5.59-5.59L12%204l-8%208%208%208%201.41-1.41L7.83%2013H20v-2z'%20fill%3D'%23000000'%2F%3E%3C%2Fsvg%3E");
4117}
4118.md .icon-forward.color-black,
4119.md a.link .color-black .icon-forward {
4120 background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M12%204l-1.41%201.41L16.17%2011H4v2h12.17l-5.58%205.59L12%2020l8-8z'%20fill%3D'%23000000'%2F%3E%3C%2Fsvg%3E");
4121}
4122.md .icon-next.color-black,
4123.md a.link .color-black .icon-next {
4124 background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%23000000'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M10%206L8.59%207.41%2013.17%2012l-4.58%204.59L10%2018l6-6z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E");
4125}
4126.md .icon-prev.color-black,
4127.md a.link .color-black .icon-prev {
4128 background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%23000000'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M15.41%207.41L14%206l-6%206%206%206%201.41-1.41L10.83%2012z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E");
4129}
4130.md .icon.color-red {
4131 color: #f44336;
4132}
4133.md .icon.color-green {
4134 color: #4caf50;
4135}
4136.md .icon.color-blue {
4137 color: #2196f3;
4138}
4139.md .icon.color-pink {
4140 color: #e91e63;
4141}
4142.md .icon.color-yellow {
4143 color: #ffeb3b;
4144}
4145.md .icon.color-orange {
4146 color: #ff9800;
4147}
4148.md .icon.color-gray {
4149 color: #9e9e9e;
4150}
4151.md .icon.color-white {
4152 color: #ffffff;
4153}
4154.md .icon.color-black {
4155 color: #000000;
4156}
4157.custom-modal-backdrop {
4158 position: absolute;
4159 left: 0;
4160 top: 0;
4161 width: 100%;
4162 height: 100%;
4163 background: rgba(0, 0, 0, 0.4);
4164 z-index: 13000;
4165 visibility: hidden;
4166 opacity: 0;
4167 -webkit-transition-duration: 400ms;
4168 transition-duration: 400ms;
4169 z-index: 10500;
4170}
4171.custom-modal-backdrop.not-animated {
4172 -webkit-transition-duration: 0ms;
4173 transition-duration: 0ms;
4174}
4175.custom-modal-backdrop.backdrop-in {
4176 visibility: visible;
4177 opacity: 1;
4178}
4179/* === Dialog === */
4180.dialog-backdrop {
4181 position: absolute;
4182 left: 0;
4183 top: 0;
4184 width: 100%;
4185 height: 100%;
4186 background: rgba(0, 0, 0, 0.4);
4187 z-index: 13000;
4188 visibility: hidden;
4189 opacity: 0;
4190 -webkit-transition-duration: 400ms;
4191 transition-duration: 400ms;
4192}
4193.dialog-backdrop.not-animated {
4194 -webkit-transition-duration: 0ms;
4195 transition-duration: 0ms;
4196}
4197.dialog-backdrop.backdrop-in {
4198 visibility: visible;
4199 opacity: 1;
4200}
4201.dialog {
4202 position: absolute;
4203 z-index: 13500;
4204 left: 50%;
4205 margin-top: 0;
4206 top: 50%;
4207 overflow: hidden;
4208 opacity: 0;
4209 -webkit-transform: translate3d(0, 0, 0) scale(1.185);
4210 transform: translate3d(0, 0, 0) scale(1.185);
4211 -webkit-transition-property: opacity, -webkit-transform;
4212 transition-property: opacity, -webkit-transform;
4213 transition-property: transform, opacity;
4214 transition-property: transform, opacity, -webkit-transform;
4215 display: none;
4216 -webkit-transition-duration: 400ms;
4217 transition-duration: 400ms;
4218}
4219.dialog.modal-in {
4220 opacity: 1;
4221 -webkit-transform: translate3d(0, 0, 0) scale(1);
4222 transform: translate3d(0, 0, 0) scale(1);
4223}
4224.dialog.modal-out {
4225 opacity: 0;
4226 z-index: 13499;
4227}
4228.dialog.not-animated {
4229 -webkit-transition-duration: 0ms;
4230 transition-duration: 0ms;
4231}
4232.dialog-inner {
4233 position: relative;
4234}
4235.dialog-title {
4236 font-weight: 500;
4237}
4238.dialog-buttons {
4239 position: relative;
4240 display: -webkit-box;
4241 display: -webkit-flex;
4242 display: -ms-flexbox;
4243 display: flex;
4244}
4245.dialog-buttons-vertical .dialog-buttons {
4246 display: block;
4247 height: auto !important;
4248}
4249.dialog-no-buttons .dialog-buttons {
4250 display: none;
4251}
4252.dialog-input-field {
4253 position: relative;
4254}
4255.dialog-input-field .item-input-wrap {
4256 margin: 0;
4257 padding: 0;
4258}
4259.dialog-input {
4260 -webkit-box-sizing: border-box;
4261 box-sizing: border-box;
4262 margin: 0;
4263 margin-top: 15px;
4264 border-radius: 0;
4265 -webkit-appearance: none;
4266 -moz-appearance: none;
4267 appearance: none;
4268 width: 100%;
4269 display: block;
4270 font-family: inherit;
4271 -webkit-box-shadow: none;
4272 box-shadow: none;
4273}
4274html.with-modal-dialog .page-content {
4275 overflow: hidden;
4276 -webkit-overflow-scrolling: auto;
4277}
4278.md .dialog {
4279 width: 280px;
4280 margin-left: -140px;
4281 border-radius: 4px;
4282 color: #757575;
4283 background: #fff;
4284 font-size: 16px;
4285 -webkit-box-shadow: 0px 11px 15px -7px rgba(0, 0, 0, 0.2), 0px 24px 38px 3px rgba(0, 0, 0, 0.14), 0px 9px 46px 8px rgba(0, 0, 0, 0.12);
4286 box-shadow: 0px 11px 15px -7px rgba(0, 0, 0, 0.2), 0px 24px 38px 3px rgba(0, 0, 0, 0.14), 0px 9px 46px 8px rgba(0, 0, 0, 0.12);
4287}
4288.md .dialog.modal-in {
4289 opacity: 1;
4290 -webkit-transform: translate3d(0, 0, 0) scale(1);
4291 transform: translate3d(0, 0, 0) scale(1);
4292}
4293.md .dialog.modal-out {
4294 opacity: 0;
4295 z-index: 13499;
4296 -webkit-transform: translate3d(0, 0, 0) scale(0.815);
4297 transform: translate3d(0, 0, 0) scale(0.815);
4298}
4299.md .dialog-inner {
4300 padding: 24px 24px 20px;
4301}
4302.md .dialog-title {
4303 font-size: 20px;
4304 color: #212121;
4305 line-height: 1.3;
4306}
4307.md .dialog-title + .dialog-text {
4308 margin-top: 20px;
4309}
4310.md .dialog-text {
4311 line-height: 1.5;
4312}
4313.md .dialog-buttons {
4314 height: 48px;
4315 padding: 6px 8px;
4316 overflow: hidden;
4317 -webkit-box-sizing: border-box;
4318 box-sizing: border-box;
4319 -webkit-box-pack: end;
4320 -webkit-justify-content: flex-end;
4321 -ms-flex-pack: end;
4322 justify-content: flex-end;
4323}
4324.md .dialog-buttons-vertical .dialog-buttons {
4325 padding: 0 0 8px 0;
4326}
4327.md .dialog-buttons-vertical .dialog-buttons .dialog-button {
4328 margin-left: 0;
4329 text-align: right;
4330 height: 48px;
4331 line-height: 48px;
4332 border-radius: 0;
4333 padding-left: 16px;
4334 padding-right: 16px;
4335}
4336.md .dialog-button {
4337 text-decoration: none;
4338 text-align: center;
4339 display: block;
4340 -webkit-appearance: none;
4341 -moz-appearance: none;
4342 appearance: none;
4343 background: none;
4344 padding: 0 10px;
4345 margin: 0;
4346 white-space: nowrap;
4347 text-overflow: ellipsis;
4348 font-size: 14px;
4349 position: relative;
4350 overflow: hidden;
4351 font-family: inherit;
4352 cursor: pointer;
4353 outline: 0;
4354 -webkit-box-sizing: border-box;
4355 box-sizing: border-box;
4356 vertical-align: middle;
4357 color: #2196f3;
4358 border-radius: 4px;
4359 line-height: 36px;
4360 height: 36px;
4361 text-transform: uppercase;
4362 min-width: 64px;
4363 padding: 0 8px;
4364 border: none;
4365 -webkit-transition-duration: 300ms;
4366 transition-duration: 300ms;
4367 -webkit-transform: translate3d(0, 0, 0);
4368 transform: translate3d(0, 0, 0);
4369 letter-spacing: 0.03em;
4370 font-weight: 500;
4371}
4372input[type="submit"].md .dialog-button,
4373input[type="button"].md .dialog-button {
4374 width: 100%;
4375}
4376.md .dialog-button.active-state {
4377 background: rgba(0, 0, 0, 0.1);
4378}
4379.md .dialog-button.dialog-button-bold {
4380 font-weight: 700;
4381}
4382.md .dialog-button + .dialog-button {
4383 margin-left: 4px;
4384}
4385.md .dialog-input {
4386 height: 36px;
4387 padding: 0;
4388 border: none;
4389 font-size: 16px;
4390 -webkit-transition-duration: 200ms;
4391 transition-duration: 200ms;
4392 position: relative;
4393}
4394.md .dialog-input::-webkit-input-placeholder {
4395 color: rgba(0, 0, 0, 0.35);
4396}
4397.md .dialog-input:-ms-input-placeholder {
4398 color: rgba(0, 0, 0, 0.35);
4399}
4400.md .dialog-input::-ms-input-placeholder {
4401 color: rgba(0, 0, 0, 0.35);
4402}
4403.md .dialog-input::placeholder {
4404 color: rgba(0, 0, 0, 0.35);
4405}
4406.md .dialog-input + .dialog-input {
4407 margin-top: 16px;
4408}
4409.md .dialog-preloader .dialog-title,
4410.md .dialog-progress .dialog-title,
4411.md .dialog-preloader .dialog-inner,
4412.md .dialog-progress .dialog-inner {
4413 text-align: center;
4414}
4415.md .dialog-preloader .dialog-title ~ .preloader,
4416.md .dialog-preloader .dialog-text ~ .preloader {
4417 margin-top: 20px;
4418}
4419.md .dialog-progress .dialog-title ~ .progressbar,
4420.md .dialog-progress .dialog-text ~ .progressbar,
4421.md .dialog-progress .dialog-title ~ .progressbar-infinite,
4422.md .dialog-progress .dialog-text ~ .progressbar-infinite {
4423 margin-top: 16px;
4424}
4425.md .dialog-button.color-red {
4426 color: #f44336;
4427}
4428.md .dialog-button.color-green {
4429 color: #4caf50;
4430}
4431.md .dialog-button.color-blue {
4432 color: #2196f3;
4433}
4434.md .dialog-button.color-pink {
4435 color: #e91e63;
4436}
4437.md .dialog-button.color-yellow {
4438 color: #ffeb3b;
4439}
4440.md .dialog-button.color-orange {
4441 color: #ff9800;
4442}
4443.md .dialog-button.color-gray {
4444 color: #9e9e9e;
4445}
4446.md .dialog-button.color-white {
4447 color: #ffffff;
4448}
4449.md .dialog-button.color-black {
4450 color: #000000;
4451}
4452/* === Popup === */
4453.popup-backdrop {
4454 position: absolute;
4455 left: 0;
4456 top: 0;
4457 width: 100%;
4458 height: 100%;
4459 background: rgba(0, 0, 0, 0.4);
4460 z-index: 13000;
4461 visibility: hidden;
4462 opacity: 0;
4463 -webkit-transition-duration: 400ms;
4464 transition-duration: 400ms;
4465 z-index: 10500;
4466}
4467.popup-backdrop.not-animated {
4468 -webkit-transition-duration: 0ms;
4469 transition-duration: 0ms;
4470}
4471.popup-backdrop.backdrop-in {
4472 visibility: visible;
4473 opacity: 1;
4474}
4475.popup {
4476 position: absolute;
4477 left: 0;
4478 top: 0;
4479 width: 100%;
4480 height: 100%;
4481 display: none;
4482 -webkit-box-sizing: border-box;
4483 box-sizing: border-box;
4484 -webkit-transition-property: -webkit-transform;
4485 transition-property: -webkit-transform;
4486 transition-property: transform;
4487 transition-property: transform, -webkit-transform;
4488 -webkit-transform: translate3d(0, 100%, 0);
4489 transform: translate3d(0, 100%, 0);
4490 background: #fff;
4491 z-index: 11000;
4492}
4493.popup.modal-in,
4494.popup.modal-out {
4495 -webkit-transition-duration: 400ms;
4496 transition-duration: 400ms;
4497}
4498.popup.not-animated {
4499 -webkit-transition-duration: 0ms;
4500 transition-duration: 0ms;
4501}
4502.popup.modal-in {
4503 display: block;
4504 -webkit-transform: translate3d(0, 0, 0);
4505 transform: translate3d(0, 0, 0);
4506}
4507.popup.modal-out {
4508 -webkit-transform: translate3d(0, 100%, 0);
4509 transform: translate3d(0, 100%, 0);
4510}
4511@media (min-width: 630px) and (min-height: 630px) {
4512 .popup:not(.popup-tablet-fullscreen) {
4513 width: 630px;
4514 height: 630px;
4515 left: 50%;
4516 top: 50%;
4517 margin-left: -315px;
4518 margin-top: -315px;
4519 -webkit-transform: translate3d(0, 100vh, 0);
4520 transform: translate3d(0, 100vh, 0);
4521 }
4522 .popup:not(.popup-tablet-fullscreen).modal-in {
4523 -webkit-transform: translate3d(0, 0, 0);
4524 transform: translate3d(0, 0, 0);
4525 }
4526 .popup:not(.popup-tablet-fullscreen).modal-out {
4527 -webkit-transform: translate3d(0, 100vh, 0);
4528 transform: translate3d(0, 100vh, 0);
4529 }
4530}
4531@media (max-width: 629px), (max-height: 629px) {
4532 html.with-statusbar .popup-backdrop {
4533 z-index: 9500;
4534 }
4535 html.with-statusbar.device-ios .popup,
4536 html.with-statusbar.ios:not(.device-ios):not(.device-android) .popup {
4537 height: calc(100% - 20px);
4538 top: 20px;
4539 }
4540 html.with-statusbar.device-iphone-x .popup {
4541 height: calc(100% - constant(safe-area-inset-top));
4542 height: calc(100% - env(safe-area-inset-top));
4543 top: constant(safe-area-inset-top);
4544 top: env(safe-area-inset-top);
4545 }
4546 html.with-statusbar.device-android .popup,
4547 html.with-statusbar.md:not(.device-ios):not(.device-android) .popup {
4548 height: calc(100% - 24px);
4549 top: 24px;
4550 }
4551}
4552@media (min-width: 630px), (min-height: 630px) {
4553 html.with-statusbar.device-ios .popup-tablet-fullscreen,
4554 html.with-statusbar.ios:not(.device-ios):not(.device-android) .popup-tablet-fullscreen {
4555 height: calc(100% - 20px);
4556 top: 20px;
4557 }
4558 html.with-statusbar.device-iphone-x .popup-tablet-fullscreen {
4559 height: calc(100% - constant(safe-area-inset-top));
4560 height: calc(100% - env(safe-area-inset-top));
4561 top: constant(safe-area-inset-top);
4562 top: env(safe-area-inset-top);
4563 }
4564 html.with-statusbar.device-android .popup-tablet-fullscreen,
4565 html.with-statusbar.md:not(.device-ios):not(.device-android) .popup-tablet-fullscreen {
4566 height: calc(100% - 24px);
4567 top: 24px;
4568 }
4569}
4570html.with-modal-popup .framework7-root > .views .page-content,
4571html.with-modal-popup .framework7-root > .view .page-content,
4572html.with-modal-popup .framework7-root > .panel .page-content {
4573 overflow: hidden;
4574 -webkit-overflow-scrolling: auto;
4575}
4576@media (min-width: 630px) and (min-height: 630px) {
4577 .md .popup:not(.popup-tablet-fullscreen) {
4578 -webkit-box-shadow: 0px 20px 44px rgba(0, 0, 0, 0.5);
4579 box-shadow: 0px 20px 44px rgba(0, 0, 0, 0.5);
4580 }
4581}
4582/* === Login Screen === */
4583.login-screen {
4584 position: absolute;
4585 left: 0;
4586 top: 0;
4587 width: 100%;
4588 height: 100%;
4589 display: none;
4590 -webkit-box-sizing: border-box;
4591 box-sizing: border-box;
4592 -webkit-transition-property: -webkit-transform;
4593 transition-property: -webkit-transform;
4594 transition-property: transform;
4595 transition-property: transform, -webkit-transform;
4596 -webkit-transform: translate3d(0, 100%, 0);
4597 transform: translate3d(0, 100%, 0);
4598 background: #fff;
4599 z-index: 11000;
4600}
4601.login-screen.modal-in,
4602.login-screen.modal-out {
4603 -webkit-transition-duration: 400ms;
4604 transition-duration: 400ms;
4605}
4606.login-screen.not-animated {
4607 -webkit-transition-duration: 0ms;
4608 transition-duration: 0ms;
4609}
4610.login-screen.modal-in {
4611 display: block;
4612 -webkit-transform: translate3d(0, 0, 0);
4613 transform: translate3d(0, 0, 0);
4614}
4615.login-screen.modal-out {
4616 -webkit-transform: translate3d(0, 100%, 0);
4617 transform: translate3d(0, 100%, 0);
4618}
4619html.with-statusbar.device-ios .login-screen,
4620html.with-statusbar.ios:not(.device-ios):not(.device-android) .login-screen {
4621 height: calc(100% - 20px);
4622 top: 20px;
4623}
4624html.with-statusbar.device-iphone-x .login-screen {
4625 height: calc(100% - constant(safe-area-inset-top));
4626 height: calc(100% - env(safe-area-inset-top));
4627 top: constant(safe-area-inset-top);
4628 top: env(safe-area-inset-top);
4629}
4630html.with-statusbar.device-android .login-screen,
4631html.with-statusbar.md:not(.device-ios):not(.device-android) .login-screen {
4632 height: calc(100% - 24px);
4633 top: 24px;
4634}
4635.login-screen-content {
4636 background: #fff;
4637}
4638.login-screen-content .login-screen-title,
4639.login-screen-content .list,
4640.login-screen-content .block,
4641.login-screen-content .block-footer,
4642.login-screen-content .block-header {
4643 max-width: 480px;
4644}
4645.login-screen-content .list ul {
4646 background: none;
4647}
4648.login-screen-content .list ul:before {
4649 display: none !important;
4650}
4651.login-screen-content .list ul:after {
4652 display: none !important;
4653}
4654.login-screen-content .block-footer,
4655.login-screen-content .block-header {
4656 text-align: center;
4657 margin-left: auto;
4658 margin-right: auto;
4659}
4660.login-screen-title {
4661 text-align: center;
4662}
4663.md .login-screen-content .login-screen-title,
4664.md .login-screen-content .list,
4665.md .login-screen-content .block {
4666 margin: 24px auto;
4667}
4668.md .login-screen-content .list-button {
4669 text-align: center;
4670 color: #2196f3;
4671}
4672.md .login-screen-title {
4673 font-size: 34px;
4674}
4675.md .theme-dark .login-screen-content,
4676.login-screen-content.md .theme-dark {
4677 background: none;
4678}
4679.md .color-theme-red .login-screen-content .list-button {
4680 color: #f44336;
4681}
4682.md .color-theme-green .login-screen-content .list-button {
4683 color: #4caf50;
4684}
4685.md .color-theme-blue .login-screen-content .list-button {
4686 color: #2196f3;
4687}
4688.md .color-theme-pink .login-screen-content .list-button {
4689 color: #e91e63;
4690}
4691.md .color-theme-yellow .login-screen-content .list-button {
4692 color: #ffeb3b;
4693}
4694.md .color-theme-orange .login-screen-content .list-button {
4695 color: #ff9800;
4696}
4697.md .color-theme-gray .login-screen-content .list-button {
4698 color: #9e9e9e;
4699}
4700.md .color-theme-white .login-screen-content .list-button {
4701 color: #ffffff;
4702}
4703.md .color-theme-black .login-screen-content .list-button {
4704 color: #000000;
4705}
4706.md .login-screen-content .list-button.color-red {
4707 color: #f44336;
4708}
4709.md .login-screen-content .list-button.color-green {
4710 color: #4caf50;
4711}
4712.md .login-screen-content .list-button.color-blue {
4713 color: #2196f3;
4714}
4715.md .login-screen-content .list-button.color-pink {
4716 color: #e91e63;
4717}
4718.md .login-screen-content .list-button.color-yellow {
4719 color: #ffeb3b;
4720}
4721.md .login-screen-content .list-button.color-orange {
4722 color: #ff9800;
4723}
4724.md .login-screen-content .list-button.color-gray {
4725 color: #9e9e9e;
4726}
4727.md .login-screen-content .list-button.color-white {
4728 color: #ffffff;
4729}
4730.md .login-screen-content .list-button.color-black {
4731 color: #000000;
4732}
4733/* === Popover === */
4734.popover-backdrop {
4735 position: absolute;
4736 left: 0;
4737 top: 0;
4738 width: 100%;
4739 height: 100%;
4740 background: rgba(0, 0, 0, 0.4);
4741 z-index: 13000;
4742 visibility: hidden;
4743 opacity: 0;
4744 -webkit-transition-duration: 400ms;
4745 transition-duration: 400ms;
4746}
4747.popover-backdrop.not-animated {
4748 -webkit-transition-duration: 0ms;
4749 transition-duration: 0ms;
4750}
4751.popover-backdrop.backdrop-in {
4752 visibility: visible;
4753 opacity: 1;
4754}
4755.popover {
4756 width: 260px;
4757 z-index: 13500;
4758 margin: 0;
4759 top: 0;
4760 opacity: 0;
4761 left: 0;
4762 position: absolute;
4763 display: none;
4764 -webkit-transition-duration: 300ms;
4765 transition-duration: 300ms;
4766}
4767.popover .list {
4768 margin: 0;
4769}
4770.popover .list ul {
4771 background: none;
4772}
4773.popover .list:first-child ul:before {
4774 display: none !important;
4775}
4776.popover .list:last-child ul:after {
4777 display: none !important;
4778}
4779.popover.modal-in {
4780 opacity: 1;
4781}
4782.popover.not-animated {
4783 -webkit-transition-duration: 0ms;
4784 transition-duration: 0ms;
4785}
4786.popover-inner {
4787 overflow: auto;
4788 -webkit-overflow-scrolling: touch;
4789}
4790.popover-from-actions-bold {
4791 font-weight: 600;
4792}
4793.popover-from-actions-label {
4794 line-height: 1.3;
4795 position: relative;
4796}
4797.popover-from-actions-label:last-child:after {
4798 display: none !important;
4799}
4800.md .popover {
4801 background: #fff;
4802 border-radius: 4px;
4803 -webkit-box-shadow: 0px 5px 5px -3px rgba(0, 0, 0, 0.2), 0px 8px 10px 1px rgba(0, 0, 0, 0.14), 0px 3px 14px 2px rgba(0, 0, 0, 0.12);
4804 box-shadow: 0px 5px 5px -3px rgba(0, 0, 0, 0.2), 0px 8px 10px 1px rgba(0, 0, 0, 0.14), 0px 3px 14px 2px rgba(0, 0, 0, 0.12);
4805 -webkit-transform: scale(0.85, 0.6);
4806 transform: scale(0.85, 0.6);
4807 -webkit-transition-property: opacity, border-radius, -webkit-transform;
4808 transition-property: opacity, border-radius, -webkit-transform;
4809 transition-property: opacity, transform, border-radius;
4810 transition-property: opacity, transform, border-radius, -webkit-transform;
4811}
4812.md .popover.modal-in {
4813 opacity: 1;
4814 -webkit-transform: scale(1);
4815 transform: scale(1);
4816}
4817.md .popover.modal-out {
4818 opacity: 0;
4819 -webkit-transform: scale(1);
4820 transform: scale(1);
4821}
4822.md .popover .list:first-child ul {
4823 border-radius: 3px 3px 0 0;
4824}
4825.md .popover .list:first-child li:first-child,
4826.md .popover .list:first-child li:first-child a,
4827.md .popover .list:first-child li:first-child > label {
4828 border-radius: 3px 3px 0 0;
4829}
4830.md .popover .list:last-child ul {
4831 border-radius: 0 0 3px 3px;
4832}
4833.md .popover .list:last-child li:last-child,
4834.md .popover .list:last-child li:last-child a,
4835.md .popover .list:last-child li:last-child > label {
4836 border-radius: 0 0 3px 3px;
4837}
4838.md .popover .list:first-child:last-child li:first-child:last-child,
4839.md .popover .list:first-child:last-child li:first-child:last-child a,
4840.md .popover .list:first-child:last-child li:first-child:last-child > label,
4841.md .popover .list:first-child:last-child ul {
4842 border-radius: 13px;
4843}
4844.md .popover .list + .list {
4845 margin-top: 35px;
4846}
4847.md .popover-on-top {
4848 -webkit-transform-origin: center bottom;
4849 transform-origin: center bottom;
4850}
4851.md .popover-on-bottom {
4852 -webkit-transform-origin: center top;
4853 transform-origin: center top;
4854}
4855.md .popover-from-actions .list {
4856 margin: 0;
4857}
4858.md .popover-from-actions .item-link i.icon {
4859 width: 24px;
4860 height: 24px;
4861 font-size: 24px;
4862}
4863.md .popover-from-actions-label {
4864 padding: 8px 16px;
4865 color: rgba(0, 0, 0, 0.54);
4866 padding-top: 12px;
4867 padding-bottom: 12px;
4868}
4869.md .popover-from-actions-label:after {
4870 content: '';
4871 position: absolute;
4872 background-color: #d2d2d6;
4873 display: block;
4874 z-index: 15;
4875 top: auto;
4876 right: auto;
4877 bottom: 0;
4878 left: 0;
4879 height: 1px;
4880 width: 100%;
4881 -webkit-transform-origin: 50% 100%;
4882 transform-origin: 50% 100%;
4883}
4884.md.device-pixel-ratio-2 .popover-from-actions-label:after {
4885 -webkit-transform: scaleY(0.5);
4886 transform: scaleY(0.5);
4887}
4888.md.device-pixel-ratio-3 .popover-from-actions-label:after {
4889 -webkit-transform: scaleY(0.33);
4890 transform: scaleY(0.33);
4891}
4892.md .theme-dark .popover {
4893 background-color: #202020;
4894}
4895.md .theme-dark .popover-from-actions-label {
4896 color: rgba(255, 255, 255, 0.54);
4897}
4898.md .theme-dark .popover-from-actions-label:after {
4899 background-color: rgba(255, 255, 255, 0.08);
4900}
4901/* === Actions === */
4902.actions-backdrop {
4903 position: absolute;
4904 left: 0;
4905 top: 0;
4906 width: 100%;
4907 height: 100%;
4908 background: rgba(0, 0, 0, 0.4);
4909 z-index: 13000;
4910 visibility: hidden;
4911 opacity: 0;
4912 -webkit-transition-duration: 400ms;
4913 transition-duration: 400ms;
4914}
4915.actions-backdrop.not-animated {
4916 -webkit-transition-duration: 0ms;
4917 transition-duration: 0ms;
4918}
4919.actions-backdrop.backdrop-in {
4920 visibility: visible;
4921 opacity: 1;
4922}
4923.actions-modal {
4924 position: absolute;
4925 left: 0;
4926 bottom: 0;
4927 z-index: 13500;
4928 width: 100%;
4929 -webkit-transform: translate3d(0, 100%, 0);
4930 transform: translate3d(0, 100%, 0);
4931 display: none;
4932 max-height: 100%;
4933 overflow: auto;
4934 -webkit-overflow-scrolling: touch;
4935 -webkit-transition-property: -webkit-transform;
4936 transition-property: -webkit-transform;
4937 transition-property: transform;
4938 transition-property: transform, -webkit-transform;
4939}
4940.actions-modal.modal-in,
4941.actions-modal.modal-out {
4942 -webkit-transition-duration: 300ms;
4943 transition-duration: 300ms;
4944}
4945.actions-modal.not-animated {
4946 -webkit-transition-duration: 0ms;
4947 transition-duration: 0ms;
4948}
4949.actions-modal.modal-in {
4950 -webkit-transform: translate3d(0, 0, 0);
4951 transform: translate3d(0, 0, 0);
4952}
4953.actions-modal.modal-out {
4954 z-index: 13499;
4955 -webkit-transform: translate3d(0, 100%, 0);
4956 transform: translate3d(0, 100%, 0);
4957}
4958@media (min-width: 496px) {
4959 .actions-modal {
4960 width: 480px;
4961 left: 50%;
4962 margin-left: -240px;
4963 }
4964}
4965.actions-group {
4966 position: relative;
4967}
4968.actions-button,
4969.actions-label {
4970 width: 100%;
4971 font-weight: normal;
4972 margin: 0;
4973 -webkit-box-sizing: border-box;
4974 box-sizing: border-box;
4975 display: block;
4976 position: relative;
4977}
4978.actions-button a,
4979.actions-label a {
4980 text-decoration: none;
4981 color: inherit;
4982 display: block;
4983}
4984.actions-button b,
4985.actions-label b,
4986.actions-button.actions-button-bold,
4987.actions-label.actions-button-bold {
4988 font-weight: 500;
4989}
4990.actions-button {
4991 cursor: pointer;
4992 display: -webkit-box;
4993 display: -webkit-flex;
4994 display: -ms-flexbox;
4995 display: flex;
4996}
4997.actions-button-media {
4998 -webkit-flex-shrink: 0;
4999 -ms-flex-negative: 0;
5000 flex-shrink: 0;
5001 display: -webkit-box;
5002 display: -webkit-flex;
5003 display: -ms-flexbox;
5004 display: flex;
5005 -webkit-box-align: center;
5006 -webkit-align-items: center;
5007 -ms-flex-align: center;
5008 align-items: center;
5009}
5010.actions-button-text {
5011 width: 100%;
5012 -webkit-flex-shrink: 1;
5013 -ms-flex-negative: 1;
5014 flex-shrink: 1;
5015}
5016.actions-label {
5017 line-height: 1.3;
5018 display: -webkit-box;
5019 display: -webkit-flex;
5020 display: -ms-flexbox;
5021 display: flex;
5022 -webkit-box-align: center;
5023 -webkit-align-items: center;
5024 -ms-flex-align: center;
5025 align-items: center;
5026}
5027.actions-grid .actions-group {
5028 display: -webkit-box;
5029 display: -webkit-flex;
5030 display: -ms-flexbox;
5031 display: flex;
5032 -webkit-flex-wrap: wrap;
5033 -ms-flex-wrap: wrap;
5034 flex-wrap: wrap;
5035 -webkit-box-pack: start;
5036 -webkit-justify-content: flex-start;
5037 -ms-flex-pack: start;
5038 justify-content: flex-start;
5039}
5040.actions-grid .actions-button {
5041 width: 33.33333333%;
5042 display: block;
5043}
5044.actions-grid .actions-button-media {
5045 margin-left: auto;
5046 margin-right: auto;
5047}
5048.actions-grid .actions-button-text {
5049 margin-left: 0 !important;
5050 text-align: center;
5051}
5052.md .actions-modal {
5053 background: #fff;
5054}
5055.md .actions-group:last-child:after {
5056 display: none !important;
5057}
5058.md .actions-group:after {
5059 content: '';
5060 position: absolute;
5061 background-color: #d2d2d6;
5062 display: block;
5063 z-index: 15;
5064 top: auto;
5065 right: auto;
5066 bottom: 0;
5067 left: 0;
5068 height: 1px;
5069 width: 100%;
5070 -webkit-transform-origin: 50% 100%;
5071 transform-origin: 50% 100%;
5072}
5073.md.device-pixel-ratio-2 .actions-group:after {
5074 -webkit-transform: scaleY(0.5);
5075 transform: scaleY(0.5);
5076}
5077.md.device-pixel-ratio-3 .actions-group:after {
5078 -webkit-transform: scaleY(0.33);
5079 transform: scaleY(0.33);
5080}
5081.md .actions-button,
5082.md .actions-label {
5083 padding: 0 16px;
5084}
5085.md .actions-button {
5086 line-height: 48px;
5087 font-size: 16px;
5088 color: rgba(0, 0, 0, 0.87);
5089 -webkit-transition-duration: 300ms;
5090 transition-duration: 300ms;
5091 -webkit-box-pack: justify;
5092 -webkit-justify-content: space-between;
5093 -ms-flex-pack: justify;
5094 justify-content: space-between;
5095}
5096.md .actions-button a,
5097.md .actions-button {
5098 position: relative;
5099 overflow: hidden;
5100 white-space: nowrap;
5101 text-overflow: ellipsis;
5102}
5103.md .actions-button a.active-state,
5104.md .actions-button.active-state {
5105 background: rgba(0, 0, 0, 0.1);
5106}
5107.md .actions-button-media {
5108 min-width: 40px;
5109}
5110.md .actions-button-media i.icon {
5111 width: 24px;
5112 height: 24px;
5113 font-size: 24px;
5114}
5115.md .actions-button-media + .actions-button-text {
5116 margin-left: 16px;
5117}
5118.md .actions-label {
5119 font-size: 16px;
5120 color: rgba(0, 0, 0, 0.54);
5121 padding-top: 12px;
5122 padding-bottom: 12px;
5123 -webkit-box-pack: start;
5124 -webkit-justify-content: flex-start;
5125 -ms-flex-pack: start;
5126 justify-content: flex-start;
5127}
5128.md .actions-grid {
5129 padding: 0;
5130}
5131.md .actions-grid .actions-button-media {
5132 width: 48px;
5133 height: 48px;
5134}
5135.md .actions-grid .actions-button-media i.icon {
5136 width: 48px;
5137 height: 48px;
5138 font-size: 48px;
5139}
5140.md .actions-grid .actions-button {
5141 padding: 16px;
5142 line-height: 1;
5143}
5144.md .actions-grid .actions-button-text {
5145 margin-top: 8px;
5146 line-height: 16px;
5147 height: 16px;
5148 font-size: 12px;
5149 color: #757575;
5150}
5151.md .actions-button.color-red,
5152.md .actions-label.color-red,
5153.md .actions-button.color-red .actions-button-text {
5154 color: #f44336;
5155}
5156.md .actions-button.color-green,
5157.md .actions-label.color-green,
5158.md .actions-button.color-green .actions-button-text {
5159 color: #4caf50;
5160}
5161.md .actions-button.color-blue,
5162.md .actions-label.color-blue,
5163.md .actions-button.color-blue .actions-button-text {
5164 color: #2196f3;
5165}
5166.md .actions-button.color-pink,
5167.md .actions-label.color-pink,
5168.md .actions-button.color-pink .actions-button-text {
5169 color: #e91e63;
5170}
5171.md .actions-button.color-yellow,
5172.md .actions-label.color-yellow,
5173.md .actions-button.color-yellow .actions-button-text {
5174 color: #ffeb3b;
5175}
5176.md .actions-button.color-orange,
5177.md .actions-label.color-orange,
5178.md .actions-button.color-orange .actions-button-text {
5179 color: #ff9800;
5180}
5181.md .actions-button.color-gray,
5182.md .actions-label.color-gray,
5183.md .actions-button.color-gray .actions-button-text {
5184 color: #9e9e9e;
5185}
5186.md .actions-button.color-white,
5187.md .actions-label.color-white,
5188.md .actions-button.color-white .actions-button-text {
5189 color: #ffffff;
5190}
5191.md .actions-button.color-black,
5192.md .actions-label.color-black,
5193.md .actions-button.color-black .actions-button-text {
5194 color: #000000;
5195}
5196.md.device-iphone-x .actions-modal.modal-in {
5197 padding-bottom: constant(safe-area-inset-bottom);
5198 padding-bottom: env(safe-area-inset-bottom);
5199}
5200/* === Sheet Modal === */
5201.sheet-backdrop {
5202 position: absolute;
5203 left: 0;
5204 top: 0;
5205 width: 100%;
5206 height: 100%;
5207 background: rgba(0, 0, 0, 0.4);
5208 z-index: 13000;
5209 visibility: hidden;
5210 opacity: 0;
5211 -webkit-transition-duration: 400ms;
5212 transition-duration: 400ms;
5213 z-index: 11000;
5214}
5215.sheet-backdrop.not-animated {
5216 -webkit-transition-duration: 0ms;
5217 transition-duration: 0ms;
5218}
5219.sheet-backdrop.backdrop-in {
5220 visibility: visible;
5221 opacity: 1;
5222}
5223.sheet-modal {
5224 position: absolute;
5225 left: 0;
5226 bottom: 0;
5227 width: 100%;
5228 height: 260px;
5229 display: none;
5230 -webkit-box-sizing: border-box;
5231 box-sizing: border-box;
5232 -webkit-transition-property: -webkit-transform;
5233 transition-property: -webkit-transform;
5234 transition-property: transform;
5235 transition-property: transform, -webkit-transform;
5236 -webkit-transform: translate3d(0, 100%, 0);
5237 transform: translate3d(0, 100%, 0);
5238 background: #fff;
5239 z-index: 12500;
5240}
5241.sheet-modal.modal-in,
5242.sheet-modal.modal-out {
5243 -webkit-transition-duration: 300ms;
5244 transition-duration: 300ms;
5245}
5246.sheet-modal.not-animated {
5247 -webkit-transition-duration: 0ms;
5248 transition-duration: 0ms;
5249}
5250.sheet-modal.modal-in {
5251 display: block;
5252 -webkit-transform: translate3d(0, 0, 0);
5253 transform: translate3d(0, 0, 0);
5254}
5255.sheet-modal.modal-out {
5256 -webkit-transform: translate3d(0, 100%, 0);
5257 transform: translate3d(0, 100%, 0);
5258}
5259.sheet-modal .sheet-modal-inner {
5260 height: 100%;
5261 position: relative;
5262 overflow: hidden;
5263}
5264.sheet-modal .toolbar {
5265 position: relative;
5266 width: 100%;
5267}
5268.md .sheet-modal {
5269 background: #fff;
5270}
5271.md .sheet-modal .toolbar {
5272 top: 0;
5273}
5274.md .sheet-modal .toolbar:after {
5275 display: none;
5276}
5277.md .sheet-modal .toolbar + .sheet-modal-inner {
5278 height: calc(100% - 48px);
5279}
5280.md .sheet-modal .toolbar a.link:not(.tab-link) {
5281 -webkit-flex-shrink: 0;
5282 -ms-flex-negative: 0;
5283 flex-shrink: 0;
5284}
5285.md .sheet-modal .toolbar:not(.toolbar-bottom-md):not(.messagebar) ~ .sheet-modal-inner .page-content {
5286 padding-top: 0;
5287}
5288.md.device-iphone-x .sheet-modal .toolbar ~ .sheet-modal-inner .page-content,
5289.md.device-iphone-x .sheet-modal .sheet-modal-inner > .page-content {
5290 padding-bottom: constant(safe-area-inset-bottom);
5291 padding-bottom: env(safe-area-inset-bottom);
5292}
5293.md .theme-dark .sheet-modal {
5294 background-color: #202020;
5295}
5296/* === Toast === */
5297.toast {
5298 -webkit-transition-property: opacity, -webkit-transform;
5299 transition-property: opacity, -webkit-transform;
5300 transition-property: transform, opacity;
5301 transition-property: transform, opacity, -webkit-transform;
5302 position: absolute;
5303 max-width: 568px;
5304 z-index: 20000;
5305 color: #fff;
5306 font-size: 14px;
5307 -webkit-box-sizing: border-box;
5308 box-sizing: border-box;
5309}
5310.toast.modal-in {
5311 opacity: 1;
5312}
5313.toast .toast-content {
5314 display: -webkit-box;
5315 display: -webkit-flex;
5316 display: -ms-flexbox;
5317 display: flex;
5318 -webkit-box-pack: justify;
5319 -webkit-justify-content: space-between;
5320 -ms-flex-pack: justify;
5321 justify-content: space-between;
5322 -webkit-box-align: center;
5323 -webkit-align-items: center;
5324 -ms-flex-align: center;
5325 align-items: center;
5326 -webkit-box-sizing: border-box;
5327 box-sizing: border-box;
5328}
5329.toast .toast-text {
5330 line-height: 20px;
5331 -webkit-flex-shrink: 1;
5332 -ms-flex-negative: 1;
5333 flex-shrink: 1;
5334 min-width: 0;
5335}
5336.toast .toast-button {
5337 -webkit-flex-shrink: 0;
5338 -ms-flex-negative: 0;
5339 flex-shrink: 0;
5340}
5341.toast.toast-with-icon .toast-content {
5342 display: block;
5343 text-align: center;
5344}
5345.toast.toast-with-icon .toast-text {
5346 text-align: center;
5347}
5348.toast.toast-with-icon .toast-icon .f7-icons {
5349 font-size: 50px;
5350 width: 50px;
5351 height: 50px;
5352}
5353.toast.toast-with-icon .toast-icon .material-icons {
5354 font-size: 48px;
5355 width: 48px;
5356 height: 48px;
5357}
5358.toast.toast-center {
5359 top: 50%;
5360 opacity: 0;
5361}
5362@media (min-width: 1024px) {
5363 .toast {
5364 opacity: 0;
5365 }
5366}
5367html.with-statusbar.device-ios .toast-top,
5368html.with-statusbar.ios:not(.device-ios):not(.device-android) .toast-top {
5369 margin-top: 20px;
5370}
5371html.with-statusbar.device-iphone-x .toast-top {
5372 margin-top: constant(safe-area-inset-top);
5373 margin-top: env(safe-area-inset-top);
5374}
5375html.with-statusbar.device-android .toast-top,
5376html.with-statusbar.md:not(.device-ios):not(.device-android) .toast-top {
5377 margin-top: 24px;
5378}
5379.md .toast {
5380 -webkit-transition-duration: 200ms;
5381 transition-duration: 200ms;
5382 border-radius: 4px;
5383 background: #323232;
5384 opacity: 0;
5385 left: 8px;
5386 width: calc(100% - 16px);
5387 -webkit-transform: scale(0.9);
5388 transform: scale(0.9);
5389}
5390.md .toast.modal-in {
5391 -webkit-transform: scale(1);
5392 transform: scale(1);
5393 opacity: 1;
5394}
5395.md .toast.modal-out {
5396 -webkit-transform: scale(1);
5397 transform: scale(1);
5398 opacity: 0;
5399}
5400.md .toast.toast-center {
5401 left: 50%;
5402 width: auto;
5403 background: rgba(0, 0, 0, 0.75);
5404 -webkit-transform: scale(0.9) translate3d(-55%, -55%, 0);
5405 transform: scale(0.9) translate3d(-55%, -55%, 0);
5406}
5407.md .toast.toast-center.modal-in {
5408 -webkit-transform: scale(1) translate3d(-50%, -50%, 0);
5409 transform: scale(1) translate3d(-50%, -50%, 0);
5410}
5411.md .toast.toast-center.modal-out {
5412 -webkit-transform: scale(1) translate3d(-50%, -50%, 0);
5413 transform: scale(1) translate3d(-50%, -50%, 0);
5414}
5415.md .toast.toast-bottom {
5416 bottom: 8px;
5417}
5418.md .toast.toast-top {
5419 top: 8px;
5420}
5421@media (min-width: 584px) {
5422 .md .toast {
5423 left: 50%;
5424 margin-left: -284px;
5425 }
5426 .md .toast.toast-center {
5427 margin-left: 0;
5428 }
5429}
5430@media (min-width: 1024px) {
5431 .md .toast {
5432 margin-left: 0;
5433 width: auto;
5434 }
5435 .md .toast.toast-bottom,
5436 .md .toast.toast-top {
5437 left: 24px;
5438 }
5439 .md .toast.toast-bottom {
5440 bottom: 24px;
5441 }
5442 .md .toast.toast-top {
5443 top: 24px;
5444 }
5445}
5446.md .toast-content {
5447 padding: 14px 24px;
5448}
5449.md .toast-button {
5450 margin-top: -8px;
5451 margin-bottom: -8px;
5452 margin-left: 16px;
5453 margin-right: -8px;
5454}
5455@media (max-width: 568px) {
5456 .md.device-iphone-x .toast-bottom .toast-content {
5457 padding-bottom: calc(14px + constant(safe-area-inset-bottom));
5458 padding-bottom: calc(14px + env(safe-area-inset-bottom));
5459 }
5460}
5461@media (min-width: 1024px) {
5462 .md.device-iphone-x .toast-bottom.modal-in {
5463 margin-bottom: constant(safe-area-inset-bottom);
5464 margin-bottom: env(safe-area-inset-bottom);
5465 }
5466}
5467/* === Preloader === */
5468.preloader {
5469 display: inline-block;
5470 vertical-align: middle;
5471}
5472/* === Preloader Modal === */
5473.preloader-backdrop {
5474 position: absolute;
5475 left: 0;
5476 top: 0;
5477 width: 100%;
5478 height: 100%;
5479 background: rgba(0, 0, 0, 0.4);
5480 z-index: 13000;
5481 visibility: hidden;
5482 -webkit-transition-duration: 400ms;
5483 transition-duration: 400ms;
5484 visibility: visible;
5485 opacity: 0;
5486 background: none;
5487 z-index: 14000;
5488}
5489.preloader-backdrop.not-animated {
5490 -webkit-transition-duration: 0ms;
5491 transition-duration: 0ms;
5492}
5493.preloader-backdrop.backdrop-in {
5494 visibility: visible;
5495 opacity: 1;
5496}
5497.preloader-modal {
5498 position: absolute;
5499 left: 50%;
5500 top: 50%;
5501 padding: 8px;
5502 background: rgba(0, 0, 0, 0.8);
5503 z-index: 14500;
5504 -webkit-transform: translateX(-50%) translateY(-50%);
5505 transform: translateX(-50%) translateY(-50%);
5506}
5507.preloader-modal .preloader {
5508 display: block !important;
5509}
5510html.with-modal-preloader .page-content {
5511 overflow: hidden;
5512 -webkit-overflow-scrolling: auto;
5513}
5514.md .preloader {
5515 font-size: 0;
5516 display: inline-block;
5517 width: 32px;
5518 height: 32px;
5519 -webkit-animation: md-preloader-outer 3300ms linear infinite;
5520 animation: md-preloader-outer 3300ms linear infinite;
5521}
5522@-webkit-keyframes md-preloader-outer {
5523 0% {
5524 -webkit-transform: rotate(0);
5525 transform: rotate(0);
5526 }
5527 100% {
5528 -webkit-transform: rotate(360deg);
5529 transform: rotate(360deg);
5530 }
5531}
5532@keyframes md-preloader-outer {
5533 0% {
5534 -webkit-transform: rotate(0);
5535 transform: rotate(0);
5536 }
5537 100% {
5538 -webkit-transform: rotate(360deg);
5539 transform: rotate(360deg);
5540 }
5541}
5542.md .preloader-inner {
5543 position: relative;
5544 display: block;
5545 width: 100%;
5546 height: 100%;
5547 -webkit-animation: md-preloader-inner-rotate 5.25s cubic-bezier(0.35, 0, 0.25, 1) infinite;
5548 animation: md-preloader-inner-rotate 5.25s cubic-bezier(0.35, 0, 0.25, 1) infinite;
5549}
5550.md .preloader-inner .preloader-inner-gap {
5551 position: absolute;
5552 width: 2px;
5553 left: 50%;
5554 margin-left: -1px;
5555 top: 0;
5556 bottom: 0;
5557 -webkit-box-sizing: border-box;
5558 box-sizing: border-box;
5559 border-top: 4px solid #757575;
5560}
5561.md .preloader-inner .preloader-inner-left,
5562.md .preloader-inner .preloader-inner-right {
5563 position: absolute;
5564 top: 0;
5565 height: 100%;
5566 width: 50%;
5567 overflow: hidden;
5568}
5569.md .preloader-inner .preloader-inner-half-circle {
5570 position: absolute;
5571 top: 0;
5572 height: 100%;
5573 width: 200%;
5574 -webkit-box-sizing: border-box;
5575 box-sizing: border-box;
5576 border: 4px solid #757575;
5577 border-bottom-color: transparent !important;
5578 border-radius: 50%;
5579 -webkit-animation-iteration-count: infinite;
5580 animation-iteration-count: infinite;
5581 -webkit-animation-duration: 1.3125s;
5582 animation-duration: 1.3125s;
5583 -webkit-animation-timing-function: cubic-bezier(0.35, 0, 0.25, 1);
5584 animation-timing-function: cubic-bezier(0.35, 0, 0.25, 1);
5585}
5586.md .preloader-inner .preloader-inner-left {
5587 left: 0;
5588}
5589.md .preloader-inner .preloader-inner-left .preloader-inner-half-circle {
5590 left: 0;
5591 border-right-color: transparent !important;
5592 -webkit-animation-name: md-preloader-left-rotate;
5593 animation-name: md-preloader-left-rotate;
5594}
5595.md .preloader-inner .preloader-inner-right {
5596 right: 0;
5597}
5598.md .preloader-inner .preloader-inner-right .preloader-inner-half-circle {
5599 right: 0;
5600 border-left-color: transparent !important;
5601 -webkit-animation-name: md-preloader-right-rotate;
5602 animation-name: md-preloader-right-rotate;
5603}
5604.md .preloader-modal {
5605 border-radius: 4px;
5606}
5607.md .preloader.color-red .preloader-inner-gap,
5608.md .preloader.preloader-red .preloader-inner-gap,
5609.md .preloader.color-red .preloader-inner-half-circle,
5610.md .preloader.preloader-red .preloader-inner-half-circle {
5611 border-color: #f44336;
5612}
5613.md .preloader.color-green .preloader-inner-gap,
5614.md .preloader.preloader-green .preloader-inner-gap,
5615.md .preloader.color-green .preloader-inner-half-circle,
5616.md .preloader.preloader-green .preloader-inner-half-circle {
5617 border-color: #4caf50;
5618}
5619.md .preloader.color-blue .preloader-inner-gap,
5620.md .preloader.preloader-blue .preloader-inner-gap,
5621.md .preloader.color-blue .preloader-inner-half-circle,
5622.md .preloader.preloader-blue .preloader-inner-half-circle {
5623 border-color: #2196f3;
5624}
5625.md .preloader.color-pink .preloader-inner-gap,
5626.md .preloader.preloader-pink .preloader-inner-gap,
5627.md .preloader.color-pink .preloader-inner-half-circle,
5628.md .preloader.preloader-pink .preloader-inner-half-circle {
5629 border-color: #e91e63;
5630}
5631.md .preloader.color-yellow .preloader-inner-gap,
5632.md .preloader.preloader-yellow .preloader-inner-gap,
5633.md .preloader.color-yellow .preloader-inner-half-circle,
5634.md .preloader.preloader-yellow .preloader-inner-half-circle {
5635 border-color: #ffeb3b;
5636}
5637.md .preloader.color-orange .preloader-inner-gap,
5638.md .preloader.preloader-orange .preloader-inner-gap,
5639.md .preloader.color-orange .preloader-inner-half-circle,
5640.md .preloader.preloader-orange .preloader-inner-half-circle {
5641 border-color: #ff9800;
5642}
5643.md .preloader.color-gray .preloader-inner-gap,
5644.md .preloader.preloader-gray .preloader-inner-gap,
5645.md .preloader.color-gray .preloader-inner-half-circle,
5646.md .preloader.preloader-gray .preloader-inner-half-circle {
5647 border-color: #9e9e9e;
5648}
5649.md .preloader.color-white .preloader-inner-gap,
5650.md .preloader.preloader-white .preloader-inner-gap,
5651.md .preloader.color-white .preloader-inner-half-circle,
5652.md .preloader.preloader-white .preloader-inner-half-circle {
5653 border-color: #ffffff;
5654}
5655.md .preloader.color-black .preloader-inner-gap,
5656.md .preloader.preloader-black .preloader-inner-gap,
5657.md .preloader.color-black .preloader-inner-half-circle,
5658.md .preloader.preloader-black .preloader-inner-half-circle {
5659 border-color: #000000;
5660}
5661.md .preloader.color-multi .preloader-inner-left .preloader-inner-half-circle {
5662 -webkit-animation-name: md-preloader-left-rotate-multicolor;
5663 animation-name: md-preloader-left-rotate-multicolor;
5664}
5665.md .preloader.color-multi .preloader-inner-right .preloader-inner-half-circle {
5666 -webkit-animation-name: md-preloader-right-rotate-multicolor;
5667 animation-name: md-preloader-right-rotate-multicolor;
5668}
5669@-webkit-keyframes md-preloader-left-rotate {
5670 0%,
5671 100% {
5672 -webkit-transform: rotate(130deg);
5673 transform: rotate(130deg);
5674 }
5675 50% {
5676 -webkit-transform: rotate(-5deg);
5677 transform: rotate(-5deg);
5678 }
5679}
5680@keyframes md-preloader-left-rotate {
5681 0%,
5682 100% {
5683 -webkit-transform: rotate(130deg);
5684 transform: rotate(130deg);
5685 }
5686 50% {
5687 -webkit-transform: rotate(-5deg);
5688 transform: rotate(-5deg);
5689 }
5690}
5691@-webkit-keyframes md-preloader-right-rotate {
5692 0%,
5693 100% {
5694 -webkit-transform: rotate(-130deg);
5695 transform: rotate(-130deg);
5696 }
5697 50% {
5698 -webkit-transform: rotate(5deg);
5699 transform: rotate(5deg);
5700 }
5701}
5702@keyframes md-preloader-right-rotate {
5703 0%,
5704 100% {
5705 -webkit-transform: rotate(-130deg);
5706 transform: rotate(-130deg);
5707 }
5708 50% {
5709 -webkit-transform: rotate(5deg);
5710 transform: rotate(5deg);
5711 }
5712}
5713@-webkit-keyframes md-preloader-inner-rotate {
5714 12.5% {
5715 -webkit-transform: rotate(135deg);
5716 transform: rotate(135deg);
5717 }
5718 25% {
5719 -webkit-transform: rotate(270deg);
5720 transform: rotate(270deg);
5721 }
5722 37.5% {
5723 -webkit-transform: rotate(405deg);
5724 transform: rotate(405deg);
5725 }
5726 50% {
5727 -webkit-transform: rotate(540deg);
5728 transform: rotate(540deg);
5729 }
5730 62.5% {
5731 -webkit-transform: rotate(675deg);
5732 transform: rotate(675deg);
5733 }
5734 75% {
5735 -webkit-transform: rotate(810deg);
5736 transform: rotate(810deg);
5737 }
5738 87.5% {
5739 -webkit-transform: rotate(945deg);
5740 transform: rotate(945deg);
5741 }
5742 100% {
5743 -webkit-transform: rotate(1080deg);
5744 transform: rotate(1080deg);
5745 }
5746}
5747@keyframes md-preloader-inner-rotate {
5748 12.5% {
5749 -webkit-transform: rotate(135deg);
5750 transform: rotate(135deg);
5751 }
5752 25% {
5753 -webkit-transform: rotate(270deg);
5754 transform: rotate(270deg);
5755 }
5756 37.5% {
5757 -webkit-transform: rotate(405deg);
5758 transform: rotate(405deg);
5759 }
5760 50% {
5761 -webkit-transform: rotate(540deg);
5762 transform: rotate(540deg);
5763 }
5764 62.5% {
5765 -webkit-transform: rotate(675deg);
5766 transform: rotate(675deg);
5767 }
5768 75% {
5769 -webkit-transform: rotate(810deg);
5770 transform: rotate(810deg);
5771 }
5772 87.5% {
5773 -webkit-transform: rotate(945deg);
5774 transform: rotate(945deg);
5775 }
5776 100% {
5777 -webkit-transform: rotate(1080deg);
5778 transform: rotate(1080deg);
5779 }
5780}
5781@-webkit-keyframes md-preloader-left-rotate-multicolor {
5782 0%,
5783 100% {
5784 border-left-color: #4285F4;
5785 -webkit-transform: rotate(130deg);
5786 transform: rotate(130deg);
5787 }
5788 75% {
5789 border-left-color: #1B9A59;
5790 border-top-color: #1B9A59;
5791 }
5792 50% {
5793 border-left-color: #F7C223;
5794 border-top-color: #F7C223;
5795 -webkit-transform: rotate(-5deg);
5796 transform: rotate(-5deg);
5797 }
5798 25% {
5799 border-left-color: #DE3E35;
5800 border-top-color: #DE3E35;
5801 }
5802}
5803@keyframes md-preloader-left-rotate-multicolor {
5804 0%,
5805 100% {
5806 border-left-color: #4285F4;
5807 -webkit-transform: rotate(130deg);
5808 transform: rotate(130deg);
5809 }
5810 75% {
5811 border-left-color: #1B9A59;
5812 border-top-color: #1B9A59;
5813 }
5814 50% {
5815 border-left-color: #F7C223;
5816 border-top-color: #F7C223;
5817 -webkit-transform: rotate(-5deg);
5818 transform: rotate(-5deg);
5819 }
5820 25% {
5821 border-left-color: #DE3E35;
5822 border-top-color: #DE3E35;
5823 }
5824}
5825@-webkit-keyframes md-preloader-right-rotate-multicolor {
5826 0%,
5827 100% {
5828 border-right-color: #4285F4;
5829 -webkit-transform: rotate(-130deg);
5830 transform: rotate(-130deg);
5831 }
5832 75% {
5833 border-right-color: #1B9A59;
5834 border-top-color: #1B9A59;
5835 }
5836 50% {
5837 border-right-color: #F7C223;
5838 border-top-color: #F7C223;
5839 -webkit-transform: rotate(5deg);
5840 transform: rotate(5deg);
5841 }
5842 25% {
5843 border-top-color: #DE3E35;
5844 border-right-color: #DE3E35;
5845 }
5846}
5847@keyframes md-preloader-right-rotate-multicolor {
5848 0%,
5849 100% {
5850 border-right-color: #4285F4;
5851 -webkit-transform: rotate(-130deg);
5852 transform: rotate(-130deg);
5853 }
5854 75% {
5855 border-right-color: #1B9A59;
5856 border-top-color: #1B9A59;
5857 }
5858 50% {
5859 border-right-color: #F7C223;
5860 border-top-color: #F7C223;
5861 -webkit-transform: rotate(5deg);
5862 transform: rotate(5deg);
5863 }
5864 25% {
5865 border-top-color: #DE3E35;
5866 border-right-color: #DE3E35;
5867 }
5868}
5869/* === Progressbar === */
5870.progressbar,
5871.progressbar-infinite {
5872 width: 100%;
5873 overflow: hidden;
5874 position: relative;
5875 display: block;
5876 -webkit-transform-style: preserve-3d;
5877 transform-style: preserve-3d;
5878}
5879body > .progressbar,
5880.view > .progressbar,
5881.views > .progressbar,
5882.page > .progressbar,
5883.panel > .progressbar,
5884.popup > .progressbar,
5885.framework7-root > .progressbar,
5886body > .progressbar-infinite,
5887.view > .progressbar-infinite,
5888.views > .progressbar-infinite,
5889.page > .progressbar-infinite,
5890.panel > .progressbar-infinite,
5891.popup > .progressbar-infinite,
5892.framework7-root > .progressbar-infinite {
5893 position: absolute;
5894 left: 0;
5895 top: 0;
5896 z-index: 15000;
5897 border-radius: 0 !important;
5898 -webkit-transform-origin: center top !important;
5899 transform-origin: center top !important;
5900}
5901.with-statusbar.device-ios body > .progressbar,
5902.with-statusbar.ios:not(.device-ios):not(.device-android) body > .progressbar,
5903.with-statusbar.device-ios .framework7-root > .progressbar,
5904.with-statusbar.ios:not(.device-ios):not(.device-android) .framework7-root > .progressbar,
5905.with-statusbar.device-ios body > .progressbar-infinite,
5906.with-statusbar.ios:not(.device-ios):not(.device-android) body > .progressbar-infinite,
5907.with-statusbar.device-ios .framework7-root > .progressbar-infinite,
5908.with-statusbar.ios:not(.device-ios):not(.device-android) .framework7-root > .progressbar-infinite {
5909 top: 20px;
5910}
5911.with-statusbar.device-android body > .progressbar,
5912.with-statusbar.md:not(.device-ios):not(.device-android) body > .progressbar,
5913.with-statusbar.device-android .framework7-root > .progressbar,
5914.with-statusbar.md:not(.device-ios):not(.device-android) .framework7-root > .progressbar,
5915.with-statusbar.device-android body > .progressbar-infinite,
5916.with-statusbar.md:not(.device-ios):not(.device-android) body > .progressbar-infinite,
5917.with-statusbar.device-android .framework7-root > .progressbar-infinite,
5918.with-statusbar.md:not(.device-ios):not(.device-android) .framework7-root > .progressbar-infinite {
5919 top: 24px;
5920}
5921.with-statusbar.device-iphone-x body > .progressbar,
5922.with-statusbar.device-iphone-x .framework7-root > .progressbar,
5923.with-statusbar.device-iphone-x body > .progressbar-infinite,
5924.with-statusbar.device-iphone-x .framework7-root > .progressbar-infinite {
5925 top: constant(safe-area-inset-top);
5926 top: env(safe-area-inset-top);
5927}
5928.progressbar {
5929 vertical-align: middle;
5930}
5931.progressbar span {
5932 width: 100%;
5933 height: 100%;
5934 position: absolute;
5935 left: 0;
5936 top: 0;
5937 -webkit-transform: translate3d(-100%, 0, 0);
5938 transform: translate3d(-100%, 0, 0);
5939 -webkit-transition-duration: 150ms;
5940 transition-duration: 150ms;
5941}
5942.progressbar-infinite:before,
5943.progressbar-infinite:after {
5944 position: absolute;
5945 left: 0;
5946 top: 0;
5947 width: 100%;
5948 height: 100%;
5949 -webkit-transform-origin: left center;
5950 transform-origin: left center;
5951 -webkit-transform: translate3d(0, 0, 0);
5952 transform: translate3d(0, 0, 0);
5953 display: block;
5954}
5955.progressbar-infinite.color-multi {
5956 background: none !important;
5957}
5958.progressbar-in {
5959 -webkit-animation: progressbar-in 150ms forwards;
5960 animation: progressbar-in 150ms forwards;
5961}
5962.progressbar-out {
5963 -webkit-animation: progressbar-out 150ms forwards;
5964 animation: progressbar-out 150ms forwards;
5965}
5966@-webkit-keyframes progressbar-in {
5967 from {
5968 opacity: 0;
5969 -webkit-transform: scaleY(0);
5970 transform: scaleY(0);
5971 }
5972 to {
5973 opacity: 1;
5974 -webkit-transform: scaleY(1);
5975 transform: scaleY(1);
5976 }
5977}
5978@keyframes progressbar-in {
5979 from {
5980 opacity: 0;
5981 -webkit-transform: scaleY(0);
5982 transform: scaleY(0);
5983 }
5984 to {
5985 opacity: 1;
5986 -webkit-transform: scaleY(1);
5987 transform: scaleY(1);
5988 }
5989}
5990@-webkit-keyframes progressbar-out {
5991 from {
5992 opacity: 1;
5993 -webkit-transform: scaleY(1);
5994 transform: scaleY(1);
5995 }
5996 to {
5997 opacity: 0;
5998 -webkit-transform: scaleY(0);
5999 transform: scaleY(0);
6000 }
6001}
6002@keyframes progressbar-out {
6003 from {
6004 opacity: 1;
6005 -webkit-transform: scaleY(1);
6006 transform: scaleY(1);
6007 }
6008 to {
6009 opacity: 0;
6010 -webkit-transform: scaleY(0);
6011 transform: scaleY(0);
6012 }
6013}
6014.md .progressbar,
6015.md .progressbar-infinite {
6016 height: 4px;
6017 background: rgba(33, 150, 243, 0.5);
6018 -webkit-transform-origin: center bottom;
6019 transform-origin: center bottom;
6020}
6021.md .progressbar span {
6022 background: #2196f3;
6023}
6024.md .progressbar-infinite {
6025 z-index: 15000;
6026}
6027.md .progressbar-infinite:before,
6028.md .progressbar-infinite:after {
6029 content: '';
6030 background: #2196f3;
6031}
6032.md .progressbar-infinite:before {
6033 -webkit-animation: md-progressbar-infinite-1 2s linear infinite;
6034 animation: md-progressbar-infinite-1 2s linear infinite;
6035}
6036.md .progressbar-infinite:after {
6037 -webkit-animation: md-progressbar-infinite-2 2s linear infinite;
6038 animation: md-progressbar-infinite-2 2s linear infinite;
6039}
6040.md .progressbar-infinite.color-multi:before {
6041 background: none;
6042 -webkit-animation: md-progressbar-infinite-multicolor-bg 3s step-end infinite;
6043 animation: md-progressbar-infinite-multicolor-bg 3s step-end infinite;
6044}
6045.md .progressbar-infinite.color-multi:after {
6046 background: none;
6047 -webkit-animation: md-progressbar-infinite-multicolor-fill 3s linear infinite;
6048 animation: md-progressbar-infinite-multicolor-fill 3s linear infinite;
6049 -webkit-transform-origin: center center;
6050 transform-origin: center center;
6051}
6052.md .color-theme-red .progressbar,
6053.md .color-theme-red .progressbar-infinite {
6054 background: rgba(244, 67, 54, 0.5);
6055}
6056.md .color-theme-red .progressbar span {
6057 background: #f44336;
6058}
6059.md .color-theme-red .progressbar-infinite:before,
6060.md .color-theme-red .progressbar-infinite:after {
6061 background: #f44336;
6062}
6063.md .color-theme-green .progressbar,
6064.md .color-theme-green .progressbar-infinite {
6065 background: rgba(76, 175, 80, 0.5);
6066}
6067.md .color-theme-green .progressbar span {
6068 background: #4caf50;
6069}
6070.md .color-theme-green .progressbar-infinite:before,
6071.md .color-theme-green .progressbar-infinite:after {
6072 background: #4caf50;
6073}
6074.md .color-theme-blue .progressbar,
6075.md .color-theme-blue .progressbar-infinite {
6076 background: rgba(33, 150, 243, 0.5);
6077}
6078.md .color-theme-blue .progressbar span {
6079 background: #2196f3;
6080}
6081.md .color-theme-blue .progressbar-infinite:before,
6082.md .color-theme-blue .progressbar-infinite:after {
6083 background: #2196f3;
6084}
6085.md .color-theme-pink .progressbar,
6086.md .color-theme-pink .progressbar-infinite {
6087 background: rgba(233, 30, 99, 0.5);
6088}
6089.md .color-theme-pink .progressbar span {
6090 background: #e91e63;
6091}
6092.md .color-theme-pink .progressbar-infinite:before,
6093.md .color-theme-pink .progressbar-infinite:after {
6094 background: #e91e63;
6095}
6096.md .color-theme-yellow .progressbar,
6097.md .color-theme-yellow .progressbar-infinite {
6098 background: rgba(255, 235, 59, 0.5);
6099}
6100.md .color-theme-yellow .progressbar span {
6101 background: #ffeb3b;
6102}
6103.md .color-theme-yellow .progressbar-infinite:before,
6104.md .color-theme-yellow .progressbar-infinite:after {
6105 background: #ffeb3b;
6106}
6107.md .color-theme-orange .progressbar,
6108.md .color-theme-orange .progressbar-infinite {
6109 background: rgba(255, 152, 0, 0.5);
6110}
6111.md .color-theme-orange .progressbar span {
6112 background: #ff9800;
6113}
6114.md .color-theme-orange .progressbar-infinite:before,
6115.md .color-theme-orange .progressbar-infinite:after {
6116 background: #ff9800;
6117}
6118.md .color-theme-gray .progressbar,
6119.md .color-theme-gray .progressbar-infinite {
6120 background: rgba(158, 158, 158, 0.5);
6121}
6122.md .color-theme-gray .progressbar span {
6123 background: #9e9e9e;
6124}
6125.md .color-theme-gray .progressbar-infinite:before,
6126.md .color-theme-gray .progressbar-infinite:after {
6127 background: #9e9e9e;
6128}
6129.md .color-theme-white .progressbar,
6130.md .color-theme-white .progressbar-infinite {
6131 background: rgba(255, 255, 255, 0.5);
6132}
6133.md .color-theme-white .progressbar span {
6134 background: #ffffff;
6135}
6136.md .color-theme-white .progressbar-infinite:before,
6137.md .color-theme-white .progressbar-infinite:after {
6138 background: #ffffff;
6139}
6140.md .color-theme-black .progressbar,
6141.md .color-theme-black .progressbar-infinite {
6142 background: rgba(0, 0, 0, 0.5);
6143}
6144.md .color-theme-black .progressbar span {
6145 background: #000000;
6146}
6147.md .color-theme-black .progressbar-infinite:before,
6148.md .color-theme-black .progressbar-infinite:after {
6149 background: #000000;
6150}
6151.md .progressbar.color-red,
6152.md .progressbar-infinite.color-red {
6153 background: rgba(244, 67, 54, 0.5);
6154}
6155.md .progressbar.color-red span {
6156 background: #f44336;
6157}
6158.md .progressbar-infinite.color-red:before,
6159.md .progressbar-infinite.color-red:after {
6160 background: #f44336;
6161}
6162.md .progressbar.color-green,
6163.md .progressbar-infinite.color-green {
6164 background: rgba(76, 175, 80, 0.5);
6165}
6166.md .progressbar.color-green span {
6167 background: #4caf50;
6168}
6169.md .progressbar-infinite.color-green:before,
6170.md .progressbar-infinite.color-green:after {
6171 background: #4caf50;
6172}
6173.md .progressbar.color-blue,
6174.md .progressbar-infinite.color-blue {
6175 background: rgba(33, 150, 243, 0.5);
6176}
6177.md .progressbar.color-blue span {
6178 background: #2196f3;
6179}
6180.md .progressbar-infinite.color-blue:before,
6181.md .progressbar-infinite.color-blue:after {
6182 background: #2196f3;
6183}
6184.md .progressbar.color-pink,
6185.md .progressbar-infinite.color-pink {
6186 background: rgba(233, 30, 99, 0.5);
6187}
6188.md .progressbar.color-pink span {
6189 background: #e91e63;
6190}
6191.md .progressbar-infinite.color-pink:before,
6192.md .progressbar-infinite.color-pink:after {
6193 background: #e91e63;
6194}
6195.md .progressbar.color-yellow,
6196.md .progressbar-infinite.color-yellow {
6197 background: rgba(255, 235, 59, 0.5);
6198}
6199.md .progressbar.color-yellow span {
6200 background: #ffeb3b;
6201}
6202.md .progressbar-infinite.color-yellow:before,
6203.md .progressbar-infinite.color-yellow:after {
6204 background: #ffeb3b;
6205}
6206.md .progressbar.color-orange,
6207.md .progressbar-infinite.color-orange {
6208 background: rgba(255, 152, 0, 0.5);
6209}
6210.md .progressbar.color-orange span {
6211 background: #ff9800;
6212}
6213.md .progressbar-infinite.color-orange:before,
6214.md .progressbar-infinite.color-orange:after {
6215 background: #ff9800;
6216}
6217.md .progressbar.color-gray,
6218.md .progressbar-infinite.color-gray {
6219 background: rgba(158, 158, 158, 0.5);
6220}
6221.md .progressbar.color-gray span {
6222 background: #9e9e9e;
6223}
6224.md .progressbar-infinite.color-gray:before,
6225.md .progressbar-infinite.color-gray:after {
6226 background: #9e9e9e;
6227}
6228.md .progressbar.color-white,
6229.md .progressbar-infinite.color-white {
6230 background: rgba(255, 255, 255, 0.5);
6231}
6232.md .progressbar.color-white span {
6233 background: #ffffff;
6234}
6235.md .progressbar-infinite.color-white:before,
6236.md .progressbar-infinite.color-white:after {
6237 background: #ffffff;
6238}
6239.md .progressbar.color-black,
6240.md .progressbar-infinite.color-black {
6241 background: rgba(0, 0, 0, 0.5);
6242}
6243.md .progressbar.color-black span {
6244 background: #000000;
6245}
6246.md .progressbar-infinite.color-black:before,
6247.md .progressbar-infinite.color-black:after {
6248 background: #000000;
6249}
6250@-webkit-keyframes md-progressbar-infinite-1 {
6251 0% {
6252 -webkit-transform: translateX(-10%) scaleX(0.1);
6253 transform: translateX(-10%) scaleX(0.1);
6254 }
6255 25% {
6256 -webkit-transform: translateX(30%) scaleX(0.6);
6257 transform: translateX(30%) scaleX(0.6);
6258 }
6259 50% {
6260 -webkit-transform: translateX(100%) scaleX(1);
6261 transform: translateX(100%) scaleX(1);
6262 }
6263 100% {
6264 -webkit-transform: translateX(100%) scaleX(1);
6265 transform: translateX(100%) scaleX(1);
6266 }
6267}
6268@keyframes md-progressbar-infinite-1 {
6269 0% {
6270 -webkit-transform: translateX(-10%) scaleX(0.1);
6271 transform: translateX(-10%) scaleX(0.1);
6272 }
6273 25% {
6274 -webkit-transform: translateX(30%) scaleX(0.6);
6275 transform: translateX(30%) scaleX(0.6);
6276 }
6277 50% {
6278 -webkit-transform: translateX(100%) scaleX(1);
6279 transform: translateX(100%) scaleX(1);
6280 }
6281 100% {
6282 -webkit-transform: translateX(100%) scaleX(1);
6283 transform: translateX(100%) scaleX(1);
6284 }
6285}
6286@-webkit-keyframes md-progressbar-infinite-2 {
6287 0% {
6288 -webkit-transform: translateX(-100%) scaleX(1);
6289 transform: translateX(-100%) scaleX(1);
6290 }
6291 40% {
6292 -webkit-transform: translateX(-100%) scaleX(1);
6293 transform: translateX(-100%) scaleX(1);
6294 }
6295 75% {
6296 -webkit-transform: translateX(60%) scaleX(0.35);
6297 transform: translateX(60%) scaleX(0.35);
6298 }
6299 90% {
6300 -webkit-transform: translateX(100%) scaleX(0.1);
6301 transform: translateX(100%) scaleX(0.1);
6302 }
6303 100% {
6304 -webkit-transform: translateX(100%) scaleX(0.1);
6305 transform: translateX(100%) scaleX(0.1);
6306 }
6307}
6308@keyframes md-progressbar-infinite-2 {
6309 0% {
6310 -webkit-transform: translateX(-100%) scaleX(1);
6311 transform: translateX(-100%) scaleX(1);
6312 }
6313 40% {
6314 -webkit-transform: translateX(-100%) scaleX(1);
6315 transform: translateX(-100%) scaleX(1);
6316 }
6317 75% {
6318 -webkit-transform: translateX(60%) scaleX(0.35);
6319 transform: translateX(60%) scaleX(0.35);
6320 }
6321 90% {
6322 -webkit-transform: translateX(100%) scaleX(0.1);
6323 transform: translateX(100%) scaleX(0.1);
6324 }
6325 100% {
6326 -webkit-transform: translateX(100%) scaleX(0.1);
6327 transform: translateX(100%) scaleX(0.1);
6328 }
6329}
6330@-webkit-keyframes md-progressbar-infinite-multicolor-bg {
6331 0% {
6332 background-color: #4caf50;
6333 }
6334 25% {
6335 background-color: #f44336;
6336 }
6337 50% {
6338 background-color: #2196f3;
6339 }
6340 75% {
6341 background-color: #ffeb3b;
6342 }
6343}
6344@keyframes md-progressbar-infinite-multicolor-bg {
6345 0% {
6346 background-color: #4caf50;
6347 }
6348 25% {
6349 background-color: #f44336;
6350 }
6351 50% {
6352 background-color: #2196f3;
6353 }
6354 75% {
6355 background-color: #ffeb3b;
6356 }
6357}
6358@-webkit-keyframes md-progressbar-infinite-multicolor-fill {
6359 0% {
6360 -webkit-transform: scaleX(0);
6361 transform: scaleX(0);
6362 background-color: #f44336;
6363 }
6364 24.9% {
6365 -webkit-transform: scaleX(1);
6366 transform: scaleX(1);
6367 background-color: #f44336;
6368 }
6369 25% {
6370 -webkit-transform: scaleX(0);
6371 transform: scaleX(0);
6372 background-color: #2196f3;
6373 }
6374 49.9% {
6375 -webkit-transform: scaleX(1);
6376 transform: scaleX(1);
6377 background-color: #2196f3;
6378 }
6379 50% {
6380 -webkit-transform: scaleX(0);
6381 transform: scaleX(0);
6382 background-color: #ffeb3b;
6383 }
6384 74.9% {
6385 -webkit-transform: scaleX(1);
6386 transform: scaleX(1);
6387 background-color: #ffeb3b;
6388 }
6389 75% {
6390 -webkit-transform: scaleX(0);
6391 transform: scaleX(0);
6392 background-color: #4caf50;
6393 }
6394 100% {
6395 -webkit-transform: scaleX(1);
6396 transform: scaleX(1);
6397 background-color: #4caf50;
6398 }
6399}
6400@keyframes md-progressbar-infinite-multicolor-fill {
6401 0% {
6402 -webkit-transform: scaleX(0);
6403 transform: scaleX(0);
6404 background-color: #f44336;
6405 }
6406 24.9% {
6407 -webkit-transform: scaleX(1);
6408 transform: scaleX(1);
6409 background-color: #f44336;
6410 }
6411 25% {
6412 -webkit-transform: scaleX(0);
6413 transform: scaleX(0);
6414 background-color: #2196f3;
6415 }
6416 49.9% {
6417 -webkit-transform: scaleX(1);
6418 transform: scaleX(1);
6419 background-color: #2196f3;
6420 }
6421 50% {
6422 -webkit-transform: scaleX(0);
6423 transform: scaleX(0);
6424 background-color: #ffeb3b;
6425 }
6426 74.9% {
6427 -webkit-transform: scaleX(1);
6428 transform: scaleX(1);
6429 background-color: #ffeb3b;
6430 }
6431 75% {
6432 -webkit-transform: scaleX(0);
6433 transform: scaleX(0);
6434 background-color: #4caf50;
6435 }
6436 100% {
6437 -webkit-transform: scaleX(1);
6438 transform: scaleX(1);
6439 background-color: #4caf50;
6440 }
6441}
6442/* === Sortable === */
6443.sortable .sortable-handler {
6444 position: absolute;
6445 top: 0;
6446 bottom: 1px;
6447 z-index: 10;
6448 background-repeat: no-repeat;
6449 background-size: 18px 12px;
6450 opacity: 0;
6451 pointer-events: none;
6452 cursor: move;
6453 -webkit-transition-duration: 300ms;
6454 transition-duration: 300ms;
6455 right: 0;
6456 background-position: 100% 50%;
6457}
6458.sortable .item-inner {
6459 -webkit-transition-duration: 300ms;
6460 transition-duration: 300ms;
6461}
6462.sortable li.sorting {
6463 z-index: 50;
6464 background: rgba(255, 255, 255, 0.8);
6465 -webkit-transition-duration: 0ms;
6466 transition-duration: 0ms;
6467}
6468.sortable li.sorting .item-inner:after {
6469 display: none !important;
6470}
6471.sortable-sorting li {
6472 -webkit-transition-duration: 300ms;
6473 transition-duration: 300ms;
6474}
6475.sortable-enabled .sortable-handler {
6476 pointer-events: auto;
6477 opacity: 1;
6478 background-position: 50% 50%;
6479}
6480.sortable-enabled .item-link .item-inner,
6481.sortable-enabled .item-link .item-title-row {
6482 background-image: none !important;
6483}
6484.theme-dark .sortable li.sorting,
6485.sortable.theme-dark li.sorting {
6486 background-color: rgba(50, 50, 50, 0.8);
6487}
6488.md .sortable-handler {
6489 width: 50px;
6490 background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2018%208'%3E%3Crect%20x%3D'0'%20y%3D'0'%20width%3D'18'%20height%3D'2'%20fill%3D'%23c7c7cc'%3E%3C%2Frect%3E%3Crect%20x%3D'0'%20y%3D'6'%20width%3D'18'%20height%3D'2'%20fill%3D'%23c7c7cc'%3E%3C%2Frect%3E%3C%2Fsvg%3E");
6491}
6492.md .sortable li.sorting {
6493 -webkit-box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23);
6494 box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23);
6495}
6496.md .sortable-enabled .item-inner,
6497.md .sortable-enabled .item-link .item-inner {
6498 padding-right: 50px;
6499}
6500.md .list.sortable-enabled .item-link.no-chevron .item-inner,
6501.md .list.sortable-enabled.no-chevron .item-link .item-inner,
6502.md .list.sortable-enabled .no-chevron .item-link .item-inner,
6503.md .no-chevron .list.sortable-enabled .item-link .item-inner {
6504 padding-right: 50px;
6505}
6506@media (orientation: landscape) {
6507 .md.device-iphone-x .ios-right-edge .sortable-handler,
6508 .md.device-iphone-x .ios-edges .sortable-handler,
6509 .md.device-iphone-x .popup .sortable-handler,
6510 .md.device-iphone-x .sheet-modal .sortable-handler,
6511 .md.device-iphone-x .panel-right .sortable-handler {
6512 right: constant(safe-area-inset-right);
6513 right: env(safe-area-inset-right);
6514 }
6515 .md.device-iphone-x .ios-right-edge .sortable-enabled:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) .item-inner,
6516 .md.device-iphone-x .ios-edges .sortable-enabled:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) .item-inner,
6517 .md.device-iphone-x .popup .sortable-enabled:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) .item-inner,
6518 .md.device-iphone-x .sheet-modal .sortable-enabled:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) .item-inner,
6519 .md.device-iphone-x .panel-right .sortable-enabled:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) .item-inner,
6520 .md.device-iphone-x .ios-right-edge .sortable-enabled:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) .item-link .item-inner,
6521 .md.device-iphone-x .ios-edges .sortable-enabled:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) .item-link .item-inner,
6522 .md.device-iphone-x .popup .sortable-enabled:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) .item-link .item-inner,
6523 .md.device-iphone-x .sheet-modal .sortable-enabled:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) .item-link .item-inner,
6524 .md.device-iphone-x .panel-right .sortable-enabled:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) .item-link .item-inner {
6525 padding-right: calc(42px + constant(safe-area-inset-right));
6526 padding-right: calc(42px + env(safe-area-inset-right));
6527 }
6528}
6529/* === Swipeout === */
6530.swipeout {
6531 overflow: hidden;
6532 -webkit-transform-style: preserve-3d;
6533 transform-style: preserve-3d;
6534}
6535.swipeout-deleting {
6536 -webkit-transition-duration: 300ms;
6537 transition-duration: 300ms;
6538}
6539.swipeout-deleting .swipeout-content {
6540 -webkit-transform: translateX(-100%);
6541 transform: translateX(-100%);
6542}
6543.swipeout-transitioning .swipeout-content,
6544.swipeout-transitioning .swipeout-actions-right a,
6545.swipeout-transitioning .swipeout-actions-left a,
6546.swipeout-transitioning .swipeout-overswipe {
6547 -webkit-transition-duration: 300ms;
6548 transition-duration: 300ms;
6549 -webkit-transition-property: left, -webkit-transform;
6550 transition-property: left, -webkit-transform;
6551 transition-property: transform, left;
6552 transition-property: transform, left, -webkit-transform;
6553}
6554.swipeout-content {
6555 position: relative;
6556 z-index: 10;
6557}
6558.swipeout-overswipe {
6559 -webkit-transition-duration: 200ms;
6560 transition-duration: 200ms;
6561 -webkit-transition-property: left;
6562 transition-property: left;
6563}
6564.swipeout-actions-left,
6565.swipeout-actions-right {
6566 position: absolute;
6567 top: 0;
6568 height: 100%;
6569 display: -webkit-box;
6570 display: -webkit-flex;
6571 display: -ms-flexbox;
6572 display: flex;
6573 direction: ltr;
6574}
6575.swipeout-actions-left > a,
6576.swipeout-actions-right > a,
6577.swipeout-actions-left > button,
6578.swipeout-actions-right > button,
6579.swipeout-actions-left > span,
6580.swipeout-actions-right > span,
6581.swipeout-actions-left > div,
6582.swipeout-actions-right > div {
6583 color: #fff;
6584 background: #c7c7cc;
6585 display: -webkit-box;
6586 display: -webkit-flex;
6587 display: -ms-flexbox;
6588 display: flex;
6589 -webkit-box-align: center;
6590 -webkit-align-items: center;
6591 -ms-flex-align: center;
6592 align-items: center;
6593 position: relative;
6594 left: 0;
6595}
6596.swipeout-actions-left > a:after,
6597.swipeout-actions-right > a:after,
6598.swipeout-actions-left > button:after,
6599.swipeout-actions-right > button:after,
6600.swipeout-actions-left > span:after,
6601.swipeout-actions-right > span:after,
6602.swipeout-actions-left > div:after,
6603.swipeout-actions-right > div:after {
6604 content: '';
6605 position: absolute;
6606 top: 0;
6607 width: 600%;
6608 height: 100%;
6609 background: inherit;
6610 z-index: -1;
6611 -webkit-transform: translate3d(0, 0, 0);
6612 transform: translate3d(0, 0, 0);
6613 pointer-events: none;
6614}
6615.swipeout-actions-right {
6616 right: 0%;
6617 -webkit-transform: translateX(100%);
6618 transform: translateX(100%);
6619}
6620.swipeout-actions-right > a:after,
6621.swipeout-actions-right > button:after,
6622.swipeout-actions-right > span:after,
6623.swipeout-actions-right > div:after {
6624 left: 100%;
6625 margin-left: -1px;
6626}
6627.swipeout-actions-left {
6628 left: 0%;
6629 -webkit-transform: translateX(-100%);
6630 transform: translateX(-100%);
6631}
6632.swipeout-actions-left > a:after,
6633.swipeout-actions-left > button:after,
6634.swipeout-actions-left > span:after,
6635.swipeout-actions-left > div:after {
6636 right: 100%;
6637 margin-right: -1px;
6638}
6639.md .swipeout-actions-left > a,
6640.md .swipeout-actions-right > a,
6641.md .swipeout-actions-left > button,
6642.md .swipeout-actions-right > button,
6643.md .swipeout-actions-left > span,
6644.md .swipeout-actions-right > span,
6645.md .swipeout-actions-left > div,
6646.md .swipeout-actions-right > div {
6647 padding: 0 24px;
6648 color: #fff;
6649}
6650.md .swipeout-actions-left .swipeout-delete,
6651.md .swipeout-actions-right .swipeout-delete {
6652 background: #f44336;
6653}
6654.md .swipeout-actions-left > a.color-red,
6655.md .swipeout-actions-right > a.color-red,
6656.md .swipeout-actions-left > button.color-red,
6657.md .swipeout-actions-right > button.color-red,
6658.md .swipeout-actions-left > span.color-red,
6659.md .swipeout-actions-right > span.color-red,
6660.md .swipeout-actions-left > div.color-red,
6661.md .swipeout-actions-right > div.color-red {
6662 background-color: #f44336;
6663}
6664.md .swipeout-actions-left > a.color-green,
6665.md .swipeout-actions-right > a.color-green,
6666.md .swipeout-actions-left > button.color-green,
6667.md .swipeout-actions-right > button.color-green,
6668.md .swipeout-actions-left > span.color-green,
6669.md .swipeout-actions-right > span.color-green,
6670.md .swipeout-actions-left > div.color-green,
6671.md .swipeout-actions-right > div.color-green {
6672 background-color: #4caf50;
6673}
6674.md .swipeout-actions-left > a.color-blue,
6675.md .swipeout-actions-right > a.color-blue,
6676.md .swipeout-actions-left > button.color-blue,
6677.md .swipeout-actions-right > button.color-blue,
6678.md .swipeout-actions-left > span.color-blue,
6679.md .swipeout-actions-right > span.color-blue,
6680.md .swipeout-actions-left > div.color-blue,
6681.md .swipeout-actions-right > div.color-blue {
6682 background-color: #2196f3;
6683}
6684.md .swipeout-actions-left > a.color-pink,
6685.md .swipeout-actions-right > a.color-pink,
6686.md .swipeout-actions-left > button.color-pink,
6687.md .swipeout-actions-right > button.color-pink,
6688.md .swipeout-actions-left > span.color-pink,
6689.md .swipeout-actions-right > span.color-pink,
6690.md .swipeout-actions-left > div.color-pink,
6691.md .swipeout-actions-right > div.color-pink {
6692 background-color: #e91e63;
6693}
6694.md .swipeout-actions-left > a.color-yellow,
6695.md .swipeout-actions-right > a.color-yellow,
6696.md .swipeout-actions-left > button.color-yellow,
6697.md .swipeout-actions-right > button.color-yellow,
6698.md .swipeout-actions-left > span.color-yellow,
6699.md .swipeout-actions-right > span.color-yellow,
6700.md .swipeout-actions-left > div.color-yellow,
6701.md .swipeout-actions-right > div.color-yellow {
6702 background-color: #ffeb3b;
6703}
6704.md .swipeout-actions-left > a.color-orange,
6705.md .swipeout-actions-right > a.color-orange,
6706.md .swipeout-actions-left > button.color-orange,
6707.md .swipeout-actions-right > button.color-orange,
6708.md .swipeout-actions-left > span.color-orange,
6709.md .swipeout-actions-right > span.color-orange,
6710.md .swipeout-actions-left > div.color-orange,
6711.md .swipeout-actions-right > div.color-orange {
6712 background-color: #ff9800;
6713}
6714.md .swipeout-actions-left > a.color-gray,
6715.md .swipeout-actions-right > a.color-gray,
6716.md .swipeout-actions-left > button.color-gray,
6717.md .swipeout-actions-right > button.color-gray,
6718.md .swipeout-actions-left > span.color-gray,
6719.md .swipeout-actions-right > span.color-gray,
6720.md .swipeout-actions-left > div.color-gray,
6721.md .swipeout-actions-right > div.color-gray {
6722 background-color: #9e9e9e;
6723}
6724.md .swipeout-actions-left > a.color-white,
6725.md .swipeout-actions-right > a.color-white,
6726.md .swipeout-actions-left > button.color-white,
6727.md .swipeout-actions-right > button.color-white,
6728.md .swipeout-actions-left > span.color-white,
6729.md .swipeout-actions-right > span.color-white,
6730.md .swipeout-actions-left > div.color-white,
6731.md .swipeout-actions-right > div.color-white {
6732 background-color: #ffffff;
6733}
6734.md .swipeout-actions-left > a.color-black,
6735.md .swipeout-actions-right > a.color-black,
6736.md .swipeout-actions-left > button.color-black,
6737.md .swipeout-actions-right > button.color-black,
6738.md .swipeout-actions-left > span.color-black,
6739.md .swipeout-actions-right > span.color-black,
6740.md .swipeout-actions-left > div.color-black,
6741.md .swipeout-actions-right > div.color-black {
6742 background-color: #000000;
6743}
6744/* === Accordion === */
6745.accordion-item-toggle {
6746 cursor: pointer;
6747 -webkit-transition-duration: 300ms;
6748 transition-duration: 300ms;
6749}
6750.accordion-item-toggle.active-state {
6751 -webkit-transition-duration: 300ms;
6752 transition-duration: 300ms;
6753}
6754.accordion-item-toggle.active-state > .item-inner:after {
6755 background-color: transparent;
6756}
6757.accordion-item-toggle .item-inner {
6758 -webkit-transition-duration: 300ms;
6759 transition-duration: 300ms;
6760 -webkit-transition-property: background-color;
6761 transition-property: background-color;
6762}
6763.accordion-item-toggle .item-inner:after {
6764 -webkit-transition-duration: 300ms;
6765 transition-duration: 300ms;
6766}
6767.accordion-item .item-link .item-inner:after {
6768 -webkit-transition-duration: 300ms;
6769 transition-duration: 300ms;
6770}
6771.accordion-item .list,
6772.accordion-item .block {
6773 margin-top: 0;
6774 margin-bottom: 0;
6775}
6776.accordion-item .block > h1:first-child,
6777.accordion-item .block > h2:first-child,
6778.accordion-item .block > h3:first-child,
6779.accordion-item .block > h4:first-child,
6780.accordion-item .block > p:first-child {
6781 margin-top: 10px;
6782}
6783.accordion-item .block > h1:last-child,
6784.accordion-item .block > h2:last-child,
6785.accordion-item .block > h3:last-child,
6786.accordion-item .block > h4:last-child,
6787.accordion-item .block > p:last-child {
6788 margin-bottom: 10px;
6789}
6790.accordion-item-opened .accordion-item-toggle .item-inner:after,
6791.accordion-item-opened > .item-link .item-inner:after {
6792 background-color: transparent;
6793}
6794.list li.accordion-item ul {
6795 padding-left: 0;
6796}
6797.accordion-item-content {
6798 position: relative;
6799 overflow: hidden;
6800 height: 0;
6801 font-size: 14px;
6802 -webkit-transition-duration: 300ms;
6803 transition-duration: 300ms;
6804}
6805.accordion-item-opened > .accordion-item-content {
6806 height: auto;
6807}
6808html.device-android-4 .accordion-item-content {
6809 -webkit-transform: none;
6810 transform: none;
6811}
6812.md .list .accordion-item-toggle .item-inner {
6813 padding-right: 42px;
6814 background: no-repeat calc(100% - 16px) center;
6815}
6816.md .list .accordion-item-toggle.active-state {
6817 background-color: rgba(0, 0, 0, 0.1);
6818}
6819.md .list .accordion-item-toggle .item-inner,
6820.md .list:not(.media-list) .accordion-item:not(.media-item) .accordion-item-toggle .item-inner,
6821.md .list:not(.media-list) .accordion-item:not(.media-item) > .item-link .item-inner,
6822.md .media-list .accordion-item .accordion-item-toggle .item-title-row,
6823.md .media-list .accordion-item > .item-link .item-title-row,
6824.md .accordion-item.media-item .accordion-item-toggle .item-title-row,
6825.md .accordion-item.media-item > .item-link .item-title-row,
6826.md .links-list .accordion-item > a {
6827 background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D'13px'%20height%3D'8px'%20viewBox%3D'0%200%208%2013'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%3Cpolygon%20fill%3D'%23c7c7cc'%20transform%3D'translate(6.5%2C%206.5)%20rotate(-315)%20translate(-10%2C%20-6.5)'%20points%3D'11%2011%2011%202%209%202%209%209%202%209%202%2011%2010%2011'%3E%3C%2Fpolygon%3E%3C%2Fsvg%3E");
6828 background-size: 13px 13px;
6829}
6830.md .list .accordion-item-toggle.accordion-item-opened .item-inner,
6831.md .list:not(.media-list) .accordion-item-opened:not(.media-item) .accordion-item-toggle .item-inner,
6832.md .list:not(.media-list) .accordion-item-opened:not(.media-item) > .item-link .item-inner,
6833.md .media-list .accordion-item-opened .accordion-item-toggle .item-title-row,
6834.md .media-list .accordion-item-opened > .item-link .item-title-row,
6835.md .accordion-item-opened.media-item .accordion-item-toggle .item-title-row,
6836.md .accordion-item-opened.media-item > .item-link .item-title-row,
6837.md .links-list .accordion-item-opened > a {
6838 background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D'13px'%20height%3D'8px'%20viewBox%3D'0%200%208%2013'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%3Cpolygon%20fill%3D'%23c7c7cc'%20transform%3D'translate(1.5%2C%206.5)%20rotate(-135)%20translate(-10%2C%20-6.5)'%20points%3D'11%2011%2011%202%209%202%209%209%202%209%202%2011%2010%2011'%3E%3C%2Fpolygon%3E%3C%2Fsvg%3E");
6839}
6840.md .theme-dark .list .accordion-item-toggle .item-inner,
6841.md .theme-dark .list:not(.media-list) .accordion-item:not(.media-item) .accordion-item-toggle .item-inner,
6842.md .theme-dark .list:not(.media-list) .accordion-item:not(.media-item) > .item-link .item-inner,
6843.md .theme-dark .media-list .accordion-item .accordion-item-toggle .item-title-row,
6844.md .theme-dark .media-list .accordion-item > .item-link .item-title-row,
6845.md .theme-dark .accordion-item.media-item .accordion-item-toggle .item-title-row,
6846.md .theme-dark .accordion-item.media-item > .item-link .item-title-row,
6847.md .theme-dark .links-list .accordion-item > a {
6848 background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D'13px'%20height%3D'8px'%20viewBox%3D'0%200%208%2013'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%3Cpolygon%20fill%3D'%23434345'%20transform%3D'translate(6.5%2C%206.5)%20rotate(-315)%20translate(-10%2C%20-6.5)'%20points%3D'11%2011%2011%202%209%202%209%209%202%209%202%2011%2010%2011'%3E%3C%2Fpolygon%3E%3C%2Fsvg%3E");
6849}
6850.md .theme-dark .list .accordion-item-toggle.accordion-item-opened .item-inner,
6851.md .theme-dark .list:not(.media-list) .accordion-item-opened:not(.media-item) .accordion-item-toggle .item-inner,
6852.md .theme-dark .list:not(.media-list) .accordion-item-opened:not(.media-item) > .item-link .item-inner,
6853.md .theme-dark .media-list .accordion-item-opened .accordion-item-toggle .item-title-row,
6854.md .theme-dark .media-list .accordion-item-opened > .item-link .item-title-row,
6855.md .theme-dark .accordion-item-opened.media-item .accordion-item-toggle .item-title-row,
6856.md .theme-dark .accordion-item-opened.media-item > .item-link .item-title-row,
6857.md .theme-dark .links-list .accordion-item-opened > a {
6858 background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D'13px'%20height%3D'8px'%20viewBox%3D'0%200%208%2013'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%3Cpolygon%20fill%3D'%23434345'%20transform%3D'translate(1.5%2C%206.5)%20rotate(-135)%20translate(-10%2C%20-6.5)'%20points%3D'11%2011%2011%202%209%202%209%209%202%209%202%2011%2010%2011'%3E%3C%2Fpolygon%3E%3C%2Fsvg%3E");
6859}
6860/* === Contacts === */
6861.contacts-list .list-group:first-child ul:before {
6862 display: none !important;
6863}
6864.contacts-list .list-group:last-child ul:after {
6865 display: none !important;
6866}
6867.md .contacts-list {
6868 margin: 0;
6869}
6870.md .contacts-list .list-group-title {
6871 padding: 0 16px;
6872 pointer-events: none;
6873 background: none;
6874 color: #2196f3;
6875 font-weight: 500;
6876 line-height: 48px;
6877 height: 48px;
6878 font-size: 20px;
6879 overflow: visible;
6880 width: 56px;
6881}
6882.md .contacts-list .list-group-title + li {
6883 margin-top: -48px;
6884}
6885.md .contacts-list li:not(.list-group-title) {
6886 padding-left: 56px;
6887}
6888.md .theme-dark .contacts-list .list-group-title {
6889 color: #fff;
6890}
6891/* === Virtual List === */
6892/* === Indexed List === */
6893.list-index {
6894 position: absolute;
6895 top: 0;
6896 bottom: 0;
6897 right: 0;
6898 text-align: center;
6899 z-index: 10;
6900 width: 16px;
6901 cursor: pointer;
6902 -webkit-user-select: none;
6903 -moz-user-select: none;
6904 -ms-user-select: none;
6905 user-select: none;
6906}
6907.list-index:before {
6908 content: '';
6909 position: absolute;
6910 width: 20px;
6911 top: 0;
6912 right: 100%;
6913 height: 100%;
6914}
6915.list-index ul {
6916 font-size: 11px;
6917 font-weight: 600;
6918 list-style: none;
6919 margin: 0;
6920 padding: 0;
6921 display: -webkit-box;
6922 display: -webkit-flex;
6923 display: -ms-flexbox;
6924 display: flex;
6925 -webkit-box-orient: vertical;
6926 -webkit-box-direction: normal;
6927 -webkit-flex-direction: column;
6928 -ms-flex-direction: column;
6929 flex-direction: column;
6930 -webkit-box-pack: center;
6931 -webkit-justify-content: center;
6932 -ms-flex-pack: center;
6933 justify-content: center;
6934 -webkit-box-align: center;
6935 -webkit-align-items: center;
6936 -ms-flex-align: center;
6937 align-items: center;
6938 -webkit-flex-shrink: 0;
6939 -ms-flex-negative: 0;
6940 flex-shrink: 0;
6941 height: 100%;
6942 width: 100%;
6943 position: relative;
6944}
6945.list-index li {
6946 margin: 0;
6947 padding: 0;
6948 list-style: none;
6949 position: relative;
6950 height: 14px;
6951 line-height: 14px;
6952 -webkit-flex-shrink: 0;
6953 -ms-flex-negative: 0;
6954 flex-shrink: 0;
6955 display: block;
6956 width: 100%;
6957}
6958.list-index .list-index-skip-placeholder:after {
6959 content: '';
6960 position: absolute;
6961 left: 50%;
6962 top: 50%;
6963 border-radius: 50%;
6964}
6965.list-index .list-index-label {
6966 position: absolute;
6967 bottom: 0;
6968 right: 100%;
6969 text-align: center;
6970 border-radius: 50%;
6971 color: #fff;
6972 font-weight: 500;
6973}
6974.md .list-index ul {
6975 color: #2196f3;
6976}
6977.md .list-index .list-index-skip-placeholder:after {
6978 content: '';
6979 width: 4px;
6980 height: 4px;
6981 margin-left: -2px;
6982 margin-top: -2px;
6983 background: #2196f3;
6984}
6985.md .list-index .list-index-label {
6986 width: 56px;
6987 height: 56px;
6988 line-height: 56px;
6989 border-radius: 50% 50% 0 50%;
6990 background: #2196f3;
6991 font-size: 20px;
6992}
6993.md .navbar ~ .list-index {
6994 top: 56px;
6995}
6996@media (min-width: 768px) {
6997 .md .navbar ~ .list-index {
6998 top: 64px;
6999 }
7000}
7001.md .navbar ~ .toolbar:not(.toolbar-bottom-md) ~ .list-index,
7002.md .navbar ~ .subnavbar ~ .list-index,
7003.md .page-with-subnavbar .navbar ~ .list-index {
7004 top: 104px;
7005}
7006.md .navbar ~ .tabbar-labels:not(.toolbar-bottom-md) ~ .list-index {
7007 top: 128px;
7008}
7009.md .toolbar-bottom-md ~ .page > .list-index,
7010.md .toolbar-bottom-md ~ * .page > .list-index,
7011.md .toolbar-bottom-md ~ * .page > .list-index {
7012 bottom: 48px;
7013}
7014.md .tabbar-labels.toolbar-bottom-md ~ .page > .list-index,
7015.md .tabbar-labels.toolbar-bottom-md ~ * .page > .list-index,
7016.md .tabbar-labels.toolbar-bottom-md ~ .list-index {
7017 bottom: 56px;
7018}
7019.md.device-iphone-x .toolbar-bottom-md ~ .page > .list-index,
7020.md.device-iphone-x .toolbar-bottom-md ~ * .page > .list-index,
7021.md.device-iphone-x .toolbar-bottom-md ~ * .page > .list-index {
7022 bottom: calc(48px + constant(safe-area-inset-bottom));
7023 bottom: calc(48px + env(safe-area-inset-bottom));
7024}
7025.md.device-iphone-x .tabbar-labels.toolbar-bottom-md ~ .page > .list-index,
7026.md.device-iphone-x .tabbar-labels.toolbar-bottom-md ~ * .page > .list-index,
7027.md.device-iphone-x .tabbar-labels.toolbar-bottom-md ~ .list-index {
7028 bottom: calc(56px + constant(safe-area-inset-bottom));
7029 bottom: calc(56px + env(safe-area-inset-bottom));
7030}
7031.md .color-theme-red .list-index ul,
7032.md .list-index.color-theme-red ul {
7033 color: #f44336;
7034}
7035.md .color-theme-red .list-index .list-index-skip-placeholder:after,
7036.md .list-index.color-theme-red .list-index-skip-placeholder:after,
7037.md .color-theme-red .list-index .list-index-label,
7038.md .list-index.color-theme-red .list-index-label {
7039 background-color: #f44336;
7040}
7041.md .color-theme-green .list-index ul,
7042.md .list-index.color-theme-green ul {
7043 color: #4caf50;
7044}
7045.md .color-theme-green .list-index .list-index-skip-placeholder:after,
7046.md .list-index.color-theme-green .list-index-skip-placeholder:after,
7047.md .color-theme-green .list-index .list-index-label,
7048.md .list-index.color-theme-green .list-index-label {
7049 background-color: #4caf50;
7050}
7051.md .color-theme-blue .list-index ul,
7052.md .list-index.color-theme-blue ul {
7053 color: #2196f3;
7054}
7055.md .color-theme-blue .list-index .list-index-skip-placeholder:after,
7056.md .list-index.color-theme-blue .list-index-skip-placeholder:after,
7057.md .color-theme-blue .list-index .list-index-label,
7058.md .list-index.color-theme-blue .list-index-label {
7059 background-color: #2196f3;
7060}
7061.md .color-theme-pink .list-index ul,
7062.md .list-index.color-theme-pink ul {
7063 color: #e91e63;
7064}
7065.md .color-theme-pink .list-index .list-index-skip-placeholder:after,
7066.md .list-index.color-theme-pink .list-index-skip-placeholder:after,
7067.md .color-theme-pink .list-index .list-index-label,
7068.md .list-index.color-theme-pink .list-index-label {
7069 background-color: #e91e63;
7070}
7071.md .color-theme-yellow .list-index ul,
7072.md .list-index.color-theme-yellow ul {
7073 color: #ffeb3b;
7074}
7075.md .color-theme-yellow .list-index .list-index-skip-placeholder:after,
7076.md .list-index.color-theme-yellow .list-index-skip-placeholder:after,
7077.md .color-theme-yellow .list-index .list-index-label,
7078.md .list-index.color-theme-yellow .list-index-label {
7079 background-color: #ffeb3b;
7080}
7081.md .color-theme-orange .list-index ul,
7082.md .list-index.color-theme-orange ul {
7083 color: #ff9800;
7084}
7085.md .color-theme-orange .list-index .list-index-skip-placeholder:after,
7086.md .list-index.color-theme-orange .list-index-skip-placeholder:after,
7087.md .color-theme-orange .list-index .list-index-label,
7088.md .list-index.color-theme-orange .list-index-label {
7089 background-color: #ff9800;
7090}
7091.md .color-theme-gray .list-index ul,
7092.md .list-index.color-theme-gray ul {
7093 color: #9e9e9e;
7094}
7095.md .color-theme-gray .list-index .list-index-skip-placeholder:after,
7096.md .list-index.color-theme-gray .list-index-skip-placeholder:after,
7097.md .color-theme-gray .list-index .list-index-label,
7098.md .list-index.color-theme-gray .list-index-label {
7099 background-color: #9e9e9e;
7100}
7101.md .color-theme-white .list-index ul,
7102.md .list-index.color-theme-white ul {
7103 color: #ffffff;
7104}
7105.md .color-theme-white .list-index .list-index-skip-placeholder:after,
7106.md .list-index.color-theme-white .list-index-skip-placeholder:after,
7107.md .color-theme-white .list-index .list-index-label,
7108.md .list-index.color-theme-white .list-index-label {
7109 background-color: #ffffff;
7110}
7111.md .color-theme-black .list-index ul,
7112.md .list-index.color-theme-black ul {
7113 color: #000000;
7114}
7115.md .color-theme-black .list-index .list-index-skip-placeholder:after,
7116.md .list-index.color-theme-black .list-index-skip-placeholder:after,
7117.md .color-theme-black .list-index .list-index-label,
7118.md .list-index.color-theme-black .list-index-label {
7119 background-color: #000000;
7120}
7121.md .list-index.color-red ul {
7122 color: #f44336;
7123}
7124.md .list-index.color-red .list-index-skip-placeholder:after,
7125.md .list-index.color-red .list-index-label {
7126 background-color: #f44336;
7127}
7128.md .list-index.color-green ul {
7129 color: #4caf50;
7130}
7131.md .list-index.color-green .list-index-skip-placeholder:after,
7132.md .list-index.color-green .list-index-label {
7133 background-color: #4caf50;
7134}
7135.md .list-index.color-blue ul {
7136 color: #2196f3;
7137}
7138.md .list-index.color-blue .list-index-skip-placeholder:after,
7139.md .list-index.color-blue .list-index-label {
7140 background-color: #2196f3;
7141}
7142.md .list-index.color-pink ul {
7143 color: #e91e63;
7144}
7145.md .list-index.color-pink .list-index-skip-placeholder:after,
7146.md .list-index.color-pink .list-index-label {
7147 background-color: #e91e63;
7148}
7149.md .list-index.color-yellow ul {
7150 color: #ffeb3b;
7151}
7152.md .list-index.color-yellow .list-index-skip-placeholder:after,
7153.md .list-index.color-yellow .list-index-label {
7154 background-color: #ffeb3b;
7155}
7156.md .list-index.color-orange ul {
7157 color: #ff9800;
7158}
7159.md .list-index.color-orange .list-index-skip-placeholder:after,
7160.md .list-index.color-orange .list-index-label {
7161 background-color: #ff9800;
7162}
7163.md .list-index.color-gray ul {
7164 color: #9e9e9e;
7165}
7166.md .list-index.color-gray .list-index-skip-placeholder:after,
7167.md .list-index.color-gray .list-index-label {
7168 background-color: #9e9e9e;
7169}
7170.md .list-index.color-white ul {
7171 color: #ffffff;
7172}
7173.md .list-index.color-white .list-index-skip-placeholder:after,
7174.md .list-index.color-white .list-index-label {
7175 background-color: #ffffff;
7176}
7177.md .list-index.color-black ul {
7178 color: #000000;
7179}
7180.md .list-index.color-black .list-index-skip-placeholder:after,
7181.md .list-index.color-black .list-index-label {
7182 background-color: #000000;
7183}
7184/* === Timeline === */
7185.timeline {
7186 -webkit-box-sizing: border-box;
7187 box-sizing: border-box;
7188}
7189.block-strong .timeline {
7190 padding: 0;
7191 margin: 0;
7192}
7193.timeline-item {
7194 display: -webkit-box;
7195 display: -webkit-flex;
7196 display: -ms-flexbox;
7197 display: flex;
7198 -webkit-box-pack: start;
7199 -webkit-justify-content: flex-start;
7200 -ms-flex-pack: start;
7201 justify-content: flex-start;
7202 overflow: hidden;
7203 -webkit-box-sizing: border-box;
7204 box-sizing: border-box;
7205 position: relative;
7206}
7207.timeline-item-date {
7208 -webkit-flex-shrink: 0;
7209 -ms-flex-negative: 0;
7210 flex-shrink: 0;
7211 width: 50px;
7212 text-align: right;
7213 -webkit-box-sizing: border-box;
7214 box-sizing: border-box;
7215}
7216.timeline-item-date small {
7217 font-size: 10px;
7218}
7219.timeline-item-content {
7220 margin: 2px;
7221 min-width: 0;
7222 position: relative;
7223 -webkit-flex-shrink: 10;
7224 -ms-flex-negative: 10;
7225 flex-shrink: 10;
7226}
7227.timeline-item-content p:first-child,
7228.timeline-item-content ul:first-child,
7229.timeline-item-content ol:first-child,
7230.timeline-item-content h1:first-child,
7231.timeline-item-content h2:first-child,
7232.timeline-item-content h3:first-child,
7233.timeline-item-content h4:first-child {
7234 margin-top: 0;
7235}
7236.timeline-item-content p:last-child,
7237.timeline-item-content ul:last-child,
7238.timeline-item-content ol:last-child,
7239.timeline-item-content h1:last-child,
7240.timeline-item-content h2:last-child,
7241.timeline-item-content h3:last-child,
7242.timeline-item-content h4:last-child {
7243 margin-bottom: 0;
7244}
7245.timeline-item-inner {
7246 background: #fff;
7247 -webkit-box-sizing: border-box;
7248 box-sizing: border-box;
7249}
7250.timeline-item-inner .block {
7251 padding: 0;
7252 color: inherit;
7253}
7254.timeline-item-inner .block-strong {
7255 padding-left: 0;
7256 padding-right: 0;
7257 margin: 0;
7258}
7259.timeline-item-inner .block-strong:before {
7260 display: none !important;
7261}
7262.timeline-item-inner .block-strong:after {
7263 display: none !important;
7264}
7265.timeline-item-inner .list ul:before {
7266 display: none !important;
7267}
7268.timeline-item-inner .list ul:after {
7269 display: none !important;
7270}
7271.timeline-item-divider {
7272 width: 1px;
7273 position: relative;
7274 width: 10px;
7275 height: 10px;
7276 background: #bbb;
7277 border-radius: 50%;
7278 margin-top: 3px;
7279 -webkit-flex-shrink: 0;
7280 -ms-flex-negative: 0;
7281 flex-shrink: 0;
7282}
7283.timeline-item-divider:after,
7284.timeline-item-divider:before {
7285 content: ' ';
7286 width: 1px;
7287 height: 100vh;
7288 position: absolute;
7289 left: 50%;
7290 background: inherit;
7291 -webkit-transform: translate3d(-50%, 0, 0);
7292 transform: translate3d(-50%, 0, 0);
7293}
7294.timeline-item-divider:after {
7295 top: 100%;
7296}
7297.timeline-item-divider:before {
7298 bottom: 100%;
7299}
7300.timeline-item:last-child .timeline-item-divider:after {
7301 display: none;
7302}
7303.timeline-item:first-child .timeline-item-divider:before {
7304 display: none;
7305}
7306.timeline-item-time {
7307 font-size: 13px;
7308}
7309.timeline-item-time:first-child,
7310.timeline-item-time:last-child {
7311 margin-top: 0;
7312}
7313.timeline-item-title + .timeline-item-time {
7314 margin-top: 0;
7315}
7316.timeline-horizontal {
7317 height: 100%;
7318 display: -webkit-box;
7319 display: -webkit-flex;
7320 display: -ms-flexbox;
7321 display: flex;
7322}
7323.timeline-horizontal .timeline-item {
7324 display: block;
7325 width: 33.33333333vw;
7326 margin: 0;
7327 padding: 0;
7328 -webkit-flex-shrink: 0;
7329 -ms-flex-negative: 0;
7330 flex-shrink: 0;
7331 position: relative;
7332 height: 100%;
7333}
7334.timeline-horizontal .timeline-item-date {
7335 width: auto;
7336 line-height: 34px;
7337 position: absolute;
7338 left: 0;
7339 top: 0;
7340 width: 100%;
7341 height: 34px;
7342 text-align: left;
7343}
7344.timeline-horizontal .timeline-item-content {
7345 overflow: auto;
7346 -webkit-overflow-scrolling: touch;
7347 margin: 0;
7348}
7349.timeline-horizontal .timeline-item-divider {
7350 display: none;
7351}
7352.timeline-horizontal.col-100 .timeline-item {
7353 width: 100vw;
7354}
7355.timeline-horizontal.col-95 .timeline-item {
7356 width: 95vw;
7357}
7358.timeline-horizontal.col-90 .timeline-item {
7359 width: 90vw;
7360}
7361.timeline-horizontal.col-85 .timeline-item {
7362 width: 85vw;
7363}
7364.timeline-horizontal.col-80 .timeline-item {
7365 width: 80vw;
7366}
7367.timeline-horizontal.col-75 .timeline-item {
7368 width: 75vw;
7369}
7370.timeline-horizontal.col-70 .timeline-item {
7371 width: 70vw;
7372}
7373.timeline-horizontal.col-66 .timeline-item {
7374 width: 66.66666666666666vw;
7375}
7376.timeline-horizontal.col-65 .timeline-item {
7377 width: 65vw;
7378}
7379.timeline-horizontal.col-60 .timeline-item {
7380 width: 60vw;
7381}
7382.timeline-horizontal.col-55 .timeline-item {
7383 width: 55vw;
7384}
7385.timeline-horizontal.col-50 .timeline-item {
7386 width: 50vw;
7387}
7388.timeline-horizontal.col-45 .timeline-item {
7389 width: 45vw;
7390}
7391.timeline-horizontal.col-40 .timeline-item {
7392 width: 40vw;
7393}
7394.timeline-horizontal.col-35 .timeline-item {
7395 width: 35vw;
7396}
7397.timeline-horizontal.col-33 .timeline-item {
7398 width: 33.333333333333336vw;
7399}
7400.timeline-horizontal.col-30 .timeline-item {
7401 width: 30vw;
7402}
7403.timeline-horizontal.col-25 .timeline-item {
7404 width: 25vw;
7405}
7406.timeline-horizontal.col-20 .timeline-item {
7407 width: 20vw;
7408}
7409.timeline-horizontal.col-15 .timeline-item {
7410 width: 15vw;
7411}
7412.timeline-horizontal.col-10 .timeline-item {
7413 width: 10vw;
7414}
7415.timeline-horizontal.col-5 .timeline-item {
7416 width: 5vw;
7417}
7418@media (min-width: 768px) {
7419 .timeline-horizontal.tablet-100 .timeline-item {
7420 width: 100vw;
7421 }
7422 .timeline-horizontal.tablet-95 .timeline-item {
7423 width: 95vw;
7424 }
7425 .timeline-horizontal.tablet-90 .timeline-item {
7426 width: 90vw;
7427 }
7428 .timeline-horizontal.tablet-85 .timeline-item {
7429 width: 85vw;
7430 }
7431 .timeline-horizontal.tablet-80 .timeline-item {
7432 width: 80vw;
7433 }
7434 .timeline-horizontal.tablet-75 .timeline-item {
7435 width: 75vw;
7436 }
7437 .timeline-horizontal.tablet-70 .timeline-item {
7438 width: 70vw;
7439 }
7440 .timeline-horizontal.tablet-66 .timeline-item {
7441 width: 66.66666666666666vw;
7442 }
7443 .timeline-horizontal.tablet-65 .timeline-item {
7444 width: 65vw;
7445 }
7446 .timeline-horizontal.tablet-60 .timeline-item {
7447 width: 60vw;
7448 }
7449 .timeline-horizontal.tablet-55 .timeline-item {
7450 width: 55vw;
7451 }
7452 .timeline-horizontal.tablet-50 .timeline-item {
7453 width: 50vw;
7454 }
7455 .timeline-horizontal.tablet-45 .timeline-item {
7456 width: 45vw;
7457 }
7458 .timeline-horizontal.tablet-40 .timeline-item {
7459 width: 40vw;
7460 }
7461 .timeline-horizontal.tablet-35 .timeline-item {
7462 width: 35vw;
7463 }
7464 .timeline-horizontal.tablet-33 .timeline-item {
7465 width: 33.333333333333336vw;
7466 }
7467 .timeline-horizontal.tablet-30 .timeline-item {
7468 width: 30vw;
7469 }
7470 .timeline-horizontal.tablet-25 .timeline-item {
7471 width: 25vw;
7472 }
7473 .timeline-horizontal.tablet-20 .timeline-item {
7474 width: 20vw;
7475 }
7476 .timeline-horizontal.tablet-15 .timeline-item {
7477 width: 15vw;
7478 }
7479 .timeline-horizontal.tablet-10 .timeline-item {
7480 width: 10vw;
7481 }
7482 .timeline-horizontal.tablet-5 .timeline-item {
7483 width: 5vw;
7484 }
7485}
7486.timeline-horizontal .timeline-year,
7487.timeline-horizontal .timeline-month {
7488 display: -webkit-box;
7489 display: -webkit-flex;
7490 display: -ms-flexbox;
7491 display: flex;
7492 -webkit-flex-shrink: 0;
7493 -ms-flex-negative: 0;
7494 flex-shrink: 0;
7495 padding-top: 24px;
7496 position: relative;
7497 -webkit-box-sizing: border-box;
7498 box-sizing: border-box;
7499 height: 100%;
7500}
7501.timeline-horizontal .timeline-year-title,
7502.timeline-horizontal .timeline-month-title {
7503 position: absolute;
7504 left: 0;
7505 top: 0;
7506 width: 100%;
7507 line-height: 24px;
7508 height: 24px;
7509 -webkit-box-sizing: border-box;
7510 box-sizing: border-box;
7511}
7512.timeline-horizontal .timeline-year-title span,
7513.timeline-horizontal .timeline-month-title span {
7514 display: inline-block;
7515 position: -webkit-sticky;
7516 position: sticky;
7517}
7518.timeline-horizontal .timeline-year-title {
7519 font-size: 16px;
7520}
7521.timeline-horizontal .timeline-month-title span {
7522 margin-top: -2px;
7523}
7524/* === Timeline MD === */
7525.md .timeline {
7526 margin: 32px 0;
7527 padding: 0 16px;
7528}
7529.md .block-strong .timeline {
7530 padding: 0;
7531 margin: 0;
7532}
7533.md .timeline-item {
7534 padding: 2px 0px 16px;
7535}
7536.md .timeline-item:last-child {
7537 padding-bottom: 2px;
7538}
7539.md .timeline-item-content .card,
7540.md .timeline-item-content.card,
7541.md .timeline-item-content .list,
7542.md .timeline-item-content.list,
7543.md .timeline-item-content .block,
7544.md .timeline-item-content.block {
7545 margin: 0;
7546 width: 100%;
7547}
7548.md .timeline-item-content .card + .card,
7549.md .timeline-item-content .list + .card,
7550.md .timeline-item-content .block + .card,
7551.md .timeline-item-content .card + .list,
7552.md .timeline-item-content .list + .list,
7553.md .timeline-item-content .block + .list,
7554.md .timeline-item-content .card + .block,
7555.md .timeline-item-content .list + .block,
7556.md .timeline-item-content .block + .block {
7557 margin: 16px 0 0;
7558}
7559.md .timeline-item-inner {
7560 border-radius: 2px;
7561 padding: 8px 16px;
7562 -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
7563 box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
7564}
7565.md .timeline-item-inner + .timeline-item-inner {
7566 margin-top: 16px;
7567}
7568.md .timeline-item-divider {
7569 margin-left: 16px;
7570 margin-right: 16px;
7571}
7572.md .timeline-item-time {
7573 margin-top: 16px;
7574 color: rgba(0, 0, 0, 0.54);
7575}
7576.md .timeline-item-time:first-child {
7577 margin-top: 0;
7578}
7579.md .timeline-item-title {
7580 font-size: 16px;
7581}
7582.md .timeline-sides .timeline-item {
7583 margin-left: calc(50% - (32px + 10px) / 2 - 50px);
7584 margin-right: 0;
7585}
7586.md .timeline-sides .timeline-item .timeline-item-date {
7587 text-align: right;
7588}
7589.md .timeline-sides .timeline-item:not(.timeline-item-right):nth-child(2n) {
7590 -webkit-box-orient: horizontal;
7591 -webkit-box-direction: reverse;
7592 -webkit-flex-direction: row-reverse;
7593 -ms-flex-direction: row-reverse;
7594 flex-direction: row-reverse;
7595 margin-right: calc(50% - (32px + 10px) / 2 - 50px);
7596 margin-left: 0;
7597}
7598.md .timeline-sides .timeline-item:not(.timeline-item-right):nth-child(2n) .timeline-item-date {
7599 text-align: left;
7600}
7601.md .timeline-sides .timeline-item-left {
7602 -webkit-box-orient: horizontal;
7603 -webkit-box-direction: reverse;
7604 -webkit-flex-direction: row-reverse;
7605 -ms-flex-direction: row-reverse;
7606 flex-direction: row-reverse;
7607 margin-right: calc(50% - (32px + 10px) / 2 - 50px);
7608 margin-left: 0;
7609}
7610.md .timeline-sides .timeline-item-left .timeline-item-date {
7611 text-align: left;
7612}
7613.md .timeline-sides .timeline-item-right {
7614 margin-left: calc(50% - (32px + 10px) / 2 - 50px);
7615 margin-right: 0;
7616}
7617.md .timeline-sides .timeline-item-right .timeline-item-date {
7618 text-align: right;
7619}
7620@media (min-width: 768px) {
7621 .md .tablet-sides .timeline-item {
7622 margin-left: calc(50% - (32px + 10px) / 2 - 50px);
7623 margin-right: 0;
7624 }
7625 .md .tablet-sides .timeline-item .timeline-item-date {
7626 text-align: right;
7627 }
7628 .md .tablet-sides .timeline-item:not(.timeline-item-right):nth-child(2n) {
7629 -webkit-box-orient: horizontal;
7630 -webkit-box-direction: reverse;
7631 -webkit-flex-direction: row-reverse;
7632 -ms-flex-direction: row-reverse;
7633 flex-direction: row-reverse;
7634 margin-right: calc(50% - (32px + 10px) / 2 - 50px);
7635 margin-left: 0;
7636 }
7637 .md .tablet-sides .timeline-item:not(.timeline-item-right):nth-child(2n) .timeline-item-date {
7638 text-align: left;
7639 }
7640 .md .tablet-sides .timeline-item-left {
7641 -webkit-box-orient: horizontal;
7642 -webkit-box-direction: reverse;
7643 -webkit-flex-direction: row-reverse;
7644 -ms-flex-direction: row-reverse;
7645 flex-direction: row-reverse;
7646 margin-right: calc(50% - (32px + 10px) / 2 - 50px);
7647 margin-left: 0;
7648 }
7649 .md .tablet-sides .timeline-item-left .timeline-item-date {
7650 text-align: left;
7651 }
7652 .md .tablet-sides .timeline-item-right {
7653 margin-left: calc(50% - (32px + 10px) / 2 - 50px);
7654 margin-right: 0;
7655 }
7656 .md .tablet-sides .timeline-item-right .timeline-item-date {
7657 text-align: right;
7658 }
7659}
7660.md .timeline-horizontal {
7661 padding: 0;
7662 margin: 0;
7663 position: relative;
7664}
7665.md .timeline-horizontal .timeline-item {
7666 padding-top: 34px !important;
7667 padding-bottom: 12px;
7668}
7669.md .timeline-horizontal .timeline-item-date {
7670 background: #2196f3;
7671 padding: 0px 12px;
7672 color: #fff;
7673}
7674.md .timeline-horizontal .timeline-item-date:after {
7675 content: '';
7676 position: absolute;
7677 right: 0;
7678 width: 100%;
7679 top: 100%;
7680 bottom: auto;
7681 height: 10px;
7682 pointer-events: none;
7683 background: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0.3)), color-stop(40%, rgba(0, 0, 0, 0.1)), color-stop(50%, rgba(0, 0, 0, 0.05)), color-stop(80%, rgba(0, 0, 0, 0)), to(rgba(0, 0, 0, 0)));
7684 background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0.3) 0%, rgba(0, 0, 0, 0.1) 40%, rgba(0, 0, 0, 0.05) 50%, rgba(0, 0, 0, 0) 80%, rgba(0, 0, 0, 0) 100%);
7685 background: linear-gradient(to bottom, rgba(0, 0, 0, 0.3) 0%, rgba(0, 0, 0, 0.1) 40%, rgba(0, 0, 0, 0.05) 50%, rgba(0, 0, 0, 0) 80%, rgba(0, 0, 0, 0) 100%);
7686}
7687.md .timeline-horizontal .timeline-item-content {
7688 padding: 12px;
7689 height: calc(100% - 12px);
7690}
7691.md .timeline-horizontal.no-shadow .timeline-item-date:after {
7692 display: none;
7693}
7694.md .timeline-horizontal .timeline-item:after {
7695 content: '';
7696 position: absolute;
7697 background-color: rgba(0, 0, 0, 0.12);
7698 display: block;
7699 z-index: 15;
7700 top: 0;
7701 right: 0;
7702 bottom: auto;
7703 left: auto;
7704 width: 1px;
7705 height: 100%;
7706 -webkit-transform-origin: 100% 50%;
7707 transform-origin: 100% 50%;
7708}
7709.md.device-pixel-ratio-2 .timeline-horizontal .timeline-item:after {
7710 -webkit-transform: scaleX(0.5);
7711 transform: scaleX(0.5);
7712}
7713.md.device-pixel-ratio-3 .timeline-horizontal .timeline-item:after {
7714 -webkit-transform: scaleX(0.33);
7715 transform: scaleX(0.33);
7716}
7717.md .timeline-horizontal .timeline-item:before {
7718 content: '';
7719 position: absolute;
7720 background-color: rgba(0, 0, 0, 0.12);
7721 display: block;
7722 z-index: 15;
7723 top: 0;
7724 right: auto;
7725 bottom: auto;
7726 left: 0;
7727 height: 1px;
7728 width: 100%;
7729 -webkit-transform-origin: 50% 0%;
7730 transform-origin: 50% 0%;
7731}
7732.md.device-pixel-ratio-2 .timeline-horizontal .timeline-item:before {
7733 -webkit-transform: scaleY(0.5);
7734 transform: scaleY(0.5);
7735}
7736.md.device-pixel-ratio-3 .timeline-horizontal .timeline-item:before {
7737 -webkit-transform: scaleY(0.33);
7738 transform: scaleY(0.33);
7739}
7740.md .timeline-year-title,
7741.md .timeline-month-title {
7742 padding: 0 12px;
7743 color: #fff;
7744 background: #2196f3;
7745}
7746.md .timeline-year-title span,
7747.md .timeline-month-title span {
7748 left: 12px;
7749}
7750.md .timeline-year-title span {
7751 margin-top: 2px;
7752}
7753@media (orientation: landscape) {
7754 .md.device-iphone-x .ios-left-edge .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge),
7755 .md.device-iphone-x .ios-edges .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge),
7756 .md.device-iphone-x .popup .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge),
7757 .md.device-iphone-x .sheet-modal .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge),
7758 .md.device-iphone-x .panel-left .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge) {
7759 padding-left: constant(safe-area-inset-left);
7760 padding-left: env(safe-area-inset-left);
7761 }
7762 .md.device-iphone-x .ios-left-edge .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge) .timeline-year-title span,
7763 .md.device-iphone-x .ios-edges .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge) .timeline-year-title span,
7764 .md.device-iphone-x .popup .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge) .timeline-year-title span,
7765 .md.device-iphone-x .sheet-modal .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge) .timeline-year-title span,
7766 .md.device-iphone-x .panel-left .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge) .timeline-year-title span,
7767 .md.device-iphone-x .ios-left-edge .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge) .timeline-month-title span,
7768 .md.device-iphone-x .ios-edges .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge) .timeline-month-title span,
7769 .md.device-iphone-x .popup .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge) .timeline-month-title span,
7770 .md.device-iphone-x .sheet-modal .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge) .timeline-month-title span,
7771 .md.device-iphone-x .panel-left .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge) .timeline-month-title span {
7772 left: calc(12px + constant(safe-area-inset-left));
7773 left: calc(12px + env(safe-area-inset-left));
7774 }
7775 .md.device-iphone-x .ios-left-edge .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge) .timeline-year:first-child .timeline-year-title,
7776 .md.device-iphone-x .ios-edges .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge) .timeline-year:first-child .timeline-year-title,
7777 .md.device-iphone-x .popup .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge) .timeline-year:first-child .timeline-year-title,
7778 .md.device-iphone-x .sheet-modal .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge) .timeline-year:first-child .timeline-year-title,
7779 .md.device-iphone-x .panel-left .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge) .timeline-year:first-child .timeline-year-title,
7780 .md.device-iphone-x .ios-left-edge .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge) .timeline-year:first-child .timeline-month:first-child .timeline-month-title,
7781 .md.device-iphone-x .ios-edges .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge) .timeline-year:first-child .timeline-month:first-child .timeline-month-title,
7782 .md.device-iphone-x .popup .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge) .timeline-year:first-child .timeline-month:first-child .timeline-month-title,
7783 .md.device-iphone-x .sheet-modal .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge) .timeline-year:first-child .timeline-month:first-child .timeline-month-title,
7784 .md.device-iphone-x .panel-left .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge) .timeline-year:first-child .timeline-month:first-child .timeline-month-title,
7785 .md.device-iphone-x .ios-left-edge .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge) .timeline-year:first-child .timeline-year-title + .timeline-month .timeline-month-title,
7786 .md.device-iphone-x .ios-edges .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge) .timeline-year:first-child .timeline-year-title + .timeline-month .timeline-month-title,
7787 .md.device-iphone-x .popup .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge) .timeline-year:first-child .timeline-year-title + .timeline-month .timeline-month-title,
7788 .md.device-iphone-x .sheet-modal .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge) .timeline-year:first-child .timeline-year-title + .timeline-month .timeline-month-title,
7789 .md.device-iphone-x .panel-left .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge) .timeline-year:first-child .timeline-year-title + .timeline-month .timeline-month-title {
7790 left: -44px;
7791 right: 0;
7792 width: auto;
7793 }
7794 .md.device-iphone-x .ios-left-edge .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge) > .timeline-item:first-child,
7795 .md.device-iphone-x .ios-edges .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge) > .timeline-item:first-child,
7796 .md.device-iphone-x .popup .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge) > .timeline-item:first-child,
7797 .md.device-iphone-x .sheet-modal .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge) > .timeline-item:first-child,
7798 .md.device-iphone-x .panel-left .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge) > .timeline-item:first-child,
7799 .md.device-iphone-x .ios-left-edge .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge) .timeline-year:first-child .timeline-month:first-child .timeline-item:first-child,
7800 .md.device-iphone-x .ios-edges .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge) .timeline-year:first-child .timeline-month:first-child .timeline-item:first-child,
7801 .md.device-iphone-x .popup .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge) .timeline-year:first-child .timeline-month:first-child .timeline-item:first-child,
7802 .md.device-iphone-x .sheet-modal .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge) .timeline-year:first-child .timeline-month:first-child .timeline-item:first-child,
7803 .md.device-iphone-x .panel-left .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge) .timeline-year:first-child .timeline-month:first-child .timeline-item:first-child,
7804 .md.device-iphone-x .ios-left-edge .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge) .timeline-year:first-child .timeline-year-title + .timeline-month .timeline-item:first-child,
7805 .md.device-iphone-x .ios-edges .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge) .timeline-year:first-child .timeline-year-title + .timeline-month .timeline-item:first-child,
7806 .md.device-iphone-x .popup .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge) .timeline-year:first-child .timeline-year-title + .timeline-month .timeline-item:first-child,
7807 .md.device-iphone-x .sheet-modal .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge) .timeline-year:first-child .timeline-year-title + .timeline-month .timeline-item:first-child,
7808 .md.device-iphone-x .panel-left .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge) .timeline-year:first-child .timeline-year-title + .timeline-month .timeline-item:first-child,
7809 .md.device-iphone-x .ios-left-edge .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge) .timeline-year:first-child .timeline-year-title + .timeline-month .timeline-month-title + .timeline-item,
7810 .md.device-iphone-x .ios-edges .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge) .timeline-year:first-child .timeline-year-title + .timeline-month .timeline-month-title + .timeline-item,
7811 .md.device-iphone-x .popup .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge) .timeline-year:first-child .timeline-year-title + .timeline-month .timeline-month-title + .timeline-item,
7812 .md.device-iphone-x .sheet-modal .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge) .timeline-year:first-child .timeline-year-title + .timeline-month .timeline-month-title + .timeline-item,
7813 .md.device-iphone-x .panel-left .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge) .timeline-year:first-child .timeline-year-title + .timeline-month .timeline-month-title + .timeline-item {
7814 overflow: visible;
7815 }
7816 .md.device-iphone-x .ios-left-edge .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge) > .timeline-item:first-child .timeline-item-date,
7817 .md.device-iphone-x .ios-edges .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge) > .timeline-item:first-child .timeline-item-date,
7818 .md.device-iphone-x .popup .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge) > .timeline-item:first-child .timeline-item-date,
7819 .md.device-iphone-x .sheet-modal .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge) > .timeline-item:first-child .timeline-item-date,
7820 .md.device-iphone-x .panel-left .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge) > .timeline-item:first-child .timeline-item-date,
7821 .md.device-iphone-x .ios-left-edge .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge) .timeline-year:first-child .timeline-month:first-child .timeline-item:first-child .timeline-item-date,
7822 .md.device-iphone-x .ios-edges .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge) .timeline-year:first-child .timeline-month:first-child .timeline-item:first-child .timeline-item-date,
7823 .md.device-iphone-x .popup .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge) .timeline-year:first-child .timeline-month:first-child .timeline-item:first-child .timeline-item-date,
7824 .md.device-iphone-x .sheet-modal .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge) .timeline-year:first-child .timeline-month:first-child .timeline-item:first-child .timeline-item-date,
7825 .md.device-iphone-x .panel-left .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge) .timeline-year:first-child .timeline-month:first-child .timeline-item:first-child .timeline-item-date,
7826 .md.device-iphone-x .ios-left-edge .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge) .timeline-year:first-child .timeline-year-title + .timeline-month .timeline-item:first-child .timeline-item-date,
7827 .md.device-iphone-x .ios-edges .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge) .timeline-year:first-child .timeline-year-title + .timeline-month .timeline-item:first-child .timeline-item-date,
7828 .md.device-iphone-x .popup .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge) .timeline-year:first-child .timeline-year-title + .timeline-month .timeline-item:first-child .timeline-item-date,
7829 .md.device-iphone-x .sheet-modal .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge) .timeline-year:first-child .timeline-year-title + .timeline-month .timeline-item:first-child .timeline-item-date,
7830 .md.device-iphone-x .panel-left .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge) .timeline-year:first-child .timeline-year-title + .timeline-month .timeline-item:first-child .timeline-item-date,
7831 .md.device-iphone-x .ios-left-edge .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge) .timeline-year:first-child .timeline-year-title + .timeline-month .timeline-month-title + .timeline-item .timeline-item-date,
7832 .md.device-iphone-x .ios-edges .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge) .timeline-year:first-child .timeline-year-title + .timeline-month .timeline-month-title + .timeline-item .timeline-item-date,
7833 .md.device-iphone-x .popup .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge) .timeline-year:first-child .timeline-year-title + .timeline-month .timeline-month-title + .timeline-item .timeline-item-date,
7834 .md.device-iphone-x .sheet-modal .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge) .timeline-year:first-child .timeline-year-title + .timeline-month .timeline-month-title + .timeline-item .timeline-item-date,
7835 .md.device-iphone-x .panel-left .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge) .timeline-year:first-child .timeline-year-title + .timeline-month .timeline-month-title + .timeline-item .timeline-item-date {
7836 width: auto;
7837 padding-left: calc(12px + constant(safe-area-inset-left));
7838 padding-left: calc(12px + env(safe-area-inset-left));
7839 left: calc(0px - constant(safe-area-inset-left));
7840 left: calc(0px - env(safe-area-inset-left));
7841 right: 0;
7842 }
7843 .md.device-iphone-x .ios-left-edge .timeline:not(.no-ios-edges):not(.no-ios-left-edge):not(.timeline-horizontal),
7844 .md.device-iphone-x .ios-edges .timeline:not(.no-ios-edges):not(.no-ios-left-edge):not(.timeline-horizontal),
7845 .md.device-iphone-x .popup .timeline:not(.no-ios-edges):not(.no-ios-left-edge):not(.timeline-horizontal),
7846 .md.device-iphone-x .sheet-modal .timeline:not(.no-ios-edges):not(.no-ios-left-edge):not(.timeline-horizontal),
7847 .md.device-iphone-x .panel-left .timeline:not(.no-ios-edges):not(.no-ios-left-edge):not(.timeline-horizontal) {
7848 padding-left: calc(16px + constant(safe-area-inset-left));
7849 padding-left: calc(16px + env(safe-area-inset-left));
7850 }
7851 .md.device-iphone-x .ios-right-edge .timeline-horizontal:not(.no-ios-edges):not(.no-ios-right-edge) .timeline-year:last-child .timeline-year-title,
7852 .md.device-iphone-x .ios-edges .timeline-horizontal:not(.no-ios-edges):not(.no-ios-right-edge) .timeline-year:last-child .timeline-year-title,
7853 .md.device-iphone-x .popup .timeline-horizontal:not(.no-ios-edges):not(.no-ios-right-edge) .timeline-year:last-child .timeline-year-title,
7854 .md.device-iphone-x .sheet-modal .timeline-horizontal:not(.no-ios-edges):not(.no-ios-right-edge) .timeline-year:last-child .timeline-year-title,
7855 .md.device-iphone-x .panel-right .timeline-horizontal:not(.no-ios-edges):not(.no-ios-right-edge) .timeline-year:last-child .timeline-year-title,
7856 .md.device-iphone-x .ios-right-edge .timeline-horizontal:not(.no-ios-edges):not(.no-ios-right-edge) .timeline-year:last-child .timeline-month:last-child .timeline-month-title,
7857 .md.device-iphone-x .ios-edges .timeline-horizontal:not(.no-ios-edges):not(.no-ios-right-edge) .timeline-year:last-child .timeline-month:last-child .timeline-month-title,
7858 .md.device-iphone-x .popup .timeline-horizontal:not(.no-ios-edges):not(.no-ios-right-edge) .timeline-year:last-child .timeline-month:last-child .timeline-month-title,
7859 .md.device-iphone-x .sheet-modal .timeline-horizontal:not(.no-ios-edges):not(.no-ios-right-edge) .timeline-year:last-child .timeline-month:last-child .timeline-month-title,
7860 .md.device-iphone-x .panel-right .timeline-horizontal:not(.no-ios-edges):not(.no-ios-right-edge) .timeline-year:last-child .timeline-month:last-child .timeline-month-title {
7861 width: auto;
7862 right: calc(0px - constant(safe-area-inset-right));
7863 right: calc(0px - env(safe-area-inset-right));
7864 }
7865 .md.device-iphone-x .ios-right-edge .timeline-horizontal:not(.no-ios-edges):not(.no-ios-right-edge) > .timeline-item:last-child,
7866 .md.device-iphone-x .ios-edges .timeline-horizontal:not(.no-ios-edges):not(.no-ios-right-edge) > .timeline-item:last-child,
7867 .md.device-iphone-x .popup .timeline-horizontal:not(.no-ios-edges):not(.no-ios-right-edge) > .timeline-item:last-child,
7868 .md.device-iphone-x .sheet-modal .timeline-horizontal:not(.no-ios-edges):not(.no-ios-right-edge) > .timeline-item:last-child,
7869 .md.device-iphone-x .panel-right .timeline-horizontal:not(.no-ios-edges):not(.no-ios-right-edge) > .timeline-item:last-child,
7870 .md.device-iphone-x .ios-right-edge .timeline-horizontal:not(.no-ios-edges):not(.no-ios-right-edge) .timeline-year:last-child .timeline-month:last-child .timeline-item:last-child,
7871 .md.device-iphone-x .ios-edges .timeline-horizontal:not(.no-ios-edges):not(.no-ios-right-edge) .timeline-year:last-child .timeline-month:last-child .timeline-item:last-child,
7872 .md.device-iphone-x .popup .timeline-horizontal:not(.no-ios-edges):not(.no-ios-right-edge) .timeline-year:last-child .timeline-month:last-child .timeline-item:last-child,
7873 .md.device-iphone-x .sheet-modal .timeline-horizontal:not(.no-ios-edges):not(.no-ios-right-edge) .timeline-year:last-child .timeline-month:last-child .timeline-item:last-child,
7874 .md.device-iphone-x .panel-right .timeline-horizontal:not(.no-ios-edges):not(.no-ios-right-edge) .timeline-year:last-child .timeline-month:last-child .timeline-item:last-child {
7875 overflow: visible;
7876 }
7877 .md.device-iphone-x .ios-right-edge .timeline-horizontal:not(.no-ios-edges):not(.no-ios-right-edge) > .timeline-item:last-child .timeline-item-date,
7878 .md.device-iphone-x .ios-edges .timeline-horizontal:not(.no-ios-edges):not(.no-ios-right-edge) > .timeline-item:last-child .timeline-item-date,
7879 .md.device-iphone-x .popup .timeline-horizontal:not(.no-ios-edges):not(.no-ios-right-edge) > .timeline-item:last-child .timeline-item-date,
7880 .md.device-iphone-x .sheet-modal .timeline-horizontal:not(.no-ios-edges):not(.no-ios-right-edge) > .timeline-item:last-child .timeline-item-date,
7881 .md.device-iphone-x .panel-right .timeline-horizontal:not(.no-ios-edges):not(.no-ios-right-edge) > .timeline-item:last-child .timeline-item-date,
7882 .md.device-iphone-x .ios-right-edge .timeline-horizontal:not(.no-ios-edges):not(.no-ios-right-edge) .timeline-year:last-child .timeline-month:last-child .timeline-item:last-child .timeline-item-date,
7883 .md.device-iphone-x .ios-edges .timeline-horizontal:not(.no-ios-edges):not(.no-ios-right-edge) .timeline-year:last-child .timeline-month:last-child .timeline-item:last-child .timeline-item-date,
7884 .md.device-iphone-x .popup .timeline-horizontal:not(.no-ios-edges):not(.no-ios-right-edge) .timeline-year:last-child .timeline-month:last-child .timeline-item:last-child .timeline-item-date,
7885 .md.device-iphone-x .sheet-modal .timeline-horizontal:not(.no-ios-edges):not(.no-ios-right-edge) .timeline-year:last-child .timeline-month:last-child .timeline-item:last-child .timeline-item-date,
7886 .md.device-iphone-x .panel-right .timeline-horizontal:not(.no-ios-edges):not(.no-ios-right-edge) .timeline-year:last-child .timeline-month:last-child .timeline-item:last-child .timeline-item-date {
7887 width: auto;
7888 right: calc(0px - constant(safe-area-inset-right));
7889 right: calc(0px - env(safe-area-inset-right));
7890 left: 0;
7891 }
7892 .md.device-iphone-x .ios-right-edge .timeline:not(.no-ios-edges):not(.no-ios-right-edge):not(.timeline-horizontal),
7893 .md.device-iphone-x .ios-edges .timeline:not(.no-ios-edges):not(.no-ios-right-edge):not(.timeline-horizontal),
7894 .md.device-iphone-x .popup .timeline:not(.no-ios-edges):not(.no-ios-right-edge):not(.timeline-horizontal),
7895 .md.device-iphone-x .sheet-modal .timeline:not(.no-ios-edges):not(.no-ios-right-edge):not(.timeline-horizontal),
7896 .md.device-iphone-x .panel-right .timeline:not(.no-ios-edges):not(.no-ios-right-edge):not(.timeline-horizontal) {
7897 padding-right: calc(16px + constant(safe-area-inset-right));
7898 padding-right: calc(16px + env(safe-area-inset-right));
7899 }
7900}
7901.md .theme-dark .timeline-item-inner {
7902 background-color: rgba(255, 255, 255, 0.03);
7903}
7904.md .theme-dark .timeline-item-time {
7905 color: rgba(255, 255, 255, 0.54);
7906}
7907.md .color-theme-red .timeline-item-date,
7908.md .color-theme-red .timeline-year-title,
7909.md .color-theme-red .timeline-month-title {
7910 background: #f44336;
7911}
7912.md .color-theme-green .timeline-item-date,
7913.md .color-theme-green .timeline-year-title,
7914.md .color-theme-green .timeline-month-title {
7915 background: #4caf50;
7916}
7917.md .color-theme-blue .timeline-item-date,
7918.md .color-theme-blue .timeline-year-title,
7919.md .color-theme-blue .timeline-month-title {
7920 background: #2196f3;
7921}
7922.md .color-theme-pink .timeline-item-date,
7923.md .color-theme-pink .timeline-year-title,
7924.md .color-theme-pink .timeline-month-title {
7925 background: #e91e63;
7926}
7927.md .color-theme-yellow .timeline-item-date,
7928.md .color-theme-yellow .timeline-year-title,
7929.md .color-theme-yellow .timeline-month-title {
7930 background: #ffeb3b;
7931}
7932.md .color-theme-orange .timeline-item-date,
7933.md .color-theme-orange .timeline-year-title,
7934.md .color-theme-orange .timeline-month-title {
7935 background: #ff9800;
7936}
7937.md .color-theme-gray .timeline-item-date,
7938.md .color-theme-gray .timeline-year-title,
7939.md .color-theme-gray .timeline-month-title {
7940 background: #9e9e9e;
7941}
7942.md .color-theme-white .timeline-item-date,
7943.md .color-theme-white .timeline-year-title,
7944.md .color-theme-white .timeline-month-title {
7945 background: #ffffff;
7946}
7947.md .color-theme-black .timeline-item-date,
7948.md .color-theme-black .timeline-year-title,
7949.md .color-theme-black .timeline-month-title {
7950 background: #000000;
7951}
7952.md .timeline.color-theme-red .timeline-item-date,
7953.md .timeline.color-theme-red .timeline-year-title,
7954.md .timeline.color-theme-red .timeline-month-title {
7955 background: #f44336;
7956}
7957.md .timeline.color-theme-green .timeline-item-date,
7958.md .timeline.color-theme-green .timeline-year-title,
7959.md .timeline.color-theme-green .timeline-month-title {
7960 background: #4caf50;
7961}
7962.md .timeline.color-theme-blue .timeline-item-date,
7963.md .timeline.color-theme-blue .timeline-year-title,
7964.md .timeline.color-theme-blue .timeline-month-title {
7965 background: #2196f3;
7966}
7967.md .timeline.color-theme-pink .timeline-item-date,
7968.md .timeline.color-theme-pink .timeline-year-title,
7969.md .timeline.color-theme-pink .timeline-month-title {
7970 background: #e91e63;
7971}
7972.md .timeline.color-theme-yellow .timeline-item-date,
7973.md .timeline.color-theme-yellow .timeline-year-title,
7974.md .timeline.color-theme-yellow .timeline-month-title {
7975 background: #ffeb3b;
7976}
7977.md .timeline.color-theme-orange .timeline-item-date,
7978.md .timeline.color-theme-orange .timeline-year-title,
7979.md .timeline.color-theme-orange .timeline-month-title {
7980 background: #ff9800;
7981}
7982.md .timeline.color-theme-gray .timeline-item-date,
7983.md .timeline.color-theme-gray .timeline-year-title,
7984.md .timeline.color-theme-gray .timeline-month-title {
7985 background: #9e9e9e;
7986}
7987.md .timeline.color-theme-white .timeline-item-date,
7988.md .timeline.color-theme-white .timeline-year-title,
7989.md .timeline.color-theme-white .timeline-month-title {
7990 background: #ffffff;
7991}
7992.md .timeline.color-theme-black .timeline-item-date,
7993.md .timeline.color-theme-black .timeline-year-title,
7994.md .timeline.color-theme-black .timeline-month-title {
7995 background: #000000;
7996}
7997/* === Tabs === */
7998.tabs .tab {
7999 display: none;
8000}
8001.tabs .tab-active {
8002 display: block;
8003}
8004.tabs-animated-wrap {
8005 position: relative;
8006 width: 100%;
8007 overflow: hidden;
8008 height: 100%;
8009}
8010.tabs-animated-wrap > .tabs {
8011 display: -webkit-box;
8012 display: -webkit-flex;
8013 display: -ms-flexbox;
8014 display: flex;
8015 height: 100%;
8016 -webkit-transition-duration: 300ms;
8017 transition-duration: 300ms;
8018}
8019.tabs-animated-wrap > .tabs > .tab {
8020 width: 100%;
8021 display: block;
8022 -webkit-flex-shrink: 0;
8023 -ms-flex-negative: 0;
8024 flex-shrink: 0;
8025}
8026.tabs-animated-wrap.not-animated > .tabs {
8027 -webkit-transition-duration: 300ms;
8028 transition-duration: 300ms;
8029}
8030.tabs-swipeable-wrap {
8031 height: 100%;
8032}
8033.tabs-swipeable-wrap > .tabs {
8034 height: 100%;
8035}
8036.tabs-swipeable-wrap > .tabs > .tab {
8037 display: block;
8038}
8039.page > .tabs {
8040 height: 100%;
8041}
8042/* === Panels === */
8043.panel-backdrop {
8044 position: absolute;
8045 left: 0;
8046 top: 0;
8047 width: 100%;
8048 height: 100%;
8049 opacity: 0;
8050 z-index: 5999;
8051 display: none;
8052 -webkit-transform: translate3d(0, 0, 0);
8053 transform: translate3d(0, 0, 0);
8054}
8055.panel-backdrop.not-animated {
8056 -webkit-transition-duration: 0ms !important;
8057 transition-duration: 0ms !important;
8058}
8059.panel {
8060 z-index: 1000;
8061 display: none;
8062 -webkit-box-sizing: border-box;
8063 box-sizing: border-box;
8064 position: absolute;
8065 overflow: auto;
8066 -webkit-overflow-scrolling: touch;
8067 top: 0;
8068 height: 100%;
8069 -webkit-transform: translate3d(0, 0, 0);
8070 transform: translate3d(0, 0, 0);
8071 width: 260px;
8072 background-color: #fff;
8073}
8074.panel.not-animated {
8075 -webkit-transition-duration: 0ms !important;
8076 transition-duration: 0ms !important;
8077}
8078.panel.panel-reveal.not-animated ~ .views,
8079.panel.panel-reveal.not-animated ~ .view {
8080 -webkit-transition-duration: 0ms !important;
8081 transition-duration: 0ms !important;
8082}
8083.panel-cover {
8084 z-index: 6000;
8085}
8086.panel-left {
8087 left: 0;
8088}
8089.panel-left.panel-cover {
8090 -webkit-transform: translate3d(-100%, 0, 0);
8091 transform: translate3d(-100%, 0, 0);
8092}
8093.panel-right {
8094 right: 0;
8095}
8096.panel-right.panel-cover {
8097 -webkit-transform: translate3d(100%, 0, 0);
8098 transform: translate3d(100%, 0, 0);
8099}
8100.panel-visible-by-breakpoint {
8101 display: block;
8102 -webkit-transform: translate3d(0, 0, 0) !important;
8103 transform: translate3d(0, 0, 0) !important;
8104}
8105.panel-visible-by-breakpoint.panel-cover {
8106 z-index: 5900;
8107}
8108html.with-panel .framework7-root > .views .page-content,
8109html.with-panel .framework7-root > .view .page-content {
8110 overflow: hidden;
8111 -webkit-overflow-scrolling: auto;
8112}
8113html.with-panel-left-cover .panel-backdrop,
8114html.with-panel-right-cover .panel-backdrop {
8115 display: block;
8116 opacity: 1;
8117}
8118html.with-panel-left-reveal .panel-backdrop,
8119html.with-panel-right-reveal .panel-backdrop,
8120html.with-panel-transitioning .panel-backdrop {
8121 background: rgba(0, 0, 0, 0);
8122 display: block;
8123 opacity: 0;
8124}
8125html.with-panel-left-reveal .views,
8126html.with-panel-left-reveal .framework7-root > .view,
8127html.with-panel-left-reveal .panel-backdrop {
8128 -webkit-transform: translate3d(260px, 0, 0);
8129 transform: translate3d(260px, 0, 0);
8130}
8131html.with-panel-right-reveal .views,
8132html.with-panel-right-reveal .framework7-root > .view,
8133html.with-panel-right-reveal .panel-backdrop {
8134 -webkit-transform: translate3d(-260px, 0, 0);
8135 transform: translate3d(-260px, 0, 0);
8136}
8137html.with-panel-left-cover .panel-left {
8138 -webkit-transform: translate3d(0px, 0, 0);
8139 transform: translate3d(0px, 0, 0);
8140}
8141html.with-panel-right-cover .panel-right {
8142 -webkit-transform: translate3d(0px, 0, 0);
8143 transform: translate3d(0px, 0, 0);
8144}
8145html.with-statusbar.device-ios .panel,
8146html.with-statusbar.ios:not(.device-ios):not(.device-android) .panel {
8147 top: 20px;
8148 height: calc(100% - 20px);
8149}
8150html.with-statusbar.device-android .panel,
8151html.with-statusbar.md:not(.device-ios):not(.device-android) .panel {
8152 top: 24px;
8153 height: calc(100% - 24px);
8154}
8155html.with-statusbar.device-iphone-x .panel {
8156 top: constant(safe-area-inset-top);
8157 top: env(safe-area-inset-top);
8158 height: calc(100% - constant(safe-area-inset-top));
8159 height: calc(100% - env(safe-area-inset-top));
8160}
8161.md .panel-backdrop {
8162 -webkit-transition-duration: 300ms;
8163 transition-duration: 300ms;
8164 background: rgba(0, 0, 0, 0.2);
8165}
8166.md .panel {
8167 -webkit-transition-duration: 300ms;
8168 transition-duration: 300ms;
8169}
8170.md .panel-visible {
8171 display: block;
8172}
8173.md .panel-visible-by-breakpoint {
8174 -webkit-box-shadow: none;
8175 box-shadow: none;
8176}
8177.md.with-panel-left-cover .panel-cover,
8178.md.with-panel-right-cover .panel-cover {
8179 -webkit-box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.5);
8180 box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.5);
8181}
8182.md.with-panel-left-reveal .views,
8183.md.with-panel-right-reveal .views,
8184.md.with-panel-left-reveal .framework7-root > .view,
8185.md.with-panel-right-reveal .framework7-root > .view {
8186 -webkit-box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.5);
8187 box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.5);
8188}
8189.md.with-panel-left-reveal .views,
8190.md.with-panel-right-reveal .views,
8191.md.with-panel-transitioning .views,
8192.md.with-panel-left-reveal .framework7-root > .view,
8193.md.with-panel-right-reveal .framework7-root > .view,
8194.md.with-panel-transitioning .framework7-root > .view {
8195 -webkit-transition-duration: 300ms;
8196 transition-duration: 300ms;
8197 -webkit-transition-property: -webkit-transform, -webkit-box-shadow;
8198 transition-property: -webkit-transform, -webkit-box-shadow;
8199 transition-property: transform, box-shadow;
8200 transition-property: transform, box-shadow, -webkit-transform, -webkit-box-shadow;
8201}
8202/* === Card === */
8203.cards-list > ul:before,
8204.card .list > ul:before {
8205 display: none !important;
8206}
8207.cards-list > ul:after,
8208.card .list > ul:after {
8209 display: none !important;
8210}
8211.card {
8212 background: #fff;
8213 position: relative;
8214 border-radius: 4px;
8215 font-size: 14px;
8216}
8217.card .list,
8218.card .block {
8219 margin: 0;
8220}
8221.row:not(.no-gap) .col > .card {
8222 margin-left: 0;
8223 margin-right: 0;
8224}
8225.card-content {
8226 position: relative;
8227}
8228.card-content-padding {
8229 position: relative;
8230}
8231.card-content-padding > p:first-child {
8232 margin-top: 0;
8233}
8234.card-content-padding > p:last-child {
8235 margin-bottom: 0;
8236}
8237.card-header,
8238.card-footer {
8239 min-height: 44px;
8240 position: relative;
8241 -webkit-box-sizing: border-box;
8242 box-sizing: border-box;
8243 display: -webkit-box;
8244 display: -webkit-flex;
8245 display: -ms-flexbox;
8246 display: flex;
8247 -webkit-box-pack: justify;
8248 -webkit-justify-content: space-between;
8249 -ms-flex-pack: justify;
8250 justify-content: space-between;
8251 -webkit-box-align: center;
8252 -webkit-align-items: center;
8253 -ms-flex-align: center;
8254 align-items: center;
8255}
8256.card-header[valign="top"],
8257.card-footer[valign="top"] {
8258 -webkit-box-align: start;
8259 -webkit-align-items: flex-start;
8260 -ms-flex-align: start;
8261 align-items: flex-start;
8262}
8263.card-header[valign="bottom"],
8264.card-footer[valign="bottom"] {
8265 -webkit-box-align: end;
8266 -webkit-align-items: flex-end;
8267 -ms-flex-align: end;
8268 align-items: flex-end;
8269}
8270.card-header a.link,
8271.card-footer a.link {
8272 position: relative;
8273}
8274.card-header a.link i.icon,
8275.card-footer a.link i.icon {
8276 display: block;
8277}
8278.card-header a.icon-only,
8279.card-footer a.icon-only {
8280 display: -webkit-box;
8281 display: -webkit-flex;
8282 display: -ms-flexbox;
8283 display: flex;
8284 -webkit-box-pack: center;
8285 -webkit-justify-content: center;
8286 -ms-flex-pack: center;
8287 justify-content: center;
8288 -webkit-box-align: center;
8289 -webkit-align-items: center;
8290 -ms-flex-align: center;
8291 align-items: center;
8292 margin: 0;
8293}
8294.card-header {
8295 border-radius: 4px 4px 0 0;
8296}
8297.card-header:after {
8298 content: '';
8299 position: absolute;
8300 background-color: #e1e1e1;
8301 display: block;
8302 z-index: 15;
8303 top: auto;
8304 right: auto;
8305 bottom: 0;
8306 left: 0;
8307 height: 1px;
8308 width: 100%;
8309 -webkit-transform-origin: 50% 100%;
8310 transform-origin: 50% 100%;
8311}
8312html.device-pixel-ratio-2 .card-header:after {
8313 -webkit-transform: scaleY(0.5);
8314 transform: scaleY(0.5);
8315}
8316html.device-pixel-ratio-3 .card-header:after {
8317 -webkit-transform: scaleY(0.33);
8318 transform: scaleY(0.33);
8319}
8320.card-header.no-hairline:after {
8321 display: none !important;
8322}
8323.card-footer {
8324 border-radius: 0 0 4px 4px;
8325}
8326.card-footer:before {
8327 content: '';
8328 position: absolute;
8329 background-color: #e1e1e1;
8330 display: block;
8331 z-index: 15;
8332 top: 0;
8333 right: auto;
8334 bottom: auto;
8335 left: 0;
8336 height: 1px;
8337 width: 100%;
8338 -webkit-transform-origin: 50% 0%;
8339 transform-origin: 50% 0%;
8340}
8341html.device-pixel-ratio-2 .card-footer:before {
8342 -webkit-transform: scaleY(0.5);
8343 transform: scaleY(0.5);
8344}
8345html.device-pixel-ratio-3 .card-footer:before {
8346 -webkit-transform: scaleY(0.33);
8347 transform: scaleY(0.33);
8348}
8349.card-footer.no-hairline:before {
8350 display: none !important;
8351}
8352.md .cards-list ul,
8353.md .card .list ul {
8354 background: none;
8355}
8356.md .card {
8357 margin: 8px;
8358 -webkit-box-shadow: 0px 2px 1px -1px rgba(0, 0, 0, 0.2), 0px 1px 1px 0px rgba(0, 0, 0, 0.14), 0px 1px 3px 0px rgba(0, 0, 0, 0.12);
8359 box-shadow: 0px 2px 1px -1px rgba(0, 0, 0, 0.2), 0px 1px 1px 0px rgba(0, 0, 0, 0.14), 0px 1px 3px 0px rgba(0, 0, 0, 0.12);
8360}
8361.md .card-outline {
8362 -webkit-box-shadow: none;
8363 box-shadow: none;
8364 border: 1px solid rgba(0, 0, 0, 0.12);
8365}
8366.md .card-header a.link,
8367.md .card-footer a.link {
8368 text-decoration: none;
8369 text-align: center;
8370 display: block;
8371 -webkit-appearance: none;
8372 -moz-appearance: none;
8373 appearance: none;
8374 background: none;
8375 padding: 0 10px;
8376 margin: 0;
8377 white-space: nowrap;
8378 text-overflow: ellipsis;
8379 font-size: 14px;
8380 position: relative;
8381 overflow: hidden;
8382 font-family: inherit;
8383 cursor: pointer;
8384 outline: 0;
8385 -webkit-box-sizing: border-box;
8386 box-sizing: border-box;
8387 vertical-align: middle;
8388 color: #2196f3;
8389 border-radius: 4px;
8390 line-height: 36px;
8391 height: 36px;
8392 text-transform: uppercase;
8393 min-width: 64px;
8394 padding: 0 8px;
8395 border: none;
8396 -webkit-transition-duration: 300ms;
8397 transition-duration: 300ms;
8398 -webkit-transform: translate3d(0, 0, 0);
8399 transform: translate3d(0, 0, 0);
8400 font-weight: 500;
8401 letter-spacing: 0.03em;
8402}
8403input[type="submit"].md .card-header a.link,
8404input[type="submit"].md .card-footer a.link,
8405input[type="button"].md .card-header a.link,
8406input[type="button"].md .card-footer a.link {
8407 width: 100%;
8408}
8409.md .card-header a.link.active-state,
8410.md .card-footer a.link.active-state {
8411 background: rgba(0, 0, 0, 0.1);
8412}
8413.md .card-header a.icon-only,
8414.md .card-footer a.icon-only {
8415 min-width: 48px;
8416}
8417.md .page-content > .card:last-child {
8418 margin-bottom: 32px;
8419}
8420.md .card-content-padding {
8421 padding: 16px;
8422}
8423.md .card-content-padding > .list,
8424.md .card-content-padding > .block {
8425 margin: -16px;
8426}
8427.md .card-header,
8428.md .card-footer {
8429 min-height: 48px;
8430 padding: 4px 16px;
8431}
8432.md .card-header {
8433 font-size: 16px;
8434}
8435.md .card-footer {
8436 color: #757575;
8437}
8438.md .theme-dark .card {
8439 background-color: rgba(255, 255, 255, 0.03);
8440}
8441.md .theme-dark .card-outline {
8442 border-color: #282829;
8443}
8444.md .theme-dark .card-header:after {
8445 background-color: rgba(255, 255, 255, 0.08);
8446}
8447.md .theme-dark .card-footer {
8448 color: rgba(255, 255, 255, 0.54);
8449}
8450.md .theme-dark .card-footer:before {
8451 background-color: rgba(255, 255, 255, 0.08);
8452}
8453@media (orientation: landscape) {
8454 .md.device-iphone-x .ios-left-edge .card:not(.no-ios-edges):not(.no-ios-left-edge),
8455 .md.device-iphone-x .ios-edges .card:not(.no-ios-edges):not(.no-ios-left-edge),
8456 .md.device-iphone-x .popup .card:not(.no-ios-edges):not(.no-ios-left-edge),
8457 .md.device-iphone-x .sheet-modal .card:not(.no-ios-edges):not(.no-ios-left-edge),
8458 .md.device-iphone-x .panel-left .card:not(.no-ios-edges):not(.no-ios-left-edge) {
8459 margin-left: calc(8px + constant(safe-area-inset-left));
8460 margin-left: calc(8px + env(safe-area-inset-left));
8461 }
8462 .md.device-iphone-x .ios-right-edge .card:not(.no-ios-edges):not(.no-ios-right-edge),
8463 .md.device-iphone-x .ios-edges .card:not(.no-ios-edges):not(.no-ios-right-edge),
8464 .md.device-iphone-x .popup .card:not(.no-ios-edges):not(.no-ios-right-edge),
8465 .md.device-iphone-x .sheet-modal .card:not(.no-ios-edges):not(.no-ios-right-edge),
8466 .md.device-iphone-x .panel-right .card:not(.no-ios-edges):not(.no-ios-right-edge) {
8467 margin-right: calc(8px + constant(safe-area-inset-right));
8468 margin-right: calc(8px + env(safe-area-inset-right));
8469 }
8470}
8471.md .color-theme-red .card-header a.link,
8472.md .color-theme-red .card-footer a.link,
8473.md .card-header.color-theme-red a.link,
8474.md .card-footer.color-theme-red a.link {
8475 color: #f44336;
8476}
8477.md .color-theme-green .card-header a.link,
8478.md .color-theme-green .card-footer a.link,
8479.md .card-header.color-theme-green a.link,
8480.md .card-footer.color-theme-green a.link {
8481 color: #4caf50;
8482}
8483.md .color-theme-blue .card-header a.link,
8484.md .color-theme-blue .card-footer a.link,
8485.md .card-header.color-theme-blue a.link,
8486.md .card-footer.color-theme-blue a.link {
8487 color: #2196f3;
8488}
8489.md .color-theme-pink .card-header a.link,
8490.md .color-theme-pink .card-footer a.link,
8491.md .card-header.color-theme-pink a.link,
8492.md .card-footer.color-theme-pink a.link {
8493 color: #e91e63;
8494}
8495.md .color-theme-yellow .card-header a.link,
8496.md .color-theme-yellow .card-footer a.link,
8497.md .card-header.color-theme-yellow a.link,
8498.md .card-footer.color-theme-yellow a.link {
8499 color: #ffeb3b;
8500}
8501.md .color-theme-orange .card-header a.link,
8502.md .color-theme-orange .card-footer a.link,
8503.md .card-header.color-theme-orange a.link,
8504.md .card-footer.color-theme-orange a.link {
8505 color: #ff9800;
8506}
8507.md .color-theme-gray .card-header a.link,
8508.md .color-theme-gray .card-footer a.link,
8509.md .card-header.color-theme-gray a.link,
8510.md .card-footer.color-theme-gray a.link {
8511 color: #9e9e9e;
8512}
8513.md .color-theme-white .card-header a.link,
8514.md .color-theme-white .card-footer a.link,
8515.md .card-header.color-theme-white a.link,
8516.md .card-footer.color-theme-white a.link {
8517 color: #ffffff;
8518}
8519.md .color-theme-black .card-header a.link,
8520.md .color-theme-black .card-footer a.link,
8521.md .card-header.color-theme-black a.link,
8522.md .card-footer.color-theme-black a.link {
8523 color: #000000;
8524}
8525.md .card-header a.link.color-red,
8526.md .card-footer a.link.color-red {
8527 color: #f44336;
8528}
8529.md .card-header a.link.color-green,
8530.md .card-footer a.link.color-green {
8531 color: #4caf50;
8532}
8533.md .card-header a.link.color-blue,
8534.md .card-footer a.link.color-blue {
8535 color: #2196f3;
8536}
8537.md .card-header a.link.color-pink,
8538.md .card-footer a.link.color-pink {
8539 color: #e91e63;
8540}
8541.md .card-header a.link.color-yellow,
8542.md .card-footer a.link.color-yellow {
8543 color: #ffeb3b;
8544}
8545.md .card-header a.link.color-orange,
8546.md .card-footer a.link.color-orange {
8547 color: #ff9800;
8548}
8549.md .card-header a.link.color-gray,
8550.md .card-footer a.link.color-gray {
8551 color: #9e9e9e;
8552}
8553.md .card-header a.link.color-white,
8554.md .card-footer a.link.color-white {
8555 color: #ffffff;
8556}
8557.md .card-header a.link.color-black,
8558.md .card-footer a.link.color-black {
8559 color: #000000;
8560}
8561/* === Chips === */
8562.chip {
8563 font-weight: normal;
8564 display: -webkit-inline-box;
8565 display: -webkit-inline-flex;
8566 display: -ms-inline-flexbox;
8567 display: inline-flex;
8568 -webkit-box-sizing: border-box;
8569 box-sizing: border-box;
8570 vertical-align: middle;
8571 -webkit-box-align: center;
8572 -webkit-align-items: center;
8573 -ms-flex-align: center;
8574 align-items: center;
8575 margin: 2px 0;
8576}
8577.chip-media {
8578 border-radius: 50%;
8579 text-align: center;
8580 color: #fff;
8581 -webkit-flex-shrink: 0;
8582 -ms-flex-negative: 0;
8583 flex-shrink: 0;
8584 display: -webkit-box;
8585 display: -webkit-flex;
8586 display: -ms-flexbox;
8587 display: flex;
8588 -webkit-box-align: center;
8589 -webkit-align-items: center;
8590 -ms-flex-align: center;
8591 align-items: center;
8592 -webkit-box-pack: center;
8593 -webkit-justify-content: center;
8594 -ms-flex-pack: center;
8595 justify-content: center;
8596}
8597.chip-media img {
8598 max-width: 100%;
8599 max-height: 100%;
8600 width: auto;
8601 height: auto;
8602 border-radius: 50%;
8603 display: block;
8604}
8605.chip-label {
8606 white-space: nowrap;
8607 overflow: hidden;
8608 text-overflow: ellipsis;
8609 position: relative;
8610 -webkit-flex-shrink: 1;
8611 -ms-flex-negative: 1;
8612 flex-shrink: 1;
8613 min-width: 0;
8614}
8615.chip-delete {
8616 text-align: center;
8617 cursor: pointer;
8618 -webkit-flex-shrink: 0;
8619 -ms-flex-negative: 0;
8620 flex-shrink: 0;
8621 background-repeat: no-repeat;
8622}
8623.chip .chip-delete.active-state {
8624 opacity: 1;
8625}
8626.md .chip {
8627 font-size: 13px;
8628 color: rgba(0, 0, 0, 0.87);
8629 background: rgba(0, 0, 0, 0.12);
8630 height: 32px;
8631 line-height: 32px;
8632 border-radius: 16px;
8633 padding: 0 12px;
8634}
8635.md .chip-outline {
8636 background: none;
8637 border: 1px solid rgba(0, 0, 0, 0.12);
8638}
8639.md .chip-media {
8640 width: 32px;
8641 height: 32px;
8642 vertical-align: top;
8643 border-radius: 50%;
8644 text-align: center;
8645 line-height: 32px;
8646 color: #fff;
8647 font-size: 16px;
8648 margin-left: -12px;
8649}
8650.md .chip-media + .chip-label {
8651 margin-left: 8px;
8652}
8653.md .chip-label + .chip-delete {
8654 margin-left: 4px;
8655}
8656.md .chip-delete {
8657 width: 24px;
8658 height: 24px;
8659 line-height: 24px;
8660 background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20fill%3D'%23000'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%20width%3D'24'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%3Cpath%20d%3D'M12%202C6.47%202%202%206.47%202%2012s4.47%2010%2010%2010%2010-4.47%2010-10S17.53%202%2012%202zm5%2013.59L15.59%2017%2012%2013.41%208.41%2017%207%2015.59%2010.59%2012%207%208.41%208.41%207%2012%2010.59%2015.59%207%2017%208.41%2013.41%2012%2017%2015.59z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E");
8661 background-position: center;
8662 background-size: 20px 20px;
8663 opacity: 0.54;
8664 margin-right: -8px;
8665}
8666.md .theme-dark .chip {
8667 background: #333;
8668 color: rgba(255, 255, 255, 0.87);
8669}
8670.md .theme-dark .chip-outline {
8671 background: none;
8672 border-color: #333;
8673}
8674.md .theme-dark .chip-delete {
8675 background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20fill%3D'%23fff'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%20width%3D'24'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%3Cpath%20d%3D'M12%202C6.47%202%202%206.47%202%2012s4.47%2010%2010%2010%2010-4.47%2010-10S17.53%202%2012%202zm5%2013.59L15.59%2017%2012%2013.41%208.41%2017%207%2015.59%2010.59%2012%207%208.41%208.41%207%2012%2010.59%2015.59%207%2017%208.41%2013.41%2012%2017%2015.59z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E");
8676}
8677.md .chip.color-red {
8678 background: #f44336;
8679 color: #fff;
8680}
8681.md .chip.color-red.chip-outline {
8682 background: none;
8683 border-color: #f44336;
8684 color: #f44336;
8685}
8686.md .chip.color-green {
8687 background: #4caf50;
8688 color: #fff;
8689}
8690.md .chip.color-green.chip-outline {
8691 background: none;
8692 border-color: #4caf50;
8693 color: #4caf50;
8694}
8695.md .chip.color-blue {
8696 background: #2196f3;
8697 color: #fff;
8698}
8699.md .chip.color-blue.chip-outline {
8700 background: none;
8701 border-color: #2196f3;
8702 color: #2196f3;
8703}
8704.md .chip.color-pink {
8705 background: #e91e63;
8706 color: #fff;
8707}
8708.md .chip.color-pink.chip-outline {
8709 background: none;
8710 border-color: #e91e63;
8711 color: #e91e63;
8712}
8713.md .chip.color-yellow {
8714 background: #ffeb3b;
8715 color: #fff;
8716}
8717.md .chip.color-yellow.chip-outline {
8718 background: none;
8719 border-color: #ffeb3b;
8720 color: #ffeb3b;
8721}
8722.md .chip.color-orange {
8723 background: #ff9800;
8724 color: #fff;
8725}
8726.md .chip.color-orange.chip-outline {
8727 background: none;
8728 border-color: #ff9800;
8729 color: #ff9800;
8730}
8731.md .chip.color-gray {
8732 background: #9e9e9e;
8733 color: #fff;
8734}
8735.md .chip.color-gray.chip-outline {
8736 background: none;
8737 border-color: #9e9e9e;
8738 color: #9e9e9e;
8739}
8740.md .chip.color-white {
8741 background: #ffffff;
8742 color: #fff;
8743}
8744.md .chip.color-white.chip-outline {
8745 background: none;
8746 border-color: #ffffff;
8747 color: #ffffff;
8748}
8749.md .chip.color-black {
8750 background: #000000;
8751 color: #fff;
8752}
8753.md .chip.color-black.chip-outline {
8754 background: none;
8755 border-color: #000000;
8756 color: #000000;
8757}
8758/* === Input === */
8759input[type="text"],
8760input[type="password"],
8761input[type="search"],
8762input[type="email"],
8763input[type="tel"],
8764input[type="url"],
8765input[type="date"],
8766input[type="datetime-local"],
8767input[type="time"],
8768input[type="number"],
8769select,
8770textarea {
8771 -webkit-box-sizing: border-box;
8772 box-sizing: border-box;
8773 -webkit-appearance: none;
8774 -moz-appearance: none;
8775 appearance: none;
8776 border: none;
8777 -webkit-box-shadow: none;
8778 box-shadow: none;
8779 border-radius: 0;
8780 outline: 0;
8781 display: block;
8782 padding: 0;
8783 margin: 0;
8784 font-family: inherit;
8785 background: none;
8786 resize: none;
8787 font-size: inherit;
8788 color: inherit;
8789}
8790.textarea-resizable-shadow {
8791 opacity: 0;
8792 position: absolute;
8793 z-index: -1000;
8794 pointer-events: none;
8795 left: -1000px;
8796 top: -1000px;
8797 visibility: hidden;
8798}
8799.list input[type="text"],
8800.list input[type="password"],
8801.list input[type="search"],
8802.list input[type="email"],
8803.list input[type="tel"],
8804.list input[type="url"],
8805.list input[type="date"],
8806.list input[type="datetime-local"],
8807.list input[type="time"],
8808.list input[type="number"],
8809.list select,
8810.list textarea {
8811 width: 100%;
8812}
8813.list input[type="datetime-local"] {
8814 max-width: 50vw;
8815}
8816.list input[type="date"],
8817.list input[type="datetime-local"] {
8818 line-height: 44px;
8819}
8820.list textarea {
8821 resize: none;
8822 line-height: 1.4;
8823 height: 100px;
8824}
8825.list .item-label,
8826.list .item-floating-label {
8827 vertical-align: top;
8828 -webkit-flex-shrink: 0;
8829 -ms-flex-negative: 0;
8830 flex-shrink: 0;
8831}
8832.list .item-input-wrap {
8833 width: 100%;
8834 -webkit-flex-shrink: 1;
8835 -ms-flex-negative: 1;
8836 flex-shrink: 1;
8837 position: relative;
8838}
8839.input {
8840 position: relative;
8841}
8842.input input,
8843.input select,
8844.input textarea {
8845 width: 100%;
8846}
8847.input-clear-button {
8848 opacity: 0;
8849 pointer-events: none;
8850 visibility: hidden;
8851 -webkit-transition-duration: 100ms;
8852 transition-duration: 100ms;
8853 position: absolute;
8854 top: 50%;
8855 border-radius: 50%;
8856 border: none;
8857 padding: 0;
8858 margin: 0;
8859 outline: 0;
8860 z-index: 1;
8861 cursor: pointer;
8862 background: none;
8863 right: 0;
8864}
8865.input-clear-button:after {
8866 content: '';
8867 position: absolute;
8868 width: 100%;
8869 height: 100%;
8870 left: 0;
8871 top: 0;
8872 background-repeat: no-repeat;
8873 background-position: center center;
8874}
8875.input-clear-button:before {
8876 position: absolute;
8877 content: '';
8878 left: 50%;
8879 top: 50%;
8880}
8881.input-with-value ~ .input-clear-button,
8882.item-input-with-value .input-clear-button,
8883.input-with-value .input-clear-button {
8884 opacity: 1;
8885 pointer-events: auto;
8886 visibility: visible;
8887}
8888.input-dropdown-wrap,
8889.input-dropdown {
8890 position: relative;
8891}
8892.input-dropdown-wrap:before,
8893.input-dropdown:before {
8894 content: '';
8895 pointer-events: none;
8896 position: absolute;
8897 top: 50%;
8898 margin-top: -2px;
8899 width: 0;
8900 height: 0;
8901 border-left: 5px solid transparent;
8902 border-right: 5px solid transparent;
8903 border-top: 5px solid #727272;
8904 right: 2px;
8905}
8906.input-dropdown-wrap select,
8907.input-dropdown select,
8908.input-dropdown-wrap input,
8909.input-dropdown input,
8910.input-dropdown-wrap textarea,
8911.input-dropdown textarea {
8912 padding-right: 14px;
8913}
8914.md .list input[type="text"],
8915.md .list input[type="password"],
8916.md .list input[type="search"],
8917.md .list input[type="email"],
8918.md .list input[type="tel"],
8919.md .list input[type="url"],
8920.md .list input[type="date"],
8921.md .list input[type="datetime-local"],
8922.md .list input[type="time"],
8923.md .list input[type="number"],
8924.md .list select {
8925 height: 36px;
8926 color: #212121;
8927 font-size: 16px;
8928}
8929.md .list input[type="text"]::-webkit-input-placeholder,
8930.md .list input[type="password"]::-webkit-input-placeholder,
8931.md .list input[type="search"]::-webkit-input-placeholder,
8932.md .list input[type="email"]::-webkit-input-placeholder,
8933.md .list input[type="tel"]::-webkit-input-placeholder,
8934.md .list input[type="url"]::-webkit-input-placeholder,
8935.md .list input[type="date"]::-webkit-input-placeholder,
8936.md .list input[type="datetime-local"]::-webkit-input-placeholder,
8937.md .list input[type="time"]::-webkit-input-placeholder,
8938.md .list input[type="number"]::-webkit-input-placeholder,
8939.md .list select::-webkit-input-placeholder {
8940 color: rgba(0, 0, 0, 0.35);
8941}
8942.md .list input[type="text"]:-ms-input-placeholder,
8943.md .list input[type="password"]:-ms-input-placeholder,
8944.md .list input[type="search"]:-ms-input-placeholder,
8945.md .list input[type="email"]:-ms-input-placeholder,
8946.md .list input[type="tel"]:-ms-input-placeholder,
8947.md .list input[type="url"]:-ms-input-placeholder,
8948.md .list input[type="date"]:-ms-input-placeholder,
8949.md .list input[type="datetime-local"]:-ms-input-placeholder,
8950.md .list input[type="time"]:-ms-input-placeholder,
8951.md .list input[type="number"]:-ms-input-placeholder,
8952.md .list select:-ms-input-placeholder {
8953 color: rgba(0, 0, 0, 0.35);
8954}
8955.md .list input[type="text"]::-ms-input-placeholder,
8956.md .list input[type="password"]::-ms-input-placeholder,
8957.md .list input[type="search"]::-ms-input-placeholder,
8958.md .list input[type="email"]::-ms-input-placeholder,
8959.md .list input[type="tel"]::-ms-input-placeholder,
8960.md .list input[type="url"]::-ms-input-placeholder,
8961.md .list input[type="date"]::-ms-input-placeholder,
8962.md .list input[type="datetime-local"]::-ms-input-placeholder,
8963.md .list input[type="time"]::-ms-input-placeholder,
8964.md .list input[type="number"]::-ms-input-placeholder,
8965.md .list select::-ms-input-placeholder {
8966 color: rgba(0, 0, 0, 0.35);
8967}
8968.md .list input[type="text"]::placeholder,
8969.md .list input[type="password"]::placeholder,
8970.md .list input[type="search"]::placeholder,
8971.md .list input[type="email"]::placeholder,
8972.md .list input[type="tel"]::placeholder,
8973.md .list input[type="url"]::placeholder,
8974.md .list input[type="date"]::placeholder,
8975.md .list input[type="datetime-local"]::placeholder,
8976.md .list input[type="time"]::placeholder,
8977.md .list input[type="number"]::placeholder,
8978.md .list select::placeholder {
8979 color: rgba(0, 0, 0, 0.35);
8980}
8981.md .list textarea {
8982 color: #212121;
8983 font-size: 16px;
8984 padding-top: 7px;
8985 padding-bottom: 7px;
8986}
8987.md .list textarea.resizable {
8988 height: 36px;
8989}
8990.md .list textarea::-webkit-input-placeholder {
8991 color: rgba(0, 0, 0, 0.35);
8992}
8993.md .list textarea:-ms-input-placeholder {
8994 color: rgba(0, 0, 0, 0.35);
8995}
8996.md .list textarea::-ms-input-placeholder {
8997 color: rgba(0, 0, 0, 0.35);
8998}
8999.md .list textarea::placeholder {
9000 color: rgba(0, 0, 0, 0.35);
9001}
9002.md .item-input-wrap:after,
9003.md .input:after {
9004 -webkit-transition-duration: 200ms;
9005 transition-duration: 200ms;
9006}
9007.md .item-input-wrap {
9008 min-height: 36px;
9009}
9010.md .item-input-wrap:after {
9011 content: '';
9012 position: absolute;
9013 background-color: rgba(0, 0, 0, 0.12);
9014 display: block;
9015 z-index: 15;
9016 top: auto;
9017 right: auto;
9018 bottom: 0;
9019 left: 0;
9020 height: 1px;
9021 width: 100%;
9022 -webkit-transform-origin: 50% 100%;
9023 transform-origin: 50% 100%;
9024}
9025.md.device-pixel-ratio-2 .item-input-wrap:after {
9026 -webkit-transform: scaleY(0.5);
9027 transform: scaleY(0.5);
9028}
9029.md.device-pixel-ratio-3 .item-input-wrap:after {
9030 -webkit-transform: scaleY(0.33);
9031 transform: scaleY(0.33);
9032}
9033.md .input:after {
9034 content: '';
9035 position: absolute;
9036 background-color: rgba(0, 0, 0, 0.12);
9037 display: block;
9038 z-index: 15;
9039 top: auto;
9040 right: auto;
9041 bottom: 0;
9042 left: 0;
9043 height: 1px;
9044 width: 100%;
9045 -webkit-transform-origin: 50% 100%;
9046 transform-origin: 50% 100%;
9047}
9048.md.device-pixel-ratio-2 .input:after {
9049 -webkit-transform: scaleY(0.5);
9050 transform: scaleY(0.5);
9051}
9052.md.device-pixel-ratio-3 .input:after {
9053 -webkit-transform: scaleY(0.33);
9054 transform: scaleY(0.33);
9055}
9056.md .item-label,
9057.md .item-floating-label {
9058 font-size: 12px;
9059 width: 100%;
9060 color: rgba(0, 0, 0, 0.65);
9061 -webkit-transition-duration: 200ms;
9062 transition-duration: 200ms;
9063 line-height: 13px;
9064 -webkit-transition-property: color, -webkit-transform;
9065 transition-property: color, -webkit-transform;
9066 transition-property: transform, color;
9067 transition-property: transform, color, -webkit-transform;
9068}
9069.md .item-floating-label {
9070 -webkit-transform: scale(1.33333333) translateY(18px);
9071 transform: scale(1.33333333) translateY(18px);
9072 color: rgba(0, 0, 0, 0.35);
9073 width: auto;
9074 max-width: 75%;
9075 pointer-events: none;
9076 -webkit-transform-origin: left;
9077 transform-origin: left;
9078}
9079.md .item-floating-label ~ .item-input-wrap input::-webkit-input-placeholder,
9080.md .item-floating-label ~ .item-input-wrap textarea::-webkit-input-placeholder {
9081 opacity: 0;
9082 -webkit-transition-duration: 100ms;
9083 transition-duration: 100ms;
9084}
9085.md .item-floating-label ~ .item-input-wrap input:-ms-input-placeholder,
9086.md .item-floating-label ~ .item-input-wrap textarea:-ms-input-placeholder {
9087 opacity: 0;
9088 transition-duration: 100ms;
9089}
9090.md .item-floating-label ~ .item-input-wrap input::-ms-input-placeholder,
9091.md .item-floating-label ~ .item-input-wrap textarea::-ms-input-placeholder {
9092 opacity: 0;
9093 transition-duration: 100ms;
9094}
9095.md .item-floating-label ~ .item-input-wrap input::placeholder,
9096.md .item-floating-label ~ .item-input-wrap textarea::placeholder {
9097 opacity: 0;
9098 -webkit-transition-duration: 100ms;
9099 transition-duration: 100ms;
9100}
9101.md .item-floating-label ~ .item-input-wrap input.input-focused::-webkit-input-placeholder,
9102.md .item-floating-label ~ .item-input-wrap textarea.input-focused::-webkit-input-placeholder {
9103 opacity: 1;
9104 -webkit-transition-duration: 300ms;
9105 transition-duration: 300ms;
9106}
9107.md .item-floating-label ~ .item-input-wrap input.input-focused:-ms-input-placeholder,
9108.md .item-floating-label ~ .item-input-wrap textarea.input-focused:-ms-input-placeholder {
9109 opacity: 1;
9110 transition-duration: 300ms;
9111}
9112.md .item-floating-label ~ .item-input-wrap input.input-focused::-ms-input-placeholder,
9113.md .item-floating-label ~ .item-input-wrap textarea.input-focused::-ms-input-placeholder {
9114 opacity: 1;
9115 transition-duration: 300ms;
9116}
9117.md .item-floating-label ~ .item-input-wrap input.input-focused::placeholder,
9118.md .item-floating-label ~ .item-input-wrap textarea.input-focused::placeholder {
9119 opacity: 1;
9120 -webkit-transition-duration: 300ms;
9121 transition-duration: 300ms;
9122}
9123.md .item-input-with-value .item-floating-label,
9124.md .item-input-focused .item-floating-label {
9125 -webkit-transform: scale(1) translateY(0);
9126 transform: scale(1) translateY(0);
9127}
9128.md .item-input-with-value .item-floating-label {
9129 color: rgba(0, 0, 0, 0.65);
9130}
9131.md .item-input .item-media {
9132 -webkit-align-self: flex-end;
9133 -ms-flex-item-align: end;
9134 align-self: flex-end;
9135}
9136.md .item-input .item-inner {
9137 display: block;
9138}
9139.md .item-input .item-inner:after {
9140 display: none !important;
9141}
9142.md .inline-labels .item-media,
9143.md .inline-label .item-media {
9144 -webkit-align-self: flex-start;
9145 -ms-flex-item-align: start;
9146 align-self: flex-start;
9147 padding-top: 14px;
9148}
9149.md .inline-labels .item-inner,
9150.md .inline-label .item-inner {
9151 display: -webkit-box;
9152 display: -webkit-flex;
9153 display: -ms-flexbox;
9154 display: flex;
9155}
9156.md .inline-labels .item-label,
9157.md .inline-label .item-label,
9158.md .inline-labels .item-floating-label,
9159.md .inline-label .item-floating-label {
9160 font-size: 16px;
9161 width: 30%;
9162 line-height: 1.5;
9163 -webkit-align-self: flex-start;
9164 -ms-flex-item-align: start;
9165 align-self: flex-start;
9166 padding-top: 7px;
9167}
9168.md .inline-labels .item-label + .item-input-wrap,
9169.md .inline-label .item-label + .item-input-wrap,
9170.md .inline-labels .item-floating-label + .item-input-wrap,
9171.md .inline-label .item-floating-label + .item-input-wrap {
9172 margin-left: 8px;
9173}
9174.md .item-input-with-error-message,
9175.md .item-input-with-info,
9176.md div.input-with-error-message,
9177.md div.input-with-info,
9178.md span.input-with-error-message,
9179.md span.input-with-info {
9180 padding-bottom: 20px;
9181}
9182.md .item-input-error-message,
9183.md .item-input-info,
9184.md .input-error-message,
9185.md .input-info {
9186 font-size: 12px;
9187 line-height: 1.4;
9188 position: absolute;
9189 top: 100%;
9190 margin-top: 4px;
9191 white-space: nowrap;
9192 overflow: hidden;
9193 text-overflow: ellipsis;
9194 display: block;
9195 left: 0;
9196 right: 16px;
9197}
9198.md .item-input-info,
9199.md .input-info {
9200 color: rgba(0, 0, 0, 0.45);
9201}
9202.md .item-input-error-message,
9203.md .input-error-message {
9204 color: #f44336;
9205 display: none;
9206}
9207.md .item-input-focused .item-label,
9208.md .item-input-focused .item-floating-label {
9209 color: #2196f3;
9210}
9211.md .item-input-focused .item-input-wrap:after,
9212.md .input-focused:after {
9213 background: #2196f3;
9214}
9215.md .item-input-invalid .item-label,
9216.md .item-invalid .item-label,
9217.md .item-input-invalid .item-floating-label,
9218.md .item-invalid .item-floating-label {
9219 color: #f44336;
9220}
9221.md .item-input-invalid .item-input-error-message,
9222.md .item-invalid .item-input-error-message,
9223.md .item-input-invalid .input-error-message,
9224.md .item-invalid .input-error-message {
9225 display: block;
9226}
9227.md .item-input-invalid .item-input-info,
9228.md .item-invalid .item-input-info,
9229.md .item-input-invalid .input-info,
9230.md .item-invalid .input-info {
9231 display: none;
9232}
9233.md .item-input-invalid .item-input-wrap:after,
9234.md .input-invalid:after {
9235 background: #f44336;
9236}
9237.md .item-input-invalid .item-input-wrap:after,
9238.md .item-input-focused .item-input-wrap:after {
9239 -webkit-transform: scaleY(2);
9240 transform: scaleY(2);
9241}
9242.md .input-invalid:after,
9243.md .input-focused:after {
9244 -webkit-transform: scaleY(2) !important;
9245 transform: scaleY(2) !important;
9246}
9247.md .input-clear-button {
9248 width: 24px;
9249 height: 24px;
9250 background: rgba(0, 0, 0, 0.12);
9251 margin-top: -12px;
9252}
9253.md .input-clear-button:after {
9254 background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20fill%3D'%23000'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%20width%3D'24'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%3Cpath%20d%3D'M19%206.41L17.59%205%2012%2010.59%206.41%205%205%206.41%2010.59%2012%205%2017.59%206.41%2019%2012%2013.41%2017.59%2019%2019%2017.59%2013.41%2012z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E");
9255 background-size: 16px 16px;
9256 opacity: 0.54;
9257}
9258.md .input-clear-button:before {
9259 width: 48px;
9260 height: 48px;
9261 margin-left: -24px;
9262 margin-top: -24px;
9263}
9264.md .item-input-wrap .input-clear-button {
9265 bottom: 6px;
9266 margin-top: 0;
9267 top: auto;
9268}
9269.md .theme-dark input[type="text"],
9270.md .theme-dark input[type="password"],
9271.md .theme-dark input[type="search"],
9272.md .theme-dark input[type="email"],
9273.md .theme-dark input[type="tel"],
9274.md .theme-dark input[type="url"],
9275.md .theme-dark input[type="date"],
9276.md .theme-dark input[type="datetime-local"],
9277.md .theme-dark input[type="time"],
9278.md .theme-dark input[type="number"],
9279.md .theme-dark select,
9280.md .theme-dark textarea {
9281 color: rgba(255, 255, 255, 0.87);
9282}
9283.md .theme-dark input[type="text"]::-webkit-input-placeholder,
9284.md .theme-dark input[type="password"]::-webkit-input-placeholder,
9285.md .theme-dark input[type="search"]::-webkit-input-placeholder,
9286.md .theme-dark input[type="email"]::-webkit-input-placeholder,
9287.md .theme-dark input[type="tel"]::-webkit-input-placeholder,
9288.md .theme-dark input[type="url"]::-webkit-input-placeholder,
9289.md .theme-dark input[type="date"]::-webkit-input-placeholder,
9290.md .theme-dark input[type="datetime-local"]::-webkit-input-placeholder,
9291.md .theme-dark input[type="time"]::-webkit-input-placeholder,
9292.md .theme-dark input[type="number"]::-webkit-input-placeholder,
9293.md .theme-dark select::-webkit-input-placeholder,
9294.md .theme-dark textarea::-webkit-input-placeholder {
9295 color: rgba(255, 255, 255, 0.35);
9296}
9297.md .theme-dark input[type="text"]:-ms-input-placeholder,
9298.md .theme-dark input[type="password"]:-ms-input-placeholder,
9299.md .theme-dark input[type="search"]:-ms-input-placeholder,
9300.md .theme-dark input[type="email"]:-ms-input-placeholder,
9301.md .theme-dark input[type="tel"]:-ms-input-placeholder,
9302.md .theme-dark input[type="url"]:-ms-input-placeholder,
9303.md .theme-dark input[type="date"]:-ms-input-placeholder,
9304.md .theme-dark input[type="datetime-local"]:-ms-input-placeholder,
9305.md .theme-dark input[type="time"]:-ms-input-placeholder,
9306.md .theme-dark input[type="number"]:-ms-input-placeholder,
9307.md .theme-dark select:-ms-input-placeholder,
9308.md .theme-dark textarea:-ms-input-placeholder {
9309 color: rgba(255, 255, 255, 0.35);
9310}
9311.md .theme-dark input[type="text"]::-ms-input-placeholder,
9312.md .theme-dark input[type="password"]::-ms-input-placeholder,
9313.md .theme-dark input[type="search"]::-ms-input-placeholder,
9314.md .theme-dark input[type="email"]::-ms-input-placeholder,
9315.md .theme-dark input[type="tel"]::-ms-input-placeholder,
9316.md .theme-dark input[type="url"]::-ms-input-placeholder,
9317.md .theme-dark input[type="date"]::-ms-input-placeholder,
9318.md .theme-dark input[type="datetime-local"]::-ms-input-placeholder,
9319.md .theme-dark input[type="time"]::-ms-input-placeholder,
9320.md .theme-dark input[type="number"]::-ms-input-placeholder,
9321.md .theme-dark select::-ms-input-placeholder,
9322.md .theme-dark textarea::-ms-input-placeholder {
9323 color: rgba(255, 255, 255, 0.35);
9324}
9325.md .theme-dark input[type="text"]::placeholder,
9326.md .theme-dark input[type="password"]::placeholder,
9327.md .theme-dark input[type="search"]::placeholder,
9328.md .theme-dark input[type="email"]::placeholder,
9329.md .theme-dark input[type="tel"]::placeholder,
9330.md .theme-dark input[type="url"]::placeholder,
9331.md .theme-dark input[type="date"]::placeholder,
9332.md .theme-dark input[type="datetime-local"]::placeholder,
9333.md .theme-dark input[type="time"]::placeholder,
9334.md .theme-dark input[type="number"]::placeholder,
9335.md .theme-dark select::placeholder,
9336.md .theme-dark textarea::placeholder {
9337 color: rgba(255, 255, 255, 0.35);
9338}
9339.md .theme-dark .item-input:not(.item-input-focused) .item-input-wrap:after,
9340.md .theme-dark .input:after {
9341 background-color: rgba(255, 255, 255, 0.08);
9342}
9343.md .theme-dark .item-label,
9344.md .theme-dark .item-floating-label {
9345 color: rgba(255, 255, 255, 0.54);
9346}
9347.md .theme-dark .item-floating-label {
9348 color: rgba(255, 255, 255, 0.35);
9349}
9350.md .theme-dark .item-input-with-value .item-floating-label {
9351 color: rgba(255, 255, 255, 0.54);
9352}
9353.md .theme-dark .input-clear-button {
9354 background: #fff;
9355}
9356.md .color-theme-red .item-input-focused .item-label,
9357.md .color-theme-red .item-input-focused .item-floating-label {
9358 color: #f44336;
9359}
9360.md .color-theme-red .item-input-focused .item-input-wrap:after,
9361.md .color-theme-red .input-after:after {
9362 background: #f44336;
9363}
9364.md .color-theme-green .item-input-focused .item-label,
9365.md .color-theme-green .item-input-focused .item-floating-label {
9366 color: #4caf50;
9367}
9368.md .color-theme-green .item-input-focused .item-input-wrap:after,
9369.md .color-theme-green .input-after:after {
9370 background: #4caf50;
9371}
9372.md .color-theme-blue .item-input-focused .item-label,
9373.md .color-theme-blue .item-input-focused .item-floating-label {
9374 color: #2196f3;
9375}
9376.md .color-theme-blue .item-input-focused .item-input-wrap:after,
9377.md .color-theme-blue .input-after:after {
9378 background: #2196f3;
9379}
9380.md .color-theme-pink .item-input-focused .item-label,
9381.md .color-theme-pink .item-input-focused .item-floating-label {
9382 color: #e91e63;
9383}
9384.md .color-theme-pink .item-input-focused .item-input-wrap:after,
9385.md .color-theme-pink .input-after:after {
9386 background: #e91e63;
9387}
9388.md .color-theme-yellow .item-input-focused .item-label,
9389.md .color-theme-yellow .item-input-focused .item-floating-label {
9390 color: #ffeb3b;
9391}
9392.md .color-theme-yellow .item-input-focused .item-input-wrap:after,
9393.md .color-theme-yellow .input-after:after {
9394 background: #ffeb3b;
9395}
9396.md .color-theme-orange .item-input-focused .item-label,
9397.md .color-theme-orange .item-input-focused .item-floating-label {
9398 color: #ff9800;
9399}
9400.md .color-theme-orange .item-input-focused .item-input-wrap:after,
9401.md .color-theme-orange .input-after:after {
9402 background: #ff9800;
9403}
9404.md .color-theme-gray .item-input-focused .item-label,
9405.md .color-theme-gray .item-input-focused .item-floating-label {
9406 color: #9e9e9e;
9407}
9408.md .color-theme-gray .item-input-focused .item-input-wrap:after,
9409.md .color-theme-gray .input-after:after {
9410 background: #9e9e9e;
9411}
9412.md .color-theme-white .item-input-focused .item-label,
9413.md .color-theme-white .item-input-focused .item-floating-label {
9414 color: #ffffff;
9415}
9416.md .color-theme-white .item-input-focused .item-input-wrap:after,
9417.md .color-theme-white .input-after:after {
9418 background: #ffffff;
9419}
9420.md .color-theme-black .item-input-focused .item-label,
9421.md .color-theme-black .item-input-focused .item-floating-label {
9422 color: #000000;
9423}
9424.md .color-theme-black .item-input-focused .item-input-wrap:after,
9425.md .color-theme-black .input-after:after {
9426 background: #000000;
9427}
9428.md .item-input-focused.color-red .item-label,
9429.md .item-input-focused.color-red .item-floating-label {
9430 color: #f44336;
9431}
9432.md .item-input-focused.color-red .item-input-wrap:after,
9433.md .input-after.color-red:after {
9434 background: #f44336;
9435}
9436.md .item-input-focused.color-green .item-label,
9437.md .item-input-focused.color-green .item-floating-label {
9438 color: #4caf50;
9439}
9440.md .item-input-focused.color-green .item-input-wrap:after,
9441.md .input-after.color-green:after {
9442 background: #4caf50;
9443}
9444.md .item-input-focused.color-blue .item-label,
9445.md .item-input-focused.color-blue .item-floating-label {
9446 color: #2196f3;
9447}
9448.md .item-input-focused.color-blue .item-input-wrap:after,
9449.md .input-after.color-blue:after {
9450 background: #2196f3;
9451}
9452.md .item-input-focused.color-pink .item-label,
9453.md .item-input-focused.color-pink .item-floating-label {
9454 color: #e91e63;
9455}
9456.md .item-input-focused.color-pink .item-input-wrap:after,
9457.md .input-after.color-pink:after {
9458 background: #e91e63;
9459}
9460.md .item-input-focused.color-yellow .item-label,
9461.md .item-input-focused.color-yellow .item-floating-label {
9462 color: #ffeb3b;
9463}
9464.md .item-input-focused.color-yellow .item-input-wrap:after,
9465.md .input-after.color-yellow:after {
9466 background: #ffeb3b;
9467}
9468.md .item-input-focused.color-orange .item-label,
9469.md .item-input-focused.color-orange .item-floating-label {
9470 color: #ff9800;
9471}
9472.md .item-input-focused.color-orange .item-input-wrap:after,
9473.md .input-after.color-orange:after {
9474 background: #ff9800;
9475}
9476.md .item-input-focused.color-gray .item-label,
9477.md .item-input-focused.color-gray .item-floating-label {
9478 color: #9e9e9e;
9479}
9480.md .item-input-focused.color-gray .item-input-wrap:after,
9481.md .input-after.color-gray:after {
9482 background: #9e9e9e;
9483}
9484.md .item-input-focused.color-white .item-label,
9485.md .item-input-focused.color-white .item-floating-label {
9486 color: #ffffff;
9487}
9488.md .item-input-focused.color-white .item-input-wrap:after,
9489.md .input-after.color-white:after {
9490 background: #ffffff;
9491}
9492.md .item-input-focused.color-black .item-label,
9493.md .item-input-focused.color-black .item-floating-label {
9494 color: #000000;
9495}
9496.md .item-input-focused.color-black .item-input-wrap:after,
9497.md .input-after.color-black:after {
9498 background: #000000;
9499}
9500/* === Checkbox === */
9501.icon-checkbox,
9502.checkbox i {
9503 -webkit-flex-shrink: 0;
9504 -ms-flex-negative: 0;
9505 flex-shrink: 0;
9506}
9507.checkbox {
9508 position: relative;
9509 display: inline-block;
9510 vertical-align: middle;
9511 z-index: 1;
9512}
9513label.item-checkbox,
9514.checkbox {
9515 cursor: pointer;
9516}
9517label.item-checkbox input[type="checkbox"],
9518.checkbox input[type="checkbox"],
9519label.item-checkbox input[type="radio"],
9520.checkbox input[type="radio"] {
9521 display: none;
9522}
9523label.item-checkbox .icon-checkbox,
9524.checkbox .icon-checkbox {
9525 -webkit-box-sizing: border-box;
9526 box-sizing: border-box;
9527 position: relative;
9528 display: block;
9529}
9530label.item-checkbox .icon-checkbox:after,
9531.checkbox .icon-checkbox:after {
9532 content: '';
9533 position: absolute;
9534}
9535label.item-checkbox {
9536 -webkit-transition-duration: 300ms;
9537 transition-duration: 300ms;
9538}
9539label.item-checkbox.active-state:after {
9540 background-color: transparent;
9541}
9542label.item-checkbox.disabled,
9543.disabled label.item-checkbox {
9544 opacity: 0.55;
9545 pointer-events: none;
9546 opacity: 0.55 !important;
9547 pointer-events: none !important;
9548}
9549.md .icon-checkbox,
9550.md .checkbox i {
9551 width: 18px;
9552 height: 18px;
9553 border-radius: 2px;
9554 border: 2px solid #6d6d6d;
9555 -webkit-transition-duration: 200ms;
9556 transition-duration: 200ms;
9557 background-color: transparent;
9558}
9559.md .icon-checkbox:after,
9560.md .checkbox i:after {
9561 width: 18px;
9562 height: 18px;
9563 left: -2px;
9564 top: -2px;
9565 -webkit-transition-duration: 200ms;
9566 transition-duration: 200ms;
9567 opacity: 0;
9568 background: no-repeat center;
9569 background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%23ffffff'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M9%2016.17L4.83%2012l-1.42%201.41L9%2019%2021%207l-1.41-1.41z'%2F%3E%3C%2Fsvg%3E");
9570 background-size: 100% auto;
9571}
9572.md label.item-checkbox input[type="checkbox"]:checked ~ .icon-checkbox,
9573.md label.item-checkbox input[type="checkbox"]:checked ~ * .icon-checkbox,
9574.md .checkbox input[type="checkbox"]:checked ~ i {
9575 background-color: #2196f3;
9576 border-color: #2196f3;
9577}
9578.md label.item-checkbox input[type="checkbox"]:checked ~ .icon-checkbox:after,
9579.md label.item-checkbox input[type="checkbox"]:checked ~ * .icon-checkbox:after,
9580.md .checkbox input[type="checkbox"]:checked ~ i:after {
9581 opacity: 1;
9582}
9583.md label.item-checkbox {
9584 position: relative;
9585 overflow: hidden;
9586 z-index: 0;
9587}
9588.md label.item-checkbox > .icon-checkbox {
9589 margin-right: 38px;
9590}
9591.md label.item-checkbox .item-content .item-media,
9592.md label.item-checkbox.item-content .item-media {
9593 -webkit-align-self: center;
9594 -ms-flex-item-align: center;
9595 align-self: center;
9596}
9597.md label.item-checkbox.active-state {
9598 background-color: rgba(0, 0, 0, 0.1);
9599}
9600.md .theme-dark label.item-checkbox.active-state {
9601 background-color: rgba(255, 255, 255, 0.05);
9602}
9603.md .theme-dark .icon-checkbox,
9604.md .theme-dark .checkbox i {
9605 border-color: rgba(255, 255, 255, 0.54);
9606}
9607.md .color-theme-red label.item-checkbox input[type="checkbox"]:checked ~ .icon-checkbox,
9608.md .color-theme-red label.item-checkbox input[type="checkbox"]:checked ~ * .icon-checkbox,
9609.md .color-theme-red .checkbox input[type="checkbox"]:checked ~ i {
9610 background-color: #f44336;
9611 border-color: #f44336;
9612}
9613.md .color-theme-red .checkbox .ripple-wave {
9614 background: rgba(244, 67, 54, 0.5);
9615}
9616.md .color-theme-green label.item-checkbox input[type="checkbox"]:checked ~ .icon-checkbox,
9617.md .color-theme-green label.item-checkbox input[type="checkbox"]:checked ~ * .icon-checkbox,
9618.md .color-theme-green .checkbox input[type="checkbox"]:checked ~ i {
9619 background-color: #4caf50;
9620 border-color: #4caf50;
9621}
9622.md .color-theme-green .checkbox .ripple-wave {
9623 background: rgba(76, 175, 80, 0.5);
9624}
9625.md .color-theme-blue label.item-checkbox input[type="checkbox"]:checked ~ .icon-checkbox,
9626.md .color-theme-blue label.item-checkbox input[type="checkbox"]:checked ~ * .icon-checkbox,
9627.md .color-theme-blue .checkbox input[type="checkbox"]:checked ~ i {
9628 background-color: #2196f3;
9629 border-color: #2196f3;
9630}
9631.md .color-theme-blue .checkbox .ripple-wave {
9632 background: rgba(33, 150, 243, 0.5);
9633}
9634.md .color-theme-pink label.item-checkbox input[type="checkbox"]:checked ~ .icon-checkbox,
9635.md .color-theme-pink label.item-checkbox input[type="checkbox"]:checked ~ * .icon-checkbox,
9636.md .color-theme-pink .checkbox input[type="checkbox"]:checked ~ i {
9637 background-color: #e91e63;
9638 border-color: #e91e63;
9639}
9640.md .color-theme-pink .checkbox .ripple-wave {
9641 background: rgba(233, 30, 99, 0.5);
9642}
9643.md .color-theme-yellow label.item-checkbox input[type="checkbox"]:checked ~ .icon-checkbox,
9644.md .color-theme-yellow label.item-checkbox input[type="checkbox"]:checked ~ * .icon-checkbox,
9645.md .color-theme-yellow .checkbox input[type="checkbox"]:checked ~ i {
9646 background-color: #ffeb3b;
9647 border-color: #ffeb3b;
9648}
9649.md .color-theme-yellow .checkbox .ripple-wave {
9650 background: rgba(255, 235, 59, 0.5);
9651}
9652.md .color-theme-orange label.item-checkbox input[type="checkbox"]:checked ~ .icon-checkbox,
9653.md .color-theme-orange label.item-checkbox input[type="checkbox"]:checked ~ * .icon-checkbox,
9654.md .color-theme-orange .checkbox input[type="checkbox"]:checked ~ i {
9655 background-color: #ff9800;
9656 border-color: #ff9800;
9657}
9658.md .color-theme-orange .checkbox .ripple-wave {
9659 background: rgba(255, 152, 0, 0.5);
9660}
9661.md .color-theme-gray label.item-checkbox input[type="checkbox"]:checked ~ .icon-checkbox,
9662.md .color-theme-gray label.item-checkbox input[type="checkbox"]:checked ~ * .icon-checkbox,
9663.md .color-theme-gray .checkbox input[type="checkbox"]:checked ~ i {
9664 background-color: #9e9e9e;
9665 border-color: #9e9e9e;
9666}
9667.md .color-theme-gray .checkbox .ripple-wave {
9668 background: rgba(158, 158, 158, 0.5);
9669}
9670.md .color-theme-white label.item-checkbox input[type="checkbox"]:checked ~ .icon-checkbox,
9671.md .color-theme-white label.item-checkbox input[type="checkbox"]:checked ~ * .icon-checkbox,
9672.md .color-theme-white .checkbox input[type="checkbox"]:checked ~ i {
9673 background-color: #ffffff;
9674 border-color: #ffffff;
9675}
9676.md .color-theme-white .checkbox .ripple-wave {
9677 background: rgba(255, 255, 255, 0.5);
9678}
9679.md .color-theme-black label.item-checkbox input[type="checkbox"]:checked ~ .icon-checkbox,
9680.md .color-theme-black label.item-checkbox input[type="checkbox"]:checked ~ * .icon-checkbox,
9681.md .color-theme-black .checkbox input[type="checkbox"]:checked ~ i {
9682 background-color: #000000;
9683 border-color: #000000;
9684}
9685.md .color-theme-black .checkbox .ripple-wave {
9686 background: rgba(0, 0, 0, 0.5);
9687}
9688.md label.item-checkbox.color-red input[type="checkbox"]:checked ~ .icon-checkbox,
9689.md label.item-checkbox.color-red input[type="checkbox"]:checked ~ * .icon-checkbox,
9690.md .checkbox.color-red input[type="checkbox"]:checked ~ i {
9691 background-color: #f44336;
9692 border-color: #f44336;
9693}
9694.md .checkbox.color-red .ripple-wave {
9695 background: rgba(244, 67, 54, 0.5);
9696}
9697.md label.item-checkbox.color-green input[type="checkbox"]:checked ~ .icon-checkbox,
9698.md label.item-checkbox.color-green input[type="checkbox"]:checked ~ * .icon-checkbox,
9699.md .checkbox.color-green input[type="checkbox"]:checked ~ i {
9700 background-color: #4caf50;
9701 border-color: #4caf50;
9702}
9703.md .checkbox.color-green .ripple-wave {
9704 background: rgba(76, 175, 80, 0.5);
9705}
9706.md label.item-checkbox.color-blue input[type="checkbox"]:checked ~ .icon-checkbox,
9707.md label.item-checkbox.color-blue input[type="checkbox"]:checked ~ * .icon-checkbox,
9708.md .checkbox.color-blue input[type="checkbox"]:checked ~ i {
9709 background-color: #2196f3;
9710 border-color: #2196f3;
9711}
9712.md .checkbox.color-blue .ripple-wave {
9713 background: rgba(33, 150, 243, 0.5);
9714}
9715.md label.item-checkbox.color-pink input[type="checkbox"]:checked ~ .icon-checkbox,
9716.md label.item-checkbox.color-pink input[type="checkbox"]:checked ~ * .icon-checkbox,
9717.md .checkbox.color-pink input[type="checkbox"]:checked ~ i {
9718 background-color: #e91e63;
9719 border-color: #e91e63;
9720}
9721.md .checkbox.color-pink .ripple-wave {
9722 background: rgba(233, 30, 99, 0.5);
9723}
9724.md label.item-checkbox.color-yellow input[type="checkbox"]:checked ~ .icon-checkbox,
9725.md label.item-checkbox.color-yellow input[type="checkbox"]:checked ~ * .icon-checkbox,
9726.md .checkbox.color-yellow input[type="checkbox"]:checked ~ i {
9727 background-color: #ffeb3b;
9728 border-color: #ffeb3b;
9729}
9730.md .checkbox.color-yellow .ripple-wave {
9731 background: rgba(255, 235, 59, 0.5);
9732}
9733.md label.item-checkbox.color-orange input[type="checkbox"]:checked ~ .icon-checkbox,
9734.md label.item-checkbox.color-orange input[type="checkbox"]:checked ~ * .icon-checkbox,
9735.md .checkbox.color-orange input[type="checkbox"]:checked ~ i {
9736 background-color: #ff9800;
9737 border-color: #ff9800;
9738}
9739.md .checkbox.color-orange .ripple-wave {
9740 background: rgba(255, 152, 0, 0.5);
9741}
9742.md label.item-checkbox.color-gray input[type="checkbox"]:checked ~ .icon-checkbox,
9743.md label.item-checkbox.color-gray input[type="checkbox"]:checked ~ * .icon-checkbox,
9744.md .checkbox.color-gray input[type="checkbox"]:checked ~ i {
9745 background-color: #9e9e9e;
9746 border-color: #9e9e9e;
9747}
9748.md .checkbox.color-gray .ripple-wave {
9749 background: rgba(158, 158, 158, 0.5);
9750}
9751.md label.item-checkbox.color-white input[type="checkbox"]:checked ~ .icon-checkbox,
9752.md label.item-checkbox.color-white input[type="checkbox"]:checked ~ * .icon-checkbox,
9753.md .checkbox.color-white input[type="checkbox"]:checked ~ i {
9754 background-color: #ffffff;
9755 border-color: #ffffff;
9756}
9757.md .checkbox.color-white .ripple-wave {
9758 background: rgba(255, 255, 255, 0.5);
9759}
9760.md label.item-checkbox.color-black input[type="checkbox"]:checked ~ .icon-checkbox,
9761.md label.item-checkbox.color-black input[type="checkbox"]:checked ~ * .icon-checkbox,
9762.md .checkbox.color-black input[type="checkbox"]:checked ~ i {
9763 background-color: #000000;
9764 border-color: #000000;
9765}
9766.md .checkbox.color-black .ripple-wave {
9767 background: rgba(0, 0, 0, 0.5);
9768}
9769/* === Radio === */
9770.icon-radio {
9771 -webkit-flex-shrink: 0;
9772 -ms-flex-negative: 0;
9773 flex-shrink: 0;
9774}
9775.radio {
9776 position: relative;
9777 display: inline-block;
9778 vertical-align: middle;
9779 z-index: 1;
9780}
9781label.item-radio,
9782.radio {
9783 cursor: pointer;
9784}
9785label.item-radio input[type="checkbox"],
9786.radio input[type="checkbox"],
9787label.item-radio input[type="radio"],
9788.radio input[type="radio"] {
9789 display: none;
9790}
9791label.item-radio .icon-radio,
9792.radio .icon-radio {
9793 -webkit-box-sizing: border-box;
9794 box-sizing: border-box;
9795 position: relative;
9796 display: block;
9797}
9798label.item-radio .icon-radio:after,
9799.radio .icon-radio:after {
9800 content: '';
9801 position: absolute;
9802}
9803label.item-radio {
9804 -webkit-transition-duration: 300ms;
9805 transition-duration: 300ms;
9806}
9807label.item-radio.active-state:after {
9808 background-color: transparent;
9809}
9810label.item-radio.disabled,
9811.disabled label.item-radio {
9812 opacity: 0.55;
9813 pointer-events: none;
9814 opacity: 0.55 !important;
9815 pointer-events: none !important;
9816}
9817.md .icon-radio {
9818 width: 20px;
9819 height: 20px;
9820 position: relative;
9821 border-radius: 50%;
9822 border: 2px solid #6d6d6d;
9823 -webkit-box-sizing: border-box;
9824 box-sizing: border-box;
9825 -webkit-transition-duration: 200ms;
9826 transition-duration: 200ms;
9827 display: block;
9828}
9829.md .icon-radio:after {
9830 content: '';
9831 position: absolute;
9832 width: 10px;
9833 height: 10px;
9834 left: 50%;
9835 top: 50%;
9836 margin-left: -5px;
9837 margin-top: -5px;
9838 background-color: #2196f3;
9839 border-radius: 50%;
9840 -webkit-transform: scale(0);
9841 transform: scale(0);
9842 -webkit-transition-duration: 200ms;
9843 transition-duration: 200ms;
9844}
9845.md label.item-radio input[type="radio"]:checked ~ .icon-radio,
9846.md label.item-radio input[type="radio"]:checked ~ * .icon-radio,
9847.md .radio input[type="radio"]:checked ~ .icon-radio {
9848 border-color: #2196f3;
9849}
9850.md label.item-radio input[type="radio"]:checked ~ .icon-radio:after,
9851.md label.item-radio input[type="radio"]:checked ~ * .icon-radio:after,
9852.md .radio input[type="radio"]:checked ~ .icon-radio:after {
9853 background-color: #2196f3;
9854 -webkit-transform: scale(1);
9855 transform: scale(1);
9856}
9857.md label.item-radio {
9858 position: relative;
9859 overflow: hidden;
9860 z-index: 0;
9861}
9862.md label.item-radio > .icon-radio {
9863 margin-right: 38px;
9864}
9865.md label.item-radio .item-content .item-media,
9866.md label.item-radio.item-content .item-media {
9867 -webkit-align-self: center;
9868 -ms-flex-item-align: center;
9869 align-self: center;
9870}
9871.md label.item-radio.active-state {
9872 background-color: rgba(0, 0, 0, 0.1);
9873}
9874.md .theme-dark label.item-radio.active-state {
9875 background-color: rgba(255, 255, 255, 0.05);
9876}
9877.md .theme-dark .icon-radio {
9878 border-color: rgba(255, 255, 255, 0.54);
9879}
9880.md .color-theme-red .icon-radio:after {
9881 background-color: #f44336;
9882}
9883.md .color-theme-red label.item-radio input[type="radio"]:checked ~ .icon-radio,
9884.md .color-theme-red label.item-radio input[type="radio"]:checked ~ * .icon-radio,
9885.md .color-theme-red .radio input[type="radio"]:checked ~ .icon-radio {
9886 border-color: #f44336;
9887}
9888.md .color-theme-red label.item-radio input[type="radio"]:checked ~ .icon-radio:after,
9889.md .color-theme-red label.item-radio input[type="radio"]:checked ~ * .icon-radio:after,
9890.md .color-theme-red .radio input[type="radio"]:checked ~ .icon-radio:after {
9891 background-color: #f44336;
9892}
9893.md .color-theme-red .radio .ripple-wave {
9894 background: rgba(244, 67, 54, 0.5);
9895}
9896.md .color-theme-green .icon-radio:after {
9897 background-color: #4caf50;
9898}
9899.md .color-theme-green label.item-radio input[type="radio"]:checked ~ .icon-radio,
9900.md .color-theme-green label.item-radio input[type="radio"]:checked ~ * .icon-radio,
9901.md .color-theme-green .radio input[type="radio"]:checked ~ .icon-radio {
9902 border-color: #4caf50;
9903}
9904.md .color-theme-green label.item-radio input[type="radio"]:checked ~ .icon-radio:after,
9905.md .color-theme-green label.item-radio input[type="radio"]:checked ~ * .icon-radio:after,
9906.md .color-theme-green .radio input[type="radio"]:checked ~ .icon-radio:after {
9907 background-color: #4caf50;
9908}
9909.md .color-theme-green .radio .ripple-wave {
9910 background: rgba(76, 175, 80, 0.5);
9911}
9912.md .color-theme-blue .icon-radio:after {
9913 background-color: #2196f3;
9914}
9915.md .color-theme-blue label.item-radio input[type="radio"]:checked ~ .icon-radio,
9916.md .color-theme-blue label.item-radio input[type="radio"]:checked ~ * .icon-radio,
9917.md .color-theme-blue .radio input[type="radio"]:checked ~ .icon-radio {
9918 border-color: #2196f3;
9919}
9920.md .color-theme-blue label.item-radio input[type="radio"]:checked ~ .icon-radio:after,
9921.md .color-theme-blue label.item-radio input[type="radio"]:checked ~ * .icon-radio:after,
9922.md .color-theme-blue .radio input[type="radio"]:checked ~ .icon-radio:after {
9923 background-color: #2196f3;
9924}
9925.md .color-theme-blue .radio .ripple-wave {
9926 background: rgba(33, 150, 243, 0.5);
9927}
9928.md .color-theme-pink .icon-radio:after {
9929 background-color: #e91e63;
9930}
9931.md .color-theme-pink label.item-radio input[type="radio"]:checked ~ .icon-radio,
9932.md .color-theme-pink label.item-radio input[type="radio"]:checked ~ * .icon-radio,
9933.md .color-theme-pink .radio input[type="radio"]:checked ~ .icon-radio {
9934 border-color: #e91e63;
9935}
9936.md .color-theme-pink label.item-radio input[type="radio"]:checked ~ .icon-radio:after,
9937.md .color-theme-pink label.item-radio input[type="radio"]:checked ~ * .icon-radio:after,
9938.md .color-theme-pink .radio input[type="radio"]:checked ~ .icon-radio:after {
9939 background-color: #e91e63;
9940}
9941.md .color-theme-pink .radio .ripple-wave {
9942 background: rgba(233, 30, 99, 0.5);
9943}
9944.md .color-theme-yellow .icon-radio:after {
9945 background-color: #ffeb3b;
9946}
9947.md .color-theme-yellow label.item-radio input[type="radio"]:checked ~ .icon-radio,
9948.md .color-theme-yellow label.item-radio input[type="radio"]:checked ~ * .icon-radio,
9949.md .color-theme-yellow .radio input[type="radio"]:checked ~ .icon-radio {
9950 border-color: #ffeb3b;
9951}
9952.md .color-theme-yellow label.item-radio input[type="radio"]:checked ~ .icon-radio:after,
9953.md .color-theme-yellow label.item-radio input[type="radio"]:checked ~ * .icon-radio:after,
9954.md .color-theme-yellow .radio input[type="radio"]:checked ~ .icon-radio:after {
9955 background-color: #ffeb3b;
9956}
9957.md .color-theme-yellow .radio .ripple-wave {
9958 background: rgba(255, 235, 59, 0.5);
9959}
9960.md .color-theme-orange .icon-radio:after {
9961 background-color: #ff9800;
9962}
9963.md .color-theme-orange label.item-radio input[type="radio"]:checked ~ .icon-radio,
9964.md .color-theme-orange label.item-radio input[type="radio"]:checked ~ * .icon-radio,
9965.md .color-theme-orange .radio input[type="radio"]:checked ~ .icon-radio {
9966 border-color: #ff9800;
9967}
9968.md .color-theme-orange label.item-radio input[type="radio"]:checked ~ .icon-radio:after,
9969.md .color-theme-orange label.item-radio input[type="radio"]:checked ~ * .icon-radio:after,
9970.md .color-theme-orange .radio input[type="radio"]:checked ~ .icon-radio:after {
9971 background-color: #ff9800;
9972}
9973.md .color-theme-orange .radio .ripple-wave {
9974 background: rgba(255, 152, 0, 0.5);
9975}
9976.md .color-theme-gray .icon-radio:after {
9977 background-color: #9e9e9e;
9978}
9979.md .color-theme-gray label.item-radio input[type="radio"]:checked ~ .icon-radio,
9980.md .color-theme-gray label.item-radio input[type="radio"]:checked ~ * .icon-radio,
9981.md .color-theme-gray .radio input[type="radio"]:checked ~ .icon-radio {
9982 border-color: #9e9e9e;
9983}
9984.md .color-theme-gray label.item-radio input[type="radio"]:checked ~ .icon-radio:after,
9985.md .color-theme-gray label.item-radio input[type="radio"]:checked ~ * .icon-radio:after,
9986.md .color-theme-gray .radio input[type="radio"]:checked ~ .icon-radio:after {
9987 background-color: #9e9e9e;
9988}
9989.md .color-theme-gray .radio .ripple-wave {
9990 background: rgba(158, 158, 158, 0.5);
9991}
9992.md .color-theme-white .icon-radio:after {
9993 background-color: #ffffff;
9994}
9995.md .color-theme-white label.item-radio input[type="radio"]:checked ~ .icon-radio,
9996.md .color-theme-white label.item-radio input[type="radio"]:checked ~ * .icon-radio,
9997.md .color-theme-white .radio input[type="radio"]:checked ~ .icon-radio {
9998 border-color: #ffffff;
9999}
10000.md .color-theme-white label.item-radio input[type="radio"]:checked ~ .icon-radio:after,
10001.md .color-theme-white label.item-radio input[type="radio"]:checked ~ * .icon-radio:after,
10002.md .color-theme-white .radio input[type="radio"]:checked ~ .icon-radio:after {
10003 background-color: #ffffff;
10004}
10005.md .color-theme-white .radio .ripple-wave {
10006 background: rgba(255, 255, 255, 0.5);
10007}
10008.md .color-theme-black .icon-radio:after {
10009 background-color: #000000;
10010}
10011.md .color-theme-black label.item-radio input[type="radio"]:checked ~ .icon-radio,
10012.md .color-theme-black label.item-radio input[type="radio"]:checked ~ * .icon-radio,
10013.md .color-theme-black .radio input[type="radio"]:checked ~ .icon-radio {
10014 border-color: #000000;
10015}
10016.md .color-theme-black label.item-radio input[type="radio"]:checked ~ .icon-radio:after,
10017.md .color-theme-black label.item-radio input[type="radio"]:checked ~ * .icon-radio:after,
10018.md .color-theme-black .radio input[type="radio"]:checked ~ .icon-radio:after {
10019 background-color: #000000;
10020}
10021.md .color-theme-black .radio .ripple-wave {
10022 background: rgba(0, 0, 0, 0.5);
10023}
10024.md .radio.color-red .icon-radio:after {
10025 background-color: #f44336;
10026}
10027.md label.item-radio.color-red input[type="radio"]:checked ~ .icon-radio,
10028.md label.item-radio.color-red input[type="radio"]:checked ~ * .icon-radio,
10029.md .radio.color-red input[type="radio"]:checked ~ .icon-radio {
10030 border-color: #f44336;
10031}
10032.md label.item-radio.color-red input[type="radio"]:checked ~ .icon-radio:after,
10033.md label.item-radio.color-red input[type="radio"]:checked ~ * .icon-radio:after,
10034.md .radio.color-red input[type="radio"]:checked ~ .icon-radio:after {
10035 background-color: #f44336;
10036}
10037.md .radio.color-red .ripple-wave {
10038 background: rgba(244, 67, 54, 0.5);
10039}
10040.md .radio.color-green .icon-radio:after {
10041 background-color: #4caf50;
10042}
10043.md label.item-radio.color-green input[type="radio"]:checked ~ .icon-radio,
10044.md label.item-radio.color-green input[type="radio"]:checked ~ * .icon-radio,
10045.md .radio.color-green input[type="radio"]:checked ~ .icon-radio {
10046 border-color: #4caf50;
10047}
10048.md label.item-radio.color-green input[type="radio"]:checked ~ .icon-radio:after,
10049.md label.item-radio.color-green input[type="radio"]:checked ~ * .icon-radio:after,
10050.md .radio.color-green input[type="radio"]:checked ~ .icon-radio:after {
10051 background-color: #4caf50;
10052}
10053.md .radio.color-green .ripple-wave {
10054 background: rgba(76, 175, 80, 0.5);
10055}
10056.md .radio.color-blue .icon-radio:after {
10057 background-color: #2196f3;
10058}
10059.md label.item-radio.color-blue input[type="radio"]:checked ~ .icon-radio,
10060.md label.item-radio.color-blue input[type="radio"]:checked ~ * .icon-radio,
10061.md .radio.color-blue input[type="radio"]:checked ~ .icon-radio {
10062 border-color: #2196f3;
10063}
10064.md label.item-radio.color-blue input[type="radio"]:checked ~ .icon-radio:after,
10065.md label.item-radio.color-blue input[type="radio"]:checked ~ * .icon-radio:after,
10066.md .radio.color-blue input[type="radio"]:checked ~ .icon-radio:after {
10067 background-color: #2196f3;
10068}
10069.md .radio.color-blue .ripple-wave {
10070 background: rgba(33, 150, 243, 0.5);
10071}
10072.md .radio.color-pink .icon-radio:after {
10073 background-color: #e91e63;
10074}
10075.md label.item-radio.color-pink input[type="radio"]:checked ~ .icon-radio,
10076.md label.item-radio.color-pink input[type="radio"]:checked ~ * .icon-radio,
10077.md .radio.color-pink input[type="radio"]:checked ~ .icon-radio {
10078 border-color: #e91e63;
10079}
10080.md label.item-radio.color-pink input[type="radio"]:checked ~ .icon-radio:after,
10081.md label.item-radio.color-pink input[type="radio"]:checked ~ * .icon-radio:after,
10082.md .radio.color-pink input[type="radio"]:checked ~ .icon-radio:after {
10083 background-color: #e91e63;
10084}
10085.md .radio.color-pink .ripple-wave {
10086 background: rgba(233, 30, 99, 0.5);
10087}
10088.md .radio.color-yellow .icon-radio:after {
10089 background-color: #ffeb3b;
10090}
10091.md label.item-radio.color-yellow input[type="radio"]:checked ~ .icon-radio,
10092.md label.item-radio.color-yellow input[type="radio"]:checked ~ * .icon-radio,
10093.md .radio.color-yellow input[type="radio"]:checked ~ .icon-radio {
10094 border-color: #ffeb3b;
10095}
10096.md label.item-radio.color-yellow input[type="radio"]:checked ~ .icon-radio:after,
10097.md label.item-radio.color-yellow input[type="radio"]:checked ~ * .icon-radio:after,
10098.md .radio.color-yellow input[type="radio"]:checked ~ .icon-radio:after {
10099 background-color: #ffeb3b;
10100}
10101.md .radio.color-yellow .ripple-wave {
10102 background: rgba(255, 235, 59, 0.5);
10103}
10104.md .radio.color-orange .icon-radio:after {
10105 background-color: #ff9800;
10106}
10107.md label.item-radio.color-orange input[type="radio"]:checked ~ .icon-radio,
10108.md label.item-radio.color-orange input[type="radio"]:checked ~ * .icon-radio,
10109.md .radio.color-orange input[type="radio"]:checked ~ .icon-radio {
10110 border-color: #ff9800;
10111}
10112.md label.item-radio.color-orange input[type="radio"]:checked ~ .icon-radio:after,
10113.md label.item-radio.color-orange input[type="radio"]:checked ~ * .icon-radio:after,
10114.md .radio.color-orange input[type="radio"]:checked ~ .icon-radio:after {
10115 background-color: #ff9800;
10116}
10117.md .radio.color-orange .ripple-wave {
10118 background: rgba(255, 152, 0, 0.5);
10119}
10120.md .radio.color-gray .icon-radio:after {
10121 background-color: #9e9e9e;
10122}
10123.md label.item-radio.color-gray input[type="radio"]:checked ~ .icon-radio,
10124.md label.item-radio.color-gray input[type="radio"]:checked ~ * .icon-radio,
10125.md .radio.color-gray input[type="radio"]:checked ~ .icon-radio {
10126 border-color: #9e9e9e;
10127}
10128.md label.item-radio.color-gray input[type="radio"]:checked ~ .icon-radio:after,
10129.md label.item-radio.color-gray input[type="radio"]:checked ~ * .icon-radio:after,
10130.md .radio.color-gray input[type="radio"]:checked ~ .icon-radio:after {
10131 background-color: #9e9e9e;
10132}
10133.md .radio.color-gray .ripple-wave {
10134 background: rgba(158, 158, 158, 0.5);
10135}
10136.md .radio.color-white .icon-radio:after {
10137 background-color: #ffffff;
10138}
10139.md label.item-radio.color-white input[type="radio"]:checked ~ .icon-radio,
10140.md label.item-radio.color-white input[type="radio"]:checked ~ * .icon-radio,
10141.md .radio.color-white input[type="radio"]:checked ~ .icon-radio {
10142 border-color: #ffffff;
10143}
10144.md label.item-radio.color-white input[type="radio"]:checked ~ .icon-radio:after,
10145.md label.item-radio.color-white input[type="radio"]:checked ~ * .icon-radio:after,
10146.md .radio.color-white input[type="radio"]:checked ~ .icon-radio:after {
10147 background-color: #ffffff;
10148}
10149.md .radio.color-white .ripple-wave {
10150 background: rgba(255, 255, 255, 0.5);
10151}
10152.md .radio.color-black .icon-radio:after {
10153 background-color: #000000;
10154}
10155.md label.item-radio.color-black input[type="radio"]:checked ~ .icon-radio,
10156.md label.item-radio.color-black input[type="radio"]:checked ~ * .icon-radio,
10157.md .radio.color-black input[type="radio"]:checked ~ .icon-radio {
10158 border-color: #000000;
10159}
10160.md label.item-radio.color-black input[type="radio"]:checked ~ .icon-radio:after,
10161.md label.item-radio.color-black input[type="radio"]:checked ~ * .icon-radio:after,
10162.md .radio.color-black input[type="radio"]:checked ~ .icon-radio:after {
10163 background-color: #000000;
10164}
10165.md .radio.color-black .ripple-wave {
10166 background: rgba(0, 0, 0, 0.5);
10167}
10168/* === Toggle === */
10169.toggle {
10170 display: inline-block;
10171 vertical-align: middle;
10172 position: relative;
10173 -webkit-box-sizing: border-box;
10174 box-sizing: border-box;
10175 -webkit-align-self: center;
10176 -ms-flex-item-align: center;
10177 align-self: center;
10178 -webkit-user-select: none;
10179 -moz-user-select: none;
10180 -ms-user-select: none;
10181 user-select: none;
10182}
10183.toggle input[type="checkbox"] {
10184 display: none;
10185}
10186.toggle input[disabled] ~ .toggle-icon {
10187 pointer-events: none;
10188}
10189.toggle-icon {
10190 z-index: 0;
10191 margin: 0;
10192 padding: 0;
10193 -webkit-appearance: none;
10194 -moz-appearance: none;
10195 appearance: none;
10196 border: none;
10197 position: relative;
10198 -webkit-transition: 300ms;
10199 transition: 300ms;
10200 -webkit-box-sizing: border-box;
10201 box-sizing: border-box;
10202 display: block;
10203 cursor: pointer;
10204}
10205.toggle-icon:before,
10206.toggle-icon:after {
10207 content: '';
10208}
10209.toggle-icon:after {
10210 background: #fff;
10211 position: absolute;
10212 z-index: 2;
10213 -webkit-transform: translateX(0px);
10214 transform: translateX(0px);
10215 -webkit-transition-duration: 300ms;
10216 transition-duration: 300ms;
10217}
10218.md .toggle {
10219 width: 36px;
10220 height: 14px;
10221}
10222.md .toggle input[type="checkbox"]:checked + .toggle-icon {
10223 background: rgba(33, 150, 243, 0.5);
10224}
10225.md .toggle input[type="checkbox"]:checked + .toggle-icon:after {
10226 -webkit-transform: translateX(16px);
10227 transform: translateX(16px);
10228 background: #2196f3;
10229}
10230.md .toggle-icon {
10231 width: 36px;
10232 height: 14px;
10233 border-radius: 14px;
10234 background: #b0afaf;
10235}
10236.md .toggle-icon:after {
10237 height: 20px;
10238 width: 20px;
10239 top: -3px;
10240 -webkit-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
10241 box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
10242 border-radius: 10px;
10243 left: 0;
10244}
10245.md .color-theme-red .toggle input[type="checkbox"]:checked + .toggle-icon {
10246 background: rgba(244, 67, 54, 0.5);
10247}
10248.md .color-theme-red .toggle input[type="checkbox"]:checked + .toggle-icon:after {
10249 background: #f44336;
10250}
10251.md .color-theme-green .toggle input[type="checkbox"]:checked + .toggle-icon {
10252 background: rgba(76, 175, 80, 0.5);
10253}
10254.md .color-theme-green .toggle input[type="checkbox"]:checked + .toggle-icon:after {
10255 background: #4caf50;
10256}
10257.md .color-theme-blue .toggle input[type="checkbox"]:checked + .toggle-icon {
10258 background: rgba(33, 150, 243, 0.5);
10259}
10260.md .color-theme-blue .toggle input[type="checkbox"]:checked + .toggle-icon:after {
10261 background: #2196f3;
10262}
10263.md .color-theme-pink .toggle input[type="checkbox"]:checked + .toggle-icon {
10264 background: rgba(233, 30, 99, 0.5);
10265}
10266.md .color-theme-pink .toggle input[type="checkbox"]:checked + .toggle-icon:after {
10267 background: #e91e63;
10268}
10269.md .color-theme-yellow .toggle input[type="checkbox"]:checked + .toggle-icon {
10270 background: rgba(255, 235, 59, 0.5);
10271}
10272.md .color-theme-yellow .toggle input[type="checkbox"]:checked + .toggle-icon:after {
10273 background: #ffeb3b;
10274}
10275.md .color-theme-orange .toggle input[type="checkbox"]:checked + .toggle-icon {
10276 background: rgba(255, 152, 0, 0.5);
10277}
10278.md .color-theme-orange .toggle input[type="checkbox"]:checked + .toggle-icon:after {
10279 background: #ff9800;
10280}
10281.md .color-theme-gray .toggle input[type="checkbox"]:checked + .toggle-icon {
10282 background: rgba(158, 158, 158, 0.5);
10283}
10284.md .color-theme-gray .toggle input[type="checkbox"]:checked + .toggle-icon:after {
10285 background: #9e9e9e;
10286}
10287.md .color-theme-white .toggle input[type="checkbox"]:checked + .toggle-icon {
10288 background: rgba(255, 255, 255, 0.5);
10289}
10290.md .color-theme-white .toggle input[type="checkbox"]:checked + .toggle-icon:after {
10291 background: #ffffff;
10292}
10293.md .color-theme-black .toggle input[type="checkbox"]:checked + .toggle-icon {
10294 background: rgba(0, 0, 0, 0.5);
10295}
10296.md .color-theme-black .toggle input[type="checkbox"]:checked + .toggle-icon:after {
10297 background: #000000;
10298}
10299.md .toggle.color-red input[type="checkbox"]:checked + .toggle-icon {
10300 background: rgba(244, 67, 54, 0.5);
10301}
10302.md .toggle.color-red input[type="checkbox"]:checked + .toggle-icon:after {
10303 background: #f44336;
10304}
10305.md .toggle.color-green input[type="checkbox"]:checked + .toggle-icon {
10306 background: rgba(76, 175, 80, 0.5);
10307}
10308.md .toggle.color-green input[type="checkbox"]:checked + .toggle-icon:after {
10309 background: #4caf50;
10310}
10311.md .toggle.color-blue input[type="checkbox"]:checked + .toggle-icon {
10312 background: rgba(33, 150, 243, 0.5);
10313}
10314.md .toggle.color-blue input[type="checkbox"]:checked + .toggle-icon:after {
10315 background: #2196f3;
10316}
10317.md .toggle.color-pink input[type="checkbox"]:checked + .toggle-icon {
10318 background: rgba(233, 30, 99, 0.5);
10319}
10320.md .toggle.color-pink input[type="checkbox"]:checked + .toggle-icon:after {
10321 background: #e91e63;
10322}
10323.md .toggle.color-yellow input[type="checkbox"]:checked + .toggle-icon {
10324 background: rgba(255, 235, 59, 0.5);
10325}
10326.md .toggle.color-yellow input[type="checkbox"]:checked + .toggle-icon:after {
10327 background: #ffeb3b;
10328}
10329.md .toggle.color-orange input[type="checkbox"]:checked + .toggle-icon {
10330 background: rgba(255, 152, 0, 0.5);
10331}
10332.md .toggle.color-orange input[type="checkbox"]:checked + .toggle-icon:after {
10333 background: #ff9800;
10334}
10335.md .toggle.color-gray input[type="checkbox"]:checked + .toggle-icon {
10336 background: rgba(158, 158, 158, 0.5);
10337}
10338.md .toggle.color-gray input[type="checkbox"]:checked + .toggle-icon:after {
10339 background: #9e9e9e;
10340}
10341.md .toggle.color-white input[type="checkbox"]:checked + .toggle-icon {
10342 background: rgba(255, 255, 255, 0.5);
10343}
10344.md .toggle.color-white input[type="checkbox"]:checked + .toggle-icon:after {
10345 background: #ffffff;
10346}
10347.md .toggle.color-black input[type="checkbox"]:checked + .toggle-icon {
10348 background: rgba(0, 0, 0, 0.5);
10349}
10350.md .toggle.color-black input[type="checkbox"]:checked + .toggle-icon:after {
10351 background: #000000;
10352}
10353/* === Range Slider === */
10354.range-slider {
10355 display: block;
10356 width: 100%;
10357 position: relative;
10358 -webkit-align-self: center;
10359 -ms-flex-item-align: center;
10360 align-self: center;
10361 cursor: pointer;
10362 -webkit-user-select: none;
10363 -moz-user-select: none;
10364 -ms-user-select: none;
10365 user-select: none;
10366}
10367.range-slider input[type="range"] {
10368 display: none;
10369}
10370.range-bar {
10371 position: absolute;
10372 left: 0;
10373 top: 50%;
10374 width: 100%;
10375 overflow: hidden;
10376}
10377.range-bar-active {
10378 position: absolute;
10379 left: 0;
10380 top: 0;
10381 height: 100%;
10382}
10383.range-knob-wrap {
10384 z-index: 20;
10385 position: absolute;
10386 top: 50%;
10387 left: 0;
10388}
10389.range-knob {
10390 -webkit-box-sizing: border-box;
10391 box-sizing: border-box;
10392 border-radius: 50%;
10393 position: absolute;
10394 left: 0;
10395 top: 0;
10396 width: 100%;
10397 height: 100%;
10398 z-index: 1;
10399}
10400.range-knob:after {
10401 content: '';
10402 position: absolute;
10403 left: 50%;
10404 top: 50%;
10405 width: 44px;
10406 height: 44px;
10407 margin-left: -22px;
10408 margin-top: -22px;
10409}
10410.range-knob-label {
10411 position: absolute;
10412 left: 50%;
10413 bottom: 100%;
10414 text-align: center;
10415 -webkit-transition-duration: 120ms;
10416 transition-duration: 120ms;
10417 -webkit-transition-property: -webkit-transform;
10418 transition-property: -webkit-transform;
10419 transition-property: transform;
10420 transition-property: transform, -webkit-transform;
10421 -webkit-transform: translateY(100%) scale(0);
10422 transform: translateY(100%) scale(0);
10423}
10424.range-knob-active-state .range-knob-label {
10425 -webkit-transform: translateY(0%) scale(1);
10426 transform: translateY(0%) scale(1);
10427}
10428.md .range-slider {
10429 height: 20px;
10430}
10431.md .range-bar {
10432 background: #b9b9b9;
10433 height: 2px;
10434 margin-top: -1px;
10435}
10436.md .range-bar-active {
10437 background: #2196f3;
10438}
10439.md .range-knob-wrap {
10440 height: 12px;
10441 width: 12px;
10442 margin-top: -6px;
10443 margin-left: -6px;
10444}
10445.md .range-knob {
10446 background: #2196f3;
10447 -webkit-transition-duration: 200ms;
10448 transition-duration: 200ms;
10449 -webkit-transition-property: background-color, -webkit-transform;
10450 transition-property: background-color, -webkit-transform;
10451 transition-property: transform, background-color;
10452 transition-property: transform, background-color, -webkit-transform;
10453}
10454.md .range-knob-active-state .range-knob {
10455 -webkit-transform: scale(1.5);
10456 transform: scale(1.5);
10457}
10458.md .range-slider-min:not(.range-slider-dual) .range-knob {
10459 background: #fff !important;
10460 border: 2px solid #b9b9b9;
10461}
10462.md .range-knob-label {
10463 width: 26px;
10464 height: 26px;
10465 margin-left: -13px;
10466 margin-bottom: 8px;
10467 background: #2196f3;
10468 color: #fff;
10469 font-size: 10px;
10470 border-radius: 50%;
10471 line-height: 26px;
10472}
10473.md .range-knob-label:before {
10474 content: '';
10475 left: 50%;
10476 top: 0px;
10477 margin-left: -13px;
10478 position: absolute;
10479 z-index: -1;
10480 width: 26px;
10481 height: 26px;
10482 background: #2196f3;
10483 -webkit-transform: rotate(-45deg);
10484 transform: rotate(-45deg);
10485 border-radius: 50% 50% 50% 0;
10486}
10487.md .range-knob-active-state .range-knob-label {
10488 -webkit-transform: translateY(0%) scale(1);
10489 transform: translateY(0%) scale(1);
10490}
10491.md .range-slider-label .range-knob-active-state .range-knob {
10492 -webkit-transform: scale(0);
10493 transform: scale(0);
10494}
10495.md .color-theme-red .range-slider .range-bar-active,
10496.md .color-theme-red .range-slider .range-knob,
10497.md .color-theme-red .range-slider .range-knob-label,
10498.md .color-theme-red .range-slider .range-knob-label:before {
10499 background-color: #f44336;
10500}
10501.md .color-theme-green .range-slider .range-bar-active,
10502.md .color-theme-green .range-slider .range-knob,
10503.md .color-theme-green .range-slider .range-knob-label,
10504.md .color-theme-green .range-slider .range-knob-label:before {
10505 background-color: #4caf50;
10506}
10507.md .color-theme-blue .range-slider .range-bar-active,
10508.md .color-theme-blue .range-slider .range-knob,
10509.md .color-theme-blue .range-slider .range-knob-label,
10510.md .color-theme-blue .range-slider .range-knob-label:before {
10511 background-color: #2196f3;
10512}
10513.md .color-theme-pink .range-slider .range-bar-active,
10514.md .color-theme-pink .range-slider .range-knob,
10515.md .color-theme-pink .range-slider .range-knob-label,
10516.md .color-theme-pink .range-slider .range-knob-label:before {
10517 background-color: #e91e63;
10518}
10519.md .color-theme-yellow .range-slider .range-bar-active,
10520.md .color-theme-yellow .range-slider .range-knob,
10521.md .color-theme-yellow .range-slider .range-knob-label,
10522.md .color-theme-yellow .range-slider .range-knob-label:before {
10523 background-color: #ffeb3b;
10524}
10525.md .color-theme-orange .range-slider .range-bar-active,
10526.md .color-theme-orange .range-slider .range-knob,
10527.md .color-theme-orange .range-slider .range-knob-label,
10528.md .color-theme-orange .range-slider .range-knob-label:before {
10529 background-color: #ff9800;
10530}
10531.md .color-theme-gray .range-slider .range-bar-active,
10532.md .color-theme-gray .range-slider .range-knob,
10533.md .color-theme-gray .range-slider .range-knob-label,
10534.md .color-theme-gray .range-slider .range-knob-label:before {
10535 background-color: #9e9e9e;
10536}
10537.md .color-theme-white .range-slider .range-bar-active,
10538.md .color-theme-white .range-slider .range-knob,
10539.md .color-theme-white .range-slider .range-knob-label,
10540.md .color-theme-white .range-slider .range-knob-label:before {
10541 background-color: #ffffff;
10542}
10543.md .color-theme-black .range-slider .range-bar-active,
10544.md .color-theme-black .range-slider .range-knob,
10545.md .color-theme-black .range-slider .range-knob-label,
10546.md .color-theme-black .range-slider .range-knob-label:before {
10547 background-color: #000000;
10548}
10549.md .range-slider.color-red .range-bar-active,
10550.md .range-slider.color-red .range-knob,
10551.md .range-slider.color-red .range-knob-label,
10552.md .range-slider.color-red .range-knob-label:before {
10553 background-color: #f44336;
10554}
10555.md .range-slider.color-green .range-bar-active,
10556.md .range-slider.color-green .range-knob,
10557.md .range-slider.color-green .range-knob-label,
10558.md .range-slider.color-green .range-knob-label:before {
10559 background-color: #4caf50;
10560}
10561.md .range-slider.color-blue .range-bar-active,
10562.md .range-slider.color-blue .range-knob,
10563.md .range-slider.color-blue .range-knob-label,
10564.md .range-slider.color-blue .range-knob-label:before {
10565 background-color: #2196f3;
10566}
10567.md .range-slider.color-pink .range-bar-active,
10568.md .range-slider.color-pink .range-knob,
10569.md .range-slider.color-pink .range-knob-label,
10570.md .range-slider.color-pink .range-knob-label:before {
10571 background-color: #e91e63;
10572}
10573.md .range-slider.color-yellow .range-bar-active,
10574.md .range-slider.color-yellow .range-knob,
10575.md .range-slider.color-yellow .range-knob-label,
10576.md .range-slider.color-yellow .range-knob-label:before {
10577 background-color: #ffeb3b;
10578}
10579.md .range-slider.color-orange .range-bar-active,
10580.md .range-slider.color-orange .range-knob,
10581.md .range-slider.color-orange .range-knob-label,
10582.md .range-slider.color-orange .range-knob-label:before {
10583 background-color: #ff9800;
10584}
10585.md .range-slider.color-gray .range-bar-active,
10586.md .range-slider.color-gray .range-knob,
10587.md .range-slider.color-gray .range-knob-label,
10588.md .range-slider.color-gray .range-knob-label:before {
10589 background-color: #9e9e9e;
10590}
10591.md .range-slider.color-white .range-bar-active,
10592.md .range-slider.color-white .range-knob,
10593.md .range-slider.color-white .range-knob-label,
10594.md .range-slider.color-white .range-knob-label:before {
10595 background-color: #ffffff;
10596}
10597.md .range-slider.color-black .range-bar-active,
10598.md .range-slider.color-black .range-knob,
10599.md .range-slider.color-black .range-knob-label,
10600.md .range-slider.color-black .range-knob-label:before {
10601 background-color: #000000;
10602}
10603/* === Stepper === */
10604.stepper {
10605 display: -webkit-inline-box;
10606 display: -webkit-inline-flex;
10607 display: -ms-inline-flexbox;
10608 display: inline-flex;
10609 -webkit-box-align: stretch;
10610 -webkit-align-items: stretch;
10611 -ms-flex-align: stretch;
10612 align-items: stretch;
10613}
10614.stepper-button,
10615.stepper-button-minus,
10616.stepper-button-plus {
10617 text-align: center;
10618 display: -webkit-box;
10619 display: -webkit-flex;
10620 display: -ms-flexbox;
10621 display: flex;
10622 -webkit-box-pack: center;
10623 -webkit-justify-content: center;
10624 -ms-flex-pack: center;
10625 justify-content: center;
10626 -webkit-align-content: center;
10627 -ms-flex-line-pack: center;
10628 align-content: center;
10629 -webkit-box-align: center;
10630 -webkit-align-items: center;
10631 -ms-flex-align: center;
10632 align-items: center;
10633 -webkit-flex-shrink: 0;
10634 -ms-flex-negative: 0;
10635 flex-shrink: 0;
10636 -webkit-box-sizing: border-box;
10637 box-sizing: border-box;
10638 position: relative;
10639 cursor: pointer;
10640}
10641.stepper-button .icon,
10642.stepper-button-minus .icon,
10643.stepper-button-plus .icon {
10644 pointer-events: none;
10645}
10646.stepper-value {
10647 display: -webkit-box;
10648 display: -webkit-flex;
10649 display: -ms-flexbox;
10650 display: flex;
10651 -webkit-align-content: center;
10652 -ms-flex-line-pack: center;
10653 align-content: center;
10654 -webkit-box-align: center;
10655 -webkit-align-items: center;
10656 -ms-flex-align: center;
10657 align-items: center;
10658 -webkit-box-pack: center;
10659 -webkit-justify-content: center;
10660 -ms-flex-pack: center;
10661 justify-content: center;
10662}
10663.stepper-input-wrap,
10664.stepper-value {
10665 -webkit-flex-shrink: 1;
10666 -ms-flex-negative: 1;
10667 flex-shrink: 1;
10668 text-align: center;
10669}
10670.stepper-button-plus,
10671.stepper-button-minus {
10672 -webkit-user-select: none;
10673 -moz-user-select: none;
10674 -ms-user-select: none;
10675 user-select: none;
10676}
10677.stepper-button-plus:after,
10678.stepper-button-minus:after,
10679.stepper-button-plus:before,
10680.stepper-button-minus:before {
10681 content: '';
10682 position: absolute;
10683 left: 50%;
10684 top: 50%;
10685 -webkit-transform: translate(-50%, -50%);
10686 transform: translate(-50%, -50%);
10687}
10688.stepper-button-plus:after,
10689.stepper-button-minus:after {
10690 width: 15px;
10691 height: 2px;
10692}
10693.stepper-button-plus:before {
10694 height: 15px;
10695 width: 2px;
10696}
10697.stepper .stepper-input-wrap input,
10698.stepper .stepper-value {
10699 width: 45px;
10700}
10701.md .stepper {
10702 height: 36px;
10703}
10704.md .stepper-button,
10705.md .stepper-button-minus,
10706.md .stepper-button-plus {
10707 border: 2px solid #2196f3;
10708 color: #2196f3;
10709 line-height: 34px;
10710 height: 36px;
10711 width: 40px;
10712 -webkit-transition-duration: 300ms;
10713 transition-duration: 300ms;
10714 -webkit-transform: translate3d(0, 0, 0);
10715 transform: translate3d(0, 0, 0);
10716 overflow: hidden;
10717}
10718.md .stepper-button + .stepper-button,
10719.md .stepper-button-minus + .stepper-button,
10720.md .stepper-button-plus + .stepper-button,
10721.md .stepper-button + .stepper-button-minus,
10722.md .stepper-button-minus + .stepper-button-minus,
10723.md .stepper-button-plus + .stepper-button-minus,
10724.md .stepper-button + .stepper-button-plus,
10725.md .stepper-button-minus + .stepper-button-plus,
10726.md .stepper-button-plus + .stepper-button-plus {
10727 border-left: none;
10728}
10729.md .stepper-button.active-state,
10730.md .stepper-button-minus.active-state,
10731.md .stepper-button-plus.active-state {
10732 background: rgba(0, 0, 0, 0.1);
10733}
10734.md .stepper-button:first-child,
10735.md .stepper-button-minus:first-child,
10736.md .stepper-button-plus:first-child {
10737 border-radius: 4px 0 0 4px;
10738}
10739.md .stepper-button:last-child,
10740.md .stepper-button-minus:last-child,
10741.md .stepper-button-plus:last-child {
10742 border-radius: 0 4px 4px 0;
10743}
10744.md .stepper-button-plus:after,
10745.md .stepper-button-minus:after,
10746.md .stepper-button-plus:before,
10747.md .stepper-button-minus:before {
10748 background: #2196f3;
10749}
10750.md .stepper-value,
10751.md .stepper-input-wrap {
10752 border-top: 2px solid #2196f3;
10753 border-bottom: 2px solid #2196f3;
10754}
10755.md .stepper .stepper-value,
10756.md .stepper .stepper-input-wrap input {
10757 color: #2196f3;
10758 font-size: 14px;
10759 font-weight: 500;
10760 text-align: center;
10761}
10762.md .stepper .stepper-input-wrap input {
10763 height: 100%;
10764}
10765.md .stepper-fill .stepper-button,
10766.md .stepper-fill-md .stepper-button,
10767.md .stepper-fill .stepper-button-minus,
10768.md .stepper-fill-md .stepper-button-minus,
10769.md .stepper-fill .stepper-button-plus,
10770.md .stepper-fill-md .stepper-button-plus {
10771 background-color: #2196f3;
10772 color: #fff;
10773 border: none;
10774 line-height: 36px;
10775}
10776.md .stepper-fill .stepper-button.active-state,
10777.md .stepper-fill-md .stepper-button.active-state,
10778.md .stepper-fill .stepper-button-minus.active-state,
10779.md .stepper-fill-md .stepper-button-minus.active-state,
10780.md .stepper-fill .stepper-button-plus.active-state,
10781.md .stepper-fill-md .stepper-button-plus.active-state {
10782 background: #0c82df;
10783}
10784.md .stepper-fill .stepper-button:after,
10785.md .stepper-fill-md .stepper-button:after,
10786.md .stepper-fill .stepper-button-minus:after,
10787.md .stepper-fill-md .stepper-button-minus:after,
10788.md .stepper-fill .stepper-button-plus:after,
10789.md .stepper-fill-md .stepper-button-plus:after,
10790.md .stepper-fill .stepper-button:before,
10791.md .stepper-fill-md .stepper-button:before,
10792.md .stepper-fill .stepper-button-minus:before,
10793.md .stepper-fill-md .stepper-button-minus:before,
10794.md .stepper-fill .stepper-button-plus:before,
10795.md .stepper-fill-md .stepper-button-plus:before {
10796 background: #fff;
10797}
10798.md .stepper-fill .stepper-button + .stepper-button,
10799.md .stepper-fill-md .stepper-button + .stepper-button,
10800.md .stepper-fill .stepper-button-minus + .stepper-button-plus,
10801.md .stepper-fill-md .stepper-button-minus + .stepper-button-plus {
10802 border-left: 1px solid rgba(0, 0, 0, 0.1);
10803}
10804.md .stepper-fill.stepper-big .stepper-button,
10805.md .stepper-fill-md.stepper-big .stepper-button,
10806.md .stepper-fill.stepper-big-md .stepper-button,
10807.md .stepper-fill-md.stepper-big-md .stepper-button,
10808.md .stepper-fill.stepper-big .stepper-button-minus,
10809.md .stepper-fill-md.stepper-big .stepper-button-minus,
10810.md .stepper-fill.stepper-big-md .stepper-button-minus,
10811.md .stepper-fill-md.stepper-big-md .stepper-button-minus,
10812.md .stepper-fill.stepper-big .stepper-button-plus,
10813.md .stepper-fill-md.stepper-big .stepper-button-plus,
10814.md .stepper-fill.stepper-big-md .stepper-button-plus,
10815.md .stepper-fill-md.stepper-big-md .stepper-button-plus {
10816 line-height: 48px;
10817}
10818.md .stepper-fill.stepper-small .stepper-button,
10819.md .stepper-fill-md.stepper-small .stepper-button,
10820.md .stepper-fill.stepper-small-md .stepper-button,
10821.md .stepper-fill-md.stepper-small-md .stepper-button,
10822.md .stepper-fill.stepper-small .stepper-button-minus,
10823.md .stepper-fill-md.stepper-small .stepper-button-minus,
10824.md .stepper-fill.stepper-small-md .stepper-button-minus,
10825.md .stepper-fill-md.stepper-small-md .stepper-button-minus,
10826.md .stepper-fill.stepper-small .stepper-button-plus,
10827.md .stepper-fill-md.stepper-small .stepper-button-plus,
10828.md .stepper-fill.stepper-small-md .stepper-button-plus,
10829.md .stepper-fill-md.stepper-small-md .stepper-button-plus {
10830 line-height: 28px;
10831}
10832.md .stepper-small,
10833.md .stepper-small-md {
10834 height: 28px;
10835}
10836.md .stepper-small .stepper-button,
10837.md .stepper-small-md .stepper-button,
10838.md .stepper-small .stepper-button-minus,
10839.md .stepper-small-md .stepper-button-minus,
10840.md .stepper-small .stepper-button-plus,
10841.md .stepper-small-md .stepper-button-plus {
10842 height: 28px;
10843 line-height: 24px;
10844}
10845.md .stepper-small .stepper-button,
10846.md .stepper-small-md .stepper-button,
10847.md .stepper-small .stepper-button-minus,
10848.md .stepper-small-md .stepper-button-minus,
10849.md .stepper-small .stepper-button-plus,
10850.md .stepper-small-md .stepper-button-plus,
10851.md .stepper-small .stepper-input-wrap,
10852.md .stepper-small-md .stepper-input-wrap,
10853.md .stepper-small .stepper-value,
10854.md .stepper-small-md .stepper-value {
10855 border-width: 2px;
10856}
10857.md .stepper-big,
10858.md .stepper-big-md {
10859 height: 48px;
10860}
10861.md .stepper-big .stepper-button,
10862.md .stepper-big-md .stepper-button,
10863.md .stepper-big .stepper-button-minus,
10864.md .stepper-big-md .stepper-button-minus,
10865.md .stepper-big .stepper-button-plus,
10866.md .stepper-big-md .stepper-button-plus {
10867 height: 48px;
10868 line-height: 46px;
10869}
10870.md .stepper-big .stepper-button:first-child,
10871.md .stepper-big-md .stepper-button:first-child,
10872.md .stepper-big .stepper-button-minus:first-child,
10873.md .stepper-big-md .stepper-button-minus:first-child,
10874.md .stepper-big .stepper-button-plus:first-child,
10875.md .stepper-big-md .stepper-button-plus:first-child {
10876 border-radius: 4px 0 0 4px;
10877}
10878.md .stepper-big .stepper-button:last-child,
10879.md .stepper-big-md .stepper-button:last-child,
10880.md .stepper-big .stepper-button-minus:last-child,
10881.md .stepper-big-md .stepper-button-minus:last-child,
10882.md .stepper-big .stepper-button-plus:last-child,
10883.md .stepper-big-md .stepper-button-plus:last-child {
10884 border-radius: 0 4px 4px 0;
10885}
10886.md .stepper-round .stepper-button:first-child,
10887.md .stepper-round-md .stepper-button:first-child,
10888.md .stepper-round .stepper-button-minus:first-child,
10889.md .stepper-round-md .stepper-button-minus:first-child,
10890.md .stepper-round .stepper-button-plus:first-child,
10891.md .stepper-round-md .stepper-button-plus:first-child {
10892 border-radius: 36px 0 0 36px;
10893}
10894.md .stepper-round .stepper-button:last-child,
10895.md .stepper-round-md .stepper-button:last-child,
10896.md .stepper-round .stepper-button-minus:last-child,
10897.md .stepper-round-md .stepper-button-minus:last-child,
10898.md .stepper-round .stepper-button-plus:last-child,
10899.md .stepper-round-md .stepper-button-plus:last-child {
10900 border-radius: 0 36px 36px 0;
10901}
10902.md .stepper-raised {
10903 -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
10904 box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
10905 border-radius: 4px;
10906}
10907.md .stepper-raised.stepper-big,
10908.md .stepper-raised.stepper-big-md {
10909 border-radius: 4px;
10910}
10911.md .stepper-raised.stepper-round,
10912.md .stepper-raised.stepper-round-md {
10913 border-radius: 36px;
10914}
10915.md .stepper-raised .stepper-value,
10916.md .stepper-raised .stepper-input-wrap {
10917 border: none;
10918}
10919.md .stepper-raised:not(.stepper-fill):not(.stepper-fill-md) .stepper-input-wrap,
10920.md .stepper-raised:not(.stepper-fill):not(.stepper-fill-md) .stepper-value {
10921 border-left: 1px solid rgba(0, 0, 0, 0.1);
10922 border-right: 1px solid rgba(0, 0, 0, 0.1);
10923}
10924.md .stepper-raised .stepper-button,
10925.md .stepper-raised .stepper-button-minus,
10926.md .stepper-raised .stepper-button-plus {
10927 border: none;
10928}
10929.md .stepper-raised .stepper-button + .stepper-button,
10930.md .stepper-raised .stepper-button-minus + .stepper-button-plus {
10931 border-left: 1px solid rgba(0, 0, 0, 0.1);
10932}
10933.md .color-theme-red .stepper-button,
10934.md .color-theme-red .stepper-button-minus,
10935.md .color-theme-red .stepper-button-plus {
10936 border-color: #f44336;
10937 color: #f44336;
10938}
10939.md .color-theme-red .stepper-button-plus:after,
10940.md .color-theme-red .stepper-button-minus:after,
10941.md .color-theme-red .stepper-button-plus:before,
10942.md .color-theme-red .stepper-button-minus:before {
10943 background: #f44336;
10944}
10945.md .color-theme-red .stepper-value,
10946.md .color-theme-red .stepper-input-wrap {
10947 border-top-color: #f44336;
10948 border-bottom-color: #f44336;
10949}
10950.md .color-theme-red .stepper-value,
10951.md .color-theme-red .stepper-input-wrap input {
10952 color: #f44336;
10953}
10954.md .color-theme-red .stepper-fill .stepper-button,
10955.md .color-theme-red .stepper-fill-md .stepper-button,
10956.md .color-theme-red .stepper-fill .stepper-button-minus,
10957.md .color-theme-red .stepper-fill-md .stepper-button-minus,
10958.md .color-theme-red .stepper-fill .stepper-button-plus,
10959.md .color-theme-red .stepper-fill-md .stepper-button-plus {
10960 background-color: #f44336;
10961 color: #fff;
10962}
10963.md .color-theme-red .stepper-fill .stepper-button.active-state,
10964.md .color-theme-red .stepper-fill-md .stepper-button.active-state,
10965.md .color-theme-red .stepper-fill .stepper-button-minus.active-state,
10966.md .color-theme-red .stepper-fill-md .stepper-button-minus.active-state,
10967.md .color-theme-red .stepper-fill .stepper-button-plus.active-state,
10968.md .color-theme-red .stepper-fill-md .stepper-button-plus.active-state {
10969 background: #f21f0f;
10970}
10971.md .color-theme-red .stepper-fill .stepper-button:after,
10972.md .color-theme-red .stepper-fill-md .stepper-button:after,
10973.md .color-theme-red .stepper-fill .stepper-button-minus:after,
10974.md .color-theme-red .stepper-fill-md .stepper-button-minus:after,
10975.md .color-theme-red .stepper-fill .stepper-button-plus:after,
10976.md .color-theme-red .stepper-fill-md .stepper-button-plus:after,
10977.md .color-theme-red .stepper-fill .stepper-button:before,
10978.md .color-theme-red .stepper-fill-md .stepper-button:before,
10979.md .color-theme-red .stepper-fill .stepper-button-minus:before,
10980.md .color-theme-red .stepper-fill-md .stepper-button-minus:before,
10981.md .color-theme-red .stepper-fill .stepper-button-plus:before,
10982.md .color-theme-red .stepper-fill-md .stepper-button-plus:before {
10983 background: #fff;
10984}
10985.md .color-theme-green .stepper-button,
10986.md .color-theme-green .stepper-button-minus,
10987.md .color-theme-green .stepper-button-plus {
10988 border-color: #4caf50;
10989 color: #4caf50;
10990}
10991.md .color-theme-green .stepper-button-plus:after,
10992.md .color-theme-green .stepper-button-minus:after,
10993.md .color-theme-green .stepper-button-plus:before,
10994.md .color-theme-green .stepper-button-minus:before {
10995 background: #4caf50;
10996}
10997.md .color-theme-green .stepper-value,
10998.md .color-theme-green .stepper-input-wrap {
10999 border-top-color: #4caf50;
11000 border-bottom-color: #4caf50;
11001}
11002.md .color-theme-green .stepper-value,
11003.md .color-theme-green .stepper-input-wrap input {
11004 color: #4caf50;
11005}
11006.md .color-theme-green .stepper-fill .stepper-button,
11007.md .color-theme-green .stepper-fill-md .stepper-button,
11008.md .color-theme-green .stepper-fill .stepper-button-minus,
11009.md .color-theme-green .stepper-fill-md .stepper-button-minus,
11010.md .color-theme-green .stepper-fill .stepper-button-plus,
11011.md .color-theme-green .stepper-fill-md .stepper-button-plus {
11012 background-color: #4caf50;
11013 color: #fff;
11014}
11015.md .color-theme-green .stepper-fill .stepper-button.active-state,
11016.md .color-theme-green .stepper-fill-md .stepper-button.active-state,
11017.md .color-theme-green .stepper-fill .stepper-button-minus.active-state,
11018.md .color-theme-green .stepper-fill-md .stepper-button-minus.active-state,
11019.md .color-theme-green .stepper-fill .stepper-button-plus.active-state,
11020.md .color-theme-green .stepper-fill-md .stepper-button-plus.active-state {
11021 background: #409343;
11022}
11023.md .color-theme-green .stepper-fill .stepper-button:after,
11024.md .color-theme-green .stepper-fill-md .stepper-button:after,
11025.md .color-theme-green .stepper-fill .stepper-button-minus:after,
11026.md .color-theme-green .stepper-fill-md .stepper-button-minus:after,
11027.md .color-theme-green .stepper-fill .stepper-button-plus:after,
11028.md .color-theme-green .stepper-fill-md .stepper-button-plus:after,
11029.md .color-theme-green .stepper-fill .stepper-button:before,
11030.md .color-theme-green .stepper-fill-md .stepper-button:before,
11031.md .color-theme-green .stepper-fill .stepper-button-minus:before,
11032.md .color-theme-green .stepper-fill-md .stepper-button-minus:before,
11033.md .color-theme-green .stepper-fill .stepper-button-plus:before,
11034.md .color-theme-green .stepper-fill-md .stepper-button-plus:before {
11035 background: #fff;
11036}
11037.md .color-theme-blue .stepper-button,
11038.md .color-theme-blue .stepper-button-minus,
11039.md .color-theme-blue .stepper-button-plus {
11040 border-color: #2196f3;
11041 color: #2196f3;
11042}
11043.md .color-theme-blue .stepper-button-plus:after,
11044.md .color-theme-blue .stepper-button-minus:after,
11045.md .color-theme-blue .stepper-button-plus:before,
11046.md .color-theme-blue .stepper-button-minus:before {
11047 background: #2196f3;
11048}
11049.md .color-theme-blue .stepper-value,
11050.md .color-theme-blue .stepper-input-wrap {
11051 border-top-color: #2196f3;
11052 border-bottom-color: #2196f3;
11053}
11054.md .color-theme-blue .stepper-value,
11055.md .color-theme-blue .stepper-input-wrap input {
11056 color: #2196f3;
11057}
11058.md .color-theme-blue .stepper-fill .stepper-button,
11059.md .color-theme-blue .stepper-fill-md .stepper-button,
11060.md .color-theme-blue .stepper-fill .stepper-button-minus,
11061.md .color-theme-blue .stepper-fill-md .stepper-button-minus,
11062.md .color-theme-blue .stepper-fill .stepper-button-plus,
11063.md .color-theme-blue .stepper-fill-md .stepper-button-plus {
11064 background-color: #2196f3;
11065 color: #fff;
11066}
11067.md .color-theme-blue .stepper-fill .stepper-button.active-state,
11068.md .color-theme-blue .stepper-fill-md .stepper-button.active-state,
11069.md .color-theme-blue .stepper-fill .stepper-button-minus.active-state,
11070.md .color-theme-blue .stepper-fill-md .stepper-button-minus.active-state,
11071.md .color-theme-blue .stepper-fill .stepper-button-plus.active-state,
11072.md .color-theme-blue .stepper-fill-md .stepper-button-plus.active-state {
11073 background: #0c82df;
11074}
11075.md .color-theme-blue .stepper-fill .stepper-button:after,
11076.md .color-theme-blue .stepper-fill-md .stepper-button:after,
11077.md .color-theme-blue .stepper-fill .stepper-button-minus:after,
11078.md .color-theme-blue .stepper-fill-md .stepper-button-minus:after,
11079.md .color-theme-blue .stepper-fill .stepper-button-plus:after,
11080.md .color-theme-blue .stepper-fill-md .stepper-button-plus:after,
11081.md .color-theme-blue .stepper-fill .stepper-button:before,
11082.md .color-theme-blue .stepper-fill-md .stepper-button:before,
11083.md .color-theme-blue .stepper-fill .stepper-button-minus:before,
11084.md .color-theme-blue .stepper-fill-md .stepper-button-minus:before,
11085.md .color-theme-blue .stepper-fill .stepper-button-plus:before,
11086.md .color-theme-blue .stepper-fill-md .stepper-button-plus:before {
11087 background: #fff;
11088}
11089.md .color-theme-pink .stepper-button,
11090.md .color-theme-pink .stepper-button-minus,
11091.md .color-theme-pink .stepper-button-plus {
11092 border-color: #e91e63;
11093 color: #e91e63;
11094}
11095.md .color-theme-pink .stepper-button-plus:after,
11096.md .color-theme-pink .stepper-button-minus:after,
11097.md .color-theme-pink .stepper-button-plus:before,
11098.md .color-theme-pink .stepper-button-minus:before {
11099 background: #e91e63;
11100}
11101.md .color-theme-pink .stepper-value,
11102.md .color-theme-pink .stepper-input-wrap {
11103 border-top-color: #e91e63;
11104 border-bottom-color: #e91e63;
11105}
11106.md .color-theme-pink .stepper-value,
11107.md .color-theme-pink .stepper-input-wrap input {
11108 color: #e91e63;
11109}
11110.md .color-theme-pink .stepper-fill .stepper-button,
11111.md .color-theme-pink .stepper-fill-md .stepper-button,
11112.md .color-theme-pink .stepper-fill .stepper-button-minus,
11113.md .color-theme-pink .stepper-fill-md .stepper-button-minus,
11114.md .color-theme-pink .stepper-fill .stepper-button-plus,
11115.md .color-theme-pink .stepper-fill-md .stepper-button-plus {
11116 background-color: #e91e63;
11117 color: #fff;
11118}
11119.md .color-theme-pink .stepper-fill .stepper-button.active-state,
11120.md .color-theme-pink .stepper-fill-md .stepper-button.active-state,
11121.md .color-theme-pink .stepper-fill .stepper-button-minus.active-state,
11122.md .color-theme-pink .stepper-fill-md .stepper-button-minus.active-state,
11123.md .color-theme-pink .stepper-fill .stepper-button-plus.active-state,
11124.md .color-theme-pink .stepper-fill-md .stepper-button-plus.active-state {
11125 background: #ca1452;
11126}
11127.md .color-theme-pink .stepper-fill .stepper-button:after,
11128.md .color-theme-pink .stepper-fill-md .stepper-button:after,
11129.md .color-theme-pink .stepper-fill .stepper-button-minus:after,
11130.md .color-theme-pink .stepper-fill-md .stepper-button-minus:after,
11131.md .color-theme-pink .stepper-fill .stepper-button-plus:after,
11132.md .color-theme-pink .stepper-fill-md .stepper-button-plus:after,
11133.md .color-theme-pink .stepper-fill .stepper-button:before,
11134.md .color-theme-pink .stepper-fill-md .stepper-button:before,
11135.md .color-theme-pink .stepper-fill .stepper-button-minus:before,
11136.md .color-theme-pink .stepper-fill-md .stepper-button-minus:before,
11137.md .color-theme-pink .stepper-fill .stepper-button-plus:before,
11138.md .color-theme-pink .stepper-fill-md .stepper-button-plus:before {
11139 background: #fff;
11140}
11141.md .color-theme-yellow .stepper-button,
11142.md .color-theme-yellow .stepper-button-minus,
11143.md .color-theme-yellow .stepper-button-plus {
11144 border-color: #ffeb3b;
11145 color: #ffeb3b;
11146}
11147.md .color-theme-yellow .stepper-button-plus:after,
11148.md .color-theme-yellow .stepper-button-minus:after,
11149.md .color-theme-yellow .stepper-button-plus:before,
11150.md .color-theme-yellow .stepper-button-minus:before {
11151 background: #ffeb3b;
11152}
11153.md .color-theme-yellow .stepper-value,
11154.md .color-theme-yellow .stepper-input-wrap {
11155 border-top-color: #ffeb3b;
11156 border-bottom-color: #ffeb3b;
11157}
11158.md .color-theme-yellow .stepper-value,
11159.md .color-theme-yellow .stepper-input-wrap input {
11160 color: #ffeb3b;
11161}
11162.md .color-theme-yellow .stepper-fill .stepper-button,
11163.md .color-theme-yellow .stepper-fill-md .stepper-button,
11164.md .color-theme-yellow .stepper-fill .stepper-button-minus,
11165.md .color-theme-yellow .stepper-fill-md .stepper-button-minus,
11166.md .color-theme-yellow .stepper-fill .stepper-button-plus,
11167.md .color-theme-yellow .stepper-fill-md .stepper-button-plus {
11168 background-color: #ffeb3b;
11169 color: #fff;
11170}
11171.md .color-theme-yellow .stepper-fill .stepper-button.active-state,
11172.md .color-theme-yellow .stepper-fill-md .stepper-button.active-state,
11173.md .color-theme-yellow .stepper-fill .stepper-button-minus.active-state,
11174.md .color-theme-yellow .stepper-fill-md .stepper-button-minus.active-state,
11175.md .color-theme-yellow .stepper-fill .stepper-button-plus.active-state,
11176.md .color-theme-yellow .stepper-fill-md .stepper-button-plus.active-state {
11177 background: #ffe712;
11178}
11179.md .color-theme-yellow .stepper-fill .stepper-button:after,
11180.md .color-theme-yellow .stepper-fill-md .stepper-button:after,
11181.md .color-theme-yellow .stepper-fill .stepper-button-minus:after,
11182.md .color-theme-yellow .stepper-fill-md .stepper-button-minus:after,
11183.md .color-theme-yellow .stepper-fill .stepper-button-plus:after,
11184.md .color-theme-yellow .stepper-fill-md .stepper-button-plus:after,
11185.md .color-theme-yellow .stepper-fill .stepper-button:before,
11186.md .color-theme-yellow .stepper-fill-md .stepper-button:before,
11187.md .color-theme-yellow .stepper-fill .stepper-button-minus:before,
11188.md .color-theme-yellow .stepper-fill-md .stepper-button-minus:before,
11189.md .color-theme-yellow .stepper-fill .stepper-button-plus:before,
11190.md .color-theme-yellow .stepper-fill-md .stepper-button-plus:before {
11191 background: #fff;
11192}
11193.md .color-theme-orange .stepper-button,
11194.md .color-theme-orange .stepper-button-minus,
11195.md .color-theme-orange .stepper-button-plus {
11196 border-color: #ff9800;
11197 color: #ff9800;
11198}
11199.md .color-theme-orange .stepper-button-plus:after,
11200.md .color-theme-orange .stepper-button-minus:after,
11201.md .color-theme-orange .stepper-button-plus:before,
11202.md .color-theme-orange .stepper-button-minus:before {
11203 background: #ff9800;
11204}
11205.md .color-theme-orange .stepper-value,
11206.md .color-theme-orange .stepper-input-wrap {
11207 border-top-color: #ff9800;
11208 border-bottom-color: #ff9800;
11209}
11210.md .color-theme-orange .stepper-value,
11211.md .color-theme-orange .stepper-input-wrap input {
11212 color: #ff9800;
11213}
11214.md .color-theme-orange .stepper-fill .stepper-button,
11215.md .color-theme-orange .stepper-fill-md .stepper-button,
11216.md .color-theme-orange .stepper-fill .stepper-button-minus,
11217.md .color-theme-orange .stepper-fill-md .stepper-button-minus,
11218.md .color-theme-orange .stepper-fill .stepper-button-plus,
11219.md .color-theme-orange .stepper-fill-md .stepper-button-plus {
11220 background-color: #ff9800;
11221 color: #fff;
11222}
11223.md .color-theme-orange .stepper-fill .stepper-button.active-state,
11224.md .color-theme-orange .stepper-fill-md .stepper-button.active-state,
11225.md .color-theme-orange .stepper-fill .stepper-button-minus.active-state,
11226.md .color-theme-orange .stepper-fill-md .stepper-button-minus.active-state,
11227.md .color-theme-orange .stepper-fill .stepper-button-plus.active-state,
11228.md .color-theme-orange .stepper-fill-md .stepper-button-plus.active-state {
11229 background: #d68000;
11230}
11231.md .color-theme-orange .stepper-fill .stepper-button:after,
11232.md .color-theme-orange .stepper-fill-md .stepper-button:after,
11233.md .color-theme-orange .stepper-fill .stepper-button-minus:after,
11234.md .color-theme-orange .stepper-fill-md .stepper-button-minus:after,
11235.md .color-theme-orange .stepper-fill .stepper-button-plus:after,
11236.md .color-theme-orange .stepper-fill-md .stepper-button-plus:after,
11237.md .color-theme-orange .stepper-fill .stepper-button:before,
11238.md .color-theme-orange .stepper-fill-md .stepper-button:before,
11239.md .color-theme-orange .stepper-fill .stepper-button-minus:before,
11240.md .color-theme-orange .stepper-fill-md .stepper-button-minus:before,
11241.md .color-theme-orange .stepper-fill .stepper-button-plus:before,
11242.md .color-theme-orange .stepper-fill-md .stepper-button-plus:before {
11243 background: #fff;
11244}
11245.md .color-theme-gray .stepper-button,
11246.md .color-theme-gray .stepper-button-minus,
11247.md .color-theme-gray .stepper-button-plus {
11248 border-color: #9e9e9e;
11249 color: #9e9e9e;
11250}
11251.md .color-theme-gray .stepper-button-plus:after,
11252.md .color-theme-gray .stepper-button-minus:after,
11253.md .color-theme-gray .stepper-button-plus:before,
11254.md .color-theme-gray .stepper-button-minus:before {
11255 background: #9e9e9e;
11256}
11257.md .color-theme-gray .stepper-value,
11258.md .color-theme-gray .stepper-input-wrap {
11259 border-top-color: #9e9e9e;
11260 border-bottom-color: #9e9e9e;
11261}
11262.md .color-theme-gray .stepper-value,
11263.md .color-theme-gray .stepper-input-wrap input {
11264 color: #9e9e9e;
11265}
11266.md .color-theme-gray .stepper-fill .stepper-button,
11267.md .color-theme-gray .stepper-fill-md .stepper-button,
11268.md .color-theme-gray .stepper-fill .stepper-button-minus,
11269.md .color-theme-gray .stepper-fill-md .stepper-button-minus,
11270.md .color-theme-gray .stepper-fill .stepper-button-plus,
11271.md .color-theme-gray .stepper-fill-md .stepper-button-plus {
11272 background-color: #9e9e9e;
11273 color: #fff;
11274}
11275.md .color-theme-gray .stepper-fill .stepper-button.active-state,
11276.md .color-theme-gray .stepper-fill-md .stepper-button.active-state,
11277.md .color-theme-gray .stepper-fill .stepper-button-minus.active-state,
11278.md .color-theme-gray .stepper-fill-md .stepper-button-minus.active-state,
11279.md .color-theme-gray .stepper-fill .stepper-button-plus.active-state,
11280.md .color-theme-gray .stepper-fill-md .stepper-button-plus.active-state {
11281 background: #8a8a8a;
11282}
11283.md .color-theme-gray .stepper-fill .stepper-button:after,
11284.md .color-theme-gray .stepper-fill-md .stepper-button:after,
11285.md .color-theme-gray .stepper-fill .stepper-button-minus:after,
11286.md .color-theme-gray .stepper-fill-md .stepper-button-minus:after,
11287.md .color-theme-gray .stepper-fill .stepper-button-plus:after,
11288.md .color-theme-gray .stepper-fill-md .stepper-button-plus:after,
11289.md .color-theme-gray .stepper-fill .stepper-button:before,
11290.md .color-theme-gray .stepper-fill-md .stepper-button:before,
11291.md .color-theme-gray .stepper-fill .stepper-button-minus:before,
11292.md .color-theme-gray .stepper-fill-md .stepper-button-minus:before,
11293.md .color-theme-gray .stepper-fill .stepper-button-plus:before,
11294.md .color-theme-gray .stepper-fill-md .stepper-button-plus:before {
11295 background: #fff;
11296}
11297.md .color-theme-white .stepper-button,
11298.md .color-theme-white .stepper-button-minus,
11299.md .color-theme-white .stepper-button-plus {
11300 border-color: #ffffff;
11301 color: #ffffff;
11302}
11303.md .color-theme-white .stepper-button-plus:after,
11304.md .color-theme-white .stepper-button-minus:after,
11305.md .color-theme-white .stepper-button-plus:before,
11306.md .color-theme-white .stepper-button-minus:before {
11307 background: #ffffff;
11308}
11309.md .color-theme-white .stepper-value,
11310.md .color-theme-white .stepper-input-wrap {
11311 border-top-color: #ffffff;
11312 border-bottom-color: #ffffff;
11313}
11314.md .color-theme-white .stepper-value,
11315.md .color-theme-white .stepper-input-wrap input {
11316 color: #ffffff;
11317}
11318.md .color-theme-white .stepper-fill .stepper-button,
11319.md .color-theme-white .stepper-fill-md .stepper-button,
11320.md .color-theme-white .stepper-fill .stepper-button-minus,
11321.md .color-theme-white .stepper-fill-md .stepper-button-minus,
11322.md .color-theme-white .stepper-fill .stepper-button-plus,
11323.md .color-theme-white .stepper-fill-md .stepper-button-plus {
11324 background-color: #ffffff;
11325 color: #fff;
11326}
11327.md .color-theme-white .stepper-fill .stepper-button.active-state,
11328.md .color-theme-white .stepper-fill-md .stepper-button.active-state,
11329.md .color-theme-white .stepper-fill .stepper-button-minus.active-state,
11330.md .color-theme-white .stepper-fill-md .stepper-button-minus.active-state,
11331.md .color-theme-white .stepper-fill .stepper-button-plus.active-state,
11332.md .color-theme-white .stepper-fill-md .stepper-button-plus.active-state {
11333 background: #ebebeb;
11334}
11335.md .color-theme-white .stepper-fill .stepper-button:after,
11336.md .color-theme-white .stepper-fill-md .stepper-button:after,
11337.md .color-theme-white .stepper-fill .stepper-button-minus:after,
11338.md .color-theme-white .stepper-fill-md .stepper-button-minus:after,
11339.md .color-theme-white .stepper-fill .stepper-button-plus:after,
11340.md .color-theme-white .stepper-fill-md .stepper-button-plus:after,
11341.md .color-theme-white .stepper-fill .stepper-button:before,
11342.md .color-theme-white .stepper-fill-md .stepper-button:before,
11343.md .color-theme-white .stepper-fill .stepper-button-minus:before,
11344.md .color-theme-white .stepper-fill-md .stepper-button-minus:before,
11345.md .color-theme-white .stepper-fill .stepper-button-plus:before,
11346.md .color-theme-white .stepper-fill-md .stepper-button-plus:before {
11347 background: #fff;
11348}
11349.md .color-theme-black .stepper-button,
11350.md .color-theme-black .stepper-button-minus,
11351.md .color-theme-black .stepper-button-plus {
11352 border-color: #000000;
11353 color: #000000;
11354}
11355.md .color-theme-black .stepper-button-plus:after,
11356.md .color-theme-black .stepper-button-minus:after,
11357.md .color-theme-black .stepper-button-plus:before,
11358.md .color-theme-black .stepper-button-minus:before {
11359 background: #000000;
11360}
11361.md .color-theme-black .stepper-value,
11362.md .color-theme-black .stepper-input-wrap {
11363 border-top-color: #000000;
11364 border-bottom-color: #000000;
11365}
11366.md .color-theme-black .stepper-value,
11367.md .color-theme-black .stepper-input-wrap input {
11368 color: #000000;
11369}
11370.md .color-theme-black .stepper-fill .stepper-button,
11371.md .color-theme-black .stepper-fill-md .stepper-button,
11372.md .color-theme-black .stepper-fill .stepper-button-minus,
11373.md .color-theme-black .stepper-fill-md .stepper-button-minus,
11374.md .color-theme-black .stepper-fill .stepper-button-plus,
11375.md .color-theme-black .stepper-fill-md .stepper-button-plus {
11376 background-color: #000000;
11377 color: #fff;
11378}
11379.md .color-theme-black .stepper-fill .stepper-button.active-state,
11380.md .color-theme-black .stepper-fill-md .stepper-button.active-state,
11381.md .color-theme-black .stepper-fill .stepper-button-minus.active-state,
11382.md .color-theme-black .stepper-fill-md .stepper-button-minus.active-state,
11383.md .color-theme-black .stepper-fill .stepper-button-plus.active-state,
11384.md .color-theme-black .stepper-fill-md .stepper-button-plus.active-state {
11385 background: #000000;
11386}
11387.md .color-theme-black .stepper-fill .stepper-button:after,
11388.md .color-theme-black .stepper-fill-md .stepper-button:after,
11389.md .color-theme-black .stepper-fill .stepper-button-minus:after,
11390.md .color-theme-black .stepper-fill-md .stepper-button-minus:after,
11391.md .color-theme-black .stepper-fill .stepper-button-plus:after,
11392.md .color-theme-black .stepper-fill-md .stepper-button-plus:after,
11393.md .color-theme-black .stepper-fill .stepper-button:before,
11394.md .color-theme-black .stepper-fill-md .stepper-button:before,
11395.md .color-theme-black .stepper-fill .stepper-button-minus:before,
11396.md .color-theme-black .stepper-fill-md .stepper-button-minus:before,
11397.md .color-theme-black .stepper-fill .stepper-button-plus:before,
11398.md .color-theme-black .stepper-fill-md .stepper-button-plus:before {
11399 background: #fff;
11400}
11401.md .stepper.color-red .stepper-button,
11402.md .stepper.color-red .stepper-button-minus,
11403.md .stepper.color-red .stepper-button-plus {
11404 border-color: #f44336;
11405 color: #f44336;
11406}
11407.md .stepper.color-red .stepper-button-plus:after,
11408.md .stepper.color-red .stepper-button-minus:after,
11409.md .stepper.color-red .stepper-button-plus:before,
11410.md .stepper.color-red .stepper-button-minus:before {
11411 background: #f44336;
11412}
11413.md .stepper.color-red .stepper-value,
11414.md .stepper.color-red .stepper-input-wrap {
11415 border-top-color: #f44336;
11416 border-bottom-color: #f44336;
11417}
11418.md .stepper.color-red .stepper-value,
11419.md .stepper.color-red .stepper-input-wrap input {
11420 color: #f44336;
11421}
11422.md .stepper-fill.color-red .stepper-button,
11423.md .stepper-fill-md.color-red .stepper-button,
11424.md .stepper-fill.color-red .stepper-button-minus,
11425.md .stepper-fill-md.color-red .stepper-button-minus,
11426.md .stepper-fill.color-red .stepper-button-plus,
11427.md .stepper-fill-md.color-red .stepper-button-plus {
11428 background-color: #f44336;
11429 color: #fff;
11430}
11431.md .stepper-fill.color-red .stepper-button.active-state,
11432.md .stepper-fill-md.color-red .stepper-button.active-state,
11433.md .stepper-fill.color-red .stepper-button-minus.active-state,
11434.md .stepper-fill-md.color-red .stepper-button-minus.active-state,
11435.md .stepper-fill.color-red .stepper-button-plus.active-state,
11436.md .stepper-fill-md.color-red .stepper-button-plus.active-state {
11437 background: #f21f0f;
11438}
11439.md .stepper-fill.color-red .stepper-button:after,
11440.md .stepper-fill-md.color-red .stepper-button:after,
11441.md .stepper-fill.color-red .stepper-button-minus:after,
11442.md .stepper-fill-md.color-red .stepper-button-minus:after,
11443.md .stepper-fill.color-red .stepper-button-plus:after,
11444.md .stepper-fill-md.color-red .stepper-button-plus:after,
11445.md .stepper-fill.color-red .stepper-button:before,
11446.md .stepper-fill-md.color-red .stepper-button:before,
11447.md .stepper-fill.color-red .stepper-button-minus:before,
11448.md .stepper-fill-md.color-red .stepper-button-minus:before,
11449.md .stepper-fill.color-red .stepper-button-plus:before,
11450.md .stepper-fill-md.color-red .stepper-button-plus:before {
11451 background: #fff;
11452}
11453.md .stepper.color-green .stepper-button,
11454.md .stepper.color-green .stepper-button-minus,
11455.md .stepper.color-green .stepper-button-plus {
11456 border-color: #4caf50;
11457 color: #4caf50;
11458}
11459.md .stepper.color-green .stepper-button-plus:after,
11460.md .stepper.color-green .stepper-button-minus:after,
11461.md .stepper.color-green .stepper-button-plus:before,
11462.md .stepper.color-green .stepper-button-minus:before {
11463 background: #4caf50;
11464}
11465.md .stepper.color-green .stepper-value,
11466.md .stepper.color-green .stepper-input-wrap {
11467 border-top-color: #4caf50;
11468 border-bottom-color: #4caf50;
11469}
11470.md .stepper.color-green .stepper-value,
11471.md .stepper.color-green .stepper-input-wrap input {
11472 color: #4caf50;
11473}
11474.md .stepper-fill.color-green .stepper-button,
11475.md .stepper-fill-md.color-green .stepper-button,
11476.md .stepper-fill.color-green .stepper-button-minus,
11477.md .stepper-fill-md.color-green .stepper-button-minus,
11478.md .stepper-fill.color-green .stepper-button-plus,
11479.md .stepper-fill-md.color-green .stepper-button-plus {
11480 background-color: #4caf50;
11481 color: #fff;
11482}
11483.md .stepper-fill.color-green .stepper-button.active-state,
11484.md .stepper-fill-md.color-green .stepper-button.active-state,
11485.md .stepper-fill.color-green .stepper-button-minus.active-state,
11486.md .stepper-fill-md.color-green .stepper-button-minus.active-state,
11487.md .stepper-fill.color-green .stepper-button-plus.active-state,
11488.md .stepper-fill-md.color-green .stepper-button-plus.active-state {
11489 background: #409343;
11490}
11491.md .stepper-fill.color-green .stepper-button:after,
11492.md .stepper-fill-md.color-green .stepper-button:after,
11493.md .stepper-fill.color-green .stepper-button-minus:after,
11494.md .stepper-fill-md.color-green .stepper-button-minus:after,
11495.md .stepper-fill.color-green .stepper-button-plus:after,
11496.md .stepper-fill-md.color-green .stepper-button-plus:after,
11497.md .stepper-fill.color-green .stepper-button:before,
11498.md .stepper-fill-md.color-green .stepper-button:before,
11499.md .stepper-fill.color-green .stepper-button-minus:before,
11500.md .stepper-fill-md.color-green .stepper-button-minus:before,
11501.md .stepper-fill.color-green .stepper-button-plus:before,
11502.md .stepper-fill-md.color-green .stepper-button-plus:before {
11503 background: #fff;
11504}
11505.md .stepper.color-blue .stepper-button,
11506.md .stepper.color-blue .stepper-button-minus,
11507.md .stepper.color-blue .stepper-button-plus {
11508 border-color: #2196f3;
11509 color: #2196f3;
11510}
11511.md .stepper.color-blue .stepper-button-plus:after,
11512.md .stepper.color-blue .stepper-button-minus:after,
11513.md .stepper.color-blue .stepper-button-plus:before,
11514.md .stepper.color-blue .stepper-button-minus:before {
11515 background: #2196f3;
11516}
11517.md .stepper.color-blue .stepper-value,
11518.md .stepper.color-blue .stepper-input-wrap {
11519 border-top-color: #2196f3;
11520 border-bottom-color: #2196f3;
11521}
11522.md .stepper.color-blue .stepper-value,
11523.md .stepper.color-blue .stepper-input-wrap input {
11524 color: #2196f3;
11525}
11526.md .stepper-fill.color-blue .stepper-button,
11527.md .stepper-fill-md.color-blue .stepper-button,
11528.md .stepper-fill.color-blue .stepper-button-minus,
11529.md .stepper-fill-md.color-blue .stepper-button-minus,
11530.md .stepper-fill.color-blue .stepper-button-plus,
11531.md .stepper-fill-md.color-blue .stepper-button-plus {
11532 background-color: #2196f3;
11533 color: #fff;
11534}
11535.md .stepper-fill.color-blue .stepper-button.active-state,
11536.md .stepper-fill-md.color-blue .stepper-button.active-state,
11537.md .stepper-fill.color-blue .stepper-button-minus.active-state,
11538.md .stepper-fill-md.color-blue .stepper-button-minus.active-state,
11539.md .stepper-fill.color-blue .stepper-button-plus.active-state,
11540.md .stepper-fill-md.color-blue .stepper-button-plus.active-state {
11541 background: #0c82df;
11542}
11543.md .stepper-fill.color-blue .stepper-button:after,
11544.md .stepper-fill-md.color-blue .stepper-button:after,
11545.md .stepper-fill.color-blue .stepper-button-minus:after,
11546.md .stepper-fill-md.color-blue .stepper-button-minus:after,
11547.md .stepper-fill.color-blue .stepper-button-plus:after,
11548.md .stepper-fill-md.color-blue .stepper-button-plus:after,
11549.md .stepper-fill.color-blue .stepper-button:before,
11550.md .stepper-fill-md.color-blue .stepper-button:before,
11551.md .stepper-fill.color-blue .stepper-button-minus:before,
11552.md .stepper-fill-md.color-blue .stepper-button-minus:before,
11553.md .stepper-fill.color-blue .stepper-button-plus:before,
11554.md .stepper-fill-md.color-blue .stepper-button-plus:before {
11555 background: #fff;
11556}
11557.md .stepper.color-pink .stepper-button,
11558.md .stepper.color-pink .stepper-button-minus,
11559.md .stepper.color-pink .stepper-button-plus {
11560 border-color: #e91e63;
11561 color: #e91e63;
11562}
11563.md .stepper.color-pink .stepper-button-plus:after,
11564.md .stepper.color-pink .stepper-button-minus:after,
11565.md .stepper.color-pink .stepper-button-plus:before,
11566.md .stepper.color-pink .stepper-button-minus:before {
11567 background: #e91e63;
11568}
11569.md .stepper.color-pink .stepper-value,
11570.md .stepper.color-pink .stepper-input-wrap {
11571 border-top-color: #e91e63;
11572 border-bottom-color: #e91e63;
11573}
11574.md .stepper.color-pink .stepper-value,
11575.md .stepper.color-pink .stepper-input-wrap input {
11576 color: #e91e63;
11577}
11578.md .stepper-fill.color-pink .stepper-button,
11579.md .stepper-fill-md.color-pink .stepper-button,
11580.md .stepper-fill.color-pink .stepper-button-minus,
11581.md .stepper-fill-md.color-pink .stepper-button-minus,
11582.md .stepper-fill.color-pink .stepper-button-plus,
11583.md .stepper-fill-md.color-pink .stepper-button-plus {
11584 background-color: #e91e63;
11585 color: #fff;
11586}
11587.md .stepper-fill.color-pink .stepper-button.active-state,
11588.md .stepper-fill-md.color-pink .stepper-button.active-state,
11589.md .stepper-fill.color-pink .stepper-button-minus.active-state,
11590.md .stepper-fill-md.color-pink .stepper-button-minus.active-state,
11591.md .stepper-fill.color-pink .stepper-button-plus.active-state,
11592.md .stepper-fill-md.color-pink .stepper-button-plus.active-state {
11593 background: #ca1452;
11594}
11595.md .stepper-fill.color-pink .stepper-button:after,
11596.md .stepper-fill-md.color-pink .stepper-button:after,
11597.md .stepper-fill.color-pink .stepper-button-minus:after,
11598.md .stepper-fill-md.color-pink .stepper-button-minus:after,
11599.md .stepper-fill.color-pink .stepper-button-plus:after,
11600.md .stepper-fill-md.color-pink .stepper-button-plus:after,
11601.md .stepper-fill.color-pink .stepper-button:before,
11602.md .stepper-fill-md.color-pink .stepper-button:before,
11603.md .stepper-fill.color-pink .stepper-button-minus:before,
11604.md .stepper-fill-md.color-pink .stepper-button-minus:before,
11605.md .stepper-fill.color-pink .stepper-button-plus:before,
11606.md .stepper-fill-md.color-pink .stepper-button-plus:before {
11607 background: #fff;
11608}
11609.md .stepper.color-yellow .stepper-button,
11610.md .stepper.color-yellow .stepper-button-minus,
11611.md .stepper.color-yellow .stepper-button-plus {
11612 border-color: #ffeb3b;
11613 color: #ffeb3b;
11614}
11615.md .stepper.color-yellow .stepper-button-plus:after,
11616.md .stepper.color-yellow .stepper-button-minus:after,
11617.md .stepper.color-yellow .stepper-button-plus:before,
11618.md .stepper.color-yellow .stepper-button-minus:before {
11619 background: #ffeb3b;
11620}
11621.md .stepper.color-yellow .stepper-value,
11622.md .stepper.color-yellow .stepper-input-wrap {
11623 border-top-color: #ffeb3b;
11624 border-bottom-color: #ffeb3b;
11625}
11626.md .stepper.color-yellow .stepper-value,
11627.md .stepper.color-yellow .stepper-input-wrap input {
11628 color: #ffeb3b;
11629}
11630.md .stepper-fill.color-yellow .stepper-button,
11631.md .stepper-fill-md.color-yellow .stepper-button,
11632.md .stepper-fill.color-yellow .stepper-button-minus,
11633.md .stepper-fill-md.color-yellow .stepper-button-minus,
11634.md .stepper-fill.color-yellow .stepper-button-plus,
11635.md .stepper-fill-md.color-yellow .stepper-button-plus {
11636 background-color: #ffeb3b;
11637 color: #fff;
11638}
11639.md .stepper-fill.color-yellow .stepper-button.active-state,
11640.md .stepper-fill-md.color-yellow .stepper-button.active-state,
11641.md .stepper-fill.color-yellow .stepper-button-minus.active-state,
11642.md .stepper-fill-md.color-yellow .stepper-button-minus.active-state,
11643.md .stepper-fill.color-yellow .stepper-button-plus.active-state,
11644.md .stepper-fill-md.color-yellow .stepper-button-plus.active-state {
11645 background: #ffe712;
11646}
11647.md .stepper-fill.color-yellow .stepper-button:after,
11648.md .stepper-fill-md.color-yellow .stepper-button:after,
11649.md .stepper-fill.color-yellow .stepper-button-minus:after,
11650.md .stepper-fill-md.color-yellow .stepper-button-minus:after,
11651.md .stepper-fill.color-yellow .stepper-button-plus:after,
11652.md .stepper-fill-md.color-yellow .stepper-button-plus:after,
11653.md .stepper-fill.color-yellow .stepper-button:before,
11654.md .stepper-fill-md.color-yellow .stepper-button:before,
11655.md .stepper-fill.color-yellow .stepper-button-minus:before,
11656.md .stepper-fill-md.color-yellow .stepper-button-minus:before,
11657.md .stepper-fill.color-yellow .stepper-button-plus:before,
11658.md .stepper-fill-md.color-yellow .stepper-button-plus:before {
11659 background: #fff;
11660}
11661.md .stepper.color-orange .stepper-button,
11662.md .stepper.color-orange .stepper-button-minus,
11663.md .stepper.color-orange .stepper-button-plus {
11664 border-color: #ff9800;
11665 color: #ff9800;
11666}
11667.md .stepper.color-orange .stepper-button-plus:after,
11668.md .stepper.color-orange .stepper-button-minus:after,
11669.md .stepper.color-orange .stepper-button-plus:before,
11670.md .stepper.color-orange .stepper-button-minus:before {
11671 background: #ff9800;
11672}
11673.md .stepper.color-orange .stepper-value,
11674.md .stepper.color-orange .stepper-input-wrap {
11675 border-top-color: #ff9800;
11676 border-bottom-color: #ff9800;
11677}
11678.md .stepper.color-orange .stepper-value,
11679.md .stepper.color-orange .stepper-input-wrap input {
11680 color: #ff9800;
11681}
11682.md .stepper-fill.color-orange .stepper-button,
11683.md .stepper-fill-md.color-orange .stepper-button,
11684.md .stepper-fill.color-orange .stepper-button-minus,
11685.md .stepper-fill-md.color-orange .stepper-button-minus,
11686.md .stepper-fill.color-orange .stepper-button-plus,
11687.md .stepper-fill-md.color-orange .stepper-button-plus {
11688 background-color: #ff9800;
11689 color: #fff;
11690}
11691.md .stepper-fill.color-orange .stepper-button.active-state,
11692.md .stepper-fill-md.color-orange .stepper-button.active-state,
11693.md .stepper-fill.color-orange .stepper-button-minus.active-state,
11694.md .stepper-fill-md.color-orange .stepper-button-minus.active-state,
11695.md .stepper-fill.color-orange .stepper-button-plus.active-state,
11696.md .stepper-fill-md.color-orange .stepper-button-plus.active-state {
11697 background: #d68000;
11698}
11699.md .stepper-fill.color-orange .stepper-button:after,
11700.md .stepper-fill-md.color-orange .stepper-button:after,
11701.md .stepper-fill.color-orange .stepper-button-minus:after,
11702.md .stepper-fill-md.color-orange .stepper-button-minus:after,
11703.md .stepper-fill.color-orange .stepper-button-plus:after,
11704.md .stepper-fill-md.color-orange .stepper-button-plus:after,
11705.md .stepper-fill.color-orange .stepper-button:before,
11706.md .stepper-fill-md.color-orange .stepper-button:before,
11707.md .stepper-fill.color-orange .stepper-button-minus:before,
11708.md .stepper-fill-md.color-orange .stepper-button-minus:before,
11709.md .stepper-fill.color-orange .stepper-button-plus:before,
11710.md .stepper-fill-md.color-orange .stepper-button-plus:before {
11711 background: #fff;
11712}
11713.md .stepper.color-gray .stepper-button,
11714.md .stepper.color-gray .stepper-button-minus,
11715.md .stepper.color-gray .stepper-button-plus {
11716 border-color: #9e9e9e;
11717 color: #9e9e9e;
11718}
11719.md .stepper.color-gray .stepper-button-plus:after,
11720.md .stepper.color-gray .stepper-button-minus:after,
11721.md .stepper.color-gray .stepper-button-plus:before,
11722.md .stepper.color-gray .stepper-button-minus:before {
11723 background: #9e9e9e;
11724}
11725.md .stepper.color-gray .stepper-value,
11726.md .stepper.color-gray .stepper-input-wrap {
11727 border-top-color: #9e9e9e;
11728 border-bottom-color: #9e9e9e;
11729}
11730.md .stepper.color-gray .stepper-value,
11731.md .stepper.color-gray .stepper-input-wrap input {
11732 color: #9e9e9e;
11733}
11734.md .stepper-fill.color-gray .stepper-button,
11735.md .stepper-fill-md.color-gray .stepper-button,
11736.md .stepper-fill.color-gray .stepper-button-minus,
11737.md .stepper-fill-md.color-gray .stepper-button-minus,
11738.md .stepper-fill.color-gray .stepper-button-plus,
11739.md .stepper-fill-md.color-gray .stepper-button-plus {
11740 background-color: #9e9e9e;
11741 color: #fff;
11742}
11743.md .stepper-fill.color-gray .stepper-button.active-state,
11744.md .stepper-fill-md.color-gray .stepper-button.active-state,
11745.md .stepper-fill.color-gray .stepper-button-minus.active-state,
11746.md .stepper-fill-md.color-gray .stepper-button-minus.active-state,
11747.md .stepper-fill.color-gray .stepper-button-plus.active-state,
11748.md .stepper-fill-md.color-gray .stepper-button-plus.active-state {
11749 background: #8a8a8a;
11750}
11751.md .stepper-fill.color-gray .stepper-button:after,
11752.md .stepper-fill-md.color-gray .stepper-button:after,
11753.md .stepper-fill.color-gray .stepper-button-minus:after,
11754.md .stepper-fill-md.color-gray .stepper-button-minus:after,
11755.md .stepper-fill.color-gray .stepper-button-plus:after,
11756.md .stepper-fill-md.color-gray .stepper-button-plus:after,
11757.md .stepper-fill.color-gray .stepper-button:before,
11758.md .stepper-fill-md.color-gray .stepper-button:before,
11759.md .stepper-fill.color-gray .stepper-button-minus:before,
11760.md .stepper-fill-md.color-gray .stepper-button-minus:before,
11761.md .stepper-fill.color-gray .stepper-button-plus:before,
11762.md .stepper-fill-md.color-gray .stepper-button-plus:before {
11763 background: #fff;
11764}
11765.md .stepper.color-white .stepper-button,
11766.md .stepper.color-white .stepper-button-minus,
11767.md .stepper.color-white .stepper-button-plus {
11768 border-color: #ffffff;
11769 color: #ffffff;
11770}
11771.md .stepper.color-white .stepper-button-plus:after,
11772.md .stepper.color-white .stepper-button-minus:after,
11773.md .stepper.color-white .stepper-button-plus:before,
11774.md .stepper.color-white .stepper-button-minus:before {
11775 background: #ffffff;
11776}
11777.md .stepper.color-white .stepper-value,
11778.md .stepper.color-white .stepper-input-wrap {
11779 border-top-color: #ffffff;
11780 border-bottom-color: #ffffff;
11781}
11782.md .stepper.color-white .stepper-value,
11783.md .stepper.color-white .stepper-input-wrap input {
11784 color: #ffffff;
11785}
11786.md .stepper-fill.color-white .stepper-button,
11787.md .stepper-fill-md.color-white .stepper-button,
11788.md .stepper-fill.color-white .stepper-button-minus,
11789.md .stepper-fill-md.color-white .stepper-button-minus,
11790.md .stepper-fill.color-white .stepper-button-plus,
11791.md .stepper-fill-md.color-white .stepper-button-plus {
11792 background-color: #ffffff;
11793 color: #fff;
11794}
11795.md .stepper-fill.color-white .stepper-button.active-state,
11796.md .stepper-fill-md.color-white .stepper-button.active-state,
11797.md .stepper-fill.color-white .stepper-button-minus.active-state,
11798.md .stepper-fill-md.color-white .stepper-button-minus.active-state,
11799.md .stepper-fill.color-white .stepper-button-plus.active-state,
11800.md .stepper-fill-md.color-white .stepper-button-plus.active-state {
11801 background: #ebebeb;
11802}
11803.md .stepper-fill.color-white .stepper-button:after,
11804.md .stepper-fill-md.color-white .stepper-button:after,
11805.md .stepper-fill.color-white .stepper-button-minus:after,
11806.md .stepper-fill-md.color-white .stepper-button-minus:after,
11807.md .stepper-fill.color-white .stepper-button-plus:after,
11808.md .stepper-fill-md.color-white .stepper-button-plus:after,
11809.md .stepper-fill.color-white .stepper-button:before,
11810.md .stepper-fill-md.color-white .stepper-button:before,
11811.md .stepper-fill.color-white .stepper-button-minus:before,
11812.md .stepper-fill-md.color-white .stepper-button-minus:before,
11813.md .stepper-fill.color-white .stepper-button-plus:before,
11814.md .stepper-fill-md.color-white .stepper-button-plus:before {
11815 background: #fff;
11816}
11817.md .stepper.color-black .stepper-button,
11818.md .stepper.color-black .stepper-button-minus,
11819.md .stepper.color-black .stepper-button-plus {
11820 border-color: #000000;
11821 color: #000000;
11822}
11823.md .stepper.color-black .stepper-button-plus:after,
11824.md .stepper.color-black .stepper-button-minus:after,
11825.md .stepper.color-black .stepper-button-plus:before,
11826.md .stepper.color-black .stepper-button-minus:before {
11827 background: #000000;
11828}
11829.md .stepper.color-black .stepper-value,
11830.md .stepper.color-black .stepper-input-wrap {
11831 border-top-color: #000000;
11832 border-bottom-color: #000000;
11833}
11834.md .stepper.color-black .stepper-value,
11835.md .stepper.color-black .stepper-input-wrap input {
11836 color: #000000;
11837}
11838.md .stepper-fill.color-black .stepper-button,
11839.md .stepper-fill-md.color-black .stepper-button,
11840.md .stepper-fill.color-black .stepper-button-minus,
11841.md .stepper-fill-md.color-black .stepper-button-minus,
11842.md .stepper-fill.color-black .stepper-button-plus,
11843.md .stepper-fill-md.color-black .stepper-button-plus {
11844 background-color: #000000;
11845 color: #fff;
11846}
11847.md .stepper-fill.color-black .stepper-button.active-state,
11848.md .stepper-fill-md.color-black .stepper-button.active-state,
11849.md .stepper-fill.color-black .stepper-button-minus.active-state,
11850.md .stepper-fill-md.color-black .stepper-button-minus.active-state,
11851.md .stepper-fill.color-black .stepper-button-plus.active-state,
11852.md .stepper-fill-md.color-black .stepper-button-plus.active-state {
11853 background: #000000;
11854}
11855.md .stepper-fill.color-black .stepper-button:after,
11856.md .stepper-fill-md.color-black .stepper-button:after,
11857.md .stepper-fill.color-black .stepper-button-minus:after,
11858.md .stepper-fill-md.color-black .stepper-button-minus:after,
11859.md .stepper-fill.color-black .stepper-button-plus:after,
11860.md .stepper-fill-md.color-black .stepper-button-plus:after,
11861.md .stepper-fill.color-black .stepper-button:before,
11862.md .stepper-fill-md.color-black .stepper-button:before,
11863.md .stepper-fill.color-black .stepper-button-minus:before,
11864.md .stepper-fill-md.color-black .stepper-button-minus:before,
11865.md .stepper-fill.color-black .stepper-button-plus:before,
11866.md .stepper-fill-md.color-black .stepper-button-plus:before {
11867 background: #fff;
11868}
11869/* === Smart Select === */
11870.smart-select select {
11871 display: none;
11872}
11873.smart-select .item-after {
11874 max-width: 70%;
11875 overflow: hidden;
11876 text-overflow: ellipsis;
11877 position: relative;
11878 display: block;
11879}
11880.sheet-modal.smart-select-sheet .sheet-modal-inner {
11881 background: #fff;
11882}
11883.sheet-modal.smart-select-sheet .list {
11884 margin: 0;
11885}
11886.sheet-modal.smart-select-sheet .list ul:before {
11887 display: none !important;
11888}
11889.sheet-modal.smart-select-sheet .list ul:after {
11890 display: none !important;
11891}
11892.smart-select-popover .popover-inner {
11893 max-height: 40vh;
11894}
11895.md .theme-dark .sheet-modal.smart-select-sheet .sheet-modal-inner {
11896 background-color: transparent;
11897}
11898/* === Grid === */
11899.row {
11900 display: -webkit-box;
11901 display: -webkit-flex;
11902 display: -ms-flexbox;
11903 display: flex;
11904 -webkit-box-pack: justify;
11905 -webkit-justify-content: space-between;
11906 -ms-flex-pack: justify;
11907 justify-content: space-between;
11908 -webkit-flex-wrap: wrap;
11909 -ms-flex-wrap: wrap;
11910 flex-wrap: wrap;
11911 -webkit-box-align: start;
11912 -webkit-align-items: flex-start;
11913 -ms-flex-align: start;
11914 align-items: flex-start;
11915}
11916.row > [class*="col-"],
11917.row > .col {
11918 -webkit-box-sizing: border-box;
11919 box-sizing: border-box;
11920}
11921.row .col {
11922 width: 100%;
11923}
11924/* === Grid === */
11925.md .row .col-100 {
11926 width: 100%;
11927 width: calc((100% - 16px*0) / 1);
11928}
11929.md .row.no-gap .col-100 {
11930 width: 100%;
11931}
11932.md .row .col-95 {
11933 width: 95%;
11934 width: calc((100% - 16px*0.05263157894736836) / 1.0526315789473684);
11935}
11936.md .row.no-gap .col-95 {
11937 width: 95%;
11938}
11939.md .row .col-90 {
11940 width: 90%;
11941 width: calc((100% - 16px*0.11111111111111116) / 1.1111111111111112);
11942}
11943.md .row.no-gap .col-90 {
11944 width: 90%;
11945}
11946.md .row .col-85 {
11947 width: 85%;
11948 width: calc((100% - 16px*0.17647058823529416) / 1.1764705882352942);
11949}
11950.md .row.no-gap .col-85 {
11951 width: 85%;
11952}
11953.md .row .col-80 {
11954 width: 80%;
11955 width: calc((100% - 16px*0.25) / 1.25);
11956}
11957.md .row.no-gap .col-80 {
11958 width: 80%;
11959}
11960.md .row .col-75 {
11961 width: 75%;
11962 width: calc((100% - 16px*0.33333333333333326) / 1.3333333333333333);
11963}
11964.md .row.no-gap .col-75 {
11965 width: 75%;
11966}
11967.md .row .col-70 {
11968 width: 70%;
11969 width: calc((100% - 16px*0.4285714285714286) / 1.4285714285714286);
11970}
11971.md .row.no-gap .col-70 {
11972 width: 70%;
11973}
11974.md .row .col-66 {
11975 width: 66.66666666666666%;
11976 width: calc((100% - 16px*0.5000000000000002) / 1.5000000000000002);
11977}
11978.md .row.no-gap .col-66 {
11979 width: 66.66666666666666%;
11980}
11981.md .row .col-65 {
11982 width: 65%;
11983 width: calc((100% - 16px*0.5384615384615385) / 1.5384615384615385);
11984}
11985.md .row.no-gap .col-65 {
11986 width: 65%;
11987}
11988.md .row .col-60 {
11989 width: 60%;
11990 width: calc((100% - 16px*0.6666666666666667) / 1.6666666666666667);
11991}
11992.md .row.no-gap .col-60 {
11993 width: 60%;
11994}
11995.md .row .col-55 {
11996 width: 55%;
11997 width: calc((100% - 16px*0.8181818181818181) / 1.8181818181818181);
11998}
11999.md .row.no-gap .col-55 {
12000 width: 55%;
12001}
12002.md .row .col-50 {
12003 width: 50%;
12004 width: calc((100% - 16px*1) / 2);
12005}
12006.md .row.no-gap .col-50 {
12007 width: 50%;
12008}
12009.md .row .col-45 {
12010 width: 45%;
12011 width: calc((100% - 16px*1.2222222222222223) / 2.2222222222222223);
12012}
12013.md .row.no-gap .col-45 {
12014 width: 45%;
12015}
12016.md .row .col-40 {
12017 width: 40%;
12018 width: calc((100% - 16px*1.5) / 2.5);
12019}
12020.md .row.no-gap .col-40 {
12021 width: 40%;
12022}
12023.md .row .col-35 {
12024 width: 35%;
12025 width: calc((100% - 16px*1.8571428571428572) / 2.857142857142857);
12026}
12027.md .row.no-gap .col-35 {
12028 width: 35%;
12029}
12030.md .row .col-33 {
12031 width: 33.333333333333336%;
12032 width: calc((100% - 16px*2) / 3);
12033}
12034.md .row.no-gap .col-33 {
12035 width: 33.333333333333336%;
12036}
12037.md .row .col-30 {
12038 width: 30%;
12039 width: calc((100% - 16px*2.3333333333333335) / 3.3333333333333335);
12040}
12041.md .row.no-gap .col-30 {
12042 width: 30%;
12043}
12044.md .row .col-25 {
12045 width: 25%;
12046 width: calc((100% - 16px*3) / 4);
12047}
12048.md .row.no-gap .col-25 {
12049 width: 25%;
12050}
12051.md .row .col-20 {
12052 width: 20%;
12053 width: calc((100% - 16px*4) / 5);
12054}
12055.md .row.no-gap .col-20 {
12056 width: 20%;
12057}
12058.md .row .col-15 {
12059 width: 15%;
12060 width: calc((100% - 16px*5.666666666666667) / 6.666666666666667);
12061}
12062.md .row.no-gap .col-15 {
12063 width: 15%;
12064}
12065.md .row .col-10 {
12066 width: 10%;
12067 width: calc((100% - 16px*9) / 10);
12068}
12069.md .row.no-gap .col-10 {
12070 width: 10%;
12071}
12072.md .row .col-5 {
12073 width: 5%;
12074 width: calc((100% - 16px*19) / 20);
12075}
12076.md .row.no-gap .col-5 {
12077 width: 5%;
12078}
12079.md .row .col:nth-last-child(1),
12080.md .row .col:nth-last-child(1) ~ .col {
12081 width: 100%;
12082 width: calc((100% - 16px*0) / 1);
12083}
12084.md .row.no-gap .col:nth-last-child(1),
12085.md .row.no-gap .col:nth-last-child(1) ~ .col {
12086 width: 100%;
12087}
12088.md .row .col:nth-last-child(2),
12089.md .row .col:nth-last-child(2) ~ .col {
12090 width: 50%;
12091 width: calc((100% - 16px*1) / 2);
12092}
12093.md .row.no-gap .col:nth-last-child(2),
12094.md .row.no-gap .col:nth-last-child(2) ~ .col {
12095 width: 50%;
12096}
12097.md .row .col:nth-last-child(3),
12098.md .row .col:nth-last-child(3) ~ .col {
12099 width: 33.33333333%;
12100 width: calc((100% - 16px*2) / 3);
12101}
12102.md .row.no-gap .col:nth-last-child(3),
12103.md .row.no-gap .col:nth-last-child(3) ~ .col {
12104 width: 33.33333333%;
12105}
12106.md .row .col:nth-last-child(4),
12107.md .row .col:nth-last-child(4) ~ .col {
12108 width: 25%;
12109 width: calc((100% - 16px*3) / 4);
12110}
12111.md .row.no-gap .col:nth-last-child(4),
12112.md .row.no-gap .col:nth-last-child(4) ~ .col {
12113 width: 25%;
12114}
12115.md .row .col:nth-last-child(5),
12116.md .row .col:nth-last-child(5) ~ .col {
12117 width: 20%;
12118 width: calc((100% - 16px*4) / 5);
12119}
12120.md .row.no-gap .col:nth-last-child(5),
12121.md .row.no-gap .col:nth-last-child(5) ~ .col {
12122 width: 20%;
12123}
12124.md .row .col:nth-last-child(6),
12125.md .row .col:nth-last-child(6) ~ .col {
12126 width: 16.66666667%;
12127 width: calc((100% - 16px*5) / 6);
12128}
12129.md .row.no-gap .col:nth-last-child(6),
12130.md .row.no-gap .col:nth-last-child(6) ~ .col {
12131 width: 16.66666667%;
12132}
12133.md .row .col:nth-last-child(7),
12134.md .row .col:nth-last-child(7) ~ .col {
12135 width: 14.28571429%;
12136 width: calc((100% - 16px*6) / 7);
12137}
12138.md .row.no-gap .col:nth-last-child(7),
12139.md .row.no-gap .col:nth-last-child(7) ~ .col {
12140 width: 14.28571429%;
12141}
12142.md .row .col:nth-last-child(8),
12143.md .row .col:nth-last-child(8) ~ .col {
12144 width: 12.5%;
12145 width: calc((100% - 16px*7) / 8);
12146}
12147.md .row.no-gap .col:nth-last-child(8),
12148.md .row.no-gap .col:nth-last-child(8) ~ .col {
12149 width: 12.5%;
12150}
12151.md .row .col:nth-last-child(9),
12152.md .row .col:nth-last-child(9) ~ .col {
12153 width: 11.11111111%;
12154 width: calc((100% - 16px*8) / 9);
12155}
12156.md .row.no-gap .col:nth-last-child(9),
12157.md .row.no-gap .col:nth-last-child(9) ~ .col {
12158 width: 11.11111111%;
12159}
12160.md .row .col:nth-last-child(10),
12161.md .row .col:nth-last-child(10) ~ .col {
12162 width: 10%;
12163 width: calc((100% - 16px*9) / 10);
12164}
12165.md .row.no-gap .col:nth-last-child(10),
12166.md .row.no-gap .col:nth-last-child(10) ~ .col {
12167 width: 10%;
12168}
12169.md .row .col:nth-last-child(11),
12170.md .row .col:nth-last-child(11) ~ .col {
12171 width: 9.09090909%;
12172 width: calc((100% - 16px*10) / 11);
12173}
12174.md .row.no-gap .col:nth-last-child(11),
12175.md .row.no-gap .col:nth-last-child(11) ~ .col {
12176 width: 9.09090909%;
12177}
12178.md .row .col:nth-last-child(12),
12179.md .row .col:nth-last-child(12) ~ .col {
12180 width: 8.33333333%;
12181 width: calc((100% - 16px*11) / 12);
12182}
12183.md .row.no-gap .col:nth-last-child(12),
12184.md .row.no-gap .col:nth-last-child(12) ~ .col {
12185 width: 8.33333333%;
12186}
12187.md .row .col:nth-last-child(13),
12188.md .row .col:nth-last-child(13) ~ .col {
12189 width: 7.69230769%;
12190 width: calc((100% - 16px*12) / 13);
12191}
12192.md .row.no-gap .col:nth-last-child(13),
12193.md .row.no-gap .col:nth-last-child(13) ~ .col {
12194 width: 7.69230769%;
12195}
12196.md .row .col:nth-last-child(14),
12197.md .row .col:nth-last-child(14) ~ .col {
12198 width: 7.14285714%;
12199 width: calc((100% - 16px*13) / 14);
12200}
12201.md .row.no-gap .col:nth-last-child(14),
12202.md .row.no-gap .col:nth-last-child(14) ~ .col {
12203 width: 7.14285714%;
12204}
12205.md .row .col:nth-last-child(15),
12206.md .row .col:nth-last-child(15) ~ .col {
12207 width: 6.66666667%;
12208 width: calc((100% - 16px*14) / 15);
12209}
12210.md .row.no-gap .col:nth-last-child(15),
12211.md .row.no-gap .col:nth-last-child(15) ~ .col {
12212 width: 6.66666667%;
12213}
12214.md .row .col:nth-last-child(16),
12215.md .row .col:nth-last-child(16) ~ .col {
12216 width: 6.25%;
12217 width: calc((100% - 16px*15) / 16);
12218}
12219.md .row.no-gap .col:nth-last-child(16),
12220.md .row.no-gap .col:nth-last-child(16) ~ .col {
12221 width: 6.25%;
12222}
12223.md .row .col:nth-last-child(17),
12224.md .row .col:nth-last-child(17) ~ .col {
12225 width: 5.88235294%;
12226 width: calc((100% - 16px*16) / 17);
12227}
12228.md .row.no-gap .col:nth-last-child(17),
12229.md .row.no-gap .col:nth-last-child(17) ~ .col {
12230 width: 5.88235294%;
12231}
12232.md .row .col:nth-last-child(18),
12233.md .row .col:nth-last-child(18) ~ .col {
12234 width: 5.55555556%;
12235 width: calc((100% - 16px*17) / 18);
12236}
12237.md .row.no-gap .col:nth-last-child(18),
12238.md .row.no-gap .col:nth-last-child(18) ~ .col {
12239 width: 5.55555556%;
12240}
12241.md .row .col:nth-last-child(19),
12242.md .row .col:nth-last-child(19) ~ .col {
12243 width: 5.26315789%;
12244 width: calc((100% - 16px*18) / 19);
12245}
12246.md .row.no-gap .col:nth-last-child(19),
12247.md .row.no-gap .col:nth-last-child(19) ~ .col {
12248 width: 5.26315789%;
12249}
12250.md .row .col:nth-last-child(20),
12251.md .row .col:nth-last-child(20) ~ .col {
12252 width: 5%;
12253 width: calc((100% - 16px*19) / 20);
12254}
12255.md .row.no-gap .col:nth-last-child(20),
12256.md .row.no-gap .col:nth-last-child(20) ~ .col {
12257 width: 5%;
12258}
12259.md .row .col:nth-last-child(21),
12260.md .row .col:nth-last-child(21) ~ .col {
12261 width: 4.76190476%;
12262 width: calc((100% - 16px*20) / 21);
12263}
12264.md .row.no-gap .col:nth-last-child(21),
12265.md .row.no-gap .col:nth-last-child(21) ~ .col {
12266 width: 4.76190476%;
12267}
12268@media (min-width: 768px) {
12269 .md .row .tablet-100 {
12270 width: 100%;
12271 width: calc((100% - 16px*0) / 1);
12272 }
12273 .md .row.no-gap .tablet-100 {
12274 width: 100%;
12275 }
12276 .md .row .tablet-95 {
12277 width: 95%;
12278 width: calc((100% - 16px*0.05263157894736836) / 1.0526315789473684);
12279 }
12280 .md .row.no-gap .tablet-95 {
12281 width: 95%;
12282 }
12283 .md .row .tablet-90 {
12284 width: 90%;
12285 width: calc((100% - 16px*0.11111111111111116) / 1.1111111111111112);
12286 }
12287 .md .row.no-gap .tablet-90 {
12288 width: 90%;
12289 }
12290 .md .row .tablet-85 {
12291 width: 85%;
12292 width: calc((100% - 16px*0.17647058823529416) / 1.1764705882352942);
12293 }
12294 .md .row.no-gap .tablet-85 {
12295 width: 85%;
12296 }
12297 .md .row .tablet-80 {
12298 width: 80%;
12299 width: calc((100% - 16px*0.25) / 1.25);
12300 }
12301 .md .row.no-gap .tablet-80 {
12302 width: 80%;
12303 }
12304 .md .row .tablet-75 {
12305 width: 75%;
12306 width: calc((100% - 16px*0.33333333333333326) / 1.3333333333333333);
12307 }
12308 .md .row.no-gap .tablet-75 {
12309 width: 75%;
12310 }
12311 .md .row .tablet-70 {
12312 width: 70%;
12313 width: calc((100% - 16px*0.4285714285714286) / 1.4285714285714286);
12314 }
12315 .md .row.no-gap .tablet-70 {
12316 width: 70%;
12317 }
12318 .md .row .tablet-66 {
12319 width: 66.66666666666666%;
12320 width: calc((100% - 16px*0.5000000000000002) / 1.5000000000000002);
12321 }
12322 .md .row.no-gap .tablet-66 {
12323 width: 66.66666666666666%;
12324 }
12325 .md .row .tablet-65 {
12326 width: 65%;
12327 width: calc((100% - 16px*0.5384615384615385) / 1.5384615384615385);
12328 }
12329 .md .row.no-gap .tablet-65 {
12330 width: 65%;
12331 }
12332 .md .row .tablet-60 {
12333 width: 60%;
12334 width: calc((100% - 16px*0.6666666666666667) / 1.6666666666666667);
12335 }
12336 .md .row.no-gap .tablet-60 {
12337 width: 60%;
12338 }
12339 .md .row .tablet-55 {
12340 width: 55%;
12341 width: calc((100% - 16px*0.8181818181818181) / 1.8181818181818181);
12342 }
12343 .md .row.no-gap .tablet-55 {
12344 width: 55%;
12345 }
12346 .md .row .tablet-50 {
12347 width: 50%;
12348 width: calc((100% - 16px*1) / 2);
12349 }
12350 .md .row.no-gap .tablet-50 {
12351 width: 50%;
12352 }
12353 .md .row .tablet-45 {
12354 width: 45%;
12355 width: calc((100% - 16px*1.2222222222222223) / 2.2222222222222223);
12356 }
12357 .md .row.no-gap .tablet-45 {
12358 width: 45%;
12359 }
12360 .md .row .tablet-40 {
12361 width: 40%;
12362 width: calc((100% - 16px*1.5) / 2.5);
12363 }
12364 .md .row.no-gap .tablet-40 {
12365 width: 40%;
12366 }
12367 .md .row .tablet-35 {
12368 width: 35%;
12369 width: calc((100% - 16px*1.8571428571428572) / 2.857142857142857);
12370 }
12371 .md .row.no-gap .tablet-35 {
12372 width: 35%;
12373 }
12374 .md .row .tablet-33 {
12375 width: 33.333333333333336%;
12376 width: calc((100% - 16px*2) / 3);
12377 }
12378 .md .row.no-gap .tablet-33 {
12379 width: 33.333333333333336%;
12380 }
12381 .md .row .tablet-30 {
12382 width: 30%;
12383 width: calc((100% - 16px*2.3333333333333335) / 3.3333333333333335);
12384 }
12385 .md .row.no-gap .tablet-30 {
12386 width: 30%;
12387 }
12388 .md .row .tablet-25 {
12389 width: 25%;
12390 width: calc((100% - 16px*3) / 4);
12391 }
12392 .md .row.no-gap .tablet-25 {
12393 width: 25%;
12394 }
12395 .md .row .tablet-20 {
12396 width: 20%;
12397 width: calc((100% - 16px*4) / 5);
12398 }
12399 .md .row.no-gap .tablet-20 {
12400 width: 20%;
12401 }
12402 .md .row .tablet-15 {
12403 width: 15%;
12404 width: calc((100% - 16px*5.666666666666667) / 6.666666666666667);
12405 }
12406 .md .row.no-gap .tablet-15 {
12407 width: 15%;
12408 }
12409 .md .row .tablet-10 {
12410 width: 10%;
12411 width: calc((100% - 16px*9) / 10);
12412 }
12413 .md .row.no-gap .tablet-10 {
12414 width: 10%;
12415 }
12416 .md .row .tablet-5 {
12417 width: 5%;
12418 width: calc((100% - 16px*19) / 20);
12419 }
12420 .md .row.no-gap .tablet-5 {
12421 width: 5%;
12422 }
12423 .md .row .tablet-auto:nth-last-child(1),
12424 .md .row .tablet-auto:nth-last-child(1) ~ .tablet-auto {
12425 width: 100%;
12426 width: calc((100% - 16px*0) / 1);
12427 }
12428 .md .row.no-gap .tablet-auto:nth-last-child(1),
12429 .md .row.no-gap .tablet-auto:nth-last-child(1) ~ .tablet-auto {
12430 width: 100%;
12431 }
12432 .md .row .tablet-auto:nth-last-child(2),
12433 .md .row .tablet-auto:nth-last-child(2) ~ .tablet-auto {
12434 width: 50%;
12435 width: calc((100% - 16px*1) / 2);
12436 }
12437 .md .row.no-gap .tablet-auto:nth-last-child(2),
12438 .md .row.no-gap .tablet-auto:nth-last-child(2) ~ .tablet-auto {
12439 width: 50%;
12440 }
12441 .md .row .tablet-auto:nth-last-child(3),
12442 .md .row .tablet-auto:nth-last-child(3) ~ .tablet-auto {
12443 width: 33.33333333%;
12444 width: calc((100% - 16px*2) / 3);
12445 }
12446 .md .row.no-gap .tablet-auto:nth-last-child(3),
12447 .md .row.no-gap .tablet-auto:nth-last-child(3) ~ .tablet-auto {
12448 width: 33.33333333%;
12449 }
12450 .md .row .tablet-auto:nth-last-child(4),
12451 .md .row .tablet-auto:nth-last-child(4) ~ .tablet-auto {
12452 width: 25%;
12453 width: calc((100% - 16px*3) / 4);
12454 }
12455 .md .row.no-gap .tablet-auto:nth-last-child(4),
12456 .md .row.no-gap .tablet-auto:nth-last-child(4) ~ .tablet-auto {
12457 width: 25%;
12458 }
12459 .md .row .tablet-auto:nth-last-child(5),
12460 .md .row .tablet-auto:nth-last-child(5) ~ .tablet-auto {
12461 width: 20%;
12462 width: calc((100% - 16px*4) / 5);
12463 }
12464 .md .row.no-gap .tablet-auto:nth-last-child(5),
12465 .md .row.no-gap .tablet-auto:nth-last-child(5) ~ .tablet-auto {
12466 width: 20%;
12467 }
12468 .md .row .tablet-auto:nth-last-child(6),
12469 .md .row .tablet-auto:nth-last-child(6) ~ .tablet-auto {
12470 width: 16.66666667%;
12471 width: calc((100% - 16px*5) / 6);
12472 }
12473 .md .row.no-gap .tablet-auto:nth-last-child(6),
12474 .md .row.no-gap .tablet-auto:nth-last-child(6) ~ .tablet-auto {
12475 width: 16.66666667%;
12476 }
12477 .md .row .tablet-auto:nth-last-child(7),
12478 .md .row .tablet-auto:nth-last-child(7) ~ .tablet-auto {
12479 width: 14.28571429%;
12480 width: calc((100% - 16px*6) / 7);
12481 }
12482 .md .row.no-gap .tablet-auto:nth-last-child(7),
12483 .md .row.no-gap .tablet-auto:nth-last-child(7) ~ .tablet-auto {
12484 width: 14.28571429%;
12485 }
12486 .md .row .tablet-auto:nth-last-child(8),
12487 .md .row .tablet-auto:nth-last-child(8) ~ .tablet-auto {
12488 width: 12.5%;
12489 width: calc((100% - 16px*7) / 8);
12490 }
12491 .md .row.no-gap .tablet-auto:nth-last-child(8),
12492 .md .row.no-gap .tablet-auto:nth-last-child(8) ~ .tablet-auto {
12493 width: 12.5%;
12494 }
12495 .md .row .tablet-auto:nth-last-child(9),
12496 .md .row .tablet-auto:nth-last-child(9) ~ .tablet-auto {
12497 width: 11.11111111%;
12498 width: calc((100% - 16px*8) / 9);
12499 }
12500 .md .row.no-gap .tablet-auto:nth-last-child(9),
12501 .md .row.no-gap .tablet-auto:nth-last-child(9) ~ .tablet-auto {
12502 width: 11.11111111%;
12503 }
12504 .md .row .tablet-auto:nth-last-child(10),
12505 .md .row .tablet-auto:nth-last-child(10) ~ .tablet-auto {
12506 width: 10%;
12507 width: calc((100% - 16px*9) / 10);
12508 }
12509 .md .row.no-gap .tablet-auto:nth-last-child(10),
12510 .md .row.no-gap .tablet-auto:nth-last-child(10) ~ .tablet-auto {
12511 width: 10%;
12512 }
12513 .md .row .tablet-auto:nth-last-child(11),
12514 .md .row .tablet-auto:nth-last-child(11) ~ .tablet-auto {
12515 width: 9.09090909%;
12516 width: calc((100% - 16px*10) / 11);
12517 }
12518 .md .row.no-gap .tablet-auto:nth-last-child(11),
12519 .md .row.no-gap .tablet-auto:nth-last-child(11) ~ .tablet-auto {
12520 width: 9.09090909%;
12521 }
12522 .md .row .tablet-auto:nth-last-child(12),
12523 .md .row .tablet-auto:nth-last-child(12) ~ .tablet-auto {
12524 width: 8.33333333%;
12525 width: calc((100% - 16px*11) / 12);
12526 }
12527 .md .row.no-gap .tablet-auto:nth-last-child(12),
12528 .md .row.no-gap .tablet-auto:nth-last-child(12) ~ .tablet-auto {
12529 width: 8.33333333%;
12530 }
12531 .md .row .tablet-auto:nth-last-child(13),
12532 .md .row .tablet-auto:nth-last-child(13) ~ .tablet-auto {
12533 width: 7.69230769%;
12534 width: calc((100% - 16px*12) / 13);
12535 }
12536 .md .row.no-gap .tablet-auto:nth-last-child(13),
12537 .md .row.no-gap .tablet-auto:nth-last-child(13) ~ .tablet-auto {
12538 width: 7.69230769%;
12539 }
12540 .md .row .tablet-auto:nth-last-child(14),
12541 .md .row .tablet-auto:nth-last-child(14) ~ .tablet-auto {
12542 width: 7.14285714%;
12543 width: calc((100% - 16px*13) / 14);
12544 }
12545 .md .row.no-gap .tablet-auto:nth-last-child(14),
12546 .md .row.no-gap .tablet-auto:nth-last-child(14) ~ .tablet-auto {
12547 width: 7.14285714%;
12548 }
12549 .md .row .tablet-auto:nth-last-child(15),
12550 .md .row .tablet-auto:nth-last-child(15) ~ .tablet-auto {
12551 width: 6.66666667%;
12552 width: calc((100% - 16px*14) / 15);
12553 }
12554 .md .row.no-gap .tablet-auto:nth-last-child(15),
12555 .md .row.no-gap .tablet-auto:nth-last-child(15) ~ .tablet-auto {
12556 width: 6.66666667%;
12557 }
12558 .md .row .tablet-auto:nth-last-child(16),
12559 .md .row .tablet-auto:nth-last-child(16) ~ .tablet-auto {
12560 width: 6.25%;
12561 width: calc((100% - 16px*15) / 16);
12562 }
12563 .md .row.no-gap .tablet-auto:nth-last-child(16),
12564 .md .row.no-gap .tablet-auto:nth-last-child(16) ~ .tablet-auto {
12565 width: 6.25%;
12566 }
12567 .md .row .tablet-auto:nth-last-child(17),
12568 .md .row .tablet-auto:nth-last-child(17) ~ .tablet-auto {
12569 width: 5.88235294%;
12570 width: calc((100% - 16px*16) / 17);
12571 }
12572 .md .row.no-gap .tablet-auto:nth-last-child(17),
12573 .md .row.no-gap .tablet-auto:nth-last-child(17) ~ .tablet-auto {
12574 width: 5.88235294%;
12575 }
12576 .md .row .tablet-auto:nth-last-child(18),
12577 .md .row .tablet-auto:nth-last-child(18) ~ .tablet-auto {
12578 width: 5.55555556%;
12579 width: calc((100% - 16px*17) / 18);
12580 }
12581 .md .row.no-gap .tablet-auto:nth-last-child(18),
12582 .md .row.no-gap .tablet-auto:nth-last-child(18) ~ .tablet-auto {
12583 width: 5.55555556%;
12584 }
12585 .md .row .tablet-auto:nth-last-child(19),
12586 .md .row .tablet-auto:nth-last-child(19) ~ .tablet-auto {
12587 width: 5.26315789%;
12588 width: calc((100% - 16px*18) / 19);
12589 }
12590 .md .row.no-gap .tablet-auto:nth-last-child(19),
12591 .md .row.no-gap .tablet-auto:nth-last-child(19) ~ .tablet-auto {
12592 width: 5.26315789%;
12593 }
12594 .md .row .tablet-auto:nth-last-child(20),
12595 .md .row .tablet-auto:nth-last-child(20) ~ .tablet-auto {
12596 width: 5%;
12597 width: calc((100% - 16px*19) / 20);
12598 }
12599 .md .row.no-gap .tablet-auto:nth-last-child(20),
12600 .md .row.no-gap .tablet-auto:nth-last-child(20) ~ .tablet-auto {
12601 width: 5%;
12602 }
12603 .md .row .tablet-auto:nth-last-child(21),
12604 .md .row .tablet-auto:nth-last-child(21) ~ .tablet-auto {
12605 width: 4.76190476%;
12606 width: calc((100% - 16px*20) / 21);
12607 }
12608 .md .row.no-gap .tablet-auto:nth-last-child(21),
12609 .md .row.no-gap .tablet-auto:nth-last-child(21) ~ .tablet-auto {
12610 width: 4.76190476%;
12611 }
12612}
12613@media (min-width: 1025px) {
12614 .md .row .desktop-100 {
12615 width: 100%;
12616 width: calc((100% - 16px*0) / 1);
12617 }
12618 .md .row.no-gap .desktop-100 {
12619 width: 100%;
12620 }
12621 .md .row .desktop-95 {
12622 width: 95%;
12623 width: calc((100% - 16px*0.05263157894736836) / 1.0526315789473684);
12624 }
12625 .md .row.no-gap .desktop-95 {
12626 width: 95%;
12627 }
12628 .md .row .desktop-90 {
12629 width: 90%;
12630 width: calc((100% - 16px*0.11111111111111116) / 1.1111111111111112);
12631 }
12632 .md .row.no-gap .desktop-90 {
12633 width: 90%;
12634 }
12635 .md .row .desktop-85 {
12636 width: 85%;
12637 width: calc((100% - 16px*0.17647058823529416) / 1.1764705882352942);
12638 }
12639 .md .row.no-gap .desktop-85 {
12640 width: 85%;
12641 }
12642 .md .row .desktop-80 {
12643 width: 80%;
12644 width: calc((100% - 16px*0.25) / 1.25);
12645 }
12646 .md .row.no-gap .desktop-80 {
12647 width: 80%;
12648 }
12649 .md .row .desktop-75 {
12650 width: 75%;
12651 width: calc((100% - 16px*0.33333333333333326) / 1.3333333333333333);
12652 }
12653 .md .row.no-gap .desktop-75 {
12654 width: 75%;
12655 }
12656 .md .row .desktop-70 {
12657 width: 70%;
12658 width: calc((100% - 16px*0.4285714285714286) / 1.4285714285714286);
12659 }
12660 .md .row.no-gap .desktop-70 {
12661 width: 70%;
12662 }
12663 .md .row .desktop-66 {
12664 width: 66.66666666666666%;
12665 width: calc((100% - 16px*0.5000000000000002) / 1.5000000000000002);
12666 }
12667 .md .row.no-gap .desktop-66 {
12668 width: 66.66666666666666%;
12669 }
12670 .md .row .desktop-65 {
12671 width: 65%;
12672 width: calc((100% - 16px*0.5384615384615385) / 1.5384615384615385);
12673 }
12674 .md .row.no-gap .desktop-65 {
12675 width: 65%;
12676 }
12677 .md .row .desktop-60 {
12678 width: 60%;
12679 width: calc((100% - 16px*0.6666666666666667) / 1.6666666666666667);
12680 }
12681 .md .row.no-gap .desktop-60 {
12682 width: 60%;
12683 }
12684 .md .row .desktop-55 {
12685 width: 55%;
12686 width: calc((100% - 16px*0.8181818181818181) / 1.8181818181818181);
12687 }
12688 .md .row.no-gap .desktop-55 {
12689 width: 55%;
12690 }
12691 .md .row .desktop-50 {
12692 width: 50%;
12693 width: calc((100% - 16px*1) / 2);
12694 }
12695 .md .row.no-gap .desktop-50 {
12696 width: 50%;
12697 }
12698 .md .row .desktop-45 {
12699 width: 45%;
12700 width: calc((100% - 16px*1.2222222222222223) / 2.2222222222222223);
12701 }
12702 .md .row.no-gap .desktop-45 {
12703 width: 45%;
12704 }
12705 .md .row .desktop-40 {
12706 width: 40%;
12707 width: calc((100% - 16px*1.5) / 2.5);
12708 }
12709 .md .row.no-gap .desktop-40 {
12710 width: 40%;
12711 }
12712 .md .row .desktop-35 {
12713 width: 35%;
12714 width: calc((100% - 16px*1.8571428571428572) / 2.857142857142857);
12715 }
12716 .md .row.no-gap .desktop-35 {
12717 width: 35%;
12718 }
12719 .md .row .desktop-33 {
12720 width: 33.333333333333336%;
12721 width: calc((100% - 16px*2) / 3);
12722 }
12723 .md .row.no-gap .desktop-33 {
12724 width: 33.333333333333336%;
12725 }
12726 .md .row .desktop-30 {
12727 width: 30%;
12728 width: calc((100% - 16px*2.3333333333333335) / 3.3333333333333335);
12729 }
12730 .md .row.no-gap .desktop-30 {
12731 width: 30%;
12732 }
12733 .md .row .desktop-25 {
12734 width: 25%;
12735 width: calc((100% - 16px*3) / 4);
12736 }
12737 .md .row.no-gap .desktop-25 {
12738 width: 25%;
12739 }
12740 .md .row .desktop-20 {
12741 width: 20%;
12742 width: calc((100% - 16px*4) / 5);
12743 }
12744 .md .row.no-gap .desktop-20 {
12745 width: 20%;
12746 }
12747 .md .row .desktop-15 {
12748 width: 15%;
12749 width: calc((100% - 16px*5.666666666666667) / 6.666666666666667);
12750 }
12751 .md .row.no-gap .desktop-15 {
12752 width: 15%;
12753 }
12754 .md .row .desktop-10 {
12755 width: 10%;
12756 width: calc((100% - 16px*9) / 10);
12757 }
12758 .md .row.no-gap .desktop-10 {
12759 width: 10%;
12760 }
12761 .md .row .desktop-5 {
12762 width: 5%;
12763 width: calc((100% - 16px*19) / 20);
12764 }
12765 .md .row.no-gap .desktop-5 {
12766 width: 5%;
12767 }
12768 .md .row .desktop-auto:nth-last-child(1),
12769 .md .row .desktop-auto:nth-last-child(1) ~ .desktop-auto {
12770 width: 100%;
12771 width: calc((100% - 16px*0) / 1);
12772 }
12773 .md .row.no-gap .desktop-auto:nth-last-child(1),
12774 .md .row.no-gap .desktop-auto:nth-last-child(1) ~ .desktop-auto {
12775 width: 100%;
12776 }
12777 .md .row .desktop-auto:nth-last-child(2),
12778 .md .row .desktop-auto:nth-last-child(2) ~ .desktop-auto {
12779 width: 50%;
12780 width: calc((100% - 16px*1) / 2);
12781 }
12782 .md .row.no-gap .desktop-auto:nth-last-child(2),
12783 .md .row.no-gap .desktop-auto:nth-last-child(2) ~ .desktop-auto {
12784 width: 50%;
12785 }
12786 .md .row .desktop-auto:nth-last-child(3),
12787 .md .row .desktop-auto:nth-last-child(3) ~ .desktop-auto {
12788 width: 33.33333333%;
12789 width: calc((100% - 16px*2) / 3);
12790 }
12791 .md .row.no-gap .desktop-auto:nth-last-child(3),
12792 .md .row.no-gap .desktop-auto:nth-last-child(3) ~ .desktop-auto {
12793 width: 33.33333333%;
12794 }
12795 .md .row .desktop-auto:nth-last-child(4),
12796 .md .row .desktop-auto:nth-last-child(4) ~ .desktop-auto {
12797 width: 25%;
12798 width: calc((100% - 16px*3) / 4);
12799 }
12800 .md .row.no-gap .desktop-auto:nth-last-child(4),
12801 .md .row.no-gap .desktop-auto:nth-last-child(4) ~ .desktop-auto {
12802 width: 25%;
12803 }
12804 .md .row .desktop-auto:nth-last-child(5),
12805 .md .row .desktop-auto:nth-last-child(5) ~ .desktop-auto {
12806 width: 20%;
12807 width: calc((100% - 16px*4) / 5);
12808 }
12809 .md .row.no-gap .desktop-auto:nth-last-child(5),
12810 .md .row.no-gap .desktop-auto:nth-last-child(5) ~ .desktop-auto {
12811 width: 20%;
12812 }
12813 .md .row .desktop-auto:nth-last-child(6),
12814 .md .row .desktop-auto:nth-last-child(6) ~ .desktop-auto {
12815 width: 16.66666667%;
12816 width: calc((100% - 16px*5) / 6);
12817 }
12818 .md .row.no-gap .desktop-auto:nth-last-child(6),
12819 .md .row.no-gap .desktop-auto:nth-last-child(6) ~ .desktop-auto {
12820 width: 16.66666667%;
12821 }
12822 .md .row .desktop-auto:nth-last-child(7),
12823 .md .row .desktop-auto:nth-last-child(7) ~ .desktop-auto {
12824 width: 14.28571429%;
12825 width: calc((100% - 16px*6) / 7);
12826 }
12827 .md .row.no-gap .desktop-auto:nth-last-child(7),
12828 .md .row.no-gap .desktop-auto:nth-last-child(7) ~ .desktop-auto {
12829 width: 14.28571429%;
12830 }
12831 .md .row .desktop-auto:nth-last-child(8),
12832 .md .row .desktop-auto:nth-last-child(8) ~ .desktop-auto {
12833 width: 12.5%;
12834 width: calc((100% - 16px*7) / 8);
12835 }
12836 .md .row.no-gap .desktop-auto:nth-last-child(8),
12837 .md .row.no-gap .desktop-auto:nth-last-child(8) ~ .desktop-auto {
12838 width: 12.5%;
12839 }
12840 .md .row .desktop-auto:nth-last-child(9),
12841 .md .row .desktop-auto:nth-last-child(9) ~ .desktop-auto {
12842 width: 11.11111111%;
12843 width: calc((100% - 16px*8) / 9);
12844 }
12845 .md .row.no-gap .desktop-auto:nth-last-child(9),
12846 .md .row.no-gap .desktop-auto:nth-last-child(9) ~ .desktop-auto {
12847 width: 11.11111111%;
12848 }
12849 .md .row .desktop-auto:nth-last-child(10),
12850 .md .row .desktop-auto:nth-last-child(10) ~ .desktop-auto {
12851 width: 10%;
12852 width: calc((100% - 16px*9) / 10);
12853 }
12854 .md .row.no-gap .desktop-auto:nth-last-child(10),
12855 .md .row.no-gap .desktop-auto:nth-last-child(10) ~ .desktop-auto {
12856 width: 10%;
12857 }
12858 .md .row .desktop-auto:nth-last-child(11),
12859 .md .row .desktop-auto:nth-last-child(11) ~ .desktop-auto {
12860 width: 9.09090909%;
12861 width: calc((100% - 16px*10) / 11);
12862 }
12863 .md .row.no-gap .desktop-auto:nth-last-child(11),
12864 .md .row.no-gap .desktop-auto:nth-last-child(11) ~ .desktop-auto {
12865 width: 9.09090909%;
12866 }
12867 .md .row .desktop-auto:nth-last-child(12),
12868 .md .row .desktop-auto:nth-last-child(12) ~ .desktop-auto {
12869 width: 8.33333333%;
12870 width: calc((100% - 16px*11) / 12);
12871 }
12872 .md .row.no-gap .desktop-auto:nth-last-child(12),
12873 .md .row.no-gap .desktop-auto:nth-last-child(12) ~ .desktop-auto {
12874 width: 8.33333333%;
12875 }
12876 .md .row .desktop-auto:nth-last-child(13),
12877 .md .row .desktop-auto:nth-last-child(13) ~ .desktop-auto {
12878 width: 7.69230769%;
12879 width: calc((100% - 16px*12) / 13);
12880 }
12881 .md .row.no-gap .desktop-auto:nth-last-child(13),
12882 .md .row.no-gap .desktop-auto:nth-last-child(13) ~ .desktop-auto {
12883 width: 7.69230769%;
12884 }
12885 .md .row .desktop-auto:nth-last-child(14),
12886 .md .row .desktop-auto:nth-last-child(14) ~ .desktop-auto {
12887 width: 7.14285714%;
12888 width: calc((100% - 16px*13) / 14);
12889 }
12890 .md .row.no-gap .desktop-auto:nth-last-child(14),
12891 .md .row.no-gap .desktop-auto:nth-last-child(14) ~ .desktop-auto {
12892 width: 7.14285714%;
12893 }
12894 .md .row .desktop-auto:nth-last-child(15),
12895 .md .row .desktop-auto:nth-last-child(15) ~ .desktop-auto {
12896 width: 6.66666667%;
12897 width: calc((100% - 16px*14) / 15);
12898 }
12899 .md .row.no-gap .desktop-auto:nth-last-child(15),
12900 .md .row.no-gap .desktop-auto:nth-last-child(15) ~ .desktop-auto {
12901 width: 6.66666667%;
12902 }
12903 .md .row .desktop-auto:nth-last-child(16),
12904 .md .row .desktop-auto:nth-last-child(16) ~ .desktop-auto {
12905 width: 6.25%;
12906 width: calc((100% - 16px*15) / 16);
12907 }
12908 .md .row.no-gap .desktop-auto:nth-last-child(16),
12909 .md .row.no-gap .desktop-auto:nth-last-child(16) ~ .desktop-auto {
12910 width: 6.25%;
12911 }
12912 .md .row .desktop-auto:nth-last-child(17),
12913 .md .row .desktop-auto:nth-last-child(17) ~ .desktop-auto {
12914 width: 5.88235294%;
12915 width: calc((100% - 16px*16) / 17);
12916 }
12917 .md .row.no-gap .desktop-auto:nth-last-child(17),
12918 .md .row.no-gap .desktop-auto:nth-last-child(17) ~ .desktop-auto {
12919 width: 5.88235294%;
12920 }
12921 .md .row .desktop-auto:nth-last-child(18),
12922 .md .row .desktop-auto:nth-last-child(18) ~ .desktop-auto {
12923 width: 5.55555556%;
12924 width: calc((100% - 16px*17) / 18);
12925 }
12926 .md .row.no-gap .desktop-auto:nth-last-child(18),
12927 .md .row.no-gap .desktop-auto:nth-last-child(18) ~ .desktop-auto {
12928 width: 5.55555556%;
12929 }
12930 .md .row .desktop-auto:nth-last-child(19),
12931 .md .row .desktop-auto:nth-last-child(19) ~ .desktop-auto {
12932 width: 5.26315789%;
12933 width: calc((100% - 16px*18) / 19);
12934 }
12935 .md .row.no-gap .desktop-auto:nth-last-child(19),
12936 .md .row.no-gap .desktop-auto:nth-last-child(19) ~ .desktop-auto {
12937 width: 5.26315789%;
12938 }
12939 .md .row .desktop-auto:nth-last-child(20),
12940 .md .row .desktop-auto:nth-last-child(20) ~ .desktop-auto {
12941 width: 5%;
12942 width: calc((100% - 16px*19) / 20);
12943 }
12944 .md .row.no-gap .desktop-auto:nth-last-child(20),
12945 .md .row.no-gap .desktop-auto:nth-last-child(20) ~ .desktop-auto {
12946 width: 5%;
12947 }
12948 .md .row .desktop-auto:nth-last-child(21),
12949 .md .row .desktop-auto:nth-last-child(21) ~ .desktop-auto {
12950 width: 4.76190476%;
12951 width: calc((100% - 16px*20) / 21);
12952 }
12953 .md .row.no-gap .desktop-auto:nth-last-child(21),
12954 .md .row.no-gap .desktop-auto:nth-last-child(21) ~ .desktop-auto {
12955 width: 4.76190476%;
12956 }
12957}
12958/* === Calendar/Datepicker === */
12959.calendar {
12960 overflow: hidden;
12961 height: 320px;
12962 width: 100%;
12963 display: -webkit-box;
12964 display: -webkit-flex;
12965 display: -ms-flexbox;
12966 display: flex;
12967 -webkit-box-orient: vertical;
12968 -webkit-box-direction: normal;
12969 -webkit-flex-direction: column;
12970 -ms-flex-direction: column;
12971 flex-direction: column;
12972}
12973.calendar.modal-in {
12974 display: -webkit-box;
12975 display: -webkit-flex;
12976 display: -ms-flexbox;
12977 display: flex;
12978}
12979@media (orientation: landscape) and (max-height: 415px) {
12980 .calendar.calendar-sheet {
12981 height: 220px;
12982 }
12983 .calendar.calendar-modal {
12984 height: calc(100vh - 44px);
12985 }
12986}
12987.calendar.calendar-inline,
12988.calendar.calendar-popover .calendar {
12989 position: relative;
12990}
12991.calendar-modal {
12992 position: absolute;
12993 height: 420px;
12994 overflow: hidden;
12995 top: 50%;
12996 left: 50%;
12997 min-width: 300px;
12998 max-width: 380px;
12999 -webkit-transform: translate3d(-50%, 100%, 0);
13000 transform: translate3d(-50%, 100%, 0);
13001 -webkit-transition-property: -webkit-transform;
13002 transition-property: -webkit-transform;
13003 transition-property: transform;
13004 transition-property: transform, -webkit-transform;
13005 display: -webkit-box;
13006 display: -webkit-flex;
13007 display: -ms-flexbox;
13008 display: flex;
13009 z-index: 12000;
13010 background: #fff;
13011 width: 90%;
13012 border-radius: 4px;
13013 -webkit-box-shadow: 0 19px 38px rgba(0, 0, 0, 0.3), 0 15px 12px rgba(0, 0, 0, 0.22);
13014 box-shadow: 0 19px 38px rgba(0, 0, 0, 0.3), 0 15px 12px rgba(0, 0, 0, 0.22);
13015}
13016.calendar-modal.modal-in,
13017.calendar-modal.modal-out {
13018 -webkit-transition-duration: 400ms;
13019 transition-duration: 400ms;
13020}
13021.calendar-modal.modal-in {
13022 -webkit-transform: translate3d(-50%, -50%, 0);
13023 transform: translate3d(-50%, -50%, 0);
13024}
13025.calendar-modal.modal-out {
13026 -webkit-transform: translate3d(-50%, 100%, 0);
13027 transform: translate3d(-50%, 100%, 0);
13028}
13029.calendar-popover {
13030 width: 320px;
13031}
13032.calendar-popover .calendar {
13033 height: 320px;
13034}
13035.calendar-week-header {
13036 display: -webkit-box;
13037 display: -webkit-flex;
13038 display: -ms-flexbox;
13039 display: flex;
13040 -webkit-box-sizing: border-box;
13041 box-sizing: border-box;
13042 position: relative;
13043 font-size: 11px;
13044}
13045.calendar-week-header .calendar-week-day {
13046 -webkit-flex-shrink: 1;
13047 -ms-flex-negative: 1;
13048 flex-shrink: 1;
13049 width: 14.28571429%;
13050 width: calc(100% / 7);
13051 text-align: center;
13052}
13053.calendar-months {
13054 width: 100%;
13055 height: 100%;
13056 overflow: hidden;
13057 position: relative;
13058 -webkit-flex-shrink: 10;
13059 -ms-flex-negative: 10;
13060 flex-shrink: 10;
13061}
13062.calendar-months-wrapper {
13063 position: relative;
13064 width: 100%;
13065 height: 100%;
13066 -webkit-transition: 300ms;
13067 transition: 300ms;
13068}
13069.calendar-month {
13070 display: -webkit-box;
13071 display: -webkit-flex;
13072 display: -ms-flexbox;
13073 display: flex;
13074 -webkit-box-orient: vertical;
13075 -webkit-box-direction: normal;
13076 -webkit-flex-direction: column;
13077 -ms-flex-direction: column;
13078 flex-direction: column;
13079 width: 100%;
13080 height: 100%;
13081 position: absolute;
13082 left: 0;
13083 top: 0;
13084}
13085.calendar-row {
13086 height: 16.66666667%;
13087 height: calc(100% / 6);
13088 display: -webkit-box;
13089 display: -webkit-flex;
13090 display: -ms-flexbox;
13091 display: flex;
13092 -webkit-flex-shrink: 1;
13093 -ms-flex-negative: 1;
13094 flex-shrink: 1;
13095 width: 100%;
13096 position: relative;
13097 -webkit-box-sizing: border-box;
13098 box-sizing: border-box;
13099}
13100.calendar-day {
13101 -webkit-flex-shrink: 1;
13102 -ms-flex-negative: 1;
13103 flex-shrink: 1;
13104 display: -webkit-box;
13105 display: -webkit-flex;
13106 display: -ms-flexbox;
13107 display: flex;
13108 -webkit-box-pack: center;
13109 -webkit-justify-content: center;
13110 -ms-flex-pack: center;
13111 justify-content: center;
13112 -webkit-box-align: center;
13113 -webkit-align-items: center;
13114 -ms-flex-align: center;
13115 align-items: center;
13116 -webkit-box-sizing: border-box;
13117 box-sizing: border-box;
13118 width: 14.28571429%;
13119 width: calc(100% / 7);
13120 text-align: center;
13121 cursor: pointer;
13122 z-index: 20;
13123 color: #000;
13124 height: 100%;
13125}
13126.calendar-day.calendar-day-prev,
13127.calendar-day.calendar-day-next {
13128 color: #b8b8b8;
13129}
13130.calendar-day.calendar-day-disabled {
13131 color: #d4d4d4;
13132 cursor: auto;
13133}
13134.calendar-day.calendar-day-selected .calendar-day-number {
13135 color: #fff;
13136}
13137.calendar-day .calendar-day-number {
13138 display: inline-block;
13139 border-radius: 100%;
13140 position: relative;
13141}
13142.calendar-day .calendar-day-events {
13143 position: absolute;
13144 display: -webkit-box;
13145 display: -webkit-flex;
13146 display: -ms-flexbox;
13147 display: flex;
13148 left: 0;
13149 width: 100%;
13150 top: 100%;
13151 -webkit-box-align: center;
13152 -webkit-align-items: center;
13153 -ms-flex-align: center;
13154 align-items: center;
13155 -webkit-box-pack: center;
13156 -webkit-justify-content: center;
13157 -ms-flex-pack: center;
13158 justify-content: center;
13159 margin-top: 1px;
13160}
13161.calendar-day .calendar-day-event {
13162 width: 4px;
13163 height: 4px;
13164 border-radius: 50%;
13165}
13166.calendar-day .calendar-day-event + .calendar-day-event {
13167 margin-left: 2px;
13168}
13169.calendar-range .calendar-day.calendar-day-selected {
13170 -webkit-box-align: stretch;
13171 -webkit-align-items: stretch;
13172 -ms-flex-align: stretch;
13173 align-items: stretch;
13174 -webkit-align-content: stretch;
13175 -ms-flex-line-pack: stretch;
13176 align-content: stretch;
13177}
13178.calendar-range .calendar-day.calendar-day-selected .calendar-day-number {
13179 width: 100%;
13180 border-radius: 0;
13181 height: auto;
13182 text-align: center;
13183 display: -webkit-box;
13184 display: -webkit-flex;
13185 display: -ms-flexbox;
13186 display: flex;
13187 -webkit-box-align: center;
13188 -webkit-align-items: center;
13189 -ms-flex-align: center;
13190 align-items: center;
13191 -webkit-box-pack: center;
13192 -webkit-justify-content: center;
13193 -ms-flex-pack: center;
13194 justify-content: center;
13195}
13196.calendar-month-selector,
13197.calendar-year-selector {
13198 display: -webkit-box;
13199 display: -webkit-flex;
13200 display: -ms-flexbox;
13201 display: flex;
13202 -webkit-box-pack: justify;
13203 -webkit-justify-content: space-between;
13204 -ms-flex-pack: justify;
13205 justify-content: space-between;
13206 -webkit-box-align: center;
13207 -webkit-align-items: center;
13208 -ms-flex-align: center;
13209 align-items: center;
13210 width: 50%;
13211 max-width: 200px;
13212 -webkit-flex-shrink: 10;
13213 -ms-flex-negative: 10;
13214 flex-shrink: 10;
13215}
13216.calendar-month-selector .calendar-day-number,
13217.calendar-year-selector .calendar-day-number {
13218 -webkit-flex-shrink: 1;
13219 -ms-flex-negative: 1;
13220 flex-shrink: 1;
13221 position: relative;
13222 overflow: hidden;
13223 text-overflow: ellipsis;
13224}
13225.md .calendar-header {
13226 height: 56px;
13227 background: #2196f3;
13228 font-size: 20px;
13229 line-height: 56px;
13230 padding: 0 24px;
13231 color: #fff;
13232 position: relative;
13233 overflow: hidden;
13234 white-space: nowrap;
13235 text-overflow: ellipsis;
13236 -webkit-box-sizing: border-box;
13237 box-sizing: border-box;
13238}
13239.md .calendar-footer {
13240 position: relative;
13241 width: 100%;
13242 height: 48px;
13243 padding: 6px 8px;
13244 overflow: hidden;
13245 -webkit-box-sizing: border-box;
13246 box-sizing: border-box;
13247 display: -webkit-box;
13248 display: -webkit-flex;
13249 display: -ms-flexbox;
13250 display: flex;
13251 -webkit-box-pack: end;
13252 -webkit-justify-content: flex-end;
13253 -ms-flex-pack: end;
13254 justify-content: flex-end;
13255}
13256.md .calendar .toolbar {
13257 background: none !important;
13258 color: #212121;
13259}
13260.md .calendar .toolbar a.link:before {
13261 content: '';
13262 width: 152%;
13263 height: 152%;
13264 position: absolute;
13265 left: -26%;
13266 top: -26%;
13267 background-image: -webkit-radial-gradient(center, circle, rgba(0, 0, 0, 0.15) 66%, rgba(0, 0, 0, 0) 66%);
13268 background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0.15) 66%, rgba(0, 0, 0, 0) 66%);
13269 background-repeat: no-repeat;
13270 background-position: center;
13271 background-size: 100% 100%;
13272 opacity: 0;
13273 pointer-events: none;
13274 -webkit-transition-duration: 600ms;
13275 transition-duration: 600ms;
13276}
13277.md .calendar .toolbar a.link.active-state:before {
13278 opacity: 1;
13279 -webkit-transition-duration: 150ms;
13280 transition-duration: 150ms;
13281}
13282.md .calendar .toolbar a.link .ripple-wave {
13283 background: rgba(0, 0, 0, 0.1);
13284}
13285.md .calendar .toolbar .icon-next,
13286.md .calendar .toolbar .icon-prev,
13287.md .calendar .toolbar .icon-forward,
13288.md .calendar .toolbar .icon-back {
13289 opacity: 0.54;
13290}
13291.md .calendar-week-header {
13292 color: rgba(0, 0, 0, 0.54);
13293 height: 24px;
13294}
13295.md .calendar-week-header .calendar-week-day {
13296 line-height: 24px;
13297}
13298.md .calendar-day.calendar-day-today .calendar-day-number {
13299 color: #2196f3;
13300}
13301.md .calendar-day.calendar-day-selected .calendar-day-number {
13302 background: #2196f3;
13303 color: #fff;
13304}
13305.md .calendar-day .calendar-day-number {
13306 width: 32px;
13307 height: 32px;
13308 line-height: 32px;
13309}
13310.md .calendar-day .calendar-day-event {
13311 background: #2196f3;
13312}
13313.md .calendar-range .calendar-day.calendar-day-selected .calendar-day-number {
13314 color: #fff;
13315}
13316.md .calendar-month-selector a.icon-only,
13317.md .calendar-year-selector a.icon-only {
13318 min-width: 36px;
13319}
13320.md .calendar-sheet:before {
13321 content: '';
13322 position: absolute;
13323 background-color: #ccc;
13324 display: block;
13325 z-index: 15;
13326 top: 0;
13327 right: auto;
13328 bottom: auto;
13329 left: 0;
13330 height: 1px;
13331 width: 100%;
13332 -webkit-transform-origin: 50% 0%;
13333 transform-origin: 50% 0%;
13334}
13335.md.device-pixel-ratio-2 .calendar-sheet:before {
13336 -webkit-transform: scaleY(0.5);
13337 transform: scaleY(0.5);
13338}
13339.md.device-pixel-ratio-3 .calendar-sheet:before {
13340 -webkit-transform: scaleY(0.33);
13341 transform: scaleY(0.33);
13342}
13343.md.device-iphone-x .calendar-sheet .sheet-modal-inner {
13344 margin-bottom: constant(safe-area-inset-bottom);
13345 margin-bottom: env(safe-area-inset-bottom);
13346}
13347@media (orientation: landscape) {
13348 .md.device-iphone-x .ios-left-edge.calendar .calendar-row,
13349 .md.device-iphone-x .ios-edges.calendar .calendar-row,
13350 .md.device-iphone-x .popup.calendar .calendar-row,
13351 .md.device-iphone-x .sheet-modal.calendar .calendar-row,
13352 .md.device-iphone-x .panel-left.calendar .calendar-row,
13353 .md.device-iphone-x .ios-left-edge .calendar:not(.no-ios-edges):not(.no-ios-left-edge) .calendar-row,
13354 .md.device-iphone-x .ios-edges .calendar:not(.no-ios-edges):not(.no-ios-left-edge) .calendar-row,
13355 .md.device-iphone-x .popup .calendar:not(.no-ios-edges):not(.no-ios-left-edge) .calendar-row,
13356 .md.device-iphone-x .sheet-modal .calendar:not(.no-ios-edges):not(.no-ios-left-edge) .calendar-row,
13357 .md.device-iphone-x .panel-left .calendar:not(.no-ios-edges):not(.no-ios-left-edge) .calendar-row,
13358 .md.device-iphone-x .ios-left-edge.calendar .calendar-week-header,
13359 .md.device-iphone-x .ios-edges.calendar .calendar-week-header,
13360 .md.device-iphone-x .popup.calendar .calendar-week-header,
13361 .md.device-iphone-x .sheet-modal.calendar .calendar-week-header,
13362 .md.device-iphone-x .panel-left.calendar .calendar-week-header,
13363 .md.device-iphone-x .ios-left-edge .calendar:not(.no-ios-edges):not(.no-ios-left-edge) .calendar-week-header,
13364 .md.device-iphone-x .ios-edges .calendar:not(.no-ios-edges):not(.no-ios-left-edge) .calendar-week-header,
13365 .md.device-iphone-x .popup .calendar:not(.no-ios-edges):not(.no-ios-left-edge) .calendar-week-header,
13366 .md.device-iphone-x .sheet-modal .calendar:not(.no-ios-edges):not(.no-ios-left-edge) .calendar-week-header,
13367 .md.device-iphone-x .panel-left .calendar:not(.no-ios-edges):not(.no-ios-left-edge) .calendar-week-header {
13368 padding-left: constant(safe-area-inset-left);
13369 padding-left: env(safe-area-inset-left);
13370 }
13371 .md.device-iphone-x .ios-right-edge.calendar .calendar-row,
13372 .md.device-iphone-x .ios-edges.calendar .calendar-row,
13373 .md.device-iphone-x .popup.calendar .calendar-row,
13374 .md.device-iphone-x .sheet-modal.calendar .calendar-row,
13375 .md.device-iphone-x .panel-right.calendar .calendar-row,
13376 .md.device-iphone-x .ios-right-edge .calendar:not(.no-ios-edges):not(.no-ios-right-edge) .calendar-row,
13377 .md.device-iphone-x .ios-edges .calendar:not(.no-ios-edges):not(.no-ios-right-edge) .calendar-row,
13378 .md.device-iphone-x .popup .calendar:not(.no-ios-edges):not(.no-ios-right-edge) .calendar-row,
13379 .md.device-iphone-x .sheet-modal .calendar:not(.no-ios-edges):not(.no-ios-right-edge) .calendar-row,
13380 .md.device-iphone-x .panel-right .calendar:not(.no-ios-edges):not(.no-ios-right-edge) .calendar-row,
13381 .md.device-iphone-x .ios-right-edge.calendar .calendar-week-header,
13382 .md.device-iphone-x .ios-edges.calendar .calendar-week-header,
13383 .md.device-iphone-x .popup.calendar .calendar-week-header,
13384 .md.device-iphone-x .sheet-modal.calendar .calendar-week-header,
13385 .md.device-iphone-x .panel-right.calendar .calendar-week-header,
13386 .md.device-iphone-x .ios-right-edge .calendar:not(.no-ios-edges):not(.no-ios-right-edge) .calendar-week-header,
13387 .md.device-iphone-x .ios-edges .calendar:not(.no-ios-edges):not(.no-ios-right-edge) .calendar-week-header,
13388 .md.device-iphone-x .popup .calendar:not(.no-ios-edges):not(.no-ios-right-edge) .calendar-week-header,
13389 .md.device-iphone-x .sheet-modal .calendar:not(.no-ios-edges):not(.no-ios-right-edge) .calendar-week-header,
13390 .md.device-iphone-x .panel-right .calendar:not(.no-ios-edges):not(.no-ios-right-edge) .calendar-week-header {
13391 padding-right: constant(safe-area-inset-right);
13392 padding-right: env(safe-area-inset-right);
13393 }
13394}
13395.md .theme-dark .calendar-popover .calendar-week-header {
13396 background-color: transparent;
13397}
13398.md .theme-dark .calendar-week-header {
13399 color: rgba(255, 255, 255, 0.54);
13400}
13401.md .theme-dark .calendar-day {
13402 color: rgba(255, 255, 255, 0.87);
13403}
13404.md .theme-dark .calendar-day.calendar-day-disabled {
13405 color: rgba(255, 255, 255, 0.54);
13406}
13407.md .theme-dark .calendar-day.calendar-day-prev,
13408.md .theme-dark .calendar-day.calendar-day-next {
13409 color: rgba(255, 255, 255, 0.35);
13410}
13411.md .theme-dark .calendar-modal,
13412.calendar-modal.md .theme-dark {
13413 background: #202020;
13414}
13415.md .theme-dark .calendar.calendar-sheet:before,
13416.calendar.md .theme-dark.calendar-sheet:before {
13417 background-color: rgba(255, 255, 255, 0.2);
13418}
13419.md .theme-dark .calendar .toolbar,
13420.calendar.md .theme-dark .toolbar {
13421 color: rgba(255, 255, 255, 0.54);
13422}
13423.md .theme-dark .calendar .toolbar a.link:before,
13424.calendar.md .theme-dark .toolbar a.link:before {
13425 content: '';
13426 width: 152%;
13427 height: 152%;
13428 position: absolute;
13429 left: -26%;
13430 top: -26%;
13431 background-image: -webkit-radial-gradient(center, circle, rgba(255, 255, 255, 0.15) 66%, rgba(255, 255, 255, 0) 66%);
13432 background-image: radial-gradient(circle at center, rgba(255, 255, 255, 0.15) 66%, rgba(255, 255, 255, 0) 66%);
13433 background-repeat: no-repeat;
13434 background-position: center;
13435 background-size: 100% 100%;
13436 opacity: 0;
13437 pointer-events: none;
13438 -webkit-transition-duration: 600ms;
13439 transition-duration: 600ms;
13440}
13441.md .theme-dark .calendar .toolbar a.link.active-state:before,
13442.calendar.md .theme-dark .toolbar a.link.active-state:before {
13443 opacity: 1;
13444 -webkit-transition-duration: 150ms;
13445 transition-duration: 150ms;
13446}
13447.md .theme-dark .calendar .toolbar a.link .ripple-wave,
13448.calendar.md .theme-dark .toolbar a.link .ripple-wave {
13449 background-color: rgba(255, 255, 255, 0.3);
13450}
13451.md .color-theme-red .calendar-header,
13452.md .color-red .calendar-header {
13453 background: #f44336;
13454}
13455.md .color-theme-red .calendar-day.calendar-day-today .calendar-day-number,
13456.md .color-red .calendar-day.calendar-day-today .calendar-day-number {
13457 color: #f44336;
13458}
13459.md .color-theme-red .calendar-day.calendar-day-selected .calendar-day-number,
13460.md .color-red .calendar-day.calendar-day-selected .calendar-day-number {
13461 background: #f44336;
13462 color: #fff;
13463}
13464.md .color-theme-red .calendar-day.calendar-day-selected .calendar-day-number:after,
13465.md .color-red .calendar-day.calendar-day-selected .calendar-day-number:after {
13466 background-color: #fff;
13467}
13468.md .color-theme-red .calendar-day .calendar-day-event,
13469.md .color-red .calendar-day .calendar-day-event {
13470 background: #f44336;
13471}
13472.md .color-theme-green .calendar-header,
13473.md .color-green .calendar-header {
13474 background: #4caf50;
13475}
13476.md .color-theme-green .calendar-day.calendar-day-today .calendar-day-number,
13477.md .color-green .calendar-day.calendar-day-today .calendar-day-number {
13478 color: #4caf50;
13479}
13480.md .color-theme-green .calendar-day.calendar-day-selected .calendar-day-number,
13481.md .color-green .calendar-day.calendar-day-selected .calendar-day-number {
13482 background: #4caf50;
13483 color: #fff;
13484}
13485.md .color-theme-green .calendar-day.calendar-day-selected .calendar-day-number:after,
13486.md .color-green .calendar-day.calendar-day-selected .calendar-day-number:after {
13487 background-color: #fff;
13488}
13489.md .color-theme-green .calendar-day .calendar-day-event,
13490.md .color-green .calendar-day .calendar-day-event {
13491 background: #4caf50;
13492}
13493.md .color-theme-blue .calendar-header,
13494.md .color-blue .calendar-header {
13495 background: #2196f3;
13496}
13497.md .color-theme-blue .calendar-day.calendar-day-today .calendar-day-number,
13498.md .color-blue .calendar-day.calendar-day-today .calendar-day-number {
13499 color: #2196f3;
13500}
13501.md .color-theme-blue .calendar-day.calendar-day-selected .calendar-day-number,
13502.md .color-blue .calendar-day.calendar-day-selected .calendar-day-number {
13503 background: #2196f3;
13504 color: #fff;
13505}
13506.md .color-theme-blue .calendar-day.calendar-day-selected .calendar-day-number:after,
13507.md .color-blue .calendar-day.calendar-day-selected .calendar-day-number:after {
13508 background-color: #fff;
13509}
13510.md .color-theme-blue .calendar-day .calendar-day-event,
13511.md .color-blue .calendar-day .calendar-day-event {
13512 background: #2196f3;
13513}
13514.md .color-theme-pink .calendar-header,
13515.md .color-pink .calendar-header {
13516 background: #e91e63;
13517}
13518.md .color-theme-pink .calendar-day.calendar-day-today .calendar-day-number,
13519.md .color-pink .calendar-day.calendar-day-today .calendar-day-number {
13520 color: #e91e63;
13521}
13522.md .color-theme-pink .calendar-day.calendar-day-selected .calendar-day-number,
13523.md .color-pink .calendar-day.calendar-day-selected .calendar-day-number {
13524 background: #e91e63;
13525 color: #fff;
13526}
13527.md .color-theme-pink .calendar-day.calendar-day-selected .calendar-day-number:after,
13528.md .color-pink .calendar-day.calendar-day-selected .calendar-day-number:after {
13529 background-color: #fff;
13530}
13531.md .color-theme-pink .calendar-day .calendar-day-event,
13532.md .color-pink .calendar-day .calendar-day-event {
13533 background: #e91e63;
13534}
13535.md .color-theme-yellow .calendar-header,
13536.md .color-yellow .calendar-header {
13537 background: #ffeb3b;
13538}
13539.md .color-theme-yellow .calendar-day.calendar-day-today .calendar-day-number,
13540.md .color-yellow .calendar-day.calendar-day-today .calendar-day-number {
13541 color: #ffeb3b;
13542}
13543.md .color-theme-yellow .calendar-day.calendar-day-selected .calendar-day-number,
13544.md .color-yellow .calendar-day.calendar-day-selected .calendar-day-number {
13545 background: #ffeb3b;
13546 color: #fff;
13547}
13548.md .color-theme-yellow .calendar-day.calendar-day-selected .calendar-day-number:after,
13549.md .color-yellow .calendar-day.calendar-day-selected .calendar-day-number:after {
13550 background-color: #fff;
13551}
13552.md .color-theme-yellow .calendar-day .calendar-day-event,
13553.md .color-yellow .calendar-day .calendar-day-event {
13554 background: #ffeb3b;
13555}
13556.md .color-theme-orange .calendar-header,
13557.md .color-orange .calendar-header {
13558 background: #ff9800;
13559}
13560.md .color-theme-orange .calendar-day.calendar-day-today .calendar-day-number,
13561.md .color-orange .calendar-day.calendar-day-today .calendar-day-number {
13562 color: #ff9800;
13563}
13564.md .color-theme-orange .calendar-day.calendar-day-selected .calendar-day-number,
13565.md .color-orange .calendar-day.calendar-day-selected .calendar-day-number {
13566 background: #ff9800;
13567 color: #fff;
13568}
13569.md .color-theme-orange .calendar-day.calendar-day-selected .calendar-day-number:after,
13570.md .color-orange .calendar-day.calendar-day-selected .calendar-day-number:after {
13571 background-color: #fff;
13572}
13573.md .color-theme-orange .calendar-day .calendar-day-event,
13574.md .color-orange .calendar-day .calendar-day-event {
13575 background: #ff9800;
13576}
13577.md .color-theme-gray .calendar-header,
13578.md .color-gray .calendar-header {
13579 background: #9e9e9e;
13580}
13581.md .color-theme-gray .calendar-day.calendar-day-today .calendar-day-number,
13582.md .color-gray .calendar-day.calendar-day-today .calendar-day-number {
13583 color: #9e9e9e;
13584}
13585.md .color-theme-gray .calendar-day.calendar-day-selected .calendar-day-number,
13586.md .color-gray .calendar-day.calendar-day-selected .calendar-day-number {
13587 background: #9e9e9e;
13588 color: #fff;
13589}
13590.md .color-theme-gray .calendar-day.calendar-day-selected .calendar-day-number:after,
13591.md .color-gray .calendar-day.calendar-day-selected .calendar-day-number:after {
13592 background-color: #fff;
13593}
13594.md .color-theme-gray .calendar-day .calendar-day-event,
13595.md .color-gray .calendar-day .calendar-day-event {
13596 background: #9e9e9e;
13597}
13598.md .color-theme-white .calendar-header,
13599.md .color-white .calendar-header {
13600 background: #ffffff;
13601}
13602.md .color-theme-white .calendar-day.calendar-day-today .calendar-day-number,
13603.md .color-white .calendar-day.calendar-day-today .calendar-day-number {
13604 color: #ffffff;
13605}
13606.md .color-theme-white .calendar-day.calendar-day-selected .calendar-day-number,
13607.md .color-white .calendar-day.calendar-day-selected .calendar-day-number {
13608 background: #ffffff;
13609 color: #fff;
13610}
13611.md .color-theme-white .calendar-day.calendar-day-selected .calendar-day-number:after,
13612.md .color-white .calendar-day.calendar-day-selected .calendar-day-number:after {
13613 background-color: #fff;
13614}
13615.md .color-theme-white .calendar-day .calendar-day-event,
13616.md .color-white .calendar-day .calendar-day-event {
13617 background: #ffffff;
13618}
13619.md .color-theme-black .calendar-header,
13620.md .color-black .calendar-header {
13621 background: #000000;
13622}
13623.md .color-theme-black .calendar-day.calendar-day-today .calendar-day-number,
13624.md .color-black .calendar-day.calendar-day-today .calendar-day-number {
13625 color: #000000;
13626}
13627.md .color-theme-black .calendar-day.calendar-day-selected .calendar-day-number,
13628.md .color-black .calendar-day.calendar-day-selected .calendar-day-number {
13629 background: #000000;
13630 color: #fff;
13631}
13632.md .color-theme-black .calendar-day.calendar-day-selected .calendar-day-number:after,
13633.md .color-black .calendar-day.calendar-day-selected .calendar-day-number:after {
13634 background-color: #fff;
13635}
13636.md .color-theme-black .calendar-day .calendar-day-event,
13637.md .color-black .calendar-day .calendar-day-event {
13638 background: #000000;
13639}
13640/* === Picker === */
13641.picker {
13642 width: 100%;
13643 height: 260px;
13644}
13645.picker.picker-inline,
13646.popover .picker {
13647 height: 200px;
13648}
13649@media (orientation: landscape) and (max-height: 415px) {
13650 .picker:not(.picker-inline) {
13651 height: 200px;
13652 }
13653}
13654.picker-popover {
13655 width: 280px;
13656}
13657.picker-columns {
13658 display: -webkit-box;
13659 display: -webkit-flex;
13660 display: -ms-flexbox;
13661 display: flex;
13662 overflow: hidden;
13663 -webkit-box-pack: center;
13664 -webkit-justify-content: center;
13665 -ms-flex-pack: center;
13666 justify-content: center;
13667 padding: 0;
13668 text-align: right;
13669 height: 100%;
13670 position: relative;
13671 -webkit-mask-box-image: linear-gradient(to top, transparent, transparent 5%, white 20%, white 80%, transparent 95%, transparent);
13672}
13673.picker-column {
13674 position: relative;
13675 max-height: 100%;
13676}
13677.picker-column.picker-column-first:before,
13678.picker-column.picker-column-last:after {
13679 height: 100%;
13680 width: 100vw;
13681 position: absolute;
13682 content: '';
13683 top: 0;
13684}
13685.picker-column.picker-column-first:before {
13686 right: 100%;
13687}
13688.picker-column.picker-column-last:after {
13689 left: 100%;
13690}
13691.picker-column.picker-column-left {
13692 text-align: left;
13693}
13694.picker-column.picker-column-center {
13695 text-align: center;
13696}
13697.picker-column.picker-column-right {
13698 text-align: right;
13699}
13700.picker-column.picker-column-divider {
13701 display: -webkit-box;
13702 display: -webkit-flex;
13703 display: -ms-flexbox;
13704 display: flex;
13705 -webkit-box-align: center;
13706 -webkit-align-items: center;
13707 -ms-flex-align: center;
13708 align-items: center;
13709}
13710.picker-items {
13711 -webkit-transition: 300ms;
13712 transition: 300ms;
13713 -webkit-transition-timing-function: ease-out;
13714 transition-timing-function: ease-out;
13715}
13716.picker-item {
13717 height: 36px;
13718 line-height: 36px;
13719 white-space: nowrap;
13720 position: relative;
13721 overflow: hidden;
13722 text-overflow: ellipsis;
13723 left: 0;
13724 top: 0;
13725 width: 100%;
13726 -webkit-box-sizing: border-box;
13727 box-sizing: border-box;
13728 -webkit-transition: 300ms;
13729 transition: 300ms;
13730}
13731.picker-item span {
13732 padding: 0 10px;
13733}
13734.picker-column-absolute .picker-item {
13735 position: absolute;
13736}
13737.picker-item.picker-item-far {
13738 pointer-events: none;
13739}
13740.picker-item.picker-item-selected {
13741 -webkit-transform: translate3d(0, 0, 0) rotateX(0deg);
13742 transform: translate3d(0, 0, 0) rotateX(0deg);
13743}
13744.picker-center-highlight {
13745 height: 36px;
13746 -webkit-box-sizing: border-box;
13747 box-sizing: border-box;
13748 position: absolute;
13749 left: 0;
13750 width: 100%;
13751 top: 50%;
13752 margin-top: -18px;
13753 pointer-events: none;
13754}
13755.picker-3d .picker-columns {
13756 overflow: hidden;
13757 -webkit-perspective: 1200px;
13758 perspective: 1200px;
13759}
13760.picker-3d .picker-column,
13761.picker-3d .picker-items,
13762.picker-3d .picker-item {
13763 -webkit-transform-style: preserve-3d;
13764 transform-style: preserve-3d;
13765}
13766.picker-3d .picker-column {
13767 overflow: visible;
13768}
13769.picker-3d .picker-item {
13770 -webkit-transform-origin: center center -110px;
13771 transform-origin: center center -110px;
13772 -webkit-backface-visibility: hidden;
13773 backface-visibility: hidden;
13774 -webkit-transition-timing-function: ease-out;
13775 transition-timing-function: ease-out;
13776}
13777.md .picker-popover .toolbar {
13778 border-radius: 2px 2px 0 0;
13779}
13780.md .picker-columns {
13781 font-size: 20px;
13782}
13783.md .picker-column-divider {
13784 color: rgba(0, 0, 0, 0.87);
13785}
13786.md .picker-popover .picker > .toolbar + .picker-columns {
13787 height: calc(100% - 48px);
13788}
13789.md .picker-center-highlight:before {
13790 content: '';
13791 position: absolute;
13792 background-color: rgba(0, 0, 0, 0.15);
13793 display: block;
13794 z-index: 15;
13795 top: 0;
13796 right: auto;
13797 bottom: auto;
13798 left: 0;
13799 height: 1px;
13800 width: 100%;
13801 -webkit-transform-origin: 50% 0%;
13802 transform-origin: 50% 0%;
13803}
13804.md.device-pixel-ratio-2 .picker-center-highlight:before {
13805 -webkit-transform: scaleY(0.5);
13806 transform: scaleY(0.5);
13807}
13808.md.device-pixel-ratio-3 .picker-center-highlight:before {
13809 -webkit-transform: scaleY(0.33);
13810 transform: scaleY(0.33);
13811}
13812.md .picker-center-highlight:after {
13813 content: '';
13814 position: absolute;
13815 background-color: rgba(0, 0, 0, 0.15);
13816 display: block;
13817 z-index: 15;
13818 top: auto;
13819 right: auto;
13820 bottom: 0;
13821 left: 0;
13822 height: 1px;
13823 width: 100%;
13824 -webkit-transform-origin: 50% 100%;
13825 transform-origin: 50% 100%;
13826}
13827.md.device-pixel-ratio-2 .picker-center-highlight:after {
13828 -webkit-transform: scaleY(0.5);
13829 transform: scaleY(0.5);
13830}
13831.md.device-pixel-ratio-3 .picker-center-highlight:after {
13832 -webkit-transform: scaleY(0.33);
13833 transform: scaleY(0.33);
13834}
13835.md .theme-dark .picker-column-divider {
13836 color: rgba(255, 255, 255, 0.87);
13837}
13838.md .theme-dark .picker-center-highlight:before {
13839 background-color: rgba(255, 255, 255, 0.15);
13840}
13841.md .theme-dark .picker-center-highlight:after {
13842 background-color: rgba(255, 255, 255, 0.15);
13843}
13844/* === Infinite === */
13845.infinite-scroll-preloader {
13846 margin-left: auto;
13847 margin-right: auto;
13848 text-align: center;
13849}
13850.infinite-scroll-preloader.preloader {
13851 display: block;
13852}
13853.md .infinite-scroll-preloader {
13854 margin-top: 32px;
13855 margin-bottom: 32px;
13856}
13857/* === PTR === */
13858.ptr-preloader .preloader {
13859 position: absolute;
13860 left: 50%;
13861}
13862.md .ptr-preloader {
13863 position: absolute;
13864 left: 50%;
13865 top: 16px;
13866 width: 40px;
13867 height: 40px;
13868 border-radius: 50%;
13869 background: #fff;
13870 margin-left: -20px;
13871 margin-top: -7px;
13872 z-index: 100;
13873 -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
13874 box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
13875}
13876@media (min-width: 768px) {
13877 .md .ptr-preloader {
13878 top: 24px;
13879 }
13880}
13881.md .ptr-preloader .preloader {
13882 width: 22px;
13883 height: 22px;
13884 margin-left: -11px;
13885 margin-top: -11px;
13886 top: 50%;
13887 visibility: hidden;
13888}
13889.md .ptr-preloader .preloader .preloader-inner-gap,
13890.md .ptr-preloader .preloader .preloader-inner-half-circle {
13891 border-width: 3px;
13892}
13893.md .ptr-arrow {
13894 width: 22px;
13895 height: 22px;
13896 -webkit-box-sizing: border-box;
13897 box-sizing: border-box;
13898 border: 3px solid #757575;
13899 position: absolute;
13900 left: 50%;
13901 top: 50%;
13902 margin-left: -11px;
13903 margin-top: -11px;
13904 border-left-color: transparent;
13905 border-radius: 50%;
13906 opacity: 1;
13907 -webkit-transform: rotate(150deg);
13908 transform: rotate(150deg);
13909}
13910.md .ptr-arrow:after {
13911 content: '';
13912 width: 0px;
13913 height: 0px;
13914 position: absolute;
13915 left: -5px;
13916 bottom: 0px;
13917 border-bottom-width: 6px;
13918 border-bottom-style: solid;
13919 border-bottom-color: inherit;
13920 border-left: 5px solid transparent;
13921 border-right: 5px solid transparent;
13922 -webkit-transform: rotate(-40deg);
13923 transform: rotate(-40deg);
13924}
13925.md .ptr-content:not(.ptr-refreshing):not(.ptr-pull-up) .ptr-preloader .preloader,
13926.md .ptr-content:not(.ptr-refreshing):not(.ptr-pull-up) .ptr-preloader .preloader * {
13927 -webkit-animation: none;
13928 animation: none;
13929}
13930.md .ptr-refreshing .ptr-preloader .preloader,
13931.md .ptr-pull-up .ptr-preloader .preloader {
13932 visibility: visible;
13933}
13934.md .ptr-refreshing .ptr-arrow,
13935.md .ptr-pull-up .ptr-arrow {
13936 visibility: hidden;
13937}
13938.md .ptr-refreshing .ptr-preloader {
13939 -webkit-transform: translate3d(0, 66px, 0);
13940 transform: translate3d(0, 66px, 0);
13941}
13942.md .ptr-transitioning .ptr-arrow {
13943 -webkit-transition: 300ms;
13944 transition: 300ms;
13945}
13946.md .ptr-pull-up .ptr-arrow {
13947 -webkit-transition: 400ms;
13948 transition: 400ms;
13949 -webkit-transform: rotate(620deg) !important;
13950 transform: rotate(620deg) !important;
13951 opacity: 0;
13952}
13953.md .ptr-transitioning .ptr-preloader,
13954.md .ptr-refreshing .ptr-preloader {
13955 -webkit-transition-duration: 300ms;
13956 transition-duration: 300ms;
13957 -webkit-transition-property: -webkit-transform;
13958 transition-property: -webkit-transform;
13959 transition-property: transform;
13960 transition-property: transform, -webkit-transform;
13961}
13962.md .ptr-no-navbar .ptr-preloader {
13963 top: auto;
13964 bottom: 100%;
13965 margin-bottom: 7px;
13966}
13967.md .page-with-subnavbar .ptr-preloader,
13968.md .toolbar:not(.toolbar-bottom-md) ~ .ptr-content .ptr-preloader,
13969.md .searchbar ~ .ptr-content .ptr-preloader {
13970 top: 64px;
13971}
13972@media (min-width: 768px) {
13973 .md .page-with-subnavbar .ptr-preloader,
13974 .md .toolbar:not(.toolbar-bottom-md) ~ .ptr-content .ptr-preloader,
13975 .md .searchbar ~ .ptr-content .ptr-preloader {
13976 top: 72px;
13977 }
13978}
13979/* === Images Lazy Loading === */
13980.lazy-loaded.lazy-fade-in {
13981 -webkit-animation: lazyFadeIn 600ms;
13982 animation: lazyFadeIn 600ms;
13983}
13984@-webkit-keyframes lazyFadeIn {
13985 from {
13986 opacity: 0;
13987 }
13988 to {
13989 opacity: 1;
13990 }
13991}
13992@keyframes lazyFadeIn {
13993 from {
13994 opacity: 0;
13995 }
13996 to {
13997 opacity: 1;
13998 }
13999}
14000/* === Data Table === */
14001.data-table {
14002 overflow-x: auto;
14003}
14004.data-table table {
14005 width: 100%;
14006 border: none;
14007 padding: 0;
14008 margin: 0;
14009 border-collapse: collapse;
14010 text-align: left;
14011}
14012.data-table thead {
14013 font-size: 12px;
14014}
14015.data-table thead th,
14016.data-table thead td {
14017 overflow: hidden;
14018 white-space: nowrap;
14019 text-overflow: ellipsis;
14020 line-height: 16px;
14021}
14022.data-table thead i.icon,
14023.data-table thead i.f7-icons,
14024.data-table thead i.material-icons {
14025 vertical-align: top;
14026}
14027.data-table th,
14028.data-table td {
14029 padding: 0;
14030 position: relative;
14031}
14032.data-table th.numeric-cell,
14033.data-table td.numeric-cell {
14034 text-align: right;
14035}
14036.data-table th.checkbox-cell,
14037.data-table td.checkbox-cell {
14038 overflow: visible;
14039}
14040.data-table th.checkbox-cell label + span,
14041.data-table td.checkbox-cell label + span {
14042 margin-left: 8px;
14043}
14044.data-table th.actions-cell,
14045.data-table td.actions-cell {
14046 text-align: right;
14047 white-space: nowrap;
14048}
14049.data-table th a.icon-only,
14050.data-table td a.icon-only,
14051.card .data-table th a.icon-only,
14052.card .data-table td a.icon-only,
14053.card.data-table th a.icon-only,
14054.card.data-table td a.icon-only {
14055 display: inline-block;
14056 vertical-align: middle;
14057 text-align: center;
14058 font-size: 0;
14059 min-width: 0;
14060}
14061.data-table th a.icon-only i,
14062.data-table td a.icon-only i,
14063.card .data-table th a.icon-only i,
14064.card .data-table td a.icon-only i,
14065.card.data-table th a.icon-only i,
14066.card.data-table td a.icon-only i {
14067 font-size: 18px;
14068 vertical-align: middle;
14069}
14070.data-table .sortable-cell:not(.input-cell) {
14071 cursor: pointer;
14072 position: relative;
14073}
14074.data-table .sortable-cell.input-cell .table-head-label {
14075 cursor: pointer;
14076 position: relative;
14077}
14078.data-table .sortable-cell:not(.numeric-cell):not(.input-cell):after,
14079.data-table .sortable-cell.numeric-cell:not(.input-cell):before,
14080.data-table .sortable-cell:not(.numeric-cell).input-cell > .table-head-label:after,
14081.data-table .sortable-cell.numeric-cell.input-cell > .table-head-label:before {
14082 content: '';
14083 display: inline-block;
14084 vertical-align: top;
14085 width: 16px;
14086 height: 16px;
14087 background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20fill%3D'%23000000'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%20width%3D'24'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%3Cpath%20d%3D'M0%200h24v24H0V0z'%20fill%3D'none'%2F%3E%3Cpath%20d%3D'M20%2012l-1.41-1.41L13%2016.17V4h-2v12.17l-5.58-5.59L4%2012l8%208%208-8z'%20fill%3D'%23000000'%2F%3E%3C%2Fsvg%3E");
14088 background-size: 100% auto;
14089 background-position: center;
14090 background-repeat: no-repeat;
14091 font-size: 0;
14092 -webkit-transition-duration: 300ms;
14093 transition-duration: 300ms;
14094 -webkit-transform: rotate(0);
14095 transform: rotate(0);
14096 opacity: 0;
14097}
14098html.device-desktop .data-table .sortable-cell:not(.sortable-cell-active):hover:after,
14099html.device-desktop .data-table .sortable-cell:not(.sortable-cell-active) .table-head-label:hover:after,
14100html.device-desktop .data-table .sortable-cell:not(.sortable-cell-active):hover:before,
14101html.device-desktop .data-table .sortable-cell:not(.sortable-cell-active) .table-head-label:hover:before {
14102 opacity: 0.54;
14103}
14104.data-table .sortable-cell.sortable-cell-active:after,
14105.data-table .sortable-cell.sortable-cell-active .table-head-label:after,
14106.data-table .sortable-cell.sortable-cell-active:before,
14107.data-table .sortable-cell.sortable-cell-active .table-head-label:before {
14108 opacity: 0.87 !important;
14109}
14110.data-table .sortable-cell.sortable-desc:after,
14111.data-table .sortable-cell.sortable-desc:after,
14112.data-table .table-head-label:after,
14113.data-table .sortable-cell.sortable-desc:before,
14114.data-table .sortable-cell.sortable-desc:before,
14115.data-table .table-head-label:before {
14116 -webkit-transform: rotate(180deg) !important;
14117 transform: rotate(180deg) !important;
14118}
14119.data-table.card .card-header,
14120.card .data-table .card-header {
14121 height: 64px;
14122}
14123.data-table.card .card-content,
14124.card .data-table .card-content {
14125 overflow-x: auto;
14126}
14127.data-table .data-table-links,
14128.data-table .data-table-actions {
14129 display: -webkit-box;
14130 display: -webkit-flex;
14131 display: -ms-flexbox;
14132 display: flex;
14133}
14134.data-table .data-table-actions {
14135 margin-left: auto;
14136 -webkit-box-align: center;
14137 -webkit-align-items: center;
14138 -ms-flex-align: center;
14139 align-items: center;
14140}
14141.data-table .data-table-actions a.link {
14142 min-width: 0;
14143}
14144.data-table .data-table-actions a.link.icon-only {
14145 line-height: 1;
14146 -webkit-box-pack: center;
14147 -webkit-justify-content: center;
14148 -ms-flex-pack: center;
14149 justify-content: center;
14150 padding: 0;
14151}
14152.data-table .data-table-header,
14153.data-table .data-table-header-selected {
14154 display: -webkit-box;
14155 display: -webkit-flex;
14156 display: -ms-flexbox;
14157 display: flex;
14158 -webkit-box-pack: justify;
14159 -webkit-justify-content: space-between;
14160 -ms-flex-pack: justify;
14161 justify-content: space-between;
14162 -webkit-box-align: center;
14163 -webkit-align-items: center;
14164 -ms-flex-align: center;
14165 align-items: center;
14166 width: 100%;
14167}
14168.data-table .data-table-header-selected {
14169 display: none;
14170}
14171.data-table.data-table-has-checked .data-table-header {
14172 display: none;
14173}
14174.data-table.data-table-has-checked .data-table-header-selected {
14175 display: -webkit-box;
14176 display: -webkit-flex;
14177 display: -ms-flexbox;
14178 display: flex;
14179}
14180.data-table .data-table-title-selected {
14181 font-size: 14px;
14182}
14183.data-table .data-table-footer {
14184 display: -webkit-box;
14185 display: -webkit-flex;
14186 display: -ms-flexbox;
14187 display: flex;
14188 -webkit-box-align: center;
14189 -webkit-align-items: center;
14190 -ms-flex-align: center;
14191 align-items: center;
14192 -webkit-box-sizing: border-box;
14193 box-sizing: border-box;
14194 position: relative;
14195 font-size: 12px;
14196 overflow: hidden;
14197 -webkit-box-pack: end;
14198 -webkit-justify-content: flex-end;
14199 -ms-flex-pack: end;
14200 justify-content: flex-end;
14201}
14202.data-table .data-table-rows-select,
14203.data-table .data-table-pagination {
14204 display: -webkit-box;
14205 display: -webkit-flex;
14206 display: -ms-flexbox;
14207 display: flex;
14208 -webkit-box-align: center;
14209 -webkit-align-items: center;
14210 -ms-flex-align: center;
14211 align-items: center;
14212}
14213@media (max-width: 480px) and (orientation: portrait) {
14214 .data-table.data-table-collapsible thead {
14215 display: none;
14216 }
14217 .data-table.data-table-collapsible tbody,
14218 .data-table.data-table-collapsible tr,
14219 .data-table.data-table-collapsible td {
14220 display: block;
14221 }
14222 .data-table.data-table-collapsible tr {
14223 position: relative;
14224 }
14225 .data-table.data-table-collapsible tr:hover {
14226 background-color: inherit;
14227 }
14228 .data-table.data-table-collapsible td {
14229 display: -webkit-box;
14230 display: -webkit-flex;
14231 display: -ms-flexbox;
14232 display: flex;
14233 -webkit-align-content: center;
14234 -ms-flex-line-pack: center;
14235 align-content: center;
14236 -webkit-box-align: center;
14237 -webkit-align-items: center;
14238 -ms-flex-align: center;
14239 align-items: center;
14240 -webkit-box-pack: start;
14241 -webkit-justify-content: flex-start;
14242 -ms-flex-pack: start;
14243 justify-content: flex-start;
14244 text-align: left;
14245 }
14246 .data-table.data-table-collapsible td:before {
14247 display: none !important;
14248 }
14249 .data-table.data-table-collapsible td:not(.checkbox-cell):before {
14250 width: 40%;
14251 display: block !important;
14252 content: attr(data-collapsible-title);
14253 position: relative;
14254 height: auto;
14255 background: none !important;
14256 -webkit-transform: none !important;
14257 transform: none !important;
14258 font-size: 12px;
14259 margin-right: 16px;
14260 -webkit-flex-shrink: 0;
14261 -ms-flex-negative: 0;
14262 flex-shrink: 0;
14263 }
14264 .data-table.data-table-collapsible td.checkbox-cell {
14265 position: absolute;
14266 top: 0;
14267 left: 0;
14268 }
14269 .data-table.data-table-collapsible td.checkbox-cell + td {
14270 padding-left: 16px;
14271 }
14272 .data-table.data-table-collapsible td.checkbox-cell ~ td {
14273 margin-left: 32px;
14274 }
14275}
14276.data-table .tablet-only,
14277.data-table .tablet-landscape-only {
14278 display: none;
14279}
14280@media (min-width: 768px) {
14281 .data-table .tablet-only {
14282 display: table-cell;
14283 }
14284}
14285@media (min-width: 768px) and (orientation: landscape) {
14286 .data-table .tablet-landscape-only {
14287 display: table-cell;
14288 }
14289}
14290.theme-dark .data-table .sortable-cell:not(.numeric-cell):not(.input-cell):after,
14291.theme-dark .data-table .sortable-cell.numeric-cell:not(.input-cell):before,
14292.theme-dark .data-table .sortable-cell:not(.numeric-cell).input-cell > .table-head-label:after,
14293.theme-dark .data-table .sortable-cell.numeric-cell.input-cell > .table-head-label:before {
14294 background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20fill%3D'%23fff'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%20width%3D'24'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%3Cpath%20d%3D'M0%200h24v24H0V0z'%20fill%3D'none'%2F%3E%3Cpath%20d%3D'M20%2012l-1.41-1.41L13%2016.17V4h-2v12.17l-5.58-5.59L4%2012l8%208%208-8z'%20fill%3D'%23fff'%2F%3E%3C%2Fsvg%3E");
14295}
14296.md .data-table thead th,
14297.md .data-table thead td {
14298 font-weight: 500;
14299 height: 56px;
14300 -webkit-box-sizing: border-box;
14301 box-sizing: border-box;
14302}
14303.md .data-table thead th:not(.sortable-cell-active),
14304.md .data-table thead td:not(.sortable-cell-active) {
14305 color: rgba(0, 0, 0, 0.54);
14306}
14307.md .data-table thead i.icon,
14308.md .data-table thead i.material-icons {
14309 font-size: 16px;
14310 width: 16px;
14311 height: 16px;
14312}
14313.md .data-table tbody {
14314 font-size: 13px;
14315}
14316.md .data-table tbody tr.data-table-row-selected {
14317 background: #f5f5f5;
14318}
14319.md .data-table tbody td {
14320 height: 48px;
14321}
14322.md .data-table th,
14323.md .data-table td {
14324 padding-left: 28px;
14325 padding-right: 28px;
14326}
14327.md .data-table th.label-cell,
14328.md .data-table td.label-cell {
14329 padding-left: 24px;
14330 padding-right: 24px;
14331}
14332.md .data-table th:first-child,
14333.md .data-table td:first-child {
14334 padding-left: 24px;
14335}
14336.md .data-table th:last-child,
14337.md .data-table td:last-child {
14338 padding-right: 24px;
14339}
14340.md .data-table th.checkbox-cell,
14341.md .data-table td.checkbox-cell {
14342 width: 18px;
14343 padding-left: 24px;
14344 padding-right: 12px;
14345}
14346.md .data-table th.checkbox-cell + td,
14347.md .data-table td.checkbox-cell + td,
14348.md .data-table th.checkbox-cell + th,
14349.md .data-table td.checkbox-cell + th {
14350 padding-left: 12px;
14351}
14352.md .data-table th.actions-cell a.link,
14353.md .data-table td.actions-cell a.link {
14354 color: rgba(0, 0, 0, 0.54);
14355}
14356.md .data-table th.actions-cell a.link + a.link,
14357.md .data-table td.actions-cell a.link + a.link {
14358 margin-left: 24px;
14359}
14360.md .data-table th.actions-cell a.icon-only,
14361.md .data-table td.actions-cell a.icon-only {
14362 width: 24px;
14363 height: 24px;
14364 line-height: 24px;
14365}
14366.md .sortable-cell:not(.numeric-cell):after {
14367 margin-left: 8px;
14368}
14369.md .sortable-cell.numeric-cell:before {
14370 margin-right: 8px;
14371}
14372.md .data-table.card .card-header,
14373.md .card .data-table .card-header,
14374.md .data-table.card .card-footer,
14375.md .card .data-table .card-footer {
14376 padding-left: 24px;
14377 padding-right: 14px;
14378}
14379.md .data-table.card .card-footer,
14380.md .card .data-table .card-footer {
14381 height: 56px;
14382}
14383.md .data-table-title {
14384 font-size: 20px;
14385}
14386.md .data-table-links a.link + a.link,
14387.md .data-table-actions a.link + a.link {
14388 margin-left: 24px;
14389}
14390.md .data-table-actions a.link {
14391 color: rgba(0, 0, 0, 0.54);
14392}
14393.md .data-table-actions a.link.icon-only {
14394 width: 24px;
14395 height: 24px;
14396 overflow: visible;
14397}
14398.md .data-table-actions a.link.icon-only.active-state {
14399 background: none;
14400}
14401.md .data-table .card-header > .data-table-header,
14402.md .data-table .card-header > .data-table-header-selected {
14403 padding-left: 24px;
14404 padding-right: 14px;
14405 margin-left: -24px;
14406 margin-right: -14px;
14407 padding-top: 4px;
14408 padding-bottom: 4px;
14409 height: 100%;
14410}
14411.md .data-table-header-selected {
14412 background: rgba(33, 150, 243, 0.1);
14413}
14414.md .data-table-title-selected {
14415 color: #2196f3;
14416}
14417.md .data-table tbody td:before {
14418 content: '';
14419 position: absolute;
14420 background-color: rgba(0, 0, 0, 0.12);
14421 display: block;
14422 z-index: 15;
14423 top: 0;
14424 right: auto;
14425 bottom: auto;
14426 left: 0;
14427 height: 1px;
14428 width: 100%;
14429 -webkit-transform-origin: 50% 0%;
14430 transform-origin: 50% 0%;
14431}
14432.md.device-pixel-ratio-2 .data-table tbody td:before {
14433 -webkit-transform: scaleY(0.5);
14434 transform: scaleY(0.5);
14435}
14436.md.device-pixel-ratio-3 .data-table tbody td:before {
14437 -webkit-transform: scaleY(0.33);
14438 transform: scaleY(0.33);
14439}
14440.md.device-desktop .data-table tbody tr:hover {
14441 background: #f5f5f5;
14442}
14443.md .data-table-footer {
14444 height: 56px;
14445 color: rgba(0, 0, 0, 0.54);
14446}
14447.md .data-table-rows-select a.link,
14448.md .data-table-pagination a.link {
14449 width: 48px;
14450 height: 48px;
14451}
14452.md .data-table-rows-select a.link:before,
14453.md .data-table-pagination a.link:before {
14454 content: '';
14455 width: 152%;
14456 height: 152%;
14457 position: absolute;
14458 left: -26%;
14459 top: -26%;
14460 background-image: -webkit-radial-gradient(center, circle, rgba(0, 0, 0, 0.1) 66%, rgba(0, 0, 0, 0) 66%);
14461 background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0.1) 66%, rgba(0, 0, 0, 0) 66%);
14462 background-repeat: no-repeat;
14463 background-position: center;
14464 background-size: 100% 100%;
14465 opacity: 0;
14466 pointer-events: none;
14467 -webkit-transition-duration: 600ms;
14468 transition-duration: 600ms;
14469}
14470.md .data-table-rows-select a.link.active-state:before,
14471.md .data-table-pagination a.link.active-state:before {
14472 opacity: 1;
14473 -webkit-transition-duration: 150ms;
14474 transition-duration: 150ms;
14475}
14476.md .data-table-rows-select + .data-table-pagination {
14477 margin-left: 32px;
14478}
14479.md .data-table-rows-select .input {
14480 margin-left: 24px;
14481}
14482.md .data-table-pagination-label {
14483 margin-right: 20px;
14484}
14485.md .data-table-footer:before {
14486 content: '';
14487 position: absolute;
14488 background-color: rgba(0, 0, 0, 0.12);
14489 display: block;
14490 z-index: 15;
14491 top: 0;
14492 right: auto;
14493 bottom: auto;
14494 left: 0;
14495 height: 1px;
14496 width: 100%;
14497 -webkit-transform-origin: 50% 0%;
14498 transform-origin: 50% 0%;
14499}
14500.md.device-pixel-ratio-2 .data-table-footer:before {
14501 -webkit-transform: scaleY(0.5);
14502 transform: scaleY(0.5);
14503}
14504.md.device-pixel-ratio-3 .data-table-footer:before {
14505 -webkit-transform: scaleY(0.33);
14506 transform: scaleY(0.33);
14507}
14508.md .input-cell {
14509 padding-top: 8px;
14510 padding-bottom: 8px;
14511 height: auto;
14512 vertical-align: top;
14513}
14514.md .input-cell .table-head-label + .input {
14515 margin-top: 4px;
14516}
14517.md .input-cell .input {
14518 height: 24px;
14519}
14520.md .input-cell .input input,
14521.md .input-cell .input textarea,
14522.md .input-cell .input select {
14523 height: 24px;
14524 color: #212121;
14525 font-size: 14px;
14526}
14527.md .input-cell .input .input-clear-button {
14528 -webkit-transform: scale(0.8);
14529 transform: scale(0.8);
14530}
14531@media (max-width: 480px) and (orientation: portrait) {
14532 .md .data-table.data-table-collapsible td {
14533 padding-left: 16px;
14534 padding-right: 16px;
14535 }
14536 .md .data-table.data-table-collapsible td:not(.checkbox-cell):before {
14537 color: rgba(0, 0, 0, 0.54);
14538 font-weight: 500;
14539 line-height: 16px;
14540 }
14541 .md .data-table-collapsible tr:before {
14542 content: '';
14543 position: absolute;
14544 background-color: rgba(0, 0, 0, 0.12);
14545 display: block;
14546 z-index: 15;
14547 top: 0;
14548 right: auto;
14549 bottom: auto;
14550 left: 0;
14551 height: 1px;
14552 width: 100%;
14553 -webkit-transform-origin: 50% 0%;
14554 transform-origin: 50% 0%;
14555 }
14556 .md.device-pixel-ratio-2 .data-table-collapsible tr:before {
14557 -webkit-transform: scaleY(0.5);
14558 transform: scaleY(0.5);
14559 }
14560 .md.device-pixel-ratio-3 .data-table-collapsible tr:before {
14561 -webkit-transform: scaleY(0.33);
14562 transform: scaleY(0.33);
14563 }
14564}
14565.md .theme-dark .data-table thead th:not(.sortable-cell-active),
14566.data-table.md .theme-dark thead th:not(.sortable-cell-active),
14567.md .theme-dark .data-table thead td:not(.sortable-cell-active),
14568.data-table.md .theme-dark thead td:not(.sortable-cell-active),
14569.md .theme-dark .data-table .data-table-actions a.link,
14570.data-table.md .theme-dark .data-table-actions a.link,
14571.md .theme-dark .data-table td.actions-cell a.link,
14572.data-table.md .theme-dark td.actions-cell a.link,
14573.md .theme-dark .data-table th.actions-cell a.link,
14574.data-table.md .theme-dark th.actions-cell a.link {
14575 color: rgba(255, 255, 255, 0.54);
14576}
14577.md .theme-dark .data-table .data-table-links a.link:before,
14578.data-table.md .theme-dark .data-table-links a.link:before {
14579 content: '';
14580 width: 152%;
14581 height: 152%;
14582 position: absolute;
14583 left: -26%;
14584 top: -26%;
14585 background-image: -webkit-radial-gradient(center, circle, rgba(255, 255, 255, 0.15) 66%, rgba(255, 255, 255, 0) 66%);
14586 background-image: radial-gradient(circle at center, rgba(255, 255, 255, 0.15) 66%, rgba(255, 255, 255, 0) 66%);
14587 background-repeat: no-repeat;
14588 background-position: center;
14589 background-size: 100% 100%;
14590 opacity: 0;
14591 pointer-events: none;
14592 -webkit-transition-duration: 600ms;
14593 transition-duration: 600ms;
14594}
14595.md .theme-dark .data-table .data-table-links a.link.active-state:before,
14596.data-table.md .theme-dark .data-table-links a.link.active-state:before {
14597 opacity: 1;
14598 -webkit-transition-duration: 150ms;
14599 transition-duration: 150ms;
14600}
14601.md .theme-dark .data-table tbody td:before,
14602.data-table.md .theme-dark tbody td:before {
14603 background-color: rgba(255, 255, 255, 0.08);
14604}
14605.md .theme-dark .data-table.data-table-collapsible tr:before,
14606.data-table.md .theme-dark.data-table-collapsible tr:before {
14607 background-color: rgba(255, 255, 255, 0.08);
14608}
14609.md .theme-dark .data-table tbody tr.data-table-row-selected,
14610.data-table.md .theme-dark tbody tr.data-table-row-selected {
14611 background-color: rgba(255, 255, 255, 0.05);
14612}
14613.md.device-desktop .theme-dark .data-table tbody tr:hover,
14614.md.device-desktop .theme-dark.data-table tbody tr:hover {
14615 background-color: rgba(255, 255, 255, 0.05);
14616}
14617.md .color-theme-red .data-table-header-selected,
14618.md .data-table-header-selected.color-red {
14619 background: rgba(244, 67, 54, 0.1);
14620}
14621.md .color-theme-red .data-table-title-selected,
14622.md .color-red .data-table-title-selected {
14623 color: #f44336;
14624}
14625.md .color-theme-green .data-table-header-selected,
14626.md .data-table-header-selected.color-green {
14627 background: rgba(76, 175, 80, 0.1);
14628}
14629.md .color-theme-green .data-table-title-selected,
14630.md .color-green .data-table-title-selected {
14631 color: #4caf50;
14632}
14633.md .color-theme-blue .data-table-header-selected,
14634.md .data-table-header-selected.color-blue {
14635 background: rgba(33, 150, 243, 0.1);
14636}
14637.md .color-theme-blue .data-table-title-selected,
14638.md .color-blue .data-table-title-selected {
14639 color: #2196f3;
14640}
14641.md .color-theme-pink .data-table-header-selected,
14642.md .data-table-header-selected.color-pink {
14643 background: rgba(233, 30, 99, 0.1);
14644}
14645.md .color-theme-pink .data-table-title-selected,
14646.md .color-pink .data-table-title-selected {
14647 color: #e91e63;
14648}
14649.md .color-theme-yellow .data-table-header-selected,
14650.md .data-table-header-selected.color-yellow {
14651 background: rgba(255, 235, 59, 0.1);
14652}
14653.md .color-theme-yellow .data-table-title-selected,
14654.md .color-yellow .data-table-title-selected {
14655 color: #ffeb3b;
14656}
14657.md .color-theme-orange .data-table-header-selected,
14658.md .data-table-header-selected.color-orange {
14659 background: rgba(255, 152, 0, 0.1);
14660}
14661.md .color-theme-orange .data-table-title-selected,
14662.md .color-orange .data-table-title-selected {
14663 color: #ff9800;
14664}
14665.md .color-theme-gray .data-table-header-selected,
14666.md .data-table-header-selected.color-gray {
14667 background: rgba(158, 158, 158, 0.1);
14668}
14669.md .color-theme-gray .data-table-title-selected,
14670.md .color-gray .data-table-title-selected {
14671 color: #9e9e9e;
14672}
14673.md .color-theme-white .data-table-header-selected,
14674.md .data-table-header-selected.color-white {
14675 background: rgba(255, 255, 255, 0.1);
14676}
14677.md .color-theme-white .data-table-title-selected,
14678.md .color-white .data-table-title-selected {
14679 color: #ffffff;
14680}
14681.md .color-theme-black .data-table-header-selected,
14682.md .data-table-header-selected.color-black {
14683 background: rgba(0, 0, 0, 0.1);
14684}
14685.md .color-theme-black .data-table-title-selected,
14686.md .color-black .data-table-title-selected {
14687 color: #000000;
14688}
14689/* === FAB === */
14690.fab {
14691 position: absolute;
14692 z-index: 1500;
14693}
14694.fab > a,
14695.fab-buttons a {
14696 position: relative;
14697 -webkit-transition-duration: 300ms;
14698 transition-duration: 300ms;
14699 display: -webkit-box;
14700 display: -webkit-flex;
14701 display: -ms-flexbox;
14702 display: flex;
14703 -webkit-box-align: center;
14704 -webkit-align-items: center;
14705 -ms-flex-align: center;
14706 align-items: center;
14707 -webkit-box-pack: center;
14708 -webkit-justify-content: center;
14709 -ms-flex-pack: center;
14710 justify-content: center;
14711 overflow: hidden;
14712 z-index: 1;
14713}
14714.fab > a i {
14715 position: absolute;
14716 left: 50%;
14717 top: 50%;
14718 -webkit-transform: translate3d(-50%, -50%, 0) rotate(0deg) scale(1);
14719 transform: translate3d(-50%, -50%, 0) rotate(0deg) scale(1);
14720 -webkit-transition: 300ms;
14721 transition: 300ms;
14722}
14723.fab > a i + i {
14724 -webkit-transform: translate3d(-50%, -50%, 0) rotate(-90deg) scale(0.5);
14725 transform: translate3d(-50%, -50%, 0) rotate(-90deg) scale(0.5);
14726 opacity: 0;
14727}
14728.fab[class*="fab-center"] {
14729 left: 50%;
14730 -webkit-transform: translateX(-50%);
14731 transform: translateX(-50%);
14732}
14733.fab[class*="left-center"],
14734.fab[class*="right-center"] {
14735 top: 50%;
14736 -webkit-transform: translateY(-50%);
14737 transform: translateY(-50%);
14738}
14739.fab[class*="center-center"] {
14740 top: 50%;
14741 left: 50%;
14742 -webkit-transform: translateX(-50%) translateY(-50%);
14743 transform: translateX(-50%) translateY(-50%);
14744}
14745.fab div.fab-buttons a {
14746 width: 40px;
14747 height: 40px;
14748}
14749.fab-buttons {
14750 display: -webkit-box;
14751 display: -webkit-flex;
14752 display: -ms-flexbox;
14753 display: flex;
14754 visibility: hidden;
14755 pointer-events: none;
14756 position: absolute;
14757}
14758.fab-buttons a {
14759 opacity: 0;
14760}
14761.fab-opened:not(.fab-morph) > a i {
14762 -webkit-transform: translate3d(-50%, -50%, 0) rotate(90deg) scale(0.5);
14763 transform: translate3d(-50%, -50%, 0) rotate(90deg) scale(0.5);
14764 opacity: 0;
14765}
14766.fab-opened:not(.fab-morph) > a i + i {
14767 -webkit-transform: translate3d(-50%, -50%, 0) rotate(0deg) scale(1);
14768 transform: translate3d(-50%, -50%, 0) rotate(0deg) scale(1);
14769 opacity: 1;
14770}
14771.fab-opened .fab-buttons {
14772 visibility: visible;
14773 pointer-events: auto;
14774}
14775.fab-opened .fab-buttons a {
14776 opacity: 1;
14777 -webkit-transform: translate3d(0, 0px, 0) scale(1) !important;
14778 transform: translate3d(0, 0px, 0) scale(1) !important;
14779}
14780.fab-opened .fab-buttons a:nth-child(2) {
14781 -webkit-transition-delay: 50ms;
14782 transition-delay: 50ms;
14783}
14784.fab-opened .fab-buttons a:nth-child(3) {
14785 -webkit-transition-delay: 100ms;
14786 transition-delay: 100ms;
14787}
14788.fab-opened .fab-buttons a:nth-child(4) {
14789 -webkit-transition-delay: 150ms;
14790 transition-delay: 150ms;
14791}
14792.fab-opened .fab-buttons a:nth-child(5) {
14793 -webkit-transition-delay: 200ms;
14794 transition-delay: 200ms;
14795}
14796.fab-opened .fab-buttons a:nth-child(6) {
14797 -webkit-transition-delay: 250ms;
14798 transition-delay: 250ms;
14799}
14800.fab-buttons-top,
14801.fab-buttons-bottom {
14802 left: 50%;
14803 width: 40px;
14804 margin-left: -20px;
14805}
14806.fab-buttons-top {
14807 bottom: 100%;
14808 margin-bottom: 16px;
14809 -webkit-box-orient: vertical;
14810 -webkit-box-direction: reverse;
14811 -webkit-flex-direction: column-reverse;
14812 -ms-flex-direction: column-reverse;
14813 flex-direction: column-reverse;
14814}
14815.fab-buttons-top a {
14816 -webkit-transform: translate3d(0, 8px, 0) scale(0.3);
14817 transform: translate3d(0, 8px, 0) scale(0.3);
14818 -webkit-transform-origin: center bottom;
14819 transform-origin: center bottom;
14820}
14821.fab-buttons-top a + a {
14822 margin-bottom: 16px;
14823}
14824.fab-buttons-bottom {
14825 top: 100%;
14826 margin-top: 16px;
14827 -webkit-box-orient: vertical;
14828 -webkit-box-direction: normal;
14829 -webkit-flex-direction: column;
14830 -ms-flex-direction: column;
14831 flex-direction: column;
14832}
14833.fab-buttons-bottom a {
14834 -webkit-transform: translate3d(0, -8px, 0) scale(0.3);
14835 transform: translate3d(0, -8px, 0) scale(0.3);
14836 -webkit-transform-origin: center top;
14837 transform-origin: center top;
14838}
14839.fab-buttons-bottom a + a {
14840 margin-top: 16px;
14841}
14842.fab-buttons-left,
14843.fab-buttons-right {
14844 top: 50%;
14845 height: 40px;
14846 margin-top: -20px;
14847}
14848.fab-buttons-left {
14849 right: 100%;
14850 margin-right: 16px;
14851 -webkit-box-orient: horizontal;
14852 -webkit-box-direction: reverse;
14853 -webkit-flex-direction: row-reverse;
14854 -ms-flex-direction: row-reverse;
14855 flex-direction: row-reverse;
14856}
14857.fab-buttons-left a {
14858 -webkit-transform: translate3d(8px, 0px, 0) scale(0.3);
14859 transform: translate3d(8px, 0px, 0) scale(0.3);
14860 -webkit-transform-origin: right center;
14861 transform-origin: right center;
14862}
14863.fab-buttons-left a + a {
14864 margin-right: 16px;
14865}
14866.fab-buttons-right {
14867 left: 100%;
14868 margin-left: 16px;
14869}
14870.fab-buttons-right a {
14871 -webkit-transform: translate3d(-8px, 0, 0) scale(0.3);
14872 transform: translate3d(-8px, 0, 0) scale(0.3);
14873 -webkit-transform-origin: left center;
14874 transform-origin: left center;
14875}
14876.fab-buttons-right a + a {
14877 margin-left: 16px;
14878}
14879.fab-buttons-center {
14880 left: 0%;
14881 top: 0%;
14882 width: 100%;
14883 height: 100%;
14884}
14885.fab-buttons-center a {
14886 position: absolute;
14887}
14888.fab-buttons-center a:nth-child(1) {
14889 left: 50%;
14890 margin-left: -20px;
14891 bottom: 100%;
14892 margin-bottom: 16px;
14893 -webkit-transform: translateY(-8px) scale(0.3);
14894 transform: translateY(-8px) scale(0.3);
14895 -webkit-transform-origin: center bottom;
14896 transform-origin: center bottom;
14897}
14898.fab-buttons-center a:nth-child(2) {
14899 left: 100%;
14900 margin-top: -20px;
14901 top: 50%;
14902 margin-left: 16px;
14903 -webkit-transform: translateX(-8px) scale(0.3);
14904 transform: translateX(-8px) scale(0.3);
14905 -webkit-transform-origin: left center;
14906 transform-origin: left center;
14907}
14908.fab-buttons-center a:nth-child(3) {
14909 left: 50%;
14910 margin-left: -20px;
14911 top: 100%;
14912 margin-top: 16px;
14913 -webkit-transform: translateY(8px) scale(0.3);
14914 transform: translateY(8px) scale(0.3);
14915 -webkit-transform-origin: center top;
14916 transform-origin: center top;
14917}
14918.fab-buttons-center a:nth-child(4) {
14919 right: 100%;
14920 margin-top: -20px;
14921 top: 50%;
14922 margin-right: 16px;
14923 -webkit-transform: translateX(8px) scale(0.3);
14924 transform: translateX(8px) scale(0.3);
14925 -webkit-transform-origin: right center;
14926 transform-origin: right center;
14927}
14928.fab-opened.fab-morph > a i {
14929 opacity: 0;
14930}
14931.fab-morph,
14932.fab-morph > a,
14933.fab-morph-target {
14934 -webkit-transition-duration: 250ms;
14935 transition-duration: 250ms;
14936}
14937.fab-morph-target:not(.fab-morph-target-visible) {
14938 display: none;
14939}
14940.fab-extended {
14941 width: auto;
14942}
14943.fab-extended > a {
14944 width: 100% !important;
14945}
14946.fab-text {
14947 padding-left: 20px;
14948 padding-right: 20px;
14949 -webkit-box-sizing: border-box;
14950 box-sizing: border-box;
14951 font-size: 14px;
14952 text-transform: uppercase;
14953}
14954.fab-label-button {
14955 overflow: visible !important;
14956}
14957.fab-label {
14958 position: absolute;
14959 top: 50%;
14960 padding: 4px 12px;
14961 border-radius: 4px;
14962 background: #fff;
14963 color: #333;
14964 white-space: nowrap;
14965 -webkit-transform: translateY(-50%);
14966 transform: translateY(-50%);
14967 pointer-events: none;
14968}
14969.fab[class*="fab-right-"] .fab-label {
14970 right: 100%;
14971 margin-right: 8px;
14972}
14973.fab[class*="fab-left-"] .fab-label {
14974 left: 100%;
14975 margin-left: 8px;
14976}
14977.md .fab > a,
14978.md .fab-buttons a {
14979 background: #2196f3;
14980 width: 56px;
14981 height: 56px;
14982 border-radius: 28px;
14983 color: #fff;
14984 -webkit-box-shadow: 0px 3px 5px -1px rgba(0, 0, 0, 0.2), 0px 6px 10px 0px rgba(0, 0, 0, 0.14), 0px 1px 18px 0px rgba(0, 0, 0, 0.12);
14985 box-shadow: 0px 3px 5px -1px rgba(0, 0, 0, 0.2), 0px 6px 10px 0px rgba(0, 0, 0, 0.14), 0px 1px 18px 0px rgba(0, 0, 0, 0.12);
14986}
14987.md .fab > a.active-state,
14988.md .fab-buttons a.active-state {
14989 background: #0c82df;
14990}
14991.md .fab[class*="fab-left"] {
14992 left: 15px;
14993}
14994.md .fab[class*="fab-right"] {
14995 right: 15px;
14996}
14997.md .fab[class*="-top"] {
14998 top: 15px;
14999}
15000.md .fab[class*="-bottom"] {
15001 bottom: 15px;
15002}
15003.md .navbar ~ * .fab[class*="-top"],
15004.md .navbar ~ .fab[class*="-top"] {
15005 margin-top: 56px;
15006}
15007@media (min-width: 768px) {
15008 .md .navbar ~ * .fab[class*="-top"],
15009 .md .navbar ~ .fab[class*="-top"] {
15010 margin-top: 64px;
15011 }
15012}
15013.md .toolbar:not(.toolbar-bottom-md):not(.messagebar) ~ * .fab[class*="-top"],
15014.md .toolbar:not(.toolbar-bottom-md):not(.messagebar) ~ .fab[class*="-top"] {
15015 margin-top: 48px;
15016}
15017.md .tabbar-labels:not(.toolbar-bottom-md) ~ * .fab[class*="-top"],
15018.md .tabbar-labels:not(.toolbar-bottom-md) ~ .fab[class*="-top"] {
15019 margin-top: 72px;
15020}
15021.md .navbar + .toolbar:not(.toolbar-bottom-md):not(.messagebar) ~ * .fab[class*="-top"],
15022.md .navbar + .toolbar:not(.toolbar-bottom-md):not(.messagebar) ~ .fab[class*="-top"] {
15023 margin-top: 104px;
15024}
15025.md .navbar + .tabbar-labels:not(.toolbar-bottom-md) ~ * .fab[class*="-top"],
15026.md .navbar + .tabbar-labels:not(.toolbar-bottom-md) ~ .fab[class*="-top"] {
15027 margin-top: 128px;
15028}
15029@media (min-width: 768px) {
15030 .md .navbar + .toolbar:not(.toolbar-bottom-md):not(.messagebar) ~ * .fab[class*="-top"],
15031 .md .navbar + .toolbar:not(.toolbar-bottom-md):not(.messagebar) ~ .fab[class*="-top"] {
15032 margin-top: 112px;
15033 }
15034 .md .navbar + .tabbar-labels:not(.toolbar-bottom-md) ~ * .fab[class*="-top"],
15035 .md .navbar + .tabbar-labels:not(.toolbar-bottom-md) ~ .fab[class*="-top"] {
15036 margin-top: 136px;
15037 }
15038}
15039.md .toolbar-bottom-md ~ * .fab[class*="-bottom"],
15040.md .toolbar-bottom-md ~ .fab[class*="-bottom"],
15041.md .messagebar ~ * .fab[class*="-bottom"],
15042.md .messagebar ~ .fab[class*="-bottom"] {
15043 margin-bottom: 48px;
15044}
15045.md .toolbar-bottom-md.tabbar-labels ~ * .fab[class*="-bottom"],
15046.md .toolbar-bottom-md.tabbar-labels ~ .fab[class*="-bottom"] {
15047 margin-bottom: 72px;
15048}
15049.md .fab-morph {
15050 border-radius: 28px;
15051 background: #2196f3;
15052 -webkit-box-shadow: 0px 3px 5px -1px rgba(0, 0, 0, 0.2), 0px 6px 10px 0px rgba(0, 0, 0, 0.14), 0px 1px 18px 0px rgba(0, 0, 0, 0.12);
15053 box-shadow: 0px 3px 5px -1px rgba(0, 0, 0, 0.2), 0px 6px 10px 0px rgba(0, 0, 0, 0.14), 0px 1px 18px 0px rgba(0, 0, 0, 0.12);
15054}
15055.md .fab-morph > a {
15056 -webkit-box-shadow: none;
15057 box-shadow: none;
15058 background: none !important;
15059}
15060.md .fab-extended {
15061 min-width: 48px;
15062}
15063.md .fab-extended > a {
15064 height: 48px;
15065}
15066.md .fab-extended > a i {
15067 left: 24px;
15068}
15069.md .fab-extended i ~ .fab-text {
15070 padding-left: 48px;
15071}
15072.md .fab-text {
15073 font-weight: 500;
15074 letter-spacing: 0.03em;
15075}
15076.md .fab-label {
15077 -webkit-box-shadow: 0px 3px 3px -2px rgba(0, 0, 0, 0.2), 0px 3px 4px 0px rgba(0, 0, 0, 0.14), 0px 1px 8px 0px rgba(0, 0, 0, 0.12);
15078 box-shadow: 0px 3px 3px -2px rgba(0, 0, 0, 0.2), 0px 3px 4px 0px rgba(0, 0, 0, 0.14), 0px 1px 8px 0px rgba(0, 0, 0, 0.12);
15079}
15080.md .color-theme-red .fab > a,
15081.md .color-theme-red .fab-buttons a,
15082.md .color-theme-red.fab > a,
15083.md .color-theme-red.fab-buttons a {
15084 background: #f44336;
15085}
15086.md .color-theme-red .fab > a.active-state,
15087.md .color-theme-red .fab-buttons a.active-state,
15088.md .color-theme-red.fab > a.active-state,
15089.md .color-theme-red.fab-buttons a.active-state {
15090 background: #f21f0f;
15091}
15092.md .color-theme-red .fab-morph,
15093.md .color-theme-red.fab-morph {
15094 background: #f44336;
15095}
15096.md .color-theme-green .fab > a,
15097.md .color-theme-green .fab-buttons a,
15098.md .color-theme-green.fab > a,
15099.md .color-theme-green.fab-buttons a {
15100 background: #4caf50;
15101}
15102.md .color-theme-green .fab > a.active-state,
15103.md .color-theme-green .fab-buttons a.active-state,
15104.md .color-theme-green.fab > a.active-state,
15105.md .color-theme-green.fab-buttons a.active-state {
15106 background: #409343;
15107}
15108.md .color-theme-green .fab-morph,
15109.md .color-theme-green.fab-morph {
15110 background: #4caf50;
15111}
15112.md .color-theme-blue .fab > a,
15113.md .color-theme-blue .fab-buttons a,
15114.md .color-theme-blue.fab > a,
15115.md .color-theme-blue.fab-buttons a {
15116 background: #2196f3;
15117}
15118.md .color-theme-blue .fab > a.active-state,
15119.md .color-theme-blue .fab-buttons a.active-state,
15120.md .color-theme-blue.fab > a.active-state,
15121.md .color-theme-blue.fab-buttons a.active-state {
15122 background: #0c82df;
15123}
15124.md .color-theme-blue .fab-morph,
15125.md .color-theme-blue.fab-morph {
15126 background: #2196f3;
15127}
15128.md .color-theme-pink .fab > a,
15129.md .color-theme-pink .fab-buttons a,
15130.md .color-theme-pink.fab > a,
15131.md .color-theme-pink.fab-buttons a {
15132 background: #e91e63;
15133}
15134.md .color-theme-pink .fab > a.active-state,
15135.md .color-theme-pink .fab-buttons a.active-state,
15136.md .color-theme-pink.fab > a.active-state,
15137.md .color-theme-pink.fab-buttons a.active-state {
15138 background: #ca1452;
15139}
15140.md .color-theme-pink .fab-morph,
15141.md .color-theme-pink.fab-morph {
15142 background: #e91e63;
15143}
15144.md .color-theme-yellow .fab > a,
15145.md .color-theme-yellow .fab-buttons a,
15146.md .color-theme-yellow.fab > a,
15147.md .color-theme-yellow.fab-buttons a {
15148 background: #ffeb3b;
15149}
15150.md .color-theme-yellow .fab > a.active-state,
15151.md .color-theme-yellow .fab-buttons a.active-state,
15152.md .color-theme-yellow.fab > a.active-state,
15153.md .color-theme-yellow.fab-buttons a.active-state {
15154 background: #ffe712;
15155}
15156.md .color-theme-yellow .fab-morph,
15157.md .color-theme-yellow.fab-morph {
15158 background: #ffeb3b;
15159}
15160.md .color-theme-orange .fab > a,
15161.md .color-theme-orange .fab-buttons a,
15162.md .color-theme-orange.fab > a,
15163.md .color-theme-orange.fab-buttons a {
15164 background: #ff9800;
15165}
15166.md .color-theme-orange .fab > a.active-state,
15167.md .color-theme-orange .fab-buttons a.active-state,
15168.md .color-theme-orange.fab > a.active-state,
15169.md .color-theme-orange.fab-buttons a.active-state {
15170 background: #d68000;
15171}
15172.md .color-theme-orange .fab-morph,
15173.md .color-theme-orange.fab-morph {
15174 background: #ff9800;
15175}
15176.md .color-theme-gray .fab > a,
15177.md .color-theme-gray .fab-buttons a,
15178.md .color-theme-gray.fab > a,
15179.md .color-theme-gray.fab-buttons a {
15180 background: #9e9e9e;
15181}
15182.md .color-theme-gray .fab > a.active-state,
15183.md .color-theme-gray .fab-buttons a.active-state,
15184.md .color-theme-gray.fab > a.active-state,
15185.md .color-theme-gray.fab-buttons a.active-state {
15186 background: #8a8a8a;
15187}
15188.md .color-theme-gray .fab-morph,
15189.md .color-theme-gray.fab-morph {
15190 background: #9e9e9e;
15191}
15192.md .color-theme-white .fab > a,
15193.md .color-theme-white .fab-buttons a,
15194.md .color-theme-white.fab > a,
15195.md .color-theme-white.fab-buttons a {
15196 background: #ffffff;
15197}
15198.md .color-theme-white .fab > a.active-state,
15199.md .color-theme-white .fab-buttons a.active-state,
15200.md .color-theme-white.fab > a.active-state,
15201.md .color-theme-white.fab-buttons a.active-state {
15202 background: #ebebeb;
15203}
15204.md .color-theme-white .fab-morph,
15205.md .color-theme-white.fab-morph {
15206 background: #ffffff;
15207}
15208.md .color-theme-black .fab > a,
15209.md .color-theme-black .fab-buttons a,
15210.md .color-theme-black.fab > a,
15211.md .color-theme-black.fab-buttons a {
15212 background: #000000;
15213}
15214.md .color-theme-black .fab > a.active-state,
15215.md .color-theme-black .fab-buttons a.active-state,
15216.md .color-theme-black.fab > a.active-state,
15217.md .color-theme-black.fab-buttons a.active-state {
15218 background: #000000;
15219}
15220.md .color-theme-black .fab-morph,
15221.md .color-theme-black.fab-morph {
15222 background: #000000;
15223}
15224.md .fab.color-red > a,
15225.md .fab.color-red .fab-buttons > a,
15226.md .fab-buttons.color-red a,
15227.md .fab > a.color-red,
15228.md .fab .fab-buttons > a.color-red {
15229 background: #f44336;
15230}
15231.md .fab.color-red > a.active-state,
15232.md .fab.color-red .fab-buttons > a.active-state,
15233.md .fab-buttons.color-red a.active-state,
15234.md .fab > a.color-red.active-state,
15235.md .fab .fab-buttons > a.color-red.active-state {
15236 background: #f21f0f;
15237}
15238.md .fab-morph.color-red {
15239 background: #f44336;
15240}
15241.md .fab.color-green > a,
15242.md .fab.color-green .fab-buttons > a,
15243.md .fab-buttons.color-green a,
15244.md .fab > a.color-green,
15245.md .fab .fab-buttons > a.color-green {
15246 background: #4caf50;
15247}
15248.md .fab.color-green > a.active-state,
15249.md .fab.color-green .fab-buttons > a.active-state,
15250.md .fab-buttons.color-green a.active-state,
15251.md .fab > a.color-green.active-state,
15252.md .fab .fab-buttons > a.color-green.active-state {
15253 background: #409343;
15254}
15255.md .fab-morph.color-green {
15256 background: #4caf50;
15257}
15258.md .fab.color-blue > a,
15259.md .fab.color-blue .fab-buttons > a,
15260.md .fab-buttons.color-blue a,
15261.md .fab > a.color-blue,
15262.md .fab .fab-buttons > a.color-blue {
15263 background: #2196f3;
15264}
15265.md .fab.color-blue > a.active-state,
15266.md .fab.color-blue .fab-buttons > a.active-state,
15267.md .fab-buttons.color-blue a.active-state,
15268.md .fab > a.color-blue.active-state,
15269.md .fab .fab-buttons > a.color-blue.active-state {
15270 background: #0c82df;
15271}
15272.md .fab-morph.color-blue {
15273 background: #2196f3;
15274}
15275.md .fab.color-pink > a,
15276.md .fab.color-pink .fab-buttons > a,
15277.md .fab-buttons.color-pink a,
15278.md .fab > a.color-pink,
15279.md .fab .fab-buttons > a.color-pink {
15280 background: #e91e63;
15281}
15282.md .fab.color-pink > a.active-state,
15283.md .fab.color-pink .fab-buttons > a.active-state,
15284.md .fab-buttons.color-pink a.active-state,
15285.md .fab > a.color-pink.active-state,
15286.md .fab .fab-buttons > a.color-pink.active-state {
15287 background: #ca1452;
15288}
15289.md .fab-morph.color-pink {
15290 background: #e91e63;
15291}
15292.md .fab.color-yellow > a,
15293.md .fab.color-yellow .fab-buttons > a,
15294.md .fab-buttons.color-yellow a,
15295.md .fab > a.color-yellow,
15296.md .fab .fab-buttons > a.color-yellow {
15297 background: #ffeb3b;
15298}
15299.md .fab.color-yellow > a.active-state,
15300.md .fab.color-yellow .fab-buttons > a.active-state,
15301.md .fab-buttons.color-yellow a.active-state,
15302.md .fab > a.color-yellow.active-state,
15303.md .fab .fab-buttons > a.color-yellow.active-state {
15304 background: #ffe712;
15305}
15306.md .fab-morph.color-yellow {
15307 background: #ffeb3b;
15308}
15309.md .fab.color-orange > a,
15310.md .fab.color-orange .fab-buttons > a,
15311.md .fab-buttons.color-orange a,
15312.md .fab > a.color-orange,
15313.md .fab .fab-buttons > a.color-orange {
15314 background: #ff9800;
15315}
15316.md .fab.color-orange > a.active-state,
15317.md .fab.color-orange .fab-buttons > a.active-state,
15318.md .fab-buttons.color-orange a.active-state,
15319.md .fab > a.color-orange.active-state,
15320.md .fab .fab-buttons > a.color-orange.active-state {
15321 background: #d68000;
15322}
15323.md .fab-morph.color-orange {
15324 background: #ff9800;
15325}
15326.md .fab.color-gray > a,
15327.md .fab.color-gray .fab-buttons > a,
15328.md .fab-buttons.color-gray a,
15329.md .fab > a.color-gray,
15330.md .fab .fab-buttons > a.color-gray {
15331 background: #9e9e9e;
15332}
15333.md .fab.color-gray > a.active-state,
15334.md .fab.color-gray .fab-buttons > a.active-state,
15335.md .fab-buttons.color-gray a.active-state,
15336.md .fab > a.color-gray.active-state,
15337.md .fab .fab-buttons > a.color-gray.active-state {
15338 background: #8a8a8a;
15339}
15340.md .fab-morph.color-gray {
15341 background: #9e9e9e;
15342}
15343.md .fab.color-white > a,
15344.md .fab.color-white .fab-buttons > a,
15345.md .fab-buttons.color-white a,
15346.md .fab > a.color-white,
15347.md .fab .fab-buttons > a.color-white {
15348 background: #ffffff;
15349}
15350.md .fab.color-white > a.active-state,
15351.md .fab.color-white .fab-buttons > a.active-state,
15352.md .fab-buttons.color-white a.active-state,
15353.md .fab > a.color-white.active-state,
15354.md .fab .fab-buttons > a.color-white.active-state {
15355 background: #ebebeb;
15356}
15357.md .fab-morph.color-white {
15358 background: #ffffff;
15359}
15360.md .fab.color-black > a,
15361.md .fab.color-black .fab-buttons > a,
15362.md .fab-buttons.color-black a,
15363.md .fab > a.color-black,
15364.md .fab .fab-buttons > a.color-black {
15365 background: #000000;
15366}
15367.md .fab.color-black > a.active-state,
15368.md .fab.color-black .fab-buttons > a.active-state,
15369.md .fab-buttons.color-black a.active-state,
15370.md .fab > a.color-black.active-state,
15371.md .fab .fab-buttons > a.color-black.active-state {
15372 background: #000000;
15373}
15374.md .fab-morph.color-black {
15375 background: #000000;
15376}
15377.md.device-iphone-x .fab[class*="-bottom"] {
15378 bottom: calc(16px + constant(safe-area-inset-bottom));
15379 bottom: calc(16px + env(safe-area-inset-bottom));
15380}
15381@media (orientation: landscape) {
15382 .md.device-iphone-x .ios-left-edge .fab[class*="fab-left"],
15383 .md.device-iphone-x .ios-edges .fab[class*="fab-left"],
15384 .md.device-iphone-x .popup .fab[class*="fab-left"],
15385 .md.device-iphone-x .sheet-modal .fab[class*="fab-left"],
15386 .md.device-iphone-x .panel-left .fab[class*="fab-left"] {
15387 left: calc(16px + constant(safe-area-inset-left));
15388 left: calc(16px + env(safe-area-inset-left));
15389 }
15390 .md.device-iphone-x .ios-right-edge .fab[class*="fab-right"],
15391 .md.device-iphone-x .ios-edges .fab[class*="fab-right"],
15392 .md.device-iphone-x .popup .fab[class*="fab-right"],
15393 .md.device-iphone-x .sheet-modal .fab[class*="fab-right"],
15394 .md.device-iphone-x .panel-right .fab[class*="fab-right"] {
15395 right: calc(16px + constant(safe-area-inset-right));
15396 right: calc(16px + env(safe-area-inset-right));
15397 }
15398}
15399/* === Searchbar === */
15400.searchbar {
15401 width: 100%;
15402 position: relative;
15403 z-index: 200;
15404}
15405.searchbar .searchbar-input-wrap {
15406 -webkit-flex-shrink: 1;
15407 -ms-flex-negative: 1;
15408 flex-shrink: 1;
15409 width: 100%;
15410 height: 100%;
15411 position: relative;
15412}
15413.searchbar .searchbar-input-wrap input[type="search"] {
15414 padding: 0;
15415}
15416.searchbar .searchbar-input-wrap input::-webkit-search-cancel-button {
15417 -webkit-appearance: none;
15418 appearance: none;
15419}
15420.page > .searchbar {
15421 position: absolute;
15422 left: 0;
15423 top: 0;
15424}
15425.searchbar-expandable {
15426 position: absolute;
15427 -webkit-transition-duration: 300ms;
15428 transition-duration: 300ms;
15429 pointer-events: none;
15430}
15431.searchbar-inner {
15432 position: absolute;
15433 left: 0;
15434 top: 0;
15435 width: 100%;
15436 height: 100%;
15437 display: -webkit-box;
15438 display: -webkit-flex;
15439 display: -ms-flexbox;
15440 display: flex;
15441 -webkit-box-align: center;
15442 -webkit-align-items: center;
15443 -ms-flex-align: center;
15444 align-items: center;
15445 -webkit-box-sizing: border-box;
15446 box-sizing: border-box;
15447}
15448.searchbar-disable-button {
15449 cursor: pointer;
15450 pointer-events: none;
15451 -webkit-appearance: none;
15452 -moz-appearance: none;
15453 appearance: none;
15454 background: none;
15455 border: none;
15456 outline: 0;
15457 padding: 0;
15458 margin: 0;
15459 width: auto;
15460 opacity: 0;
15461}
15462.searchbar-icon {
15463 pointer-events: none;
15464 background-position: center;
15465 background-repeat: no-repeat;
15466}
15467.searchbar-backdrop {
15468 position: absolute;
15469 left: 0;
15470 top: 0;
15471 width: 100%;
15472 height: 100%;
15473 z-index: 100;
15474 opacity: 0;
15475 pointer-events: none;
15476 -webkit-transition-duration: 300ms;
15477 transition-duration: 300ms;
15478 -webkit-transform: translate3d(0, 0, 0);
15479 transform: translate3d(0, 0, 0);
15480}
15481.searchbar-backdrop.searchbar-backdrop-in {
15482 opacity: 1;
15483 pointer-events: auto;
15484}
15485.page-content > .searchbar-backdrop {
15486 position: fixed;
15487}
15488.searchbar-not-found {
15489 display: none;
15490}
15491.hidden-by-searchbar,
15492.list .hidden-by-searchbar,
15493.list.li.hidden-by-searchbar,
15494.list li.hidden-by-searchbar {
15495 display: none !important;
15496}
15497.md .searchbar {
15498 height: 48px;
15499 background: #fff;
15500}
15501.md .searchbar input[type="search"],
15502.md .searchbar input[type="text"] {
15503 padding-left: 65px;
15504 padding-right: 48px;
15505 -webkit-box-sizing: border-box;
15506 box-sizing: border-box;
15507 width: 100%;
15508 height: 100%;
15509 display: block;
15510 border: none;
15511 -webkit-appearance: none;
15512 -moz-appearance: none;
15513 appearance: none;
15514 font-family: inherit;
15515 font-size: 20px;
15516 color: #000;
15517 font-weight: normal;
15518}
15519.md .searchbar input[type="search"]::-webkit-input-placeholder,
15520.md .searchbar input[type="text"]::-webkit-input-placeholder {
15521 color: #939398;
15522 opacity: 1;
15523}
15524.md .searchbar input[type="search"]:-ms-input-placeholder,
15525.md .searchbar input[type="text"]:-ms-input-placeholder {
15526 color: #939398;
15527 opacity: 1;
15528}
15529.md .searchbar input[type="search"]::-ms-input-placeholder,
15530.md .searchbar input[type="text"]::-ms-input-placeholder {
15531 color: #939398;
15532 opacity: 1;
15533}
15534.md .searchbar input[type="search"]::placeholder,
15535.md .searchbar input[type="text"]::placeholder {
15536 color: #939398;
15537 opacity: 1;
15538}
15539.md .searchbar-expandable {
15540 height: 100%;
15541}
15542.md .searchbar-backdrop {
15543 background: rgba(0, 0, 0, 0.25);
15544}
15545.md .searchbar-icon,
15546.md .searchbar-disable-button {
15547 position: absolute;
15548 width: 48px;
15549 height: 48px;
15550 left: -4px;
15551 top: 50%;
15552 margin-top: -24px;
15553 background-size: 24px 24px;
15554 background-repeat: no-repeat;
15555 background-position: center;
15556 -webkit-transition-duration: 300ms;
15557 transition-duration: 300ms;
15558}
15559.md .searchbar-icon {
15560 background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20fill%3D'%23737373'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%20width%3D'24'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%3Cpath%20d%3D'M15.5%2014h-.79l-.28-.27C15.41%2012.59%2016%2011.11%2016%209.5%2016%205.91%2013.09%203%209.5%203S3%205.91%203%209.5%205.91%2016%209.5%2016c1.61%200%203.09-.59%204.23-1.57l.27.28v.79l5%204.99L20.49%2019l-4.99-5zm-6%200C7.01%2014%205%2011.99%205%209.5S7.01%205%209.5%205%2014%207.01%2014%209.5%2011.99%2014%209.5%2014z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E");
15561}
15562.md .searchbar-disable-button {
15563 -webkit-transform: rotate(-90deg) scale(0.5);
15564 transform: rotate(-90deg) scale(0.5);
15565 font-size: 0 !important;
15566 display: block;
15567 background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M20%2011H7.83l5.59-5.59L12%204l-8%208%208%208%201.41-1.41L7.83%2013H20v-2z'%20fill%3D'%23737373'%2F%3E%3C%2Fsvg%3E");
15568}
15569.md .searchbar-disable-button:before {
15570 content: '';
15571 width: 152%;
15572 height: 152%;
15573 position: absolute;
15574 left: -26%;
15575 top: -26%;
15576 background-image: -webkit-radial-gradient(center, circle, rgba(0, 0, 0, 0.1) 66%, rgba(0, 0, 0, 0) 66%);
15577 background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0.1) 66%, rgba(0, 0, 0, 0) 66%);
15578 background-repeat: no-repeat;
15579 background-position: center;
15580 background-size: 100% 100%;
15581 opacity: 0;
15582 pointer-events: none;
15583 -webkit-transition-duration: 600ms;
15584 transition-duration: 600ms;
15585}
15586.md .searchbar-disable-button.active-state:before {
15587 opacity: 1;
15588 -webkit-transition-duration: 150ms;
15589 transition-duration: 150ms;
15590}
15591.md .searchbar-enabled:not(.searchbar-enabled-no-disable-button) .searchbar-disable-button {
15592 -webkit-transform: rotate(0deg) scale(1);
15593 transform: rotate(0deg) scale(1);
15594 pointer-events: auto;
15595 opacity: 1;
15596}
15597.md .searchbar-enabled:not(.searchbar-enabled-no-disable-button) .searchbar-icon {
15598 opacity: 0;
15599 -webkit-transform: rotate(90deg) scale(0.5);
15600 transform: rotate(90deg) scale(0.5);
15601}
15602.md .searchbar .input-clear-button {
15603 width: 48px;
15604 height: 48px;
15605 margin-top: -24px;
15606 background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20fill%3D'%23737373'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%20width%3D'24'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%3Cpath%20d%3D'M19%206.41L17.59%205%2012%2010.59%206.41%205%205%206.41%2010.59%2012%205%2017.59%206.41%2019%2012%2013.41%2017.59%2019%2019%2017.59%2013.41%2012z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E");
15607 border-radius: 0;
15608 background-repeat: no-repeat;
15609 background-position: center;
15610 background-size: 24px 24px;
15611 background-color: transparent;
15612 right: 0;
15613}
15614.md .searchbar .input-clear-button:before {
15615 content: '';
15616 width: 152%;
15617 height: 152%;
15618 position: absolute;
15619 left: -26%;
15620 top: -26%;
15621 background-image: -webkit-radial-gradient(center, circle, rgba(0, 0, 0, 0.1) 66%, rgba(0, 0, 0, 0) 66%);
15622 background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0.1) 66%, rgba(0, 0, 0, 0) 66%);
15623 background-repeat: no-repeat;
15624 background-position: center;
15625 background-size: 100% 100%;
15626 opacity: 0;
15627 pointer-events: none;
15628 -webkit-transition-duration: 600ms;
15629 transition-duration: 600ms;
15630}
15631.md .searchbar .input-clear-button.active-state:before {
15632 opacity: 1;
15633 -webkit-transition-duration: 150ms;
15634 transition-duration: 150ms;
15635}
15636.md .searchbar .input-clear-button:after {
15637 display: none;
15638}
15639.md .searchbar .input-clear-button:before {
15640 margin-left: 0;
15641 margin-top: 0;
15642}
15643.md .page-content .searchbar {
15644 border-radius: 2px;
15645 margin: 8px;
15646 width: auto;
15647 -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
15648 box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
15649}
15650.md .page-content .searchbar .searchbar-inner {
15651 border-radius: 2px;
15652}
15653.md .page > .searchbar {
15654 z-index: 510;
15655}
15656.md .page > .searchbar:after {
15657 content: '';
15658 position: absolute;
15659 right: 0;
15660 width: 100%;
15661 top: 100%;
15662 bottom: auto;
15663 height: 10px;
15664 pointer-events: none;
15665 background: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0.3)), color-stop(40%, rgba(0, 0, 0, 0.1)), color-stop(50%, rgba(0, 0, 0, 0.05)), color-stop(80%, rgba(0, 0, 0, 0)), to(rgba(0, 0, 0, 0)));
15666 background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0.3) 0%, rgba(0, 0, 0, 0.1) 40%, rgba(0, 0, 0, 0.05) 50%, rgba(0, 0, 0, 0) 80%, rgba(0, 0, 0, 0) 100%);
15667 background: linear-gradient(to bottom, rgba(0, 0, 0, 0.3) 0%, rgba(0, 0, 0, 0.1) 40%, rgba(0, 0, 0, 0.05) 50%, rgba(0, 0, 0, 0) 80%, rgba(0, 0, 0, 0) 100%);
15668}
15669.md .page > .searchbar.no-shadow:after {
15670 display: none;
15671}
15672.md .page > .searchbar input[type="search"],
15673.md .subnavbar .searchbar input[type="search"],
15674.md .searchbar-expandable input[type="search"],
15675.md .page > .searchbar input[type="text"],
15676.md .subnavbar .searchbar input[type="text"],
15677.md .searchbar-expandable input[type="text"] {
15678 padding-left: 73px;
15679}
15680.md .page > .searchbar .searchbar-icon,
15681.md .subnavbar .searchbar .searchbar-icon,
15682.md .searchbar-expandable .searchbar-icon,
15683.md .page > .searchbar .searchbar-disable-button,
15684.md .subnavbar .searchbar .searchbar-disable-button,
15685.md .searchbar-expandable .searchbar-disable-button {
15686 left: 4px;
15687}
15688.md .searchbar-expandable {
15689 width: 56px;
15690 height: 100%;
15691 opacity: 0;
15692 top: 50%;
15693 margin-top: -28px;
15694 -webkit-transform: translate3d(0px, 0px, 0px);
15695 transform: translate3d(0px, 0px, 0px);
15696 left: 100%;
15697 margin-left: -56px;
15698}
15699.md .navbar .searchbar-expandable {
15700 border-radius: 28px;
15701 width: 56px;
15702 margin-top: -28px;
15703 margin-left: -56px;
15704}
15705@media (min-width: 768px) {
15706 .md .navbar .searchbar-expandable {
15707 border-radius: 32px;
15708 width: 64px;
15709 margin-top: -32px;
15710 margin-left: -64px;
15711 }
15712}
15713.md .toolbar .searchbar-expandable,
15714.md .subnavbar .searchbar-expandable {
15715 border-radius: 24px;
15716 width: 48px;
15717 margin-top: -24px;
15718 margin-left: -48px;
15719}
15720.md .tabbar-labels .searchbar-expandable {
15721 border-radius: 36px;
15722 width: 72px;
15723 margin-top: -36px;
15724 margin-left: -72px;
15725}
15726.md .searchbar-expandable.searchbar-enabled {
15727 width: 100%;
15728 border-radius: 0;
15729 opacity: 1;
15730 pointer-events: auto;
15731 top: 0;
15732 margin-top: 0;
15733 left: 0;
15734 margin-left: 0;
15735}
15736.md .page > .searchbar ~ * .page-content,
15737.md .page > .searchbar ~ .page-content {
15738 padding-top: 48px;
15739}
15740.md .page > .navbar ~ .searchbar {
15741 top: 56px;
15742}
15743@media (min-width: 768px) {
15744 .md .page > .navbar ~ .searchbar {
15745 top: 64px;
15746 }
15747}
15748.md .page > .navbar ~ .searchbar ~ * .page-content,
15749.md .page > .navbar ~ .searchbar ~ .page-content {
15750 padding-top: 104px;
15751}
15752@media (min-width: 768px) {
15753 .md .page > .navbar ~ .searchbar ~ * .page-content,
15754 .md .page > .navbar ~ .searchbar ~ .page-content {
15755 padding-top: 112px;
15756 }
15757}
15758.md .page > .toolbar:not(.toolbar-bottom-md):not(.messagebar) ~ .searchbar {
15759 top: 48px;
15760}
15761.md .page > .toolbar:not(.toolbar-bottom-md):not(.messagebar) ~ .searchbar ~ * .page-content,
15762.md .page > .toolbar:not(.toolbar-bottom-md):not(.messagebar) ~ .searchbar ~ .page-content {
15763 padding-top: 96px;
15764}
15765.md .page > .tabbar-labels:not(.toolbar-bottom-md) ~ .searchbar {
15766 top: 72px;
15767}
15768.md .page > .tabbar-labels:not(.toolbar-bottom-md) ~ .searchbar ~ * .page-content,
15769.md .page > .tabbar-labels:not(.toolbar-bottom-md) ~ .searchbar ~ .page-content {
15770 padding-top: 120px;
15771}
15772.md .page > .navbar ~ .toolbar:not(.toolbar-bottom-md):not(.messagebar) ~ .searchbar {
15773 top: 104px;
15774}
15775@media (min-width: 768px) {
15776 .md .page > .navbar ~ .toolbar:not(.toolbar-bottom-md):not(.messagebar) ~ .searchbar {
15777 top: 112px;
15778 }
15779}
15780.md .page > .navbar ~ .toolbar:not(.toolbar-bottom-md):not(.messagebar) ~ .searchbar ~ * .page-content,
15781.md .page > .navbar ~ .toolbar:not(.toolbar-bottom-md):not(.messagebar) ~ .searchbar ~ .page-content {
15782 padding-top: 152px;
15783}
15784@media (min-width: 768px) {
15785 .md .page > .navbar ~ .toolbar:not(.toolbar-bottom-md):not(.messagebar) ~ .searchbar ~ * .page-content,
15786 .md .page > .navbar ~ .toolbar:not(.toolbar-bottom-md):not(.messagebar) ~ .searchbar ~ .page-content {
15787 padding-top: 160px;
15788 }
15789}
15790.md .page > .navbar ~ .tabbar-labels:not(.toolbar-bottom-md) ~ .searchbar {
15791 top: 128px;
15792}
15793@media (min-width: 768px) {
15794 .md .page > .navbar ~ .tabbar-labels:not(.toolbar-bottom-md) ~ .searchbar {
15795 top: 136px;
15796 }
15797}
15798.md .page > .navbar ~ .tabbar-labels:not(.toolbar-bottom-md) ~ .searchbar ~ * .page-content,
15799.md .page > .navbar ~ .tabbar-labels:not(.toolbar-bottom-md) ~ .searchbar ~ .page-content {
15800 padding-top: 176px;
15801}
15802@media (min-width: 768px) {
15803 .md .page > .navbar ~ .tabbar-labels:not(.toolbar-bottom-md) ~ .searchbar ~ * .page-content,
15804 .md .page > .navbar ~ .tabbar-labels:not(.toolbar-bottom-md) ~ .searchbar ~ .page-content {
15805 padding-top: 184px;
15806 }
15807}
15808@media (orientation: landscape) {
15809 .md.device-iphone-x .ios-left-edge .searchbar-inner,
15810 .md.device-iphone-x .ios-edges .searchbar-inner,
15811 .md.device-iphone-x .popup .searchbar-inner,
15812 .md.device-iphone-x .sheet-modal .searchbar-inner,
15813 .md.device-iphone-x .panel-left .searchbar-inner {
15814 padding-left: constant(safe-area-inset-left);
15815 padding-left: env(safe-area-inset-left);
15816 }
15817 .md.device-iphone-x .ios-left-edge .searchbar-disable-button,
15818 .md.device-iphone-x .ios-edges .searchbar-disable-button,
15819 .md.device-iphone-x .popup .searchbar-disable-button,
15820 .md.device-iphone-x .sheet-modal .searchbar-disable-button,
15821 .md.device-iphone-x .panel-left .searchbar-disable-button {
15822 left: calc(4px + constant(safe-area-inset-left));
15823 left: calc(4px + env(safe-area-inset-left));
15824 }
15825 .md.device-iphone-x .ios-right-edge .searchbar-inner,
15826 .md.device-iphone-x .ios-edges .searchbar-inner,
15827 .md.device-iphone-x .popup .searchbar-inner,
15828 .md.device-iphone-x .sheet-modal .searchbar-inner,
15829 .md.device-iphone-x .panel-right .searchbar-inner {
15830 padding-right: constant(safe-area-inset-right);
15831 padding-right: env(safe-area-inset-right);
15832 }
15833}
15834/* === Messages === */
15835.messages {
15836 display: -webkit-box;
15837 display: -webkit-flex;
15838 display: -ms-flexbox;
15839 display: flex;
15840 -webkit-box-orient: vertical;
15841 -webkit-box-direction: normal;
15842 -webkit-flex-direction: column;
15843 -ms-flex-direction: column;
15844 flex-direction: column;
15845 min-height: 100%;
15846 position: relative;
15847 z-index: 1;
15848}
15849.messages-title {
15850 text-align: center;
15851 width: 100%;
15852 line-height: 1;
15853}
15854.message {
15855 max-width: 70%;
15856 -webkit-box-sizing: border-box;
15857 box-sizing: border-box;
15858 display: -webkit-box;
15859 display: -webkit-flex;
15860 display: -ms-flexbox;
15861 display: flex;
15862 -webkit-box-align: end;
15863 -webkit-align-items: flex-end;
15864 -ms-flex-align: end;
15865 align-items: flex-end;
15866 position: relative;
15867 z-index: 1;
15868 -webkit-transform: translate3d(0, 0, 0);
15869 transform: translate3d(0, 0, 0);
15870}
15871.message-avatar {
15872 border-radius: 50%;
15873 position: relative;
15874 background-size: cover;
15875 -webkit-align-self: flex-end;
15876 -ms-flex-item-align: end;
15877 align-self: flex-end;
15878 -webkit-flex-shrink: 0;
15879 -ms-flex-negative: 0;
15880 flex-shrink: 0;
15881}
15882.message-content {
15883 position: relative;
15884 display: -webkit-box;
15885 display: -webkit-flex;
15886 display: -ms-flexbox;
15887 display: flex;
15888 -webkit-box-orient: vertical;
15889 -webkit-box-direction: normal;
15890 -webkit-flex-direction: column;
15891 -ms-flex-direction: column;
15892 flex-direction: column;
15893}
15894.message-header,
15895.message-footer,
15896.message-name {
15897 line-height: 1;
15898 font-size: 12px;
15899}
15900.message-footer {
15901 font-size: 11px;
15902 margin-bottom: -1em;
15903}
15904.message-bubble {
15905 -webkit-box-sizing: border-box;
15906 box-sizing: border-box;
15907 word-break: break-word;
15908 display: -webkit-box;
15909 display: -webkit-flex;
15910 display: -ms-flexbox;
15911 display: flex;
15912 -webkit-box-orient: vertical;
15913 -webkit-box-direction: normal;
15914 -webkit-flex-direction: column;
15915 -ms-flex-direction: column;
15916 flex-direction: column;
15917 position: relative;
15918 line-height: 1.2;
15919}
15920.message-image img {
15921 display: block;
15922 max-width: 100%;
15923 height: auto;
15924 width: auto;
15925}
15926.message-text-header,
15927.message-text-footer {
15928 font-size: 12px;
15929 line-height: 1;
15930}
15931.message-text {
15932 text-align: left;
15933}
15934.message-sent {
15935 text-align: right;
15936 -webkit-box-orient: horizontal;
15937 -webkit-box-direction: reverse;
15938 -webkit-flex-direction: row-reverse;
15939 -ms-flex-direction: row-reverse;
15940 flex-direction: row-reverse;
15941 -webkit-align-self: flex-end;
15942 -ms-flex-item-align: end;
15943 align-self: flex-end;
15944}
15945.message-received {
15946 -webkit-box-orient: horizontal;
15947 -webkit-box-direction: normal;
15948 -webkit-flex-direction: row;
15949 -ms-flex-direction: row;
15950 flex-direction: row;
15951}
15952.message-received .message-content {
15953 -webkit-box-align: start;
15954 -webkit-align-items: flex-start;
15955 -ms-flex-align: start;
15956 align-items: flex-start;
15957}
15958.message-sent .message-content {
15959 -webkit-box-align: end;
15960 -webkit-align-items: flex-end;
15961 -ms-flex-align: end;
15962 align-items: flex-end;
15963}
15964.message:not(.message-last) .message-avatar {
15965 opacity: 0;
15966}
15967.message:not(.message-first) .message-name {
15968 display: none;
15969}
15970.message.message-same-name .message-name {
15971 display: none;
15972}
15973.message.message-same-header .message-header {
15974 display: none;
15975}
15976.message.message-same-footer .message-footer {
15977 display: none;
15978}
15979.message-appear-from-bottom {
15980 -webkit-animation: message-appear-from-bottom 300ms;
15981 animation: message-appear-from-bottom 300ms;
15982}
15983.message-appear-from-top {
15984 -webkit-animation: message-appear-from-top 300ms;
15985 animation: message-appear-from-top 300ms;
15986}
15987.message-typing-indicator {
15988 display: inline-block;
15989 font-size: 0;
15990 vertical-align: middle;
15991}
15992.message-typing-indicator > div {
15993 display: inline-block;
15994 position: relative;
15995 background: #000;
15996 vertical-align: middle;
15997 border-radius: 50%;
15998}
15999@-webkit-keyframes message-appear-from-bottom {
16000 from {
16001 -webkit-transform: translate3d(0, 100%, 0);
16002 transform: translate3d(0, 100%, 0);
16003 }
16004 to {
16005 -webkit-transform: translate3d(0, 0, 0);
16006 transform: translate3d(0, 0, 0);
16007 }
16008}
16009@keyframes message-appear-from-bottom {
16010 from {
16011 -webkit-transform: translate3d(0, 100%, 0);
16012 transform: translate3d(0, 100%, 0);
16013 }
16014 to {
16015 -webkit-transform: translate3d(0, 0, 0);
16016 transform: translate3d(0, 0, 0);
16017 }
16018}
16019@-webkit-keyframes message-appear-from-top {
16020 from {
16021 -webkit-transform: translate3d(0, -100%, 0);
16022 transform: translate3d(0, -100%, 0);
16023 }
16024 to {
16025 -webkit-transform: translate3d(0, 0, 0);
16026 transform: translate3d(0, 0, 0);
16027 }
16028}
16029@keyframes message-appear-from-top {
16030 from {
16031 -webkit-transform: translate3d(0, -100%, 0);
16032 transform: translate3d(0, -100%, 0);
16033 }
16034 to {
16035 -webkit-transform: translate3d(0, 0, 0);
16036 transform: translate3d(0, 0, 0);
16037 }
16038}
16039.md .messages-content,
16040.md .messages {
16041 background: #eee;
16042}
16043.md .message {
16044 margin-top: 16px;
16045}
16046.md .message:last-child {
16047 margin-bottom: 16px;
16048}
16049.md .messages-title {
16050 font-size: 12px;
16051 color: rgba(0, 0, 0, 0.51);
16052 margin-top: 16px;
16053}
16054.md .messages-title:last-child {
16055 margin-bottom: 16px;
16056}
16057.md .messages-title b {
16058 font-weight: 500;
16059}
16060.md .message-avatar {
16061 width: 32px;
16062 height: 32px;
16063}
16064.md .message-header,
16065.md .message-footer,
16066.md .message-name {
16067 color: rgba(0, 0, 0, 0.51);
16068}
16069.md .message-header b,
16070.md .message-footer b,
16071.md .message-name b {
16072 font-weight: 500;
16073}
16074.md .message-header,
16075.md .message-name {
16076 margin-bottom: 2px;
16077}
16078.md .message-footer {
16079 margin-top: 2px;
16080}
16081.md .message-bubble {
16082 font-size: 16px;
16083 border-radius: 2px;
16084 padding: 6px 8px;
16085 min-height: 32px;
16086}
16087.md .message-text-header,
16088.md .message-text-footer {
16089 color: rgba(0, 0, 0, 0.51);
16090}
16091.md .message-text-header {
16092 margin-bottom: 4px;
16093}
16094.md .message-text-footer {
16095 margin-top: 4px;
16096}
16097.md .message-received {
16098 margin-left: 8px;
16099}
16100.md .message-received .message-bubble {
16101 color: #333;
16102 background: #fff;
16103}
16104.md .message-received .message-avatar + .message-content {
16105 margin-left: 8px;
16106}
16107.md .message-received.message-tail .message-bubble {
16108 border-radius: 2px 2px 2px 0;
16109}
16110.md .message-received.message-tail .message-bubble:before {
16111 position: absolute;
16112 content: '';
16113 border-left: 8px solid transparent;
16114 border-right: 0 solid transparent;
16115 border-bottom: 8px solid #fff;
16116 right: 100%;
16117 bottom: 0;
16118 width: 0;
16119 height: 0;
16120}
16121.md .message-sent {
16122 margin-right: 8px;
16123}
16124.md .message-sent .message-bubble {
16125 color: #333;
16126 background: #c8e6c9;
16127}
16128.md .message-sent .message-avatar + .message-content {
16129 margin-right: 8px;
16130}
16131.md .message-sent.message-tail .message-bubble {
16132 border-radius: 2px 2px 0 2px;
16133}
16134.md .message-sent.message-tail .message-bubble:before {
16135 position: absolute;
16136 content: '';
16137 border-right: 8px solid transparent;
16138 border-left: 0 solid transparent;
16139 border-bottom: 8px solid #c8e6c9;
16140 left: 100%;
16141 bottom: 0;
16142 width: 0;
16143 height: 0;
16144}
16145.md .message + .message:not(.message-first) {
16146 margin-top: 8px;
16147}
16148.md .message-typing-indicator > div {
16149 width: 6px;
16150 height: 6px;
16151 opacity: 0.6;
16152}
16153.md .message-typing-indicator > div + div {
16154 margin-left: 6px;
16155}
16156.md .message-typing-indicator > div:nth-child(1) {
16157 -webkit-animation: md-message-typing-indicator 900ms infinite;
16158 animation: md-message-typing-indicator 900ms infinite;
16159}
16160.md .message-typing-indicator > div:nth-child(2) {
16161 -webkit-animation: md-message-typing-indicator 900ms 150ms infinite;
16162 animation: md-message-typing-indicator 900ms 150ms infinite;
16163}
16164.md .message-typing-indicator > div:nth-child(3) {
16165 -webkit-animation: md-message-typing-indicator 900ms 300ms infinite;
16166 animation: md-message-typing-indicator 900ms 300ms infinite;
16167}
16168.md .theme-dark .messages-content,
16169.messages-content.md .theme-dark,
16170.md .theme-dark .messages,
16171.messages.md .theme-dark {
16172 background-color: transparent;
16173}
16174.md .theme-dark .messages-title {
16175 color: rgba(255, 255, 255, 0.54);
16176}
16177.md .theme-dark .message-header,
16178.md .theme-dark .message-footer,
16179.md .theme-dark .message-name {
16180 color: rgba(255, 255, 255, 0.54);
16181}
16182@media (orientation: landscape) {
16183 .md.device-iphone-x .ios-left-edge .message-received,
16184 .md.device-iphone-x .ios-edges .message-received,
16185 .md.device-iphone-x .popup .message-received,
16186 .md.device-iphone-x .sheet-modal .message-received,
16187 .md.device-iphone-x .panel-left .message-received {
16188 margin-left: calc(8px + constant(safe-area-inset-left));
16189 margin-left: calc(8px + env(safe-area-inset-left));
16190 }
16191 .md.device-iphone-x .ios-right-edge .message-sent,
16192 .md.device-iphone-x .ios-edges .message-sent,
16193 .md.device-iphone-x .popup .message-sent,
16194 .md.device-iphone-x .sheet-modal .message-sent,
16195 .md.device-iphone-x .panel-right .message-sent {
16196 margin-right: calc(8px + constant(safe-area-inset-right));
16197 margin-right: calc(8px + env(safe-area-inset-right));
16198 }
16199}
16200@-webkit-keyframes md-message-typing-indicator {
16201 0% {
16202 -webkit-transform: translateY(0%);
16203 transform: translateY(0%);
16204 }
16205 25% {
16206 -webkit-transform: translateY(-5px);
16207 transform: translateY(-5px);
16208 }
16209 50% {
16210 -webkit-transform: translateY(0%);
16211 transform: translateY(0%);
16212 }
16213}
16214@keyframes md-message-typing-indicator {
16215 0% {
16216 -webkit-transform: translateY(0%);
16217 transform: translateY(0%);
16218 }
16219 25% {
16220 -webkit-transform: translateY(-5px);
16221 transform: translateY(-5px);
16222 }
16223 50% {
16224 -webkit-transform: translateY(0%);
16225 transform: translateY(0%);
16226 }
16227}
16228/* === Messagebar === */
16229.toolbar.messagebar {
16230 -webkit-transform: translate3d(0, 0, 0);
16231 transform: translate3d(0, 0, 0);
16232 background: #fff;
16233 height: auto;
16234}
16235.toolbar.messagebar .toolbar-inner {
16236 position: relative;
16237}
16238.toolbar.messagebar .messagebar-area {
16239 width: 100%;
16240 -webkit-flex-shrink: 1;
16241 -ms-flex-negative: 1;
16242 flex-shrink: 1;
16243 overflow: hidden;
16244 position: relative;
16245}
16246.toolbar.messagebar textarea {
16247 width: 100%;
16248 -webkit-flex-shrink: 1;
16249 -ms-flex-negative: 1;
16250 flex-shrink: 1;
16251}
16252.toolbar.messagebar a.link {
16253 -webkit-align-self: flex-end;
16254 -ms-flex-item-align: end;
16255 align-self: flex-end;
16256 -webkit-flex-shrink: 0;
16257 -ms-flex-negative: 0;
16258 flex-shrink: 0;
16259}
16260.messagebar-attachments {
16261 width: 100%;
16262 overflow: auto;
16263 -webkit-overflow-scrolling: touch;
16264 font-size: 0;
16265 white-space: nowrap;
16266 -webkit-box-sizing: border-box;
16267 box-sizing: border-box;
16268 position: relative;
16269}
16270.messagebar:not(.messagebar-attachments-visible) .messagebar-attachments {
16271 display: none;
16272}
16273.messagebar-attachment {
16274 background-size: cover;
16275 background-position: center;
16276 background-repeat: no-repeat;
16277 display: inline-block;
16278 vertical-align: middle;
16279 white-space: normal;
16280 height: 155px;
16281 position: relative;
16282}
16283@media (orientation: landscape) {
16284 .messagebar-attachment {
16285 height: 120px;
16286 }
16287}
16288.messagebar-attachment img {
16289 display: block;
16290 width: auto;
16291 height: 100%;
16292}
16293.messagebar-attachment + .messagebar-attachment {
16294 margin-left: 8px;
16295}
16296.messagebar-sheet {
16297 overflow: auto;
16298 -webkit-overflow-scrolling: touch;
16299 display: -webkit-box;
16300 display: -webkit-flex;
16301 display: -ms-flexbox;
16302 display: flex;
16303 -webkit-flex-wrap: wrap;
16304 -ms-flex-wrap: wrap;
16305 flex-wrap: wrap;
16306 -webkit-box-orient: vertical;
16307 -webkit-box-direction: normal;
16308 -webkit-flex-direction: column;
16309 -ms-flex-direction: column;
16310 flex-direction: column;
16311 -webkit-align-content: flex-start;
16312 -ms-flex-line-pack: start;
16313 align-content: flex-start;
16314 height: 252px;
16315}
16316@media (orientation: landscape) {
16317 .messagebar-sheet {
16318 height: 192px;
16319 }
16320}
16321.messagebar-sheet-image,
16322.messagebar-sheet-item {
16323 -webkit-box-sizing: border-box;
16324 box-sizing: border-box;
16325 -webkit-flex-shrink: 0;
16326 -ms-flex-negative: 0;
16327 flex-shrink: 0;
16328 margin-top: 1px;
16329 position: relative;
16330 overflow: hidden;
16331 height: 125px;
16332 width: 125px;
16333 margin-left: 1px;
16334}
16335@media (orientation: landscape) {
16336 .messagebar-sheet-image,
16337 .messagebar-sheet-item {
16338 width: 95px;
16339 height: 95px;
16340 }
16341}
16342.messagebar-sheet-image .icon-checkbox,
16343.messagebar-sheet-item .icon-checkbox,
16344.messagebar-sheet-image .icon-radio,
16345.messagebar-sheet-item .icon-radio {
16346 position: absolute;
16347 right: 8px;
16348 bottom: 8px;
16349}
16350.messagebar-sheet-image {
16351 background-size: cover;
16352 background-position: center;
16353 background-repeat: no-repeat;
16354}
16355.messagebar-attachment-delete {
16356 display: block;
16357 position: absolute;
16358 border-radius: 50%;
16359 -webkit-box-sizing: border-box;
16360 box-sizing: border-box;
16361 cursor: pointer;
16362 -webkit-box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.2);
16363 box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.2);
16364}
16365.messagebar-attachment-delete:after,
16366.messagebar-attachment-delete:before {
16367 position: absolute;
16368 content: '';
16369 left: 50%;
16370 top: 50%;
16371}
16372.messagebar-attachment-delete:after {
16373 -webkit-transform: rotate(45deg);
16374 transform: rotate(45deg);
16375}
16376.messagebar-attachment-delete:before {
16377 -webkit-transform: rotate(-45deg);
16378 transform: rotate(-45deg);
16379}
16380.messagebar:not(.messagebar-sheet-visible) .messagebar-sheet {
16381 display: none;
16382}
16383.ios.device-iphone-x .messagebar:not(.messagebar-top),
16384.md.device-iphone-x .messagebar:not(.messagebar-top) {
16385 height: auto !important;
16386}
16387.ios.device-iphone-x .messagebar:not(.messagebar-top):not(.messagebar-sheet-visible),
16388.md.device-iphone-x .messagebar:not(.messagebar-top):not(.messagebar-sheet-visible) {
16389 padding-bottom: constant(safe-area-inset-bottom);
16390 padding-bottom: env(safe-area-inset-bottom);
16391}
16392.ios.device-iphone-x .messagebar-sheet,
16393.md.device-iphone-x .messagebar-sheet {
16394 padding-left: constant(safe-area-inset-left);
16395 padding-left: env(safe-area-inset-left);
16396 padding-right: constant(safe-area-inset-right);
16397 padding-right: env(safe-area-inset-right);
16398 padding-bottom: constant(safe-area-inset-bottom);
16399 padding-bottom: env(safe-area-inset-bottom);
16400}
16401.md .messagebar {
16402 font-size: 16px;
16403}
16404.md .messagebar:after {
16405 display: none;
16406}
16407.md .messagebar textarea {
16408 padding: 5px 8px;
16409 height: 32px;
16410 color: #333;
16411 font-size: 16px;
16412 line-height: 22px;
16413}
16414.md .messagebar a.link {
16415 color: #333;
16416}
16417.md .messagebar a.link:before {
16418 content: '';
16419 width: 152%;
16420 height: 152%;
16421 position: absolute;
16422 left: -26%;
16423 top: -26%;
16424 background-image: -webkit-radial-gradient(center, circle, rgba(0, 0, 0, 0.1) 66%, rgba(0, 0, 0, 0) 66%);
16425 background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0.1) 66%, rgba(0, 0, 0, 0) 66%);
16426 background-repeat: no-repeat;
16427 background-position: center;
16428 background-size: 100% 100%;
16429 opacity: 0;
16430 pointer-events: none;
16431 -webkit-transition-duration: 600ms;
16432 transition-duration: 600ms;
16433}
16434.md .messagebar a.link.active-state:before {
16435 opacity: 1;
16436 -webkit-transition-duration: 150ms;
16437 transition-duration: 150ms;
16438}
16439.md .messagebar:before {
16440 content: '';
16441 position: absolute;
16442 background-color: #d1d1d1;
16443 display: block;
16444 z-index: 15;
16445 top: 0;
16446 right: auto;
16447 bottom: auto;
16448 left: 0;
16449 height: 1px;
16450 width: 100%;
16451 -webkit-transform-origin: 50% 0%;
16452 transform-origin: 50% 0%;
16453}
16454.md.device-pixel-ratio-2 .messagebar:before {
16455 -webkit-transform: scaleY(0.5);
16456 transform: scaleY(0.5);
16457}
16458.md.device-pixel-ratio-3 .messagebar:before {
16459 -webkit-transform: scaleY(0.33);
16460 transform: scaleY(0.33);
16461}
16462.md .messagebar-attachments {
16463 padding: 8px;
16464 border-bottom: 1px solid #ddd;
16465}
16466.md .messagebar-area {
16467 margin-top: 8px;
16468 margin-bottom: 8px;
16469}
16470.md .messagebar-sheet {
16471 background: #fff;
16472}
16473.md .messagebar-sheet-image .icon-checkbox,
16474.md .messagebar-sheet-item .icon-checkbox {
16475 border-color: #fff;
16476 background: rgba(255, 255, 255, 0.25);
16477 -webkit-box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.5);
16478 box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.5);
16479}
16480.md .messagebar-attachment-delete {
16481 right: 8px;
16482 top: 8px;
16483 width: 24px;
16484 height: 24px;
16485 background: #2196f3;
16486 cursor: pointer;
16487 border-radius: 2px;
16488}
16489.md .messagebar-attachment-delete:after,
16490.md .messagebar-attachment-delete:before {
16491 width: 14px;
16492 height: 2px;
16493 background: #fff;
16494 margin-left: -7px;
16495 margin-top: -1px;
16496}
16497.md .theme-dark .messagebar,
16498.messagebar.md .theme-dark {
16499 background: #000;
16500}
16501.md .theme-dark .messagebar:before,
16502.messagebar.md .theme-dark:before {
16503 background-color: rgba(255, 255, 255, 0.2);
16504}
16505.md .theme-dark .messagebar a.link,
16506.messagebar.md .theme-dark a.link {
16507 color: rgba(255, 255, 255, 0.87);
16508}
16509.md .theme-dark .messagebar a.link:before,
16510.messagebar.md .theme-dark a.link:before {
16511 content: '';
16512 width: 152%;
16513 height: 152%;
16514 position: absolute;
16515 left: -26%;
16516 top: -26%;
16517 background-image: -webkit-radial-gradient(center, circle, rgba(255, 255, 255, 0.15) 66%, rgba(255, 255, 255, 0) 66%);
16518 background-image: radial-gradient(circle at center, rgba(255, 255, 255, 0.15) 66%, rgba(255, 255, 255, 0) 66%);
16519 background-repeat: no-repeat;
16520 background-position: center;
16521 background-size: 100% 100%;
16522 opacity: 0;
16523 pointer-events: none;
16524 -webkit-transition-duration: 600ms;
16525 transition-duration: 600ms;
16526}
16527.md .theme-dark .messagebar a.link.active-state:before,
16528.messagebar.md .theme-dark a.link.active-state:before {
16529 opacity: 1;
16530 -webkit-transition-duration: 150ms;
16531 transition-duration: 150ms;
16532}
16533.md .theme-dark .messagebar textarea,
16534.messagebar.md .theme-dark textarea {
16535 color: rgba(255, 255, 255, 0.87);
16536}
16537.md .theme-dark .messagebar-attachments {
16538 border-bottom-color: rgba(255, 255, 255, 0.2);
16539}
16540/* === Swiper === */
16541.swiper-container {
16542 margin: 0 auto;
16543 position: relative;
16544 overflow: hidden;
16545 list-style: none;
16546 padding: 0;
16547 /* Fix of Webkit flickering */
16548 z-index: 1;
16549}
16550.swiper-container-no-flexbox .swiper-slide {
16551 float: left;
16552}
16553.swiper-container-vertical > .swiper-wrapper {
16554 -webkit-box-orient: vertical;
16555 -webkit-box-direction: normal;
16556 -webkit-flex-direction: column;
16557 -ms-flex-direction: column;
16558 flex-direction: column;
16559}
16560.swiper-wrapper {
16561 position: relative;
16562 width: 100%;
16563 height: 100%;
16564 z-index: 1;
16565 display: -webkit-box;
16566 display: -webkit-flex;
16567 display: -ms-flexbox;
16568 display: flex;
16569 -webkit-transition-property: -webkit-transform;
16570 transition-property: -webkit-transform;
16571 transition-property: transform;
16572 transition-property: transform, -webkit-transform;
16573 -webkit-box-sizing: content-box;
16574 box-sizing: content-box;
16575}
16576.swiper-container-android .swiper-slide,
16577.swiper-wrapper {
16578 -webkit-transform: translate3d(0px, 0, 0);
16579 transform: translate3d(0px, 0, 0);
16580}
16581.swiper-container-multirow > .swiper-wrapper {
16582 -webkit-flex-wrap: wrap;
16583 -ms-flex-wrap: wrap;
16584 flex-wrap: wrap;
16585}
16586.swiper-container-free-mode > .swiper-wrapper {
16587 -webkit-transition-timing-function: ease-out;
16588 transition-timing-function: ease-out;
16589 margin: 0 auto;
16590}
16591.swiper-slide {
16592 -webkit-flex-shrink: 0;
16593 -ms-flex-negative: 0;
16594 flex-shrink: 0;
16595 width: 100%;
16596 height: 100%;
16597 position: relative;
16598 -webkit-transition-property: -webkit-transform;
16599 transition-property: -webkit-transform;
16600 transition-property: transform;
16601 transition-property: transform, -webkit-transform;
16602}
16603.swiper-slide-invisible-blank {
16604 visibility: hidden;
16605}
16606/* Auto Height */
16607.swiper-container-autoheight,
16608.swiper-container-autoheight .swiper-slide {
16609 height: auto;
16610}
16611.swiper-container-autoheight .swiper-wrapper {
16612 -webkit-box-align: start;
16613 -webkit-align-items: flex-start;
16614 -ms-flex-align: start;
16615 align-items: flex-start;
16616 -webkit-transition-property: height, -webkit-transform;
16617 transition-property: height, -webkit-transform;
16618 transition-property: transform, height;
16619 transition-property: transform, height, -webkit-transform;
16620}
16621/* 3D Effects */
16622.swiper-container-3d {
16623 -webkit-perspective: 1200px;
16624 perspective: 1200px;
16625}
16626.swiper-container-3d .swiper-wrapper,
16627.swiper-container-3d .swiper-slide,
16628.swiper-container-3d .swiper-slide-shadow-left,
16629.swiper-container-3d .swiper-slide-shadow-right,
16630.swiper-container-3d .swiper-slide-shadow-top,
16631.swiper-container-3d .swiper-slide-shadow-bottom,
16632.swiper-container-3d .swiper-cube-shadow {
16633 -webkit-transform-style: preserve-3d;
16634 transform-style: preserve-3d;
16635}
16636.swiper-container-3d .swiper-slide-shadow-left,
16637.swiper-container-3d .swiper-slide-shadow-right,
16638.swiper-container-3d .swiper-slide-shadow-top,
16639.swiper-container-3d .swiper-slide-shadow-bottom {
16640 position: absolute;
16641 left: 0;
16642 top: 0;
16643 width: 100%;
16644 height: 100%;
16645 pointer-events: none;
16646 z-index: 10;
16647}
16648.swiper-container-3d .swiper-slide-shadow-left {
16649 background-image: -webkit-gradient(linear, right top, left top, from(rgba(0, 0, 0, 0.5)), to(rgba(0, 0, 0, 0)));
16650 background-image: -webkit-linear-gradient(right, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
16651 background-image: linear-gradient(to left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
16652}
16653.swiper-container-3d .swiper-slide-shadow-right {
16654 background-image: -webkit-gradient(linear, left top, right top, from(rgba(0, 0, 0, 0.5)), to(rgba(0, 0, 0, 0)));
16655 background-image: -webkit-linear-gradient(left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
16656 background-image: linear-gradient(to right, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
16657}
16658.swiper-container-3d .swiper-slide-shadow-top {
16659 background-image: -webkit-gradient(linear, left bottom, left top, from(rgba(0, 0, 0, 0.5)), to(rgba(0, 0, 0, 0)));
16660 background-image: -webkit-linear-gradient(bottom, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
16661 background-image: linear-gradient(to top, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
16662}
16663.swiper-container-3d .swiper-slide-shadow-bottom {
16664 background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0.5)), to(rgba(0, 0, 0, 0)));
16665 background-image: -webkit-linear-gradient(top, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
16666 background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
16667}
16668/* IE10 Windows Phone 8 Fixes */
16669.swiper-container-wp8-horizontal,
16670.swiper-container-wp8-horizontal > .swiper-wrapper {
16671 -ms-touch-action: pan-y;
16672 touch-action: pan-y;
16673}
16674.swiper-container-wp8-vertical,
16675.swiper-container-wp8-vertical > .swiper-wrapper {
16676 -ms-touch-action: pan-x;
16677 touch-action: pan-x;
16678}
16679/* a11y */
16680.swiper-container .swiper-notification {
16681 position: absolute;
16682 left: 0;
16683 top: 0;
16684 pointer-events: none;
16685 opacity: 0;
16686 z-index: -1000;
16687}
16688.swiper-container-coverflow .swiper-wrapper {
16689 /* Windows 8 IE 10 fix */
16690 -ms-perspective: 1200px;
16691}
16692.swiper-container-cube {
16693 overflow: visible;
16694}
16695.swiper-container-cube .swiper-slide {
16696 pointer-events: none;
16697 -webkit-backface-visibility: hidden;
16698 backface-visibility: hidden;
16699 z-index: 1;
16700 visibility: hidden;
16701 -webkit-transform-origin: 0 0;
16702 transform-origin: 0 0;
16703 width: 100%;
16704 height: 100%;
16705}
16706.swiper-container-cube .swiper-slide .swiper-slide {
16707 pointer-events: none;
16708}
16709.swiper-container-cube.swiper-container-rtl .swiper-slide {
16710 -webkit-transform-origin: 100% 0;
16711 transform-origin: 100% 0;
16712}
16713.swiper-container-cube .swiper-slide-active,
16714.swiper-container-cube .swiper-slide-active .swiper-slide-active {
16715 pointer-events: auto;
16716}
16717.swiper-container-cube .swiper-slide-active,
16718.swiper-container-cube .swiper-slide-next,
16719.swiper-container-cube .swiper-slide-prev,
16720.swiper-container-cube .swiper-slide-next + .swiper-slide {
16721 pointer-events: auto;
16722 visibility: visible;
16723}
16724.swiper-container-cube .swiper-slide-shadow-top,
16725.swiper-container-cube .swiper-slide-shadow-bottom,
16726.swiper-container-cube .swiper-slide-shadow-left,
16727.swiper-container-cube .swiper-slide-shadow-right {
16728 z-index: 0;
16729 -webkit-backface-visibility: hidden;
16730 backface-visibility: hidden;
16731}
16732.swiper-container-cube .swiper-cube-shadow {
16733 position: absolute;
16734 left: 0;
16735 bottom: 0px;
16736 width: 100%;
16737 height: 100%;
16738 background: #000;
16739 opacity: 0.6;
16740 -webkit-filter: blur(50px);
16741 filter: blur(50px);
16742 z-index: 0;
16743}
16744.swiper-container-fade.swiper-container-free-mode .swiper-slide {
16745 -webkit-transition-timing-function: ease-out;
16746 transition-timing-function: ease-out;
16747}
16748.swiper-container-fade .swiper-slide {
16749 pointer-events: none;
16750 -webkit-transition-property: opacity;
16751 transition-property: opacity;
16752}
16753.swiper-container-fade .swiper-slide .swiper-slide {
16754 pointer-events: none;
16755}
16756.swiper-container-fade .swiper-slide-active,
16757.swiper-container-fade .swiper-slide-active .swiper-slide-active {
16758 pointer-events: auto;
16759}
16760.swiper-container-flip {
16761 overflow: visible;
16762}
16763.swiper-container-flip .swiper-slide {
16764 pointer-events: none;
16765 -webkit-backface-visibility: hidden;
16766 backface-visibility: hidden;
16767 z-index: 1;
16768}
16769.swiper-container-flip .swiper-slide .swiper-slide {
16770 pointer-events: none;
16771}
16772.swiper-container-flip .swiper-slide-active,
16773.swiper-container-flip .swiper-slide-active .swiper-slide-active {
16774 pointer-events: auto;
16775}
16776.swiper-container-flip .swiper-slide-shadow-top,
16777.swiper-container-flip .swiper-slide-shadow-bottom,
16778.swiper-container-flip .swiper-slide-shadow-left,
16779.swiper-container-flip .swiper-slide-shadow-right {
16780 z-index: 0;
16781 -webkit-backface-visibility: hidden;
16782 backface-visibility: hidden;
16783}
16784/* Scrollbar */
16785.swiper-scrollbar {
16786 border-radius: 10px;
16787 position: relative;
16788 -ms-touch-action: none;
16789 background: rgba(0, 0, 0, 0.1);
16790}
16791.swiper-container-horizontal > .swiper-scrollbar {
16792 position: absolute;
16793 left: 1%;
16794 bottom: 3px;
16795 z-index: 50;
16796 height: 5px;
16797 width: 98%;
16798}
16799.swiper-container-vertical > .swiper-scrollbar {
16800 position: absolute;
16801 right: 3px;
16802 top: 1%;
16803 z-index: 50;
16804 width: 5px;
16805 height: 98%;
16806}
16807.swiper-scrollbar-drag {
16808 height: 100%;
16809 width: 100%;
16810 position: relative;
16811 background: rgba(0, 0, 0, 0.5);
16812 border-radius: 10px;
16813 left: 0;
16814 top: 0;
16815}
16816.swiper-scrollbar-cursor-drag {
16817 cursor: move;
16818}
16819.swiper-scrollbar-lock {
16820 display: none;
16821}
16822.swiper-zoom-container {
16823 width: 100%;
16824 height: 100%;
16825 display: -webkit-box;
16826 display: -webkit-flex;
16827 display: -ms-flexbox;
16828 display: flex;
16829 -webkit-box-pack: center;
16830 -webkit-justify-content: center;
16831 -ms-flex-pack: center;
16832 justify-content: center;
16833 -webkit-box-align: center;
16834 -webkit-align-items: center;
16835 -ms-flex-align: center;
16836 align-items: center;
16837 text-align: center;
16838}
16839.swiper-zoom-container > img,
16840.swiper-zoom-container > svg,
16841.swiper-zoom-container > canvas {
16842 max-width: 100%;
16843 max-height: 100%;
16844 -o-object-fit: contain;
16845 object-fit: contain;
16846}
16847.swiper-slide-zoomed {
16848 cursor: move;
16849}
16850.swiper-button-prev,
16851.swiper-button-next {
16852 position: absolute;
16853 top: 50%;
16854 width: 27px;
16855 height: 44px;
16856 margin-top: -22px;
16857 z-index: 10;
16858 cursor: pointer;
16859 background-size: 27px 44px;
16860 background-position: center;
16861 background-repeat: no-repeat;
16862}
16863.swiper-button-prev.swiper-button-disabled,
16864.swiper-button-next.swiper-button-disabled {
16865 opacity: 0.35;
16866 cursor: auto;
16867 pointer-events: none;
16868}
16869.swiper-button-prev,
16870.swiper-container-rtl .swiper-button-next {
16871 left: 10px;
16872 right: auto;
16873}
16874.swiper-button-next,
16875.swiper-container-rtl .swiper-button-prev {
16876 right: 10px;
16877 left: auto;
16878}
16879.swiper-pagination {
16880 position: absolute;
16881 text-align: center;
16882 -webkit-transition: 300ms opacity;
16883 transition: 300ms opacity;
16884 -webkit-transform: translate3d(0, 0, 0);
16885 transform: translate3d(0, 0, 0);
16886 z-index: 10;
16887}
16888.swiper-pagination.swiper-pagination-hidden {
16889 opacity: 0;
16890}
16891.swiper-pagination-fraction,
16892.swiper-pagination-custom,
16893.swiper-container-horizontal > .swiper-pagination-bullets {
16894 bottom: 10px;
16895 left: 0;
16896 width: 100%;
16897}
16898.swiper-pagination-bullets-dynamic {
16899 overflow: hidden;
16900 font-size: 0;
16901}
16902.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
16903 -webkit-transform: scale(0.33);
16904 transform: scale(0.33);
16905 position: relative;
16906}
16907.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active {
16908 -webkit-transform: scale(1);
16909 transform: scale(1);
16910}
16911.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev {
16912 -webkit-transform: scale(0.66);
16913 transform: scale(0.66);
16914}
16915.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev-prev {
16916 -webkit-transform: scale(0.33);
16917 transform: scale(0.33);
16918}
16919.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next {
16920 -webkit-transform: scale(0.66);
16921 transform: scale(0.66);
16922}
16923.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next-next {
16924 -webkit-transform: scale(0.33);
16925 transform: scale(0.33);
16926}
16927.swiper-pagination-bullet {
16928 width: 8px;
16929 height: 8px;
16930 display: inline-block;
16931 border-radius: 100%;
16932 background: #000;
16933 opacity: 0.2;
16934}
16935button.swiper-pagination-bullet {
16936 border: none;
16937 margin: 0;
16938 padding: 0;
16939 -webkit-box-shadow: none;
16940 box-shadow: none;
16941 -webkit-appearance: none;
16942 -moz-appearance: none;
16943 appearance: none;
16944}
16945.swiper-pagination-clickable .swiper-pagination-bullet {
16946 cursor: pointer;
16947}
16948.swiper-pagination-bullet-active {
16949 opacity: 1;
16950}
16951.swiper-container-vertical > .swiper-pagination-bullets {
16952 right: 10px;
16953 top: 50%;
16954 -webkit-transform: translate3d(0px, -50%, 0);
16955 transform: translate3d(0px, -50%, 0);
16956}
16957.swiper-container-vertical > .swiper-pagination-bullets .swiper-pagination-bullet {
16958 margin: 6px 0;
16959 display: block;
16960}
16961.swiper-container-vertical > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic {
16962 top: 50%;
16963 -webkit-transform: translateY(-50%);
16964 transform: translateY(-50%);
16965 width: 8px;
16966}
16967.swiper-container-vertical > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
16968 display: inline-block;
16969 -webkit-transition: 200ms top, 200ms -webkit-transform;
16970 transition: 200ms top, 200ms -webkit-transform;
16971 transition: 200ms transform, 200ms top;
16972 transition: 200ms transform, 200ms top, 200ms -webkit-transform;
16973}
16974.swiper-container-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet {
16975 margin: 0 4px;
16976}
16977.swiper-container-horizontal > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic {
16978 left: 50%;
16979 -webkit-transform: translateX(-50%);
16980 transform: translateX(-50%);
16981 white-space: nowrap;
16982}
16983.swiper-container-horizontal > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
16984 -webkit-transition: 200ms left, 200ms -webkit-transform;
16985 transition: 200ms left, 200ms -webkit-transform;
16986 transition: 200ms transform, 200ms left;
16987 transition: 200ms transform, 200ms left, 200ms -webkit-transform;
16988}
16989.swiper-pagination-progressbar {
16990 background: rgba(0, 0, 0, 0.25);
16991 position: absolute;
16992}
16993.swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
16994 position: absolute;
16995 left: 0;
16996 top: 0;
16997 width: 100%;
16998 height: 100%;
16999 -webkit-transform: scale(0);
17000 transform: scale(0);
17001 -webkit-transform-origin: left top;
17002 transform-origin: left top;
17003}
17004.swiper-container-rtl .swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
17005 -webkit-transform-origin: right top;
17006 transform-origin: right top;
17007}
17008.swiper-container-horizontal > .swiper-pagination-progressbar,
17009.swiper-container-vertical > .swiper-pagination-progressbar.swiper-pagination-progressbar-opposite {
17010 width: 100%;
17011 height: 4px;
17012 left: 0;
17013 top: 0;
17014}
17015.swiper-container-vertical > .swiper-pagination-progressbar,
17016.swiper-container-horizontal > .swiper-pagination-progressbar.swiper-pagination-progressbar-opposite {
17017 width: 4px;
17018 height: 100%;
17019 left: 0;
17020 top: 0;
17021}
17022.swiper-lazy-preloader {
17023 position: absolute;
17024 left: 50%;
17025 top: 50%;
17026 z-index: 10;
17027}
17028.md .swiper-lazy-preloader {
17029 width: 32px;
17030 height: 32px;
17031 margin-left: -16px;
17032 margin-top: -16px;
17033}
17034.md .swiper-button-prev,
17035.md .swiper-container-rtl .swiper-button-next {
17036 background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%232196f3'%2F%3E%3C%2Fsvg%3E");
17037}
17038.md .swiper-button-next,
17039.md .swiper-container-rtl .swiper-button-prev {
17040 background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%232196f3'%2F%3E%3C%2Fsvg%3E");
17041}
17042.md .swiper-pagination-bullet-active {
17043 background: #2196f3;
17044}
17045.md .swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
17046 background: #2196f3;
17047}
17048.md .swiper-button-prev.color-red,
17049.md .swiper-container-rtl .swiper-button-next.color-red,
17050.md .color-theme-red .swiper-button-prev,
17051.md .color-theme-red .swiper-container-rtl .swiper-button-next {
17052 background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23f44336'%2F%3E%3C%2Fsvg%3E");
17053}
17054.md .swiper-button-next.color-red,
17055.md .swiper-container-rtl .swiper-button-prev.color-red,
17056.md .color-theme-red .swiper-button-next,
17057.md .color-theme-red .swiper-container-rtl .swiper-button-prev {
17058 background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23f44336'%2F%3E%3C%2Fsvg%3E");
17059}
17060.md .color-red .swiper-pagination-bullet-active,
17061.md .color-theme-red .swiper-pagination-bullet-active {
17062 background: #f44336;
17063}
17064.md .color-red .swiper-pagination-progressbar,
17065.md .color-theme-red .swiper-pagination-progressbar,
17066.md .color-red.swiper-pagination-progressbar,
17067.md .color-theme-red.swiper-pagination-progressbar {
17068 background: rgba(244, 67, 54, 0.25);
17069}
17070.md .color-red .swiper-pagination-progressbar .swiper-pagination-progressbar-fill,
17071.md .color-theme-red .swiper-pagination-progressbar .swiper-pagination-progressbar-fill,
17072.md .color-red.swiper-pagination-progressbar .swiper-pagination-progressbar-fill,
17073.md .color-theme-red.swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
17074 background: #f44336;
17075}
17076.md .swiper-button-prev.color-green,
17077.md .swiper-container-rtl .swiper-button-next.color-green,
17078.md .color-theme-green .swiper-button-prev,
17079.md .color-theme-green .swiper-container-rtl .swiper-button-next {
17080 background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%234caf50'%2F%3E%3C%2Fsvg%3E");
17081}
17082.md .swiper-button-next.color-green,
17083.md .swiper-container-rtl .swiper-button-prev.color-green,
17084.md .color-theme-green .swiper-button-next,
17085.md .color-theme-green .swiper-container-rtl .swiper-button-prev {
17086 background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%234caf50'%2F%3E%3C%2Fsvg%3E");
17087}
17088.md .color-green .swiper-pagination-bullet-active,
17089.md .color-theme-green .swiper-pagination-bullet-active {
17090 background: #4caf50;
17091}
17092.md .color-green .swiper-pagination-progressbar,
17093.md .color-theme-green .swiper-pagination-progressbar,
17094.md .color-green.swiper-pagination-progressbar,
17095.md .color-theme-green.swiper-pagination-progressbar {
17096 background: rgba(76, 175, 80, 0.25);
17097}
17098.md .color-green .swiper-pagination-progressbar .swiper-pagination-progressbar-fill,
17099.md .color-theme-green .swiper-pagination-progressbar .swiper-pagination-progressbar-fill,
17100.md .color-green.swiper-pagination-progressbar .swiper-pagination-progressbar-fill,
17101.md .color-theme-green.swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
17102 background: #4caf50;
17103}
17104.md .swiper-button-prev.color-blue,
17105.md .swiper-container-rtl .swiper-button-next.color-blue,
17106.md .color-theme-blue .swiper-button-prev,
17107.md .color-theme-blue .swiper-container-rtl .swiper-button-next {
17108 background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%232196f3'%2F%3E%3C%2Fsvg%3E");
17109}
17110.md .swiper-button-next.color-blue,
17111.md .swiper-container-rtl .swiper-button-prev.color-blue,
17112.md .color-theme-blue .swiper-button-next,
17113.md .color-theme-blue .swiper-container-rtl .swiper-button-prev {
17114 background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%232196f3'%2F%3E%3C%2Fsvg%3E");
17115}
17116.md .color-blue .swiper-pagination-bullet-active,
17117.md .color-theme-blue .swiper-pagination-bullet-active {
17118 background: #2196f3;
17119}
17120.md .color-blue .swiper-pagination-progressbar,
17121.md .color-theme-blue .swiper-pagination-progressbar,
17122.md .color-blue.swiper-pagination-progressbar,
17123.md .color-theme-blue.swiper-pagination-progressbar {
17124 background: rgba(33, 150, 243, 0.25);
17125}
17126.md .color-blue .swiper-pagination-progressbar .swiper-pagination-progressbar-fill,
17127.md .color-theme-blue .swiper-pagination-progressbar .swiper-pagination-progressbar-fill,
17128.md .color-blue.swiper-pagination-progressbar .swiper-pagination-progressbar-fill,
17129.md .color-theme-blue.swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
17130 background: #2196f3;
17131}
17132.md .swiper-button-prev.color-pink,
17133.md .swiper-container-rtl .swiper-button-next.color-pink,
17134.md .color-theme-pink .swiper-button-prev,
17135.md .color-theme-pink .swiper-container-rtl .swiper-button-next {
17136 background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23e91e63'%2F%3E%3C%2Fsvg%3E");
17137}
17138.md .swiper-button-next.color-pink,
17139.md .swiper-container-rtl .swiper-button-prev.color-pink,
17140.md .color-theme-pink .swiper-button-next,
17141.md .color-theme-pink .swiper-container-rtl .swiper-button-prev {
17142 background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23e91e63'%2F%3E%3C%2Fsvg%3E");
17143}
17144.md .color-pink .swiper-pagination-bullet-active,
17145.md .color-theme-pink .swiper-pagination-bullet-active {
17146 background: #e91e63;
17147}
17148.md .color-pink .swiper-pagination-progressbar,
17149.md .color-theme-pink .swiper-pagination-progressbar,
17150.md .color-pink.swiper-pagination-progressbar,
17151.md .color-theme-pink.swiper-pagination-progressbar {
17152 background: rgba(233, 30, 99, 0.25);
17153}
17154.md .color-pink .swiper-pagination-progressbar .swiper-pagination-progressbar-fill,
17155.md .color-theme-pink .swiper-pagination-progressbar .swiper-pagination-progressbar-fill,
17156.md .color-pink.swiper-pagination-progressbar .swiper-pagination-progressbar-fill,
17157.md .color-theme-pink.swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
17158 background: #e91e63;
17159}
17160.md .swiper-button-prev.color-yellow,
17161.md .swiper-container-rtl .swiper-button-next.color-yellow,
17162.md .color-theme-yellow .swiper-button-prev,
17163.md .color-theme-yellow .swiper-container-rtl .swiper-button-next {
17164 background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23ffeb3b'%2F%3E%3C%2Fsvg%3E");
17165}
17166.md .swiper-button-next.color-yellow,
17167.md .swiper-container-rtl .swiper-button-prev.color-yellow,
17168.md .color-theme-yellow .swiper-button-next,
17169.md .color-theme-yellow .swiper-container-rtl .swiper-button-prev {
17170 background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23ffeb3b'%2F%3E%3C%2Fsvg%3E");
17171}
17172.md .color-yellow .swiper-pagination-bullet-active,
17173.md .color-theme-yellow .swiper-pagination-bullet-active {
17174 background: #ffeb3b;
17175}
17176.md .color-yellow .swiper-pagination-progressbar,
17177.md .color-theme-yellow .swiper-pagination-progressbar,
17178.md .color-yellow.swiper-pagination-progressbar,
17179.md .color-theme-yellow.swiper-pagination-progressbar {
17180 background: rgba(255, 235, 59, 0.25);
17181}
17182.md .color-yellow .swiper-pagination-progressbar .swiper-pagination-progressbar-fill,
17183.md .color-theme-yellow .swiper-pagination-progressbar .swiper-pagination-progressbar-fill,
17184.md .color-yellow.swiper-pagination-progressbar .swiper-pagination-progressbar-fill,
17185.md .color-theme-yellow.swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
17186 background: #ffeb3b;
17187}
17188.md .swiper-button-prev.color-orange,
17189.md .swiper-container-rtl .swiper-button-next.color-orange,
17190.md .color-theme-orange .swiper-button-prev,
17191.md .color-theme-orange .swiper-container-rtl .swiper-button-next {
17192 background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23ff9800'%2F%3E%3C%2Fsvg%3E");
17193}
17194.md .swiper-button-next.color-orange,
17195.md .swiper-container-rtl .swiper-button-prev.color-orange,
17196.md .color-theme-orange .swiper-button-next,
17197.md .color-theme-orange .swiper-container-rtl .swiper-button-prev {
17198 background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23ff9800'%2F%3E%3C%2Fsvg%3E");
17199}
17200.md .color-orange .swiper-pagination-bullet-active,
17201.md .color-theme-orange .swiper-pagination-bullet-active {
17202 background: #ff9800;
17203}
17204.md .color-orange .swiper-pagination-progressbar,
17205.md .color-theme-orange .swiper-pagination-progressbar,
17206.md .color-orange.swiper-pagination-progressbar,
17207.md .color-theme-orange.swiper-pagination-progressbar {
17208 background: rgba(255, 152, 0, 0.25);
17209}
17210.md .color-orange .swiper-pagination-progressbar .swiper-pagination-progressbar-fill,
17211.md .color-theme-orange .swiper-pagination-progressbar .swiper-pagination-progressbar-fill,
17212.md .color-orange.swiper-pagination-progressbar .swiper-pagination-progressbar-fill,
17213.md .color-theme-orange.swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
17214 background: #ff9800;
17215}
17216.md .swiper-button-prev.color-gray,
17217.md .swiper-container-rtl .swiper-button-next.color-gray,
17218.md .color-theme-gray .swiper-button-prev,
17219.md .color-theme-gray .swiper-container-rtl .swiper-button-next {
17220 background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%239e9e9e'%2F%3E%3C%2Fsvg%3E");
17221}
17222.md .swiper-button-next.color-gray,
17223.md .swiper-container-rtl .swiper-button-prev.color-gray,
17224.md .color-theme-gray .swiper-button-next,
17225.md .color-theme-gray .swiper-container-rtl .swiper-button-prev {
17226 background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%239e9e9e'%2F%3E%3C%2Fsvg%3E");
17227}
17228.md .color-gray .swiper-pagination-bullet-active,
17229.md .color-theme-gray .swiper-pagination-bullet-active {
17230 background: #9e9e9e;
17231}
17232.md .color-gray .swiper-pagination-progressbar,
17233.md .color-theme-gray .swiper-pagination-progressbar,
17234.md .color-gray.swiper-pagination-progressbar,
17235.md .color-theme-gray.swiper-pagination-progressbar {
17236 background: rgba(158, 158, 158, 0.25);
17237}
17238.md .color-gray .swiper-pagination-progressbar .swiper-pagination-progressbar-fill,
17239.md .color-theme-gray .swiper-pagination-progressbar .swiper-pagination-progressbar-fill,
17240.md .color-gray.swiper-pagination-progressbar .swiper-pagination-progressbar-fill,
17241.md .color-theme-gray.swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
17242 background: #9e9e9e;
17243}
17244.md .swiper-button-prev.color-white,
17245.md .swiper-container-rtl .swiper-button-next.color-white,
17246.md .color-theme-white .swiper-button-prev,
17247.md .color-theme-white .swiper-container-rtl .swiper-button-next {
17248 background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E");
17249}
17250.md .swiper-button-next.color-white,
17251.md .swiper-container-rtl .swiper-button-prev.color-white,
17252.md .color-theme-white .swiper-button-next,
17253.md .color-theme-white .swiper-container-rtl .swiper-button-prev {
17254 background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E");
17255}
17256.md .color-white .swiper-pagination-bullet-active,
17257.md .color-theme-white .swiper-pagination-bullet-active {
17258 background: #ffffff;
17259}
17260.md .color-white .swiper-pagination-progressbar,
17261.md .color-theme-white .swiper-pagination-progressbar,
17262.md .color-white.swiper-pagination-progressbar,
17263.md .color-theme-white.swiper-pagination-progressbar {
17264 background: rgba(255, 255, 255, 0.25);
17265}
17266.md .color-white .swiper-pagination-progressbar .swiper-pagination-progressbar-fill,
17267.md .color-theme-white .swiper-pagination-progressbar .swiper-pagination-progressbar-fill,
17268.md .color-white.swiper-pagination-progressbar .swiper-pagination-progressbar-fill,
17269.md .color-theme-white.swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
17270 background: #ffffff;
17271}
17272.md .swiper-button-prev.color-black,
17273.md .swiper-container-rtl .swiper-button-next.color-black,
17274.md .color-theme-black .swiper-button-prev,
17275.md .color-theme-black .swiper-container-rtl .swiper-button-next {
17276 background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23000000'%2F%3E%3C%2Fsvg%3E");
17277}
17278.md .swiper-button-next.color-black,
17279.md .swiper-container-rtl .swiper-button-prev.color-black,
17280.md .color-theme-black .swiper-button-next,
17281.md .color-theme-black .swiper-container-rtl .swiper-button-prev {
17282 background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23000000'%2F%3E%3C%2Fsvg%3E");
17283}
17284.md .color-black .swiper-pagination-bullet-active,
17285.md .color-theme-black .swiper-pagination-bullet-active {
17286 background: #000000;
17287}
17288.md .color-black .swiper-pagination-progressbar,
17289.md .color-theme-black .swiper-pagination-progressbar,
17290.md .color-black.swiper-pagination-progressbar,
17291.md .color-theme-black.swiper-pagination-progressbar {
17292 background: rgba(0, 0, 0, 0.25);
17293}
17294.md .color-black .swiper-pagination-progressbar .swiper-pagination-progressbar-fill,
17295.md .color-theme-black .swiper-pagination-progressbar .swiper-pagination-progressbar-fill,
17296.md .color-black.swiper-pagination-progressbar .swiper-pagination-progressbar-fill,
17297.md .color-theme-black.swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
17298 background: #000000;
17299}
17300/* === Photo Browser === */
17301.photo-browser {
17302 position: absolute;
17303 left: 0;
17304 top: 0;
17305 width: 100%;
17306 height: 100%;
17307 z-index: 400;
17308}
17309.photo-browser-standalone.modal-in {
17310 -webkit-transition-duration: 0ms;
17311 transition-duration: 0ms;
17312 -webkit-animation: photo-browser-in 400ms;
17313 animation: photo-browser-in 400ms;
17314}
17315.photo-browser-standalone.modal-out {
17316 -webkit-transition-duration: 0ms;
17317 transition-duration: 0ms;
17318 -webkit-animation: photo-browser-out 400ms;
17319 animation: photo-browser-out 400ms;
17320}
17321.photo-browser-standalone.modal-out.swipe-close-to-bottom,
17322.photo-browser-standalone.modal-out.swipe-close-to-top {
17323 -webkit-animation: none;
17324 animation: none;
17325}
17326.photo-browser-popup.modal-out.swipe-close-to-bottom,
17327.photo-browser-popup.modal-out.swipe-close-to-top {
17328 -webkit-transition-duration: 300ms;
17329 transition-duration: 300ms;
17330}
17331.photo-browser-popup.modal-out.swipe-close-to-bottom {
17332 -webkit-transform: translate3d(0, 100%, 0);
17333 transform: translate3d(0, 100%, 0);
17334}
17335.photo-browser-popup.modal-out.swipe-close-to-top {
17336 -webkit-transform: translate3d(0, -100vh, 0);
17337 transform: translate3d(0, -100vh, 0);
17338}
17339.page.photo-browser-page {
17340 background: none;
17341}
17342.photo-browser-popup {
17343 background: none;
17344}
17345.photo-browser-exposed .navbar,
17346.photo-browser-exposed .toolbar {
17347 opacity: 0;
17348 visibility: hidden;
17349 pointer-events: none;
17350}
17351.photo-browser-exposed .photo-browser-swiper-container {
17352 background: #000;
17353}
17354.photo-browser-of {
17355 margin: 0 5px;
17356}
17357.photo-browser-captions {
17358 pointer-events: none;
17359 position: absolute;
17360 left: 0;
17361 width: 100%;
17362 bottom: 0;
17363 z-index: 10;
17364 opacity: 1;
17365 -webkit-transition: 400ms;
17366 transition: 400ms;
17367}
17368.photo-browser-captions.photo-browser-captions-exposed {
17369 opacity: 0;
17370}
17371.photo-browser-caption {
17372 -webkit-box-sizing: border-box;
17373 box-sizing: border-box;
17374 -webkit-transition: 300ms;
17375 transition: 300ms;
17376 position: absolute;
17377 bottom: 0;
17378 left: 0;
17379 opacity: 0;
17380 padding: 4px 5px;
17381 width: 100%;
17382 text-align: center;
17383 color: #fff;
17384 background: rgba(0, 0, 0, 0.8);
17385}
17386.photo-browser-caption:empty {
17387 display: none;
17388}
17389.photo-browser-caption.photo-browser-caption-active {
17390 opacity: 1;
17391}
17392.photo-browser-captions-light .photo-browser-caption {
17393 background: rgba(255, 255, 255, 0.8);
17394 color: #000;
17395}
17396.photo-browser-captions-dark .photo-browser-caption {
17397 color: #fff;
17398}
17399.photo-browser-exposed .photo-browser-caption {
17400 color: #fff;
17401 background: rgba(0, 0, 0, 0.8);
17402}
17403.photo-browser-swiper-container {
17404 position: absolute;
17405 left: 0;
17406 top: 0;
17407 width: 100%;
17408 height: 100%;
17409 overflow: hidden;
17410 background: #fff;
17411 -webkit-transition: 400ms;
17412 transition: 400ms;
17413 -webkit-transition-property: background-color;
17414 transition-property: background-color;
17415}
17416.photo-browser-prev.swiper-button-disabled,
17417.photo-browser-next.swiper-button-disabled {
17418 opacity: 0.3;
17419}
17420.photo-browser-slide {
17421 width: 100%;
17422 height: 100%;
17423 position: relative;
17424 overflow: hidden;
17425 display: -webkit-box;
17426 display: -webkit-flex;
17427 display: -ms-flexbox;
17428 display: flex;
17429 -webkit-box-pack: center;
17430 -webkit-justify-content: center;
17431 -ms-flex-pack: center;
17432 justify-content: center;
17433 -webkit-box-align: center;
17434 -webkit-align-items: center;
17435 -ms-flex-align: center;
17436 align-items: center;
17437 -webkit-flex-shrink: 0;
17438 -ms-flex-negative: 0;
17439 flex-shrink: 0;
17440 -webkit-box-sizing: border-box;
17441 box-sizing: border-box;
17442}
17443.photo-browser-slide.photo-browser-transitioning {
17444 -webkit-transition: 400ms;
17445 transition: 400ms;
17446 -webkit-transition-property: -webkit-transform;
17447 transition-property: -webkit-transform;
17448 transition-property: transform;
17449 transition-property: transform, -webkit-transform;
17450}
17451.photo-browser-slide span.swiper-zoom-container {
17452 display: none;
17453}
17454.photo-browser-slide img {
17455 width: auto;
17456 height: auto;
17457 max-width: 100%;
17458 max-height: 100%;
17459 display: none;
17460}
17461.photo-browser-slide.swiper-slide-active span.swiper-zoom-container,
17462.photo-browser-slide.swiper-slide-next span.swiper-zoom-container,
17463.photo-browser-slide.swiper-slide-prev span.swiper-zoom-container {
17464 display: -webkit-box;
17465 display: -webkit-flex;
17466 display: -ms-flexbox;
17467 display: flex;
17468}
17469.photo-browser-slide.swiper-slide-active img,
17470.photo-browser-slide.swiper-slide-next img,
17471.photo-browser-slide.swiper-slide-prev img {
17472 display: inline;
17473}
17474.photo-browser-slide.swiper-slide-active.photo-browser-slide-lazy .preloader,
17475.photo-browser-slide.swiper-slide-next.photo-browser-slide-lazy .preloader,
17476.photo-browser-slide.swiper-slide-prev.photo-browser-slide-lazy .preloader {
17477 display: block;
17478}
17479.photo-browser-slide iframe {
17480 width: 100%;
17481 height: 100%;
17482}
17483.photo-browser-slide .preloader {
17484 display: none;
17485 position: absolute;
17486 width: 42px;
17487 height: 42px;
17488 margin-left: -21px;
17489 margin-top: -21px;
17490 left: 50%;
17491 top: 50%;
17492}
17493.photo-browser-dark .photo-browser-swiper-container,
17494.photo-browser-page-dark .photo-browser-swiper-container {
17495 background: #000;
17496}
17497@-webkit-keyframes photo-browser-in {
17498 0% {
17499 -webkit-transform: translate3d(0, 0, 0) scale(0.5);
17500 transform: translate3d(0, 0, 0) scale(0.5);
17501 opacity: 0;
17502 }
17503 50% {
17504 -webkit-transform: translate3d(0, 0, 0) scale(1.05);
17505 transform: translate3d(0, 0, 0) scale(1.05);
17506 opacity: 1;
17507 }
17508 100% {
17509 -webkit-transform: translate3d(0, 0, 0) scale(1);
17510 transform: translate3d(0, 0, 0) scale(1);
17511 opacity: 1;
17512 }
17513}
17514@keyframes photo-browser-in {
17515 0% {
17516 -webkit-transform: translate3d(0, 0, 0) scale(0.5);
17517 transform: translate3d(0, 0, 0) scale(0.5);
17518 opacity: 0;
17519 }
17520 50% {
17521 -webkit-transform: translate3d(0, 0, 0) scale(1.05);
17522 transform: translate3d(0, 0, 0) scale(1.05);
17523 opacity: 1;
17524 }
17525 100% {
17526 -webkit-transform: translate3d(0, 0, 0) scale(1);
17527 transform: translate3d(0, 0, 0) scale(1);
17528 opacity: 1;
17529 }
17530}
17531@-webkit-keyframes photo-browser-out {
17532 0% {
17533 -webkit-transform: translate3d(0, 0, 0) scale(1);
17534 transform: translate3d(0, 0, 0) scale(1);
17535 opacity: 1;
17536 }
17537 50% {
17538 -webkit-transform: translate3d(0, 0, 0) scale(1.05);
17539 transform: translate3d(0, 0, 0) scale(1.05);
17540 opacity: 1;
17541 }
17542 100% {
17543 -webkit-transform: translate3d(0, 0, 0) scale(0.5);
17544 transform: translate3d(0, 0, 0) scale(0.5);
17545 opacity: 0;
17546 }
17547}
17548@keyframes photo-browser-out {
17549 0% {
17550 -webkit-transform: translate3d(0, 0, 0) scale(1);
17551 transform: translate3d(0, 0, 0) scale(1);
17552 opacity: 1;
17553 }
17554 50% {
17555 -webkit-transform: translate3d(0, 0, 0) scale(1.05);
17556 transform: translate3d(0, 0, 0) scale(1.05);
17557 opacity: 1;
17558 }
17559 100% {
17560 -webkit-transform: translate3d(0, 0, 0) scale(0.5);
17561 transform: translate3d(0, 0, 0) scale(0.5);
17562 opacity: 0;
17563 }
17564}
17565.md .toolbar ~ .photo-browser-captions {
17566 bottom: 48px;
17567 -webkit-transform: translate3d(0, 0px, 0);
17568 transform: translate3d(0, 0px, 0);
17569}
17570.md .toolbar ~ .photo-browser-captions.photo-browser-captions-exposed {
17571 -webkit-transform: translate3d(0, 0px, 0);
17572 transform: translate3d(0, 0px, 0);
17573}
17574.md .photo-browser-exposed .toolbar ~ .photo-browser-captions {
17575 -webkit-transform: translate3d(0, 48px, 0);
17576 transform: translate3d(0, 48px, 0);
17577}
17578.md .photo-browser-page .toolbar {
17579 -webkit-transform: none;
17580 transform: none;
17581}
17582.md .photo-browser-page .navbar,
17583.md .photo-browser-page .toolbar {
17584 background: rgba(33, 150, 243, 0.95);
17585 -webkit-transition: 400ms;
17586 transition: 400ms;
17587}
17588.md .photo-browser-dark .navbar,
17589.md .photo-browser-page-dark .navbar,
17590.md .photo-browser-dark .toolbar,
17591.md .photo-browser-page-dark .toolbar {
17592 background: rgba(30, 30, 30, 0.8) !important;
17593 color: #fff;
17594}
17595.md .photo-browser-dark .navbar a,
17596.md .photo-browser-page-dark .navbar a,
17597.md .photo-browser-dark .toolbar a,
17598.md .photo-browser-page-dark .toolbar a {
17599 color: #fff;
17600}
17601.md .color-theme-red .photo-browser-page:not(.photo-browser-page-dark) .navbar,
17602.md .color-red .photo-browser-page:not(.photo-browser-page-dark) .navbar,
17603.md .color-theme-red .photo-browser-page:not(.photo-browser-page-dark) .toolbar,
17604.md .color-red .photo-browser-page:not(.photo-browser-page-dark) .toolbar {
17605 background-color: rgba(244, 67, 54, 0.95);
17606}
17607.md .color-theme-green .photo-browser-page:not(.photo-browser-page-dark) .navbar,
17608.md .color-green .photo-browser-page:not(.photo-browser-page-dark) .navbar,
17609.md .color-theme-green .photo-browser-page:not(.photo-browser-page-dark) .toolbar,
17610.md .color-green .photo-browser-page:not(.photo-browser-page-dark) .toolbar {
17611 background-color: rgba(76, 175, 80, 0.95);
17612}
17613.md .color-theme-blue .photo-browser-page:not(.photo-browser-page-dark) .navbar,
17614.md .color-blue .photo-browser-page:not(.photo-browser-page-dark) .navbar,
17615.md .color-theme-blue .photo-browser-page:not(.photo-browser-page-dark) .toolbar,
17616.md .color-blue .photo-browser-page:not(.photo-browser-page-dark) .toolbar {
17617 background-color: rgba(33, 150, 243, 0.95);
17618}
17619.md .color-theme-pink .photo-browser-page:not(.photo-browser-page-dark) .navbar,
17620.md .color-pink .photo-browser-page:not(.photo-browser-page-dark) .navbar,
17621.md .color-theme-pink .photo-browser-page:not(.photo-browser-page-dark) .toolbar,
17622.md .color-pink .photo-browser-page:not(.photo-browser-page-dark) .toolbar {
17623 background-color: rgba(233, 30, 99, 0.95);
17624}
17625.md .color-theme-yellow .photo-browser-page:not(.photo-browser-page-dark) .navbar,
17626.md .color-yellow .photo-browser-page:not(.photo-browser-page-dark) .navbar,
17627.md .color-theme-yellow .photo-browser-page:not(.photo-browser-page-dark) .toolbar,
17628.md .color-yellow .photo-browser-page:not(.photo-browser-page-dark) .toolbar {
17629 background-color: rgba(255, 235, 59, 0.95);
17630}
17631.md .color-theme-orange .photo-browser-page:not(.photo-browser-page-dark) .navbar,
17632.md .color-orange .photo-browser-page:not(.photo-browser-page-dark) .navbar,
17633.md .color-theme-orange .photo-browser-page:not(.photo-browser-page-dark) .toolbar,
17634.md .color-orange .photo-browser-page:not(.photo-browser-page-dark) .toolbar {
17635 background-color: rgba(255, 152, 0, 0.95);
17636}
17637.md .color-theme-gray .photo-browser-page:not(.photo-browser-page-dark) .navbar,
17638.md .color-gray .photo-browser-page:not(.photo-browser-page-dark) .navbar,
17639.md .color-theme-gray .photo-browser-page:not(.photo-browser-page-dark) .toolbar,
17640.md .color-gray .photo-browser-page:not(.photo-browser-page-dark) .toolbar {
17641 background-color: rgba(158, 158, 158, 0.95);
17642}
17643.md .color-theme-white .photo-browser-page:not(.photo-browser-page-dark) .navbar,
17644.md .color-white .photo-browser-page:not(.photo-browser-page-dark) .navbar,
17645.md .color-theme-white .photo-browser-page:not(.photo-browser-page-dark) .toolbar,
17646.md .color-white .photo-browser-page:not(.photo-browser-page-dark) .toolbar {
17647 background-color: rgba(255, 255, 255, 0.95);
17648}
17649.md .color-theme-black .photo-browser-page:not(.photo-browser-page-dark) .navbar,
17650.md .color-black .photo-browser-page:not(.photo-browser-page-dark) .navbar,
17651.md .color-theme-black .photo-browser-page:not(.photo-browser-page-dark) .toolbar,
17652.md .color-black .photo-browser-page:not(.photo-browser-page-dark) .toolbar {
17653 background-color: rgba(0, 0, 0, 0.95);
17654}
17655.md.device-iphone-x .photo-browser-captions {
17656 bottom: constant(safe-area-inset-bottom);
17657 bottom: env(safe-area-inset-bottom);
17658}
17659.md.device-iphone-x .toolbar ~ .photo-browser-captions {
17660 bottom: calc(48px + constant(safe-area-inset-bottom));
17661 bottom: calc(48px + env(safe-area-inset-bottom));
17662}
17663/* === Notifications === */
17664.notification {
17665 position: absolute;
17666 left: 0;
17667 top: 0;
17668 width: 100%;
17669 z-index: 20000;
17670 font-size: 14px;
17671 margin: 0;
17672 border: none;
17673 display: none;
17674 -webkit-box-sizing: border-box;
17675 box-sizing: border-box;
17676 -webkit-transition-property: -webkit-transform;
17677 transition-property: -webkit-transform;
17678 transition-property: transform;
17679 transition-property: transform, -webkit-transform;
17680 direction: ltr;
17681}
17682.notification-icon {
17683 font-size: 0;
17684}
17685.notification-header {
17686 display: -webkit-box;
17687 display: -webkit-flex;
17688 display: -ms-flexbox;
17689 display: flex;
17690 -webkit-box-pack: start;
17691 -webkit-justify-content: flex-start;
17692 -ms-flex-pack: start;
17693 justify-content: flex-start;
17694 -webkit-box-align: center;
17695 -webkit-align-items: center;
17696 -ms-flex-align: center;
17697 align-items: center;
17698}
17699.notification-close-button {
17700 margin-left: auto;
17701 cursor: pointer;
17702}
17703html.with-statusbar.device-ios .notification,
17704html.with-statusbar.ios:not(.device-ios):not(.device-android) .notification {
17705 margin-top: 20px;
17706}
17707html.with-statusbar.device-android .notification,
17708html.with-statusbar.md:not(.device-ios):not(.device-android) .notification {
17709 margin-top: 24px;
17710}
17711html.with-statusbar.device-iphone-x .notification {
17712 margin-top: constant(safe-area-inset-top);
17713 margin-top: env(safe-area-inset-top);
17714}
17715.md .notification {
17716 left: 0;
17717 top: 0;
17718 width: 100%;
17719 background: #fff;
17720 border-radius: 0px;
17721 -webkit-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.22), 0 1px 2px rgba(0, 0, 0, 0.24);
17722 box-shadow: 0 2px 4px rgba(0, 0, 0, 0.22), 0 1px 2px rgba(0, 0, 0, 0.24);
17723 padding: 16px;
17724 color: #000;
17725 max-width: 568px;
17726}
17727@media (min-width: 568px) {
17728 .md .notification {
17729 left: 50%;
17730 margin-left: -284px;
17731 }
17732}
17733.md .notification.modal-in {
17734 -webkit-transition-duration: 0ms;
17735 transition-duration: 0ms;
17736 -webkit-animation: notification-md-in 400ms ease-out;
17737 animation: notification-md-in 400ms ease-out;
17738}
17739.md .notification.modal-in.notification-transitioning {
17740 -webkit-transition-duration: 200ms;
17741 transition-duration: 200ms;
17742}
17743.md .notification.modal-out {
17744 -webkit-animation: none;
17745 animation: none;
17746 -webkit-transition-duration: 200ms;
17747 transition-duration: 200ms;
17748 -webkit-transition-timing-function: ease-in;
17749 transition-timing-function: ease-in;
17750 -webkit-transform: translate3d(0, -150%, 0);
17751 transform: translate3d(0, -150%, 0);
17752}
17753.md .notification-icon {
17754 width: 16px;
17755 height: 16px;
17756 margin-right: 8px;
17757 line-height: 16px;
17758}
17759.md .notification-icon i {
17760 width: 16px;
17761 height: 16px;
17762 font-size: 16px;
17763}
17764.md .notification-title {
17765 font-size: 12px;
17766 line-height: 1;
17767 color: #2196f3;
17768}
17769.md .notification-subtitle {
17770 font-size: 14px;
17771 line-height: 1.35;
17772 color: #212121;
17773}
17774.md .notification-subtitle + .notification-text {
17775 margin-top: 2px;
17776}
17777.md .notification-text {
17778 font-size: 14px;
17779 line-height: 1.35;
17780 color: #757575;
17781}
17782.md .notification-header + .notification-content {
17783 margin-top: 6px;
17784}
17785.md .notification-title-right-text {
17786 font-size: 12px;
17787 color: #757575;
17788 margin-left: 4px;
17789}
17790.md .notification-title-right-text:before {
17791 content: '';
17792 width: 3px;
17793 height: 3px;
17794 border-radius: 50%;
17795 display: inline-block;
17796 vertical-align: middle;
17797 margin-right: 4px;
17798 background: #757575;
17799}
17800.md .notification-close-button {
17801 background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20fill%3D'%23737373'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%20width%3D'24'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%3Cpath%20d%3D'M19%206.41L17.59%205%2012%2010.59%206.41%205%205%206.41%2010.59%2012%205%2017.59%206.41%2019%2012%2013.41%2017.59%2019%2019%2017.59%2013.41%2012z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E");
17802 width: 16px;
17803 height: 16px;
17804 background-position: center top;
17805 background-repeat: no-repeat;
17806 background-size: 100% auto;
17807 position: relative;
17808 -webkit-transition-duration: 300ms;
17809 transition-duration: 300ms;
17810}
17811.md .notification-close-button:before {
17812 content: '';
17813 width: 152%;
17814 height: 152%;
17815 position: absolute;
17816 left: -26%;
17817 top: -26%;
17818 background-image: -webkit-radial-gradient(center, circle, rgba(0, 0, 0, 0.1) 66%, rgba(0, 0, 0, 0) 66%);
17819 background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0.1) 66%, rgba(0, 0, 0, 0) 66%);
17820 background-repeat: no-repeat;
17821 background-position: center;
17822 background-size: 100% 100%;
17823 opacity: 0;
17824 pointer-events: none;
17825 -webkit-transition-duration: 600ms;
17826 transition-duration: 600ms;
17827}
17828.md .notification-close-button.active-state:before {
17829 opacity: 1;
17830 -webkit-transition-duration: 150ms;
17831 transition-duration: 150ms;
17832}
17833.md .notification-close-button:before {
17834 width: 48px;
17835 height: 48px;
17836 left: 50%;
17837 top: 50%;
17838 margin-left: -24px;
17839 margin-top: -24px;
17840}
17841.md .notification-close-button:after {
17842 content: '';
17843 position: absolute;
17844 left: 50%;
17845 top: 50%;
17846 width: 48px;
17847 height: 48px;
17848 margin-left: -22px;
17849 margin-top: -22px;
17850}
17851@-webkit-keyframes notification-md-in {
17852 0% {
17853 -webkit-transform: translate3d(0, -150%, 0);
17854 transform: translate3d(0, -150%, 0);
17855 }
17856 50% {
17857 -webkit-transform: translate3d(0, 10%, 0);
17858 transform: translate3d(0, 10%, 0);
17859 }
17860 100% {
17861 -webkit-transform: translate3d(0, 0%, 0);
17862 transform: translate3d(0, 0%, 0);
17863 }
17864}
17865@keyframes notification-md-in {
17866 0% {
17867 -webkit-transform: translate3d(0, -150%, 0);
17868 transform: translate3d(0, -150%, 0);
17869 }
17870 50% {
17871 -webkit-transform: translate3d(0, 10%, 0);
17872 transform: translate3d(0, 10%, 0);
17873 }
17874 100% {
17875 -webkit-transform: translate3d(0, 0%, 0);
17876 transform: translate3d(0, 0%, 0);
17877 }
17878}
17879/* === Autocomplete === */
17880.autocomplete-page .autocomplete-found {
17881 display: block;
17882}
17883.autocomplete-page .autocomplete-not-found {
17884 display: none;
17885}
17886.autocomplete-page .autocomplete-values {
17887 display: block;
17888}
17889.autocomplete-page .list ul:empty {
17890 display: none;
17891}
17892.autocomplete-preloader:not(.autocomplete-preloader-visible) {
17893 visibility: hidden;
17894}
17895.autocomplete-preloader:not(.autocomplete-preloader-visible),
17896.autocomplete-preloader:not(.autocomplete-preloader-visible) * {
17897 -webkit-animation: none;
17898 animation: none;
17899}
17900.autocomplete-dropdown {
17901 background: #fff;
17902 -webkit-box-sizing: border-box;
17903 box-sizing: border-box;
17904 position: absolute;
17905 z-index: 500;
17906 width: 100%;
17907 left: 0;
17908}
17909.autocomplete-dropdown .autocomplete-dropdown-inner {
17910 position: relative;
17911 overflow: auto;
17912 -webkit-overflow-scrolling: touch;
17913 height: 100%;
17914 z-index: 1;
17915}
17916.autocomplete-dropdown .autocomplete-preloader {
17917 display: none;
17918 position: absolute;
17919 bottom: 100%;
17920 width: 20px;
17921 height: 20px;
17922}
17923.autocomplete-dropdown .autocomplete-preloader-visible {
17924 display: block;
17925}
17926.autocomplete-dropdown .autocomplete-dropdown-placeholder {
17927 color: #a9a9a9;
17928}
17929.autocomplete-dropdown .list {
17930 margin: 0;
17931}
17932.autocomplete-dropdown .list ul {
17933 background: none !important;
17934}
17935.autocomplete-dropdown .list ul:before {
17936 display: none !important;
17937}
17938.autocomplete-dropdown .list ul:after {
17939 display: none !important;
17940}
17941.list .item-content-dropdown-expanded .item-title.item-label {
17942 width: 0;
17943 -webkit-flex-shrink: 10;
17944 -ms-flex-negative: 10;
17945 flex-shrink: 10;
17946 overflow: hidden;
17947}
17948.list .item-content-dropdown-expanded .item-title.item-label + .item-input-wrap {
17949 margin-left: 0;
17950}
17951.list .item-content-dropdown-expanded .item-input-wrap {
17952 width: 100%;
17953}
17954.md .autocomplete-page .navbar .autocomplete-preloader {
17955 margin-right: 16px;
17956}
17957.md .autocomplete-dropdown {
17958 -webkit-box-shadow: 0 2px 2px rgba(0, 0, 0, 0.25);
17959 box-shadow: 0 2px 2px rgba(0, 0, 0, 0.25);
17960}
17961.md .autocomplete-dropdown .autocomplete-preloader {
17962 right: 16px;
17963 margin-bottom: 8px;
17964}
17965.md .autocomplete-dropdown .autocomplete-preloader .preloader-inner-gap,
17966.md .autocomplete-dropdown .autocomplete-preloader .preloader-inner-half-circle {
17967 border-width: 3px;
17968}
17969.md .autocomplete-dropdown .list {
17970 color: rgba(0, 0, 0, 0.54);
17971}
17972.md .autocomplete-dropdown .list b {
17973 font-weight: normal;
17974 color: #212121;
17975}
17976.md .searchbar-input-wrap .autocomplete-dropdown .item-content {
17977 padding-left: 73px;
17978}
17979.md .searchbar-input-wrap .autocomplete-dropdown li:last-child {
17980 border-radius: 0 0 8px 8px;
17981 position: relative;
17982 overflow: hidden;
17983}
17984.md .searchbar-input-wrap .autocomplete-dropdown .autocomplete-dropdown-placeholder {
17985 color: #939398;
17986}
17987/* === Tooltip === */
17988.tooltip {
17989 position: absolute;
17990 z-index: 20000;
17991 background: rgba(0, 0, 0, 0.87);
17992 border-radius: 4px;
17993 padding: 8px 16px;
17994 color: #fff;
17995 font-size: 14px;
17996 -webkit-box-sizing: border-box;
17997 box-sizing: border-box;
17998 line-height: 1.2;
17999 opacity: 0;
18000 -webkit-transform: scale(0.9);
18001 transform: scale(0.9);
18002 -webkit-transition-duration: 150ms;
18003 transition-duration: 150ms;
18004 -webkit-transition-property: opacity, -webkit-transform;
18005 transition-property: opacity, -webkit-transform;
18006 transition-property: opacity, transform;
18007 transition-property: opacity, transform, -webkit-transform;
18008 z-index: 99000;
18009 font-weight: 500;
18010}
18011.tooltip.tooltip-in {
18012 -webkit-transform: scale(1);
18013 transform: scale(1);
18014 opacity: 1;
18015}
18016.tooltip.tooltip-out {
18017 opacity: 0;
18018 -webkit-transform: scale(1);
18019 transform: scale(1);
18020}
18021.device-desktop .tooltip {
18022 font-size: 12px;
18023 padding: 6px 8px;
18024}
18025/* === Gauge === */
18026.gauge {
18027 position: relative;
18028 text-align: center;
18029 margin-left: auto;
18030 margin-right: auto;
18031 display: inline-block;
18032}
18033.gauge-svg,
18034.gauge svg {
18035 max-width: 100%;
18036 height: auto;
18037}
18038.gauge-svg circle,
18039.gauge svg circle,
18040.gauge-svg path,
18041.gauge svg path {
18042 -webkit-transition-duration: 400ms;
18043 transition-duration: 400ms;
18044}
18045iframe#viAd {
18046 z-index: 12900 !important;
18047 background: #000 !important;
18048}
18049.vi-overlay {
18050 background: rgba(0, 0, 0, 0.85);
18051 z-index: 13100;
18052 position: absolute;
18053 left: 0%;
18054 top: 0%;
18055 width: 100%;
18056 height: 100%;
18057 border-radius: 3px;
18058 display: -webkit-box;
18059 display: -webkit-flex;
18060 display: -ms-flexbox;
18061 display: flex;
18062 -webkit-box-pack: center;
18063 -webkit-justify-content: center;
18064 -ms-flex-pack: center;
18065 justify-content: center;
18066 -webkit-box-orient: vertical;
18067 -webkit-box-direction: normal;
18068 -webkit-flex-direction: column;
18069 -ms-flex-direction: column;
18070 flex-direction: column;
18071 -webkit-box-align: center;
18072 -webkit-align-items: center;
18073 -ms-flex-align: center;
18074 align-items: center;
18075 -webkit-align-content: center;
18076 -ms-flex-line-pack: center;
18077 align-content: center;
18078 text-align: center;
18079 -webkit-user-select: none;
18080 -moz-user-select: none;
18081 -ms-user-select: none;
18082 user-select: none;
18083}
18084@supports ((-webkit-backdrop-filter: blur(10px)) or (backdrop-filter: blur(10px))) {
18085 .vi-overlay {
18086 background: rgba(0, 0, 0, 0.65);
18087 -webkit-backdrop-filter: blur(10px);
18088 backdrop-filter: blur(10px);
18089 }
18090}
18091.vi-overlay .vi-overlay-text {
18092 text-align: center;
18093 color: #fff;
18094 max-width: 80%;
18095}
18096.vi-overlay .vi-overlay-text + .vi-overlay-play-button {
18097 margin-top: 15px;
18098}
18099.vi-overlay .vi-overlay-play-button {
18100 width: 44px;
18101 height: 44px;
18102 border-radius: 50%;
18103 border: 2px solid #fff;
18104 position: relative;
18105}
18106.vi-overlay .vi-overlay-play-button.active-state {
18107 opacity: 0.55;
18108}
18109.vi-overlay .vi-overlay-play-button:before {
18110 content: '';
18111 width: 0;
18112 height: 0;
18113 border-top: 8px solid transparent;
18114 border-bottom: 8px solid transparent;
18115 border-left: 14px solid #fff;
18116 position: absolute;
18117 left: 50%;
18118 top: 50%;
18119 margin-left: 2px;
18120 -webkit-transform: translate(-50%, -50%);
18121 transform: translate(-50%, -50%);
18122}
18123/* === Elevation === */
18124.elevation-0 {
18125 -webkit-box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0) !important;
18126 box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0) !important;
18127}
18128.elevation-1 {
18129 -webkit-box-shadow: 0px 2px 1px -1px rgba(0, 0, 0, 0.2), 0px 1px 1px 0px rgba(0, 0, 0, 0.14), 0px 1px 3px 0px rgba(0, 0, 0, 0.12) !important;
18130 box-shadow: 0px 2px 1px -1px rgba(0, 0, 0, 0.2), 0px 1px 1px 0px rgba(0, 0, 0, 0.14), 0px 1px 3px 0px rgba(0, 0, 0, 0.12) !important;
18131}
18132.elevation-2 {
18133 -webkit-box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, 0.12) !important;
18134 box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, 0.12) !important;
18135}
18136.elevation-3 {
18137 -webkit-box-shadow: 0px 3px 3px -2px rgba(0, 0, 0, 0.2), 0px 3px 4px 0px rgba(0, 0, 0, 0.14), 0px 1px 8px 0px rgba(0, 0, 0, 0.12) !important;
18138 box-shadow: 0px 3px 3px -2px rgba(0, 0, 0, 0.2), 0px 3px 4px 0px rgba(0, 0, 0, 0.14), 0px 1px 8px 0px rgba(0, 0, 0, 0.12) !important;
18139}
18140.elevation-4 {
18141 -webkit-box-shadow: 0px 2px 4px -1px rgba(0, 0, 0, 0.2), 0px 4px 5px 0px rgba(0, 0, 0, 0.14), 0px 1px 10px 0px rgba(0, 0, 0, 0.12) !important;
18142 box-shadow: 0px 2px 4px -1px rgba(0, 0, 0, 0.2), 0px 4px 5px 0px rgba(0, 0, 0, 0.14), 0px 1px 10px 0px rgba(0, 0, 0, 0.12) !important;
18143}
18144.elevation-5 {
18145 -webkit-box-shadow: 0px 3px 5px -1px rgba(0, 0, 0, 0.2), 0px 5px 8px 0px rgba(0, 0, 0, 0.14), 0px 1px 14px 0px rgba(0, 0, 0, 0.12) !important;
18146 box-shadow: 0px 3px 5px -1px rgba(0, 0, 0, 0.2), 0px 5px 8px 0px rgba(0, 0, 0, 0.14), 0px 1px 14px 0px rgba(0, 0, 0, 0.12) !important;
18147}
18148.elevation-6 {
18149 -webkit-box-shadow: 0px 3px 5px -1px rgba(0, 0, 0, 0.2), 0px 6px 10px 0px rgba(0, 0, 0, 0.14), 0px 1px 18px 0px rgba(0, 0, 0, 0.12) !important;
18150 box-shadow: 0px 3px 5px -1px rgba(0, 0, 0, 0.2), 0px 6px 10px 0px rgba(0, 0, 0, 0.14), 0px 1px 18px 0px rgba(0, 0, 0, 0.12) !important;
18151}
18152.elevation-7 {
18153 -webkit-box-shadow: 0px 4px 5px -2px rgba(0, 0, 0, 0.2), 0px 7px 10px 1px rgba(0, 0, 0, 0.14), 0px 2px 16px 1px rgba(0, 0, 0, 0.12) !important;
18154 box-shadow: 0px 4px 5px -2px rgba(0, 0, 0, 0.2), 0px 7px 10px 1px rgba(0, 0, 0, 0.14), 0px 2px 16px 1px rgba(0, 0, 0, 0.12) !important;
18155}
18156.elevation-8 {
18157 -webkit-box-shadow: 0px 5px 5px -3px rgba(0, 0, 0, 0.2), 0px 8px 10px 1px rgba(0, 0, 0, 0.14), 0px 3px 14px 2px rgba(0, 0, 0, 0.12) !important;
18158 box-shadow: 0px 5px 5px -3px rgba(0, 0, 0, 0.2), 0px 8px 10px 1px rgba(0, 0, 0, 0.14), 0px 3px 14px 2px rgba(0, 0, 0, 0.12) !important;
18159}
18160.elevation-9 {
18161 -webkit-box-shadow: 0px 5px 6px -3px rgba(0, 0, 0, 0.2), 0px 9px 12px 1px rgba(0, 0, 0, 0.14), 0px 3px 16px 2px rgba(0, 0, 0, 0.12) !important;
18162 box-shadow: 0px 5px 6px -3px rgba(0, 0, 0, 0.2), 0px 9px 12px 1px rgba(0, 0, 0, 0.14), 0px 3px 16px 2px rgba(0, 0, 0, 0.12) !important;
18163}
18164.elevation-10 {
18165 -webkit-box-shadow: 0px 6px 6px -3px rgba(0, 0, 0, 0.2), 0px 10px 14px 1px rgba(0, 0, 0, 0.14), 0px 4px 18px 3px rgba(0, 0, 0, 0.12) !important;
18166 box-shadow: 0px 6px 6px -3px rgba(0, 0, 0, 0.2), 0px 10px 14px 1px rgba(0, 0, 0, 0.14), 0px 4px 18px 3px rgba(0, 0, 0, 0.12) !important;
18167}
18168.elevation-11 {
18169 -webkit-box-shadow: 0px 6px 7px -4px rgba(0, 0, 0, 0.2), 0px 11px 15px 1px rgba(0, 0, 0, 0.14), 0px 4px 20px 3px rgba(0, 0, 0, 0.12) !important;
18170 box-shadow: 0px 6px 7px -4px rgba(0, 0, 0, 0.2), 0px 11px 15px 1px rgba(0, 0, 0, 0.14), 0px 4px 20px 3px rgba(0, 0, 0, 0.12) !important;
18171}
18172.elevation-12 {
18173 -webkit-box-shadow: 0px 7px 8px -4px rgba(0, 0, 0, 0.2), 0px 12px 17px 2px rgba(0, 0, 0, 0.14), 0px 5px 22px 4px rgba(0, 0, 0, 0.12) !important;
18174 box-shadow: 0px 7px 8px -4px rgba(0, 0, 0, 0.2), 0px 12px 17px 2px rgba(0, 0, 0, 0.14), 0px 5px 22px 4px rgba(0, 0, 0, 0.12) !important;
18175}
18176.elevation-13 {
18177 -webkit-box-shadow: 0px 7px 8px -4px rgba(0, 0, 0, 0.2), 0px 13px 19px 2px rgba(0, 0, 0, 0.14), 0px 5px 24px 4px rgba(0, 0, 0, 0.12) !important;
18178 box-shadow: 0px 7px 8px -4px rgba(0, 0, 0, 0.2), 0px 13px 19px 2px rgba(0, 0, 0, 0.14), 0px 5px 24px 4px rgba(0, 0, 0, 0.12) !important;
18179}
18180.elevation-14 {
18181 -webkit-box-shadow: 0px 7px 9px -4px rgba(0, 0, 0, 0.2), 0px 14px 21px 2px rgba(0, 0, 0, 0.14), 0px 5px 26px 4px rgba(0, 0, 0, 0.12) !important;
18182 box-shadow: 0px 7px 9px -4px rgba(0, 0, 0, 0.2), 0px 14px 21px 2px rgba(0, 0, 0, 0.14), 0px 5px 26px 4px rgba(0, 0, 0, 0.12) !important;
18183}
18184.elevation-15 {
18185 -webkit-box-shadow: 0px 8px 9px -5px rgba(0, 0, 0, 0.2), 0px 15px 22px 2px rgba(0, 0, 0, 0.14), 0px 6px 28px 5px rgba(0, 0, 0, 0.12) !important;
18186 box-shadow: 0px 8px 9px -5px rgba(0, 0, 0, 0.2), 0px 15px 22px 2px rgba(0, 0, 0, 0.14), 0px 6px 28px 5px rgba(0, 0, 0, 0.12) !important;
18187}
18188.elevation-16 {
18189 -webkit-box-shadow: 0px 8px 10px -5px rgba(0, 0, 0, 0.2), 0px 16px 24px 2px rgba(0, 0, 0, 0.14), 0px 6px 30px 5px rgba(0, 0, 0, 0.12) !important;
18190 box-shadow: 0px 8px 10px -5px rgba(0, 0, 0, 0.2), 0px 16px 24px 2px rgba(0, 0, 0, 0.14), 0px 6px 30px 5px rgba(0, 0, 0, 0.12) !important;
18191}
18192.elevation-17 {
18193 -webkit-box-shadow: 0px 8px 11px -5px rgba(0, 0, 0, 0.2), 0px 17px 26px 2px rgba(0, 0, 0, 0.14), 0px 6px 32px 5px rgba(0, 0, 0, 0.12) !important;
18194 box-shadow: 0px 8px 11px -5px rgba(0, 0, 0, 0.2), 0px 17px 26px 2px rgba(0, 0, 0, 0.14), 0px 6px 32px 5px rgba(0, 0, 0, 0.12) !important;
18195}
18196.elevation-18 {
18197 -webkit-box-shadow: 0px 9px 11px -5px rgba(0, 0, 0, 0.2), 0px 18px 28px 2px rgba(0, 0, 0, 0.14), 0px 7px 34px 6px rgba(0, 0, 0, 0.12) !important;
18198 box-shadow: 0px 9px 11px -5px rgba(0, 0, 0, 0.2), 0px 18px 28px 2px rgba(0, 0, 0, 0.14), 0px 7px 34px 6px rgba(0, 0, 0, 0.12) !important;
18199}
18200.elevation-19 {
18201 -webkit-box-shadow: 0px 9px 12px -6px rgba(0, 0, 0, 0.2), 0px 19px 29px 2px rgba(0, 0, 0, 0.14), 0px 7px 36px 6px rgba(0, 0, 0, 0.12) !important;
18202 box-shadow: 0px 9px 12px -6px rgba(0, 0, 0, 0.2), 0px 19px 29px 2px rgba(0, 0, 0, 0.14), 0px 7px 36px 6px rgba(0, 0, 0, 0.12) !important;
18203}
18204.elevation-20 {
18205 -webkit-box-shadow: 0px 10px 13px -6px rgba(0, 0, 0, 0.2), 0px 20px 31px 3px rgba(0, 0, 0, 0.14), 0px 8px 38px 7px rgba(0, 0, 0, 0.12) !important;
18206 box-shadow: 0px 10px 13px -6px rgba(0, 0, 0, 0.2), 0px 20px 31px 3px rgba(0, 0, 0, 0.14), 0px 8px 38px 7px rgba(0, 0, 0, 0.12) !important;
18207}
18208.elevation-21 {
18209 -webkit-box-shadow: 0px 10px 13px -6px rgba(0, 0, 0, 0.2), 0px 21px 33px 3px rgba(0, 0, 0, 0.14), 0px 8px 40px 7px rgba(0, 0, 0, 0.12) !important;
18210 box-shadow: 0px 10px 13px -6px rgba(0, 0, 0, 0.2), 0px 21px 33px 3px rgba(0, 0, 0, 0.14), 0px 8px 40px 7px rgba(0, 0, 0, 0.12) !important;
18211}
18212.elevation-22 {
18213 -webkit-box-shadow: 0px 10px 14px -6px rgba(0, 0, 0, 0.2), 0px 22px 35px 3px rgba(0, 0, 0, 0.14), 0px 8px 42px 7px rgba(0, 0, 0, 0.12) !important;
18214 box-shadow: 0px 10px 14px -6px rgba(0, 0, 0, 0.2), 0px 22px 35px 3px rgba(0, 0, 0, 0.14), 0px 8px 42px 7px rgba(0, 0, 0, 0.12) !important;
18215}
18216.elevation-23 {
18217 -webkit-box-shadow: 0px 11px 14px -7px rgba(0, 0, 0, 0.2), 0px 23px 36px 3px rgba(0, 0, 0, 0.14), 0px 9px 44px 8px rgba(0, 0, 0, 0.12) !important;
18218 box-shadow: 0px 11px 14px -7px rgba(0, 0, 0, 0.2), 0px 23px 36px 3px rgba(0, 0, 0, 0.14), 0px 9px 44px 8px rgba(0, 0, 0, 0.12) !important;
18219}
18220.elevation-24 {
18221 -webkit-box-shadow: 0px 11px 15px -7px rgba(0, 0, 0, 0.2), 0px 24px 38px 3px rgba(0, 0, 0, 0.14), 0px 9px 46px 8px rgba(0, 0, 0, 0.12) !important;
18222 box-shadow: 0px 11px 15px -7px rgba(0, 0, 0, 0.2), 0px 24px 38px 3px rgba(0, 0, 0, 0.14), 0px 9px 46px 8px rgba(0, 0, 0, 0.12) !important;
18223}
18224.device-desktop .elevation-hover-0:hover {
18225 -webkit-box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0) !important;
18226 box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0) !important;
18227}
18228.device-desktop .elevation-hover-1:hover {
18229 -webkit-box-shadow: 0px 2px 1px -1px rgba(0, 0, 0, 0.2), 0px 1px 1px 0px rgba(0, 0, 0, 0.14), 0px 1px 3px 0px rgba(0, 0, 0, 0.12) !important;
18230 box-shadow: 0px 2px 1px -1px rgba(0, 0, 0, 0.2), 0px 1px 1px 0px rgba(0, 0, 0, 0.14), 0px 1px 3px 0px rgba(0, 0, 0, 0.12) !important;
18231}
18232.device-desktop .elevation-hover-2:hover {
18233 -webkit-box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, 0.12) !important;
18234 box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, 0.12) !important;
18235}
18236.device-desktop .elevation-hover-3:hover {
18237 -webkit-box-shadow: 0px 3px 3px -2px rgba(0, 0, 0, 0.2), 0px 3px 4px 0px rgba(0, 0, 0, 0.14), 0px 1px 8px 0px rgba(0, 0, 0, 0.12) !important;
18238 box-shadow: 0px 3px 3px -2px rgba(0, 0, 0, 0.2), 0px 3px 4px 0px rgba(0, 0, 0, 0.14), 0px 1px 8px 0px rgba(0, 0, 0, 0.12) !important;
18239}
18240.device-desktop .elevation-hover-4:hover {
18241 -webkit-box-shadow: 0px 2px 4px -1px rgba(0, 0, 0, 0.2), 0px 4px 5px 0px rgba(0, 0, 0, 0.14), 0px 1px 10px 0px rgba(0, 0, 0, 0.12) !important;
18242 box-shadow: 0px 2px 4px -1px rgba(0, 0, 0, 0.2), 0px 4px 5px 0px rgba(0, 0, 0, 0.14), 0px 1px 10px 0px rgba(0, 0, 0, 0.12) !important;
18243}
18244.device-desktop .elevation-hover-5:hover {
18245 -webkit-box-shadow: 0px 3px 5px -1px rgba(0, 0, 0, 0.2), 0px 5px 8px 0px rgba(0, 0, 0, 0.14), 0px 1px 14px 0px rgba(0, 0, 0, 0.12) !important;
18246 box-shadow: 0px 3px 5px -1px rgba(0, 0, 0, 0.2), 0px 5px 8px 0px rgba(0, 0, 0, 0.14), 0px 1px 14px 0px rgba(0, 0, 0, 0.12) !important;
18247}
18248.device-desktop .elevation-hover-6:hover {
18249 -webkit-box-shadow: 0px 3px 5px -1px rgba(0, 0, 0, 0.2), 0px 6px 10px 0px rgba(0, 0, 0, 0.14), 0px 1px 18px 0px rgba(0, 0, 0, 0.12) !important;
18250 box-shadow: 0px 3px 5px -1px rgba(0, 0, 0, 0.2), 0px 6px 10px 0px rgba(0, 0, 0, 0.14), 0px 1px 18px 0px rgba(0, 0, 0, 0.12) !important;
18251}
18252.device-desktop .elevation-hover-7:hover {
18253 -webkit-box-shadow: 0px 4px 5px -2px rgba(0, 0, 0, 0.2), 0px 7px 10px 1px rgba(0, 0, 0, 0.14), 0px 2px 16px 1px rgba(0, 0, 0, 0.12) !important;
18254 box-shadow: 0px 4px 5px -2px rgba(0, 0, 0, 0.2), 0px 7px 10px 1px rgba(0, 0, 0, 0.14), 0px 2px 16px 1px rgba(0, 0, 0, 0.12) !important;
18255}
18256.device-desktop .elevation-hover-8:hover {
18257 -webkit-box-shadow: 0px 5px 5px -3px rgba(0, 0, 0, 0.2), 0px 8px 10px 1px rgba(0, 0, 0, 0.14), 0px 3px 14px 2px rgba(0, 0, 0, 0.12) !important;
18258 box-shadow: 0px 5px 5px -3px rgba(0, 0, 0, 0.2), 0px 8px 10px 1px rgba(0, 0, 0, 0.14), 0px 3px 14px 2px rgba(0, 0, 0, 0.12) !important;
18259}
18260.device-desktop .elevation-hover-9:hover {
18261 -webkit-box-shadow: 0px 5px 6px -3px rgba(0, 0, 0, 0.2), 0px 9px 12px 1px rgba(0, 0, 0, 0.14), 0px 3px 16px 2px rgba(0, 0, 0, 0.12) !important;
18262 box-shadow: 0px 5px 6px -3px rgba(0, 0, 0, 0.2), 0px 9px 12px 1px rgba(0, 0, 0, 0.14), 0px 3px 16px 2px rgba(0, 0, 0, 0.12) !important;
18263}
18264.device-desktop .elevation-hover-10:hover {
18265 -webkit-box-shadow: 0px 6px 6px -3px rgba(0, 0, 0, 0.2), 0px 10px 14px 1px rgba(0, 0, 0, 0.14), 0px 4px 18px 3px rgba(0, 0, 0, 0.12) !important;
18266 box-shadow: 0px 6px 6px -3px rgba(0, 0, 0, 0.2), 0px 10px 14px 1px rgba(0, 0, 0, 0.14), 0px 4px 18px 3px rgba(0, 0, 0, 0.12) !important;
18267}
18268.device-desktop .elevation-hover-11:hover {
18269 -webkit-box-shadow: 0px 6px 7px -4px rgba(0, 0, 0, 0.2), 0px 11px 15px 1px rgba(0, 0, 0, 0.14), 0px 4px 20px 3px rgba(0, 0, 0, 0.12) !important;
18270 box-shadow: 0px 6px 7px -4px rgba(0, 0, 0, 0.2), 0px 11px 15px 1px rgba(0, 0, 0, 0.14), 0px 4px 20px 3px rgba(0, 0, 0, 0.12) !important;
18271}
18272.device-desktop .elevation-hover-12:hover {
18273 -webkit-box-shadow: 0px 7px 8px -4px rgba(0, 0, 0, 0.2), 0px 12px 17px 2px rgba(0, 0, 0, 0.14), 0px 5px 22px 4px rgba(0, 0, 0, 0.12) !important;
18274 box-shadow: 0px 7px 8px -4px rgba(0, 0, 0, 0.2), 0px 12px 17px 2px rgba(0, 0, 0, 0.14), 0px 5px 22px 4px rgba(0, 0, 0, 0.12) !important;
18275}
18276.device-desktop .elevation-hover-13:hover {
18277 -webkit-box-shadow: 0px 7px 8px -4px rgba(0, 0, 0, 0.2), 0px 13px 19px 2px rgba(0, 0, 0, 0.14), 0px 5px 24px 4px rgba(0, 0, 0, 0.12) !important;
18278 box-shadow: 0px 7px 8px -4px rgba(0, 0, 0, 0.2), 0px 13px 19px 2px rgba(0, 0, 0, 0.14), 0px 5px 24px 4px rgba(0, 0, 0, 0.12) !important;
18279}
18280.device-desktop .elevation-hover-14:hover {
18281 -webkit-box-shadow: 0px 7px 9px -4px rgba(0, 0, 0, 0.2), 0px 14px 21px 2px rgba(0, 0, 0, 0.14), 0px 5px 26px 4px rgba(0, 0, 0, 0.12) !important;
18282 box-shadow: 0px 7px 9px -4px rgba(0, 0, 0, 0.2), 0px 14px 21px 2px rgba(0, 0, 0, 0.14), 0px 5px 26px 4px rgba(0, 0, 0, 0.12) !important;
18283}
18284.device-desktop .elevation-hover-15:hover {
18285 -webkit-box-shadow: 0px 8px 9px -5px rgba(0, 0, 0, 0.2), 0px 15px 22px 2px rgba(0, 0, 0, 0.14), 0px 6px 28px 5px rgba(0, 0, 0, 0.12) !important;
18286 box-shadow: 0px 8px 9px -5px rgba(0, 0, 0, 0.2), 0px 15px 22px 2px rgba(0, 0, 0, 0.14), 0px 6px 28px 5px rgba(0, 0, 0, 0.12) !important;
18287}
18288.device-desktop .elevation-hover-16:hover {
18289 -webkit-box-shadow: 0px 8px 10px -5px rgba(0, 0, 0, 0.2), 0px 16px 24px 2px rgba(0, 0, 0, 0.14), 0px 6px 30px 5px rgba(0, 0, 0, 0.12) !important;
18290 box-shadow: 0px 8px 10px -5px rgba(0, 0, 0, 0.2), 0px 16px 24px 2px rgba(0, 0, 0, 0.14), 0px 6px 30px 5px rgba(0, 0, 0, 0.12) !important;
18291}
18292.device-desktop .elevation-hover-17:hover {
18293 -webkit-box-shadow: 0px 8px 11px -5px rgba(0, 0, 0, 0.2), 0px 17px 26px 2px rgba(0, 0, 0, 0.14), 0px 6px 32px 5px rgba(0, 0, 0, 0.12) !important;
18294 box-shadow: 0px 8px 11px -5px rgba(0, 0, 0, 0.2), 0px 17px 26px 2px rgba(0, 0, 0, 0.14), 0px 6px 32px 5px rgba(0, 0, 0, 0.12) !important;
18295}
18296.device-desktop .elevation-hover-18:hover {
18297 -webkit-box-shadow: 0px 9px 11px -5px rgba(0, 0, 0, 0.2), 0px 18px 28px 2px rgba(0, 0, 0, 0.14), 0px 7px 34px 6px rgba(0, 0, 0, 0.12) !important;
18298 box-shadow: 0px 9px 11px -5px rgba(0, 0, 0, 0.2), 0px 18px 28px 2px rgba(0, 0, 0, 0.14), 0px 7px 34px 6px rgba(0, 0, 0, 0.12) !important;
18299}
18300.device-desktop .elevation-hover-19:hover {
18301 -webkit-box-shadow: 0px 9px 12px -6px rgba(0, 0, 0, 0.2), 0px 19px 29px 2px rgba(0, 0, 0, 0.14), 0px 7px 36px 6px rgba(0, 0, 0, 0.12) !important;
18302 box-shadow: 0px 9px 12px -6px rgba(0, 0, 0, 0.2), 0px 19px 29px 2px rgba(0, 0, 0, 0.14), 0px 7px 36px 6px rgba(0, 0, 0, 0.12) !important;
18303}
18304.device-desktop .elevation-hover-20:hover {
18305 -webkit-box-shadow: 0px 10px 13px -6px rgba(0, 0, 0, 0.2), 0px 20px 31px 3px rgba(0, 0, 0, 0.14), 0px 8px 38px 7px rgba(0, 0, 0, 0.12) !important;
18306 box-shadow: 0px 10px 13px -6px rgba(0, 0, 0, 0.2), 0px 20px 31px 3px rgba(0, 0, 0, 0.14), 0px 8px 38px 7px rgba(0, 0, 0, 0.12) !important;
18307}
18308.device-desktop .elevation-hover-21:hover {
18309 -webkit-box-shadow: 0px 10px 13px -6px rgba(0, 0, 0, 0.2), 0px 21px 33px 3px rgba(0, 0, 0, 0.14), 0px 8px 40px 7px rgba(0, 0, 0, 0.12) !important;
18310 box-shadow: 0px 10px 13px -6px rgba(0, 0, 0, 0.2), 0px 21px 33px 3px rgba(0, 0, 0, 0.14), 0px 8px 40px 7px rgba(0, 0, 0, 0.12) !important;
18311}
18312.device-desktop .elevation-hover-22:hover {
18313 -webkit-box-shadow: 0px 10px 14px -6px rgba(0, 0, 0, 0.2), 0px 22px 35px 3px rgba(0, 0, 0, 0.14), 0px 8px 42px 7px rgba(0, 0, 0, 0.12) !important;
18314 box-shadow: 0px 10px 14px -6px rgba(0, 0, 0, 0.2), 0px 22px 35px 3px rgba(0, 0, 0, 0.14), 0px 8px 42px 7px rgba(0, 0, 0, 0.12) !important;
18315}
18316.device-desktop .elevation-hover-23:hover {
18317 -webkit-box-shadow: 0px 11px 14px -7px rgba(0, 0, 0, 0.2), 0px 23px 36px 3px rgba(0, 0, 0, 0.14), 0px 9px 44px 8px rgba(0, 0, 0, 0.12) !important;
18318 box-shadow: 0px 11px 14px -7px rgba(0, 0, 0, 0.2), 0px 23px 36px 3px rgba(0, 0, 0, 0.14), 0px 9px 44px 8px rgba(0, 0, 0, 0.12) !important;
18319}
18320.device-desktop .elevation-hover-24:hover {
18321 -webkit-box-shadow: 0px 11px 15px -7px rgba(0, 0, 0, 0.2), 0px 24px 38px 3px rgba(0, 0, 0, 0.14), 0px 9px 46px 8px rgba(0, 0, 0, 0.12) !important;
18322 box-shadow: 0px 11px 15px -7px rgba(0, 0, 0, 0.2), 0px 24px 38px 3px rgba(0, 0, 0, 0.14), 0px 9px 46px 8px rgba(0, 0, 0, 0.12) !important;
18323}
18324.active-state.elevation-pressed-0,
18325.device-desktop .active-state.elevation-pressed-0 {
18326 -webkit-box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0) !important;
18327 box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0) !important;
18328}
18329.active-state.elevation-pressed-1,
18330.device-desktop .active-state.elevation-pressed-1 {
18331 -webkit-box-shadow: 0px 2px 1px -1px rgba(0, 0, 0, 0.2), 0px 1px 1px 0px rgba(0, 0, 0, 0.14), 0px 1px 3px 0px rgba(0, 0, 0, 0.12) !important;
18332 box-shadow: 0px 2px 1px -1px rgba(0, 0, 0, 0.2), 0px 1px 1px 0px rgba(0, 0, 0, 0.14), 0px 1px 3px 0px rgba(0, 0, 0, 0.12) !important;
18333}
18334.active-state.elevation-pressed-2,
18335.device-desktop .active-state.elevation-pressed-2 {
18336 -webkit-box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, 0.12) !important;
18337 box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, 0.12) !important;
18338}
18339.active-state.elevation-pressed-3,
18340.device-desktop .active-state.elevation-pressed-3 {
18341 -webkit-box-shadow: 0px 3px 3px -2px rgba(0, 0, 0, 0.2), 0px 3px 4px 0px rgba(0, 0, 0, 0.14), 0px 1px 8px 0px rgba(0, 0, 0, 0.12) !important;
18342 box-shadow: 0px 3px 3px -2px rgba(0, 0, 0, 0.2), 0px 3px 4px 0px rgba(0, 0, 0, 0.14), 0px 1px 8px 0px rgba(0, 0, 0, 0.12) !important;
18343}
18344.active-state.elevation-pressed-4,
18345.device-desktop .active-state.elevation-pressed-4 {
18346 -webkit-box-shadow: 0px 2px 4px -1px rgba(0, 0, 0, 0.2), 0px 4px 5px 0px rgba(0, 0, 0, 0.14), 0px 1px 10px 0px rgba(0, 0, 0, 0.12) !important;
18347 box-shadow: 0px 2px 4px -1px rgba(0, 0, 0, 0.2), 0px 4px 5px 0px rgba(0, 0, 0, 0.14), 0px 1px 10px 0px rgba(0, 0, 0, 0.12) !important;
18348}
18349.active-state.elevation-pressed-5,
18350.device-desktop .active-state.elevation-pressed-5 {
18351 -webkit-box-shadow: 0px 3px 5px -1px rgba(0, 0, 0, 0.2), 0px 5px 8px 0px rgba(0, 0, 0, 0.14), 0px 1px 14px 0px rgba(0, 0, 0, 0.12) !important;
18352 box-shadow: 0px 3px 5px -1px rgba(0, 0, 0, 0.2), 0px 5px 8px 0px rgba(0, 0, 0, 0.14), 0px 1px 14px 0px rgba(0, 0, 0, 0.12) !important;
18353}
18354.active-state.elevation-pressed-6,
18355.device-desktop .active-state.elevation-pressed-6 {
18356 -webkit-box-shadow: 0px 3px 5px -1px rgba(0, 0, 0, 0.2), 0px 6px 10px 0px rgba(0, 0, 0, 0.14), 0px 1px 18px 0px rgba(0, 0, 0, 0.12) !important;
18357 box-shadow: 0px 3px 5px -1px rgba(0, 0, 0, 0.2), 0px 6px 10px 0px rgba(0, 0, 0, 0.14), 0px 1px 18px 0px rgba(0, 0, 0, 0.12) !important;
18358}
18359.active-state.elevation-pressed-7,
18360.device-desktop .active-state.elevation-pressed-7 {
18361 -webkit-box-shadow: 0px 4px 5px -2px rgba(0, 0, 0, 0.2), 0px 7px 10px 1px rgba(0, 0, 0, 0.14), 0px 2px 16px 1px rgba(0, 0, 0, 0.12) !important;
18362 box-shadow: 0px 4px 5px -2px rgba(0, 0, 0, 0.2), 0px 7px 10px 1px rgba(0, 0, 0, 0.14), 0px 2px 16px 1px rgba(0, 0, 0, 0.12) !important;
18363}
18364.active-state.elevation-pressed-8,
18365.device-desktop .active-state.elevation-pressed-8 {
18366 -webkit-box-shadow: 0px 5px 5px -3px rgba(0, 0, 0, 0.2), 0px 8px 10px 1px rgba(0, 0, 0, 0.14), 0px 3px 14px 2px rgba(0, 0, 0, 0.12) !important;
18367 box-shadow: 0px 5px 5px -3px rgba(0, 0, 0, 0.2), 0px 8px 10px 1px rgba(0, 0, 0, 0.14), 0px 3px 14px 2px rgba(0, 0, 0, 0.12) !important;
18368}
18369.active-state.elevation-pressed-9,
18370.device-desktop .active-state.elevation-pressed-9 {
18371 -webkit-box-shadow: 0px 5px 6px -3px rgba(0, 0, 0, 0.2), 0px 9px 12px 1px rgba(0, 0, 0, 0.14), 0px 3px 16px 2px rgba(0, 0, 0, 0.12) !important;
18372 box-shadow: 0px 5px 6px -3px rgba(0, 0, 0, 0.2), 0px 9px 12px 1px rgba(0, 0, 0, 0.14), 0px 3px 16px 2px rgba(0, 0, 0, 0.12) !important;
18373}
18374.active-state.elevation-pressed-10,
18375.device-desktop .active-state.elevation-pressed-10 {
18376 -webkit-box-shadow: 0px 6px 6px -3px rgba(0, 0, 0, 0.2), 0px 10px 14px 1px rgba(0, 0, 0, 0.14), 0px 4px 18px 3px rgba(0, 0, 0, 0.12) !important;
18377 box-shadow: 0px 6px 6px -3px rgba(0, 0, 0, 0.2), 0px 10px 14px 1px rgba(0, 0, 0, 0.14), 0px 4px 18px 3px rgba(0, 0, 0, 0.12) !important;
18378}
18379.active-state.elevation-pressed-11,
18380.device-desktop .active-state.elevation-pressed-11 {
18381 -webkit-box-shadow: 0px 6px 7px -4px rgba(0, 0, 0, 0.2), 0px 11px 15px 1px rgba(0, 0, 0, 0.14), 0px 4px 20px 3px rgba(0, 0, 0, 0.12) !important;
18382 box-shadow: 0px 6px 7px -4px rgba(0, 0, 0, 0.2), 0px 11px 15px 1px rgba(0, 0, 0, 0.14), 0px 4px 20px 3px rgba(0, 0, 0, 0.12) !important;
18383}
18384.active-state.elevation-pressed-12,
18385.device-desktop .active-state.elevation-pressed-12 {
18386 -webkit-box-shadow: 0px 7px 8px -4px rgba(0, 0, 0, 0.2), 0px 12px 17px 2px rgba(0, 0, 0, 0.14), 0px 5px 22px 4px rgba(0, 0, 0, 0.12) !important;
18387 box-shadow: 0px 7px 8px -4px rgba(0, 0, 0, 0.2), 0px 12px 17px 2px rgba(0, 0, 0, 0.14), 0px 5px 22px 4px rgba(0, 0, 0, 0.12) !important;
18388}
18389.active-state.elevation-pressed-13,
18390.device-desktop .active-state.elevation-pressed-13 {
18391 -webkit-box-shadow: 0px 7px 8px -4px rgba(0, 0, 0, 0.2), 0px 13px 19px 2px rgba(0, 0, 0, 0.14), 0px 5px 24px 4px rgba(0, 0, 0, 0.12) !important;
18392 box-shadow: 0px 7px 8px -4px rgba(0, 0, 0, 0.2), 0px 13px 19px 2px rgba(0, 0, 0, 0.14), 0px 5px 24px 4px rgba(0, 0, 0, 0.12) !important;
18393}
18394.active-state.elevation-pressed-14,
18395.device-desktop .active-state.elevation-pressed-14 {
18396 -webkit-box-shadow: 0px 7px 9px -4px rgba(0, 0, 0, 0.2), 0px 14px 21px 2px rgba(0, 0, 0, 0.14), 0px 5px 26px 4px rgba(0, 0, 0, 0.12) !important;
18397 box-shadow: 0px 7px 9px -4px rgba(0, 0, 0, 0.2), 0px 14px 21px 2px rgba(0, 0, 0, 0.14), 0px 5px 26px 4px rgba(0, 0, 0, 0.12) !important;
18398}
18399.active-state.elevation-pressed-15,
18400.device-desktop .active-state.elevation-pressed-15 {
18401 -webkit-box-shadow: 0px 8px 9px -5px rgba(0, 0, 0, 0.2), 0px 15px 22px 2px rgba(0, 0, 0, 0.14), 0px 6px 28px 5px rgba(0, 0, 0, 0.12) !important;
18402 box-shadow: 0px 8px 9px -5px rgba(0, 0, 0, 0.2), 0px 15px 22px 2px rgba(0, 0, 0, 0.14), 0px 6px 28px 5px rgba(0, 0, 0, 0.12) !important;
18403}
18404.active-state.elevation-pressed-16,
18405.device-desktop .active-state.elevation-pressed-16 {
18406 -webkit-box-shadow: 0px 8px 10px -5px rgba(0, 0, 0, 0.2), 0px 16px 24px 2px rgba(0, 0, 0, 0.14), 0px 6px 30px 5px rgba(0, 0, 0, 0.12) !important;
18407 box-shadow: 0px 8px 10px -5px rgba(0, 0, 0, 0.2), 0px 16px 24px 2px rgba(0, 0, 0, 0.14), 0px 6px 30px 5px rgba(0, 0, 0, 0.12) !important;
18408}
18409.active-state.elevation-pressed-17,
18410.device-desktop .active-state.elevation-pressed-17 {
18411 -webkit-box-shadow: 0px 8px 11px -5px rgba(0, 0, 0, 0.2), 0px 17px 26px 2px rgba(0, 0, 0, 0.14), 0px 6px 32px 5px rgba(0, 0, 0, 0.12) !important;
18412 box-shadow: 0px 8px 11px -5px rgba(0, 0, 0, 0.2), 0px 17px 26px 2px rgba(0, 0, 0, 0.14), 0px 6px 32px 5px rgba(0, 0, 0, 0.12) !important;
18413}
18414.active-state.elevation-pressed-18,
18415.device-desktop .active-state.elevation-pressed-18 {
18416 -webkit-box-shadow: 0px 9px 11px -5px rgba(0, 0, 0, 0.2), 0px 18px 28px 2px rgba(0, 0, 0, 0.14), 0px 7px 34px 6px rgba(0, 0, 0, 0.12) !important;
18417 box-shadow: 0px 9px 11px -5px rgba(0, 0, 0, 0.2), 0px 18px 28px 2px rgba(0, 0, 0, 0.14), 0px 7px 34px 6px rgba(0, 0, 0, 0.12) !important;
18418}
18419.active-state.elevation-pressed-19,
18420.device-desktop .active-state.elevation-pressed-19 {
18421 -webkit-box-shadow: 0px 9px 12px -6px rgba(0, 0, 0, 0.2), 0px 19px 29px 2px rgba(0, 0, 0, 0.14), 0px 7px 36px 6px rgba(0, 0, 0, 0.12) !important;
18422 box-shadow: 0px 9px 12px -6px rgba(0, 0, 0, 0.2), 0px 19px 29px 2px rgba(0, 0, 0, 0.14), 0px 7px 36px 6px rgba(0, 0, 0, 0.12) !important;
18423}
18424.active-state.elevation-pressed-20,
18425.device-desktop .active-state.elevation-pressed-20 {
18426 -webkit-box-shadow: 0px 10px 13px -6px rgba(0, 0, 0, 0.2), 0px 20px 31px 3px rgba(0, 0, 0, 0.14), 0px 8px 38px 7px rgba(0, 0, 0, 0.12) !important;
18427 box-shadow: 0px 10px 13px -6px rgba(0, 0, 0, 0.2), 0px 20px 31px 3px rgba(0, 0, 0, 0.14), 0px 8px 38px 7px rgba(0, 0, 0, 0.12) !important;
18428}
18429.active-state.elevation-pressed-21,
18430.device-desktop .active-state.elevation-pressed-21 {
18431 -webkit-box-shadow: 0px 10px 13px -6px rgba(0, 0, 0, 0.2), 0px 21px 33px 3px rgba(0, 0, 0, 0.14), 0px 8px 40px 7px rgba(0, 0, 0, 0.12) !important;
18432 box-shadow: 0px 10px 13px -6px rgba(0, 0, 0, 0.2), 0px 21px 33px 3px rgba(0, 0, 0, 0.14), 0px 8px 40px 7px rgba(0, 0, 0, 0.12) !important;
18433}
18434.active-state.elevation-pressed-22,
18435.device-desktop .active-state.elevation-pressed-22 {
18436 -webkit-box-shadow: 0px 10px 14px -6px rgba(0, 0, 0, 0.2), 0px 22px 35px 3px rgba(0, 0, 0, 0.14), 0px 8px 42px 7px rgba(0, 0, 0, 0.12) !important;
18437 box-shadow: 0px 10px 14px -6px rgba(0, 0, 0, 0.2), 0px 22px 35px 3px rgba(0, 0, 0, 0.14), 0px 8px 42px 7px rgba(0, 0, 0, 0.12) !important;
18438}
18439.active-state.elevation-pressed-23,
18440.device-desktop .active-state.elevation-pressed-23 {
18441 -webkit-box-shadow: 0px 11px 14px -7px rgba(0, 0, 0, 0.2), 0px 23px 36px 3px rgba(0, 0, 0, 0.14), 0px 9px 44px 8px rgba(0, 0, 0, 0.12) !important;
18442 box-shadow: 0px 11px 14px -7px rgba(0, 0, 0, 0.2), 0px 23px 36px 3px rgba(0, 0, 0, 0.14), 0px 9px 44px 8px rgba(0, 0, 0, 0.12) !important;
18443}
18444.active-state.elevation-pressed-24,
18445.device-desktop .active-state.elevation-pressed-24 {
18446 -webkit-box-shadow: 0px 11px 15px -7px rgba(0, 0, 0, 0.2), 0px 24px 38px 3px rgba(0, 0, 0, 0.14), 0px 9px 46px 8px rgba(0, 0, 0, 0.12) !important;
18447 box-shadow: 0px 11px 15px -7px rgba(0, 0, 0, 0.2), 0px 24px 38px 3px rgba(0, 0, 0, 0.14), 0px 9px 46px 8px rgba(0, 0, 0, 0.12) !important;
18448}
18449.elevation-transition-100 {
18450 -webkit-transition-duration: 100ms;
18451 transition-duration: 100ms;
18452 -webkit-transition-property: -webkit-box-shadow;
18453 transition-property: -webkit-box-shadow;
18454 transition-property: box-shadow;
18455 transition-property: box-shadow, -webkit-box-shadow;
18456}
18457.elevation-transition,
18458.elevation-transition-200 {
18459 -webkit-transition-duration: 200ms;
18460 transition-duration: 200ms;
18461 -webkit-transition-property: -webkit-box-shadow;
18462 transition-property: -webkit-box-shadow;
18463 transition-property: box-shadow;
18464 transition-property: box-shadow, -webkit-box-shadow;
18465}
18466.elevation-transition-300 {
18467 -webkit-transition-duration: 300ms;
18468 transition-duration: 300ms;
18469 -webkit-transition-property: -webkit-box-shadow;
18470 transition-property: -webkit-box-shadow;
18471 transition-property: box-shadow;
18472 transition-property: box-shadow, -webkit-box-shadow;
18473}
18474.elevation-transition-400 {
18475 -webkit-transition-duration: 400ms;
18476 transition-duration: 400ms;
18477 -webkit-transition-property: -webkit-box-shadow;
18478 transition-property: -webkit-box-shadow;
18479 transition-property: box-shadow;
18480 transition-property: box-shadow, -webkit-box-shadow;
18481}
18482.elevation-transition-500 {
18483 -webkit-transition-duration: 500ms;
18484 transition-duration: 500ms;
18485 -webkit-transition-property: -webkit-box-shadow;
18486 transition-property: -webkit-box-shadow;
18487 transition-property: box-shadow;
18488 transition-property: box-shadow, -webkit-box-shadow;
18489}
18490/* === Typography === */
18491.display-flex {
18492 display: -webkit-box !important;
18493 display: -webkit-flex !important;
18494 display: -ms-flexbox !important;
18495 display: flex !important;
18496}
18497.display-block {
18498 display: block !important;
18499}
18500.display-inline-flex {
18501 display: -webkit-inline-box !important;
18502 display: -webkit-inline-flex !important;
18503 display: -ms-inline-flexbox !important;
18504 display: inline-flex !important;
18505}
18506.display-inline-block {
18507 display: inline-block !important;
18508}
18509.display-inline {
18510 display: inline !important;
18511}
18512.display-none {
18513 display: none !important;
18514}
18515.flex-shrink-0 {
18516 -webkit-flex-shrink: 0 !important;
18517 -ms-flex-negative: 0 !important;
18518 flex-shrink: 0 !important;
18519}
18520.flex-shrink-1 {
18521 -webkit-flex-shrink: 1 !important;
18522 -ms-flex-negative: 1 !important;
18523 flex-shrink: 1 !important;
18524}
18525.flex-shrink-2 {
18526 -webkit-flex-shrink: 2 !important;
18527 -ms-flex-negative: 2 !important;
18528 flex-shrink: 2 !important;
18529}
18530.flex-shrink-3 {
18531 -webkit-flex-shrink: 3 !important;
18532 -ms-flex-negative: 3 !important;
18533 flex-shrink: 3 !important;
18534}
18535.flex-shrink-4 {
18536 -webkit-flex-shrink: 4 !important;
18537 -ms-flex-negative: 4 !important;
18538 flex-shrink: 4 !important;
18539}
18540.flex-shrink-5 {
18541 -webkit-flex-shrink: 5 !important;
18542 -ms-flex-negative: 5 !important;
18543 flex-shrink: 5 !important;
18544}
18545.flex-shrink-6 {
18546 -webkit-flex-shrink: 6 !important;
18547 -ms-flex-negative: 6 !important;
18548 flex-shrink: 6 !important;
18549}
18550.flex-shrink-7 {
18551 -webkit-flex-shrink: 7 !important;
18552 -ms-flex-negative: 7 !important;
18553 flex-shrink: 7 !important;
18554}
18555.flex-shrink-8 {
18556 -webkit-flex-shrink: 8 !important;
18557 -ms-flex-negative: 8 !important;
18558 flex-shrink: 8 !important;
18559}
18560.flex-shrink-9 {
18561 -webkit-flex-shrink: 9 !important;
18562 -ms-flex-negative: 9 !important;
18563 flex-shrink: 9 !important;
18564}
18565.flex-shrink-10 {
18566 -webkit-flex-shrink: 10 !important;
18567 -ms-flex-negative: 10 !important;
18568 flex-shrink: 10 !important;
18569}
18570.justify-content-flex-start {
18571 -webkit-box-pack: start !important;
18572 -webkit-justify-content: flex-start !important;
18573 -ms-flex-pack: start !important;
18574 justify-content: flex-start !important;
18575}
18576.justify-content-center {
18577 -webkit-box-pack: center !important;
18578 -webkit-justify-content: center !important;
18579 -ms-flex-pack: center !important;
18580 justify-content: center !important;
18581}
18582.justify-content-flex-end {
18583 -webkit-box-pack: end !important;
18584 -webkit-justify-content: flex-end !important;
18585 -ms-flex-pack: end !important;
18586 justify-content: flex-end !important;
18587}
18588.justify-content-space-between {
18589 -webkit-box-pack: justify !important;
18590 -webkit-justify-content: space-between !important;
18591 -ms-flex-pack: justify !important;
18592 justify-content: space-between !important;
18593}
18594.justify-content-space-around {
18595 -webkit-justify-content: space-around !important;
18596 -ms-flex-pack: distribute !important;
18597 justify-content: space-around !important;
18598}
18599.justify-content-space-evenly {
18600 -webkit-box-pack: space-evenly !important;
18601 -webkit-justify-content: space-evenly !important;
18602 -ms-flex-pack: space-evenly !important;
18603 justify-content: space-evenly !important;
18604}
18605.justify-content-stretch {
18606 -webkit-box-pack: stretch !important;
18607 -webkit-justify-content: stretch !important;
18608 -ms-flex-pack: stretch !important;
18609 justify-content: stretch !important;
18610}
18611.justify-content-start {
18612 -webkit-box-pack: start !important;
18613 -webkit-justify-content: start !important;
18614 -ms-flex-pack: start !important;
18615 justify-content: start !important;
18616}
18617.justify-content-end {
18618 -webkit-box-pack: end !important;
18619 -webkit-justify-content: end !important;
18620 -ms-flex-pack: end !important;
18621 justify-content: end !important;
18622}
18623.justify-content-left {
18624 -webkit-box-pack: left !important;
18625 -webkit-justify-content: left !important;
18626 -ms-flex-pack: left !important;
18627 justify-content: left !important;
18628}
18629.justify-content-right {
18630 -webkit-box-pack: right !important;
18631 -webkit-justify-content: right !important;
18632 -ms-flex-pack: right !important;
18633 justify-content: right !important;
18634}
18635.align-content-flex-start {
18636 -webkit-align-content: flex-start !important;
18637 -ms-flex-line-pack: start !important;
18638 align-content: flex-start !important;
18639}
18640.align-content-flex-end {
18641 -webkit-align-content: flex-end !important;
18642 -ms-flex-line-pack: end !important;
18643 align-content: flex-end !important;
18644}
18645.align-content-center {
18646 -webkit-align-content: center !important;
18647 -ms-flex-line-pack: center !important;
18648 align-content: center !important;
18649}
18650.align-content-space-between {
18651 -webkit-align-content: space-between !important;
18652 -ms-flex-line-pack: justify !important;
18653 align-content: space-between !important;
18654}
18655.align-content-space-around {
18656 -webkit-align-content: space-around !important;
18657 -ms-flex-line-pack: distribute !important;
18658 align-content: space-around !important;
18659}
18660.align-content-stretch {
18661 -webkit-align-content: stretch !important;
18662 -ms-flex-line-pack: stretch !important;
18663 align-content: stretch !important;
18664}
18665.align-items-flex-start {
18666 -webkit-box-align: start !important;
18667 -webkit-align-items: flex-start !important;
18668 -ms-flex-align: start !important;
18669 align-items: flex-start !important;
18670}
18671.align-items-flex-end {
18672 -webkit-box-align: end !important;
18673 -webkit-align-items: flex-end !important;
18674 -ms-flex-align: end !important;
18675 align-items: flex-end !important;
18676}
18677.align-items-center {
18678 -webkit-box-align: center !important;
18679 -webkit-align-items: center !important;
18680 -ms-flex-align: center !important;
18681 align-items: center !important;
18682}
18683.align-items-stretch {
18684 -webkit-box-align: stretch !important;
18685 -webkit-align-items: stretch !important;
18686 -ms-flex-align: stretch !important;
18687 align-items: stretch !important;
18688}
18689.align-self-flex-start {
18690 -webkit-align-self: flex-start !important;
18691 -ms-flex-item-align: start !important;
18692 align-self: flex-start !important;
18693}
18694.align-self-flex-end {
18695 -webkit-align-self: flex-end !important;
18696 -ms-flex-item-align: end !important;
18697 align-self: flex-end !important;
18698}
18699.align-self-center {
18700 -webkit-align-self: center !important;
18701 -ms-flex-item-align: center !important;
18702 align-self: center !important;
18703}
18704.align-self-stretch {
18705 -webkit-align-self: stretch !important;
18706 -ms-flex-item-align: stretch !important;
18707 align-self: stretch !important;
18708}
18709.text-align-left {
18710 text-align: left !important;
18711}
18712.text-align-center {
18713 text-align: center !important;
18714}
18715.text-align-right {
18716 text-align: right !important;
18717}
18718.text-align-justify {
18719 text-align: justify !important;
18720}
18721.float-left {
18722 float: left !important;
18723}
18724.float-right {
18725 float: right !important;
18726}
18727.float-none {
18728 float: none !important;
18729}
18730.vertical-align-bottom {
18731 vertical-align: bottom !important;
18732}
18733.vertical-align-middle {
18734 vertical-align: middle !important;
18735}
18736.vertical-align-top {
18737 vertical-align: top !important;
18738}
18739.no-padding {
18740 padding: 0 !important;
18741}
18742.no-padding-left {
18743 padding-left: 0 !important;
18744}
18745.no-padding-right {
18746 padding-right: 0 !important;
18747}
18748.no-padding-top {
18749 padding-top: 0 !important;
18750}
18751.no-padding-bottom {
18752 padding-bottom: 0 !important;
18753}
18754.no-margin {
18755 margin: 0 !important;
18756}
18757.no-margin-left {
18758 margin-left: 0 !important;
18759}
18760.no-margin-right {
18761 margin-right: 0 !important;
18762}
18763.no-margin-top {
18764 margin-top: 0 !important;
18765}
18766.no-margin-bottom {
18767 margin-bottom: 0 !important;
18768}
18769.width-auto {
18770 width: auto !important;
18771}
18772.width-100 {
18773 width: 100% !important;
18774}
18775.md .padding {
18776 padding: 16px !important;
18777}
18778.md .padding-top {
18779 padding-top: 16px !important;
18780}
18781.md .padding-bottom {
18782 padding-bottom: 16px !important;
18783}
18784.md .padding-left {
18785 padding-left: 16px !important;
18786}
18787.md .padding-right {
18788 padding-right: 16px !important;
18789}
18790.md .padding-vertical {
18791 padding-top: 16px !important;
18792 padding-bottom: 16px !important;
18793}
18794.md .padding-horizontal {
18795 padding-left: 16px !important;
18796 padding-right: 16px !important;
18797}
18798.md .margin {
18799 margin: 16px !important;
18800}
18801.md .margin-top {
18802 margin-top: 16px !important;
18803}
18804.md .margin-bottom {
18805 margin-bottom: 16px !important;
18806}
18807.md .margin-left {
18808 margin-left: 16px !important;
18809}
18810.md .margin-right {
18811 margin-right: 16px !important;
18812}
18813.md .margin-vertical {
18814 margin-top: 16px !important;
18815 margin-bottom: 16px !important;
18816}
18817.md .margin-horizontal {
18818 margin-left: 16px !important;
18819 margin-right: 16px !important;
18820}
18821.md .text-color-red {
18822 color: #f44336 !important;
18823}
18824.md .bg-color-red {
18825 background-color: #f44336 !important;
18826}
18827.md .border-color-red {
18828 border-color: #f44336 !important;
18829}
18830.md .text-color-green {
18831 color: #4caf50 !important;
18832}
18833.md .bg-color-green {
18834 background-color: #4caf50 !important;
18835}
18836.md .border-color-green {
18837 border-color: #4caf50 !important;
18838}
18839.md .text-color-blue {
18840 color: #2196f3 !important;
18841}
18842.md .bg-color-blue {
18843 background-color: #2196f3 !important;
18844}
18845.md .border-color-blue {
18846 border-color: #2196f3 !important;
18847}
18848.md .text-color-pink {
18849 color: #e91e63 !important;
18850}
18851.md .bg-color-pink {
18852 background-color: #e91e63 !important;
18853}
18854.md .border-color-pink {
18855 border-color: #e91e63 !important;
18856}
18857.md .text-color-yellow {
18858 color: #ffeb3b !important;
18859}
18860.md .bg-color-yellow {
18861 background-color: #ffeb3b !important;
18862}
18863.md .border-color-yellow {
18864 border-color: #ffeb3b !important;
18865}
18866.md .text-color-orange {
18867 color: #ff9800 !important;
18868}
18869.md .bg-color-orange {
18870 background-color: #ff9800 !important;
18871}
18872.md .border-color-orange {
18873 border-color: #ff9800 !important;
18874}
18875.md .text-color-gray {
18876 color: #9e9e9e !important;
18877}
18878.md .bg-color-gray {
18879 background-color: #9e9e9e !important;
18880}
18881.md .border-color-gray {
18882 border-color: #9e9e9e !important;
18883}
18884.md .text-color-white {
18885 color: #ffffff !important;
18886}
18887.md .bg-color-white {
18888 background-color: #ffffff !important;
18889}
18890.md .border-color-white {
18891 border-color: #ffffff !important;
18892}
18893.md .text-color-black {
18894 color: #000000 !important;
18895}
18896.md .bg-color-black {
18897 background-color: #000000 !important;
18898}
18899.md .border-color-black {
18900 border-color: #000000 !important;
18901}