]> git.proxmox.com Git - framework7.git/blame - framework7/css/framework7.rtl.md.css
bump version to 4.4.7-2
[framework7.git] / framework7 / css / framework7.rtl.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 {
13 direction: rtl;
14}
15html,
16body,
17.framework7-root {
18 position: relative;
19 height: 100%;
20 width: 100%;
21 overflow-x: hidden;
22}
23body {
24 margin: 0;
25 padding: 0;
26 font-size: 14px;
27 width: 100%;
28 background: #fff;
29 overflow: hidden;
30 -webkit-text-size-adjust: 100%;
31 -webkit-font-smoothing: antialiased;
32}
33.framework7-root {
34 overflow: hidden;
35 -webkit-box-sizing: border-box;
36 box-sizing: border-box;
37}
38.framework7-initializing *,
39.framework7-initializing *:before,
40.framework7-initializing *:after {
41 -webkit-transition-duration: 0ms !important;
42 transition-duration: 0ms !important;
43}
44/*
45a, button, input, textarea, .link, .button, label, .sortable-handler {
46 touch-action: manipulation;
47 -ms-touch-action: manipulation;
48}
49*/
50@media (width: 1024px) and (height: 691px) and (orientation: landscape) {
51 html,
52 body,
53 .framework7-root {
54 height: 671px;
55 }
56}
57@media (width: 1024px) and (height: 692px) and (orientation: landscape) {
58 html,
59 body,
60 .framework7-root {
61 height: 672px;
62 }
63}
64* {
65 -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
66 -webkit-touch-callout: none;
67}
68a,
69input,
70textarea,
71select {
72 outline: 0;
73}
74a {
75 cursor: pointer;
76 text-decoration: none;
77}
78p {
79 margin: 1em 0;
80}
81.disabled {
82 opacity: 0.55 !important;
83 pointer-events: none !important;
84}
85.md body {
86 font-family: Roboto, system-ui, Noto, Helvetica, Arial, sans-serif;
87 color: #212121;
88 line-height: 1.5;
89}
90.md .ios-only,
91.md .if-ios {
92 display: none !important;
93}
94.md a {
95 color: #2196f3;
96}
97.md .theme-dark {
98 color: rgba(255, 255, 255, 0.87);
99}
100.md .color-theme-red a {
101 color: #f44336;
102}
103.md .color-theme-green a {
104 color: #4caf50;
105}
106.md .color-theme-blue a {
107 color: #2196f3;
108}
109.md .color-theme-pink a {
110 color: #e91e63;
111}
112.md .color-theme-yellow a {
113 color: #ffeb3b;
114}
115.md .color-theme-orange a {
116 color: #ff9800;
117}
118.md .color-theme-gray a {
119 color: #9e9e9e;
120}
121.md .color-theme-white a {
122 color: #ffffff;
123}
124.md .color-theme-black a {
125 color: #000000;
126}
127.md a.color-red {
128 color: #f44336;
129}
130.md a.color-green {
131 color: #4caf50;
132}
133.md a.color-blue {
134 color: #2196f3;
135}
136.md a.color-pink {
137 color: #e91e63;
138}
139.md a.color-yellow {
140 color: #ffeb3b;
141}
142.md a.color-orange {
143 color: #ff9800;
144}
145.md a.color-gray {
146 color: #9e9e9e;
147}
148.md a.color-white {
149 color: #ffffff;
150}
151.md a.color-black {
152 color: #000000;
153}
154/* === Statusbar === */
155.statusbar {
156 position: absolute;
157 left: 0;
158 top: 0;
159 width: 100%;
160 z-index: 10000;
161 -webkit-box-sizing: border-box;
162 box-sizing: border-box;
163 display: none;
164}
165html.device-ios .statusbar,
166html.ios:not(.device-ios):not(.device-android) .statusbar {
167 height: 20px;
168}
169html.device-android .statusbar,
170html.md:not(.device-ios):not(.device-android) .statusbar {
171 height: 24px;
172}
173html.device-ios.device-iphone-x .statusbar {
174 height: constant(safe-area-inset-top);
175 height: env(safe-area-inset-top);
176}
177html.with-statusbar .statusbar {
178 display: block;
179}
180html.with-statusbar.device-ios .framework7-root,
181html.with-statusbar.ios:not(.device-ios):not(.device-android) .framework7-root {
182 padding-top: 20px;
183}
184html.with-statusbar.device-android .framework7-root,
185html.with-statusbar.md:not(.device-ios):not(.device-android) .framework7-root {
186 padding-top: 24px;
187}
188html.with-statusbar.device-iphone-x .framework7-root {
189 padding-top: constant(safe-area-inset-top);
190 padding-top: env(safe-area-inset-top);
191}
192.md .statusbar {
193 background: #0a6ebd;
194}
195.md .color-theme-red .statusbar {
196 background: #d2190b;
197}
198.md .color-theme-green .statusbar {
199 background: #357a38;
200}
201.md .color-theme-blue .statusbar {
202 background: #0a6ebd;
203}
204.md .color-theme-pink .statusbar {
205 background: #aa1145;
206}
207.md .color-theme-yellow .statusbar {
208 background: #eed500;
209}
210.md .color-theme-orange .statusbar {
211 background: #b36a00;
212}
213.md .color-theme-gray .statusbar {
214 background: #787878;
215}
216.md .color-theme-white .statusbar {
217 background: #d9d9d9;
218}
219.md .color-theme-black .statusbar {
220 background: #000000;
221}
222/* === Views === */
223.views,
224.view {
225 position: relative;
226 height: 100%;
227 z-index: 5000;
228 overflow: hidden;
229 -webkit-box-sizing: border-box;
230 box-sizing: border-box;
231}
232/* === Pages === */
233.pages {
234 position: relative;
235 width: 100%;
236 height: 100%;
237 overflow: hidden;
238}
239.page {
240 -webkit-box-sizing: border-box;
241 box-sizing: border-box;
242 position: absolute;
243 left: 0;
244 top: 0;
245 width: 100%;
246 height: 100%;
247 -webkit-transform: translate3d(0, 0, 0);
248 transform: translate3d(0, 0, 0);
249}
250.page.stacked {
251 display: none;
252}
253.page-previous {
254 pointer-events: none;
255}
256.page-content {
257 overflow: auto;
258 -webkit-overflow-scrolling: touch;
259 -webkit-box-sizing: border-box;
260 box-sizing: border-box;
261 height: 100%;
262 position: relative;
263 z-index: 1;
264}
265.md .page-shadow-effect {
266 position: absolute;
267 top: 0;
268 width: 16px;
269 bottom: 0;
270 z-index: -1;
271 content: '';
272 opacity: 0;
273 left: 100%;
274 background: -webkit-gradient(linear, right top, left 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)));
275 background: -webkit-linear-gradient(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%);
276 background: linear-gradient(to 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%);
277}
278.md .page-opacity-effect {
279 position: absolute;
280 left: 0;
281 top: 0;
282 background: rgba(0, 0, 0, 0.1);
283 width: 100%;
284 bottom: 0;
285 content: '';
286 opacity: 0;
287 z-index: 10000;
288}
289.md .page {
290 background: #fff;
291}
292.md .page-next {
293 -webkit-transform: translate3d(0, 56px, 0);
294 transform: translate3d(0, 56px, 0);
295 opacity: 0;
296 pointer-events: none;
297}
298.md .page-next.page-next-on-right {
299 -webkit-transform: translate3d(-100%, 0, 0);
300 transform: translate3d(-100%, 0, 0);
301}
302.md .page-transitioning,
303.md .page-transitioning .page-shadow-effect,
304.md .page-transitioning .page-opacity-effect {
305 -webkit-transition-duration: 250ms;
306 transition-duration: 250ms;
307}
308.md .page-transitioning-swipeback,
309.md .page-transitioning-swipeback .page-shadow-effect,
310.md .page-transitioning-swipeback .page-opacity-effect {
311 -webkit-transition-duration: 400ms;
312 transition-duration: 400ms;
313}
314.md .router-transition-forward .page,
315.md .router-transition-backward .page {
316 pointer-events: none;
317}
318.md .router-transition-css-forward .page-next {
319 -webkit-animation: md-page-next-to-current 250ms forwards;
320 animation: md-page-next-to-current 250ms forwards;
321}
322.md .router-transition-css-forward .page-current {
323 -webkit-animation: none;
324 animation: none;
325}
326.md .router-transition-css-backward .page-current {
327 -webkit-animation: md-page-current-to-next 250ms forwards;
328 animation: md-page-current-to-next 250ms forwards;
329}
330.md .router-transition-css-backward .page-previous {
331 -webkit-animation: none;
332 animation: none;
333}
334.md .theme-dark .page,
335.page.md .theme-dark {
336 background: #171717;
337}
338@-webkit-keyframes md-page-next-to-current {
339 from {
340 -webkit-transform: translate3d(0, 56px, 0);
341 transform: translate3d(0, 56px, 0);
342 opacity: 0;
343 }
344 to {
345 -webkit-transform: translate3d(0, 0px, 0);
346 transform: translate3d(0, 0px, 0);
347 opacity: 1;
348 }
349}
350@keyframes md-page-next-to-current {
351 from {
352 -webkit-transform: translate3d(0, 56px, 0);
353 transform: translate3d(0, 56px, 0);
354 opacity: 0;
355 }
356 to {
357 -webkit-transform: translate3d(0, 0px, 0);
358 transform: translate3d(0, 0px, 0);
359 opacity: 1;
360 }
361}
362@-webkit-keyframes md-page-current-to-next {
363 from {
364 -webkit-transform: translate3d(0, 0, 0);
365 transform: translate3d(0, 0, 0);
366 opacity: 1;
367 }
368 to {
369 -webkit-transform: translate3d(0, 56px, 0);
370 transform: translate3d(0, 56px, 0);
371 opacity: 0;
372 }
373}
374@keyframes md-page-current-to-next {
375 from {
376 -webkit-transform: translate3d(0, 0, 0);
377 transform: translate3d(0, 0, 0);
378 opacity: 1;
379 }
380 to {
381 -webkit-transform: translate3d(0, 56px, 0);
382 transform: translate3d(0, 56px, 0);
383 opacity: 0;
384 }
385}
386/* === Link === */
387.link,
388.tab-link {
389 display: -webkit-inline-box;
390 display: -webkit-inline-flex;
391 display: -ms-inline-flexbox;
392 display: inline-flex;
393 -webkit-box-align: center;
394 -webkit-align-items: center;
395 -ms-flex-align: center;
396 align-items: center;
397 -webkit-align-content: center;
398 -ms-flex-line-pack: center;
399 align-content: center;
400 -webkit-box-pack: center;
401 -webkit-justify-content: center;
402 -ms-flex-pack: center;
403 justify-content: center;
404 position: relative;
405 -webkit-box-sizing: border-box;
406 box-sizing: border-box;
407 -webkit-transform: translate3d(0, 0, 0);
408 transform: translate3d(0, 0, 0);
409 z-index: 1;
410}
411.md .link i + span,
412.md .link i + i,
413.md .link span + i,
414.md .link span + span {
415 margin-right: 8px;
416}
417/* === Navbar === */
418.navbar {
419 position: relative;
420 left: 0;
421 top: 0;
422 width: 100%;
423 z-index: 500;
424 -webkit-backface-visibility: hidden;
425 backface-visibility: hidden;
426 -webkit-box-sizing: border-box;
427 box-sizing: border-box;
428 margin: 0;
429 -webkit-transform: translate3d(0, 0, 0);
430 transform: translate3d(0, 0, 0);
431}
432.navbar b {
433 font-weight: 500;
434}
435.navbar a.link {
436 display: -webkit-box;
437 display: -webkit-flex;
438 display: -ms-flexbox;
439 display: flex;
440}
441.navbar .title,
442.navbar .left,
443.navbar .right {
444 position: relative;
445 z-index: 1;
446}
447.navbar .title {
448 text-align: center;
449 position: relative;
450 overflow: hidden;
451 text-overflow: ellipsis;
452 white-space: nowrap;
453 -webkit-flex-shrink: 10;
454 -ms-flex-negative: 10;
455 flex-shrink: 10;
456 font-weight: 500;
457 display: inline-block;
458}
459.navbar .subtitle {
460 display: block;
461}
462.navbar .left,
463.navbar .right {
464 -webkit-flex-shrink: 0;
465 -ms-flex-negative: 0;
466 flex-shrink: 0;
467 display: -webkit-box;
468 display: -webkit-flex;
469 display: -ms-flexbox;
470 display: flex;
471 -webkit-box-pack: start;
472 -webkit-justify-content: flex-start;
473 -ms-flex-pack: start;
474 justify-content: flex-start;
475 -webkit-box-align: center;
476 -webkit-align-items: center;
477 -ms-flex-align: center;
478 align-items: center;
479 -webkit-transform: translate3d(0, 0, 0);
480 transform: translate3d(0, 0, 0);
481}
482.navbar .right:first-child {
483 position: absolute;
484 height: 100%;
485}
486.navbar-inner {
487 position: absolute;
488 left: 0;
489 top: 0;
490 width: 100%;
491 height: 100%;
492 display: -webkit-box;
493 display: -webkit-flex;
494 display: -ms-flexbox;
495 display: flex;
496 -webkit-box-align: center;
497 -webkit-align-items: center;
498 -ms-flex-align: center;
499 align-items: center;
500 -webkit-box-sizing: border-box;
501 box-sizing: border-box;
502}
503.navbar-inner.stacked {
504 display: none;
505}
506.views > .navbar,
507.view > .navbar,
508.page > .navbar {
509 position: absolute;
510}
511.md .navbar {
512 height: 56px;
513 background: #2196f3;
514 color: #fff;
515 font-size: 20px;
516}
517.md .navbar:after {
518 content: '';
519 position: absolute;
520 right: 0;
521 width: 100%;
522 top: 100%;
523 bottom: auto;
524 height: 10px;
525 pointer-events: none;
526 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)));
527 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%);
528 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%);
529}
530.md .navbar.no-shadow:after {
531 display: none;
532}
533.md .navbar a {
534 color: inherit;
535}
536.md .navbar a.link {
537 -webkit-box-pack: center;
538 -webkit-justify-content: center;
539 -ms-flex-pack: center;
540 justify-content: center;
541 padding: 0 16px;
542 min-width: 48px;
543 height: 56px;
544 line-height: 56px;
545}
546.md .navbar a.link:before {
547 content: '';
548 width: 152%;
549 height: 152%;
550 position: absolute;
551 left: -26%;
552 top: -26%;
553 background-image: -webkit-radial-gradient(center, circle, rgba(255, 255, 255, 0.15) 66%, rgba(255, 255, 255, 0) 66%);
554 background-image: radial-gradient(circle at center, rgba(255, 255, 255, 0.15) 66%, rgba(255, 255, 255, 0) 66%);
555 background-repeat: no-repeat;
556 background-position: center;
557 background-size: 100% 100%;
558 opacity: 0;
559 pointer-events: none;
560 -webkit-transition-duration: 600ms;
561 transition-duration: 600ms;
562}
563.md .navbar a.link.active-state:before {
564 opacity: 1;
565 -webkit-transition-duration: 150ms;
566 transition-duration: 150ms;
567}
568.md .navbar a.icon-only {
569 min-width: 0;
570 -webkit-flex-shrink: 0;
571 -ms-flex-negative: 0;
572 flex-shrink: 0;
573}
574.md .navbar .title {
575 margin: 0 16px;
576 line-height: 1.2;
577 text-align: left;
578}
579.md .navbar .subtitle {
580 line-height: 1.2;
581 font-size: 14px;
582 font-weight: normal;
583 color: rgba(255, 255, 255, 0.85);
584}
585.md .navbar .right {
586 margin-right: auto;
587}
588.md .navbar .right:first-child {
589 left: 16px;
590}
591.md .navbar-inner {
592 -webkit-box-pack: start;
593 -webkit-justify-content: flex-start;
594 -ms-flex-pack: start;
595 justify-content: flex-start;
596 overflow: hidden;
597}
598.md .page-with-subnavbar .navbar-inner {
599 overflow: visible;
600}
601.md .navbar ~ * .page-content,
602.md .navbar ~ .page-content {
603 padding-top: 56px;
604}
605@media (min-width: 768px) {
606 .md .navbar {
607 height: 64px;
608 }
609 .md .navbar a.link {
610 height: 64px;
611 line-height: 64px;
612 }
613 .md .navbar ~ * .page-content,
614 .md .navbar ~ .page-content {
615 padding-top: 64px;
616 }
617}
618.md .navbar-transitioning {
619 -webkit-transition-duration: 400ms;
620 transition-duration: 400ms;
621}
622.md .navbar-hidden {
623 -webkit-transform: translate3d(0, -100%, 0);
624 transform: translate3d(0, -100%, 0);
625}
626.md .navbar-hidden:after {
627 display: none;
628}
629.md .color-theme-red .navbar,
630.md .color-theme-red.navbar {
631 background: #f44336;
632}
633.md .color-theme-green .navbar,
634.md .color-theme-green.navbar {
635 background: #4caf50;
636}
637.md .color-theme-blue .navbar,
638.md .color-theme-blue.navbar {
639 background: #2196f3;
640}
641.md .color-theme-pink .navbar,
642.md .color-theme-pink.navbar {
643 background: #e91e63;
644}
645.md .color-theme-yellow .navbar,
646.md .color-theme-yellow.navbar {
647 background: #ffeb3b;
648}
649.md .color-theme-orange .navbar,
650.md .color-theme-orange.navbar {
651 background: #ff9800;
652}
653.md .color-theme-gray .navbar,
654.md .color-theme-gray.navbar {
655 background: #9e9e9e;
656}
657.md .color-theme-white .navbar,
658.md .color-theme-white.navbar {
659 background: #ffffff;
660}
661.md .color-theme-black .navbar,
662.md .color-theme-black.navbar {
663 background: #000000;
664}
665.md .navbar.color-red {
666 background: #f44336;
667}
668.md .navbar.color-green {
669 background: #4caf50;
670}
671.md .navbar.color-blue {
672 background: #2196f3;
673}
674.md .navbar.color-pink {
675 background: #e91e63;
676}
677.md .navbar.color-yellow {
678 background: #ffeb3b;
679}
680.md .navbar.color-orange {
681 background: #ff9800;
682}
683.md .navbar.color-gray {
684 background: #9e9e9e;
685}
686.md .navbar.color-white {
687 background: #ffffff;
688}
689.md .navbar.color-black {
690 background: #000000;
691}
692@media (orientation: landscape) {
693 .md.device-iphone-x .ios-left-edge .navbar-inner,
694 .md.device-iphone-x .ios-edges .navbar-inner,
695 .md.device-iphone-x .popup .navbar-inner,
696 .md.device-iphone-x .sheet-modal .navbar-inner,
697 .md.device-iphone-x .panel-left .navbar-inner {
698 padding-left: constant(safe-area-inset-left);
699 padding-left: env(safe-area-inset-left);
700 }
701 .md.device-iphone-x .ios-right-edge .navbar-inner,
702 .md.device-iphone-x .ios-edges .navbar-inner,
703 .md.device-iphone-x .popup .navbar-inner,
704 .md.device-iphone-x .sheet-modal .navbar-inner,
705 .md.device-iphone-x .panel-right .navbar-inner {
706 padding-right: constant(safe-area-inset-right);
707 padding-right: env(safe-area-inset-right);
708 }
709}
710/* === Toolbar === */
711.toolbar {
712 width: 100%;
713 position: relative;
714 margin: 0;
715 -webkit-transform: translate3d(0, 0, 0);
716 transform: translate3d(0, 0, 0);
717 -webkit-backface-visibility: hidden;
718 backface-visibility: hidden;
719 z-index: 500;
720 -webkit-box-sizing: border-box;
721 box-sizing: border-box;
722 left: 0;
723}
724.toolbar b {
725 font-weight: 500;
726}
727.toolbar a {
728 -webkit-box-sizing: border-box;
729 box-sizing: border-box;
730 -webkit-flex-shrink: 1;
731 -ms-flex-negative: 1;
732 flex-shrink: 1;
733 position: relative;
734 white-space: nowrap;
735 text-overflow: ellipsis;
736}
737.toolbar a.link {
738 display: -webkit-box;
739 display: -webkit-flex;
740 display: -ms-flexbox;
741 display: flex;
742}
743.toolbar i.icon {
744 display: block;
745}
746.toolbar-inner {
747 position: absolute;
748 left: 0;
749 top: 0;
750 width: 100%;
751 height: 100%;
752 display: -webkit-box;
753 display: -webkit-flex;
754 display: -ms-flexbox;
755 display: flex;
756 -webkit-box-pack: justify;
757 -webkit-justify-content: space-between;
758 -ms-flex-pack: justify;
759 justify-content: space-between;
760 -webkit-box-sizing: border-box;
761 box-sizing: border-box;
762 -webkit-box-align: center;
763 -webkit-align-items: center;
764 -ms-flex-align: center;
765 align-items: center;
766 -webkit-align-content: center;
767 -ms-flex-line-pack: center;
768 align-content: center;
769}
770.views > .tabbar,
771.views > .tabbar-labels {
772 z-index: 5001;
773}
774.tabbar a.link,
775.tabbar-labels a.link {
776 line-height: 1.4;
777}
778.tabbar a.tab-link,
779.tabbar-labels a.tab-link,
780.tabbar a.link,
781.tabbar-labels a.link {
782 height: 100%;
783 width: 100%;
784 -webkit-box-sizing: border-box;
785 box-sizing: border-box;
786 display: -webkit-box;
787 display: -webkit-flex;
788 display: -ms-flexbox;
789 display: flex;
790 -webkit-box-pack: center;
791 -webkit-justify-content: center;
792 -ms-flex-pack: center;
793 justify-content: center;
794 -webkit-box-align: center;
795 -webkit-align-items: center;
796 -ms-flex-align: center;
797 align-items: center;
798 -webkit-box-orient: vertical;
799 -webkit-box-direction: normal;
800 -webkit-flex-direction: column;
801 -ms-flex-direction: column;
802 flex-direction: column;
803}
804.tabbar-labels a.tab-link,
805.tabbar-labels a.link {
806 height: 100%;
807 -webkit-box-pack: justify;
808 -webkit-justify-content: space-between;
809 -ms-flex-pack: justify;
810 justify-content: space-between;
811 -webkit-box-align: center;
812 -webkit-align-items: center;
813 -ms-flex-align: center;
814 align-items: center;
815}
816.tabbar-labels a.tab-link .tabbar-label,
817.tabbar-labels a.link .tabbar-label {
818 display: block;
819 line-height: 1;
820 margin: 0;
821 position: relative;
822 text-overflow: ellipsis;
823 white-space: nowrap;
824}
825.tabbar-scrollable .toolbar-inner {
826 overflow: auto;
827 -webkit-overflow-scrolling: touch;
828}
829.tabbar-scrollable .toolbar-inner::-webkit-scrollbar {
830 display: none !important;
831 width: 0 !important;
832 height: 0 !important;
833 -webkit-appearance: none;
834 opacity: 0 !important;
835}
836.tabbar-scrollable a.tab-link,
837.tabbar-scrollable a.link {
838 width: auto;
839 -webkit-flex-shrink: 0;
840 -ms-flex-negative: 0;
841 flex-shrink: 0;
842}
843.views > .toolbar,
844.view > .toolbar,
845.page > .toolbar {
846 position: absolute;
847}
848.md .toolbar {
849 background: #2196f3;
850 height: 48px;
851 color: #fff;
852 font-size: 14px;
853 top: 0;
854}
855.md .toolbar:after {
856 content: '';
857 position: absolute;
858 right: 0;
859 width: 100%;
860 top: 100%;
861 bottom: auto;
862 height: 10px;
863 pointer-events: none;
864 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)));
865 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%);
866 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%);
867}
868.md .toolbar.no-shadow:after {
869 display: none;
870}
871.md .toolbar a {
872 color: #fff;
873}
874.md .toolbar a.link {
875 -webkit-box-pack: center;
876 -webkit-justify-content: center;
877 -ms-flex-pack: center;
878 justify-content: center;
879 padding: 0 16px;
880 min-width: 48px;
881 line-height: 48px;
882 height: 48px;
883}
884.md .toolbar a.link:before {
885 content: '';
886 width: 152%;
887 height: 152%;
888 position: absolute;
889 left: -26%;
890 top: -26%;
891 background-image: -webkit-radial-gradient(center, circle, rgba(255, 255, 255, 0.15) 66%, rgba(255, 255, 255, 0) 66%);
892 background-image: radial-gradient(circle at center, rgba(255, 255, 255, 0.15) 66%, rgba(255, 255, 255, 0) 66%);
893 background-repeat: no-repeat;
894 background-position: center;
895 background-size: 100% 100%;
896 opacity: 0;
897 pointer-events: none;
898 -webkit-transition-duration: 600ms;
899 transition-duration: 600ms;
900}
901.md .toolbar a.link.active-state:before {
902 opacity: 1;
903 -webkit-transition-duration: 150ms;
904 transition-duration: 150ms;
905}
906.md .toolbar a.link i + span,
907.md .toolbar a.link i + i,
908.md .toolbar a.link span + i,
909.md .toolbar a.link span + span {
910 margin-right: 8px;
911}
912.md .toolbar a.icon-only {
913 min-width: 0;
914 -webkit-flex-shrink: 0;
915 -ms-flex-negative: 0;
916 flex-shrink: 0;
917}
918.md .toolbar-inner {
919 overflow: hidden;
920}
921.md .tabbar a.link,
922.md .tabbar-labels a.link,
923.md .tabbar a.tab-link,
924.md .tabbar-labels a.tab-link {
925 padding-left: 0;
926 padding-right: 0;
927 font-size: 14px;
928 text-transform: uppercase;
929 font-weight: 500;
930 letter-spacing: 0.03em;
931}
932.md .tabbar i.icon,
933.md .tabbar-labels i.icon {
934 height: 24px;
935}
936.md .tabbar a.tab-link,
937.md .tabbar-labels a.tab-link {
938 -webkit-transition-duration: 300ms;
939 transition-duration: 300ms;
940 overflow: hidden;
941 color: rgba(255, 255, 255, 0.7);
942 position: relative;
943}
944.md .tabbar a.tab-link.tab-link-active,
945.md .tabbar-labels a.tab-link.tab-link-active,
946.md .tabbar a.tab-link.active-state,
947.md .tabbar-labels a.tab-link.active-state {
948 color: #ffffff;
949}
950.md .tabbar .tab-link-highlight,
951.md .tabbar-labels .tab-link-highlight {
952 position: absolute;
953 left: 0;
954 bottom: 0;
955 height: 2px;
956 background: #fff;
957 -webkit-transition-duration: 300ms;
958 transition-duration: 300ms;
959 right: 0;
960}
961.md .toolbar-bottom-md,
962.md .messagebar {
963 top: auto !important;
964 bottom: 0 !important;
965}
966.md .toolbar-bottom-md:after,
967.md .messagebar:after {
968 content: '';
969 position: absolute;
970 right: 0;
971 width: 100%;
972 bottom: 100%;
973 height: 10px;
974 top: auto;
975 pointer-events: none;
976 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)));
977 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%);
978 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%);
979}
980.md .toolbar-bottom-md .tab-link-highlight,
981.md .messagebar .tab-link-highlight {
982 bottom: auto;
983 top: 0;
984}
985.md .tabbar-labels {
986 height: 72px;
987}
988.md .tabbar-labels a.tab-link,
989.md .tabbar-labels a.link {
990 padding-top: 12px;
991 padding-bottom: 12px;
992}
993.md .tabbar-labels .tabbar-label {
994 margin-top: 10px;
995 max-width: 100%;
996 overflow: hidden;
997}
998.md .tabbar-labels.toolbar-bottom-md {
999 height: 56px;
1000}
1001.md .tabbar-labels.toolbar-bottom-md a.tab-link,
1002.md .tabbar-labels.toolbar-bottom-md a.link {
1003 padding-top: 7px;
1004 padding-bottom: 7px;
1005}
1006.md .tabbar-labels.toolbar-bottom-md .tabbar-label {
1007 text-transform: none;
1008 line-height: 1.2;
1009 font-weight: normal;
1010 letter-spacing: 0;
1011}
1012.md .tabbar-scrollable .toolbar-inner {
1013 overflow: auto;
1014 -webkit-box-pack: start;
1015 -webkit-justify-content: flex-start;
1016 -ms-flex-pack: start;
1017 justify-content: flex-start;
1018}
1019.md .tabbar-scrollable a.tab-link,
1020.md .tabbar-scrollable a.link {
1021 padding: 0 16px;
1022}
1023.md .toolbar:not(.toolbar-bottom-md):not(.messagebar) ~ * .page-content,
1024.md .toolbar:not(.toolbar-bottom-md):not(.messagebar) ~ .page-content {
1025 padding-top: 48px;
1026}
1027.md .toolbar.tabbar-labels:not(.toolbar-bottom-md) ~ * .page-content,
1028.md .toolbar.tabbar-labels:not(.toolbar-bottom-md) ~ .page-content {
1029 padding-top: 72px;
1030}
1031.md .toolbar-hidden {
1032 -webkit-transform: translate3d(0, -100%, 0);
1033 transform: translate3d(0, -100%, 0);
1034}
1035.md .toolbar-hidden:after {
1036 display: none;
1037}
1038.md .toolbar-hidden.toolbar-bottom-md,
1039.md .toolbar-hidden.messagebar {
1040 -webkit-transform: translate3d(0, 100%, 0);
1041 transform: translate3d(0, 100%, 0);
1042}
1043.md .navbar + .toolbar:not(.toolbar-bottom-md):not(.messagebar) {
1044 top: 56px;
1045}
1046.md .navbar + .toolbar:not(.toolbar-bottom-md):not(.messagebar) ~ * .page-content,
1047.md .navbar + .toolbar:not(.toolbar-bottom-md):not(.messagebar) ~ .page-content {
1048 padding-top: 104px;
1049}
1050.md .navbar + .toolbar.tabbar-labels:not(.toolbar-bottom-md) ~ * .page-content,
1051.md .navbar + .toolbar.tabbar-labels:not(.toolbar-bottom-md) ~ .page-content {
1052 padding-top: 128px;
1053}
1054.md .navbar + .toolbar-hidden:not(.toolbar-bottom-md):not(.messagebar) {
1055 -webkit-transform: translate3d(0, -104px, 0);
1056 transform: translate3d(0, -104px, 0);
1057}
1058.md .navbar + .toolbar-hidden.tabbar-labels:not(.toolbar-bottom-md) {
1059 -webkit-transform: translate3d(0, -128px, 0);
1060 transform: translate3d(0, -128px, 0);
1061}
1062.md .navbar.navbar-hidden + .toolbar:not(.toolbar-bottom-md):not(.messagebar):not(.toolbar-hidden) {
1063 -webkit-transform: translate3d(0, -56px, 0);
1064 transform: translate3d(0, -56px, 0);
1065}
1066@media (min-width: 768px) {
1067 .md .navbar + .toolbar:not(.toolbar-bottom-md):not(.messagebar) {
1068 top: 64px;
1069 }
1070 .md .navbar + .toolbar:not(.toolbar-bottom-md):not(.messagebar) ~ * .page-content,
1071 .md .navbar + .toolbar:not(.toolbar-bottom-md):not(.messagebar) ~ .page-content {
1072 padding-top: 112px;
1073 }
1074 .md .navbar + .toolbar.tabbar-labels:not(.toolbar-bottom-md) ~ * .page-content,
1075 .md .navbar + .toolbar.tabbar-labels:not(.toolbar-bottom-md) ~ .page-content {
1076 padding-top: 136px;
1077 }
1078 .md .navbar.navbar-hidden + .toolbar:not(.toolbar-bottom-md):not(.messagebar):not(.toolbar-hidden) {
1079 -webkit-transform: translate3d(0, -64px, 0);
1080 transform: translate3d(0, -64px, 0);
1081 }
1082 .md .navbar + .toolbar-hidden:not(.toolbar-bottom-md):not(.messagebar) {
1083 -webkit-transform: translate3d(0, -112px, 0);
1084 transform: translate3d(0, -112px, 0);
1085 }
1086 .md .navbar + .toolbar-hidden.tabbar-labels:not(.toolbar-bottom-md):not(.messagebar) {
1087 -webkit-transform: translate3d(0, -136px, 0);
1088 transform: translate3d(0, -136px, 0);
1089 }
1090}
1091.md .toolbar-bottom-md ~ * .page-content,
1092.md .toolbar-bottom-md ~ .page-content,
1093.md .messagebar ~ * .page-content,
1094.md .messagebar ~ .page-content {
1095 padding-bottom: 48px;
1096}
1097.md .toolbar-bottom-md.tabbar-labels ~ * .page-content,
1098.md .toolbar-bottom-md.tabbar-labels ~ .page-content {
1099 padding-bottom: 56px;
1100}
1101.md .toolbar-transitioning,
1102.md .navbar-transitioning + .toolbar {
1103 -webkit-transition-duration: 400ms;
1104 transition-duration: 400ms;
1105}
1106.md .color-theme-red .toolbar:not(.messagebar),
1107.md .color-theme-red.toolbar:not(.messagebar) {
1108 background: #f44336;
1109}
1110.md .color-theme-green .toolbar:not(.messagebar),
1111.md .color-theme-green.toolbar:not(.messagebar) {
1112 background: #4caf50;
1113}
1114.md .color-theme-blue .toolbar:not(.messagebar),
1115.md .color-theme-blue.toolbar:not(.messagebar) {
1116 background: #2196f3;
1117}
1118.md .color-theme-pink .toolbar:not(.messagebar),
1119.md .color-theme-pink.toolbar:not(.messagebar) {
1120 background: #e91e63;
1121}
1122.md .color-theme-yellow .toolbar:not(.messagebar),
1123.md .color-theme-yellow.toolbar:not(.messagebar) {
1124 background: #ffeb3b;
1125}
1126.md .color-theme-orange .toolbar:not(.messagebar),
1127.md .color-theme-orange.toolbar:not(.messagebar) {
1128 background: #ff9800;
1129}
1130.md .color-theme-gray .toolbar:not(.messagebar),
1131.md .color-theme-gray.toolbar:not(.messagebar) {
1132 background: #9e9e9e;
1133}
1134.md .color-theme-white .toolbar:not(.messagebar),
1135.md .color-theme-white.toolbar:not(.messagebar) {
1136 background: #ffffff;
1137}
1138.md .color-theme-black .toolbar:not(.messagebar),
1139.md .color-theme-black.toolbar:not(.messagebar) {
1140 background: #000000;
1141}
1142.md .toolbar:not(.messagebar).color-red {
1143 background: #f44336;
1144}
1145.md .toolbar:not(.messagebar).color-green {
1146 background: #4caf50;
1147}
1148.md .toolbar:not(.messagebar).color-blue {
1149 background: #2196f3;
1150}
1151.md .toolbar:not(.messagebar).color-pink {
1152 background: #e91e63;
1153}
1154.md .toolbar:not(.messagebar).color-yellow {
1155 background: #ffeb3b;
1156}
1157.md .toolbar:not(.messagebar).color-orange {
1158 background: #ff9800;
1159}
1160.md .toolbar:not(.messagebar).color-gray {
1161 background: #9e9e9e;
1162}
1163.md .toolbar:not(.messagebar).color-white {
1164 background: #ffffff;
1165}
1166.md .toolbar:not(.messagebar).color-black {
1167 background: #000000;
1168}
1169.md.device-iphone-x .views > .toolbar:first-child:not(.toolbar-bottom-md),
1170.md.device-iphone-x .view > .toolbar:first-child:not(.toolbar-bottom-md),
1171.md.device-iphone-x .page > .toolbar:first-child:not(.toolbar-bottom-md),
1172.md.device-iphone-x .popup > .toolbar:first-child:not(.toolbar-bottom-md),
1173.md.device-iphone-x .panel > .toolbar:first-child:not(.toolbar-bottom-md),
1174.md.device-iphone-x .login-screen > .toolbar:first-child:not(.toolbar-bottom-md) {
1175 height: calc(48px + constant(safe-area-inset-top));
1176 height: calc(48px + env(safe-area-inset-top));
1177}
1178.md.device-iphone-x .views > .toolbar:first-child:not(.toolbar-bottom-md) .toolbar-inner,
1179.md.device-iphone-x .view > .toolbar:first-child:not(.toolbar-bottom-md) .toolbar-inner,
1180.md.device-iphone-x .page > .toolbar:first-child:not(.toolbar-bottom-md) .toolbar-inner,
1181.md.device-iphone-x .popup > .toolbar:first-child:not(.toolbar-bottom-md) .toolbar-inner,
1182.md.device-iphone-x .panel > .toolbar:first-child:not(.toolbar-bottom-md) .toolbar-inner,
1183.md.device-iphone-x .login-screen > .toolbar:first-child:not(.toolbar-bottom-md) .toolbar-inner {
1184 height: auto;
1185}
1186.md.device-iphone-x .views > .toolbar:first-child:not(.toolbar-bottom-md) .toolbar-inner,
1187.md.device-iphone-x .view > .toolbar:first-child:not(.toolbar-bottom-md) .toolbar-inner,
1188.md.device-iphone-x .page > .toolbar:first-child:not(.toolbar-bottom-md) .toolbar-inner,
1189.md.device-iphone-x .popup > .toolbar:first-child:not(.toolbar-bottom-md) .toolbar-inner,
1190.md.device-iphone-x .panel > .toolbar:first-child:not(.toolbar-bottom-md) .toolbar-inner,
1191.md.device-iphone-x .login-screen > .toolbar:first-child:not(.toolbar-bottom-md) .toolbar-inner {
1192 bottom: 0;
1193 top: constant(safe-area-inset-top);
1194 top: env(safe-area-inset-top);
1195}
1196.md.device-iphone-x .views > .toolbar:first-child:not(.toolbar-bottom-md).tabbar-labels,
1197.md.device-iphone-x .view > .toolbar:first-child:not(.toolbar-bottom-md).tabbar-labels,
1198.md.device-iphone-x .page > .toolbar:first-child:not(.toolbar-bottom-md).tabbar-labels,
1199.md.device-iphone-x .popup > .toolbar:first-child:not(.toolbar-bottom-md).tabbar-labels,
1200.md.device-iphone-x .panel > .toolbar:first-child:not(.toolbar-bottom-md).tabbar-labels,
1201.md.device-iphone-x .login-screen > .toolbar:first-child:not(.toolbar-bottom-md).tabbar-labels {
1202 height: calc(72px + constant(safe-area-inset-top));
1203 height: calc(72px + env(safe-area-inset-top));
1204}
1205.md.device-iphone-x .views > .toolbar-bottom-md,
1206.md.device-iphone-x .view > .toolbar-bottom-md,
1207.md.device-iphone-x .page > .toolbar-bottom-md,
1208.md.device-iphone-x .popup > .toolbar-bottom-md,
1209.md.device-iphone-x .panel > .toolbar-bottom-md,
1210.md.device-iphone-x .login-screen > .toolbar-bottom-md {
1211 height: calc(48px + constant(safe-area-inset-bottom));
1212 height: calc(48px + env(safe-area-inset-bottom));
1213}
1214.md.device-iphone-x .views > .toolbar-bottom-md .toolbar-inner,
1215.md.device-iphone-x .view > .toolbar-bottom-md .toolbar-inner,
1216.md.device-iphone-x .page > .toolbar-bottom-md .toolbar-inner,
1217.md.device-iphone-x .popup > .toolbar-bottom-md .toolbar-inner,
1218.md.device-iphone-x .panel > .toolbar-bottom-md .toolbar-inner,
1219.md.device-iphone-x .login-screen > .toolbar-bottom-md .toolbar-inner {
1220 height: auto;
1221 top: 0;
1222 bottom: constant(safe-area-inset-bottom);
1223 bottom: env(safe-area-inset-bottom);
1224}
1225.md.device-iphone-x .views > .toolbar-bottom-md.tabbar-labels,
1226.md.device-iphone-x .view > .toolbar-bottom-md.tabbar-labels,
1227.md.device-iphone-x .page > .toolbar-bottom-md.tabbar-labels,
1228.md.device-iphone-x .popup > .toolbar-bottom-md.tabbar-labels,
1229.md.device-iphone-x .panel > .toolbar-bottom-md.tabbar-labels,
1230.md.device-iphone-x .login-screen > .toolbar-bottom-md.tabbar-labels {
1231 height: calc(56px + constant(safe-area-inset-bottom));
1232 height: calc(56px + env(safe-area-inset-bottom));
1233}
1234.md.device-iphone-x .toolbar-bottom-md ~ * .page-content,
1235.md.device-iphone-x .toolbar-bottom-md ~ .page-content,
1236.md.device-iphone-x .messagebar ~ * .page-content,
1237.md.device-iphone-x .messagebar ~ .page-content {
1238 padding-bottom: calc(48px + constant(safe-area-inset-bottom));
1239 padding-bottom: calc(48px + env(safe-area-inset-bottom));
1240}
1241.md.device-iphone-x .toolbar-bottom-md.tabbar-labels ~ * .page-content,
1242.md.device-iphone-x .toolbar-bottom-md.tabbar-labels ~ .page-content {
1243 padding-bottom: calc(56px + constant(safe-area-inset-bottom));
1244 padding-bottom: calc(56px + env(safe-area-inset-bottom));
1245}
1246@media (orientation: landscape) {
1247 .md.device-iphone-x .ios-left-edge .toolbar-inner,
1248 .md.device-iphone-x .ios-edges .toolbar-inner,
1249 .md.device-iphone-x .popup .toolbar-inner,
1250 .md.device-iphone-x .sheet-modal .toolbar-inner,
1251 .md.device-iphone-x .panel-left .toolbar-inner {
1252 padding-left: constant(safe-area-inset-left);
1253 padding-left: env(safe-area-inset-left);
1254 }
1255 .md.device-iphone-x .ios-right-edge .toolbar-inner,
1256 .md.device-iphone-x .ios-edges .toolbar-inner,
1257 .md.device-iphone-x .popup .toolbar-inner,
1258 .md.device-iphone-x .sheet-modal .toolbar-inner,
1259 .md.device-iphone-x .panel-right .toolbar-inner {
1260 padding-right: constant(safe-area-inset-right);
1261 padding-right: env(safe-area-inset-right);
1262 }
1263}
1264/* === Subnavbar === */
1265.subnavbar {
1266 width: 100%;
1267 position: absolute;
1268 left: 0;
1269 top: 0;
1270 z-index: 500;
1271 -webkit-box-sizing: border-box;
1272 box-sizing: border-box;
1273 display: -webkit-box;
1274 display: -webkit-flex;
1275 display: -ms-flexbox;
1276 display: flex;
1277 -webkit-box-pack: justify;
1278 -webkit-justify-content: space-between;
1279 -ms-flex-pack: justify;
1280 justify-content: space-between;
1281 -webkit-box-align: center;
1282 -webkit-align-items: center;
1283 -ms-flex-align: center;
1284 align-items: center;
1285}
1286.subnavbar .title {
1287 position: relative;
1288 overflow: hidden;
1289 text-overflow: ellpsis;
1290 white-space: nowrap;
1291}
1292.subnavbar .left,
1293.subnavbar .right {
1294 -webkit-flex-shrink: 0;
1295 -ms-flex-negative: 0;
1296 flex-shrink: 0;
1297 display: -webkit-box;
1298 display: -webkit-flex;
1299 display: -ms-flexbox;
1300 display: flex;
1301 -webkit-box-pack: start;
1302 -webkit-justify-content: flex-start;
1303 -ms-flex-pack: start;
1304 justify-content: flex-start;
1305 -webkit-box-align: center;
1306 -webkit-align-items: center;
1307 -ms-flex-align: center;
1308 align-items: center;
1309}
1310.subnavbar .right:first-child {
1311 position: absolute;
1312 height: 100%;
1313}
1314.subnavbar-inner {
1315 width: 100%;
1316 height: 100%;
1317 display: -webkit-box;
1318 display: -webkit-flex;
1319 display: -ms-flexbox;
1320 display: flex;
1321 -webkit-box-align: center;
1322 -webkit-align-items: center;
1323 -ms-flex-align: center;
1324 align-items: center;
1325 -webkit-box-sizing: border-box;
1326 box-sizing: border-box;
1327 -webkit-box-pack: justify;
1328 -webkit-justify-content: space-between;
1329 -ms-flex-pack: justify;
1330 justify-content: space-between;
1331 overflow: hidden;
1332}
1333.subnavbar-inner.stacked {
1334 display: none;
1335}
1336.navbar .subnavbar {
1337 top: 100%;
1338}
1339.views > .navbar,
1340.view > .navbar,
1341.page > .navbar {
1342 position: absolute;
1343}
1344.md .subnavbar {
1345 height: 48px;
1346 background: #2196f3;
1347 color: #fff;
1348}
1349.md .subnavbar:after {
1350 content: '';
1351 position: absolute;
1352 right: 0;
1353 width: 100%;
1354 top: 100%;
1355 bottom: auto;
1356 height: 10px;
1357 pointer-events: none;
1358 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)));
1359 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%);
1360 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%);
1361}
1362.md .subnavbar.no-shadow:after {
1363 display: none;
1364}
1365.md .subnavbar .title {
1366 margin: 0 16px;
1367 font-size: 20px;
1368 line-height: 48px;
1369 display: inline-block;
1370 text-align: left;
1371 font-weight: 500;
1372}
1373.md .subnavbar .title:first-child {
1374 margin-right: 56px;
1375}
1376.md .subnavbar .right {
1377 margin-right: auto;
1378}
1379.md .subnavbar .right:first-child {
1380 left: 16px;
1381}
1382.md .subnavbar a {
1383 color: inherit;
1384}
1385.md .subnavbar a.link {
1386 line-height: 48px;
1387 height: 48px;
1388 min-width: 48px;
1389 -webkit-box-pack: center;
1390 -webkit-justify-content: center;
1391 -ms-flex-pack: center;
1392 justify-content: center;
1393 padding: 0 16px;
1394}
1395.md .subnavbar a.link:before {
1396 content: '';
1397 width: 152%;
1398 height: 152%;
1399 position: absolute;
1400 left: -26%;
1401 top: -26%;
1402 background-image: -webkit-radial-gradient(center, circle, rgba(255, 255, 255, 0.15) 66%, rgba(255, 255, 255, 0) 66%);
1403 background-image: radial-gradient(circle at center, rgba(255, 255, 255, 0.15) 66%, rgba(255, 255, 255, 0) 66%);
1404 background-repeat: no-repeat;
1405 background-position: center;
1406 background-size: 100% 100%;
1407 opacity: 0;
1408 pointer-events: none;
1409 -webkit-transition-duration: 600ms;
1410 transition-duration: 600ms;
1411}
1412.md .subnavbar a.link.active-state:before {
1413 opacity: 1;
1414 -webkit-transition-duration: 150ms;
1415 transition-duration: 150ms;
1416}
1417.md .subnavbar a.icon-only {
1418 -webkit-flex-shrink: 0;
1419 -ms-flex-negative: 0;
1420 flex-shrink: 0;
1421 min-width: 0;
1422}
1423.md .subnavbar-inner {
1424 padding: 0 16px;
1425}
1426.md .subnavbar-inner > a.link:first-child {
1427 margin-right: -16px;
1428}
1429.md .subnavbar-inner > a.link:last-child {
1430 margin-left: -16px;
1431}
1432.md .subnavbar ~ * .page-content,
1433.md .subnavbar ~ .page-content,
1434.md .page-with-subnavbar .page-content {
1435 padding-top: 48px;
1436}
1437.md .navbar ~ .subnavbar ~ .page-content,
1438.md .navbar ~ .subnavbar ~ * .page-content,
1439.md .page-with-subnavbar .navbar ~ * .page-content,
1440.md .page-with-subnavbar .navbar ~ .page-content {
1441 padding-top: 104px;
1442}
1443@media (min-width: 768px) {
1444 .md .navbar ~ .subnavbar ~ .page-content,
1445 .md .navbar ~ .subnavbar ~ * .page-content,
1446 .md .page-with-subnavbar .navbar ~ * .page-content,
1447 .md .page-with-subnavbar .navbar ~ .page-content {
1448 padding-top: 112px;
1449 }
1450}
1451.md .navbar ~ .subnavbar,
1452.md .navbar ~ * .subnavbar,
1453.md .page-with-subnavbar .navbar ~ .subnavbar,
1454.md .page-with-subnavbar .navbar ~ * .subnavbar {
1455 top: 56px;
1456}
1457@media (min-width: 768px) {
1458 .md .navbar ~ .subnavbar,
1459 .md .navbar ~ * .subnavbar,
1460 .md .page-with-subnavbar .navbar ~ .subnavbar,
1461 .md .page-with-subnavbar .navbar ~ * .subnavbar {
1462 top: 64px;
1463 }
1464}
1465.md .color-theme-red .subnavbar,
1466.md .color-theme-red.subnavbar {
1467 background: #f44336;
1468}
1469.md .color-theme-green .subnavbar,
1470.md .color-theme-green.subnavbar {
1471 background: #4caf50;
1472}
1473.md .color-theme-blue .subnavbar,
1474.md .color-theme-blue.subnavbar {
1475 background: #2196f3;
1476}
1477.md .color-theme-pink .subnavbar,
1478.md .color-theme-pink.subnavbar {
1479 background: #e91e63;
1480}
1481.md .color-theme-yellow .subnavbar,
1482.md .color-theme-yellow.subnavbar {
1483 background: #ffeb3b;
1484}
1485.md .color-theme-orange .subnavbar,
1486.md .color-theme-orange.subnavbar {
1487 background: #ff9800;
1488}
1489.md .color-theme-gray .subnavbar,
1490.md .color-theme-gray.subnavbar {
1491 background: #9e9e9e;
1492}
1493.md .color-theme-white .subnavbar,
1494.md .color-theme-white.subnavbar {
1495 background: #ffffff;
1496}
1497.md .color-theme-black .subnavbar,
1498.md .color-theme-black.subnavbar {
1499 background: #000000;
1500}
1501.md .subnavbar.color-red {
1502 background: #f44336;
1503}
1504.md .subnavbar.color-green {
1505 background: #4caf50;
1506}
1507.md .subnavbar.color-blue {
1508 background: #2196f3;
1509}
1510.md .subnavbar.color-pink {
1511 background: #e91e63;
1512}
1513.md .subnavbar.color-yellow {
1514 background: #ffeb3b;
1515}
1516.md .subnavbar.color-orange {
1517 background: #ff9800;
1518}
1519.md .subnavbar.color-gray {
1520 background: #9e9e9e;
1521}
1522.md .subnavbar.color-white {
1523 background: #ffffff;
1524}
1525.md .subnavbar.color-black {
1526 background: #000000;
1527}
1528@media (orientation: landscape) {
1529 .md.device-iphone-x .ios-left-edge .subnavbar-inner,
1530 .md.device-iphone-x .ios-edges .subnavbar-inner,
1531 .md.device-iphone-x .popup .subnavbar-inner,
1532 .md.device-iphone-x .sheet-modal .subnavbar-inner,
1533 .md.device-iphone-x .panel-left .subnavbar-inner {
1534 padding-left: calc(16px + constant(safe-area-inset-left));
1535 padding-left: calc(16px + env(safe-area-inset-left));
1536 }
1537 .md.device-iphone-x .ios-right-edge .subnavbar-inner,
1538 .md.device-iphone-x .ios-edges .subnavbar-inner,
1539 .md.device-iphone-x .popup .subnavbar-inner,
1540 .md.device-iphone-x .sheet-modal .subnavbar-inner,
1541 .md.device-iphone-x .panel-right .subnavbar-inner {
1542 padding-right: calc(16px + constant(safe-area-inset-right));
1543 padding-right: calc(16px + env(safe-area-inset-right));
1544 }
1545}
1546/* === Content Block === */
1547.block {
1548 -webkit-box-sizing: border-box;
1549 box-sizing: border-box;
1550 position: relative;
1551 z-index: 1;
1552}
1553.block.no-hairlines:before,
1554.block.no-hairlines ul:before,
1555.md .block.no-hairlines-md:before,
1556.md .block.no-hairlines-md ul:before,
1557.ios .block.no-hairlines-ios:before,
1558.ios .block.no-hairlines-ios ul:before {
1559 display: none !important;
1560}
1561.block.no-hairlines:after,
1562.block.no-hairlines ul:after,
1563.md .block.no-hairlines-md:after,
1564.md .block.no-hairlines-md ul:after,
1565.ios .block.no-hairlines-ios:after,
1566.ios .block.no-hairlines-ios ul:after {
1567 display: none !important;
1568}
1569.block.no-hairline-top:before,
1570.block.no-hairline-top ul:before,
1571.md .block.no-hairline-top-md:before,
1572.md .block.no-hairline-top-md ul:before,
1573.ios .block.no-hairline-top-ios:before,
1574.ios .block.no-hairline-top-ios ul:before {
1575 display: none !important;
1576}
1577.block.no-hairline-bottom:after,
1578.block.no-hairline-bottom ul:after,
1579.md .block.no-hairline-bottom-md:after,
1580.md .block.no-hairline-bottom-md ul:after,
1581.ios .block.no-hairline-bottom-ios:after,
1582.ios .block.no-hairline-bottom-ios ul:after {
1583 display: none !important;
1584}
1585.block > h1:first-child,
1586.block > h2:first-child,
1587.block > h3:first-child,
1588.block > h4:first-child,
1589.block > p:first-child {
1590 margin-top: 0;
1591}
1592.block > h1:last-child,
1593.block > h2:last-child,
1594.block > h3:last-child,
1595.block > h4:last-child,
1596.block > p:last-child {
1597 margin-bottom: 0;
1598}
1599.block-title {
1600 position: relative;
1601 overflow: hidden;
1602 margin: 0;
1603 white-space: nowrap;
1604 text-overflow: ellipsis;
1605 font-size: 14px;
1606 line-height: 1;
1607}
1608.block-strong.inset {
1609 border-radius: 7px;
1610}
1611.block-strong.inset:before {
1612 display: none !important;
1613}
1614.block-strong.inset:after {
1615 display: none !important;
1616}
1617.block-footer,
1618.block-header {
1619 font-size: 14px;
1620}
1621.block-footer ul:first-child,
1622.block-header ul:first-child,
1623.block-footer p:first-child,
1624.block-header p:first-child,
1625.block-footer h1:first-child,
1626.block-header h1:first-child,
1627.block-footer h2:first-child,
1628.block-header h2:first-child,
1629.block-footer h3:first-child,
1630.block-header h3:first-child,
1631.block-footer h4:first-child,
1632.block-header h4:first-child {
1633 margin-top: 0;
1634}
1635.block-footer ul:last-child,
1636.block-header ul:last-child,
1637.block-footer p:last-child,
1638.block-header p:last-child,
1639.block-footer h1:last-child,
1640.block-header h1:last-child,
1641.block-footer h2:last-child,
1642.block-header h2:last-child,
1643.block-footer h3:last-child,
1644.block-header h3:last-child,
1645.block-footer h4:last-child,
1646.block-header h4:last-child {
1647 margin-bottom: 0;
1648}
1649.block-footer ul:first-child:last-child,
1650.block-header ul:first-child:last-child,
1651.block-footer p:first-child:last-child,
1652.block-header p:first-child:last-child,
1653.block-footer h1:first-child:last-child,
1654.block-header h1:first-child:last-child,
1655.block-footer h2:first-child:last-child,
1656.block-header h2:first-child:last-child,
1657.block-footer h3:first-child:last-child,
1658.block-header h3:first-child:last-child,
1659.block-footer h4:first-child:last-child,
1660.block-header h4:first-child:last-child {
1661 margin-top: 0;
1662 margin-bottom: 0;
1663}
1664.block-header {
1665 margin-bottom: 10px;
1666}
1667.block-footer {
1668 margin-top: 10px;
1669}
1670@media (min-width: 768px) {
1671 .block-strong.tablet-inset:before {
1672 display: none !important;
1673 }
1674 .block-strong.tablet-inset:after {
1675 display: none !important;
1676 }
1677}
1678.md .block {
1679 margin: 32px 0;
1680 padding: 0 16px;
1681}
1682.md .block-title {
1683 color: rgba(0, 0, 0, 0.54);
1684 margin: 32px 16px 16px;
1685 line-height: 16px;
1686 font-weight: 500;
1687}
1688.md .block-title + .list,
1689.md .block-title + .block,
1690.md .block-title + .card,
1691.md .block-title + .timeline,
1692.md .block-title + .block-header {
1693 margin-top: 0px;
1694}
1695.md .block-strong {
1696 padding: 16px;
1697}
1698.md .block-strong:before {
1699 content: '';
1700 position: absolute;
1701 background-color: rgba(0, 0, 0, 0.12);
1702 display: block;
1703 z-index: 15;
1704 top: 0;
1705 right: auto;
1706 bottom: auto;
1707 left: 0;
1708 height: 1px;
1709 width: 100%;
1710 -webkit-transform-origin: 50% 0%;
1711 transform-origin: 50% 0%;
1712}
1713.md.device-pixel-ratio-2 .block-strong:before {
1714 -webkit-transform: scaleY(0.5);
1715 transform: scaleY(0.5);
1716}
1717.md.device-pixel-ratio-3 .block-strong:before {
1718 -webkit-transform: scaleY(0.33);
1719 transform: scaleY(0.33);
1720}
1721.md .block-strong:after {
1722 content: '';
1723 position: absolute;
1724 background-color: rgba(0, 0, 0, 0.12);
1725 display: block;
1726 z-index: 15;
1727 top: auto;
1728 right: auto;
1729 bottom: 0;
1730 left: 0;
1731 height: 1px;
1732 width: 100%;
1733 -webkit-transform-origin: 50% 100%;
1734 transform-origin: 50% 100%;
1735}
1736.md.device-pixel-ratio-2 .block-strong:after {
1737 -webkit-transform: scaleY(0.5);
1738 transform: scaleY(0.5);
1739}
1740.md.device-pixel-ratio-3 .block-strong:after {
1741 -webkit-transform: scaleY(0.33);
1742 transform: scaleY(0.33);
1743}
1744.md .block.inset {
1745 margin-left: 16px;
1746 margin-right: 16px;
1747}
1748.md .block-strong.inset {
1749 border-radius: 4px;
1750}
1751.md .block-header,
1752.md .block-footer {
1753 padding: 0 16px;
1754 color: rgba(0, 0, 0, 0.54);
1755}
1756.md .block .block-header,
1757.md .block .block-footer {
1758 padding: 0;
1759}
1760.md .block-header {
1761 margin-top: 32px;
1762}
1763.md .block-header + .list,
1764.md .block-header + .block,
1765.md .block-header + .card,
1766.md .block-header + .timeline {
1767 margin-top: 10px;
1768}
1769.md .block-footer {
1770 margin-bottom: 32px;
1771}
1772.md .list .block-header,
1773.md .block .block-header,
1774.md .card .block-header,
1775.md .timeline .block-header {
1776 margin-top: 0;
1777}
1778.md .list .block-footer,
1779.md .block .block-footer,
1780.md .card .block-footer,
1781.md .timeline .block-footer {
1782 margin-bottom: 0;
1783}
1784.md .list + .block-footer,
1785.md .block + .block-footer,
1786.md .card + .block-footer,
1787.md .timeline + .block-footer {
1788 margin-top: -22px;
1789}
1790.md .block + .block-footer {
1791 margin-top: -22px;
1792 margin-bottom: 32px;
1793}
1794@media (min-width: 768px) {
1795 .md .block.tablet-inset {
1796 margin-left: 16px;
1797 margin-right: 16px;
1798 border-radius: 4px;
1799 }
1800 .md .block-strong.tablet-inset {
1801 border-radius: 4px;
1802 }
1803}
1804.md .theme-dark .block-title {
1805 color: #fff;
1806}
1807.md .theme-dark .block-header,
1808.md .theme-dark .block-footer {
1809 color: rgba(255, 255, 255, 0.54);
1810}
1811@media (orientation: landscape) {
1812 .md.device-iphone-x .ios-left-edge .block:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge),
1813 .md.device-iphone-x .ios-edges .block:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge),
1814 .md.device-iphone-x .popup .block:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge),
1815 .md.device-iphone-x .sheet-modal .block:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge),
1816 .md.device-iphone-x .panel-left .block:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge),
1817 .md.device-iphone-x .ios-left-edge .block-header,
1818 .md.device-iphone-x .ios-edges .block-header,
1819 .md.device-iphone-x .popup .block-header,
1820 .md.device-iphone-x .sheet-modal .block-header,
1821 .md.device-iphone-x .panel-left .block-header,
1822 .md.device-iphone-x .ios-left-edge .block-footer,
1823 .md.device-iphone-x .ios-edges .block-footer,
1824 .md.device-iphone-x .popup .block-footer,
1825 .md.device-iphone-x .sheet-modal .block-footer,
1826 .md.device-iphone-x .panel-left .block-footer {
1827 padding-left: calc(16px + constant(safe-area-inset-left));
1828 padding-left: calc(16px + env(safe-area-inset-left));
1829 }
1830 .md.device-iphone-x .ios-left-edge .block:not(.no-ios-edges):not(.no-ios-left-edge) .block-header,
1831 .md.device-iphone-x .ios-edges .block:not(.no-ios-edges):not(.no-ios-left-edge) .block-header,
1832 .md.device-iphone-x .popup .block:not(.no-ios-edges):not(.no-ios-left-edge) .block-header,
1833 .md.device-iphone-x .sheet-modal .block:not(.no-ios-edges):not(.no-ios-left-edge) .block-header,
1834 .md.device-iphone-x .panel-left .block:not(.no-ios-edges):not(.no-ios-left-edge) .block-header,
1835 .md.device-iphone-x .ios-left-edge .block:not(.no-ios-edges):not(.no-ios-left-edge) .block-footer,
1836 .md.device-iphone-x .ios-edges .block:not(.no-ios-edges):not(.no-ios-left-edge) .block-footer,
1837 .md.device-iphone-x .popup .block:not(.no-ios-edges):not(.no-ios-left-edge) .block-footer,
1838 .md.device-iphone-x .sheet-modal .block:not(.no-ios-edges):not(.no-ios-left-edge) .block-footer,
1839 .md.device-iphone-x .panel-left .block:not(.no-ios-edges):not(.no-ios-left-edge) .block-footer {
1840 padding-left: 0;
1841 }
1842 .md.device-iphone-x .ios-left-edge .block.inset:not(.no-ios-edges):not(.no-ios-left-edge),
1843 .md.device-iphone-x .ios-edges .block.inset:not(.no-ios-edges):not(.no-ios-left-edge),
1844 .md.device-iphone-x .popup .block.inset:not(.no-ios-edges):not(.no-ios-left-edge),
1845 .md.device-iphone-x .sheet-modal .block.inset:not(.no-ios-edges):not(.no-ios-left-edge),
1846 .md.device-iphone-x .panel-left .block.inset:not(.no-ios-edges):not(.no-ios-left-edge),
1847 .md.device-iphone-x .ios-left-edge .block-title:not(.no-ios-edges):not(.no-ios-left-edge),
1848 .md.device-iphone-x .ios-edges .block-title:not(.no-ios-edges):not(.no-ios-left-edge),
1849 .md.device-iphone-x .popup .block-title:not(.no-ios-edges):not(.no-ios-left-edge),
1850 .md.device-iphone-x .sheet-modal .block-title:not(.no-ios-edges):not(.no-ios-left-edge),
1851 .md.device-iphone-x .panel-left .block-title:not(.no-ios-edges):not(.no-ios-left-edge) {
1852 margin-left: calc(16px + constant(safe-area-inset-left));
1853 margin-left: calc(16px + env(safe-area-inset-left));
1854 }
1855 .md.device-iphone-x .ios-right-edge .block:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge),
1856 .md.device-iphone-x .ios-edges .block:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge),
1857 .md.device-iphone-x .popup .block:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge),
1858 .md.device-iphone-x .sheet-modal .block:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge),
1859 .md.device-iphone-x .panel-right .block:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge),
1860 .md.device-iphone-x .ios-right-edge .block-header,
1861 .md.device-iphone-x .ios-edges .block-header,
1862 .md.device-iphone-x .popup .block-header,
1863 .md.device-iphone-x .sheet-modal .block-header,
1864 .md.device-iphone-x .panel-right .block-header,
1865 .md.device-iphone-x .ios-right-edge .block-footer,
1866 .md.device-iphone-x .ios-edges .block-footer,
1867 .md.device-iphone-x .popup .block-footer,
1868 .md.device-iphone-x .sheet-modal .block-footer,
1869 .md.device-iphone-x .panel-right .block-footer {
1870 padding-right: calc(16px + constant(safe-area-inset-right));
1871 padding-right: calc(16px + env(safe-area-inset-right));
1872 }
1873 .md.device-iphone-x .ios-right-edge .block:not(.no-ios-edges):not(.no-ios-right-edge) .block-header,
1874 .md.device-iphone-x .ios-edges .block:not(.no-ios-edges):not(.no-ios-right-edge) .block-header,
1875 .md.device-iphone-x .popup .block:not(.no-ios-edges):not(.no-ios-right-edge) .block-header,
1876 .md.device-iphone-x .sheet-modal .block:not(.no-ios-edges):not(.no-ios-right-edge) .block-header,
1877 .md.device-iphone-x .panel-right .block:not(.no-ios-edges):not(.no-ios-right-edge) .block-header,
1878 .md.device-iphone-x .ios-right-edge .block:not(.no-ios-edges):not(.no-ios-right-edge) .block-footer,
1879 .md.device-iphone-x .ios-edges .block:not(.no-ios-edges):not(.no-ios-right-edge) .block-footer,
1880 .md.device-iphone-x .popup .block:not(.no-ios-edges):not(.no-ios-right-edge) .block-footer,
1881 .md.device-iphone-x .sheet-modal .block:not(.no-ios-edges):not(.no-ios-right-edge) .block-footer,
1882 .md.device-iphone-x .panel-right .block:not(.no-ios-edges):not(.no-ios-right-edge) .block-footer {
1883 padding-right: 0;
1884 }
1885 .md.device-iphone-x .ios-right-edge .block.inset:not(.no-ios-edges):not(.no-ios-right-edge),
1886 .md.device-iphone-x .ios-edges .block.inset:not(.no-ios-edges):not(.no-ios-right-edge),
1887 .md.device-iphone-x .popup .block.inset:not(.no-ios-edges):not(.no-ios-right-edge),
1888 .md.device-iphone-x .sheet-modal .block.inset:not(.no-ios-edges):not(.no-ios-right-edge),
1889 .md.device-iphone-x .panel-right .block.inset:not(.no-ios-edges):not(.no-ios-right-edge),
1890 .md.device-iphone-x .ios-right-edge .block-title:not(.no-ios-edges):not(.no-ios-right-edge),
1891 .md.device-iphone-x .ios-edges .block-title:not(.no-ios-edges):not(.no-ios-right-edge),
1892 .md.device-iphone-x .popup .block-title:not(.no-ios-edges):not(.no-ios-right-edge),
1893 .md.device-iphone-x .sheet-modal .block-title:not(.no-ios-edges):not(.no-ios-right-edge),
1894 .md.device-iphone-x .panel-right .block-title:not(.no-ios-edges):not(.no-ios-right-edge) {
1895 margin-right: calc(16px + constant(safe-area-inset-right));
1896 margin-right: calc(16px + env(safe-area-inset-right));
1897 }
1898}
1899@media (orientation: landscape) and (min-width: 768px) {
1900 .md.device-iphone-x .ios-left-edge .block.tablet-inset:not(.no-ios-edges):not(.no-ios-left-edge),
1901 .md.device-iphone-x .ios-edges .block.tablet-inset:not(.no-ios-edges):not(.no-ios-left-edge),
1902 .md.device-iphone-x .popup .block.tablet-inset:not(.no-ios-edges):not(.no-ios-left-edge),
1903 .md.device-iphone-x .sheet-modal .block.tablet-inset:not(.no-ios-edges):not(.no-ios-left-edge),
1904 .md.device-iphone-x .panel-left .block.tablet-inset:not(.no-ios-edges):not(.no-ios-left-edge) {
1905 margin-left: calc(16px + constant(safe-area-inset-left));
1906 margin-left: calc(16px + env(safe-area-inset-left));
1907 }
1908}
1909@media (orientation: landscape) and (min-width: 768px) {
1910 .md.device-iphone-x .ios-right-edge .block.tablet-inset:not(.no-ios-edges):not(.no-ios-right-edge),
1911 .md.device-iphone-x .ios-edges .block.tablet-inset:not(.no-ios-edges):not(.no-ios-right-edge),
1912 .md.device-iphone-x .popup .block.tablet-inset:not(.no-ios-edges):not(.no-ios-right-edge),
1913 .md.device-iphone-x .sheet-modal .block.tablet-inset:not(.no-ios-edges):not(.no-ios-right-edge),
1914 .md.device-iphone-x .panel-right .block.tablet-inset:not(.no-ios-edges):not(.no-ios-right-edge) {
1915 margin-right: calc(16px + constant(safe-area-inset-right));
1916 margin-right: calc(16px + env(safe-area-inset-right));
1917 }
1918}
1919/* === List View === */
1920.list {
1921 position: relative;
1922 z-index: 1;
1923}
1924.list ul {
1925 list-style: none;
1926 margin: 0;
1927 padding: 0;
1928 position: relative;
1929}
1930.list ul ul:before {
1931 display: none !important;
1932}
1933.list ul ul:after {
1934 display: none !important;
1935}
1936.list li {
1937 position: relative;
1938 -webkit-box-sizing: border-box;
1939 box-sizing: border-box;
1940}
1941.list .item-media {
1942 display: -webkit-box;
1943 display: -webkit-flex;
1944 display: -ms-flexbox;
1945 display: flex;
1946 -webkit-flex-shrink: 0;
1947 -ms-flex-negative: 0;
1948 flex-shrink: 0;
1949 -webkit-flex-wrap: nowrap;
1950 -ms-flex-wrap: nowrap;
1951 flex-wrap: nowrap;
1952 -webkit-box-align: center;
1953 -webkit-align-items: center;
1954 -ms-flex-align: center;
1955 align-items: center;
1956 -webkit-box-sizing: border-box;
1957 box-sizing: border-box;
1958 padding-bottom: 8px;
1959}
1960.list .item-inner {
1961 position: relative;
1962 width: 100%;
1963 padding-top: 8px;
1964 padding-bottom: 8px;
1965 min-width: 0;
1966 display: -webkit-box;
1967 display: -webkit-flex;
1968 display: -ms-flexbox;
1969 display: flex;
1970 -webkit-box-pack: justify;
1971 -webkit-justify-content: space-between;
1972 -ms-flex-pack: justify;
1973 justify-content: space-between;
1974 -webkit-box-sizing: border-box;
1975 box-sizing: border-box;
1976 -webkit-box-align: center;
1977 -webkit-align-items: center;
1978 -ms-flex-align: center;
1979 align-items: center;
1980 -webkit-align-self: stretch;
1981 -ms-flex-item-align: stretch;
1982 align-self: stretch;
1983}
1984.list .item-title {
1985 min-width: 0;
1986 -webkit-flex-shrink: 1;
1987 -ms-flex-negative: 1;
1988 flex-shrink: 1;
1989 white-space: nowrap;
1990 position: relative;
1991 overflow: hidden;
1992 text-overflow: ellipsis;
1993 max-width: 100%;
1994}
1995.list .item-after {
1996 white-space: nowrap;
1997 -webkit-flex-shrink: 0;
1998 -ms-flex-negative: 0;
1999 flex-shrink: 0;
2000 display: -webkit-box;
2001 display: -webkit-flex;
2002 display: -ms-flexbox;
2003 display: flex;
2004 margin-right: auto;
2005}
2006.list .item-link,
2007.list .list-button {
2008 -webkit-transition-duration: 300ms;
2009 transition-duration: 300ms;
2010 -webkit-transition-property: background-color;
2011 transition-property: background-color;
2012 display: block;
2013 position: relative;
2014 overflow: hidden;
2015 z-index: 0;
2016}
2017.list .item-content {
2018 display: -webkit-box;
2019 display: -webkit-flex;
2020 display: -ms-flexbox;
2021 display: flex;
2022 -webkit-box-pack: justify;
2023 -webkit-justify-content: space-between;
2024 -ms-flex-pack: justify;
2025 justify-content: space-between;
2026 -webkit-box-sizing: border-box;
2027 box-sizing: border-box;
2028 -webkit-box-align: center;
2029 -webkit-align-items: center;
2030 -ms-flex-align: center;
2031 align-items: center;
2032}
2033.list .item-subtitle {
2034 position: relative;
2035 overflow: hidden;
2036 white-space: nowrap;
2037 max-width: 100%;
2038 text-overflow: ellipsis;
2039}
2040.list .item-text {
2041 position: relative;
2042 overflow: hidden;
2043 text-overflow: hidden;
2044 -webkit-line-clamp: 2;
2045 -webkit-box-orient: vertical;
2046 display: -webkit-box;
2047}
2048.list .item-title-row {
2049 display: -webkit-box;
2050 display: -webkit-flex;
2051 display: -ms-flexbox;
2052 display: flex;
2053 -webkit-box-pack: justify;
2054 -webkit-justify-content: space-between;
2055 -ms-flex-pack: justify;
2056 justify-content: space-between;
2057 -webkit-box-sizing: border-box;
2058 box-sizing: border-box;
2059}
2060.list .item-title-row .item-after {
2061 -webkit-align-self: center;
2062 -ms-flex-item-align: center;
2063 align-self: center;
2064}
2065.list .item-row {
2066 display: -webkit-box;
2067 display: -webkit-flex;
2068 display: -ms-flexbox;
2069 display: flex;
2070 -webkit-box-pack: justify;
2071 -webkit-justify-content: space-between;
2072 -ms-flex-pack: justify;
2073 justify-content: space-between;
2074 -webkit-box-sizing: border-box;
2075 box-sizing: border-box;
2076}
2077.list .item-cell {
2078 display: block;
2079 -webkit-align-self: center;
2080 -ms-flex-item-align: center;
2081 align-self: center;
2082 -webkit-box-sizing: border-box;
2083 box-sizing: border-box;
2084 -webkit-flex-shrink: 1;
2085 -ms-flex-negative: 1;
2086 flex-shrink: 1;
2087}
2088.list li:last-child .list-button:after {
2089 display: none !important;
2090}
2091.list li:last-child > .item-inner:after,
2092.list li:last-child li:last-child > .item-inner:after,
2093.list li:last-child > .item-content > .item-inner:after,
2094.list li:last-child li:last-child > .item-content > .item-inner:after,
2095.list li:last-child > .swipeout-content > .item-content > .item-inner:after,
2096.list li:last-child li:last-child > .swipeout-content > .item-content > .item-inner:after,
2097.list li:last-child > .item-link > .item-content > .item-inner:after,
2098.list li:last-child li:last-child > .item-link > .item-content > .item-inner:after {
2099 display: none !important;
2100}
2101.list.no-hairlines:before,
2102.list.no-hairlines ul:before,
2103.md .list.no-hairlines-md:before,
2104.md .list.no-hairlines-md ul:before,
2105.ios .list.no-hairlines-ios:before,
2106.ios .list.no-hairlines-ios ul:before {
2107 display: none !important;
2108}
2109.list.no-hairlines:after,
2110.list.no-hairlines ul:after,
2111.md .list.no-hairlines-md:after,
2112.md .list.no-hairlines-md ul:after,
2113.ios .list.no-hairlines-ios:after,
2114.ios .list.no-hairlines-ios ul:after {
2115 display: none !important;
2116}
2117.list.no-hairline-top:before,
2118.list.no-hairline-top ul:before,
2119.md .list.no-hairline-top-md:before,
2120.md .list.no-hairline-top-md ul:before,
2121.ios .list.no-hairline-top-ios:before,
2122.ios .list.no-hairline-top-ios ul:before {
2123 display: none !important;
2124}
2125.list.no-hairline-bottom:after,
2126.list.no-hairline-bottom ul:after,
2127.md .list.no-hairline-bottom-md:after,
2128.md .list.no-hairline-bottom-md ul:after,
2129.ios .list.no-hairline-bottom-ios:after,
2130.ios .list.no-hairline-bottom-ios ul:after {
2131 display: none !important;
2132}
2133.list.no-hairlines-between .item-inner:after,
2134.md .list.no-hairlines-between-md .item-inner:after,
2135.ios .list.no-hairlines-between-ios .item-inner:after,
2136.list.no-hairlines-between .list-button:after,
2137.md .list.no-hairlines-between-md .list-button:after,
2138.ios .list.no-hairlines-between-ios .list-button:after,
2139.list.no-hairlines-between .item-divider:after,
2140.md .list.no-hairlines-between-md .item-divider:after,
2141.ios .list.no-hairlines-between-ios .item-divider:after,
2142.list.no-hairlines-between .list-group-title:after,
2143.md .list.no-hairlines-between-md .list-group-title:after,
2144.ios .list.no-hairlines-between-ios .list-group-title:after,
2145.list.no-hairlines-between .list-group-title:after,
2146.md .list.no-hairlines-between-md .list-group-title:after,
2147.ios .list.no-hairlines-between-ios .list-group-title:after {
2148 display: none !important;
2149}
2150.list.no-hairlines-between.simple-list li:after,
2151.md .list.no-hairlines-between-md.simple-list li:after,
2152.ios .list.no-hairlines-between-ios.simple-list li:after {
2153 display: none !important;
2154}
2155.list.no-hairlines-between.links-list a:after,
2156.md .list.no-hairlines-between-md.links-list a:after,
2157.ios .list.no-hairlines-between-ios.links-list a:after {
2158 display: none !important;
2159}
2160.list.simple-list li {
2161 position: relative;
2162 white-space: nowrap;
2163 text-overflow: ellipsis;
2164 max-width: 100%;
2165 -webkit-box-sizing: border-box;
2166 box-sizing: border-box;
2167 display: -webkit-box;
2168 display: -webkit-flex;
2169 display: -ms-flexbox;
2170 display: flex;
2171 -webkit-box-pack: justify;
2172 -webkit-justify-content: space-between;
2173 -ms-flex-pack: justify;
2174 justify-content: space-between;
2175 -webkit-box-align: center;
2176 -webkit-align-items: center;
2177 -ms-flex-align: center;
2178 align-items: center;
2179 -webkit-align-content: center;
2180 -ms-flex-line-pack: center;
2181 align-content: center;
2182}
2183.list.simple-list li:last-child:after {
2184 display: none !important;
2185}
2186.list.links-list a {
2187 -webkit-transition-duration: 300ms;
2188 transition-duration: 300ms;
2189 -webkit-transition-property: background-color;
2190 transition-property: background-color;
2191 display: block;
2192 position: relative;
2193 overflow: hidden;
2194 display: -webkit-box;
2195 display: -webkit-flex;
2196 display: -ms-flexbox;
2197 display: flex;
2198 -webkit-box-align: center;
2199 -webkit-align-items: center;
2200 -ms-flex-align: center;
2201 align-items: center;
2202 -webkit-align-content: center;
2203 -ms-flex-line-pack: center;
2204 align-content: center;
2205 -webkit-box-pack: justify;
2206 -webkit-justify-content: space-between;
2207 -ms-flex-pack: justify;
2208 justify-content: space-between;
2209 -webkit-box-sizing: border-box;
2210 box-sizing: border-box;
2211 white-space: nowrap;
2212 text-overflow: ellipsis;
2213 max-width: 100%;
2214}
2215.list.links-list li:last-child a:after {
2216 display: none !important;
2217}
2218.media-list .item-inner,
2219li.media-item .item-inner {
2220 display: block;
2221 -webkit-align-self: stretch;
2222 -ms-flex-item-align: stretch;
2223 align-self: stretch;
2224}
2225.media-list .item-link .item-inner,
2226li.media-item .item-link .item-inner {
2227 background: none;
2228}
2229.media-list .item-media,
2230li.media-item .item-media {
2231 -webkit-align-self: flex-start;
2232 -ms-flex-item-align: start;
2233 align-self: flex-start;
2234}
2235.media-list .item-media img,
2236li.media-item .item-media img {
2237 display: block;
2238}
2239.list .item-link .item-inner,
2240.links-list a,
2241.media-list .item-link .item-title-row,
2242li.media-item .item-link .item-title-row,
2243.media-list.chevron-center .item-link .item-inner,
2244.media-list .chevron-center .item-link .item-inner,
2245.media-list .item-link.chevron-center .item-inner,
2246li.media-item.chevron-center .item-link .item-inner,
2247li.media-item .chevron-center .item-link .item-inner,
2248li.media-item .item-link.chevron-center .item-inner {
2249 background-size: 8px 13px;
2250 background-repeat: no-repeat;
2251 background-position: 15px center;
2252 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(6.500000%2C%206.500000)%20rotate(-225.000000)%20translate(-6.500000%2C%20-6.500000)%20'%20points%3D'11%2011%2011%202%209%202%209%209%202%209%202%2011%2010%2011'%3E%3C%2Fpolygon%3E%3C%2Fsvg%3E");
2253}
2254.links-list.no-chevron a,
2255.no-chevron .links-list a,
2256.links-list .no-chevron a,
2257.item-link.no-chevron .item-inner,
2258.no-chevron .item-link .item-inner,
2259.media-list.no-chevron .item-link .item-title-row,
2260.no-chevron .media-list .item-link .item-title-row,
2261li.media-item .no-chevron .item-title-row,
2262li.media-item.no-chevron .item-title-row,
2263.media-list.chevron-center .item-title-row,
2264.media-list .chevron-center .item-title-row,
2265li.media-item.chevron-center .item-title-row,
2266li.media-item .chevron-center .item-title-row {
2267 background-image: none !important;
2268}
2269.media-list .item-link .item-inner,
2270li.media-item .item-link .item-inner {
2271 background-image: none;
2272}
2273.media-list .item-link .item-title-row,
2274li.media-item .item-link .item-title-row {
2275 background-position: left center !important;
2276}
2277.list-group ul:after,
2278.list-group ul:before {
2279 z-index: 25 !important;
2280}
2281.list-group + .list-group ul:before {
2282 display: none !important;
2283}
2284li.item-divider,
2285.item-divider,
2286li.list-group-title {
2287 white-space: nowrap;
2288 position: relative;
2289 max-width: 100%;
2290 text-overflow: ellipsis;
2291 overflow: hidden;
2292 z-index: 15;
2293}
2294li.list-group-title,
2295.list li.list-group-title {
2296 position: relative;
2297 position: -webkit-sticky;
2298 position: sticky;
2299 top: 0;
2300 margin-top: 0;
2301 z-index: 20;
2302}
2303li.list-group-title:before,
2304.list li.list-group-title:before {
2305 display: none !important;
2306}
2307.list.inset .block-title {
2308 margin-left: 0;
2309 margin-right: 0;
2310}
2311.list.inset ul:before {
2312 display: none !important;
2313}
2314.list.inset ul:after {
2315 display: none !important;
2316}
2317@media (min-width: 768px) {
2318 .list.tablet-inset .block-title {
2319 margin-left: 0;
2320 margin-right: 0;
2321 }
2322 .list.tablet-inset ul:before {
2323 display: none !important;
2324 }
2325 .list.tablet-inset ul:after {
2326 display: none !important;
2327 }
2328}
2329.theme-dark .list .item-link .item-inner,
2330.list.theme-dark .item-link .item-inner,
2331.theme-dark .links-list a,
2332.links-list.theme-dark a,
2333.theme-dark .media-list .item-link .item-title-row,
2334.media-list.theme-dark .item-link .item-title-row,
2335.theme-dark li.media-item .item-link .item-title-row {
2336 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(6.500000%2C%206.500000)%20rotate(-225.000000)%20translate(-6.500000%2C%20-6.500000)%20'%20points%3D'11%2011%2011%202%209%202%209%209%202%209%202%2011%2010%2011'%3E%3C%2Fpolygon%3E%3C%2Fsvg%3E");
2337}
2338.theme-dark .media-list .item-link .item-inner,
2339.media-list.theme-dark .item-link .item-inner,
2340.theme-dark li.media-item .item-link .item-inner {
2341 background-image: none;
2342}
2343.md .list {
2344 margin: 32px 0;
2345 font-size: 16px;
2346}
2347.md .list .item-cell {
2348 width: 100%;
2349 min-width: 0;
2350 margin-right: 16px;
2351}
2352.md .list .item-cell:first-child {
2353 margin-right: 0;
2354}
2355.md .list ul ul {
2356 padding-right: 56px;
2357}
2358.md .list .item-media {
2359 padding-top: 8px;
2360 min-width: 40px;
2361}
2362.md .list .item-media i + i,
2363.md .list .item-media i + img {
2364 margin-right: 8px;
2365}
2366.md .list .item-media + .item-inner {
2367 margin-right: 16px;
2368}
2369.md .list .item-inner {
2370 min-height: 48px;
2371 padding-left: 16px;
2372}
2373.md .list .item-after {
2374 color: #757575;
2375 font-size: 14px;
2376 padding-right: 8px;
2377}
2378.md .list .item-link,
2379.md .list .list-button {
2380 color: inherit;
2381}
2382.md .list .item-link .item-inner,
2383.md .list .list-button .item-inner {
2384 padding-left: 42px;
2385}
2386.md .list .item-link.active-state,
2387.md .list .list-button.active-state {
2388 background-color: rgba(0, 0, 0, 0.1);
2389}
2390.md .list .list-button {
2391 padding: 0 16px;
2392 font-size: 16px;
2393 line-height: 48px;
2394}
2395.md .list .item-content {
2396 min-height: 48px;
2397 padding-right: 16px;
2398}
2399.md .list .item-subtitle {
2400 font-size: 14px;
2401}
2402.md .list .item-text {
2403 font-size: 14px;
2404 color: #757575;
2405 line-height: 20px;
2406 max-height: 40px;
2407}
2408.md .list .item-header,
2409.md .list .item-footer {
2410 font-weight: normal;
2411 font-size: 12px;
2412 line-height: 1.2;
2413 white-space: normal;
2414}
2415.md .list .item-footer {
2416 color: rgba(0, 0, 0, 0.5);
2417}
2418.md .list .item-link.no-chevron .item-inner,
2419.md .list.no-chevron .item-link .item-inner,
2420.md .list .no-chevron .item-link .item-inner,
2421.md .no-chevron .list .item-link .item-inner {
2422 padding-left: 16px;
2423}
2424.md .simple-list li:after {
2425 content: '';
2426 position: absolute;
2427 background-color: rgba(0, 0, 0, 0.12);
2428 display: block;
2429 z-index: 15;
2430 top: auto;
2431 right: auto;
2432 bottom: 0;
2433 left: 0;
2434 height: 1px;
2435 width: 100%;
2436 -webkit-transform-origin: 50% 100%;
2437 transform-origin: 50% 100%;
2438}
2439.md.device-pixel-ratio-2 .simple-list li:after {
2440 -webkit-transform: scaleY(0.5);
2441 transform: scaleY(0.5);
2442}
2443.md.device-pixel-ratio-3 .simple-list li:after {
2444 -webkit-transform: scaleY(0.33);
2445 transform: scaleY(0.33);
2446}
2447.md .simple-list li {
2448 padding-left: 16px;
2449 padding-right: 16px;
2450 line-height: 48px;
2451 height: 48px;
2452}
2453.md .simple-list li:after {
2454 width: auto;
2455 left: 0;
2456 right: 16px;
2457}
2458.md .links-list a:after {
2459 content: '';
2460 position: absolute;
2461 background-color: rgba(0, 0, 0, 0.12);
2462 display: block;
2463 z-index: 15;
2464 top: auto;
2465 right: auto;
2466 bottom: 0;
2467 left: 0;
2468 height: 1px;
2469 width: 100%;
2470 -webkit-transform-origin: 50% 100%;
2471 transform-origin: 50% 100%;
2472}
2473.md.device-pixel-ratio-2 .links-list a:after {
2474 -webkit-transform: scaleY(0.5);
2475 transform: scaleY(0.5);
2476}
2477.md.device-pixel-ratio-3 .links-list a:after {
2478 -webkit-transform: scaleY(0.33);
2479 transform: scaleY(0.33);
2480}
2481.md .links-list a {
2482 height: 48px;
2483 color: inherit;
2484}
2485.md .links-list a.active-state {
2486 background-color: rgba(0, 0, 0, 0.1);
2487}
2488.md .links-list a:after {
2489 width: auto;
2490}
2491.md .links-list a {
2492 padding-right: 16px;
2493 padding-left: 42px;
2494}
2495.md .links-list a:after {
2496 right: 16px;
2497 left: 0;
2498}
2499.md .links-list.no-chevron a,
2500.md .no-chevron .links-list a,
2501.md .links-list a.no-chevron,
2502.md .links-list .no-chevron a {
2503 padding-left: 16px;
2504}
2505.md .media-list .item-inner,
2506.md li.media-item .item-inner {
2507 padding-top: 14px;
2508 padding-bottom: 14px;
2509}
2510.md .media-list .item-link .item-inner,
2511.md li.media-item .item-link .item-inner {
2512 padding-left: 16px;
2513}
2514.md .media-list .item-link .item-title-row,
2515.md li.media-item .item-link .item-title-row {
2516 padding-left: 26px;
2517}
2518.md .media-list .item-media,
2519.md li.media-item .item-media {
2520 padding-top: 14px;
2521 padding-bottom: 14px;
2522}
2523.md .media-list.chevron-center .item-link .item-inner,
2524.md .media-list .chevron-center .item-link .item-inner,
2525.md .media-list .item-link.chevron-center .item-inner,
2526.md li.media-item.chevron-center .item-link .item-inner,
2527.md li.media-item .item-link.chevron-center .item-inner,
2528.md li.media-item .chevron-center .item-link .item-inner {
2529 padding-left: 42px;
2530}
2531.md .media-list.no-chevron .item-link .item-title-row,
2532.md .no-chevron .media-list .item-link .item-title-row,
2533.md .media-list .no-chevron .item-link .item-title-row,
2534.md li.media-item.no-chevron .item-link .item-title-row,
2535.md .no-chevron li.media-item .item-link .item-title-row,
2536.md .media-list.chevron-center .item-title-row,
2537.md .media-list .chevron-center .item-title-row,
2538.md li.media-item.chevron-center .item-title-row,
2539.md li.media-item .chevron-center .item-title-row {
2540 padding-left: 0 !important;
2541}
2542.md .list .item-link .item-inner,
2543.md .links-list a {
2544 background-position: 16px center;
2545}
2546.md .item-divider,
2547.md .list-group-title {
2548 padding: 0 16px;
2549 background: #f4f4f4;
2550 color: rgba(0, 0, 0, 0.54);
2551 height: 48px;
2552 line-height: 48px;
2553 -webkit-box-sizing: border-box;
2554 box-sizing: border-box;
2555 font-size: 14px;
2556}
2557.md .item-divider:before,
2558.md .list-group-title:before {
2559 display: none !important;
2560}
2561.md .item-divider:after,
2562.md .list-group-title:after {
2563 display: none !important;
2564}
2565.md .list-group-title {
2566 margin-top: 0;
2567}
2568.md .list .item-inner:after {
2569 content: '';
2570 position: absolute;
2571 background-color: rgba(0, 0, 0, 0.12);
2572 display: block;
2573 z-index: 15;
2574 top: auto;
2575 right: auto;
2576 bottom: 0;
2577 left: 0;
2578 height: 1px;
2579 width: 100%;
2580 -webkit-transform-origin: 50% 100%;
2581 transform-origin: 50% 100%;
2582}
2583.md.device-pixel-ratio-2 .list .item-inner:after {
2584 -webkit-transform: scaleY(0.5);
2585 transform: scaleY(0.5);
2586}
2587.md.device-pixel-ratio-3 .list .item-inner:after {
2588 -webkit-transform: scaleY(0.33);
2589 transform: scaleY(0.33);
2590}
2591.md .list ul:before {
2592 content: '';
2593 position: absolute;
2594 background-color: rgba(0, 0, 0, 0.12);
2595 display: block;
2596 z-index: 15;
2597 top: 0;
2598 right: auto;
2599 bottom: auto;
2600 left: 0;
2601 height: 1px;
2602 width: 100%;
2603 -webkit-transform-origin: 50% 0%;
2604 transform-origin: 50% 0%;
2605}
2606.md.device-pixel-ratio-2 .list ul:before {
2607 -webkit-transform: scaleY(0.5);
2608 transform: scaleY(0.5);
2609}
2610.md.device-pixel-ratio-3 .list ul:before {
2611 -webkit-transform: scaleY(0.33);
2612 transform: scaleY(0.33);
2613}
2614.md .list ul:after {
2615 content: '';
2616 position: absolute;
2617 background-color: rgba(0, 0, 0, 0.12);
2618 display: block;
2619 z-index: 15;
2620 top: auto;
2621 right: auto;
2622 bottom: 0;
2623 left: 0;
2624 height: 1px;
2625 width: 100%;
2626 -webkit-transform-origin: 50% 100%;
2627 transform-origin: 50% 100%;
2628}
2629.md.device-pixel-ratio-2 .list ul:after {
2630 -webkit-transform: scaleY(0.5);
2631 transform: scaleY(0.5);
2632}
2633.md.device-pixel-ratio-3 .list ul:after {
2634 -webkit-transform: scaleY(0.33);
2635 transform: scaleY(0.33);
2636}
2637.md .list.inset {
2638 margin-left: 16px;
2639 margin-right: 16px;
2640 border-radius: 4px;
2641}
2642.md .list.inset ul {
2643 border-radius: 4px;
2644}
2645.md .list.inset li:first-child > a {
2646 border-radius: 4px 4px 0 0;
2647}
2648.md .list.inset li:last-child > a {
2649 border-radius: 0 0 4px 4px;
2650}
2651.md .list.inset li:first-child:last-child > a {
2652 border-radius: 4px;
2653}
2654@media (min-width: 768px) {
2655 .md .list.tablet-inset {
2656 margin-left: 16px;
2657 margin-right: 16px;
2658 border-radius: 4px;
2659 }
2660 .md .list.tablet-inset li:first-child > a {
2661 border-radius: 4px 4px 0 0;
2662 }
2663 .md .list.tablet-inset li:last-child > a {
2664 border-radius: 0 0 4px 4px;
2665 }
2666 .md .list.tablet-inset li:first-child:last-child > a {
2667 border-radius: 4px;
2668 }
2669}
2670.md li li:last-child .item-inner:after,
2671.md li:last-child li .item-inner:after {
2672 content: '';
2673 position: absolute;
2674 background-color: rgba(0, 0, 0, 0.12);
2675 display: block;
2676 z-index: 15;
2677 top: auto;
2678 right: auto;
2679 bottom: 0;
2680 left: 0;
2681 height: 1px;
2682 width: 100%;
2683 -webkit-transform-origin: 50% 100%;
2684 transform-origin: 50% 100%;
2685}
2686html.device-pixel-ratio-2 .md li li:last-child .item-inner:after,
2687html.device-pixel-ratio-2 .md li:last-child li .item-inner:after {
2688 -webkit-transform: scaleY(0.5);
2689 transform: scaleY(0.5);
2690}
2691html.device-pixel-ratio-3 .md li li:last-child .item-inner:after,
2692html.device-pixel-ratio-3 .md li:last-child li .item-inner:after {
2693 -webkit-transform: scaleY(0.33);
2694 transform: scaleY(0.33);
2695}
2696@media (orientation: landscape) {
2697 .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,
2698 .md.device-iphone-x .ios-edges .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge).simple-list li,
2699 .md.device-iphone-x .popup .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge).simple-list li,
2700 .md.device-iphone-x .sheet-modal .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge).simple-list li,
2701 .md.device-iphone-x .panel-left .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge).simple-list li {
2702 padding-left: calc(16px + constant(safe-area-inset-left));
2703 padding-left: calc(16px + env(safe-area-inset-left));
2704 }
2705 .md.device-iphone-x .ios-left-edge .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge) .item-divider,
2706 .md.device-iphone-x .ios-edges .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge) .item-divider,
2707 .md.device-iphone-x .popup .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge) .item-divider,
2708 .md.device-iphone-x .sheet-modal .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge) .item-divider,
2709 .md.device-iphone-x .panel-left .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge) .item-divider,
2710 .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,
2711 .md.device-iphone-x .ios-edges .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge) .list-group-title,
2712 .md.device-iphone-x .popup .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge) .list-group-title,
2713 .md.device-iphone-x .sheet-modal .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge) .list-group-title,
2714 .md.device-iphone-x .panel-left .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge) .list-group-title {
2715 padding-left: calc(16px + constant(safe-area-inset-left));
2716 padding-left: calc(16px + env(safe-area-inset-left));
2717 }
2718 .md.device-iphone-x .ios-left-edge .list.inset:not(.no-ios-edges):not(.no-ios-left-edge),
2719 .md.device-iphone-x .ios-edges .list.inset:not(.no-ios-edges):not(.no-ios-left-edge),
2720 .md.device-iphone-x .popup .list.inset:not(.no-ios-edges):not(.no-ios-left-edge),
2721 .md.device-iphone-x .sheet-modal .list.inset:not(.no-ios-edges):not(.no-ios-left-edge),
2722 .md.device-iphone-x .panel-left .list.inset:not(.no-ios-edges):not(.no-ios-left-edge) {
2723 margin-left: calc(16px + constant(safe-area-inset-left));
2724 margin-left: calc(16px + env(safe-area-inset-left));
2725 }
2726 .md.device-iphone-x .ios-left-edge .list.inset:not(.no-ios-edges):not(.no-ios-left-edge) .block-header,
2727 .md.device-iphone-x .ios-edges .list.inset:not(.no-ios-edges):not(.no-ios-left-edge) .block-header,
2728 .md.device-iphone-x .popup .list.inset:not(.no-ios-edges):not(.no-ios-left-edge) .block-header,
2729 .md.device-iphone-x .sheet-modal .list.inset:not(.no-ios-edges):not(.no-ios-left-edge) .block-header,
2730 .md.device-iphone-x .panel-left .list.inset:not(.no-ios-edges):not(.no-ios-left-edge) .block-header,
2731 .md.device-iphone-x .ios-left-edge .list.inset:not(.no-ios-edges):not(.no-ios-left-edge) .block-footer,
2732 .md.device-iphone-x .ios-edges .list.inset:not(.no-ios-edges):not(.no-ios-left-edge) .block-footer,
2733 .md.device-iphone-x .popup .list.inset:not(.no-ios-edges):not(.no-ios-left-edge) .block-footer,
2734 .md.device-iphone-x .sheet-modal .list.inset:not(.no-ios-edges):not(.no-ios-left-edge) .block-footer,
2735 .md.device-iphone-x .panel-left .list.inset:not(.no-ios-edges):not(.no-ios-left-edge) .block-footer {
2736 padding-left: 15px;
2737 }
2738 .md.device-iphone-x .ios-left-edge .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge) .item-link .item-inner,
2739 .md.device-iphone-x .ios-edges .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge) .item-link .item-inner,
2740 .md.device-iphone-x .popup .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge) .item-link .item-inner,
2741 .md.device-iphone-x .sheet-modal .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge) .item-link .item-inner,
2742 .md.device-iphone-x .panel-left .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge) .item-link .item-inner,
2743 .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,
2744 .md.device-iphone-x .ios-edges .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge).links-list a,
2745 .md.device-iphone-x .popup .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge).links-list a,
2746 .md.device-iphone-x .sheet-modal .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge).links-list a,
2747 .md.device-iphone-x .panel-left .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge).links-list a {
2748 background-position: calc(16px + constant(safe-area-inset-left)) center;
2749 background-position: calc(16px + env(safe-area-inset-left)) center;
2750 }
2751 .md.device-iphone-x .ios-left-edge .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge) .item-inner,
2752 .md.device-iphone-x .ios-edges .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge) .item-inner,
2753 .md.device-iphone-x .popup .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge) .item-inner,
2754 .md.device-iphone-x .sheet-modal .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge) .item-inner,
2755 .md.device-iphone-x .panel-left .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge) .item-inner {
2756 padding-left: calc(16px + constant(safe-area-inset-left));
2757 padding-left: calc(16px + env(safe-area-inset-left));
2758 }
2759 .md.device-iphone-x .ios-left-edge .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge) .item-link .item-inner,
2760 .md.device-iphone-x .ios-edges .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge) .item-link .item-inner,
2761 .md.device-iphone-x .popup .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge) .item-link .item-inner,
2762 .md.device-iphone-x .sheet-modal .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge) .item-link .item-inner,
2763 .md.device-iphone-x .panel-left .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge) .item-link .item-inner {
2764 padding-left: calc(42px + constant(safe-area-inset-left));
2765 padding-left: calc(42px + env(safe-area-inset-left));
2766 }
2767 .md.device-iphone-x .ios-left-edge .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge).media-list .item-link .item-inner,
2768 .md.device-iphone-x .ios-edges .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge).media-list .item-link .item-inner,
2769 .md.device-iphone-x .popup .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge).media-list .item-link .item-inner,
2770 .md.device-iphone-x .sheet-modal .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge).media-list .item-link .item-inner,
2771 .md.device-iphone-x .panel-left .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge).media-list .item-link .item-inner,
2772 .md.device-iphone-x .ios-left-edge .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge) li.media-item .item-link .item-inner,
2773 .md.device-iphone-x .ios-edges .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge) li.media-item .item-link .item-inner,
2774 .md.device-iphone-x .popup .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge) li.media-item .item-link .item-inner,
2775 .md.device-iphone-x .sheet-modal .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge) li.media-item .item-link .item-inner,
2776 .md.device-iphone-x .panel-left .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge) li.media-item .item-link .item-inner {
2777 padding-left: calc(16px + constant(safe-area-inset-left));
2778 padding-left: calc(16px + env(safe-area-inset-left));
2779 }
2780 .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,
2781 .md.device-iphone-x .ios-edges .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge).links-list a,
2782 .md.device-iphone-x .popup .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge).links-list a,
2783 .md.device-iphone-x .sheet-modal .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge).links-list a,
2784 .md.device-iphone-x .panel-left .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge).links-list a {
2785 padding-left: calc(42px + constant(safe-area-inset-left));
2786 padding-left: calc(42px + env(safe-area-inset-left));
2787 }
2788 .md.device-iphone-x .ios-left-edge .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge).media-list.chevron-center .item-link .item-inner,
2789 .md.device-iphone-x .ios-edges .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge).media-list.chevron-center .item-link .item-inner,
2790 .md.device-iphone-x .popup .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge).media-list.chevron-center .item-link .item-inner,
2791 .md.device-iphone-x .sheet-modal .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge).media-list.chevron-center .item-link .item-inner,
2792 .md.device-iphone-x .panel-left .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge).media-list.chevron-center .item-link .item-inner,
2793 .md.device-iphone-x .ios-left-edge .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge).media-list .chevron-center .item-link .item-inner,
2794 .md.device-iphone-x .ios-edges .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge).media-list .chevron-center .item-link .item-inner,
2795 .md.device-iphone-x .popup .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge).media-list .chevron-center .item-link .item-inner,
2796 .md.device-iphone-x .sheet-modal .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge).media-list .chevron-center .item-link .item-inner,
2797 .md.device-iphone-x .panel-left .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge).media-list .chevron-center .item-link .item-inner,
2798 .md.device-iphone-x .ios-left-edge .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge).media-list .item-link.chevron-center .item-inner,
2799 .md.device-iphone-x .ios-edges .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge).media-list .item-link.chevron-center .item-inner,
2800 .md.device-iphone-x .popup .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge).media-list .item-link.chevron-center .item-inner,
2801 .md.device-iphone-x .sheet-modal .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge).media-list .item-link.chevron-center .item-inner,
2802 .md.device-iphone-x .panel-left .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge).media-list .item-link.chevron-center .item-inner,
2803 .md.device-iphone-x .ios-left-edge .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge) li.media-item.chevron-center .item-link .item-inner,
2804 .md.device-iphone-x .ios-edges .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge) li.media-item.chevron-center .item-link .item-inner,
2805 .md.device-iphone-x .popup .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge) li.media-item.chevron-center .item-link .item-inner,
2806 .md.device-iphone-x .sheet-modal .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge) li.media-item.chevron-center .item-link .item-inner,
2807 .md.device-iphone-x .panel-left .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge) li.media-item.chevron-center .item-link .item-inner,
2808 .md.device-iphone-x .ios-left-edge .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge) li.media-item .item-link.chevron-center .item-inner,
2809 .md.device-iphone-x .ios-edges .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge) li.media-item .item-link.chevron-center .item-inner,
2810 .md.device-iphone-x .popup .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge) li.media-item .item-link.chevron-center .item-inner,
2811 .md.device-iphone-x .sheet-modal .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge) li.media-item .item-link.chevron-center .item-inner,
2812 .md.device-iphone-x .panel-left .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge) li.media-item .item-link.chevron-center .item-inner,
2813 .md.device-iphone-x .ios-left-edge .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge) li.media-item .chevron-center .item-link .item-inner,
2814 .md.device-iphone-x .ios-edges .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge) li.media-item .chevron-center .item-link .item-inner,
2815 .md.device-iphone-x .popup .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge) li.media-item .chevron-center .item-link .item-inner,
2816 .md.device-iphone-x .sheet-modal .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge) li.media-item .chevron-center .item-link .item-inner,
2817 .md.device-iphone-x .panel-left .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge) li.media-item .chevron-center .item-link .item-inner {
2818 padding-left: calc(42px + constant(safe-area-inset-left));
2819 padding-left: calc(42px + env(safe-area-inset-left));
2820 }
2821 .md.device-iphone-x .ios-left-edge .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge) .item-link.no-chevron .item-inner,
2822 .md.device-iphone-x .ios-edges .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge) .item-link.no-chevron .item-inner,
2823 .md.device-iphone-x .popup .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge) .item-link.no-chevron .item-inner,
2824 .md.device-iphone-x .sheet-modal .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge) .item-link.no-chevron .item-inner,
2825 .md.device-iphone-x .panel-left .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge) .item-link.no-chevron .item-inner,
2826 .md.device-iphone-x .ios-left-edge .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge).no-chevron .item-link .item-inner,
2827 .md.device-iphone-x .ios-edges .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge).no-chevron .item-link .item-inner,
2828 .md.device-iphone-x .popup .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge).no-chevron .item-link .item-inner,
2829 .md.device-iphone-x .sheet-modal .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge).no-chevron .item-link .item-inner,
2830 .md.device-iphone-x .panel-left .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge).no-chevron .item-link .item-inner,
2831 .md.device-iphone-x .ios-left-edge .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge) .no-chevron .item-link .item-inner,
2832 .md.device-iphone-x .ios-edges .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge) .no-chevron .item-link .item-inner,
2833 .md.device-iphone-x .popup .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge) .no-chevron .item-link .item-inner,
2834 .md.device-iphone-x .sheet-modal .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge) .no-chevron .item-link .item-inner,
2835 .md.device-iphone-x .panel-left .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge) .no-chevron .item-link .item-inner,
2836 .md.device-iphone-x .ios-left-edge .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge).links-list.no-chevron a,
2837 .md.device-iphone-x .ios-edges .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge).links-list.no-chevron a,
2838 .md.device-iphone-x .popup .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge).links-list.no-chevron a,
2839 .md.device-iphone-x .sheet-modal .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge).links-list.no-chevron a,
2840 .md.device-iphone-x .panel-left .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge).links-list.no-chevron a,
2841 .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.no-chevron,
2842 .md.device-iphone-x .ios-edges .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge).links-list a.no-chevron,
2843 .md.device-iphone-x .popup .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge).links-list a.no-chevron,
2844 .md.device-iphone-x .sheet-modal .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge).links-list a.no-chevron,
2845 .md.device-iphone-x .panel-left .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge).links-list a.no-chevron,
2846 .md.device-iphone-x .ios-left-edge .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge).links-list .no-chevron a,
2847 .md.device-iphone-x .ios-edges .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge).links-list .no-chevron a,
2848 .md.device-iphone-x .popup .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge).links-list .no-chevron a,
2849 .md.device-iphone-x .sheet-modal .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge).links-list .no-chevron a,
2850 .md.device-iphone-x .panel-left .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge).links-list .no-chevron a {
2851 padding-left: calc(16px + constant(safe-area-inset-left));
2852 padding-left: calc(16px + env(safe-area-inset-left));
2853 }
2854 .md.device-iphone-x .ios-left-edge .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge).media-list.no-chevron .item-link .item-title-row,
2855 .md.device-iphone-x .ios-edges .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge).media-list.no-chevron .item-link .item-title-row,
2856 .md.device-iphone-x .popup .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge).media-list.no-chevron .item-link .item-title-row,
2857 .md.device-iphone-x .sheet-modal .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge).media-list.no-chevron .item-link .item-title-row,
2858 .md.device-iphone-x .panel-left .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge).media-list.no-chevron .item-link .item-title-row,
2859 .md.device-iphone-x .ios-left-edge .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge).media-list .no-chevron .item-link .item-title-row,
2860 .md.device-iphone-x .ios-edges .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge).media-list .no-chevron .item-link .item-title-row,
2861 .md.device-iphone-x .popup .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge).media-list .no-chevron .item-link .item-title-row,
2862 .md.device-iphone-x .sheet-modal .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge).media-list .no-chevron .item-link .item-title-row,
2863 .md.device-iphone-x .panel-left .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge).media-list .no-chevron .item-link .item-title-row,
2864 .md.device-iphone-x .ios-left-edge .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge) li.media-item.no-chevron .item-link .item-title-row,
2865 .md.device-iphone-x .ios-edges .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge) li.media-item.no-chevron .item-link .item-title-row,
2866 .md.device-iphone-x .popup .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge) li.media-item.no-chevron .item-link .item-title-row,
2867 .md.device-iphone-x .sheet-modal .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge) li.media-item.no-chevron .item-link .item-title-row,
2868 .md.device-iphone-x .panel-left .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge) li.media-item.no-chevron .item-link .item-title-row,
2869 .md.device-iphone-x .ios-left-edge .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge).no-chevron li.media-item .item-link .item-title-row,
2870 .md.device-iphone-x .ios-edges .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge).no-chevron li.media-item .item-link .item-title-row,
2871 .md.device-iphone-x .popup .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge).no-chevron li.media-item .item-link .item-title-row,
2872 .md.device-iphone-x .sheet-modal .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge).no-chevron li.media-item .item-link .item-title-row,
2873 .md.device-iphone-x .panel-left .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge).no-chevron li.media-item .item-link .item-title-row {
2874 padding-left: 0;
2875 }
2876 .md.device-iphone-x .ios-right-edge .list.inset:not(.no-ios-edges):not(.no-ios-right-edge),
2877 .md.device-iphone-x .ios-edges .list.inset:not(.no-ios-edges):not(.no-ios-right-edge),
2878 .md.device-iphone-x .popup .list.inset:not(.no-ios-edges):not(.no-ios-right-edge),
2879 .md.device-iphone-x .sheet-modal .list.inset:not(.no-ios-edges):not(.no-ios-right-edge),
2880 .md.device-iphone-x .panel-right .list.inset:not(.no-ios-edges):not(.no-ios-right-edge) {
2881 margin-right: calc(16px + constant(safe-area-inset-right));
2882 margin-right: calc(16px + env(safe-area-inset-right));
2883 }
2884 .md.device-iphone-x .ios-right-edge .list.inset:not(.no-ios-edges):not(.no-ios-right-edge) .block-header,
2885 .md.device-iphone-x .ios-edges .list.inset:not(.no-ios-edges):not(.no-ios-right-edge) .block-header,
2886 .md.device-iphone-x .popup .list.inset:not(.no-ios-edges):not(.no-ios-right-edge) .block-header,
2887 .md.device-iphone-x .sheet-modal .list.inset:not(.no-ios-edges):not(.no-ios-right-edge) .block-header,
2888 .md.device-iphone-x .panel-right .list.inset:not(.no-ios-edges):not(.no-ios-right-edge) .block-header,
2889 .md.device-iphone-x .ios-right-edge .list.inset:not(.no-ios-edges):not(.no-ios-right-edge) .block-footer,
2890 .md.device-iphone-x .ios-edges .list.inset:not(.no-ios-edges):not(.no-ios-right-edge) .block-footer,
2891 .md.device-iphone-x .popup .list.inset:not(.no-ios-edges):not(.no-ios-right-edge) .block-footer,
2892 .md.device-iphone-x .sheet-modal .list.inset:not(.no-ios-edges):not(.no-ios-right-edge) .block-footer,
2893 .md.device-iphone-x .panel-right .list.inset:not(.no-ios-edges):not(.no-ios-right-edge) .block-footer {
2894 padding-right: 16px;
2895 }
2896 .md.device-iphone-x .ios-right-edge .list.tablet-inset:not(.no-ios-edges):not(.no-ios-right-edge) .block-header,
2897 .md.device-iphone-x .ios-edges .list.tablet-inset:not(.no-ios-edges):not(.no-ios-right-edge) .block-header,
2898 .md.device-iphone-x .popup .list.tablet-inset:not(.no-ios-edges):not(.no-ios-right-edge) .block-header,
2899 .md.device-iphone-x .sheet-modal .list.tablet-inset:not(.no-ios-edges):not(.no-ios-right-edge) .block-header,
2900 .md.device-iphone-x .panel-right .list.tablet-inset:not(.no-ios-edges):not(.no-ios-right-edge) .block-header,
2901 .md.device-iphone-x .ios-right-edge .list.tablet-inset:not(.no-ios-edges):not(.no-ios-right-edge) .block-footer,
2902 .md.device-iphone-x .ios-edges .list.tablet-inset:not(.no-ios-edges):not(.no-ios-right-edge) .block-footer,
2903 .md.device-iphone-x .popup .list.tablet-inset:not(.no-ios-edges):not(.no-ios-right-edge) .block-footer,
2904 .md.device-iphone-x .sheet-modal .list.tablet-inset:not(.no-ios-edges):not(.no-ios-right-edge) .block-footer,
2905 .md.device-iphone-x .panel-right .list.tablet-inset:not(.no-ios-edges):not(.no-ios-right-edge) .block-footer {
2906 padding-right: 16px;
2907 }
2908 .md.device-iphone-x .ios-right-edge .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) .item-divider,
2909 .md.device-iphone-x .ios-edges .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) .item-divider,
2910 .md.device-iphone-x .popup .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) .item-divider,
2911 .md.device-iphone-x .sheet-modal .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) .item-divider,
2912 .md.device-iphone-x .panel-right .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) .item-divider,
2913 .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,
2914 .md.device-iphone-x .ios-edges .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) .list-group-title,
2915 .md.device-iphone-x .popup .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) .list-group-title,
2916 .md.device-iphone-x .sheet-modal .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) .list-group-title,
2917 .md.device-iphone-x .panel-right .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) .list-group-title {
2918 padding-right: calc(16px + constant(safe-area-inset-right));
2919 padding-right: calc(16px + env(safe-area-inset-right));
2920 }
2921 .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,
2922 .md.device-iphone-x .ios-edges .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).simple-list li,
2923 .md.device-iphone-x .popup .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).simple-list li,
2924 .md.device-iphone-x .sheet-modal .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).simple-list li,
2925 .md.device-iphone-x .panel-right .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).simple-list li {
2926 padding-right: calc(16px + constant(safe-area-inset-right));
2927 padding-right: calc(16px + env(safe-area-inset-right));
2928 }
2929 .md.device-iphone-x .ios-right-edge .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) .item-content,
2930 .md.device-iphone-x .ios-edges .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) .item-content,
2931 .md.device-iphone-x .popup .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) .item-content,
2932 .md.device-iphone-x .sheet-modal .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) .item-content,
2933 .md.device-iphone-x .panel-right .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) .item-content {
2934 padding-right: calc(16px + constant(safe-area-inset-right));
2935 padding-right: calc(16px + env(safe-area-inset-right));
2936 }
2937 .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:after,
2938 .md.device-iphone-x .ios-edges .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).simple-list li:after,
2939 .md.device-iphone-x .popup .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).simple-list li:after,
2940 .md.device-iphone-x .sheet-modal .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).simple-list li:after,
2941 .md.device-iphone-x .panel-right .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).simple-list li:after {
2942 right: calc(16px + constant(safe-area-inset-right));
2943 right: calc(16px + env(safe-area-inset-right));
2944 }
2945 .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,
2946 .md.device-iphone-x .ios-edges .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).links-list a,
2947 .md.device-iphone-x .popup .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).links-list a,
2948 .md.device-iphone-x .sheet-modal .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).links-list a,
2949 .md.device-iphone-x .panel-right .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).links-list a {
2950 padding-right: calc(16px + constant(safe-area-inset-right));
2951 padding-right: calc(16px + env(safe-area-inset-right));
2952 }
2953 .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:after,
2954 .md.device-iphone-x .ios-edges .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).links-list a:after,
2955 .md.device-iphone-x .popup .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).links-list a:after,
2956 .md.device-iphone-x .sheet-modal .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).links-list a:after,
2957 .md.device-iphone-x .panel-right .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).links-list a:after {
2958 right: calc(16px + const(safe-area-inset-right));
2959 right: calc(16px + env(safe-area-inset-right));
2960 }
2961}
2962@media (orientation: landscape) and (min-width: 768px) {
2963 .md.device-iphone-x .ios-left-edge .list.tablet-inset:not(.no-ios-edges):not(.no-ios-left-edge),
2964 .md.device-iphone-x .ios-edges .list.tablet-inset:not(.no-ios-edges):not(.no-ios-left-edge),
2965 .md.device-iphone-x .popup .list.tablet-inset:not(.no-ios-edges):not(.no-ios-left-edge),
2966 .md.device-iphone-x .sheet-modal .list.tablet-inset:not(.no-ios-edges):not(.no-ios-left-edge),
2967 .md.device-iphone-x .panel-left .list.tablet-inset:not(.no-ios-edges):not(.no-ios-left-edge) {
2968 margin-left: calc(16px + constant(safe-area-inset-left));
2969 margin-left: calc(16px + env(safe-area-inset-left));
2970 }
2971 .md.device-iphone-x .ios-left-edge .list.tablet-inset:not(.no-ios-edges):not(.no-ios-left-edge) .block-header,
2972 .md.device-iphone-x .ios-edges .list.tablet-inset:not(.no-ios-edges):not(.no-ios-left-edge) .block-header,
2973 .md.device-iphone-x .popup .list.tablet-inset:not(.no-ios-edges):not(.no-ios-left-edge) .block-header,
2974 .md.device-iphone-x .sheet-modal .list.tablet-inset:not(.no-ios-edges):not(.no-ios-left-edge) .block-header,
2975 .md.device-iphone-x .panel-left .list.tablet-inset:not(.no-ios-edges):not(.no-ios-left-edge) .block-header,
2976 .md.device-iphone-x .ios-left-edge .list.tablet-inset:not(.no-ios-edges):not(.no-ios-left-edge) .block-footer,
2977 .md.device-iphone-x .ios-edges .list.tablet-inset:not(.no-ios-edges):not(.no-ios-left-edge) .block-footer,
2978 .md.device-iphone-x .popup .list.tablet-inset:not(.no-ios-edges):not(.no-ios-left-edge) .block-footer,
2979 .md.device-iphone-x .sheet-modal .list.tablet-inset:not(.no-ios-edges):not(.no-ios-left-edge) .block-footer,
2980 .md.device-iphone-x .panel-left .list.tablet-inset:not(.no-ios-edges):not(.no-ios-left-edge) .block-footer {
2981 padding-left: 15px;
2982 }
2983}
2984@media (orientation: landscape) and (min-width: 768px) {
2985 .md.device-iphone-x .ios-right-edge .list.tablet-inset:not(.no-ios-edges):not(.no-ios-right-edge),
2986 .md.device-iphone-x .ios-edges .list.tablet-inset:not(.no-ios-edges):not(.no-ios-right-edge),
2987 .md.device-iphone-x .popup .list.tablet-inset:not(.no-ios-edges):not(.no-ios-right-edge),
2988 .md.device-iphone-x .sheet-modal .list.tablet-inset:not(.no-ios-edges):not(.no-ios-right-edge),
2989 .md.device-iphone-x .panel-right .list.tablet-inset:not(.no-ios-edges):not(.no-ios-right-edge) {
2990 margin-right: calc(16px + constant(safe-area-inset-right));
2991 margin-right: calc(16px + env(safe-area-inset-right));
2992 }
2993}
2994.md .theme-dark .list ul:before,
2995.list.md .theme-dark ul:before {
2996 background-color: rgba(255, 255, 255, 0.08);
2997}
2998.md .theme-dark .list ul:after,
2999.list.md .theme-dark ul:after {
3000 background-color: rgba(255, 255, 255, 0.08);
3001}
3002.md .theme-dark .list li li:last-child .item-inner:after,
3003.list.md .theme-dark li li:last-child .item-inner:after,
3004.md .theme-dark .list li:last-child li .item-inner:after,
3005.list.md .theme-dark li:last-child li .item-inner:after {
3006 background-color: rgba(255, 255, 255, 0.08);
3007}
3008.md .theme-dark .item-divider:before {
3009 background-color: rgba(255, 255, 255, 0.08);
3010}
3011.md .theme-dark .list-group-title:before {
3012 background-color: rgba(255, 255, 255, 0.08);
3013}
3014.md .theme-dark .list-button:after {
3015 background-color: rgba(255, 255, 255, 0.08);
3016}
3017.md .theme-dark .item-inner:after {
3018 background-color: rgba(255, 255, 255, 0.08);
3019}
3020.md .theme-dark .item-divider,
3021.md .theme-dark .list-group-title {
3022 background-color: #111;
3023 color: #fff;
3024}
3025.md .theme-dark .links-list a:after,
3026.md .theme-dark .simple-list li:after,
3027.md .theme-dark .links-list a:after,
3028.links-list.md .theme-dark a .simple-list li:after,
3029.simple-list.md .theme-dark li:after {
3030 background-color: rgba(255, 255, 255, 0.08);
3031}
3032.md .theme-dark .list .item-link.active-state,
3033.list.md .theme-dark .item-link.active-state,
3034.md .theme-dark .list .list-button.active-state,
3035.list.md .theme-dark .list-button.active-state,
3036.md .theme-dark .links-list a.active-state,
3037.links-list.md .theme-dark a.active-state {
3038 background-color: rgba(255, 255, 255, 0.05);
3039}
3040.md .theme-dark .item-after,
3041.md .theme-dark .item-text {
3042 color: rgba(255, 255, 255, 0.54);
3043}
3044.md .color-theme-red .list-button {
3045 color: #f44336;
3046}
3047.md .color-theme-green .list-button {
3048 color: #4caf50;
3049}
3050.md .color-theme-blue .list-button {
3051 color: #2196f3;
3052}
3053.md .color-theme-pink .list-button {
3054 color: #e91e63;
3055}
3056.md .color-theme-yellow .list-button {
3057 color: #ffeb3b;
3058}
3059.md .color-theme-orange .list-button {
3060 color: #ff9800;
3061}
3062.md .color-theme-gray .list-button {
3063 color: #9e9e9e;
3064}
3065.md .color-theme-white .list-button {
3066 color: #ffffff;
3067}
3068.md .color-theme-black .list-button {
3069 color: #000000;
3070}
3071.md .list .list-button.color-red,
3072.md .list li.color-red .list-button,
3073.md .links-list li.color-red a,
3074.md .simple-list li.color-red,
3075.md .links-list a.color-red,
3076.md .list .item-link.color-red,
3077.md .list li.color-red .item-link {
3078 color: #f44336;
3079}
3080.md .list .list-button.color-green,
3081.md .list li.color-green .list-button,
3082.md .links-list li.color-green a,
3083.md .simple-list li.color-green,
3084.md .links-list a.color-green,
3085.md .list .item-link.color-green,
3086.md .list li.color-green .item-link {
3087 color: #4caf50;
3088}
3089.md .list .list-button.color-blue,
3090.md .list li.color-blue .list-button,
3091.md .links-list li.color-blue a,
3092.md .simple-list li.color-blue,
3093.md .links-list a.color-blue,
3094.md .list .item-link.color-blue,
3095.md .list li.color-blue .item-link {
3096 color: #2196f3;
3097}
3098.md .list .list-button.color-pink,
3099.md .list li.color-pink .list-button,
3100.md .links-list li.color-pink a,
3101.md .simple-list li.color-pink,
3102.md .links-list a.color-pink,
3103.md .list .item-link.color-pink,
3104.md .list li.color-pink .item-link {
3105 color: #e91e63;
3106}
3107.md .list .list-button.color-yellow,
3108.md .list li.color-yellow .list-button,
3109.md .links-list li.color-yellow a,
3110.md .simple-list li.color-yellow,
3111.md .links-list a.color-yellow,
3112.md .list .item-link.color-yellow,
3113.md .list li.color-yellow .item-link {
3114 color: #ffeb3b;
3115}
3116.md .list .list-button.color-orange,
3117.md .list li.color-orange .list-button,
3118.md .links-list li.color-orange a,
3119.md .simple-list li.color-orange,
3120.md .links-list a.color-orange,
3121.md .list .item-link.color-orange,
3122.md .list li.color-orange .item-link {
3123 color: #ff9800;
3124}
3125.md .list .list-button.color-gray,
3126.md .list li.color-gray .list-button,
3127.md .links-list li.color-gray a,
3128.md .simple-list li.color-gray,
3129.md .links-list a.color-gray,
3130.md .list .item-link.color-gray,
3131.md .list li.color-gray .item-link {
3132 color: #9e9e9e;
3133}
3134.md .list .list-button.color-white,
3135.md .list li.color-white .list-button,
3136.md .links-list li.color-white a,
3137.md .simple-list li.color-white,
3138.md .links-list a.color-white,
3139.md .list .item-link.color-white,
3140.md .list li.color-white .item-link {
3141 color: #ffffff;
3142}
3143.md .list .list-button.color-black,
3144.md .list li.color-black .list-button,
3145.md .links-list li.color-black a,
3146.md .simple-list li.color-black,
3147.md .links-list a.color-black,
3148.md .list .item-link.color-black,
3149.md .list li.color-black .item-link {
3150 color: #000000;
3151}
3152/* === Badge === */
3153.badge {
3154 display: inline-block;
3155 color: #fff;
3156 background: #8e8e93;
3157 position: relative;
3158 -webkit-box-sizing: border-box;
3159 box-sizing: border-box;
3160 text-align: center;
3161}
3162.icon .badge,
3163.f7-icons .badge,
3164.framework7-icons .badge,
3165.material-icons .badge {
3166 position: absolute;
3167 left: 100%;
3168 margin-left: -10px;
3169 top: -2px;
3170}
3171.md .badge {
3172 font-size: 10px;
3173 border-radius: 3px;
3174 padding: 1px 6px;
3175 vertical-align: middle;
3176}
3177.md .icon .badge,
3178.md .f7-icons .badge,
3179.md .framework7-icons .badge,
3180.md .material-icons .badge {
3181 line-height: 1.4;
3182 padding: 1px 5px;
3183 font-family: Roboto, Noto, Helvetica, Arial, sans-serif;
3184 font-size: 10px;
3185}
3186.md .badge.color-red {
3187 background-color: #f44336;
3188}
3189.md .badge.color-green {
3190 background-color: #4caf50;
3191}
3192.md .badge.color-blue {
3193 background-color: #2196f3;
3194}
3195.md .badge.color-pink {
3196 background-color: #e91e63;
3197}
3198.md .badge.color-yellow {
3199 background-color: #ffeb3b;
3200}
3201.md .badge.color-orange {
3202 background-color: #ff9800;
3203}
3204.md .badge.color-gray {
3205 background-color: #9e9e9e;
3206}
3207.md .badge.color-white {
3208 background-color: #ffffff;
3209}
3210.md .badge.color-black {
3211 background-color: #000000;
3212}
3213button {
3214 -webkit-appearance: none;
3215 -moz-appearance: none;
3216 appearance: none;
3217}
3218.button {
3219 text-decoration: none;
3220 text-align: center;
3221 display: block;
3222 -webkit-appearance: none;
3223 -moz-appearance: none;
3224 appearance: none;
3225 background: none;
3226 padding: 0 10px;
3227 margin: 0;
3228 white-space: nowrap;
3229 text-overflow: ellipsis;
3230 font-size: 14px;
3231 position: relative;
3232 overflow: hidden;
3233 font-family: inherit;
3234 cursor: pointer;
3235 outline: 0;
3236 -webkit-box-sizing: border-box;
3237 box-sizing: border-box;
3238 vertical-align: middle;
3239}
3240input[type="submit"].button,
3241input[type="button"].button {
3242 width: 100%;
3243}
3244button {
3245 width: 100%;
3246}
3247.segmented {
3248 -webkit-align-self: center;
3249 -ms-flex-item-align: center;
3250 align-self: center;
3251 display: -webkit-box;
3252 display: -webkit-flex;
3253 display: -ms-flexbox;
3254 display: flex;
3255 -webkit-flex-wrap: nowrap;
3256 -ms-flex-wrap: nowrap;
3257 flex-wrap: nowrap;
3258}
3259.segmented .button,
3260.segmented button {
3261 width: 100%;
3262 -webkit-flex-shrink: 1;
3263 -ms-flex-negative: 1;
3264 flex-shrink: 1;
3265 min-width: 0;
3266}
3267.subnavbar .segmented {
3268 width: 100%;
3269}
3270.md .button {
3271 color: #2196f3;
3272 border-radius: 4px;
3273 line-height: 36px;
3274 height: 36px;
3275 text-transform: uppercase;
3276 min-width: 64px;
3277 padding: 0 8px;
3278 border: none;
3279 -webkit-transition-duration: 300ms;
3280 transition-duration: 300ms;
3281 -webkit-transform: translate3d(0, 0, 0);
3282 transform: translate3d(0, 0, 0);
3283 font-weight: 500;
3284 letter-spacing: 0.03em;
3285}
3286.md .button.active-state {
3287 background: rgba(0, 0, 0, 0.1);
3288}
3289.md .button.button-fill,
3290.md .button.button-fill-md,
3291.md .button.button-active,
3292.md .button.tab-link-active {
3293 background-color: #2196f3;
3294 color: #fff;
3295}
3296.md .button.button-fill.active-state,
3297.md .button.button-fill-md.active-state,
3298.md .button.button-active.active-state,
3299.md .button.tab-link-active.active-state {
3300 background: #0c82df;
3301}
3302.md .button.button-big,
3303.md .button.button-big-md {
3304 height: 48px;
3305 line-height: 48px;
3306 border-radius: 4px;
3307}
3308.md .button.button-round,
3309.md .button.button-round-md {
3310 border-radius: 36px;
3311}
3312.md .button.button-outline {
3313 border: 2px solid #2196f3;
3314 line-height: 32px;
3315}
3316.md .button.button-outline.button-big,
3317.md .button.button-outline.button-big-md {
3318 line-height: 44px;
3319}
3320.md .button.button-small,
3321.md .button.button-small-md {
3322 height: 28px;
3323 line-height: 28px;
3324 font-size: 13px;
3325 font-weight: 500;
3326 letter-spacing: 0.03em;
3327}
3328.md .button.button-small.button-outline,
3329.md .button.button-small-md.button-outline {
3330 border-width: 2px;
3331 line-height: 24px;
3332}
3333.md .button > i.icon + span,
3334.md .button > span:not(.ripple-wave) + span,
3335.md .button > span:not(.ripple-wave) + i.icon,
3336.md .button > i.icon + i.icon {
3337 margin-right: 8px;
3338}
3339.md .button.button-raised {
3340 -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
3341 box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
3342}
3343.md .button.button-raised.active-state {
3344 -webkit-box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23);
3345 box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23);
3346}
3347.md .navbar .button:not(.button-fill):not(.button-fill-md),
3348.md .subnavbar .button:not(.button-fill):not(.button-fill-md),
3349.md .toolbar .button:not(.button-fill):not(.button-fill-md) {
3350 color: #fff;
3351}
3352.md .navbar .button:not(.button-fill):not(.button-fill-md).active-state,
3353.md .subnavbar .button:not(.button-fill):not(.button-fill-md).active-state,
3354.md .toolbar .button:not(.button-fill):not(.button-fill-md).active-state {
3355 background: rgba(255, 255, 255, 0.15);
3356}
3357.md .toast .button:not(.button-fill):not(.button-fill-md).active-state {
3358 background: rgba(255, 255, 255, 0.15);
3359}
3360.md .segmented {
3361 border-radius: 4px;
3362}
3363.md .segmented.segmented-raised {
3364 -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
3365 box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
3366}
3367.md .segmented.segmented-round {
3368 border-radius: 36px;
3369}
3370.md .segmented .button {
3371 border-radius: 0;
3372 min-width: 0;
3373 border-right: 1px solid rgba(0, 0, 0, 0.1);
3374}
3375.md .segmented .button:first-child {
3376 border-radius: 0 4px 4px 0;
3377 border-right: none;
3378}
3379.md .segmented .button.button-outline {
3380 border: 2px solid #2196f3;
3381}
3382.md .segmented .button.button-outline:nth-child(n + 2) {
3383 border-right: none;
3384}
3385.md .segmented .button:last-child {
3386 border-radius: 4px 0 0 4px;
3387}
3388.md .segmented .button:first-child:last-child {
3389 border-radius: 4px;
3390}
3391.md .segmented .button.button-round:first-child {
3392 border-radius: 0 36px 36px 0;
3393}
3394.md .segmented .button.button-round:last-child {
3395 border-radius: 36px 0 0 36px;
3396}
3397.md .theme-dark .button:not(.button-fill):not(.button-fill-md):not(.button-active):not(.tab-link-active).active-state {
3398 background-color: rgba(255, 255, 255, 0.1);
3399}
3400.md .color-theme-red .button,
3401.md .color-red .button {
3402 color: #f44336;
3403}
3404.md .color-theme-red .button.button-fill,
3405.md .color-red .button.button-fill,
3406.md .color-theme-red .button.button-fill-md,
3407.md .color-red .button.button-fill-md,
3408.md .color-theme-red .button.button-active,
3409.md .color-red .button.button-active,
3410.md .color-theme-red .button.tab-link-active,
3411.md .color-red .button.tab-link-active {
3412 background-color: #f44336;
3413 color: #fff;
3414}
3415.md .color-theme-red .button.button-fill.active-state,
3416.md .color-red .button.button-fill.active-state,
3417.md .color-theme-red .button.button-fill-md.active-state,
3418.md .color-red .button.button-fill-md.active-state,
3419.md .color-theme-red .button.button-active.active-state,
3420.md .color-red .button.button-active.active-state,
3421.md .color-theme-red .button.tab-link-active.active-state,
3422.md .color-red .button.tab-link-active.active-state {
3423 background: #f21f0f;
3424}
3425.md .color-theme-red .button.button-outline,
3426.md .color-red .button.button-outline {
3427 border-color: #f44336;
3428}
3429.md .color-theme-green .button,
3430.md .color-green .button {
3431 color: #4caf50;
3432}
3433.md .color-theme-green .button.button-fill,
3434.md .color-green .button.button-fill,
3435.md .color-theme-green .button.button-fill-md,
3436.md .color-green .button.button-fill-md,
3437.md .color-theme-green .button.button-active,
3438.md .color-green .button.button-active,
3439.md .color-theme-green .button.tab-link-active,
3440.md .color-green .button.tab-link-active {
3441 background-color: #4caf50;
3442 color: #fff;
3443}
3444.md .color-theme-green .button.button-fill.active-state,
3445.md .color-green .button.button-fill.active-state,
3446.md .color-theme-green .button.button-fill-md.active-state,
3447.md .color-green .button.button-fill-md.active-state,
3448.md .color-theme-green .button.button-active.active-state,
3449.md .color-green .button.button-active.active-state,
3450.md .color-theme-green .button.tab-link-active.active-state,
3451.md .color-green .button.tab-link-active.active-state {
3452 background: #409343;
3453}
3454.md .color-theme-green .button.button-outline,
3455.md .color-green .button.button-outline {
3456 border-color: #4caf50;
3457}
3458.md .color-theme-blue .button,
3459.md .color-blue .button {
3460 color: #2196f3;
3461}
3462.md .color-theme-blue .button.button-fill,
3463.md .color-blue .button.button-fill,
3464.md .color-theme-blue .button.button-fill-md,
3465.md .color-blue .button.button-fill-md,
3466.md .color-theme-blue .button.button-active,
3467.md .color-blue .button.button-active,
3468.md .color-theme-blue .button.tab-link-active,
3469.md .color-blue .button.tab-link-active {
3470 background-color: #2196f3;
3471 color: #fff;
3472}
3473.md .color-theme-blue .button.button-fill.active-state,
3474.md .color-blue .button.button-fill.active-state,
3475.md .color-theme-blue .button.button-fill-md.active-state,
3476.md .color-blue .button.button-fill-md.active-state,
3477.md .color-theme-blue .button.button-active.active-state,
3478.md .color-blue .button.button-active.active-state,
3479.md .color-theme-blue .button.tab-link-active.active-state,
3480.md .color-blue .button.tab-link-active.active-state {
3481 background: #0c82df;
3482}
3483.md .color-theme-blue .button.button-outline,
3484.md .color-blue .button.button-outline {
3485 border-color: #2196f3;
3486}
3487.md .color-theme-pink .button,
3488.md .color-pink .button {
3489 color: #e91e63;
3490}
3491.md .color-theme-pink .button.button-fill,
3492.md .color-pink .button.button-fill,
3493.md .color-theme-pink .button.button-fill-md,
3494.md .color-pink .button.button-fill-md,
3495.md .color-theme-pink .button.button-active,
3496.md .color-pink .button.button-active,
3497.md .color-theme-pink .button.tab-link-active,
3498.md .color-pink .button.tab-link-active {
3499 background-color: #e91e63;
3500 color: #fff;
3501}
3502.md .color-theme-pink .button.button-fill.active-state,
3503.md .color-pink .button.button-fill.active-state,
3504.md .color-theme-pink .button.button-fill-md.active-state,
3505.md .color-pink .button.button-fill-md.active-state,
3506.md .color-theme-pink .button.button-active.active-state,
3507.md .color-pink .button.button-active.active-state,
3508.md .color-theme-pink .button.tab-link-active.active-state,
3509.md .color-pink .button.tab-link-active.active-state {
3510 background: #ca1452;
3511}
3512.md .color-theme-pink .button.button-outline,
3513.md .color-pink .button.button-outline {
3514 border-color: #e91e63;
3515}
3516.md .color-theme-yellow .button,
3517.md .color-yellow .button {
3518 color: #ffeb3b;
3519}
3520.md .color-theme-yellow .button.button-fill,
3521.md .color-yellow .button.button-fill,
3522.md .color-theme-yellow .button.button-fill-md,
3523.md .color-yellow .button.button-fill-md,
3524.md .color-theme-yellow .button.button-active,
3525.md .color-yellow .button.button-active,
3526.md .color-theme-yellow .button.tab-link-active,
3527.md .color-yellow .button.tab-link-active {
3528 background-color: #ffeb3b;
3529 color: #fff;
3530}
3531.md .color-theme-yellow .button.button-fill.active-state,
3532.md .color-yellow .button.button-fill.active-state,
3533.md .color-theme-yellow .button.button-fill-md.active-state,
3534.md .color-yellow .button.button-fill-md.active-state,
3535.md .color-theme-yellow .button.button-active.active-state,
3536.md .color-yellow .button.button-active.active-state,
3537.md .color-theme-yellow .button.tab-link-active.active-state,
3538.md .color-yellow .button.tab-link-active.active-state {
3539 background: #ffe712;
3540}
3541.md .color-theme-yellow .button.button-outline,
3542.md .color-yellow .button.button-outline {
3543 border-color: #ffeb3b;
3544}
3545.md .color-theme-orange .button,
3546.md .color-orange .button {
3547 color: #ff9800;
3548}
3549.md .color-theme-orange .button.button-fill,
3550.md .color-orange .button.button-fill,
3551.md .color-theme-orange .button.button-fill-md,
3552.md .color-orange .button.button-fill-md,
3553.md .color-theme-orange .button.button-active,
3554.md .color-orange .button.button-active,
3555.md .color-theme-orange .button.tab-link-active,
3556.md .color-orange .button.tab-link-active {
3557 background-color: #ff9800;
3558 color: #fff;
3559}
3560.md .color-theme-orange .button.button-fill.active-state,
3561.md .color-orange .button.button-fill.active-state,
3562.md .color-theme-orange .button.button-fill-md.active-state,
3563.md .color-orange .button.button-fill-md.active-state,
3564.md .color-theme-orange .button.button-active.active-state,
3565.md .color-orange .button.button-active.active-state,
3566.md .color-theme-orange .button.tab-link-active.active-state,
3567.md .color-orange .button.tab-link-active.active-state {
3568 background: #d68000;
3569}
3570.md .color-theme-orange .button.button-outline,
3571.md .color-orange .button.button-outline {
3572 border-color: #ff9800;
3573}
3574.md .color-theme-gray .button,
3575.md .color-gray .button {
3576 color: #9e9e9e;
3577}
3578.md .color-theme-gray .button.button-fill,
3579.md .color-gray .button.button-fill,
3580.md .color-theme-gray .button.button-fill-md,
3581.md .color-gray .button.button-fill-md,
3582.md .color-theme-gray .button.button-active,
3583.md .color-gray .button.button-active,
3584.md .color-theme-gray .button.tab-link-active,
3585.md .color-gray .button.tab-link-active {
3586 background-color: #9e9e9e;
3587 color: #fff;
3588}
3589.md .color-theme-gray .button.button-fill.active-state,
3590.md .color-gray .button.button-fill.active-state,
3591.md .color-theme-gray .button.button-fill-md.active-state,
3592.md .color-gray .button.button-fill-md.active-state,
3593.md .color-theme-gray .button.button-active.active-state,
3594.md .color-gray .button.button-active.active-state,
3595.md .color-theme-gray .button.tab-link-active.active-state,
3596.md .color-gray .button.tab-link-active.active-state {
3597 background: #8a8a8a;
3598}
3599.md .color-theme-gray .button.button-outline,
3600.md .color-gray .button.button-outline {
3601 border-color: #9e9e9e;
3602}
3603.md .color-theme-white .button,
3604.md .color-white .button {
3605 color: #ffffff;
3606}
3607.md .color-theme-white .button.button-fill,
3608.md .color-white .button.button-fill,
3609.md .color-theme-white .button.button-fill-md,
3610.md .color-white .button.button-fill-md,
3611.md .color-theme-white .button.button-active,
3612.md .color-white .button.button-active,
3613.md .color-theme-white .button.tab-link-active,
3614.md .color-white .button.tab-link-active {
3615 background-color: #ffffff;
3616 color: #fff;
3617}
3618.md .color-theme-white .button.button-fill.active-state,
3619.md .color-white .button.button-fill.active-state,
3620.md .color-theme-white .button.button-fill-md.active-state,
3621.md .color-white .button.button-fill-md.active-state,
3622.md .color-theme-white .button.button-active.active-state,
3623.md .color-white .button.button-active.active-state,
3624.md .color-theme-white .button.tab-link-active.active-state,
3625.md .color-white .button.tab-link-active.active-state {
3626 background: #ebebeb;
3627}
3628.md .color-theme-white .button.button-outline,
3629.md .color-white .button.button-outline {
3630 border-color: #ffffff;
3631}
3632.md .color-theme-black .button,
3633.md .color-black .button {
3634 color: #000000;
3635}
3636.md .color-theme-black .button.button-fill,
3637.md .color-black .button.button-fill,
3638.md .color-theme-black .button.button-fill-md,
3639.md .color-black .button.button-fill-md,
3640.md .color-theme-black .button.button-active,
3641.md .color-black .button.button-active,
3642.md .color-theme-black .button.tab-link-active,
3643.md .color-black .button.tab-link-active {
3644 background-color: #000000;
3645 color: #fff;
3646}
3647.md .color-theme-black .button.button-fill.active-state,
3648.md .color-black .button.button-fill.active-state,
3649.md .color-theme-black .button.button-fill-md.active-state,
3650.md .color-black .button.button-fill-md.active-state,
3651.md .color-theme-black .button.button-active.active-state,
3652.md .color-black .button.button-active.active-state,
3653.md .color-theme-black .button.tab-link-active.active-state,
3654.md .color-black .button.tab-link-active.active-state {
3655 background: #000000;
3656}
3657.md .color-theme-black .button.button-outline,
3658.md .color-black .button.button-outline {
3659 border-color: #000000;
3660}
3661.md .button.color-red {
3662 color: #f44336;
3663}
3664.md .button.color-red.button-fill,
3665.md .button.color-red.button-fill-md,
3666.md .button.color-red.button-active,
3667.md .button.color-red.tab-link-active {
3668 background-color: #f44336;
3669 color: #fff;
3670}
3671.md .button.color-red.button-fill.active-state,
3672.md .button.color-red.button-fill-md.active-state,
3673.md .button.color-red.button-active.active-state,
3674.md .button.color-red.tab-link-active.active-state {
3675 background: #f21f0f;
3676}
3677.md .button.color-red.button-outline {
3678 border-color: #f44336;
3679}
3680.md .button.color-green {
3681 color: #4caf50;
3682}
3683.md .button.color-green.button-fill,
3684.md .button.color-green.button-fill-md,
3685.md .button.color-green.button-active,
3686.md .button.color-green.tab-link-active {
3687 background-color: #4caf50;
3688 color: #fff;
3689}
3690.md .button.color-green.button-fill.active-state,
3691.md .button.color-green.button-fill-md.active-state,
3692.md .button.color-green.button-active.active-state,
3693.md .button.color-green.tab-link-active.active-state {
3694 background: #409343;
3695}
3696.md .button.color-green.button-outline {
3697 border-color: #4caf50;
3698}
3699.md .button.color-blue {
3700 color: #2196f3;
3701}
3702.md .button.color-blue.button-fill,
3703.md .button.color-blue.button-fill-md,
3704.md .button.color-blue.button-active,
3705.md .button.color-blue.tab-link-active {
3706 background-color: #2196f3;
3707 color: #fff;
3708}
3709.md .button.color-blue.button-fill.active-state,
3710.md .button.color-blue.button-fill-md.active-state,
3711.md .button.color-blue.button-active.active-state,
3712.md .button.color-blue.tab-link-active.active-state {
3713 background: #0c82df;
3714}
3715.md .button.color-blue.button-outline {
3716 border-color: #2196f3;
3717}
3718.md .button.color-pink {
3719 color: #e91e63;
3720}
3721.md .button.color-pink.button-fill,
3722.md .button.color-pink.button-fill-md,
3723.md .button.color-pink.button-active,
3724.md .button.color-pink.tab-link-active {
3725 background-color: #e91e63;
3726 color: #fff;
3727}
3728.md .button.color-pink.button-fill.active-state,
3729.md .button.color-pink.button-fill-md.active-state,
3730.md .button.color-pink.button-active.active-state,
3731.md .button.color-pink.tab-link-active.active-state {
3732 background: #ca1452;
3733}
3734.md .button.color-pink.button-outline {
3735 border-color: #e91e63;
3736}
3737.md .button.color-yellow {
3738 color: #ffeb3b;
3739}
3740.md .button.color-yellow.button-fill,
3741.md .button.color-yellow.button-fill-md,
3742.md .button.color-yellow.button-active,
3743.md .button.color-yellow.tab-link-active {
3744 background-color: #ffeb3b;
3745 color: #fff;
3746}
3747.md .button.color-yellow.button-fill.active-state,
3748.md .button.color-yellow.button-fill-md.active-state,
3749.md .button.color-yellow.button-active.active-state,
3750.md .button.color-yellow.tab-link-active.active-state {
3751 background: #ffe712;
3752}
3753.md .button.color-yellow.button-outline {
3754 border-color: #ffeb3b;
3755}
3756.md .button.color-orange {
3757 color: #ff9800;
3758}
3759.md .button.color-orange.button-fill,
3760.md .button.color-orange.button-fill-md,
3761.md .button.color-orange.button-active,
3762.md .button.color-orange.tab-link-active {
3763 background-color: #ff9800;
3764 color: #fff;
3765}
3766.md .button.color-orange.button-fill.active-state,
3767.md .button.color-orange.button-fill-md.active-state,
3768.md .button.color-orange.button-active.active-state,
3769.md .button.color-orange.tab-link-active.active-state {
3770 background: #d68000;
3771}
3772.md .button.color-orange.button-outline {
3773 border-color: #ff9800;
3774}
3775.md .button.color-gray {
3776 color: #9e9e9e;
3777}
3778.md .button.color-gray.button-fill,
3779.md .button.color-gray.button-fill-md,
3780.md .button.color-gray.button-active,
3781.md .button.color-gray.tab-link-active {
3782 background-color: #9e9e9e;
3783 color: #fff;
3784}
3785.md .button.color-gray.button-fill.active-state,
3786.md .button.color-gray.button-fill-md.active-state,
3787.md .button.color-gray.button-active.active-state,
3788.md .button.color-gray.tab-link-active.active-state {
3789 background: #8a8a8a;
3790}
3791.md .button.color-gray.button-outline {
3792 border-color: #9e9e9e;
3793}
3794.md .button.color-white {
3795 color: #ffffff;
3796}
3797.md .button.color-white.button-fill,
3798.md .button.color-white.button-fill-md,
3799.md .button.color-white.button-active,
3800.md .button.color-white.tab-link-active {
3801 background-color: #ffffff;
3802 color: #fff;
3803}
3804.md .button.color-white.button-fill.active-state,
3805.md .button.color-white.button-fill-md.active-state,
3806.md .button.color-white.button-active.active-state,
3807.md .button.color-white.tab-link-active.active-state {
3808 background: #ebebeb;
3809}
3810.md .button.color-white.button-outline {
3811 border-color: #ffffff;
3812}
3813.md .button.color-black {
3814 color: #000000;
3815}
3816.md .button.color-black.button-fill,
3817.md .button.color-black.button-fill-md,
3818.md .button.color-black.button-active,
3819.md .button.color-black.tab-link-active {
3820 background-color: #000000;
3821 color: #fff;
3822}
3823.md .button.color-black.button-fill.active-state,
3824.md .button.color-black.button-fill-md.active-state,
3825.md .button.color-black.button-active.active-state,
3826.md .button.color-black.tab-link-active.active-state {
3827 background: #000000;
3828}
3829.md .button.color-black.button-outline {
3830 border-color: #000000;
3831}
3832/* === Touch Ripple === */
3833.md .ripple,
3834.md .fab a,
3835.md a.link,
3836.md a.item-link,
3837.md .button,
3838.md .dialog-button,
3839.md .tab-link,
3840.md .radio,
3841.md .checkbox,
3842.md .actions-button,
3843.md .speed-dial-buttons a {
3844 -webkit-user-select: none;
3845 -moz-user-select: none;
3846 -ms-user-select: none;
3847 user-select: none;
3848}
3849.md .ripple-wave {
3850 left: 0;
3851 top: 0;
3852 position: absolute !important;
3853 border-radius: 50%;
3854 pointer-events: none;
3855 z-index: -1;
3856 background: rgba(0, 0, 0, 0.1);
3857 padding: 0;
3858 margin: 0;
3859 font-size: 0;
3860 -webkit-transform: translate3d(0px, 0px, 0) scale(0);
3861 transform: translate3d(0px, 0px, 0) scale(0);
3862 -webkit-transition-duration: 1400ms;
3863 transition-duration: 1400ms;
3864}
3865.md .ripple-wave.ripple-wave-fill {
3866 -webkit-transition-duration: 300ms;
3867 transition-duration: 300ms;
3868 opacity: 0.35;
3869}
3870.md .ripple-wave.ripple-wave-out {
3871 -webkit-transition-duration: 600ms;
3872 transition-duration: 600ms;
3873 opacity: 0;
3874}
3875.button-fill .md .ripple-wave,
3876.picker-calendar-day .md .ripple-wave {
3877 z-index: 1;
3878}
3879.md .button-fill .ripple-wave,
3880.md .button-active .ripple-wave,
3881.md .navbar .ripple-wave,
3882.md .toolbar .ripple-wave,
3883.md .subnavbar .ripple-wave,
3884.md .toast .ripple-wave,
3885.md .fab a .ripple-wave,
3886.md .stepper-fill .ripple-wave {
3887 background: rgba(255, 255, 255, 0.3);
3888}
3889.md .messagebar .ripple-wave,
3890.md .searchbar .ripple-wave {
3891 background: rgba(0, 0, 0, 0.1);
3892}
3893.md .data-table .sortable-cell .ripple-wave {
3894 z-index: 0;
3895}
3896.md .checkbox .ripple-wave,
3897.md .radio .ripple-wave {
3898 background: rgba(33, 150, 243, 0.5);
3899 z-index: 0;
3900}
3901.md .theme-dark .page-content .ripple-wave,
3902.md .theme-dark .messagebar .ripple-wave,
3903.md .theme-dark .popover .ripple-wave,
3904.md .theme-dark .calendar .ripple-wave,
3905.calendar.md .theme-dark .ripple-wave {
3906 background-color: rgba(255, 255, 255, 0.3);
3907}
3908.md .ripple-color-red .ripple-wave,
3909.md .ripple-red .ripple-wave {
3910 background-color: rgba(244, 67, 54, 0.3);
3911}
3912.md .ripple-color-green .ripple-wave,
3913.md .ripple-green .ripple-wave {
3914 background-color: rgba(76, 175, 80, 0.3);
3915}
3916.md .ripple-color-blue .ripple-wave,
3917.md .ripple-blue .ripple-wave {
3918 background-color: rgba(33, 150, 243, 0.3);
3919}
3920.md .ripple-color-pink .ripple-wave,
3921.md .ripple-pink .ripple-wave {
3922 background-color: rgba(233, 30, 99, 0.3);
3923}
3924.md .ripple-color-yellow .ripple-wave,
3925.md .ripple-yellow .ripple-wave {
3926 background-color: rgba(255, 235, 59, 0.3);
3927}
3928.md .ripple-color-orange .ripple-wave,
3929.md .ripple-orange .ripple-wave {
3930 background-color: rgba(255, 152, 0, 0.3);
3931}
3932.md .ripple-color-gray .ripple-wave,
3933.md .ripple-gray .ripple-wave {
3934 background-color: rgba(158, 158, 158, 0.3);
3935}
3936.md .ripple-color-white .ripple-wave,
3937.md .ripple-white .ripple-wave {
3938 background-color: rgba(255, 255, 255, 0.3);
3939}
3940.md .ripple-color-black .ripple-wave,
3941.md .ripple-black .ripple-wave {
3942 background-color: rgba(0, 0, 0, 0.3);
3943}
3944/* === Icon === */
3945i.icon {
3946 display: inline-block;
3947 vertical-align: middle;
3948 background-size: 100% auto;
3949 background-position: center;
3950 background-repeat: no-repeat;
3951 font-style: normal;
3952 position: relative;
3953}
3954.md .icon-back {
3955 width: 24px;
3956 height: 24px;
3957}
3958.md .icon-forward {
3959 width: 24px;
3960 height: 24px;
3961}
3962.md .icon-next,
3963.md .icon-prev {
3964 width: 24px;
3965 height: 24px;
3966}
3967.md .item-media .icon {
3968 color: #737373;
3969}
3970.md .item-media .material-icons {
3971 font-size: 24px;
3972 width: 24px;
3973 height: 24px;
3974}
3975.md .icon-forward {
3976 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");
3977}
3978.md .icon-back {
3979 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");
3980}
3981.md .icon-prev {
3982 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");
3983}
3984.md .icon-next {
3985 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");
3986}
3987.md .icon-forward.color-red,
3988.md a.link .color-red .icon-forward {
3989 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");
3990}
3991.md .icon-back.color-red,
3992.md a.link .color-red .icon-back {
3993 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");
3994}
3995.md .icon-prev.color-red,
3996.md a.link .color-red .icon-prev {
3997 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");
3998}
3999.md .icon-next.color-red,
4000.md a.link .color-red .icon-next {
4001 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");
4002}
4003.md .icon-forward.color-green,
4004.md a.link .color-green .icon-forward {
4005 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");
4006}
4007.md .icon-back.color-green,
4008.md a.link .color-green .icon-back {
4009 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");
4010}
4011.md .icon-prev.color-green,
4012.md a.link .color-green .icon-prev {
4013 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");
4014}
4015.md .icon-next.color-green,
4016.md a.link .color-green .icon-next {
4017 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");
4018}
4019.md .icon-forward.color-blue,
4020.md a.link .color-blue .icon-forward {
4021 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");
4022}
4023.md .icon-back.color-blue,
4024.md a.link .color-blue .icon-back {
4025 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");
4026}
4027.md .icon-prev.color-blue,
4028.md a.link .color-blue .icon-prev {
4029 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");
4030}
4031.md .icon-next.color-blue,
4032.md a.link .color-blue .icon-next {
4033 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");
4034}
4035.md .icon-forward.color-pink,
4036.md a.link .color-pink .icon-forward {
4037 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");
4038}
4039.md .icon-back.color-pink,
4040.md a.link .color-pink .icon-back {
4041 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");
4042}
4043.md .icon-prev.color-pink,
4044.md a.link .color-pink .icon-prev {
4045 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");
4046}
4047.md .icon-next.color-pink,
4048.md a.link .color-pink .icon-next {
4049 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");
4050}
4051.md .icon-forward.color-yellow,
4052.md a.link .color-yellow .icon-forward {
4053 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");
4054}
4055.md .icon-back.color-yellow,
4056.md a.link .color-yellow .icon-back {
4057 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");
4058}
4059.md .icon-prev.color-yellow,
4060.md a.link .color-yellow .icon-prev {
4061 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");
4062}
4063.md .icon-next.color-yellow,
4064.md a.link .color-yellow .icon-next {
4065 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");
4066}
4067.md .icon-forward.color-orange,
4068.md a.link .color-orange .icon-forward {
4069 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");
4070}
4071.md .icon-back.color-orange,
4072.md a.link .color-orange .icon-back {
4073 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");
4074}
4075.md .icon-prev.color-orange,
4076.md a.link .color-orange .icon-prev {
4077 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");
4078}
4079.md .icon-next.color-orange,
4080.md a.link .color-orange .icon-next {
4081 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");
4082}
4083.md .icon-forward.color-gray,
4084.md a.link .color-gray .icon-forward {
4085 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");
4086}
4087.md .icon-back.color-gray,
4088.md a.link .color-gray .icon-back {
4089 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");
4090}
4091.md .icon-prev.color-gray,
4092.md a.link .color-gray .icon-prev {
4093 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");
4094}
4095.md .icon-next.color-gray,
4096.md a.link .color-gray .icon-next {
4097 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");
4098}
4099.md .icon-forward.color-white,
4100.md a.link .color-white .icon-forward {
4101 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");
4102}
4103.md .icon-back.color-white,
4104.md a.link .color-white .icon-back {
4105 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");
4106}
4107.md .icon-prev.color-white,
4108.md a.link .color-white .icon-prev {
4109 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");
4110}
4111.md .icon-next.color-white,
4112.md a.link .color-white .icon-next {
4113 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");
4114}
4115.md .icon-forward.color-black,
4116.md a.link .color-black .icon-forward {
4117 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");
4118}
4119.md .icon-back.color-black,
4120.md a.link .color-black .icon-back {
4121 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");
4122}
4123.md .icon-prev.color-black,
4124.md a.link .color-black .icon-prev {
4125 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");
4126}
4127.md .icon-next.color-black,
4128.md a.link .color-black .icon-next {
4129 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");
4130}
4131.md .icon.color-red {
4132 color: #f44336;
4133}
4134.md .icon.color-green {
4135 color: #4caf50;
4136}
4137.md .icon.color-blue {
4138 color: #2196f3;
4139}
4140.md .icon.color-pink {
4141 color: #e91e63;
4142}
4143.md .icon.color-yellow {
4144 color: #ffeb3b;
4145}
4146.md .icon.color-orange {
4147 color: #ff9800;
4148}
4149.md .icon.color-gray {
4150 color: #9e9e9e;
4151}
4152.md .icon.color-white {
4153 color: #ffffff;
4154}
4155.md .icon.color-black {
4156 color: #000000;
4157}
4158.custom-modal-backdrop {
4159 position: absolute;
4160 left: 0;
4161 top: 0;
4162 width: 100%;
4163 height: 100%;
4164 background: rgba(0, 0, 0, 0.4);
4165 z-index: 13000;
4166 visibility: hidden;
4167 opacity: 0;
4168 -webkit-transition-duration: 400ms;
4169 transition-duration: 400ms;
4170 z-index: 10500;
4171}
4172.custom-modal-backdrop.not-animated {
4173 -webkit-transition-duration: 0ms;
4174 transition-duration: 0ms;
4175}
4176.custom-modal-backdrop.backdrop-in {
4177 visibility: visible;
4178 opacity: 1;
4179}
4180/* === Dialog === */
4181.dialog-backdrop {
4182 position: absolute;
4183 left: 0;
4184 top: 0;
4185 width: 100%;
4186 height: 100%;
4187 background: rgba(0, 0, 0, 0.4);
4188 z-index: 13000;
4189 visibility: hidden;
4190 opacity: 0;
4191 -webkit-transition-duration: 400ms;
4192 transition-duration: 400ms;
4193}
4194.dialog-backdrop.not-animated {
4195 -webkit-transition-duration: 0ms;
4196 transition-duration: 0ms;
4197}
4198.dialog-backdrop.backdrop-in {
4199 visibility: visible;
4200 opacity: 1;
4201}
4202.dialog {
4203 position: absolute;
4204 z-index: 13500;
4205 left: 50%;
4206 margin-top: 0;
4207 top: 50%;
4208 overflow: hidden;
4209 opacity: 0;
4210 -webkit-transform: translate3d(0, 0, 0) scale(1.185);
4211 transform: translate3d(0, 0, 0) scale(1.185);
4212 -webkit-transition-property: opacity, -webkit-transform;
4213 transition-property: opacity, -webkit-transform;
4214 transition-property: transform, opacity;
4215 transition-property: transform, opacity, -webkit-transform;
4216 display: none;
4217 -webkit-transition-duration: 400ms;
4218 transition-duration: 400ms;
4219}
4220.dialog.modal-in {
4221 opacity: 1;
4222 -webkit-transform: translate3d(0, 0, 0) scale(1);
4223 transform: translate3d(0, 0, 0) scale(1);
4224}
4225.dialog.modal-out {
4226 opacity: 0;
4227 z-index: 13499;
4228}
4229.dialog.not-animated {
4230 -webkit-transition-duration: 0ms;
4231 transition-duration: 0ms;
4232}
4233.dialog-inner {
4234 position: relative;
4235}
4236.dialog-title {
4237 font-weight: 500;
4238}
4239.dialog-buttons {
4240 position: relative;
4241 display: -webkit-box;
4242 display: -webkit-flex;
4243 display: -ms-flexbox;
4244 display: flex;
4245 -webkit-box-orient: horizontal;
4246 -webkit-box-direction: reverse;
4247 -webkit-flex-direction: row-reverse;
4248 -ms-flex-direction: row-reverse;
4249 flex-direction: row-reverse;
4250}
4251.dialog-buttons-vertical .dialog-buttons {
4252 display: block;
4253 height: auto !important;
4254}
4255.dialog-no-buttons .dialog-buttons {
4256 display: none;
4257}
4258.dialog-input-field {
4259 position: relative;
4260}
4261.dialog-input-field .item-input-wrap {
4262 margin: 0;
4263 padding: 0;
4264}
4265.dialog-input {
4266 -webkit-box-sizing: border-box;
4267 box-sizing: border-box;
4268 margin: 0;
4269 margin-top: 15px;
4270 border-radius: 0;
4271 -webkit-appearance: none;
4272 -moz-appearance: none;
4273 appearance: none;
4274 width: 100%;
4275 display: block;
4276 font-family: inherit;
4277 -webkit-box-shadow: none;
4278 box-shadow: none;
4279}
4280html.with-modal-dialog .page-content {
4281 overflow: hidden;
4282 -webkit-overflow-scrolling: auto;
4283}
4284.md .dialog {
4285 width: 280px;
4286 margin-left: -140px;
4287 border-radius: 4px;
4288 color: #757575;
4289 background: #fff;
4290 font-size: 16px;
4291 -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);
4292 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);
4293}
4294.md .dialog.modal-in {
4295 opacity: 1;
4296 -webkit-transform: translate3d(0, 0, 0) scale(1);
4297 transform: translate3d(0, 0, 0) scale(1);
4298}
4299.md .dialog.modal-out {
4300 opacity: 0;
4301 z-index: 13499;
4302 -webkit-transform: translate3d(0, 0, 0) scale(0.815);
4303 transform: translate3d(0, 0, 0) scale(0.815);
4304}
4305.md .dialog-inner {
4306 padding: 24px 24px 20px;
4307}
4308.md .dialog-title {
4309 font-size: 20px;
4310 color: #212121;
4311 line-height: 1.3;
4312}
4313.md .dialog-title + .dialog-text {
4314 margin-top: 20px;
4315}
4316.md .dialog-text {
4317 line-height: 1.5;
4318}
4319.md .dialog-buttons {
4320 height: 48px;
4321 padding: 6px 8px;
4322 overflow: hidden;
4323 -webkit-box-sizing: border-box;
4324 box-sizing: border-box;
4325 -webkit-box-pack: end;
4326 -webkit-justify-content: flex-end;
4327 -ms-flex-pack: end;
4328 justify-content: flex-end;
4329}
4330.md .dialog-buttons-vertical .dialog-buttons {
4331 padding: 0 0 8px 0;
4332}
4333.md .dialog-buttons-vertical .dialog-buttons .dialog-button {
4334 margin-left: 0;
4335 text-align: right;
4336 height: 48px;
4337 line-height: 48px;
4338 border-radius: 0;
4339 padding-left: 16px;
4340 padding-right: 16px;
4341}
4342.md .dialog-button {
4343 text-decoration: none;
4344 text-align: center;
4345 display: block;
4346 -webkit-appearance: none;
4347 -moz-appearance: none;
4348 appearance: none;
4349 background: none;
4350 padding: 0 10px;
4351 margin: 0;
4352 white-space: nowrap;
4353 text-overflow: ellipsis;
4354 font-size: 14px;
4355 position: relative;
4356 overflow: hidden;
4357 font-family: inherit;
4358 cursor: pointer;
4359 outline: 0;
4360 -webkit-box-sizing: border-box;
4361 box-sizing: border-box;
4362 vertical-align: middle;
4363 color: #2196f3;
4364 border-radius: 4px;
4365 line-height: 36px;
4366 height: 36px;
4367 text-transform: uppercase;
4368 min-width: 64px;
4369 padding: 0 8px;
4370 border: none;
4371 -webkit-transition-duration: 300ms;
4372 transition-duration: 300ms;
4373 -webkit-transform: translate3d(0, 0, 0);
4374 transform: translate3d(0, 0, 0);
4375 letter-spacing: 0.03em;
4376 font-weight: 500;
4377}
4378input[type="submit"].md .dialog-button,
4379input[type="button"].md .dialog-button {
4380 width: 100%;
4381}
4382.md .dialog-button.active-state {
4383 background: rgba(0, 0, 0, 0.1);
4384}
4385.md .dialog-button.dialog-button-bold {
4386 font-weight: 700;
4387}
4388.md .dialog-button + .dialog-button {
4389 margin-left: 4px;
4390}
4391.md .dialog-input {
4392 height: 36px;
4393 padding: 0;
4394 border: none;
4395 font-size: 16px;
4396 -webkit-transition-duration: 200ms;
4397 transition-duration: 200ms;
4398 position: relative;
4399}
4400.md .dialog-input::-webkit-input-placeholder {
4401 color: rgba(0, 0, 0, 0.35);
4402}
4403.md .dialog-input:-ms-input-placeholder {
4404 color: rgba(0, 0, 0, 0.35);
4405}
4406.md .dialog-input::-ms-input-placeholder {
4407 color: rgba(0, 0, 0, 0.35);
4408}
4409.md .dialog-input::placeholder {
4410 color: rgba(0, 0, 0, 0.35);
4411}
4412.md .dialog-input + .dialog-input {
4413 margin-top: 16px;
4414}
4415.md .dialog-preloader .dialog-title,
4416.md .dialog-progress .dialog-title,
4417.md .dialog-preloader .dialog-inner,
4418.md .dialog-progress .dialog-inner {
4419 text-align: center;
4420}
4421.md .dialog-preloader .dialog-title ~ .preloader,
4422.md .dialog-preloader .dialog-text ~ .preloader {
4423 margin-top: 20px;
4424}
4425.md .dialog-progress .dialog-title ~ .progressbar,
4426.md .dialog-progress .dialog-text ~ .progressbar,
4427.md .dialog-progress .dialog-title ~ .progressbar-infinite,
4428.md .dialog-progress .dialog-text ~ .progressbar-infinite {
4429 margin-top: 16px;
4430}
4431.md .dialog-button.color-red {
4432 color: #f44336;
4433}
4434.md .dialog-button.color-green {
4435 color: #4caf50;
4436}
4437.md .dialog-button.color-blue {
4438 color: #2196f3;
4439}
4440.md .dialog-button.color-pink {
4441 color: #e91e63;
4442}
4443.md .dialog-button.color-yellow {
4444 color: #ffeb3b;
4445}
4446.md .dialog-button.color-orange {
4447 color: #ff9800;
4448}
4449.md .dialog-button.color-gray {
4450 color: #9e9e9e;
4451}
4452.md .dialog-button.color-white {
4453 color: #ffffff;
4454}
4455.md .dialog-button.color-black {
4456 color: #000000;
4457}
4458/* === Popup === */
4459.popup-backdrop {
4460 position: absolute;
4461 left: 0;
4462 top: 0;
4463 width: 100%;
4464 height: 100%;
4465 background: rgba(0, 0, 0, 0.4);
4466 z-index: 13000;
4467 visibility: hidden;
4468 opacity: 0;
4469 -webkit-transition-duration: 400ms;
4470 transition-duration: 400ms;
4471 z-index: 10500;
4472}
4473.popup-backdrop.not-animated {
4474 -webkit-transition-duration: 0ms;
4475 transition-duration: 0ms;
4476}
4477.popup-backdrop.backdrop-in {
4478 visibility: visible;
4479 opacity: 1;
4480}
4481.popup {
4482 position: absolute;
4483 left: 0;
4484 top: 0;
4485 width: 100%;
4486 height: 100%;
4487 display: none;
4488 -webkit-box-sizing: border-box;
4489 box-sizing: border-box;
4490 -webkit-transition-property: -webkit-transform;
4491 transition-property: -webkit-transform;
4492 transition-property: transform;
4493 transition-property: transform, -webkit-transform;
4494 -webkit-transform: translate3d(0, 100%, 0);
4495 transform: translate3d(0, 100%, 0);
4496 background: #fff;
4497 z-index: 11000;
4498}
4499.popup.modal-in,
4500.popup.modal-out {
4501 -webkit-transition-duration: 400ms;
4502 transition-duration: 400ms;
4503}
4504.popup.not-animated {
4505 -webkit-transition-duration: 0ms;
4506 transition-duration: 0ms;
4507}
4508.popup.modal-in {
4509 display: block;
4510 -webkit-transform: translate3d(0, 0, 0);
4511 transform: translate3d(0, 0, 0);
4512}
4513.popup.modal-out {
4514 -webkit-transform: translate3d(0, 100%, 0);
4515 transform: translate3d(0, 100%, 0);
4516}
4517@media (min-width: 630px) and (min-height: 630px) {
4518 .popup:not(.popup-tablet-fullscreen) {
4519 width: 630px;
4520 height: 630px;
4521 left: 50%;
4522 top: 50%;
4523 margin-left: -315px;
4524 margin-top: -315px;
4525 -webkit-transform: translate3d(0, 100vh, 0);
4526 transform: translate3d(0, 100vh, 0);
4527 }
4528 .popup:not(.popup-tablet-fullscreen).modal-in {
4529 -webkit-transform: translate3d(0, 0, 0);
4530 transform: translate3d(0, 0, 0);
4531 }
4532 .popup:not(.popup-tablet-fullscreen).modal-out {
4533 -webkit-transform: translate3d(0, 100vh, 0);
4534 transform: translate3d(0, 100vh, 0);
4535 }
4536}
4537@media (max-width: 629px), (max-height: 629px) {
4538 html.with-statusbar .popup-backdrop {
4539 z-index: 9500;
4540 }
4541 html.with-statusbar.device-ios .popup,
4542 html.with-statusbar.ios:not(.device-ios):not(.device-android) .popup {
4543 height: calc(100% - 20px);
4544 top: 20px;
4545 }
4546 html.with-statusbar.device-iphone-x .popup {
4547 height: calc(100% - constant(safe-area-inset-top));
4548 height: calc(100% - env(safe-area-inset-top));
4549 top: constant(safe-area-inset-top);
4550 top: env(safe-area-inset-top);
4551 }
4552 html.with-statusbar.device-android .popup,
4553 html.with-statusbar.md:not(.device-ios):not(.device-android) .popup {
4554 height: calc(100% - 24px);
4555 top: 24px;
4556 }
4557}
4558@media (min-width: 630px), (min-height: 630px) {
4559 html.with-statusbar.device-ios .popup-tablet-fullscreen,
4560 html.with-statusbar.ios:not(.device-ios):not(.device-android) .popup-tablet-fullscreen {
4561 height: calc(100% - 20px);
4562 top: 20px;
4563 }
4564 html.with-statusbar.device-iphone-x .popup-tablet-fullscreen {
4565 height: calc(100% - constant(safe-area-inset-top));
4566 height: calc(100% - env(safe-area-inset-top));
4567 top: constant(safe-area-inset-top);
4568 top: env(safe-area-inset-top);
4569 }
4570 html.with-statusbar.device-android .popup-tablet-fullscreen,
4571 html.with-statusbar.md:not(.device-ios):not(.device-android) .popup-tablet-fullscreen {
4572 height: calc(100% - 24px);
4573 top: 24px;
4574 }
4575}
4576html.with-modal-popup .framework7-root > .views .page-content,
4577html.with-modal-popup .framework7-root > .view .page-content,
4578html.with-modal-popup .framework7-root > .panel .page-content {
4579 overflow: hidden;
4580 -webkit-overflow-scrolling: auto;
4581}
4582@media (min-width: 630px) and (min-height: 630px) {
4583 .md .popup:not(.popup-tablet-fullscreen) {
4584 -webkit-box-shadow: 0px 20px 44px rgba(0, 0, 0, 0.5);
4585 box-shadow: 0px 20px 44px rgba(0, 0, 0, 0.5);
4586 }
4587}
4588/* === Login Screen === */
4589.login-screen {
4590 position: absolute;
4591 left: 0;
4592 top: 0;
4593 width: 100%;
4594 height: 100%;
4595 display: none;
4596 -webkit-box-sizing: border-box;
4597 box-sizing: border-box;
4598 -webkit-transition-property: -webkit-transform;
4599 transition-property: -webkit-transform;
4600 transition-property: transform;
4601 transition-property: transform, -webkit-transform;
4602 -webkit-transform: translate3d(0, 100%, 0);
4603 transform: translate3d(0, 100%, 0);
4604 background: #fff;
4605 z-index: 11000;
4606}
4607.login-screen.modal-in,
4608.login-screen.modal-out {
4609 -webkit-transition-duration: 400ms;
4610 transition-duration: 400ms;
4611}
4612.login-screen.not-animated {
4613 -webkit-transition-duration: 0ms;
4614 transition-duration: 0ms;
4615}
4616.login-screen.modal-in {
4617 display: block;
4618 -webkit-transform: translate3d(0, 0, 0);
4619 transform: translate3d(0, 0, 0);
4620}
4621.login-screen.modal-out {
4622 -webkit-transform: translate3d(0, 100%, 0);
4623 transform: translate3d(0, 100%, 0);
4624}
4625html.with-statusbar.device-ios .login-screen,
4626html.with-statusbar.ios:not(.device-ios):not(.device-android) .login-screen {
4627 height: calc(100% - 20px);
4628 top: 20px;
4629}
4630html.with-statusbar.device-iphone-x .login-screen {
4631 height: calc(100% - constant(safe-area-inset-top));
4632 height: calc(100% - env(safe-area-inset-top));
4633 top: constant(safe-area-inset-top);
4634 top: env(safe-area-inset-top);
4635}
4636html.with-statusbar.device-android .login-screen,
4637html.with-statusbar.md:not(.device-ios):not(.device-android) .login-screen {
4638 height: calc(100% - 24px);
4639 top: 24px;
4640}
4641.login-screen-content {
4642 background: #fff;
4643}
4644.login-screen-content .login-screen-title,
4645.login-screen-content .list,
4646.login-screen-content .block,
4647.login-screen-content .block-footer,
4648.login-screen-content .block-header {
4649 max-width: 480px;
4650}
4651.login-screen-content .list ul {
4652 background: none;
4653}
4654.login-screen-content .list ul:before {
4655 display: none !important;
4656}
4657.login-screen-content .list ul:after {
4658 display: none !important;
4659}
4660.login-screen-content .block-footer,
4661.login-screen-content .block-header {
4662 text-align: center;
4663 margin-left: auto;
4664 margin-right: auto;
4665}
4666.login-screen-title {
4667 text-align: center;
4668}
4669.md .login-screen-content .login-screen-title,
4670.md .login-screen-content .list,
4671.md .login-screen-content .block {
4672 margin: 24px auto;
4673}
4674.md .login-screen-content .list-button {
4675 text-align: center;
4676 color: #2196f3;
4677}
4678.md .login-screen-title {
4679 font-size: 34px;
4680}
4681.md .theme-dark .login-screen-content,
4682.login-screen-content.md .theme-dark {
4683 background: none;
4684}
4685.md .color-theme-red .login-screen-content .list-button {
4686 color: #f44336;
4687}
4688.md .color-theme-green .login-screen-content .list-button {
4689 color: #4caf50;
4690}
4691.md .color-theme-blue .login-screen-content .list-button {
4692 color: #2196f3;
4693}
4694.md .color-theme-pink .login-screen-content .list-button {
4695 color: #e91e63;
4696}
4697.md .color-theme-yellow .login-screen-content .list-button {
4698 color: #ffeb3b;
4699}
4700.md .color-theme-orange .login-screen-content .list-button {
4701 color: #ff9800;
4702}
4703.md .color-theme-gray .login-screen-content .list-button {
4704 color: #9e9e9e;
4705}
4706.md .color-theme-white .login-screen-content .list-button {
4707 color: #ffffff;
4708}
4709.md .color-theme-black .login-screen-content .list-button {
4710 color: #000000;
4711}
4712.md .login-screen-content .list-button.color-red {
4713 color: #f44336;
4714}
4715.md .login-screen-content .list-button.color-green {
4716 color: #4caf50;
4717}
4718.md .login-screen-content .list-button.color-blue {
4719 color: #2196f3;
4720}
4721.md .login-screen-content .list-button.color-pink {
4722 color: #e91e63;
4723}
4724.md .login-screen-content .list-button.color-yellow {
4725 color: #ffeb3b;
4726}
4727.md .login-screen-content .list-button.color-orange {
4728 color: #ff9800;
4729}
4730.md .login-screen-content .list-button.color-gray {
4731 color: #9e9e9e;
4732}
4733.md .login-screen-content .list-button.color-white {
4734 color: #ffffff;
4735}
4736.md .login-screen-content .list-button.color-black {
4737 color: #000000;
4738}
4739/* === Popover === */
4740.popover-backdrop {
4741 position: absolute;
4742 left: 0;
4743 top: 0;
4744 width: 100%;
4745 height: 100%;
4746 background: rgba(0, 0, 0, 0.4);
4747 z-index: 13000;
4748 visibility: hidden;
4749 opacity: 0;
4750 -webkit-transition-duration: 400ms;
4751 transition-duration: 400ms;
4752}
4753.popover-backdrop.not-animated {
4754 -webkit-transition-duration: 0ms;
4755 transition-duration: 0ms;
4756}
4757.popover-backdrop.backdrop-in {
4758 visibility: visible;
4759 opacity: 1;
4760}
4761.popover {
4762 width: 260px;
4763 z-index: 13500;
4764 margin: 0;
4765 top: 0;
4766 opacity: 0;
4767 left: 0;
4768 position: absolute;
4769 display: none;
4770 -webkit-transition-duration: 300ms;
4771 transition-duration: 300ms;
4772}
4773.popover .list {
4774 margin: 0;
4775}
4776.popover .list ul {
4777 background: none;
4778}
4779.popover .list:first-child ul:before {
4780 display: none !important;
4781}
4782.popover .list:last-child ul:after {
4783 display: none !important;
4784}
4785.popover.modal-in {
4786 opacity: 1;
4787}
4788.popover.not-animated {
4789 -webkit-transition-duration: 0ms;
4790 transition-duration: 0ms;
4791}
4792.popover-inner {
4793 overflow: auto;
4794 -webkit-overflow-scrolling: touch;
4795}
4796.popover-from-actions-bold {
4797 font-weight: 600;
4798}
4799.popover-from-actions-label {
4800 line-height: 1.3;
4801 position: relative;
4802}
4803.popover-from-actions-label:last-child:after {
4804 display: none !important;
4805}
4806.md .popover {
4807 background: #fff;
4808 border-radius: 4px;
4809 -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);
4810 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);
4811 -webkit-transform: scale(0.85, 0.6);
4812 transform: scale(0.85, 0.6);
4813 -webkit-transition-property: opacity, border-radius, -webkit-transform;
4814 transition-property: opacity, border-radius, -webkit-transform;
4815 transition-property: opacity, transform, border-radius;
4816 transition-property: opacity, transform, border-radius, -webkit-transform;
4817}
4818.md .popover.modal-in {
4819 opacity: 1;
4820 -webkit-transform: scale(1);
4821 transform: scale(1);
4822}
4823.md .popover.modal-out {
4824 opacity: 0;
4825 -webkit-transform: scale(1);
4826 transform: scale(1);
4827}
4828.md .popover .list:first-child ul {
4829 border-radius: 3px 3px 0 0;
4830}
4831.md .popover .list:first-child li:first-child,
4832.md .popover .list:first-child li:first-child a,
4833.md .popover .list:first-child li:first-child > label {
4834 border-radius: 3px 3px 0 0;
4835}
4836.md .popover .list:last-child ul {
4837 border-radius: 0 0 3px 3px;
4838}
4839.md .popover .list:last-child li:last-child,
4840.md .popover .list:last-child li:last-child a,
4841.md .popover .list:last-child li:last-child > label {
4842 border-radius: 0 0 3px 3px;
4843}
4844.md .popover .list:first-child:last-child li:first-child:last-child,
4845.md .popover .list:first-child:last-child li:first-child:last-child a,
4846.md .popover .list:first-child:last-child li:first-child:last-child > label,
4847.md .popover .list:first-child:last-child ul {
4848 border-radius: 13px;
4849}
4850.md .popover .list + .list {
4851 margin-top: 35px;
4852}
4853.md .popover-on-top {
4854 -webkit-transform-origin: center bottom;
4855 transform-origin: center bottom;
4856}
4857.md .popover-on-bottom {
4858 -webkit-transform-origin: center top;
4859 transform-origin: center top;
4860}
4861.md .popover-from-actions .list {
4862 margin: 0;
4863}
4864.md .popover-from-actions .item-link i.icon {
4865 width: 24px;
4866 height: 24px;
4867 font-size: 24px;
4868}
4869.md .popover-from-actions-label {
4870 padding: 8px 16px;
4871 color: rgba(0, 0, 0, 0.54);
4872 padding-top: 12px;
4873 padding-bottom: 12px;
4874}
4875.md .popover-from-actions-label:after {
4876 content: '';
4877 position: absolute;
4878 background-color: #d2d2d6;
4879 display: block;
4880 z-index: 15;
4881 top: auto;
4882 right: auto;
4883 bottom: 0;
4884 left: 0;
4885 height: 1px;
4886 width: 100%;
4887 -webkit-transform-origin: 50% 100%;
4888 transform-origin: 50% 100%;
4889}
4890.md.device-pixel-ratio-2 .popover-from-actions-label:after {
4891 -webkit-transform: scaleY(0.5);
4892 transform: scaleY(0.5);
4893}
4894.md.device-pixel-ratio-3 .popover-from-actions-label:after {
4895 -webkit-transform: scaleY(0.33);
4896 transform: scaleY(0.33);
4897}
4898.md .theme-dark .popover {
4899 background-color: #202020;
4900}
4901.md .theme-dark .popover-from-actions-label {
4902 color: rgba(255, 255, 255, 0.54);
4903}
4904.md .theme-dark .popover-from-actions-label:after {
4905 background-color: rgba(255, 255, 255, 0.08);
4906}
4907/* === Actions === */
4908.actions-backdrop {
4909 position: absolute;
4910 left: 0;
4911 top: 0;
4912 width: 100%;
4913 height: 100%;
4914 background: rgba(0, 0, 0, 0.4);
4915 z-index: 13000;
4916 visibility: hidden;
4917 opacity: 0;
4918 -webkit-transition-duration: 400ms;
4919 transition-duration: 400ms;
4920}
4921.actions-backdrop.not-animated {
4922 -webkit-transition-duration: 0ms;
4923 transition-duration: 0ms;
4924}
4925.actions-backdrop.backdrop-in {
4926 visibility: visible;
4927 opacity: 1;
4928}
4929.actions-modal {
4930 position: absolute;
4931 left: 0;
4932 bottom: 0;
4933 z-index: 13500;
4934 width: 100%;
4935 -webkit-transform: translate3d(0, 100%, 0);
4936 transform: translate3d(0, 100%, 0);
4937 display: none;
4938 max-height: 100%;
4939 overflow: auto;
4940 -webkit-overflow-scrolling: touch;
4941 -webkit-transition-property: -webkit-transform;
4942 transition-property: -webkit-transform;
4943 transition-property: transform;
4944 transition-property: transform, -webkit-transform;
4945}
4946.actions-modal.modal-in,
4947.actions-modal.modal-out {
4948 -webkit-transition-duration: 300ms;
4949 transition-duration: 300ms;
4950}
4951.actions-modal.not-animated {
4952 -webkit-transition-duration: 0ms;
4953 transition-duration: 0ms;
4954}
4955.actions-modal.modal-in {
4956 -webkit-transform: translate3d(0, 0, 0);
4957 transform: translate3d(0, 0, 0);
4958}
4959.actions-modal.modal-out {
4960 z-index: 13499;
4961 -webkit-transform: translate3d(0, 100%, 0);
4962 transform: translate3d(0, 100%, 0);
4963}
4964@media (min-width: 496px) {
4965 .actions-modal {
4966 width: 480px;
4967 left: 50%;
4968 margin-left: -240px;
4969 }
4970}
4971.actions-group {
4972 position: relative;
4973}
4974.actions-button,
4975.actions-label {
4976 width: 100%;
4977 font-weight: normal;
4978 margin: 0;
4979 -webkit-box-sizing: border-box;
4980 box-sizing: border-box;
4981 display: block;
4982 position: relative;
4983}
4984.actions-button a,
4985.actions-label a {
4986 text-decoration: none;
4987 color: inherit;
4988 display: block;
4989}
4990.actions-button b,
4991.actions-label b,
4992.actions-button.actions-button-bold,
4993.actions-label.actions-button-bold {
4994 font-weight: 500;
4995}
4996.actions-button {
4997 cursor: pointer;
4998 display: -webkit-box;
4999 display: -webkit-flex;
5000 display: -ms-flexbox;
5001 display: flex;
5002}
5003.actions-button-media {
5004 -webkit-flex-shrink: 0;
5005 -ms-flex-negative: 0;
5006 flex-shrink: 0;
5007 display: -webkit-box;
5008 display: -webkit-flex;
5009 display: -ms-flexbox;
5010 display: flex;
5011 -webkit-box-align: center;
5012 -webkit-align-items: center;
5013 -ms-flex-align: center;
5014 align-items: center;
5015}
5016.actions-button-text {
5017 width: 100%;
5018 -webkit-flex-shrink: 1;
5019 -ms-flex-negative: 1;
5020 flex-shrink: 1;
5021}
5022.actions-label {
5023 line-height: 1.3;
5024 display: -webkit-box;
5025 display: -webkit-flex;
5026 display: -ms-flexbox;
5027 display: flex;
5028 -webkit-box-align: center;
5029 -webkit-align-items: center;
5030 -ms-flex-align: center;
5031 align-items: center;
5032}
5033.actions-grid .actions-group {
5034 display: -webkit-box;
5035 display: -webkit-flex;
5036 display: -ms-flexbox;
5037 display: flex;
5038 -webkit-flex-wrap: wrap;
5039 -ms-flex-wrap: wrap;
5040 flex-wrap: wrap;
5041 -webkit-box-pack: start;
5042 -webkit-justify-content: flex-start;
5043 -ms-flex-pack: start;
5044 justify-content: flex-start;
5045}
5046.actions-grid .actions-button {
5047 width: 33.33333333%;
5048 display: block;
5049}
5050.actions-grid .actions-button-media {
5051 margin-left: auto;
5052 margin-right: auto;
5053}
5054.actions-grid .actions-button-text {
5055 margin-left: 0 !important;
5056 text-align: center;
5057}
5058.md .actions-modal {
5059 background: #fff;
5060}
5061.md .actions-group:last-child:after {
5062 display: none !important;
5063}
5064.md .actions-group:after {
5065 content: '';
5066 position: absolute;
5067 background-color: #d2d2d6;
5068 display: block;
5069 z-index: 15;
5070 top: auto;
5071 right: auto;
5072 bottom: 0;
5073 left: 0;
5074 height: 1px;
5075 width: 100%;
5076 -webkit-transform-origin: 50% 100%;
5077 transform-origin: 50% 100%;
5078}
5079.md.device-pixel-ratio-2 .actions-group:after {
5080 -webkit-transform: scaleY(0.5);
5081 transform: scaleY(0.5);
5082}
5083.md.device-pixel-ratio-3 .actions-group:after {
5084 -webkit-transform: scaleY(0.33);
5085 transform: scaleY(0.33);
5086}
5087.md .actions-button,
5088.md .actions-label {
5089 padding: 0 16px;
5090}
5091.md .actions-button {
5092 line-height: 48px;
5093 font-size: 16px;
5094 color: rgba(0, 0, 0, 0.87);
5095 -webkit-transition-duration: 300ms;
5096 transition-duration: 300ms;
5097 -webkit-box-pack: justify;
5098 -webkit-justify-content: space-between;
5099 -ms-flex-pack: justify;
5100 justify-content: space-between;
5101}
5102.md .actions-button a,
5103.md .actions-button {
5104 position: relative;
5105 overflow: hidden;
5106 white-space: nowrap;
5107 text-overflow: ellipsis;
5108}
5109.md .actions-button a.active-state,
5110.md .actions-button.active-state {
5111 background: rgba(0, 0, 0, 0.1);
5112}
5113.md .actions-button-media {
5114 min-width: 40px;
5115}
5116.md .actions-button-media i.icon {
5117 width: 24px;
5118 height: 24px;
5119 font-size: 24px;
5120}
5121.md .actions-button-media + .actions-button-text {
5122 margin-left: 16px;
5123}
5124.md .actions-label {
5125 font-size: 16px;
5126 color: rgba(0, 0, 0, 0.54);
5127 padding-top: 12px;
5128 padding-bottom: 12px;
5129 -webkit-box-pack: start;
5130 -webkit-justify-content: flex-start;
5131 -ms-flex-pack: start;
5132 justify-content: flex-start;
5133}
5134.md .actions-grid {
5135 padding: 0;
5136}
5137.md .actions-grid .actions-button-media {
5138 width: 48px;
5139 height: 48px;
5140}
5141.md .actions-grid .actions-button-media i.icon {
5142 width: 48px;
5143 height: 48px;
5144 font-size: 48px;
5145}
5146.md .actions-grid .actions-button {
5147 padding: 16px;
5148 line-height: 1;
5149}
5150.md .actions-grid .actions-button-text {
5151 margin-top: 8px;
5152 line-height: 16px;
5153 height: 16px;
5154 font-size: 12px;
5155 color: #757575;
5156}
5157.md .actions-button.color-red,
5158.md .actions-label.color-red,
5159.md .actions-button.color-red .actions-button-text {
5160 color: #f44336;
5161}
5162.md .actions-button.color-green,
5163.md .actions-label.color-green,
5164.md .actions-button.color-green .actions-button-text {
5165 color: #4caf50;
5166}
5167.md .actions-button.color-blue,
5168.md .actions-label.color-blue,
5169.md .actions-button.color-blue .actions-button-text {
5170 color: #2196f3;
5171}
5172.md .actions-button.color-pink,
5173.md .actions-label.color-pink,
5174.md .actions-button.color-pink .actions-button-text {
5175 color: #e91e63;
5176}
5177.md .actions-button.color-yellow,
5178.md .actions-label.color-yellow,
5179.md .actions-button.color-yellow .actions-button-text {
5180 color: #ffeb3b;
5181}
5182.md .actions-button.color-orange,
5183.md .actions-label.color-orange,
5184.md .actions-button.color-orange .actions-button-text {
5185 color: #ff9800;
5186}
5187.md .actions-button.color-gray,
5188.md .actions-label.color-gray,
5189.md .actions-button.color-gray .actions-button-text {
5190 color: #9e9e9e;
5191}
5192.md .actions-button.color-white,
5193.md .actions-label.color-white,
5194.md .actions-button.color-white .actions-button-text {
5195 color: #ffffff;
5196}
5197.md .actions-button.color-black,
5198.md .actions-label.color-black,
5199.md .actions-button.color-black .actions-button-text {
5200 color: #000000;
5201}
5202.md.device-iphone-x .actions-modal.modal-in {
5203 padding-bottom: constant(safe-area-inset-bottom);
5204 padding-bottom: env(safe-area-inset-bottom);
5205}
5206/* === Sheet Modal === */
5207.sheet-backdrop {
5208 position: absolute;
5209 left: 0;
5210 top: 0;
5211 width: 100%;
5212 height: 100%;
5213 background: rgba(0, 0, 0, 0.4);
5214 z-index: 13000;
5215 visibility: hidden;
5216 opacity: 0;
5217 -webkit-transition-duration: 400ms;
5218 transition-duration: 400ms;
5219 z-index: 11000;
5220}
5221.sheet-backdrop.not-animated {
5222 -webkit-transition-duration: 0ms;
5223 transition-duration: 0ms;
5224}
5225.sheet-backdrop.backdrop-in {
5226 visibility: visible;
5227 opacity: 1;
5228}
5229.sheet-modal {
5230 position: absolute;
5231 left: 0;
5232 bottom: 0;
5233 width: 100%;
5234 height: 260px;
5235 display: none;
5236 -webkit-box-sizing: border-box;
5237 box-sizing: border-box;
5238 -webkit-transition-property: -webkit-transform;
5239 transition-property: -webkit-transform;
5240 transition-property: transform;
5241 transition-property: transform, -webkit-transform;
5242 -webkit-transform: translate3d(0, 100%, 0);
5243 transform: translate3d(0, 100%, 0);
5244 background: #fff;
5245 z-index: 12500;
5246}
5247.sheet-modal.modal-in,
5248.sheet-modal.modal-out {
5249 -webkit-transition-duration: 300ms;
5250 transition-duration: 300ms;
5251}
5252.sheet-modal.not-animated {
5253 -webkit-transition-duration: 0ms;
5254 transition-duration: 0ms;
5255}
5256.sheet-modal.modal-in {
5257 display: block;
5258 -webkit-transform: translate3d(0, 0, 0);
5259 transform: translate3d(0, 0, 0);
5260}
5261.sheet-modal.modal-out {
5262 -webkit-transform: translate3d(0, 100%, 0);
5263 transform: translate3d(0, 100%, 0);
5264}
5265.sheet-modal .sheet-modal-inner {
5266 height: 100%;
5267 position: relative;
5268 overflow: hidden;
5269}
5270.sheet-modal .toolbar {
5271 position: relative;
5272 width: 100%;
5273}
5274.md .sheet-modal {
5275 background: #fff;
5276}
5277.md .sheet-modal .toolbar {
5278 top: 0;
5279}
5280.md .sheet-modal .toolbar:after {
5281 display: none;
5282}
5283.md .sheet-modal .toolbar + .sheet-modal-inner {
5284 height: calc(100% - 48px);
5285}
5286.md .sheet-modal .toolbar a.link:not(.tab-link) {
5287 -webkit-flex-shrink: 0;
5288 -ms-flex-negative: 0;
5289 flex-shrink: 0;
5290}
5291.md .sheet-modal .toolbar:not(.toolbar-bottom-md):not(.messagebar) ~ .sheet-modal-inner .page-content {
5292 padding-top: 0;
5293}
5294.md.device-iphone-x .sheet-modal .toolbar ~ .sheet-modal-inner .page-content,
5295.md.device-iphone-x .sheet-modal .sheet-modal-inner > .page-content {
5296 padding-bottom: constant(safe-area-inset-bottom);
5297 padding-bottom: env(safe-area-inset-bottom);
5298}
5299.md .theme-dark .sheet-modal {
5300 background-color: #202020;
5301}
5302/* === Toast === */
5303.toast {
5304 -webkit-transition-property: opacity, -webkit-transform;
5305 transition-property: opacity, -webkit-transform;
5306 transition-property: transform, opacity;
5307 transition-property: transform, opacity, -webkit-transform;
5308 position: absolute;
5309 max-width: 568px;
5310 z-index: 20000;
5311 color: #fff;
5312 font-size: 14px;
5313 -webkit-box-sizing: border-box;
5314 box-sizing: border-box;
5315}
5316.toast.modal-in {
5317 opacity: 1;
5318}
5319.toast .toast-content {
5320 display: -webkit-box;
5321 display: -webkit-flex;
5322 display: -ms-flexbox;
5323 display: flex;
5324 -webkit-box-pack: justify;
5325 -webkit-justify-content: space-between;
5326 -ms-flex-pack: justify;
5327 justify-content: space-between;
5328 -webkit-box-align: center;
5329 -webkit-align-items: center;
5330 -ms-flex-align: center;
5331 align-items: center;
5332 -webkit-box-sizing: border-box;
5333 box-sizing: border-box;
5334}
5335.toast .toast-text {
5336 line-height: 20px;
5337 -webkit-flex-shrink: 1;
5338 -ms-flex-negative: 1;
5339 flex-shrink: 1;
5340 min-width: 0;
5341}
5342.toast .toast-button {
5343 -webkit-flex-shrink: 0;
5344 -ms-flex-negative: 0;
5345 flex-shrink: 0;
5346}
5347.toast.toast-with-icon .toast-content {
5348 display: block;
5349 text-align: center;
5350}
5351.toast.toast-with-icon .toast-text {
5352 text-align: center;
5353}
5354.toast.toast-with-icon .toast-icon .f7-icons {
5355 font-size: 50px;
5356 width: 50px;
5357 height: 50px;
5358}
5359.toast.toast-with-icon .toast-icon .material-icons {
5360 font-size: 48px;
5361 width: 48px;
5362 height: 48px;
5363}
5364.toast.toast-center {
5365 top: 50%;
5366 opacity: 0;
5367}
5368@media (min-width: 1024px) {
5369 .toast {
5370 opacity: 0;
5371 }
5372}
5373html.with-statusbar.device-ios .toast-top,
5374html.with-statusbar.ios:not(.device-ios):not(.device-android) .toast-top {
5375 margin-top: 20px;
5376}
5377html.with-statusbar.device-iphone-x .toast-top {
5378 margin-top: constant(safe-area-inset-top);
5379 margin-top: env(safe-area-inset-top);
5380}
5381html.with-statusbar.device-android .toast-top,
5382html.with-statusbar.md:not(.device-ios):not(.device-android) .toast-top {
5383 margin-top: 24px;
5384}
5385.md .toast {
5386 -webkit-transition-duration: 200ms;
5387 transition-duration: 200ms;
5388 border-radius: 4px;
5389 background: #323232;
5390 opacity: 0;
5391 left: 8px;
5392 width: calc(100% - 16px);
5393 -webkit-transform: scale(0.9);
5394 transform: scale(0.9);
5395}
5396.md .toast.modal-in {
5397 -webkit-transform: scale(1);
5398 transform: scale(1);
5399 opacity: 1;
5400}
5401.md .toast.modal-out {
5402 -webkit-transform: scale(1);
5403 transform: scale(1);
5404 opacity: 0;
5405}
5406.md .toast.toast-center {
5407 left: 50%;
5408 width: auto;
5409 background: rgba(0, 0, 0, 0.75);
5410 -webkit-transform: scale(0.9) translate3d(-55%, -55%, 0);
5411 transform: scale(0.9) translate3d(-55%, -55%, 0);
5412}
5413.md .toast.toast-center.modal-in {
5414 -webkit-transform: scale(1) translate3d(-50%, -50%, 0);
5415 transform: scale(1) translate3d(-50%, -50%, 0);
5416}
5417.md .toast.toast-center.modal-out {
5418 -webkit-transform: scale(1) translate3d(-50%, -50%, 0);
5419 transform: scale(1) translate3d(-50%, -50%, 0);
5420}
5421.md .toast.toast-bottom {
5422 bottom: 8px;
5423}
5424.md .toast.toast-top {
5425 top: 8px;
5426}
5427@media (min-width: 584px) {
5428 .md .toast {
5429 left: 50%;
5430 margin-left: -284px;
5431 }
5432 .md .toast.toast-center {
5433 margin-left: 0;
5434 }
5435}
5436@media (min-width: 1024px) {
5437 .md .toast {
5438 margin-left: 0;
5439 width: auto;
5440 }
5441 .md .toast.toast-bottom,
5442 .md .toast.toast-top {
5443 left: 24px;
5444 }
5445 .md .toast.toast-bottom {
5446 bottom: 24px;
5447 }
5448 .md .toast.toast-top {
5449 top: 24px;
5450 }
5451}
5452.md .toast-content {
5453 padding: 14px 24px;
5454}
5455.md .toast-button {
5456 margin-top: -8px;
5457 margin-bottom: -8px;
5458 margin-right: 16px;
5459 margin-left: -8px;
5460}
5461@media (max-width: 568px) {
5462 .md.device-iphone-x .toast-bottom .toast-content {
5463 padding-bottom: calc(14px + constant(safe-area-inset-bottom));
5464 padding-bottom: calc(14px + env(safe-area-inset-bottom));
5465 }
5466}
5467@media (min-width: 1024px) {
5468 .md.device-iphone-x .toast-bottom.modal-in {
5469 margin-bottom: constant(safe-area-inset-bottom);
5470 margin-bottom: env(safe-area-inset-bottom);
5471 }
5472}
5473/* === Preloader === */
5474.preloader {
5475 display: inline-block;
5476 vertical-align: middle;
5477}
5478/* === Preloader Modal === */
5479.preloader-backdrop {
5480 position: absolute;
5481 left: 0;
5482 top: 0;
5483 width: 100%;
5484 height: 100%;
5485 background: rgba(0, 0, 0, 0.4);
5486 z-index: 13000;
5487 visibility: hidden;
5488 -webkit-transition-duration: 400ms;
5489 transition-duration: 400ms;
5490 visibility: visible;
5491 opacity: 0;
5492 background: none;
5493 z-index: 14000;
5494}
5495.preloader-backdrop.not-animated {
5496 -webkit-transition-duration: 0ms;
5497 transition-duration: 0ms;
5498}
5499.preloader-backdrop.backdrop-in {
5500 visibility: visible;
5501 opacity: 1;
5502}
5503.preloader-modal {
5504 position: absolute;
5505 left: 50%;
5506 top: 50%;
5507 padding: 8px;
5508 background: rgba(0, 0, 0, 0.8);
5509 z-index: 14500;
5510 -webkit-transform: translateX(-50%) translateY(-50%);
5511 transform: translateX(-50%) translateY(-50%);
5512}
5513.preloader-modal .preloader {
5514 display: block !important;
5515}
5516html.with-modal-preloader .page-content {
5517 overflow: hidden;
5518 -webkit-overflow-scrolling: auto;
5519}
5520.md .preloader {
5521 font-size: 0;
5522 display: inline-block;
5523 width: 32px;
5524 height: 32px;
5525 -webkit-animation: md-preloader-outer 3300ms linear infinite;
5526 animation: md-preloader-outer 3300ms linear infinite;
5527}
5528@-webkit-keyframes md-preloader-outer {
5529 0% {
5530 -webkit-transform: rotate(0);
5531 transform: rotate(0);
5532 }
5533 100% {
5534 -webkit-transform: rotate(360deg);
5535 transform: rotate(360deg);
5536 }
5537}
5538@keyframes md-preloader-outer {
5539 0% {
5540 -webkit-transform: rotate(0);
5541 transform: rotate(0);
5542 }
5543 100% {
5544 -webkit-transform: rotate(360deg);
5545 transform: rotate(360deg);
5546 }
5547}
5548.md .preloader-inner {
5549 position: relative;
5550 display: block;
5551 width: 100%;
5552 height: 100%;
5553 -webkit-animation: md-preloader-inner-rotate 5.25s cubic-bezier(0.35, 0, 0.25, 1) infinite;
5554 animation: md-preloader-inner-rotate 5.25s cubic-bezier(0.35, 0, 0.25, 1) infinite;
5555}
5556.md .preloader-inner .preloader-inner-gap {
5557 position: absolute;
5558 width: 2px;
5559 left: 50%;
5560 margin-left: -1px;
5561 top: 0;
5562 bottom: 0;
5563 -webkit-box-sizing: border-box;
5564 box-sizing: border-box;
5565 border-top: 4px solid #757575;
5566}
5567.md .preloader-inner .preloader-inner-left,
5568.md .preloader-inner .preloader-inner-right {
5569 position: absolute;
5570 top: 0;
5571 height: 100%;
5572 width: 50%;
5573 overflow: hidden;
5574}
5575.md .preloader-inner .preloader-inner-half-circle {
5576 position: absolute;
5577 top: 0;
5578 height: 100%;
5579 width: 200%;
5580 -webkit-box-sizing: border-box;
5581 box-sizing: border-box;
5582 border: 4px solid #757575;
5583 border-bottom-color: transparent !important;
5584 border-radius: 50%;
5585 -webkit-animation-iteration-count: infinite;
5586 animation-iteration-count: infinite;
5587 -webkit-animation-duration: 1.3125s;
5588 animation-duration: 1.3125s;
5589 -webkit-animation-timing-function: cubic-bezier(0.35, 0, 0.25, 1);
5590 animation-timing-function: cubic-bezier(0.35, 0, 0.25, 1);
5591}
5592.md .preloader-inner .preloader-inner-left {
5593 left: 0;
5594}
5595.md .preloader-inner .preloader-inner-left .preloader-inner-half-circle {
5596 left: 0;
5597 border-right-color: transparent !important;
5598 -webkit-animation-name: md-preloader-left-rotate;
5599 animation-name: md-preloader-left-rotate;
5600}
5601.md .preloader-inner .preloader-inner-right {
5602 right: 0;
5603}
5604.md .preloader-inner .preloader-inner-right .preloader-inner-half-circle {
5605 right: 0;
5606 border-left-color: transparent !important;
5607 -webkit-animation-name: md-preloader-right-rotate;
5608 animation-name: md-preloader-right-rotate;
5609}
5610.md .preloader-modal {
5611 border-radius: 4px;
5612}
5613.md .preloader.color-red .preloader-inner-gap,
5614.md .preloader.preloader-red .preloader-inner-gap,
5615.md .preloader.color-red .preloader-inner-half-circle,
5616.md .preloader.preloader-red .preloader-inner-half-circle {
5617 border-color: #f44336;
5618}
5619.md .preloader.color-green .preloader-inner-gap,
5620.md .preloader.preloader-green .preloader-inner-gap,
5621.md .preloader.color-green .preloader-inner-half-circle,
5622.md .preloader.preloader-green .preloader-inner-half-circle {
5623 border-color: #4caf50;
5624}
5625.md .preloader.color-blue .preloader-inner-gap,
5626.md .preloader.preloader-blue .preloader-inner-gap,
5627.md .preloader.color-blue .preloader-inner-half-circle,
5628.md .preloader.preloader-blue .preloader-inner-half-circle {
5629 border-color: #2196f3;
5630}
5631.md .preloader.color-pink .preloader-inner-gap,
5632.md .preloader.preloader-pink .preloader-inner-gap,
5633.md .preloader.color-pink .preloader-inner-half-circle,
5634.md .preloader.preloader-pink .preloader-inner-half-circle {
5635 border-color: #e91e63;
5636}
5637.md .preloader.color-yellow .preloader-inner-gap,
5638.md .preloader.preloader-yellow .preloader-inner-gap,
5639.md .preloader.color-yellow .preloader-inner-half-circle,
5640.md .preloader.preloader-yellow .preloader-inner-half-circle {
5641 border-color: #ffeb3b;
5642}
5643.md .preloader.color-orange .preloader-inner-gap,
5644.md .preloader.preloader-orange .preloader-inner-gap,
5645.md .preloader.color-orange .preloader-inner-half-circle,
5646.md .preloader.preloader-orange .preloader-inner-half-circle {
5647 border-color: #ff9800;
5648}
5649.md .preloader.color-gray .preloader-inner-gap,
5650.md .preloader.preloader-gray .preloader-inner-gap,
5651.md .preloader.color-gray .preloader-inner-half-circle,
5652.md .preloader.preloader-gray .preloader-inner-half-circle {
5653 border-color: #9e9e9e;
5654}
5655.md .preloader.color-white .preloader-inner-gap,
5656.md .preloader.preloader-white .preloader-inner-gap,
5657.md .preloader.color-white .preloader-inner-half-circle,
5658.md .preloader.preloader-white .preloader-inner-half-circle {
5659 border-color: #ffffff;
5660}
5661.md .preloader.color-black .preloader-inner-gap,
5662.md .preloader.preloader-black .preloader-inner-gap,
5663.md .preloader.color-black .preloader-inner-half-circle,
5664.md .preloader.preloader-black .preloader-inner-half-circle {
5665 border-color: #000000;
5666}
5667.md .preloader.color-multi .preloader-inner-left .preloader-inner-half-circle {
5668 -webkit-animation-name: md-preloader-left-rotate-multicolor;
5669 animation-name: md-preloader-left-rotate-multicolor;
5670}
5671.md .preloader.color-multi .preloader-inner-right .preloader-inner-half-circle {
5672 -webkit-animation-name: md-preloader-right-rotate-multicolor;
5673 animation-name: md-preloader-right-rotate-multicolor;
5674}
5675@-webkit-keyframes md-preloader-left-rotate {
5676 0%,
5677 100% {
5678 -webkit-transform: rotate(130deg);
5679 transform: rotate(130deg);
5680 }
5681 50% {
5682 -webkit-transform: rotate(-5deg);
5683 transform: rotate(-5deg);
5684 }
5685}
5686@keyframes md-preloader-left-rotate {
5687 0%,
5688 100% {
5689 -webkit-transform: rotate(130deg);
5690 transform: rotate(130deg);
5691 }
5692 50% {
5693 -webkit-transform: rotate(-5deg);
5694 transform: rotate(-5deg);
5695 }
5696}
5697@-webkit-keyframes md-preloader-right-rotate {
5698 0%,
5699 100% {
5700 -webkit-transform: rotate(-130deg);
5701 transform: rotate(-130deg);
5702 }
5703 50% {
5704 -webkit-transform: rotate(5deg);
5705 transform: rotate(5deg);
5706 }
5707}
5708@keyframes md-preloader-right-rotate {
5709 0%,
5710 100% {
5711 -webkit-transform: rotate(-130deg);
5712 transform: rotate(-130deg);
5713 }
5714 50% {
5715 -webkit-transform: rotate(5deg);
5716 transform: rotate(5deg);
5717 }
5718}
5719@-webkit-keyframes md-preloader-inner-rotate {
5720 12.5% {
5721 -webkit-transform: rotate(135deg);
5722 transform: rotate(135deg);
5723 }
5724 25% {
5725 -webkit-transform: rotate(270deg);
5726 transform: rotate(270deg);
5727 }
5728 37.5% {
5729 -webkit-transform: rotate(405deg);
5730 transform: rotate(405deg);
5731 }
5732 50% {
5733 -webkit-transform: rotate(540deg);
5734 transform: rotate(540deg);
5735 }
5736 62.5% {
5737 -webkit-transform: rotate(675deg);
5738 transform: rotate(675deg);
5739 }
5740 75% {
5741 -webkit-transform: rotate(810deg);
5742 transform: rotate(810deg);
5743 }
5744 87.5% {
5745 -webkit-transform: rotate(945deg);
5746 transform: rotate(945deg);
5747 }
5748 100% {
5749 -webkit-transform: rotate(1080deg);
5750 transform: rotate(1080deg);
5751 }
5752}
5753@keyframes md-preloader-inner-rotate {
5754 12.5% {
5755 -webkit-transform: rotate(135deg);
5756 transform: rotate(135deg);
5757 }
5758 25% {
5759 -webkit-transform: rotate(270deg);
5760 transform: rotate(270deg);
5761 }
5762 37.5% {
5763 -webkit-transform: rotate(405deg);
5764 transform: rotate(405deg);
5765 }
5766 50% {
5767 -webkit-transform: rotate(540deg);
5768 transform: rotate(540deg);
5769 }
5770 62.5% {
5771 -webkit-transform: rotate(675deg);
5772 transform: rotate(675deg);
5773 }
5774 75% {
5775 -webkit-transform: rotate(810deg);
5776 transform: rotate(810deg);
5777 }
5778 87.5% {
5779 -webkit-transform: rotate(945deg);
5780 transform: rotate(945deg);
5781 }
5782 100% {
5783 -webkit-transform: rotate(1080deg);
5784 transform: rotate(1080deg);
5785 }
5786}
5787@-webkit-keyframes md-preloader-left-rotate-multicolor {
5788 0%,
5789 100% {
5790 border-left-color: #4285F4;
5791 -webkit-transform: rotate(130deg);
5792 transform: rotate(130deg);
5793 }
5794 75% {
5795 border-left-color: #1B9A59;
5796 border-top-color: #1B9A59;
5797 }
5798 50% {
5799 border-left-color: #F7C223;
5800 border-top-color: #F7C223;
5801 -webkit-transform: rotate(-5deg);
5802 transform: rotate(-5deg);
5803 }
5804 25% {
5805 border-left-color: #DE3E35;
5806 border-top-color: #DE3E35;
5807 }
5808}
5809@keyframes md-preloader-left-rotate-multicolor {
5810 0%,
5811 100% {
5812 border-left-color: #4285F4;
5813 -webkit-transform: rotate(130deg);
5814 transform: rotate(130deg);
5815 }
5816 75% {
5817 border-left-color: #1B9A59;
5818 border-top-color: #1B9A59;
5819 }
5820 50% {
5821 border-left-color: #F7C223;
5822 border-top-color: #F7C223;
5823 -webkit-transform: rotate(-5deg);
5824 transform: rotate(-5deg);
5825 }
5826 25% {
5827 border-left-color: #DE3E35;
5828 border-top-color: #DE3E35;
5829 }
5830}
5831@-webkit-keyframes md-preloader-right-rotate-multicolor {
5832 0%,
5833 100% {
5834 border-right-color: #4285F4;
5835 -webkit-transform: rotate(-130deg);
5836 transform: rotate(-130deg);
5837 }
5838 75% {
5839 border-right-color: #1B9A59;
5840 border-top-color: #1B9A59;
5841 }
5842 50% {
5843 border-right-color: #F7C223;
5844 border-top-color: #F7C223;
5845 -webkit-transform: rotate(5deg);
5846 transform: rotate(5deg);
5847 }
5848 25% {
5849 border-top-color: #DE3E35;
5850 border-right-color: #DE3E35;
5851 }
5852}
5853@keyframes md-preloader-right-rotate-multicolor {
5854 0%,
5855 100% {
5856 border-right-color: #4285F4;
5857 -webkit-transform: rotate(-130deg);
5858 transform: rotate(-130deg);
5859 }
5860 75% {
5861 border-right-color: #1B9A59;
5862 border-top-color: #1B9A59;
5863 }
5864 50% {
5865 border-right-color: #F7C223;
5866 border-top-color: #F7C223;
5867 -webkit-transform: rotate(5deg);
5868 transform: rotate(5deg);
5869 }
5870 25% {
5871 border-top-color: #DE3E35;
5872 border-right-color: #DE3E35;
5873 }
5874}
5875/* === Progressbar === */
5876.progressbar,
5877.progressbar-infinite {
5878 width: 100%;
5879 overflow: hidden;
5880 position: relative;
5881 display: block;
5882 -webkit-transform-style: preserve-3d;
5883 transform-style: preserve-3d;
5884}
5885body > .progressbar,
5886.view > .progressbar,
5887.views > .progressbar,
5888.page > .progressbar,
5889.panel > .progressbar,
5890.popup > .progressbar,
5891.framework7-root > .progressbar,
5892body > .progressbar-infinite,
5893.view > .progressbar-infinite,
5894.views > .progressbar-infinite,
5895.page > .progressbar-infinite,
5896.panel > .progressbar-infinite,
5897.popup > .progressbar-infinite,
5898.framework7-root > .progressbar-infinite {
5899 position: absolute;
5900 left: 0;
5901 top: 0;
5902 z-index: 15000;
5903 border-radius: 0 !important;
5904 -webkit-transform-origin: center top !important;
5905 transform-origin: center top !important;
5906}
5907.with-statusbar.device-ios body > .progressbar,
5908.with-statusbar.ios:not(.device-ios):not(.device-android) body > .progressbar,
5909.with-statusbar.device-ios .framework7-root > .progressbar,
5910.with-statusbar.ios:not(.device-ios):not(.device-android) .framework7-root > .progressbar,
5911.with-statusbar.device-ios body > .progressbar-infinite,
5912.with-statusbar.ios:not(.device-ios):not(.device-android) body > .progressbar-infinite,
5913.with-statusbar.device-ios .framework7-root > .progressbar-infinite,
5914.with-statusbar.ios:not(.device-ios):not(.device-android) .framework7-root > .progressbar-infinite {
5915 top: 20px;
5916}
5917.with-statusbar.device-android body > .progressbar,
5918.with-statusbar.md:not(.device-ios):not(.device-android) body > .progressbar,
5919.with-statusbar.device-android .framework7-root > .progressbar,
5920.with-statusbar.md:not(.device-ios):not(.device-android) .framework7-root > .progressbar,
5921.with-statusbar.device-android body > .progressbar-infinite,
5922.with-statusbar.md:not(.device-ios):not(.device-android) body > .progressbar-infinite,
5923.with-statusbar.device-android .framework7-root > .progressbar-infinite,
5924.with-statusbar.md:not(.device-ios):not(.device-android) .framework7-root > .progressbar-infinite {
5925 top: 24px;
5926}
5927.with-statusbar.device-iphone-x body > .progressbar,
5928.with-statusbar.device-iphone-x .framework7-root > .progressbar,
5929.with-statusbar.device-iphone-x body > .progressbar-infinite,
5930.with-statusbar.device-iphone-x .framework7-root > .progressbar-infinite {
5931 top: constant(safe-area-inset-top);
5932 top: env(safe-area-inset-top);
5933}
5934.progressbar {
5935 vertical-align: middle;
5936}
5937.progressbar span {
5938 width: 100%;
5939 height: 100%;
5940 position: absolute;
5941 left: 0;
5942 top: 0;
5943 -webkit-transform: translate3d(-100%, 0, 0);
5944 transform: translate3d(-100%, 0, 0);
5945 -webkit-transition-duration: 150ms;
5946 transition-duration: 150ms;
5947}
5948.progressbar-infinite:before,
5949.progressbar-infinite:after {
5950 position: absolute;
5951 left: 0;
5952 top: 0;
5953 width: 100%;
5954 height: 100%;
5955 -webkit-transform-origin: left center;
5956 transform-origin: left center;
5957 -webkit-transform: translate3d(0, 0, 0);
5958 transform: translate3d(0, 0, 0);
5959 display: block;
5960}
5961.progressbar-infinite.color-multi {
5962 background: none !important;
5963}
5964.progressbar-in {
5965 -webkit-animation: progressbar-in 150ms forwards;
5966 animation: progressbar-in 150ms forwards;
5967}
5968.progressbar-out {
5969 -webkit-animation: progressbar-out 150ms forwards;
5970 animation: progressbar-out 150ms forwards;
5971}
5972@-webkit-keyframes progressbar-in {
5973 from {
5974 opacity: 0;
5975 -webkit-transform: scaleY(0);
5976 transform: scaleY(0);
5977 }
5978 to {
5979 opacity: 1;
5980 -webkit-transform: scaleY(1);
5981 transform: scaleY(1);
5982 }
5983}
5984@keyframes progressbar-in {
5985 from {
5986 opacity: 0;
5987 -webkit-transform: scaleY(0);
5988 transform: scaleY(0);
5989 }
5990 to {
5991 opacity: 1;
5992 -webkit-transform: scaleY(1);
5993 transform: scaleY(1);
5994 }
5995}
5996@-webkit-keyframes progressbar-out {
5997 from {
5998 opacity: 1;
5999 -webkit-transform: scaleY(1);
6000 transform: scaleY(1);
6001 }
6002 to {
6003 opacity: 0;
6004 -webkit-transform: scaleY(0);
6005 transform: scaleY(0);
6006 }
6007}
6008@keyframes progressbar-out {
6009 from {
6010 opacity: 1;
6011 -webkit-transform: scaleY(1);
6012 transform: scaleY(1);
6013 }
6014 to {
6015 opacity: 0;
6016 -webkit-transform: scaleY(0);
6017 transform: scaleY(0);
6018 }
6019}
6020.md .progressbar,
6021.md .progressbar-infinite {
6022 height: 4px;
6023 background: rgba(33, 150, 243, 0.5);
6024 -webkit-transform-origin: center bottom;
6025 transform-origin: center bottom;
6026}
6027.md .progressbar span {
6028 background: #2196f3;
6029}
6030.md .progressbar-infinite {
6031 z-index: 15000;
6032}
6033.md .progressbar-infinite:before,
6034.md .progressbar-infinite:after {
6035 content: '';
6036 background: #2196f3;
6037}
6038.md .progressbar-infinite:before {
6039 -webkit-animation: md-progressbar-infinite-1 2s linear infinite;
6040 animation: md-progressbar-infinite-1 2s linear infinite;
6041}
6042.md .progressbar-infinite:after {
6043 -webkit-animation: md-progressbar-infinite-2 2s linear infinite;
6044 animation: md-progressbar-infinite-2 2s linear infinite;
6045}
6046.md .progressbar-infinite.color-multi:before {
6047 background: none;
6048 -webkit-animation: md-progressbar-infinite-multicolor-bg 3s step-end infinite;
6049 animation: md-progressbar-infinite-multicolor-bg 3s step-end infinite;
6050}
6051.md .progressbar-infinite.color-multi:after {
6052 background: none;
6053 -webkit-animation: md-progressbar-infinite-multicolor-fill 3s linear infinite;
6054 animation: md-progressbar-infinite-multicolor-fill 3s linear infinite;
6055 -webkit-transform-origin: center center;
6056 transform-origin: center center;
6057}
6058.md .color-theme-red .progressbar,
6059.md .color-theme-red .progressbar-infinite {
6060 background: rgba(244, 67, 54, 0.5);
6061}
6062.md .color-theme-red .progressbar span {
6063 background: #f44336;
6064}
6065.md .color-theme-red .progressbar-infinite:before,
6066.md .color-theme-red .progressbar-infinite:after {
6067 background: #f44336;
6068}
6069.md .color-theme-green .progressbar,
6070.md .color-theme-green .progressbar-infinite {
6071 background: rgba(76, 175, 80, 0.5);
6072}
6073.md .color-theme-green .progressbar span {
6074 background: #4caf50;
6075}
6076.md .color-theme-green .progressbar-infinite:before,
6077.md .color-theme-green .progressbar-infinite:after {
6078 background: #4caf50;
6079}
6080.md .color-theme-blue .progressbar,
6081.md .color-theme-blue .progressbar-infinite {
6082 background: rgba(33, 150, 243, 0.5);
6083}
6084.md .color-theme-blue .progressbar span {
6085 background: #2196f3;
6086}
6087.md .color-theme-blue .progressbar-infinite:before,
6088.md .color-theme-blue .progressbar-infinite:after {
6089 background: #2196f3;
6090}
6091.md .color-theme-pink .progressbar,
6092.md .color-theme-pink .progressbar-infinite {
6093 background: rgba(233, 30, 99, 0.5);
6094}
6095.md .color-theme-pink .progressbar span {
6096 background: #e91e63;
6097}
6098.md .color-theme-pink .progressbar-infinite:before,
6099.md .color-theme-pink .progressbar-infinite:after {
6100 background: #e91e63;
6101}
6102.md .color-theme-yellow .progressbar,
6103.md .color-theme-yellow .progressbar-infinite {
6104 background: rgba(255, 235, 59, 0.5);
6105}
6106.md .color-theme-yellow .progressbar span {
6107 background: #ffeb3b;
6108}
6109.md .color-theme-yellow .progressbar-infinite:before,
6110.md .color-theme-yellow .progressbar-infinite:after {
6111 background: #ffeb3b;
6112}
6113.md .color-theme-orange .progressbar,
6114.md .color-theme-orange .progressbar-infinite {
6115 background: rgba(255, 152, 0, 0.5);
6116}
6117.md .color-theme-orange .progressbar span {
6118 background: #ff9800;
6119}
6120.md .color-theme-orange .progressbar-infinite:before,
6121.md .color-theme-orange .progressbar-infinite:after {
6122 background: #ff9800;
6123}
6124.md .color-theme-gray .progressbar,
6125.md .color-theme-gray .progressbar-infinite {
6126 background: rgba(158, 158, 158, 0.5);
6127}
6128.md .color-theme-gray .progressbar span {
6129 background: #9e9e9e;
6130}
6131.md .color-theme-gray .progressbar-infinite:before,
6132.md .color-theme-gray .progressbar-infinite:after {
6133 background: #9e9e9e;
6134}
6135.md .color-theme-white .progressbar,
6136.md .color-theme-white .progressbar-infinite {
6137 background: rgba(255, 255, 255, 0.5);
6138}
6139.md .color-theme-white .progressbar span {
6140 background: #ffffff;
6141}
6142.md .color-theme-white .progressbar-infinite:before,
6143.md .color-theme-white .progressbar-infinite:after {
6144 background: #ffffff;
6145}
6146.md .color-theme-black .progressbar,
6147.md .color-theme-black .progressbar-infinite {
6148 background: rgba(0, 0, 0, 0.5);
6149}
6150.md .color-theme-black .progressbar span {
6151 background: #000000;
6152}
6153.md .color-theme-black .progressbar-infinite:before,
6154.md .color-theme-black .progressbar-infinite:after {
6155 background: #000000;
6156}
6157.md .progressbar.color-red,
6158.md .progressbar-infinite.color-red {
6159 background: rgba(244, 67, 54, 0.5);
6160}
6161.md .progressbar.color-red span {
6162 background: #f44336;
6163}
6164.md .progressbar-infinite.color-red:before,
6165.md .progressbar-infinite.color-red:after {
6166 background: #f44336;
6167}
6168.md .progressbar.color-green,
6169.md .progressbar-infinite.color-green {
6170 background: rgba(76, 175, 80, 0.5);
6171}
6172.md .progressbar.color-green span {
6173 background: #4caf50;
6174}
6175.md .progressbar-infinite.color-green:before,
6176.md .progressbar-infinite.color-green:after {
6177 background: #4caf50;
6178}
6179.md .progressbar.color-blue,
6180.md .progressbar-infinite.color-blue {
6181 background: rgba(33, 150, 243, 0.5);
6182}
6183.md .progressbar.color-blue span {
6184 background: #2196f3;
6185}
6186.md .progressbar-infinite.color-blue:before,
6187.md .progressbar-infinite.color-blue:after {
6188 background: #2196f3;
6189}
6190.md .progressbar.color-pink,
6191.md .progressbar-infinite.color-pink {
6192 background: rgba(233, 30, 99, 0.5);
6193}
6194.md .progressbar.color-pink span {
6195 background: #e91e63;
6196}
6197.md .progressbar-infinite.color-pink:before,
6198.md .progressbar-infinite.color-pink:after {
6199 background: #e91e63;
6200}
6201.md .progressbar.color-yellow,
6202.md .progressbar-infinite.color-yellow {
6203 background: rgba(255, 235, 59, 0.5);
6204}
6205.md .progressbar.color-yellow span {
6206 background: #ffeb3b;
6207}
6208.md .progressbar-infinite.color-yellow:before,
6209.md .progressbar-infinite.color-yellow:after {
6210 background: #ffeb3b;
6211}
6212.md .progressbar.color-orange,
6213.md .progressbar-infinite.color-orange {
6214 background: rgba(255, 152, 0, 0.5);
6215}
6216.md .progressbar.color-orange span {
6217 background: #ff9800;
6218}
6219.md .progressbar-infinite.color-orange:before,
6220.md .progressbar-infinite.color-orange:after {
6221 background: #ff9800;
6222}
6223.md .progressbar.color-gray,
6224.md .progressbar-infinite.color-gray {
6225 background: rgba(158, 158, 158, 0.5);
6226}
6227.md .progressbar.color-gray span {
6228 background: #9e9e9e;
6229}
6230.md .progressbar-infinite.color-gray:before,
6231.md .progressbar-infinite.color-gray:after {
6232 background: #9e9e9e;
6233}
6234.md .progressbar.color-white,
6235.md .progressbar-infinite.color-white {
6236 background: rgba(255, 255, 255, 0.5);
6237}
6238.md .progressbar.color-white span {
6239 background: #ffffff;
6240}
6241.md .progressbar-infinite.color-white:before,
6242.md .progressbar-infinite.color-white:after {
6243 background: #ffffff;
6244}
6245.md .progressbar.color-black,
6246.md .progressbar-infinite.color-black {
6247 background: rgba(0, 0, 0, 0.5);
6248}
6249.md .progressbar.color-black span {
6250 background: #000000;
6251}
6252.md .progressbar-infinite.color-black:before,
6253.md .progressbar-infinite.color-black:after {
6254 background: #000000;
6255}
6256@-webkit-keyframes md-progressbar-infinite-1 {
6257 0% {
6258 -webkit-transform: translateX(-10%) scaleX(0.1);
6259 transform: translateX(-10%) scaleX(0.1);
6260 }
6261 25% {
6262 -webkit-transform: translateX(30%) scaleX(0.6);
6263 transform: translateX(30%) scaleX(0.6);
6264 }
6265 50% {
6266 -webkit-transform: translateX(100%) scaleX(1);
6267 transform: translateX(100%) scaleX(1);
6268 }
6269 100% {
6270 -webkit-transform: translateX(100%) scaleX(1);
6271 transform: translateX(100%) scaleX(1);
6272 }
6273}
6274@keyframes md-progressbar-infinite-1 {
6275 0% {
6276 -webkit-transform: translateX(-10%) scaleX(0.1);
6277 transform: translateX(-10%) scaleX(0.1);
6278 }
6279 25% {
6280 -webkit-transform: translateX(30%) scaleX(0.6);
6281 transform: translateX(30%) scaleX(0.6);
6282 }
6283 50% {
6284 -webkit-transform: translateX(100%) scaleX(1);
6285 transform: translateX(100%) scaleX(1);
6286 }
6287 100% {
6288 -webkit-transform: translateX(100%) scaleX(1);
6289 transform: translateX(100%) scaleX(1);
6290 }
6291}
6292@-webkit-keyframes md-progressbar-infinite-2 {
6293 0% {
6294 -webkit-transform: translateX(-100%) scaleX(1);
6295 transform: translateX(-100%) scaleX(1);
6296 }
6297 40% {
6298 -webkit-transform: translateX(-100%) scaleX(1);
6299 transform: translateX(-100%) scaleX(1);
6300 }
6301 75% {
6302 -webkit-transform: translateX(60%) scaleX(0.35);
6303 transform: translateX(60%) scaleX(0.35);
6304 }
6305 90% {
6306 -webkit-transform: translateX(100%) scaleX(0.1);
6307 transform: translateX(100%) scaleX(0.1);
6308 }
6309 100% {
6310 -webkit-transform: translateX(100%) scaleX(0.1);
6311 transform: translateX(100%) scaleX(0.1);
6312 }
6313}
6314@keyframes md-progressbar-infinite-2 {
6315 0% {
6316 -webkit-transform: translateX(-100%) scaleX(1);
6317 transform: translateX(-100%) scaleX(1);
6318 }
6319 40% {
6320 -webkit-transform: translateX(-100%) scaleX(1);
6321 transform: translateX(-100%) scaleX(1);
6322 }
6323 75% {
6324 -webkit-transform: translateX(60%) scaleX(0.35);
6325 transform: translateX(60%) scaleX(0.35);
6326 }
6327 90% {
6328 -webkit-transform: translateX(100%) scaleX(0.1);
6329 transform: translateX(100%) scaleX(0.1);
6330 }
6331 100% {
6332 -webkit-transform: translateX(100%) scaleX(0.1);
6333 transform: translateX(100%) scaleX(0.1);
6334 }
6335}
6336@-webkit-keyframes md-progressbar-infinite-multicolor-bg {
6337 0% {
6338 background-color: #4caf50;
6339 }
6340 25% {
6341 background-color: #f44336;
6342 }
6343 50% {
6344 background-color: #2196f3;
6345 }
6346 75% {
6347 background-color: #ffeb3b;
6348 }
6349}
6350@keyframes md-progressbar-infinite-multicolor-bg {
6351 0% {
6352 background-color: #4caf50;
6353 }
6354 25% {
6355 background-color: #f44336;
6356 }
6357 50% {
6358 background-color: #2196f3;
6359 }
6360 75% {
6361 background-color: #ffeb3b;
6362 }
6363}
6364@-webkit-keyframes md-progressbar-infinite-multicolor-fill {
6365 0% {
6366 -webkit-transform: scaleX(0);
6367 transform: scaleX(0);
6368 background-color: #f44336;
6369 }
6370 24.9% {
6371 -webkit-transform: scaleX(1);
6372 transform: scaleX(1);
6373 background-color: #f44336;
6374 }
6375 25% {
6376 -webkit-transform: scaleX(0);
6377 transform: scaleX(0);
6378 background-color: #2196f3;
6379 }
6380 49.9% {
6381 -webkit-transform: scaleX(1);
6382 transform: scaleX(1);
6383 background-color: #2196f3;
6384 }
6385 50% {
6386 -webkit-transform: scaleX(0);
6387 transform: scaleX(0);
6388 background-color: #ffeb3b;
6389 }
6390 74.9% {
6391 -webkit-transform: scaleX(1);
6392 transform: scaleX(1);
6393 background-color: #ffeb3b;
6394 }
6395 75% {
6396 -webkit-transform: scaleX(0);
6397 transform: scaleX(0);
6398 background-color: #4caf50;
6399 }
6400 100% {
6401 -webkit-transform: scaleX(1);
6402 transform: scaleX(1);
6403 background-color: #4caf50;
6404 }
6405}
6406@keyframes md-progressbar-infinite-multicolor-fill {
6407 0% {
6408 -webkit-transform: scaleX(0);
6409 transform: scaleX(0);
6410 background-color: #f44336;
6411 }
6412 24.9% {
6413 -webkit-transform: scaleX(1);
6414 transform: scaleX(1);
6415 background-color: #f44336;
6416 }
6417 25% {
6418 -webkit-transform: scaleX(0);
6419 transform: scaleX(0);
6420 background-color: #2196f3;
6421 }
6422 49.9% {
6423 -webkit-transform: scaleX(1);
6424 transform: scaleX(1);
6425 background-color: #2196f3;
6426 }
6427 50% {
6428 -webkit-transform: scaleX(0);
6429 transform: scaleX(0);
6430 background-color: #ffeb3b;
6431 }
6432 74.9% {
6433 -webkit-transform: scaleX(1);
6434 transform: scaleX(1);
6435 background-color: #ffeb3b;
6436 }
6437 75% {
6438 -webkit-transform: scaleX(0);
6439 transform: scaleX(0);
6440 background-color: #4caf50;
6441 }
6442 100% {
6443 -webkit-transform: scaleX(1);
6444 transform: scaleX(1);
6445 background-color: #4caf50;
6446 }
6447}
6448/* === Sortable === */
6449.sortable .sortable-handler {
6450 position: absolute;
6451 top: 0;
6452 bottom: 1px;
6453 z-index: 10;
6454 background-repeat: no-repeat;
6455 background-size: 18px 12px;
6456 opacity: 0;
6457 pointer-events: none;
6458 cursor: move;
6459 -webkit-transition-duration: 300ms;
6460 transition-duration: 300ms;
6461 left: 0;
6462 background-position: 0% 50%;
6463}
6464.sortable .item-inner {
6465 -webkit-transition-duration: 300ms;
6466 transition-duration: 300ms;
6467}
6468.sortable li.sorting {
6469 z-index: 50;
6470 background: rgba(255, 255, 255, 0.8);
6471 -webkit-transition-duration: 0ms;
6472 transition-duration: 0ms;
6473}
6474.sortable li.sorting .item-inner:after {
6475 display: none !important;
6476}
6477.sortable-sorting li {
6478 -webkit-transition-duration: 300ms;
6479 transition-duration: 300ms;
6480}
6481.sortable-enabled .sortable-handler {
6482 pointer-events: auto;
6483 opacity: 1;
6484 background-position: 50% 50%;
6485}
6486.sortable-enabled .item-link .item-inner,
6487.sortable-enabled .item-link .item-title-row {
6488 background-image: none !important;
6489}
6490.theme-dark .sortable li.sorting,
6491.sortable.theme-dark li.sorting {
6492 background-color: rgba(50, 50, 50, 0.8);
6493}
6494.md .sortable-handler {
6495 width: 50px;
6496 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");
6497}
6498.md .sortable li.sorting {
6499 -webkit-box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23);
6500 box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23);
6501}
6502.md .sortable-enabled .item-inner,
6503.md .sortable-enabled .item-link .item-inner {
6504 padding-left: 50px;
6505}
6506.md .list.sortable-enabled .item-link.no-chevron .item-inner,
6507.md .list.sortable-enabled.no-chevron .item-link .item-inner,
6508.md .list.sortable-enabled .no-chevron .item-link .item-inner,
6509.md .no-chevron .list.sortable-enabled .item-link .item-inner {
6510 padding-left: 50px;
6511}
6512@media (orientation: landscape) {
6513 .md.device-iphone-x .ios-left-edge .sortable-handler,
6514 .md.device-iphone-x .ios-edges .sortable-handler,
6515 .md.device-iphone-x .popup .sortable-handler,
6516 .md.device-iphone-x .sheet-modal .sortable-handler,
6517 .md.device-iphone-x .panel-left .sortable-handler {
6518 left: constant(safe-area-inset-left);
6519 left: env(safe-area-inset-left);
6520 }
6521 .md.device-iphone-x .ios-left-edge .sortable-enabled:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) .item-inner,
6522 .md.device-iphone-x .ios-edges .sortable-enabled:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) .item-inner,
6523 .md.device-iphone-x .popup .sortable-enabled:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) .item-inner,
6524 .md.device-iphone-x .sheet-modal .sortable-enabled:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) .item-inner,
6525 .md.device-iphone-x .panel-left .sortable-enabled:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) .item-inner,
6526 .md.device-iphone-x .ios-left-edge .sortable-enabled:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) .item-link .item-inner,
6527 .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,
6528 .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,
6529 .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,
6530 .md.device-iphone-x .panel-left .sortable-enabled:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) .item-link .item-inner {
6531 padding-left: calc(42px + constant(safe-area-inset-right));
6532 padding-left: calc(42px + env(safe-area-inset-right));
6533 }
6534}
6535/* === Swipeout === */
6536.swipeout {
6537 overflow: hidden;
6538 -webkit-transform-style: preserve-3d;
6539 transform-style: preserve-3d;
6540}
6541.swipeout-deleting {
6542 -webkit-transition-duration: 300ms;
6543 transition-duration: 300ms;
6544}
6545.swipeout-deleting .swipeout-content {
6546 -webkit-transform: translateX(-100%);
6547 transform: translateX(-100%);
6548}
6549.swipeout-transitioning .swipeout-content,
6550.swipeout-transitioning .swipeout-actions-right a,
6551.swipeout-transitioning .swipeout-actions-left a,
6552.swipeout-transitioning .swipeout-overswipe {
6553 -webkit-transition-duration: 300ms;
6554 transition-duration: 300ms;
6555 -webkit-transition-property: left, -webkit-transform;
6556 transition-property: left, -webkit-transform;
6557 transition-property: transform, left;
6558 transition-property: transform, left, -webkit-transform;
6559}
6560.swipeout-content {
6561 position: relative;
6562 z-index: 10;
6563}
6564.swipeout-overswipe {
6565 -webkit-transition-duration: 200ms;
6566 transition-duration: 200ms;
6567 -webkit-transition-property: left;
6568 transition-property: left;
6569}
6570.swipeout-actions-left,
6571.swipeout-actions-right {
6572 position: absolute;
6573 top: 0;
6574 height: 100%;
6575 display: -webkit-box;
6576 display: -webkit-flex;
6577 display: -ms-flexbox;
6578 display: flex;
6579 direction: ltr;
6580}
6581.swipeout-actions-left > a,
6582.swipeout-actions-right > a,
6583.swipeout-actions-left > button,
6584.swipeout-actions-right > button,
6585.swipeout-actions-left > span,
6586.swipeout-actions-right > span,
6587.swipeout-actions-left > div,
6588.swipeout-actions-right > div {
6589 color: #fff;
6590 background: #c7c7cc;
6591 display: -webkit-box;
6592 display: -webkit-flex;
6593 display: -ms-flexbox;
6594 display: flex;
6595 -webkit-box-align: center;
6596 -webkit-align-items: center;
6597 -ms-flex-align: center;
6598 align-items: center;
6599 position: relative;
6600 left: 0;
6601}
6602.swipeout-actions-left > a:after,
6603.swipeout-actions-right > a:after,
6604.swipeout-actions-left > button:after,
6605.swipeout-actions-right > button:after,
6606.swipeout-actions-left > span:after,
6607.swipeout-actions-right > span:after,
6608.swipeout-actions-left > div:after,
6609.swipeout-actions-right > div:after {
6610 content: '';
6611 position: absolute;
6612 top: 0;
6613 width: 600%;
6614 height: 100%;
6615 background: inherit;
6616 z-index: -1;
6617 -webkit-transform: translate3d(0, 0, 0);
6618 transform: translate3d(0, 0, 0);
6619 pointer-events: none;
6620}
6621.swipeout-actions-right {
6622 right: 0%;
6623 -webkit-transform: translateX(100%);
6624 transform: translateX(100%);
6625}
6626.swipeout-actions-right > a:after,
6627.swipeout-actions-right > button:after,
6628.swipeout-actions-right > span:after,
6629.swipeout-actions-right > div:after {
6630 left: 100%;
6631 margin-left: -1px;
6632}
6633.swipeout-actions-left {
6634 left: 0%;
6635 -webkit-transform: translateX(-100%);
6636 transform: translateX(-100%);
6637}
6638.swipeout-actions-left > a:after,
6639.swipeout-actions-left > button:after,
6640.swipeout-actions-left > span:after,
6641.swipeout-actions-left > div:after {
6642 right: 100%;
6643 margin-right: -1px;
6644}
6645.md .swipeout-actions-left > a,
6646.md .swipeout-actions-right > a,
6647.md .swipeout-actions-left > button,
6648.md .swipeout-actions-right > button,
6649.md .swipeout-actions-left > span,
6650.md .swipeout-actions-right > span,
6651.md .swipeout-actions-left > div,
6652.md .swipeout-actions-right > div {
6653 padding: 0 24px;
6654 color: #fff;
6655}
6656.md .swipeout-actions-left .swipeout-delete,
6657.md .swipeout-actions-right .swipeout-delete {
6658 background: #f44336;
6659}
6660.md .swipeout-actions-left > a.color-red,
6661.md .swipeout-actions-right > a.color-red,
6662.md .swipeout-actions-left > button.color-red,
6663.md .swipeout-actions-right > button.color-red,
6664.md .swipeout-actions-left > span.color-red,
6665.md .swipeout-actions-right > span.color-red,
6666.md .swipeout-actions-left > div.color-red,
6667.md .swipeout-actions-right > div.color-red {
6668 background-color: #f44336;
6669}
6670.md .swipeout-actions-left > a.color-green,
6671.md .swipeout-actions-right > a.color-green,
6672.md .swipeout-actions-left > button.color-green,
6673.md .swipeout-actions-right > button.color-green,
6674.md .swipeout-actions-left > span.color-green,
6675.md .swipeout-actions-right > span.color-green,
6676.md .swipeout-actions-left > div.color-green,
6677.md .swipeout-actions-right > div.color-green {
6678 background-color: #4caf50;
6679}
6680.md .swipeout-actions-left > a.color-blue,
6681.md .swipeout-actions-right > a.color-blue,
6682.md .swipeout-actions-left > button.color-blue,
6683.md .swipeout-actions-right > button.color-blue,
6684.md .swipeout-actions-left > span.color-blue,
6685.md .swipeout-actions-right > span.color-blue,
6686.md .swipeout-actions-left > div.color-blue,
6687.md .swipeout-actions-right > div.color-blue {
6688 background-color: #2196f3;
6689}
6690.md .swipeout-actions-left > a.color-pink,
6691.md .swipeout-actions-right > a.color-pink,
6692.md .swipeout-actions-left > button.color-pink,
6693.md .swipeout-actions-right > button.color-pink,
6694.md .swipeout-actions-left > span.color-pink,
6695.md .swipeout-actions-right > span.color-pink,
6696.md .swipeout-actions-left > div.color-pink,
6697.md .swipeout-actions-right > div.color-pink {
6698 background-color: #e91e63;
6699}
6700.md .swipeout-actions-left > a.color-yellow,
6701.md .swipeout-actions-right > a.color-yellow,
6702.md .swipeout-actions-left > button.color-yellow,
6703.md .swipeout-actions-right > button.color-yellow,
6704.md .swipeout-actions-left > span.color-yellow,
6705.md .swipeout-actions-right > span.color-yellow,
6706.md .swipeout-actions-left > div.color-yellow,
6707.md .swipeout-actions-right > div.color-yellow {
6708 background-color: #ffeb3b;
6709}
6710.md .swipeout-actions-left > a.color-orange,
6711.md .swipeout-actions-right > a.color-orange,
6712.md .swipeout-actions-left > button.color-orange,
6713.md .swipeout-actions-right > button.color-orange,
6714.md .swipeout-actions-left > span.color-orange,
6715.md .swipeout-actions-right > span.color-orange,
6716.md .swipeout-actions-left > div.color-orange,
6717.md .swipeout-actions-right > div.color-orange {
6718 background-color: #ff9800;
6719}
6720.md .swipeout-actions-left > a.color-gray,
6721.md .swipeout-actions-right > a.color-gray,
6722.md .swipeout-actions-left > button.color-gray,
6723.md .swipeout-actions-right > button.color-gray,
6724.md .swipeout-actions-left > span.color-gray,
6725.md .swipeout-actions-right > span.color-gray,
6726.md .swipeout-actions-left > div.color-gray,
6727.md .swipeout-actions-right > div.color-gray {
6728 background-color: #9e9e9e;
6729}
6730.md .swipeout-actions-left > a.color-white,
6731.md .swipeout-actions-right > a.color-white,
6732.md .swipeout-actions-left > button.color-white,
6733.md .swipeout-actions-right > button.color-white,
6734.md .swipeout-actions-left > span.color-white,
6735.md .swipeout-actions-right > span.color-white,
6736.md .swipeout-actions-left > div.color-white,
6737.md .swipeout-actions-right > div.color-white {
6738 background-color: #ffffff;
6739}
6740.md .swipeout-actions-left > a.color-black,
6741.md .swipeout-actions-right > a.color-black,
6742.md .swipeout-actions-left > button.color-black,
6743.md .swipeout-actions-right > button.color-black,
6744.md .swipeout-actions-left > span.color-black,
6745.md .swipeout-actions-right > span.color-black,
6746.md .swipeout-actions-left > div.color-black,
6747.md .swipeout-actions-right > div.color-black {
6748 background-color: #000000;
6749}
6750/* === Accordion === */
6751.accordion-item-toggle {
6752 cursor: pointer;
6753 -webkit-transition-duration: 300ms;
6754 transition-duration: 300ms;
6755}
6756.accordion-item-toggle.active-state {
6757 -webkit-transition-duration: 300ms;
6758 transition-duration: 300ms;
6759}
6760.accordion-item-toggle.active-state > .item-inner:after {
6761 background-color: transparent;
6762}
6763.accordion-item-toggle .item-inner {
6764 -webkit-transition-duration: 300ms;
6765 transition-duration: 300ms;
6766 -webkit-transition-property: background-color;
6767 transition-property: background-color;
6768}
6769.accordion-item-toggle .item-inner:after {
6770 -webkit-transition-duration: 300ms;
6771 transition-duration: 300ms;
6772}
6773.accordion-item .item-link .item-inner:after {
6774 -webkit-transition-duration: 300ms;
6775 transition-duration: 300ms;
6776}
6777.accordion-item .list,
6778.accordion-item .block {
6779 margin-top: 0;
6780 margin-bottom: 0;
6781}
6782.accordion-item .block > h1:first-child,
6783.accordion-item .block > h2:first-child,
6784.accordion-item .block > h3:first-child,
6785.accordion-item .block > h4:first-child,
6786.accordion-item .block > p:first-child {
6787 margin-top: 10px;
6788}
6789.accordion-item .block > h1:last-child,
6790.accordion-item .block > h2:last-child,
6791.accordion-item .block > h3:last-child,
6792.accordion-item .block > h4:last-child,
6793.accordion-item .block > p:last-child {
6794 margin-bottom: 10px;
6795}
6796.accordion-item-opened .accordion-item-toggle .item-inner:after,
6797.accordion-item-opened > .item-link .item-inner:after {
6798 background-color: transparent;
6799}
6800.list li.accordion-item ul {
6801 padding-right: 0;
6802}
6803.accordion-item-content {
6804 position: relative;
6805 overflow: hidden;
6806 height: 0;
6807 font-size: 14px;
6808 -webkit-transition-duration: 300ms;
6809 transition-duration: 300ms;
6810}
6811.accordion-item-opened > .accordion-item-content {
6812 height: auto;
6813}
6814html.device-android-4 .accordion-item-content {
6815 -webkit-transform: none;
6816 transform: none;
6817}
6818.md .list .accordion-item-toggle .item-inner {
6819 padding-left: 42px;
6820 background-repeat: no-repeat;
6821 background-position: 16px center;
6822}
6823.md .list .accordion-item-toggle.active-state {
6824 background-color: rgba(0, 0, 0, 0.1);
6825}
6826.md .list .accordion-item-toggle .item-inner,
6827.md .list:not(.media-list) .accordion-item:not(.media-item) .accordion-item-toggle .item-inner,
6828.md .list:not(.media-list) .accordion-item:not(.media-item) > .item-link .item-inner,
6829.md .media-list .accordion-item .accordion-item-toggle .item-title-row,
6830.md .media-list .accordion-item > .item-link .item-title-row,
6831.md .accordion-item.media-item .accordion-item-toggle .item-title-row,
6832.md .accordion-item.media-item > .item-link .item-title-row,
6833.md .links-list .accordion-item > a {
6834 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");
6835 background-size: 13px 13px;
6836}
6837.md .list .accordion-item-toggle.accordion-item-opened .item-inner,
6838.md .list:not(.media-list) .accordion-item-opened:not(.media-item) .accordion-item-toggle .item-inner,
6839.md .list:not(.media-list) .accordion-item-opened:not(.media-item) > .item-link .item-inner,
6840.md .media-list .accordion-item-opened .accordion-item-toggle .item-title-row,
6841.md .media-list .accordion-item-opened > .item-link .item-title-row,
6842.md .accordion-item-opened.media-item .accordion-item-toggle .item-title-row,
6843.md .accordion-item-opened.media-item > .item-link .item-title-row,
6844.md .links-list .accordion-item-opened > a {
6845 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");
6846}
6847.md .theme-dark .list .accordion-item-toggle .item-inner,
6848.md .theme-dark .list:not(.media-list) .accordion-item:not(.media-item) .accordion-item-toggle .item-inner,
6849.md .theme-dark .list:not(.media-list) .accordion-item:not(.media-item) > .item-link .item-inner,
6850.md .theme-dark .media-list .accordion-item .accordion-item-toggle .item-title-row,
6851.md .theme-dark .media-list .accordion-item > .item-link .item-title-row,
6852.md .theme-dark .accordion-item.media-item .accordion-item-toggle .item-title-row,
6853.md .theme-dark .accordion-item.media-item > .item-link .item-title-row,
6854.md .theme-dark .links-list .accordion-item > a {
6855 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");
6856}
6857.md .theme-dark .list .accordion-item-toggle.accordion-item-opened .item-inner,
6858.md .theme-dark .list:not(.media-list) .accordion-item-opened:not(.media-item) .accordion-item-toggle .item-inner,
6859.md .theme-dark .list:not(.media-list) .accordion-item-opened:not(.media-item) > .item-link .item-inner,
6860.md .theme-dark .media-list .accordion-item-opened .accordion-item-toggle .item-title-row,
6861.md .theme-dark .media-list .accordion-item-opened > .item-link .item-title-row,
6862.md .theme-dark .accordion-item-opened.media-item .accordion-item-toggle .item-title-row,
6863.md .theme-dark .accordion-item-opened.media-item > .item-link .item-title-row,
6864.md .theme-dark .links-list .accordion-item-opened > a {
6865 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");
6866}
6867/* === Contacts === */
6868.contacts-list .list-group:first-child ul:before {
6869 display: none !important;
6870}
6871.contacts-list .list-group:last-child ul:after {
6872 display: none !important;
6873}
6874.md .contacts-list {
6875 margin: 0;
6876}
6877.md .contacts-list .list-group-title {
6878 padding: 0 16px;
6879 pointer-events: none;
6880 background: none;
6881 color: #2196f3;
6882 font-weight: 500;
6883 line-height: 48px;
6884 height: 48px;
6885 font-size: 20px;
6886 overflow: visible;
6887 width: 56px;
6888}
6889.md .contacts-list .list-group-title + li {
6890 margin-top: -48px;
6891}
6892.md .contacts-list li:not(.list-group-title) {
6893 padding-right: 56px;
6894}
6895.md .theme-dark .contacts-list .list-group-title {
6896 color: #fff;
6897}
6898/* === Virtual List === */
6899/* === Indexed List === */
6900.list-index {
6901 position: absolute;
6902 top: 0;
6903 bottom: 0;
6904 right: 0;
6905 text-align: center;
6906 z-index: 10;
6907 width: 16px;
6908 cursor: pointer;
6909 -webkit-user-select: none;
6910 -moz-user-select: none;
6911 -ms-user-select: none;
6912 user-select: none;
6913}
6914.list-index:before {
6915 content: '';
6916 position: absolute;
6917 width: 20px;
6918 top: 0;
6919 right: 100%;
6920 height: 100%;
6921}
6922.list-index ul {
6923 font-size: 11px;
6924 font-weight: 600;
6925 list-style: none;
6926 margin: 0;
6927 padding: 0;
6928 display: -webkit-box;
6929 display: -webkit-flex;
6930 display: -ms-flexbox;
6931 display: flex;
6932 -webkit-box-orient: vertical;
6933 -webkit-box-direction: normal;
6934 -webkit-flex-direction: column;
6935 -ms-flex-direction: column;
6936 flex-direction: column;
6937 -webkit-box-pack: center;
6938 -webkit-justify-content: center;
6939 -ms-flex-pack: center;
6940 justify-content: center;
6941 -webkit-box-align: center;
6942 -webkit-align-items: center;
6943 -ms-flex-align: center;
6944 align-items: center;
6945 -webkit-flex-shrink: 0;
6946 -ms-flex-negative: 0;
6947 flex-shrink: 0;
6948 height: 100%;
6949 width: 100%;
6950 position: relative;
6951}
6952.list-index li {
6953 margin: 0;
6954 padding: 0;
6955 list-style: none;
6956 position: relative;
6957 height: 14px;
6958 line-height: 14px;
6959 -webkit-flex-shrink: 0;
6960 -ms-flex-negative: 0;
6961 flex-shrink: 0;
6962 display: block;
6963 width: 100%;
6964}
6965.list-index .list-index-skip-placeholder:after {
6966 content: '';
6967 position: absolute;
6968 left: 50%;
6969 top: 50%;
6970 border-radius: 50%;
6971}
6972.list-index .list-index-label {
6973 position: absolute;
6974 bottom: 0;
6975 right: 100%;
6976 text-align: center;
6977 border-radius: 50%;
6978 color: #fff;
6979 font-weight: 500;
6980}
6981.md .list-index ul {
6982 color: #2196f3;
6983}
6984.md .list-index .list-index-skip-placeholder:after {
6985 content: '';
6986 width: 4px;
6987 height: 4px;
6988 margin-left: -2px;
6989 margin-top: -2px;
6990 background: #2196f3;
6991}
6992.md .list-index .list-index-label {
6993 width: 56px;
6994 height: 56px;
6995 line-height: 56px;
6996 border-radius: 50% 50% 0 50%;
6997 background: #2196f3;
6998 font-size: 20px;
6999}
7000.md .navbar ~ .list-index {
7001 top: 56px;
7002}
7003@media (min-width: 768px) {
7004 .md .navbar ~ .list-index {
7005 top: 64px;
7006 }
7007}
7008.md .navbar ~ .toolbar:not(.toolbar-bottom-md) ~ .list-index,
7009.md .navbar ~ .subnavbar ~ .list-index,
7010.md .page-with-subnavbar .navbar ~ .list-index {
7011 top: 104px;
7012}
7013.md .navbar ~ .tabbar-labels:not(.toolbar-bottom-md) ~ .list-index {
7014 top: 128px;
7015}
7016.md .toolbar-bottom-md ~ .page > .list-index,
7017.md .toolbar-bottom-md ~ * .page > .list-index,
7018.md .toolbar-bottom-md ~ * .page > .list-index {
7019 bottom: 48px;
7020}
7021.md .tabbar-labels.toolbar-bottom-md ~ .page > .list-index,
7022.md .tabbar-labels.toolbar-bottom-md ~ * .page > .list-index,
7023.md .tabbar-labels.toolbar-bottom-md ~ .list-index {
7024 bottom: 56px;
7025}
7026.md.device-iphone-x .toolbar-bottom-md ~ .page > .list-index,
7027.md.device-iphone-x .toolbar-bottom-md ~ * .page > .list-index,
7028.md.device-iphone-x .toolbar-bottom-md ~ * .page > .list-index {
7029 bottom: calc(48px + constant(safe-area-inset-bottom));
7030 bottom: calc(48px + env(safe-area-inset-bottom));
7031}
7032.md.device-iphone-x .tabbar-labels.toolbar-bottom-md ~ .page > .list-index,
7033.md.device-iphone-x .tabbar-labels.toolbar-bottom-md ~ * .page > .list-index,
7034.md.device-iphone-x .tabbar-labels.toolbar-bottom-md ~ .list-index {
7035 bottom: calc(56px + constant(safe-area-inset-bottom));
7036 bottom: calc(56px + env(safe-area-inset-bottom));
7037}
7038.md .color-theme-red .list-index ul,
7039.md .list-index.color-theme-red ul {
7040 color: #f44336;
7041}
7042.md .color-theme-red .list-index .list-index-skip-placeholder:after,
7043.md .list-index.color-theme-red .list-index-skip-placeholder:after,
7044.md .color-theme-red .list-index .list-index-label,
7045.md .list-index.color-theme-red .list-index-label {
7046 background-color: #f44336;
7047}
7048.md .color-theme-green .list-index ul,
7049.md .list-index.color-theme-green ul {
7050 color: #4caf50;
7051}
7052.md .color-theme-green .list-index .list-index-skip-placeholder:after,
7053.md .list-index.color-theme-green .list-index-skip-placeholder:after,
7054.md .color-theme-green .list-index .list-index-label,
7055.md .list-index.color-theme-green .list-index-label {
7056 background-color: #4caf50;
7057}
7058.md .color-theme-blue .list-index ul,
7059.md .list-index.color-theme-blue ul {
7060 color: #2196f3;
7061}
7062.md .color-theme-blue .list-index .list-index-skip-placeholder:after,
7063.md .list-index.color-theme-blue .list-index-skip-placeholder:after,
7064.md .color-theme-blue .list-index .list-index-label,
7065.md .list-index.color-theme-blue .list-index-label {
7066 background-color: #2196f3;
7067}
7068.md .color-theme-pink .list-index ul,
7069.md .list-index.color-theme-pink ul {
7070 color: #e91e63;
7071}
7072.md .color-theme-pink .list-index .list-index-skip-placeholder:after,
7073.md .list-index.color-theme-pink .list-index-skip-placeholder:after,
7074.md .color-theme-pink .list-index .list-index-label,
7075.md .list-index.color-theme-pink .list-index-label {
7076 background-color: #e91e63;
7077}
7078.md .color-theme-yellow .list-index ul,
7079.md .list-index.color-theme-yellow ul {
7080 color: #ffeb3b;
7081}
7082.md .color-theme-yellow .list-index .list-index-skip-placeholder:after,
7083.md .list-index.color-theme-yellow .list-index-skip-placeholder:after,
7084.md .color-theme-yellow .list-index .list-index-label,
7085.md .list-index.color-theme-yellow .list-index-label {
7086 background-color: #ffeb3b;
7087}
7088.md .color-theme-orange .list-index ul,
7089.md .list-index.color-theme-orange ul {
7090 color: #ff9800;
7091}
7092.md .color-theme-orange .list-index .list-index-skip-placeholder:after,
7093.md .list-index.color-theme-orange .list-index-skip-placeholder:after,
7094.md .color-theme-orange .list-index .list-index-label,
7095.md .list-index.color-theme-orange .list-index-label {
7096 background-color: #ff9800;
7097}
7098.md .color-theme-gray .list-index ul,
7099.md .list-index.color-theme-gray ul {
7100 color: #9e9e9e;
7101}
7102.md .color-theme-gray .list-index .list-index-skip-placeholder:after,
7103.md .list-index.color-theme-gray .list-index-skip-placeholder:after,
7104.md .color-theme-gray .list-index .list-index-label,
7105.md .list-index.color-theme-gray .list-index-label {
7106 background-color: #9e9e9e;
7107}
7108.md .color-theme-white .list-index ul,
7109.md .list-index.color-theme-white ul {
7110 color: #ffffff;
7111}
7112.md .color-theme-white .list-index .list-index-skip-placeholder:after,
7113.md .list-index.color-theme-white .list-index-skip-placeholder:after,
7114.md .color-theme-white .list-index .list-index-label,
7115.md .list-index.color-theme-white .list-index-label {
7116 background-color: #ffffff;
7117}
7118.md .color-theme-black .list-index ul,
7119.md .list-index.color-theme-black ul {
7120 color: #000000;
7121}
7122.md .color-theme-black .list-index .list-index-skip-placeholder:after,
7123.md .list-index.color-theme-black .list-index-skip-placeholder:after,
7124.md .color-theme-black .list-index .list-index-label,
7125.md .list-index.color-theme-black .list-index-label {
7126 background-color: #000000;
7127}
7128.md .list-index.color-red ul {
7129 color: #f44336;
7130}
7131.md .list-index.color-red .list-index-skip-placeholder:after,
7132.md .list-index.color-red .list-index-label {
7133 background-color: #f44336;
7134}
7135.md .list-index.color-green ul {
7136 color: #4caf50;
7137}
7138.md .list-index.color-green .list-index-skip-placeholder:after,
7139.md .list-index.color-green .list-index-label {
7140 background-color: #4caf50;
7141}
7142.md .list-index.color-blue ul {
7143 color: #2196f3;
7144}
7145.md .list-index.color-blue .list-index-skip-placeholder:after,
7146.md .list-index.color-blue .list-index-label {
7147 background-color: #2196f3;
7148}
7149.md .list-index.color-pink ul {
7150 color: #e91e63;
7151}
7152.md .list-index.color-pink .list-index-skip-placeholder:after,
7153.md .list-index.color-pink .list-index-label {
7154 background-color: #e91e63;
7155}
7156.md .list-index.color-yellow ul {
7157 color: #ffeb3b;
7158}
7159.md .list-index.color-yellow .list-index-skip-placeholder:after,
7160.md .list-index.color-yellow .list-index-label {
7161 background-color: #ffeb3b;
7162}
7163.md .list-index.color-orange ul {
7164 color: #ff9800;
7165}
7166.md .list-index.color-orange .list-index-skip-placeholder:after,
7167.md .list-index.color-orange .list-index-label {
7168 background-color: #ff9800;
7169}
7170.md .list-index.color-gray ul {
7171 color: #9e9e9e;
7172}
7173.md .list-index.color-gray .list-index-skip-placeholder:after,
7174.md .list-index.color-gray .list-index-label {
7175 background-color: #9e9e9e;
7176}
7177.md .list-index.color-white ul {
7178 color: #ffffff;
7179}
7180.md .list-index.color-white .list-index-skip-placeholder:after,
7181.md .list-index.color-white .list-index-label {
7182 background-color: #ffffff;
7183}
7184.md .list-index.color-black ul {
7185 color: #000000;
7186}
7187.md .list-index.color-black .list-index-skip-placeholder:after,
7188.md .list-index.color-black .list-index-label {
7189 background-color: #000000;
7190}
7191/* === Timeline === */
7192.timeline {
7193 -webkit-box-sizing: border-box;
7194 box-sizing: border-box;
7195}
7196.block-strong .timeline {
7197 padding: 0;
7198 margin: 0;
7199}
7200.timeline-item {
7201 display: -webkit-box;
7202 display: -webkit-flex;
7203 display: -ms-flexbox;
7204 display: flex;
7205 -webkit-box-pack: start;
7206 -webkit-justify-content: flex-start;
7207 -ms-flex-pack: start;
7208 justify-content: flex-start;
7209 overflow: hidden;
7210 -webkit-box-sizing: border-box;
7211 box-sizing: border-box;
7212 position: relative;
7213}
7214.timeline-item-date {
7215 -webkit-flex-shrink: 0;
7216 -ms-flex-negative: 0;
7217 flex-shrink: 0;
7218 width: 50px;
7219 text-align: right;
7220 -webkit-box-sizing: border-box;
7221 box-sizing: border-box;
7222}
7223.timeline-item-date small {
7224 font-size: 10px;
7225}
7226.timeline-item-content {
7227 margin: 2px;
7228 min-width: 0;
7229 position: relative;
7230 -webkit-flex-shrink: 10;
7231 -ms-flex-negative: 10;
7232 flex-shrink: 10;
7233}
7234.timeline-item-content p:first-child,
7235.timeline-item-content ul:first-child,
7236.timeline-item-content ol:first-child,
7237.timeline-item-content h1:first-child,
7238.timeline-item-content h2:first-child,
7239.timeline-item-content h3:first-child,
7240.timeline-item-content h4:first-child {
7241 margin-top: 0;
7242}
7243.timeline-item-content p:last-child,
7244.timeline-item-content ul:last-child,
7245.timeline-item-content ol:last-child,
7246.timeline-item-content h1:last-child,
7247.timeline-item-content h2:last-child,
7248.timeline-item-content h3:last-child,
7249.timeline-item-content h4:last-child {
7250 margin-bottom: 0;
7251}
7252.timeline-item-inner {
7253 background: #fff;
7254 -webkit-box-sizing: border-box;
7255 box-sizing: border-box;
7256}
7257.timeline-item-inner .block {
7258 padding: 0;
7259 color: inherit;
7260}
7261.timeline-item-inner .block-strong {
7262 padding-left: 0;
7263 padding-right: 0;
7264 margin: 0;
7265}
7266.timeline-item-inner .block-strong:before {
7267 display: none !important;
7268}
7269.timeline-item-inner .block-strong:after {
7270 display: none !important;
7271}
7272.timeline-item-inner .list ul:before {
7273 display: none !important;
7274}
7275.timeline-item-inner .list ul:after {
7276 display: none !important;
7277}
7278.timeline-item-divider {
7279 width: 1px;
7280 position: relative;
7281 width: 10px;
7282 height: 10px;
7283 background: #bbb;
7284 border-radius: 50%;
7285 margin-top: 3px;
7286 -webkit-flex-shrink: 0;
7287 -ms-flex-negative: 0;
7288 flex-shrink: 0;
7289}
7290.timeline-item-divider:after,
7291.timeline-item-divider:before {
7292 content: ' ';
7293 width: 1px;
7294 height: 100vh;
7295 position: absolute;
7296 left: 50%;
7297 background: inherit;
7298 -webkit-transform: translate3d(-50%, 0, 0);
7299 transform: translate3d(-50%, 0, 0);
7300}
7301.timeline-item-divider:after {
7302 top: 100%;
7303}
7304.timeline-item-divider:before {
7305 bottom: 100%;
7306}
7307.timeline-item:last-child .timeline-item-divider:after {
7308 display: none;
7309}
7310.timeline-item:first-child .timeline-item-divider:before {
7311 display: none;
7312}
7313.timeline-item-time {
7314 font-size: 13px;
7315}
7316.timeline-item-time:first-child,
7317.timeline-item-time:last-child {
7318 margin-top: 0;
7319}
7320.timeline-item-title + .timeline-item-time {
7321 margin-top: 0;
7322}
7323.timeline-horizontal {
7324 height: 100%;
7325 display: -webkit-box;
7326 display: -webkit-flex;
7327 display: -ms-flexbox;
7328 display: flex;
7329}
7330.timeline-horizontal .timeline-item {
7331 display: block;
7332 width: 33.33333333vw;
7333 margin: 0;
7334 padding: 0;
7335 -webkit-flex-shrink: 0;
7336 -ms-flex-negative: 0;
7337 flex-shrink: 0;
7338 position: relative;
7339 height: 100%;
7340}
7341.timeline-horizontal .timeline-item-date {
7342 width: auto;
7343 text-align: left;
7344 line-height: 34px;
7345 position: absolute;
7346 left: 0;
7347 top: 0;
7348 width: 100%;
7349 height: 34px;
7350 text-align: right;
7351}
7352.timeline-horizontal .timeline-item-content {
7353 overflow: auto;
7354 -webkit-overflow-scrolling: touch;
7355 margin: 0;
7356}
7357.timeline-horizontal .timeline-item-divider {
7358 display: none;
7359}
7360.timeline-horizontal.col-100 .timeline-item {
7361 width: 100vw;
7362}
7363.timeline-horizontal.col-95 .timeline-item {
7364 width: 95vw;
7365}
7366.timeline-horizontal.col-90 .timeline-item {
7367 width: 90vw;
7368}
7369.timeline-horizontal.col-85 .timeline-item {
7370 width: 85vw;
7371}
7372.timeline-horizontal.col-80 .timeline-item {
7373 width: 80vw;
7374}
7375.timeline-horizontal.col-75 .timeline-item {
7376 width: 75vw;
7377}
7378.timeline-horizontal.col-70 .timeline-item {
7379 width: 70vw;
7380}
7381.timeline-horizontal.col-66 .timeline-item {
7382 width: 66.66666666666666vw;
7383}
7384.timeline-horizontal.col-65 .timeline-item {
7385 width: 65vw;
7386}
7387.timeline-horizontal.col-60 .timeline-item {
7388 width: 60vw;
7389}
7390.timeline-horizontal.col-55 .timeline-item {
7391 width: 55vw;
7392}
7393.timeline-horizontal.col-50 .timeline-item {
7394 width: 50vw;
7395}
7396.timeline-horizontal.col-45 .timeline-item {
7397 width: 45vw;
7398}
7399.timeline-horizontal.col-40 .timeline-item {
7400 width: 40vw;
7401}
7402.timeline-horizontal.col-35 .timeline-item {
7403 width: 35vw;
7404}
7405.timeline-horizontal.col-33 .timeline-item {
7406 width: 33.333333333333336vw;
7407}
7408.timeline-horizontal.col-30 .timeline-item {
7409 width: 30vw;
7410}
7411.timeline-horizontal.col-25 .timeline-item {
7412 width: 25vw;
7413}
7414.timeline-horizontal.col-20 .timeline-item {
7415 width: 20vw;
7416}
7417.timeline-horizontal.col-15 .timeline-item {
7418 width: 15vw;
7419}
7420.timeline-horizontal.col-10 .timeline-item {
7421 width: 10vw;
7422}
7423.timeline-horizontal.col-5 .timeline-item {
7424 width: 5vw;
7425}
7426@media (min-width: 768px) {
7427 .timeline-horizontal.tablet-100 .timeline-item {
7428 width: 100vw;
7429 }
7430 .timeline-horizontal.tablet-95 .timeline-item {
7431 width: 95vw;
7432 }
7433 .timeline-horizontal.tablet-90 .timeline-item {
7434 width: 90vw;
7435 }
7436 .timeline-horizontal.tablet-85 .timeline-item {
7437 width: 85vw;
7438 }
7439 .timeline-horizontal.tablet-80 .timeline-item {
7440 width: 80vw;
7441 }
7442 .timeline-horizontal.tablet-75 .timeline-item {
7443 width: 75vw;
7444 }
7445 .timeline-horizontal.tablet-70 .timeline-item {
7446 width: 70vw;
7447 }
7448 .timeline-horizontal.tablet-66 .timeline-item {
7449 width: 66.66666666666666vw;
7450 }
7451 .timeline-horizontal.tablet-65 .timeline-item {
7452 width: 65vw;
7453 }
7454 .timeline-horizontal.tablet-60 .timeline-item {
7455 width: 60vw;
7456 }
7457 .timeline-horizontal.tablet-55 .timeline-item {
7458 width: 55vw;
7459 }
7460 .timeline-horizontal.tablet-50 .timeline-item {
7461 width: 50vw;
7462 }
7463 .timeline-horizontal.tablet-45 .timeline-item {
7464 width: 45vw;
7465 }
7466 .timeline-horizontal.tablet-40 .timeline-item {
7467 width: 40vw;
7468 }
7469 .timeline-horizontal.tablet-35 .timeline-item {
7470 width: 35vw;
7471 }
7472 .timeline-horizontal.tablet-33 .timeline-item {
7473 width: 33.333333333333336vw;
7474 }
7475 .timeline-horizontal.tablet-30 .timeline-item {
7476 width: 30vw;
7477 }
7478 .timeline-horizontal.tablet-25 .timeline-item {
7479 width: 25vw;
7480 }
7481 .timeline-horizontal.tablet-20 .timeline-item {
7482 width: 20vw;
7483 }
7484 .timeline-horizontal.tablet-15 .timeline-item {
7485 width: 15vw;
7486 }
7487 .timeline-horizontal.tablet-10 .timeline-item {
7488 width: 10vw;
7489 }
7490 .timeline-horizontal.tablet-5 .timeline-item {
7491 width: 5vw;
7492 }
7493}
7494.timeline-horizontal .timeline-year,
7495.timeline-horizontal .timeline-month {
7496 display: -webkit-box;
7497 display: -webkit-flex;
7498 display: -ms-flexbox;
7499 display: flex;
7500 -webkit-flex-shrink: 0;
7501 -ms-flex-negative: 0;
7502 flex-shrink: 0;
7503 padding-top: 24px;
7504 position: relative;
7505 -webkit-box-sizing: border-box;
7506 box-sizing: border-box;
7507 height: 100%;
7508}
7509.timeline-horizontal .timeline-year-title,
7510.timeline-horizontal .timeline-month-title {
7511 position: absolute;
7512 left: 0;
7513 top: 0;
7514 width: 100%;
7515 line-height: 24px;
7516 height: 24px;
7517 -webkit-box-sizing: border-box;
7518 box-sizing: border-box;
7519}
7520.timeline-horizontal .timeline-year-title span,
7521.timeline-horizontal .timeline-month-title span {
7522 display: inline-block;
7523 position: -webkit-sticky;
7524 position: sticky;
7525}
7526.timeline-horizontal .timeline-year-title {
7527 font-size: 16px;
7528}
7529.timeline-horizontal .timeline-month-title span {
7530 margin-top: -2px;
7531}
7532/* === Timeline MD === */
7533.md .timeline {
7534 margin: 32px 0;
7535 padding: 0 16px;
7536}
7537.md .block-strong .timeline {
7538 padding: 0;
7539 margin: 0;
7540}
7541.md .timeline-item {
7542 padding: 2px 0px 16px;
7543}
7544.md .timeline-item:last-child {
7545 padding-bottom: 2px;
7546}
7547.md .timeline-item-content .card,
7548.md .timeline-item-content.card,
7549.md .timeline-item-content .list,
7550.md .timeline-item-content.list,
7551.md .timeline-item-content .block,
7552.md .timeline-item-content.block {
7553 margin: 0;
7554 width: 100%;
7555}
7556.md .timeline-item-content .card + .card,
7557.md .timeline-item-content .list + .card,
7558.md .timeline-item-content .block + .card,
7559.md .timeline-item-content .card + .list,
7560.md .timeline-item-content .list + .list,
7561.md .timeline-item-content .block + .list,
7562.md .timeline-item-content .card + .block,
7563.md .timeline-item-content .list + .block,
7564.md .timeline-item-content .block + .block {
7565 margin: 16px 0 0;
7566}
7567.md .timeline-item-inner {
7568 border-radius: 2px;
7569 padding: 8px 16px;
7570 -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
7571 box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
7572}
7573.md .timeline-item-inner + .timeline-item-inner {
7574 margin-top: 16px;
7575}
7576.md .timeline-item-divider {
7577 margin-left: 16px;
7578 margin-right: 16px;
7579}
7580.md .timeline-item-time {
7581 margin-top: 16px;
7582 color: rgba(0, 0, 0, 0.54);
7583}
7584.md .timeline-item-time:first-child {
7585 margin-top: 0;
7586}
7587.md .timeline-item-title {
7588 font-size: 16px;
7589}
7590.md .timeline-sides .timeline-item {
7591 margin-right: calc(50% - (32px + 10px) / 2 - 50px);
7592 margin-left: 0;
7593}
7594.md .timeline-sides .timeline-item .timeline-item-date {
7595 text-align: left;
7596}
7597.md .timeline-sides .timeline-item:not(.timeline-item-right):nth-child(2n) {
7598 -webkit-box-orient: horizontal;
7599 -webkit-box-direction: reverse;
7600 -webkit-flex-direction: row-reverse;
7601 -ms-flex-direction: row-reverse;
7602 flex-direction: row-reverse;
7603 margin-left: calc(50% - (32px + 10px) / 2 - 50px);
7604 margin-right: 0;
7605}
7606.md .timeline-sides .timeline-item:not(.timeline-item-right):nth-child(2n) .timeline-item-date {
7607 text-align: right;
7608}
7609.md .timeline-sides .timeline-item-left {
7610 -webkit-box-orient: horizontal;
7611 -webkit-box-direction: reverse;
7612 -webkit-flex-direction: row-reverse;
7613 -ms-flex-direction: row-reverse;
7614 flex-direction: row-reverse;
7615 margin-left: calc(50% - (32px + 10px) / 2 - 50px);
7616 margin-right: 0;
7617}
7618.md .timeline-sides .timeline-item-left .timeline-item-date {
7619 text-align: right;
7620}
7621.md .timeline-sides .timeline-item-right {
7622 margin-right: calc(50% - (32px + 10px) / 2 - 50px);
7623 margin-left: 0;
7624}
7625.md .timeline-sides .timeline-item-right .timeline-item-date {
7626 text-align: left;
7627}
7628@media (min-width: 768px) {
7629 .md .tablet-sides .timeline-item {
7630 margin-right: calc(50% - (32px + 10px) / 2 - 50px);
7631 margin-left: 0;
7632 }
7633 .md .tablet-sides .timeline-item .timeline-item-date {
7634 text-align: left;
7635 }
7636 .md .tablet-sides .timeline-item:not(.timeline-item-right):nth-child(2n) {
7637 -webkit-box-orient: horizontal;
7638 -webkit-box-direction: reverse;
7639 -webkit-flex-direction: row-reverse;
7640 -ms-flex-direction: row-reverse;
7641 flex-direction: row-reverse;
7642 margin-left: calc(50% - (32px + 10px) / 2 - 50px);
7643 margin-right: 0;
7644 }
7645 .md .tablet-sides .timeline-item:not(.timeline-item-right):nth-child(2n) .timeline-item-date {
7646 text-align: right;
7647 }
7648 .md .tablet-sides .timeline-item-left {
7649 -webkit-box-orient: horizontal;
7650 -webkit-box-direction: reverse;
7651 -webkit-flex-direction: row-reverse;
7652 -ms-flex-direction: row-reverse;
7653 flex-direction: row-reverse;
7654 margin-left: calc(50% - (32px + 10px) / 2 - 50px);
7655 margin-right: 0;
7656 }
7657 .md .tablet-sides .timeline-item-left .timeline-item-date {
7658 text-align: right;
7659 }
7660 .md .tablet-sides .timeline-item-right {
7661 margin-right: calc(50% - (32px + 10px) / 2 - 50px);
7662 margin-left: 0;
7663 }
7664 .md .tablet-sides .timeline-item-right .timeline-item-date {
7665 text-align: left;
7666 }
7667}
7668.md .timeline-horizontal {
7669 padding: 0;
7670 margin: 0;
7671 position: relative;
7672}
7673.md .timeline-horizontal .timeline-item {
7674 padding-top: 34px !important;
7675 padding-bottom: 12px;
7676}
7677.md .timeline-horizontal .timeline-item-date {
7678 background: #2196f3;
7679 padding: 0px 12px;
7680 color: #fff;
7681}
7682.md .timeline-horizontal .timeline-item-date:after {
7683 content: '';
7684 position: absolute;
7685 right: 0;
7686 width: 100%;
7687 top: 100%;
7688 bottom: auto;
7689 height: 10px;
7690 pointer-events: none;
7691 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)));
7692 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%);
7693 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%);
7694}
7695.md .timeline-horizontal .timeline-item-content {
7696 padding: 12px;
7697 height: calc(100% - 12px);
7698}
7699.md .timeline-horizontal.no-shadow .timeline-item-date:after {
7700 display: none;
7701}
7702.md .timeline-horizontal .timeline-item:after {
7703 content: '';
7704 position: absolute;
7705 background-color: rgba(0, 0, 0, 0.12);
7706 display: block;
7707 z-index: 15;
7708 top: 0;
7709 right: 0;
7710 bottom: auto;
7711 left: auto;
7712 width: 1px;
7713 height: 100%;
7714 -webkit-transform-origin: 100% 50%;
7715 transform-origin: 100% 50%;
7716}
7717.md.device-pixel-ratio-2 .timeline-horizontal .timeline-item:after {
7718 -webkit-transform: scaleX(0.5);
7719 transform: scaleX(0.5);
7720}
7721.md.device-pixel-ratio-3 .timeline-horizontal .timeline-item:after {
7722 -webkit-transform: scaleX(0.33);
7723 transform: scaleX(0.33);
7724}
7725.md .timeline-horizontal .timeline-item:before {
7726 content: '';
7727 position: absolute;
7728 background-color: rgba(0, 0, 0, 0.12);
7729 display: block;
7730 z-index: 15;
7731 top: 0;
7732 right: auto;
7733 bottom: auto;
7734 left: 0;
7735 height: 1px;
7736 width: 100%;
7737 -webkit-transform-origin: 50% 0%;
7738 transform-origin: 50% 0%;
7739}
7740.md.device-pixel-ratio-2 .timeline-horizontal .timeline-item:before {
7741 -webkit-transform: scaleY(0.5);
7742 transform: scaleY(0.5);
7743}
7744.md.device-pixel-ratio-3 .timeline-horizontal .timeline-item:before {
7745 -webkit-transform: scaleY(0.33);
7746 transform: scaleY(0.33);
7747}
7748.md .timeline-year-title,
7749.md .timeline-month-title {
7750 padding: 0 12px;
7751 color: #fff;
7752 background: #2196f3;
7753}
7754.md .timeline-year-title span,
7755.md .timeline-month-title span {
7756 right: 12px;
7757}
7758.md .timeline-year-title span {
7759 margin-top: 2px;
7760}
7761@media (orientation: landscape) {
7762 .md.device-iphone-x .ios-left-edge .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge),
7763 .md.device-iphone-x .ios-edges .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge),
7764 .md.device-iphone-x .popup .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge),
7765 .md.device-iphone-x .sheet-modal .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge),
7766 .md.device-iphone-x .panel-left .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge) {
7767 padding-left: constant(safe-area-inset-left);
7768 padding-left: env(safe-area-inset-left);
7769 }
7770 .md.device-iphone-x .ios-left-edge .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge) .timeline-year-title span,
7771 .md.device-iphone-x .ios-edges .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge) .timeline-year-title span,
7772 .md.device-iphone-x .popup .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge) .timeline-year-title span,
7773 .md.device-iphone-x .sheet-modal .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge) .timeline-year-title span,
7774 .md.device-iphone-x .panel-left .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge) .timeline-year-title span,
7775 .md.device-iphone-x .ios-left-edge .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge) .timeline-month-title span,
7776 .md.device-iphone-x .ios-edges .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge) .timeline-month-title span,
7777 .md.device-iphone-x .popup .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge) .timeline-month-title span,
7778 .md.device-iphone-x .sheet-modal .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge) .timeline-month-title span,
7779 .md.device-iphone-x .panel-left .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge) .timeline-month-title span {
7780 left: calc(12px + constant(safe-area-inset-left));
7781 left: calc(12px + env(safe-area-inset-left));
7782 }
7783 .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,
7784 .md.device-iphone-x .ios-edges .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge) .timeline-year:first-child .timeline-year-title,
7785 .md.device-iphone-x .popup .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge) .timeline-year:first-child .timeline-year-title,
7786 .md.device-iphone-x .sheet-modal .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge) .timeline-year:first-child .timeline-year-title,
7787 .md.device-iphone-x .panel-left .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge) .timeline-year:first-child .timeline-year-title,
7788 .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,
7789 .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,
7790 .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,
7791 .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,
7792 .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,
7793 .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,
7794 .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,
7795 .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,
7796 .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,
7797 .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 {
7798 left: -44px;
7799 right: 0;
7800 width: auto;
7801 }
7802 .md.device-iphone-x .ios-left-edge .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge) > .timeline-item:first-child,
7803 .md.device-iphone-x .ios-edges .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge) > .timeline-item:first-child,
7804 .md.device-iphone-x .popup .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge) > .timeline-item:first-child,
7805 .md.device-iphone-x .sheet-modal .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge) > .timeline-item:first-child,
7806 .md.device-iphone-x .panel-left .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge) > .timeline-item:first-child,
7807 .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,
7808 .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,
7809 .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,
7810 .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,
7811 .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,
7812 .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,
7813 .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,
7814 .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,
7815 .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,
7816 .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,
7817 .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,
7818 .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,
7819 .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,
7820 .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,
7821 .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 {
7822 overflow: visible;
7823 }
7824 .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,
7825 .md.device-iphone-x .ios-edges .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge) > .timeline-item:first-child .timeline-item-date,
7826 .md.device-iphone-x .popup .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge) > .timeline-item:first-child .timeline-item-date,
7827 .md.device-iphone-x .sheet-modal .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge) > .timeline-item:first-child .timeline-item-date,
7828 .md.device-iphone-x .panel-left .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge) > .timeline-item:first-child .timeline-item-date,
7829 .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,
7830 .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,
7831 .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,
7832 .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,
7833 .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,
7834 .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,
7835 .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,
7836 .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,
7837 .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,
7838 .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,
7839 .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,
7840 .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,
7841 .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,
7842 .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,
7843 .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 {
7844 width: auto;
7845 padding-left: calc(12px + constant(safe-area-inset-left));
7846 padding-left: calc(12px + env(safe-area-inset-left));
7847 left: calc(0px - constant(safe-area-inset-left));
7848 left: calc(0px - env(safe-area-inset-left));
7849 right: 0;
7850 }
7851 .md.device-iphone-x .ios-left-edge .timeline:not(.no-ios-edges):not(.no-ios-left-edge):not(.timeline-horizontal),
7852 .md.device-iphone-x .ios-edges .timeline:not(.no-ios-edges):not(.no-ios-left-edge):not(.timeline-horizontal),
7853 .md.device-iphone-x .popup .timeline:not(.no-ios-edges):not(.no-ios-left-edge):not(.timeline-horizontal),
7854 .md.device-iphone-x .sheet-modal .timeline:not(.no-ios-edges):not(.no-ios-left-edge):not(.timeline-horizontal),
7855 .md.device-iphone-x .panel-left .timeline:not(.no-ios-edges):not(.no-ios-left-edge):not(.timeline-horizontal) {
7856 padding-left: calc(16px + constant(safe-area-inset-left));
7857 padding-left: calc(16px + env(safe-area-inset-left));
7858 }
7859 .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,
7860 .md.device-iphone-x .ios-edges .timeline-horizontal:not(.no-ios-edges):not(.no-ios-right-edge) .timeline-year:last-child .timeline-year-title,
7861 .md.device-iphone-x .popup .timeline-horizontal:not(.no-ios-edges):not(.no-ios-right-edge) .timeline-year:last-child .timeline-year-title,
7862 .md.device-iphone-x .sheet-modal .timeline-horizontal:not(.no-ios-edges):not(.no-ios-right-edge) .timeline-year:last-child .timeline-year-title,
7863 .md.device-iphone-x .panel-right .timeline-horizontal:not(.no-ios-edges):not(.no-ios-right-edge) .timeline-year:last-child .timeline-year-title,
7864 .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,
7865 .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,
7866 .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,
7867 .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,
7868 .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 {
7869 width: auto;
7870 right: calc(0px - constant(safe-area-inset-right));
7871 right: calc(0px - env(safe-area-inset-right));
7872 }
7873 .md.device-iphone-x .ios-right-edge .timeline-horizontal:not(.no-ios-edges):not(.no-ios-right-edge) > .timeline-item:last-child,
7874 .md.device-iphone-x .ios-edges .timeline-horizontal:not(.no-ios-edges):not(.no-ios-right-edge) > .timeline-item:last-child,
7875 .md.device-iphone-x .popup .timeline-horizontal:not(.no-ios-edges):not(.no-ios-right-edge) > .timeline-item:last-child,
7876 .md.device-iphone-x .sheet-modal .timeline-horizontal:not(.no-ios-edges):not(.no-ios-right-edge) > .timeline-item:last-child,
7877 .md.device-iphone-x .panel-right .timeline-horizontal:not(.no-ios-edges):not(.no-ios-right-edge) > .timeline-item:last-child,
7878 .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,
7879 .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,
7880 .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,
7881 .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,
7882 .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 {
7883 overflow: visible;
7884 }
7885 .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,
7886 .md.device-iphone-x .ios-edges .timeline-horizontal:not(.no-ios-edges):not(.no-ios-right-edge) > .timeline-item:last-child .timeline-item-date,
7887 .md.device-iphone-x .popup .timeline-horizontal:not(.no-ios-edges):not(.no-ios-right-edge) > .timeline-item:last-child .timeline-item-date,
7888 .md.device-iphone-x .sheet-modal .timeline-horizontal:not(.no-ios-edges):not(.no-ios-right-edge) > .timeline-item:last-child .timeline-item-date,
7889 .md.device-iphone-x .panel-right .timeline-horizontal:not(.no-ios-edges):not(.no-ios-right-edge) > .timeline-item:last-child .timeline-item-date,
7890 .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,
7891 .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,
7892 .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,
7893 .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,
7894 .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 {
7895 width: auto;
7896 right: calc(0px - constant(safe-area-inset-right));
7897 right: calc(0px - env(safe-area-inset-right));
7898 left: 0;
7899 }
7900 .md.device-iphone-x .ios-right-edge .timeline:not(.no-ios-edges):not(.no-ios-right-edge):not(.timeline-horizontal),
7901 .md.device-iphone-x .ios-edges .timeline:not(.no-ios-edges):not(.no-ios-right-edge):not(.timeline-horizontal),
7902 .md.device-iphone-x .popup .timeline:not(.no-ios-edges):not(.no-ios-right-edge):not(.timeline-horizontal),
7903 .md.device-iphone-x .sheet-modal .timeline:not(.no-ios-edges):not(.no-ios-right-edge):not(.timeline-horizontal),
7904 .md.device-iphone-x .panel-right .timeline:not(.no-ios-edges):not(.no-ios-right-edge):not(.timeline-horizontal) {
7905 padding-right: calc(16px + constant(safe-area-inset-right));
7906 padding-right: calc(16px + env(safe-area-inset-right));
7907 }
7908}
7909.md .theme-dark .timeline-item-inner {
7910 background-color: rgba(255, 255, 255, 0.03);
7911}
7912.md .theme-dark .timeline-item-time {
7913 color: rgba(255, 255, 255, 0.54);
7914}
7915.md .color-theme-red .timeline-item-date,
7916.md .color-theme-red .timeline-year-title,
7917.md .color-theme-red .timeline-month-title {
7918 background: #f44336;
7919}
7920.md .color-theme-green .timeline-item-date,
7921.md .color-theme-green .timeline-year-title,
7922.md .color-theme-green .timeline-month-title {
7923 background: #4caf50;
7924}
7925.md .color-theme-blue .timeline-item-date,
7926.md .color-theme-blue .timeline-year-title,
7927.md .color-theme-blue .timeline-month-title {
7928 background: #2196f3;
7929}
7930.md .color-theme-pink .timeline-item-date,
7931.md .color-theme-pink .timeline-year-title,
7932.md .color-theme-pink .timeline-month-title {
7933 background: #e91e63;
7934}
7935.md .color-theme-yellow .timeline-item-date,
7936.md .color-theme-yellow .timeline-year-title,
7937.md .color-theme-yellow .timeline-month-title {
7938 background: #ffeb3b;
7939}
7940.md .color-theme-orange .timeline-item-date,
7941.md .color-theme-orange .timeline-year-title,
7942.md .color-theme-orange .timeline-month-title {
7943 background: #ff9800;
7944}
7945.md .color-theme-gray .timeline-item-date,
7946.md .color-theme-gray .timeline-year-title,
7947.md .color-theme-gray .timeline-month-title {
7948 background: #9e9e9e;
7949}
7950.md .color-theme-white .timeline-item-date,
7951.md .color-theme-white .timeline-year-title,
7952.md .color-theme-white .timeline-month-title {
7953 background: #ffffff;
7954}
7955.md .color-theme-black .timeline-item-date,
7956.md .color-theme-black .timeline-year-title,
7957.md .color-theme-black .timeline-month-title {
7958 background: #000000;
7959}
7960.md .timeline.color-theme-red .timeline-item-date,
7961.md .timeline.color-theme-red .timeline-year-title,
7962.md .timeline.color-theme-red .timeline-month-title {
7963 background: #f44336;
7964}
7965.md .timeline.color-theme-green .timeline-item-date,
7966.md .timeline.color-theme-green .timeline-year-title,
7967.md .timeline.color-theme-green .timeline-month-title {
7968 background: #4caf50;
7969}
7970.md .timeline.color-theme-blue .timeline-item-date,
7971.md .timeline.color-theme-blue .timeline-year-title,
7972.md .timeline.color-theme-blue .timeline-month-title {
7973 background: #2196f3;
7974}
7975.md .timeline.color-theme-pink .timeline-item-date,
7976.md .timeline.color-theme-pink .timeline-year-title,
7977.md .timeline.color-theme-pink .timeline-month-title {
7978 background: #e91e63;
7979}
7980.md .timeline.color-theme-yellow .timeline-item-date,
7981.md .timeline.color-theme-yellow .timeline-year-title,
7982.md .timeline.color-theme-yellow .timeline-month-title {
7983 background: #ffeb3b;
7984}
7985.md .timeline.color-theme-orange .timeline-item-date,
7986.md .timeline.color-theme-orange .timeline-year-title,
7987.md .timeline.color-theme-orange .timeline-month-title {
7988 background: #ff9800;
7989}
7990.md .timeline.color-theme-gray .timeline-item-date,
7991.md .timeline.color-theme-gray .timeline-year-title,
7992.md .timeline.color-theme-gray .timeline-month-title {
7993 background: #9e9e9e;
7994}
7995.md .timeline.color-theme-white .timeline-item-date,
7996.md .timeline.color-theme-white .timeline-year-title,
7997.md .timeline.color-theme-white .timeline-month-title {
7998 background: #ffffff;
7999}
8000.md .timeline.color-theme-black .timeline-item-date,
8001.md .timeline.color-theme-black .timeline-year-title,
8002.md .timeline.color-theme-black .timeline-month-title {
8003 background: #000000;
8004}
8005/* === Tabs === */
8006.tabs .tab {
8007 display: none;
8008}
8009.tabs .tab-active {
8010 display: block;
8011}
8012.tabs-animated-wrap {
8013 position: relative;
8014 width: 100%;
8015 overflow: hidden;
8016 height: 100%;
8017}
8018.tabs-animated-wrap > .tabs {
8019 display: -webkit-box;
8020 display: -webkit-flex;
8021 display: -ms-flexbox;
8022 display: flex;
8023 height: 100%;
8024 -webkit-transition-duration: 300ms;
8025 transition-duration: 300ms;
8026}
8027.tabs-animated-wrap > .tabs > .tab {
8028 width: 100%;
8029 display: block;
8030 -webkit-flex-shrink: 0;
8031 -ms-flex-negative: 0;
8032 flex-shrink: 0;
8033}
8034.tabs-animated-wrap.not-animated > .tabs {
8035 -webkit-transition-duration: 300ms;
8036 transition-duration: 300ms;
8037}
8038.tabs-swipeable-wrap {
8039 height: 100%;
8040}
8041.tabs-swipeable-wrap > .tabs {
8042 height: 100%;
8043}
8044.tabs-swipeable-wrap > .tabs > .tab {
8045 display: block;
8046}
8047.page > .tabs {
8048 height: 100%;
8049}
8050/* === Panels === */
8051.panel-backdrop {
8052 position: absolute;
8053 left: 0;
8054 top: 0;
8055 width: 100%;
8056 height: 100%;
8057 opacity: 0;
8058 z-index: 5999;
8059 display: none;
8060 -webkit-transform: translate3d(0, 0, 0);
8061 transform: translate3d(0, 0, 0);
8062}
8063.panel-backdrop.not-animated {
8064 -webkit-transition-duration: 0ms !important;
8065 transition-duration: 0ms !important;
8066}
8067.panel {
8068 z-index: 1000;
8069 display: none;
8070 -webkit-box-sizing: border-box;
8071 box-sizing: border-box;
8072 position: absolute;
8073 overflow: auto;
8074 -webkit-overflow-scrolling: touch;
8075 top: 0;
8076 height: 100%;
8077 -webkit-transform: translate3d(0, 0, 0);
8078 transform: translate3d(0, 0, 0);
8079 width: 260px;
8080 background-color: #fff;
8081}
8082.panel.not-animated {
8083 -webkit-transition-duration: 0ms !important;
8084 transition-duration: 0ms !important;
8085}
8086.panel.panel-reveal.not-animated ~ .views,
8087.panel.panel-reveal.not-animated ~ .view {
8088 -webkit-transition-duration: 0ms !important;
8089 transition-duration: 0ms !important;
8090}
8091.panel-cover {
8092 z-index: 6000;
8093}
8094.panel-left {
8095 left: 0;
8096}
8097.panel-left.panel-cover {
8098 -webkit-transform: translate3d(-100%, 0, 0);
8099 transform: translate3d(-100%, 0, 0);
8100}
8101.panel-right {
8102 right: 0;
8103}
8104.panel-right.panel-cover {
8105 -webkit-transform: translate3d(100%, 0, 0);
8106 transform: translate3d(100%, 0, 0);
8107}
8108.panel-visible-by-breakpoint {
8109 display: block;
8110 -webkit-transform: translate3d(0, 0, 0) !important;
8111 transform: translate3d(0, 0, 0) !important;
8112}
8113.panel-visible-by-breakpoint.panel-cover {
8114 z-index: 5900;
8115}
8116html.with-panel .framework7-root > .views .page-content,
8117html.with-panel .framework7-root > .view .page-content {
8118 overflow: hidden;
8119 -webkit-overflow-scrolling: auto;
8120}
8121html.with-panel-left-cover .panel-backdrop,
8122html.with-panel-right-cover .panel-backdrop {
8123 display: block;
8124 opacity: 1;
8125}
8126html.with-panel-left-reveal .panel-backdrop,
8127html.with-panel-right-reveal .panel-backdrop,
8128html.with-panel-transitioning .panel-backdrop {
8129 background: rgba(0, 0, 0, 0);
8130 display: block;
8131 opacity: 0;
8132}
8133html.with-panel-left-reveal .views,
8134html.with-panel-left-reveal .framework7-root > .view,
8135html.with-panel-left-reveal .panel-backdrop {
8136 -webkit-transform: translate3d(260px, 0, 0);
8137 transform: translate3d(260px, 0, 0);
8138}
8139html.with-panel-right-reveal .views,
8140html.with-panel-right-reveal .framework7-root > .view,
8141html.with-panel-right-reveal .panel-backdrop {
8142 -webkit-transform: translate3d(-260px, 0, 0);
8143 transform: translate3d(-260px, 0, 0);
8144}
8145html.with-panel-left-cover .panel-left {
8146 -webkit-transform: translate3d(0px, 0, 0);
8147 transform: translate3d(0px, 0, 0);
8148}
8149html.with-panel-right-cover .panel-right {
8150 -webkit-transform: translate3d(0px, 0, 0);
8151 transform: translate3d(0px, 0, 0);
8152}
8153html.with-statusbar.device-ios .panel,
8154html.with-statusbar.ios:not(.device-ios):not(.device-android) .panel {
8155 top: 20px;
8156 height: calc(100% - 20px);
8157}
8158html.with-statusbar.device-android .panel,
8159html.with-statusbar.md:not(.device-ios):not(.device-android) .panel {
8160 top: 24px;
8161 height: calc(100% - 24px);
8162}
8163html.with-statusbar.device-iphone-x .panel {
8164 top: constant(safe-area-inset-top);
8165 top: env(safe-area-inset-top);
8166 height: calc(100% - constant(safe-area-inset-top));
8167 height: calc(100% - env(safe-area-inset-top));
8168}
8169.md .panel-backdrop {
8170 -webkit-transition-duration: 300ms;
8171 transition-duration: 300ms;
8172 background: rgba(0, 0, 0, 0.2);
8173}
8174.md .panel {
8175 -webkit-transition-duration: 300ms;
8176 transition-duration: 300ms;
8177}
8178.md .panel-visible {
8179 display: block;
8180}
8181.md .panel-visible-by-breakpoint {
8182 -webkit-box-shadow: none;
8183 box-shadow: none;
8184}
8185.md.with-panel-left-cover .panel-cover,
8186.md.with-panel-right-cover .panel-cover {
8187 -webkit-box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.5);
8188 box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.5);
8189}
8190.md.with-panel-left-reveal .views,
8191.md.with-panel-right-reveal .views,
8192.md.with-panel-left-reveal .framework7-root > .view,
8193.md.with-panel-right-reveal .framework7-root > .view {
8194 -webkit-box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.5);
8195 box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.5);
8196}
8197.md.with-panel-left-reveal .views,
8198.md.with-panel-right-reveal .views,
8199.md.with-panel-transitioning .views,
8200.md.with-panel-left-reveal .framework7-root > .view,
8201.md.with-panel-right-reveal .framework7-root > .view,
8202.md.with-panel-transitioning .framework7-root > .view {
8203 -webkit-transition-duration: 300ms;
8204 transition-duration: 300ms;
8205 -webkit-transition-property: -webkit-transform, -webkit-box-shadow;
8206 transition-property: -webkit-transform, -webkit-box-shadow;
8207 transition-property: transform, box-shadow;
8208 transition-property: transform, box-shadow, -webkit-transform, -webkit-box-shadow;
8209}
8210/* === Card === */
8211.cards-list > ul:before,
8212.card .list > ul:before {
8213 display: none !important;
8214}
8215.cards-list > ul:after,
8216.card .list > ul:after {
8217 display: none !important;
8218}
8219.card {
8220 background: #fff;
8221 position: relative;
8222 border-radius: 4px;
8223 font-size: 14px;
8224}
8225.card .list,
8226.card .block {
8227 margin: 0;
8228}
8229.row:not(.no-gap) .col > .card {
8230 margin-left: 0;
8231 margin-right: 0;
8232}
8233.card-content {
8234 position: relative;
8235}
8236.card-content-padding {
8237 position: relative;
8238}
8239.card-content-padding > p:first-child {
8240 margin-top: 0;
8241}
8242.card-content-padding > p:last-child {
8243 margin-bottom: 0;
8244}
8245.card-header,
8246.card-footer {
8247 min-height: 44px;
8248 position: relative;
8249 -webkit-box-sizing: border-box;
8250 box-sizing: border-box;
8251 display: -webkit-box;
8252 display: -webkit-flex;
8253 display: -ms-flexbox;
8254 display: flex;
8255 -webkit-box-pack: justify;
8256 -webkit-justify-content: space-between;
8257 -ms-flex-pack: justify;
8258 justify-content: space-between;
8259 -webkit-box-align: center;
8260 -webkit-align-items: center;
8261 -ms-flex-align: center;
8262 align-items: center;
8263}
8264.card-header[valign="top"],
8265.card-footer[valign="top"] {
8266 -webkit-box-align: start;
8267 -webkit-align-items: flex-start;
8268 -ms-flex-align: start;
8269 align-items: flex-start;
8270}
8271.card-header[valign="bottom"],
8272.card-footer[valign="bottom"] {
8273 -webkit-box-align: end;
8274 -webkit-align-items: flex-end;
8275 -ms-flex-align: end;
8276 align-items: flex-end;
8277}
8278.card-header a.link,
8279.card-footer a.link {
8280 position: relative;
8281}
8282.card-header a.link i.icon,
8283.card-footer a.link i.icon {
8284 display: block;
8285}
8286.card-header a.icon-only,
8287.card-footer a.icon-only {
8288 display: -webkit-box;
8289 display: -webkit-flex;
8290 display: -ms-flexbox;
8291 display: flex;
8292 -webkit-box-pack: center;
8293 -webkit-justify-content: center;
8294 -ms-flex-pack: center;
8295 justify-content: center;
8296 -webkit-box-align: center;
8297 -webkit-align-items: center;
8298 -ms-flex-align: center;
8299 align-items: center;
8300 margin: 0;
8301}
8302.card-header {
8303 border-radius: 4px 4px 0 0;
8304}
8305.card-header:after {
8306 content: '';
8307 position: absolute;
8308 background-color: #e1e1e1;
8309 display: block;
8310 z-index: 15;
8311 top: auto;
8312 right: auto;
8313 bottom: 0;
8314 left: 0;
8315 height: 1px;
8316 width: 100%;
8317 -webkit-transform-origin: 50% 100%;
8318 transform-origin: 50% 100%;
8319}
8320html.device-pixel-ratio-2 .card-header:after {
8321 -webkit-transform: scaleY(0.5);
8322 transform: scaleY(0.5);
8323}
8324html.device-pixel-ratio-3 .card-header:after {
8325 -webkit-transform: scaleY(0.33);
8326 transform: scaleY(0.33);
8327}
8328.card-header.no-hairline:after {
8329 display: none !important;
8330}
8331.card-footer {
8332 border-radius: 0 0 4px 4px;
8333}
8334.card-footer:before {
8335 content: '';
8336 position: absolute;
8337 background-color: #e1e1e1;
8338 display: block;
8339 z-index: 15;
8340 top: 0;
8341 right: auto;
8342 bottom: auto;
8343 left: 0;
8344 height: 1px;
8345 width: 100%;
8346 -webkit-transform-origin: 50% 0%;
8347 transform-origin: 50% 0%;
8348}
8349html.device-pixel-ratio-2 .card-footer:before {
8350 -webkit-transform: scaleY(0.5);
8351 transform: scaleY(0.5);
8352}
8353html.device-pixel-ratio-3 .card-footer:before {
8354 -webkit-transform: scaleY(0.33);
8355 transform: scaleY(0.33);
8356}
8357.card-footer.no-hairline:before {
8358 display: none !important;
8359}
8360.md .cards-list ul,
8361.md .card .list ul {
8362 background: none;
8363}
8364.md .card {
8365 margin: 8px;
8366 -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);
8367 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);
8368}
8369.md .card-outline {
8370 -webkit-box-shadow: none;
8371 box-shadow: none;
8372 border: 1px solid rgba(0, 0, 0, 0.12);
8373}
8374.md .card-header a.link,
8375.md .card-footer a.link {
8376 text-decoration: none;
8377 text-align: center;
8378 display: block;
8379 -webkit-appearance: none;
8380 -moz-appearance: none;
8381 appearance: none;
8382 background: none;
8383 padding: 0 10px;
8384 margin: 0;
8385 white-space: nowrap;
8386 text-overflow: ellipsis;
8387 font-size: 14px;
8388 position: relative;
8389 overflow: hidden;
8390 font-family: inherit;
8391 cursor: pointer;
8392 outline: 0;
8393 -webkit-box-sizing: border-box;
8394 box-sizing: border-box;
8395 vertical-align: middle;
8396 color: #2196f3;
8397 border-radius: 4px;
8398 line-height: 36px;
8399 height: 36px;
8400 text-transform: uppercase;
8401 min-width: 64px;
8402 padding: 0 8px;
8403 border: none;
8404 -webkit-transition-duration: 300ms;
8405 transition-duration: 300ms;
8406 -webkit-transform: translate3d(0, 0, 0);
8407 transform: translate3d(0, 0, 0);
8408 font-weight: 500;
8409 letter-spacing: 0.03em;
8410}
8411input[type="submit"].md .card-header a.link,
8412input[type="submit"].md .card-footer a.link,
8413input[type="button"].md .card-header a.link,
8414input[type="button"].md .card-footer a.link {
8415 width: 100%;
8416}
8417.md .card-header a.link.active-state,
8418.md .card-footer a.link.active-state {
8419 background: rgba(0, 0, 0, 0.1);
8420}
8421.md .card-header a.icon-only,
8422.md .card-footer a.icon-only {
8423 min-width: 48px;
8424}
8425.md .page-content > .card:last-child {
8426 margin-bottom: 32px;
8427}
8428.md .card-content-padding {
8429 padding: 16px;
8430}
8431.md .card-content-padding > .list,
8432.md .card-content-padding > .block {
8433 margin: -16px;
8434}
8435.md .card-header,
8436.md .card-footer {
8437 min-height: 48px;
8438 padding: 4px 16px;
8439}
8440.md .card-header {
8441 font-size: 16px;
8442}
8443.md .card-footer {
8444 color: #757575;
8445}
8446.md .theme-dark .card {
8447 background-color: rgba(255, 255, 255, 0.03);
8448}
8449.md .theme-dark .card-outline {
8450 border-color: #282829;
8451}
8452.md .theme-dark .card-header:after {
8453 background-color: rgba(255, 255, 255, 0.08);
8454}
8455.md .theme-dark .card-footer {
8456 color: rgba(255, 255, 255, 0.54);
8457}
8458.md .theme-dark .card-footer:before {
8459 background-color: rgba(255, 255, 255, 0.08);
8460}
8461@media (orientation: landscape) {
8462 .md.device-iphone-x .ios-left-edge .card:not(.no-ios-edges):not(.no-ios-left-edge),
8463 .md.device-iphone-x .ios-edges .card:not(.no-ios-edges):not(.no-ios-left-edge),
8464 .md.device-iphone-x .popup .card:not(.no-ios-edges):not(.no-ios-left-edge),
8465 .md.device-iphone-x .sheet-modal .card:not(.no-ios-edges):not(.no-ios-left-edge),
8466 .md.device-iphone-x .panel-left .card:not(.no-ios-edges):not(.no-ios-left-edge) {
8467 margin-left: calc(8px + constant(safe-area-inset-left));
8468 margin-left: calc(8px + env(safe-area-inset-left));
8469 }
8470 .md.device-iphone-x .ios-right-edge .card:not(.no-ios-edges):not(.no-ios-right-edge),
8471 .md.device-iphone-x .ios-edges .card:not(.no-ios-edges):not(.no-ios-right-edge),
8472 .md.device-iphone-x .popup .card:not(.no-ios-edges):not(.no-ios-right-edge),
8473 .md.device-iphone-x .sheet-modal .card:not(.no-ios-edges):not(.no-ios-right-edge),
8474 .md.device-iphone-x .panel-right .card:not(.no-ios-edges):not(.no-ios-right-edge) {
8475 margin-right: calc(8px + constant(safe-area-inset-right));
8476 margin-right: calc(8px + env(safe-area-inset-right));
8477 }
8478}
8479.md .color-theme-red .card-header a.link,
8480.md .color-theme-red .card-footer a.link,
8481.md .card-header.color-theme-red a.link,
8482.md .card-footer.color-theme-red a.link {
8483 color: #f44336;
8484}
8485.md .color-theme-green .card-header a.link,
8486.md .color-theme-green .card-footer a.link,
8487.md .card-header.color-theme-green a.link,
8488.md .card-footer.color-theme-green a.link {
8489 color: #4caf50;
8490}
8491.md .color-theme-blue .card-header a.link,
8492.md .color-theme-blue .card-footer a.link,
8493.md .card-header.color-theme-blue a.link,
8494.md .card-footer.color-theme-blue a.link {
8495 color: #2196f3;
8496}
8497.md .color-theme-pink .card-header a.link,
8498.md .color-theme-pink .card-footer a.link,
8499.md .card-header.color-theme-pink a.link,
8500.md .card-footer.color-theme-pink a.link {
8501 color: #e91e63;
8502}
8503.md .color-theme-yellow .card-header a.link,
8504.md .color-theme-yellow .card-footer a.link,
8505.md .card-header.color-theme-yellow a.link,
8506.md .card-footer.color-theme-yellow a.link {
8507 color: #ffeb3b;
8508}
8509.md .color-theme-orange .card-header a.link,
8510.md .color-theme-orange .card-footer a.link,
8511.md .card-header.color-theme-orange a.link,
8512.md .card-footer.color-theme-orange a.link {
8513 color: #ff9800;
8514}
8515.md .color-theme-gray .card-header a.link,
8516.md .color-theme-gray .card-footer a.link,
8517.md .card-header.color-theme-gray a.link,
8518.md .card-footer.color-theme-gray a.link {
8519 color: #9e9e9e;
8520}
8521.md .color-theme-white .card-header a.link,
8522.md .color-theme-white .card-footer a.link,
8523.md .card-header.color-theme-white a.link,
8524.md .card-footer.color-theme-white a.link {
8525 color: #ffffff;
8526}
8527.md .color-theme-black .card-header a.link,
8528.md .color-theme-black .card-footer a.link,
8529.md .card-header.color-theme-black a.link,
8530.md .card-footer.color-theme-black a.link {
8531 color: #000000;
8532}
8533.md .card-header a.link.color-red,
8534.md .card-footer a.link.color-red {
8535 color: #f44336;
8536}
8537.md .card-header a.link.color-green,
8538.md .card-footer a.link.color-green {
8539 color: #4caf50;
8540}
8541.md .card-header a.link.color-blue,
8542.md .card-footer a.link.color-blue {
8543 color: #2196f3;
8544}
8545.md .card-header a.link.color-pink,
8546.md .card-footer a.link.color-pink {
8547 color: #e91e63;
8548}
8549.md .card-header a.link.color-yellow,
8550.md .card-footer a.link.color-yellow {
8551 color: #ffeb3b;
8552}
8553.md .card-header a.link.color-orange,
8554.md .card-footer a.link.color-orange {
8555 color: #ff9800;
8556}
8557.md .card-header a.link.color-gray,
8558.md .card-footer a.link.color-gray {
8559 color: #9e9e9e;
8560}
8561.md .card-header a.link.color-white,
8562.md .card-footer a.link.color-white {
8563 color: #ffffff;
8564}
8565.md .card-header a.link.color-black,
8566.md .card-footer a.link.color-black {
8567 color: #000000;
8568}
8569/* === Chips === */
8570.chip {
8571 font-weight: normal;
8572 display: -webkit-inline-box;
8573 display: -webkit-inline-flex;
8574 display: -ms-inline-flexbox;
8575 display: inline-flex;
8576 -webkit-box-sizing: border-box;
8577 box-sizing: border-box;
8578 vertical-align: middle;
8579 -webkit-box-align: center;
8580 -webkit-align-items: center;
8581 -ms-flex-align: center;
8582 align-items: center;
8583 margin: 2px 0;
8584}
8585.chip-media {
8586 border-radius: 50%;
8587 text-align: center;
8588 color: #fff;
8589 -webkit-flex-shrink: 0;
8590 -ms-flex-negative: 0;
8591 flex-shrink: 0;
8592 display: -webkit-box;
8593 display: -webkit-flex;
8594 display: -ms-flexbox;
8595 display: flex;
8596 -webkit-box-align: center;
8597 -webkit-align-items: center;
8598 -ms-flex-align: center;
8599 align-items: center;
8600 -webkit-box-pack: center;
8601 -webkit-justify-content: center;
8602 -ms-flex-pack: center;
8603 justify-content: center;
8604}
8605.chip-media img {
8606 max-width: 100%;
8607 max-height: 100%;
8608 width: auto;
8609 height: auto;
8610 border-radius: 50%;
8611 display: block;
8612}
8613.chip-label {
8614 white-space: nowrap;
8615 overflow: hidden;
8616 text-overflow: ellipsis;
8617 position: relative;
8618 -webkit-flex-shrink: 1;
8619 -ms-flex-negative: 1;
8620 flex-shrink: 1;
8621 min-width: 0;
8622}
8623.chip-delete {
8624 text-align: center;
8625 cursor: pointer;
8626 -webkit-flex-shrink: 0;
8627 -ms-flex-negative: 0;
8628 flex-shrink: 0;
8629 background-repeat: no-repeat;
8630}
8631.chip .chip-delete.active-state {
8632 opacity: 1;
8633}
8634.md .chip {
8635 font-size: 13px;
8636 color: rgba(0, 0, 0, 0.87);
8637 background: rgba(0, 0, 0, 0.12);
8638 height: 32px;
8639 line-height: 32px;
8640 border-radius: 16px;
8641 padding: 0 12px;
8642}
8643.md .chip-outline {
8644 background: none;
8645 border: 1px solid rgba(0, 0, 0, 0.12);
8646}
8647.md .chip-media {
8648 width: 32px;
8649 height: 32px;
8650 vertical-align: top;
8651 border-radius: 50%;
8652 text-align: center;
8653 line-height: 32px;
8654 color: #fff;
8655 font-size: 16px;
8656 margin-right: -12px;
8657}
8658.md .chip-media + .chip-label {
8659 margin-right: 8px;
8660}
8661.md .chip-label + .chip-delete {
8662 margin-right: 4px;
8663}
8664.md .chip-delete {
8665 margin-right: -8px;
8666 width: 24px;
8667 height: 24px;
8668 line-height: 24px;
8669 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");
8670 background-position: center;
8671 background-size: 20px 20px;
8672 opacity: 0.54;
8673 margin-left: -8px;
8674}
8675.md .theme-dark .chip {
8676 background: #333;
8677 color: rgba(255, 255, 255, 0.87);
8678}
8679.md .theme-dark .chip-outline {
8680 background: none;
8681 border-color: #333;
8682}
8683.md .theme-dark .chip-delete {
8684 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");
8685}
8686.md .chip.color-red {
8687 background: #f44336;
8688 color: #fff;
8689}
8690.md .chip.color-red.chip-outline {
8691 background: none;
8692 border-color: #f44336;
8693 color: #f44336;
8694}
8695.md .chip.color-green {
8696 background: #4caf50;
8697 color: #fff;
8698}
8699.md .chip.color-green.chip-outline {
8700 background: none;
8701 border-color: #4caf50;
8702 color: #4caf50;
8703}
8704.md .chip.color-blue {
8705 background: #2196f3;
8706 color: #fff;
8707}
8708.md .chip.color-blue.chip-outline {
8709 background: none;
8710 border-color: #2196f3;
8711 color: #2196f3;
8712}
8713.md .chip.color-pink {
8714 background: #e91e63;
8715 color: #fff;
8716}
8717.md .chip.color-pink.chip-outline {
8718 background: none;
8719 border-color: #e91e63;
8720 color: #e91e63;
8721}
8722.md .chip.color-yellow {
8723 background: #ffeb3b;
8724 color: #fff;
8725}
8726.md .chip.color-yellow.chip-outline {
8727 background: none;
8728 border-color: #ffeb3b;
8729 color: #ffeb3b;
8730}
8731.md .chip.color-orange {
8732 background: #ff9800;
8733 color: #fff;
8734}
8735.md .chip.color-orange.chip-outline {
8736 background: none;
8737 border-color: #ff9800;
8738 color: #ff9800;
8739}
8740.md .chip.color-gray {
8741 background: #9e9e9e;
8742 color: #fff;
8743}
8744.md .chip.color-gray.chip-outline {
8745 background: none;
8746 border-color: #9e9e9e;
8747 color: #9e9e9e;
8748}
8749.md .chip.color-white {
8750 background: #ffffff;
8751 color: #fff;
8752}
8753.md .chip.color-white.chip-outline {
8754 background: none;
8755 border-color: #ffffff;
8756 color: #ffffff;
8757}
8758.md .chip.color-black {
8759 background: #000000;
8760 color: #fff;
8761}
8762.md .chip.color-black.chip-outline {
8763 background: none;
8764 border-color: #000000;
8765 color: #000000;
8766}
8767/* === Input === */
8768input[type="text"],
8769input[type="password"],
8770input[type="search"],
8771input[type="email"],
8772input[type="tel"],
8773input[type="url"],
8774input[type="date"],
8775input[type="datetime-local"],
8776input[type="time"],
8777input[type="number"],
8778select,
8779textarea {
8780 -webkit-box-sizing: border-box;
8781 box-sizing: border-box;
8782 -webkit-appearance: none;
8783 -moz-appearance: none;
8784 appearance: none;
8785 border: none;
8786 -webkit-box-shadow: none;
8787 box-shadow: none;
8788 border-radius: 0;
8789 outline: 0;
8790 display: block;
8791 padding: 0;
8792 margin: 0;
8793 font-family: inherit;
8794 background: none;
8795 resize: none;
8796 font-size: inherit;
8797 color: inherit;
8798}
8799.textarea-resizable-shadow {
8800 opacity: 0;
8801 position: absolute;
8802 z-index: -1000;
8803 pointer-events: none;
8804 left: -1000px;
8805 top: -1000px;
8806 visibility: hidden;
8807}
8808.list input[type="text"],
8809.list input[type="password"],
8810.list input[type="search"],
8811.list input[type="email"],
8812.list input[type="tel"],
8813.list input[type="url"],
8814.list input[type="date"],
8815.list input[type="datetime-local"],
8816.list input[type="time"],
8817.list input[type="number"],
8818.list select,
8819.list textarea {
8820 width: 100%;
8821}
8822.list input[type="datetime-local"] {
8823 max-width: 50vw;
8824}
8825.list input[type="date"],
8826.list input[type="datetime-local"] {
8827 line-height: 44px;
8828}
8829.list input[type="date"],
8830.list input[type="datetime-local"] {
8831 text-align: right;
8832 -webkit-box-orient: horizontal;
8833 -webkit-box-direction: reverse;
8834 -webkit-flex-direction: row-reverse;
8835 -ms-flex-direction: row-reverse;
8836 flex-direction: row-reverse;
8837 width: auto;
8838}
8839.list textarea {
8840 resize: none;
8841 line-height: 1.4;
8842 height: 100px;
8843}
8844.list .item-label,
8845.list .item-floating-label {
8846 vertical-align: top;
8847 -webkit-flex-shrink: 0;
8848 -ms-flex-negative: 0;
8849 flex-shrink: 0;
8850}
8851.list .item-input-wrap {
8852 width: 100%;
8853 -webkit-flex-shrink: 1;
8854 -ms-flex-negative: 1;
8855 flex-shrink: 1;
8856 position: relative;
8857}
8858.input {
8859 position: relative;
8860}
8861.input input,
8862.input select,
8863.input textarea {
8864 width: 100%;
8865}
8866.input-clear-button {
8867 opacity: 0;
8868 pointer-events: none;
8869 visibility: hidden;
8870 -webkit-transition-duration: 100ms;
8871 transition-duration: 100ms;
8872 position: absolute;
8873 top: 50%;
8874 border-radius: 50%;
8875 border: none;
8876 padding: 0;
8877 margin: 0;
8878 outline: 0;
8879 z-index: 1;
8880 cursor: pointer;
8881 background: none;
8882 left: 0;
8883}
8884.input-clear-button:after {
8885 content: '';
8886 position: absolute;
8887 width: 100%;
8888 height: 100%;
8889 left: 0;
8890 top: 0;
8891 background-repeat: no-repeat;
8892 background-position: center center;
8893}
8894.input-clear-button:before {
8895 position: absolute;
8896 content: '';
8897 left: 50%;
8898 top: 50%;
8899}
8900.input-with-value ~ .input-clear-button,
8901.item-input-with-value .input-clear-button,
8902.input-with-value .input-clear-button {
8903 opacity: 1;
8904 pointer-events: auto;
8905 visibility: visible;
8906}
8907.input-dropdown-wrap,
8908.input-dropdown {
8909 position: relative;
8910}
8911.input-dropdown-wrap:before,
8912.input-dropdown:before {
8913 content: '';
8914 pointer-events: none;
8915 position: absolute;
8916 top: 50%;
8917 margin-top: -2px;
8918 width: 0;
8919 height: 0;
8920 border-left: 5px solid transparent;
8921 border-right: 5px solid transparent;
8922 border-top: 5px solid #727272;
8923 left: 2px;
8924}
8925.input-dropdown-wrap select,
8926.input-dropdown select,
8927.input-dropdown-wrap input,
8928.input-dropdown input,
8929.input-dropdown-wrap textarea,
8930.input-dropdown textarea {
8931 padding-right: 14px;
8932}
8933.md .list input[type="text"],
8934.md .list input[type="password"],
8935.md .list input[type="search"],
8936.md .list input[type="email"],
8937.md .list input[type="tel"],
8938.md .list input[type="url"],
8939.md .list input[type="date"],
8940.md .list input[type="datetime-local"],
8941.md .list input[type="time"],
8942.md .list input[type="number"],
8943.md .list select {
8944 height: 36px;
8945 color: #212121;
8946 font-size: 16px;
8947}
8948.md .list input[type="text"]::-webkit-input-placeholder,
8949.md .list input[type="password"]::-webkit-input-placeholder,
8950.md .list input[type="search"]::-webkit-input-placeholder,
8951.md .list input[type="email"]::-webkit-input-placeholder,
8952.md .list input[type="tel"]::-webkit-input-placeholder,
8953.md .list input[type="url"]::-webkit-input-placeholder,
8954.md .list input[type="date"]::-webkit-input-placeholder,
8955.md .list input[type="datetime-local"]::-webkit-input-placeholder,
8956.md .list input[type="time"]::-webkit-input-placeholder,
8957.md .list input[type="number"]::-webkit-input-placeholder,
8958.md .list select::-webkit-input-placeholder {
8959 color: rgba(0, 0, 0, 0.35);
8960}
8961.md .list input[type="text"]:-ms-input-placeholder,
8962.md .list input[type="password"]:-ms-input-placeholder,
8963.md .list input[type="search"]:-ms-input-placeholder,
8964.md .list input[type="email"]:-ms-input-placeholder,
8965.md .list input[type="tel"]:-ms-input-placeholder,
8966.md .list input[type="url"]:-ms-input-placeholder,
8967.md .list input[type="date"]:-ms-input-placeholder,
8968.md .list input[type="datetime-local"]:-ms-input-placeholder,
8969.md .list input[type="time"]:-ms-input-placeholder,
8970.md .list input[type="number"]:-ms-input-placeholder,
8971.md .list select:-ms-input-placeholder {
8972 color: rgba(0, 0, 0, 0.35);
8973}
8974.md .list input[type="text"]::-ms-input-placeholder,
8975.md .list input[type="password"]::-ms-input-placeholder,
8976.md .list input[type="search"]::-ms-input-placeholder,
8977.md .list input[type="email"]::-ms-input-placeholder,
8978.md .list input[type="tel"]::-ms-input-placeholder,
8979.md .list input[type="url"]::-ms-input-placeholder,
8980.md .list input[type="date"]::-ms-input-placeholder,
8981.md .list input[type="datetime-local"]::-ms-input-placeholder,
8982.md .list input[type="time"]::-ms-input-placeholder,
8983.md .list input[type="number"]::-ms-input-placeholder,
8984.md .list select::-ms-input-placeholder {
8985 color: rgba(0, 0, 0, 0.35);
8986}
8987.md .list input[type="text"]::placeholder,
8988.md .list input[type="password"]::placeholder,
8989.md .list input[type="search"]::placeholder,
8990.md .list input[type="email"]::placeholder,
8991.md .list input[type="tel"]::placeholder,
8992.md .list input[type="url"]::placeholder,
8993.md .list input[type="date"]::placeholder,
8994.md .list input[type="datetime-local"]::placeholder,
8995.md .list input[type="time"]::placeholder,
8996.md .list input[type="number"]::placeholder,
8997.md .list select::placeholder {
8998 color: rgba(0, 0, 0, 0.35);
8999}
9000.md .list textarea {
9001 color: #212121;
9002 font-size: 16px;
9003 padding-top: 7px;
9004 padding-bottom: 7px;
9005}
9006.md .list textarea.resizable {
9007 height: 36px;
9008}
9009.md .list textarea::-webkit-input-placeholder {
9010 color: rgba(0, 0, 0, 0.35);
9011}
9012.md .list textarea:-ms-input-placeholder {
9013 color: rgba(0, 0, 0, 0.35);
9014}
9015.md .list textarea::-ms-input-placeholder {
9016 color: rgba(0, 0, 0, 0.35);
9017}
9018.md .list textarea::placeholder {
9019 color: rgba(0, 0, 0, 0.35);
9020}
9021.md .item-input-wrap:after,
9022.md .input:after {
9023 -webkit-transition-duration: 200ms;
9024 transition-duration: 200ms;
9025}
9026.md .item-input-wrap {
9027 min-height: 36px;
9028}
9029.md .item-input-wrap:after {
9030 content: '';
9031 position: absolute;
9032 background-color: rgba(0, 0, 0, 0.12);
9033 display: block;
9034 z-index: 15;
9035 top: auto;
9036 right: auto;
9037 bottom: 0;
9038 left: 0;
9039 height: 1px;
9040 width: 100%;
9041 -webkit-transform-origin: 50% 100%;
9042 transform-origin: 50% 100%;
9043}
9044.md.device-pixel-ratio-2 .item-input-wrap:after {
9045 -webkit-transform: scaleY(0.5);
9046 transform: scaleY(0.5);
9047}
9048.md.device-pixel-ratio-3 .item-input-wrap:after {
9049 -webkit-transform: scaleY(0.33);
9050 transform: scaleY(0.33);
9051}
9052.md .input:after {
9053 content: '';
9054 position: absolute;
9055 background-color: rgba(0, 0, 0, 0.12);
9056 display: block;
9057 z-index: 15;
9058 top: auto;
9059 right: auto;
9060 bottom: 0;
9061 left: 0;
9062 height: 1px;
9063 width: 100%;
9064 -webkit-transform-origin: 50% 100%;
9065 transform-origin: 50% 100%;
9066}
9067.md.device-pixel-ratio-2 .input:after {
9068 -webkit-transform: scaleY(0.5);
9069 transform: scaleY(0.5);
9070}
9071.md.device-pixel-ratio-3 .input:after {
9072 -webkit-transform: scaleY(0.33);
9073 transform: scaleY(0.33);
9074}
9075.md .item-label,
9076.md .item-floating-label {
9077 font-size: 12px;
9078 width: 100%;
9079 color: rgba(0, 0, 0, 0.65);
9080 -webkit-transition-duration: 200ms;
9081 transition-duration: 200ms;
9082 line-height: 13px;
9083 -webkit-transition-property: color, -webkit-transform;
9084 transition-property: color, -webkit-transform;
9085 transition-property: transform, color;
9086 transition-property: transform, color, -webkit-transform;
9087}
9088.md .item-floating-label {
9089 -webkit-transform: scale(1.33333333) translateY(18px);
9090 transform: scale(1.33333333) translateY(18px);
9091 color: rgba(0, 0, 0, 0.35);
9092 width: auto;
9093 max-width: 75%;
9094 pointer-events: none;
9095 -webkit-transform-origin: right;
9096 transform-origin: right;
9097}
9098.md .item-floating-label ~ .item-input-wrap input::-webkit-input-placeholder,
9099.md .item-floating-label ~ .item-input-wrap textarea::-webkit-input-placeholder {
9100 opacity: 0;
9101 -webkit-transition-duration: 100ms;
9102 transition-duration: 100ms;
9103}
9104.md .item-floating-label ~ .item-input-wrap input:-ms-input-placeholder,
9105.md .item-floating-label ~ .item-input-wrap textarea:-ms-input-placeholder {
9106 opacity: 0;
9107 transition-duration: 100ms;
9108}
9109.md .item-floating-label ~ .item-input-wrap input::-ms-input-placeholder,
9110.md .item-floating-label ~ .item-input-wrap textarea::-ms-input-placeholder {
9111 opacity: 0;
9112 transition-duration: 100ms;
9113}
9114.md .item-floating-label ~ .item-input-wrap input::placeholder,
9115.md .item-floating-label ~ .item-input-wrap textarea::placeholder {
9116 opacity: 0;
9117 -webkit-transition-duration: 100ms;
9118 transition-duration: 100ms;
9119}
9120.md .item-floating-label ~ .item-input-wrap input.input-focused::-webkit-input-placeholder,
9121.md .item-floating-label ~ .item-input-wrap textarea.input-focused::-webkit-input-placeholder {
9122 opacity: 1;
9123 -webkit-transition-duration: 300ms;
9124 transition-duration: 300ms;
9125}
9126.md .item-floating-label ~ .item-input-wrap input.input-focused:-ms-input-placeholder,
9127.md .item-floating-label ~ .item-input-wrap textarea.input-focused:-ms-input-placeholder {
9128 opacity: 1;
9129 transition-duration: 300ms;
9130}
9131.md .item-floating-label ~ .item-input-wrap input.input-focused::-ms-input-placeholder,
9132.md .item-floating-label ~ .item-input-wrap textarea.input-focused::-ms-input-placeholder {
9133 opacity: 1;
9134 transition-duration: 300ms;
9135}
9136.md .item-floating-label ~ .item-input-wrap input.input-focused::placeholder,
9137.md .item-floating-label ~ .item-input-wrap textarea.input-focused::placeholder {
9138 opacity: 1;
9139 -webkit-transition-duration: 300ms;
9140 transition-duration: 300ms;
9141}
9142.md .item-input-with-value .item-floating-label,
9143.md .item-input-focused .item-floating-label {
9144 -webkit-transform: scale(1) translateY(0);
9145 transform: scale(1) translateY(0);
9146}
9147.md .item-input-with-value .item-floating-label {
9148 color: rgba(0, 0, 0, 0.65);
9149}
9150.md .item-input .item-media {
9151 -webkit-align-self: flex-end;
9152 -ms-flex-item-align: end;
9153 align-self: flex-end;
9154}
9155.md .item-input .item-inner {
9156 display: block;
9157}
9158.md .item-input .item-inner:after {
9159 display: none !important;
9160}
9161.md .inline-labels .item-media,
9162.md .inline-label .item-media {
9163 -webkit-align-self: flex-start;
9164 -ms-flex-item-align: start;
9165 align-self: flex-start;
9166 padding-top: 14px;
9167}
9168.md .inline-labels .item-inner,
9169.md .inline-label .item-inner {
9170 display: -webkit-box;
9171 display: -webkit-flex;
9172 display: -ms-flexbox;
9173 display: flex;
9174}
9175.md .inline-labels .item-label,
9176.md .inline-label .item-label,
9177.md .inline-labels .item-floating-label,
9178.md .inline-label .item-floating-label {
9179 font-size: 16px;
9180 width: 30%;
9181 line-height: 1.5;
9182 -webkit-align-self: flex-start;
9183 -ms-flex-item-align: start;
9184 align-self: flex-start;
9185 padding-top: 7px;
9186}
9187.md .inline-labels .item-label + .item-input-wrap,
9188.md .inline-label .item-label + .item-input-wrap,
9189.md .inline-labels .item-floating-label + .item-input-wrap,
9190.md .inline-label .item-floating-label + .item-input-wrap {
9191 margin-right: 8px;
9192}
9193.md .item-input-with-error-message,
9194.md .item-input-with-info,
9195.md div.input-with-error-message,
9196.md div.input-with-info,
9197.md span.input-with-error-message,
9198.md span.input-with-info {
9199 padding-bottom: 20px;
9200}
9201.md .item-input-error-message,
9202.md .item-input-info,
9203.md .input-error-message,
9204.md .input-info {
9205 font-size: 12px;
9206 line-height: 1.4;
9207 position: absolute;
9208 top: 100%;
9209 margin-top: 4px;
9210 white-space: nowrap;
9211 overflow: hidden;
9212 text-overflow: ellipsis;
9213 display: block;
9214 right: 0;
9215 left: 16px;
9216}
9217.md .item-input-info,
9218.md .input-info {
9219 color: rgba(0, 0, 0, 0.45);
9220}
9221.md .item-input-error-message,
9222.md .input-error-message {
9223 color: #f44336;
9224 display: none;
9225}
9226.md .item-input-focused .item-label,
9227.md .item-input-focused .item-floating-label {
9228 color: #2196f3;
9229}
9230.md .item-input-focused .item-input-wrap:after,
9231.md .input-focused:after {
9232 background: #2196f3;
9233}
9234.md .item-input-invalid .item-label,
9235.md .item-invalid .item-label,
9236.md .item-input-invalid .item-floating-label,
9237.md .item-invalid .item-floating-label {
9238 color: #f44336;
9239}
9240.md .item-input-invalid .item-input-error-message,
9241.md .item-invalid .item-input-error-message,
9242.md .item-input-invalid .input-error-message,
9243.md .item-invalid .input-error-message {
9244 display: block;
9245}
9246.md .item-input-invalid .item-input-info,
9247.md .item-invalid .item-input-info,
9248.md .item-input-invalid .input-info,
9249.md .item-invalid .input-info {
9250 display: none;
9251}
9252.md .item-input-invalid .item-input-wrap:after,
9253.md .input-invalid:after {
9254 background: #f44336;
9255}
9256.md .item-input-invalid .item-input-wrap:after,
9257.md .item-input-focused .item-input-wrap:after {
9258 -webkit-transform: scaleY(2);
9259 transform: scaleY(2);
9260}
9261.md .input-invalid:after,
9262.md .input-focused:after {
9263 -webkit-transform: scaleY(2) !important;
9264 transform: scaleY(2) !important;
9265}
9266.md .input-clear-button {
9267 width: 24px;
9268 height: 24px;
9269 background: rgba(0, 0, 0, 0.12);
9270 margin-top: -12px;
9271}
9272.md .input-clear-button:after {
9273 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");
9274 background-size: 16px 16px;
9275 opacity: 0.54;
9276}
9277.md .input-clear-button:before {
9278 width: 48px;
9279 height: 48px;
9280 margin-left: -24px;
9281 margin-top: -24px;
9282}
9283.md .item-input-wrap .input-clear-button {
9284 bottom: 6px;
9285 margin-top: 0;
9286 top: auto;
9287}
9288.md .theme-dark input[type="text"],
9289.md .theme-dark input[type="password"],
9290.md .theme-dark input[type="search"],
9291.md .theme-dark input[type="email"],
9292.md .theme-dark input[type="tel"],
9293.md .theme-dark input[type="url"],
9294.md .theme-dark input[type="date"],
9295.md .theme-dark input[type="datetime-local"],
9296.md .theme-dark input[type="time"],
9297.md .theme-dark input[type="number"],
9298.md .theme-dark select,
9299.md .theme-dark textarea {
9300 color: rgba(255, 255, 255, 0.87);
9301}
9302.md .theme-dark input[type="text"]::-webkit-input-placeholder,
9303.md .theme-dark input[type="password"]::-webkit-input-placeholder,
9304.md .theme-dark input[type="search"]::-webkit-input-placeholder,
9305.md .theme-dark input[type="email"]::-webkit-input-placeholder,
9306.md .theme-dark input[type="tel"]::-webkit-input-placeholder,
9307.md .theme-dark input[type="url"]::-webkit-input-placeholder,
9308.md .theme-dark input[type="date"]::-webkit-input-placeholder,
9309.md .theme-dark input[type="datetime-local"]::-webkit-input-placeholder,
9310.md .theme-dark input[type="time"]::-webkit-input-placeholder,
9311.md .theme-dark input[type="number"]::-webkit-input-placeholder,
9312.md .theme-dark select::-webkit-input-placeholder,
9313.md .theme-dark textarea::-webkit-input-placeholder {
9314 color: rgba(255, 255, 255, 0.35);
9315}
9316.md .theme-dark input[type="text"]:-ms-input-placeholder,
9317.md .theme-dark input[type="password"]:-ms-input-placeholder,
9318.md .theme-dark input[type="search"]:-ms-input-placeholder,
9319.md .theme-dark input[type="email"]:-ms-input-placeholder,
9320.md .theme-dark input[type="tel"]:-ms-input-placeholder,
9321.md .theme-dark input[type="url"]:-ms-input-placeholder,
9322.md .theme-dark input[type="date"]:-ms-input-placeholder,
9323.md .theme-dark input[type="datetime-local"]:-ms-input-placeholder,
9324.md .theme-dark input[type="time"]:-ms-input-placeholder,
9325.md .theme-dark input[type="number"]:-ms-input-placeholder,
9326.md .theme-dark select:-ms-input-placeholder,
9327.md .theme-dark textarea:-ms-input-placeholder {
9328 color: rgba(255, 255, 255, 0.35);
9329}
9330.md .theme-dark input[type="text"]::-ms-input-placeholder,
9331.md .theme-dark input[type="password"]::-ms-input-placeholder,
9332.md .theme-dark input[type="search"]::-ms-input-placeholder,
9333.md .theme-dark input[type="email"]::-ms-input-placeholder,
9334.md .theme-dark input[type="tel"]::-ms-input-placeholder,
9335.md .theme-dark input[type="url"]::-ms-input-placeholder,
9336.md .theme-dark input[type="date"]::-ms-input-placeholder,
9337.md .theme-dark input[type="datetime-local"]::-ms-input-placeholder,
9338.md .theme-dark input[type="time"]::-ms-input-placeholder,
9339.md .theme-dark input[type="number"]::-ms-input-placeholder,
9340.md .theme-dark select::-ms-input-placeholder,
9341.md .theme-dark textarea::-ms-input-placeholder {
9342 color: rgba(255, 255, 255, 0.35);
9343}
9344.md .theme-dark input[type="text"]::placeholder,
9345.md .theme-dark input[type="password"]::placeholder,
9346.md .theme-dark input[type="search"]::placeholder,
9347.md .theme-dark input[type="email"]::placeholder,
9348.md .theme-dark input[type="tel"]::placeholder,
9349.md .theme-dark input[type="url"]::placeholder,
9350.md .theme-dark input[type="date"]::placeholder,
9351.md .theme-dark input[type="datetime-local"]::placeholder,
9352.md .theme-dark input[type="time"]::placeholder,
9353.md .theme-dark input[type="number"]::placeholder,
9354.md .theme-dark select::placeholder,
9355.md .theme-dark textarea::placeholder {
9356 color: rgba(255, 255, 255, 0.35);
9357}
9358.md .theme-dark .item-input:not(.item-input-focused) .item-input-wrap:after,
9359.md .theme-dark .input:after {
9360 background-color: rgba(255, 255, 255, 0.08);
9361}
9362.md .theme-dark .item-label,
9363.md .theme-dark .item-floating-label {
9364 color: rgba(255, 255, 255, 0.54);
9365}
9366.md .theme-dark .item-floating-label {
9367 color: rgba(255, 255, 255, 0.35);
9368}
9369.md .theme-dark .item-input-with-value .item-floating-label {
9370 color: rgba(255, 255, 255, 0.54);
9371}
9372.md .theme-dark .input-clear-button {
9373 background: #fff;
9374}
9375.md .color-theme-red .item-input-focused .item-label,
9376.md .color-theme-red .item-input-focused .item-floating-label {
9377 color: #f44336;
9378}
9379.md .color-theme-red .item-input-focused .item-input-wrap:after,
9380.md .color-theme-red .input-after:after {
9381 background: #f44336;
9382}
9383.md .color-theme-green .item-input-focused .item-label,
9384.md .color-theme-green .item-input-focused .item-floating-label {
9385 color: #4caf50;
9386}
9387.md .color-theme-green .item-input-focused .item-input-wrap:after,
9388.md .color-theme-green .input-after:after {
9389 background: #4caf50;
9390}
9391.md .color-theme-blue .item-input-focused .item-label,
9392.md .color-theme-blue .item-input-focused .item-floating-label {
9393 color: #2196f3;
9394}
9395.md .color-theme-blue .item-input-focused .item-input-wrap:after,
9396.md .color-theme-blue .input-after:after {
9397 background: #2196f3;
9398}
9399.md .color-theme-pink .item-input-focused .item-label,
9400.md .color-theme-pink .item-input-focused .item-floating-label {
9401 color: #e91e63;
9402}
9403.md .color-theme-pink .item-input-focused .item-input-wrap:after,
9404.md .color-theme-pink .input-after:after {
9405 background: #e91e63;
9406}
9407.md .color-theme-yellow .item-input-focused .item-label,
9408.md .color-theme-yellow .item-input-focused .item-floating-label {
9409 color: #ffeb3b;
9410}
9411.md .color-theme-yellow .item-input-focused .item-input-wrap:after,
9412.md .color-theme-yellow .input-after:after {
9413 background: #ffeb3b;
9414}
9415.md .color-theme-orange .item-input-focused .item-label,
9416.md .color-theme-orange .item-input-focused .item-floating-label {
9417 color: #ff9800;
9418}
9419.md .color-theme-orange .item-input-focused .item-input-wrap:after,
9420.md .color-theme-orange .input-after:after {
9421 background: #ff9800;
9422}
9423.md .color-theme-gray .item-input-focused .item-label,
9424.md .color-theme-gray .item-input-focused .item-floating-label {
9425 color: #9e9e9e;
9426}
9427.md .color-theme-gray .item-input-focused .item-input-wrap:after,
9428.md .color-theme-gray .input-after:after {
9429 background: #9e9e9e;
9430}
9431.md .color-theme-white .item-input-focused .item-label,
9432.md .color-theme-white .item-input-focused .item-floating-label {
9433 color: #ffffff;
9434}
9435.md .color-theme-white .item-input-focused .item-input-wrap:after,
9436.md .color-theme-white .input-after:after {
9437 background: #ffffff;
9438}
9439.md .color-theme-black .item-input-focused .item-label,
9440.md .color-theme-black .item-input-focused .item-floating-label {
9441 color: #000000;
9442}
9443.md .color-theme-black .item-input-focused .item-input-wrap:after,
9444.md .color-theme-black .input-after:after {
9445 background: #000000;
9446}
9447.md .item-input-focused.color-red .item-label,
9448.md .item-input-focused.color-red .item-floating-label {
9449 color: #f44336;
9450}
9451.md .item-input-focused.color-red .item-input-wrap:after,
9452.md .input-after.color-red:after {
9453 background: #f44336;
9454}
9455.md .item-input-focused.color-green .item-label,
9456.md .item-input-focused.color-green .item-floating-label {
9457 color: #4caf50;
9458}
9459.md .item-input-focused.color-green .item-input-wrap:after,
9460.md .input-after.color-green:after {
9461 background: #4caf50;
9462}
9463.md .item-input-focused.color-blue .item-label,
9464.md .item-input-focused.color-blue .item-floating-label {
9465 color: #2196f3;
9466}
9467.md .item-input-focused.color-blue .item-input-wrap:after,
9468.md .input-after.color-blue:after {
9469 background: #2196f3;
9470}
9471.md .item-input-focused.color-pink .item-label,
9472.md .item-input-focused.color-pink .item-floating-label {
9473 color: #e91e63;
9474}
9475.md .item-input-focused.color-pink .item-input-wrap:after,
9476.md .input-after.color-pink:after {
9477 background: #e91e63;
9478}
9479.md .item-input-focused.color-yellow .item-label,
9480.md .item-input-focused.color-yellow .item-floating-label {
9481 color: #ffeb3b;
9482}
9483.md .item-input-focused.color-yellow .item-input-wrap:after,
9484.md .input-after.color-yellow:after {
9485 background: #ffeb3b;
9486}
9487.md .item-input-focused.color-orange .item-label,
9488.md .item-input-focused.color-orange .item-floating-label {
9489 color: #ff9800;
9490}
9491.md .item-input-focused.color-orange .item-input-wrap:after,
9492.md .input-after.color-orange:after {
9493 background: #ff9800;
9494}
9495.md .item-input-focused.color-gray .item-label,
9496.md .item-input-focused.color-gray .item-floating-label {
9497 color: #9e9e9e;
9498}
9499.md .item-input-focused.color-gray .item-input-wrap:after,
9500.md .input-after.color-gray:after {
9501 background: #9e9e9e;
9502}
9503.md .item-input-focused.color-white .item-label,
9504.md .item-input-focused.color-white .item-floating-label {
9505 color: #ffffff;
9506}
9507.md .item-input-focused.color-white .item-input-wrap:after,
9508.md .input-after.color-white:after {
9509 background: #ffffff;
9510}
9511.md .item-input-focused.color-black .item-label,
9512.md .item-input-focused.color-black .item-floating-label {
9513 color: #000000;
9514}
9515.md .item-input-focused.color-black .item-input-wrap:after,
9516.md .input-after.color-black:after {
9517 background: #000000;
9518}
9519/* === Checkbox === */
9520.icon-checkbox,
9521.checkbox i {
9522 -webkit-flex-shrink: 0;
9523 -ms-flex-negative: 0;
9524 flex-shrink: 0;
9525}
9526.checkbox {
9527 position: relative;
9528 display: inline-block;
9529 vertical-align: middle;
9530 z-index: 1;
9531}
9532label.item-checkbox,
9533.checkbox {
9534 cursor: pointer;
9535}
9536label.item-checkbox input[type="checkbox"],
9537.checkbox input[type="checkbox"],
9538label.item-checkbox input[type="radio"],
9539.checkbox input[type="radio"] {
9540 display: none;
9541}
9542label.item-checkbox .icon-checkbox,
9543.checkbox .icon-checkbox {
9544 -webkit-box-sizing: border-box;
9545 box-sizing: border-box;
9546 position: relative;
9547 display: block;
9548}
9549label.item-checkbox .icon-checkbox:after,
9550.checkbox .icon-checkbox:after {
9551 content: '';
9552 position: absolute;
9553}
9554label.item-checkbox {
9555 -webkit-transition-duration: 300ms;
9556 transition-duration: 300ms;
9557}
9558label.item-checkbox.active-state:after {
9559 background-color: transparent;
9560}
9561label.item-checkbox.disabled,
9562.disabled label.item-checkbox {
9563 opacity: 0.55;
9564 pointer-events: none;
9565 opacity: 0.55 !important;
9566 pointer-events: none !important;
9567}
9568.md .icon-checkbox,
9569.md .checkbox i {
9570 width: 18px;
9571 height: 18px;
9572 border-radius: 2px;
9573 border: 2px solid #6d6d6d;
9574 -webkit-transition-duration: 200ms;
9575 transition-duration: 200ms;
9576 background-color: transparent;
9577}
9578.md .icon-checkbox:after,
9579.md .checkbox i:after {
9580 width: 18px;
9581 height: 18px;
9582 left: -2px;
9583 top: -2px;
9584 -webkit-transition-duration: 200ms;
9585 transition-duration: 200ms;
9586 opacity: 0;
9587 background: no-repeat center;
9588 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");
9589 background-size: 100% auto;
9590}
9591.md label.item-checkbox input[type="checkbox"]:checked ~ .icon-checkbox,
9592.md label.item-checkbox input[type="checkbox"]:checked ~ * .icon-checkbox,
9593.md .checkbox input[type="checkbox"]:checked ~ i {
9594 background-color: #2196f3;
9595 border-color: #2196f3;
9596}
9597.md label.item-checkbox input[type="checkbox"]:checked ~ .icon-checkbox:after,
9598.md label.item-checkbox input[type="checkbox"]:checked ~ * .icon-checkbox:after,
9599.md .checkbox input[type="checkbox"]:checked ~ i:after {
9600 opacity: 1;
9601}
9602.md label.item-checkbox {
9603 position: relative;
9604 overflow: hidden;
9605 z-index: 0;
9606}
9607.md label.item-checkbox > .icon-checkbox {
9608 margin-left: 38px;
9609}
9610.md label.item-checkbox .item-content .item-media,
9611.md label.item-checkbox.item-content .item-media {
9612 -webkit-align-self: center;
9613 -ms-flex-item-align: center;
9614 align-self: center;
9615}
9616.md label.item-checkbox.active-state {
9617 background-color: rgba(0, 0, 0, 0.1);
9618}
9619.md .theme-dark label.item-checkbox.active-state {
9620 background-color: rgba(255, 255, 255, 0.05);
9621}
9622.md .theme-dark .icon-checkbox,
9623.md .theme-dark .checkbox i {
9624 border-color: rgba(255, 255, 255, 0.54);
9625}
9626.md .color-theme-red label.item-checkbox input[type="checkbox"]:checked ~ .icon-checkbox,
9627.md .color-theme-red label.item-checkbox input[type="checkbox"]:checked ~ * .icon-checkbox,
9628.md .color-theme-red .checkbox input[type="checkbox"]:checked ~ i {
9629 background-color: #f44336;
9630 border-color: #f44336;
9631}
9632.md .color-theme-red .checkbox .ripple-wave {
9633 background: rgba(244, 67, 54, 0.5);
9634}
9635.md .color-theme-green label.item-checkbox input[type="checkbox"]:checked ~ .icon-checkbox,
9636.md .color-theme-green label.item-checkbox input[type="checkbox"]:checked ~ * .icon-checkbox,
9637.md .color-theme-green .checkbox input[type="checkbox"]:checked ~ i {
9638 background-color: #4caf50;
9639 border-color: #4caf50;
9640}
9641.md .color-theme-green .checkbox .ripple-wave {
9642 background: rgba(76, 175, 80, 0.5);
9643}
9644.md .color-theme-blue label.item-checkbox input[type="checkbox"]:checked ~ .icon-checkbox,
9645.md .color-theme-blue label.item-checkbox input[type="checkbox"]:checked ~ * .icon-checkbox,
9646.md .color-theme-blue .checkbox input[type="checkbox"]:checked ~ i {
9647 background-color: #2196f3;
9648 border-color: #2196f3;
9649}
9650.md .color-theme-blue .checkbox .ripple-wave {
9651 background: rgba(33, 150, 243, 0.5);
9652}
9653.md .color-theme-pink label.item-checkbox input[type="checkbox"]:checked ~ .icon-checkbox,
9654.md .color-theme-pink label.item-checkbox input[type="checkbox"]:checked ~ * .icon-checkbox,
9655.md .color-theme-pink .checkbox input[type="checkbox"]:checked ~ i {
9656 background-color: #e91e63;
9657 border-color: #e91e63;
9658}
9659.md .color-theme-pink .checkbox .ripple-wave {
9660 background: rgba(233, 30, 99, 0.5);
9661}
9662.md .color-theme-yellow label.item-checkbox input[type="checkbox"]:checked ~ .icon-checkbox,
9663.md .color-theme-yellow label.item-checkbox input[type="checkbox"]:checked ~ * .icon-checkbox,
9664.md .color-theme-yellow .checkbox input[type="checkbox"]:checked ~ i {
9665 background-color: #ffeb3b;
9666 border-color: #ffeb3b;
9667}
9668.md .color-theme-yellow .checkbox .ripple-wave {
9669 background: rgba(255, 235, 59, 0.5);
9670}
9671.md .color-theme-orange label.item-checkbox input[type="checkbox"]:checked ~ .icon-checkbox,
9672.md .color-theme-orange label.item-checkbox input[type="checkbox"]:checked ~ * .icon-checkbox,
9673.md .color-theme-orange .checkbox input[type="checkbox"]:checked ~ i {
9674 background-color: #ff9800;
9675 border-color: #ff9800;
9676}
9677.md .color-theme-orange .checkbox .ripple-wave {
9678 background: rgba(255, 152, 0, 0.5);
9679}
9680.md .color-theme-gray label.item-checkbox input[type="checkbox"]:checked ~ .icon-checkbox,
9681.md .color-theme-gray label.item-checkbox input[type="checkbox"]:checked ~ * .icon-checkbox,
9682.md .color-theme-gray .checkbox input[type="checkbox"]:checked ~ i {
9683 background-color: #9e9e9e;
9684 border-color: #9e9e9e;
9685}
9686.md .color-theme-gray .checkbox .ripple-wave {
9687 background: rgba(158, 158, 158, 0.5);
9688}
9689.md .color-theme-white label.item-checkbox input[type="checkbox"]:checked ~ .icon-checkbox,
9690.md .color-theme-white label.item-checkbox input[type="checkbox"]:checked ~ * .icon-checkbox,
9691.md .color-theme-white .checkbox input[type="checkbox"]:checked ~ i {
9692 background-color: #ffffff;
9693 border-color: #ffffff;
9694}
9695.md .color-theme-white .checkbox .ripple-wave {
9696 background: rgba(255, 255, 255, 0.5);
9697}
9698.md .color-theme-black label.item-checkbox input[type="checkbox"]:checked ~ .icon-checkbox,
9699.md .color-theme-black label.item-checkbox input[type="checkbox"]:checked ~ * .icon-checkbox,
9700.md .color-theme-black .checkbox input[type="checkbox"]:checked ~ i {
9701 background-color: #000000;
9702 border-color: #000000;
9703}
9704.md .color-theme-black .checkbox .ripple-wave {
9705 background: rgba(0, 0, 0, 0.5);
9706}
9707.md label.item-checkbox.color-red input[type="checkbox"]:checked ~ .icon-checkbox,
9708.md label.item-checkbox.color-red input[type="checkbox"]:checked ~ * .icon-checkbox,
9709.md .checkbox.color-red input[type="checkbox"]:checked ~ i {
9710 background-color: #f44336;
9711 border-color: #f44336;
9712}
9713.md .checkbox.color-red .ripple-wave {
9714 background: rgba(244, 67, 54, 0.5);
9715}
9716.md label.item-checkbox.color-green input[type="checkbox"]:checked ~ .icon-checkbox,
9717.md label.item-checkbox.color-green input[type="checkbox"]:checked ~ * .icon-checkbox,
9718.md .checkbox.color-green input[type="checkbox"]:checked ~ i {
9719 background-color: #4caf50;
9720 border-color: #4caf50;
9721}
9722.md .checkbox.color-green .ripple-wave {
9723 background: rgba(76, 175, 80, 0.5);
9724}
9725.md label.item-checkbox.color-blue input[type="checkbox"]:checked ~ .icon-checkbox,
9726.md label.item-checkbox.color-blue input[type="checkbox"]:checked ~ * .icon-checkbox,
9727.md .checkbox.color-blue input[type="checkbox"]:checked ~ i {
9728 background-color: #2196f3;
9729 border-color: #2196f3;
9730}
9731.md .checkbox.color-blue .ripple-wave {
9732 background: rgba(33, 150, 243, 0.5);
9733}
9734.md label.item-checkbox.color-pink input[type="checkbox"]:checked ~ .icon-checkbox,
9735.md label.item-checkbox.color-pink input[type="checkbox"]:checked ~ * .icon-checkbox,
9736.md .checkbox.color-pink input[type="checkbox"]:checked ~ i {
9737 background-color: #e91e63;
9738 border-color: #e91e63;
9739}
9740.md .checkbox.color-pink .ripple-wave {
9741 background: rgba(233, 30, 99, 0.5);
9742}
9743.md label.item-checkbox.color-yellow input[type="checkbox"]:checked ~ .icon-checkbox,
9744.md label.item-checkbox.color-yellow input[type="checkbox"]:checked ~ * .icon-checkbox,
9745.md .checkbox.color-yellow input[type="checkbox"]:checked ~ i {
9746 background-color: #ffeb3b;
9747 border-color: #ffeb3b;
9748}
9749.md .checkbox.color-yellow .ripple-wave {
9750 background: rgba(255, 235, 59, 0.5);
9751}
9752.md label.item-checkbox.color-orange input[type="checkbox"]:checked ~ .icon-checkbox,
9753.md label.item-checkbox.color-orange input[type="checkbox"]:checked ~ * .icon-checkbox,
9754.md .checkbox.color-orange input[type="checkbox"]:checked ~ i {
9755 background-color: #ff9800;
9756 border-color: #ff9800;
9757}
9758.md .checkbox.color-orange .ripple-wave {
9759 background: rgba(255, 152, 0, 0.5);
9760}
9761.md label.item-checkbox.color-gray input[type="checkbox"]:checked ~ .icon-checkbox,
9762.md label.item-checkbox.color-gray input[type="checkbox"]:checked ~ * .icon-checkbox,
9763.md .checkbox.color-gray input[type="checkbox"]:checked ~ i {
9764 background-color: #9e9e9e;
9765 border-color: #9e9e9e;
9766}
9767.md .checkbox.color-gray .ripple-wave {
9768 background: rgba(158, 158, 158, 0.5);
9769}
9770.md label.item-checkbox.color-white input[type="checkbox"]:checked ~ .icon-checkbox,
9771.md label.item-checkbox.color-white input[type="checkbox"]:checked ~ * .icon-checkbox,
9772.md .checkbox.color-white input[type="checkbox"]:checked ~ i {
9773 background-color: #ffffff;
9774 border-color: #ffffff;
9775}
9776.md .checkbox.color-white .ripple-wave {
9777 background: rgba(255, 255, 255, 0.5);
9778}
9779.md label.item-checkbox.color-black input[type="checkbox"]:checked ~ .icon-checkbox,
9780.md label.item-checkbox.color-black input[type="checkbox"]:checked ~ * .icon-checkbox,
9781.md .checkbox.color-black input[type="checkbox"]:checked ~ i {
9782 background-color: #000000;
9783 border-color: #000000;
9784}
9785.md .checkbox.color-black .ripple-wave {
9786 background: rgba(0, 0, 0, 0.5);
9787}
9788/* === Radio === */
9789.icon-radio {
9790 -webkit-flex-shrink: 0;
9791 -ms-flex-negative: 0;
9792 flex-shrink: 0;
9793}
9794.radio {
9795 position: relative;
9796 display: inline-block;
9797 vertical-align: middle;
9798 z-index: 1;
9799}
9800label.item-radio,
9801.radio {
9802 cursor: pointer;
9803}
9804label.item-radio input[type="checkbox"],
9805.radio input[type="checkbox"],
9806label.item-radio input[type="radio"],
9807.radio input[type="radio"] {
9808 display: none;
9809}
9810label.item-radio .icon-radio,
9811.radio .icon-radio {
9812 -webkit-box-sizing: border-box;
9813 box-sizing: border-box;
9814 position: relative;
9815 display: block;
9816}
9817label.item-radio .icon-radio:after,
9818.radio .icon-radio:after {
9819 content: '';
9820 position: absolute;
9821}
9822label.item-radio {
9823 -webkit-transition-duration: 300ms;
9824 transition-duration: 300ms;
9825}
9826label.item-radio.active-state:after {
9827 background-color: transparent;
9828}
9829label.item-radio.disabled,
9830.disabled label.item-radio {
9831 opacity: 0.55;
9832 pointer-events: none;
9833 opacity: 0.55 !important;
9834 pointer-events: none !important;
9835}
9836.md .icon-radio {
9837 width: 20px;
9838 height: 20px;
9839 position: relative;
9840 border-radius: 50%;
9841 border: 2px solid #6d6d6d;
9842 -webkit-box-sizing: border-box;
9843 box-sizing: border-box;
9844 -webkit-transition-duration: 200ms;
9845 transition-duration: 200ms;
9846 display: block;
9847}
9848.md .icon-radio:after {
9849 content: '';
9850 position: absolute;
9851 width: 10px;
9852 height: 10px;
9853 left: 50%;
9854 top: 50%;
9855 margin-left: -5px;
9856 margin-top: -5px;
9857 background-color: #2196f3;
9858 border-radius: 50%;
9859 -webkit-transform: scale(0);
9860 transform: scale(0);
9861 -webkit-transition-duration: 200ms;
9862 transition-duration: 200ms;
9863}
9864.md label.item-radio input[type="radio"]:checked ~ .icon-radio,
9865.md label.item-radio input[type="radio"]:checked ~ * .icon-radio,
9866.md .radio input[type="radio"]:checked ~ .icon-radio {
9867 border-color: #2196f3;
9868}
9869.md label.item-radio input[type="radio"]:checked ~ .icon-radio:after,
9870.md label.item-radio input[type="radio"]:checked ~ * .icon-radio:after,
9871.md .radio input[type="radio"]:checked ~ .icon-radio:after {
9872 background-color: #2196f3;
9873 -webkit-transform: scale(1);
9874 transform: scale(1);
9875}
9876.md label.item-radio {
9877 position: relative;
9878 overflow: hidden;
9879 z-index: 0;
9880}
9881.md label.item-radio > .icon-radio {
9882 margin-left: 38px;
9883}
9884.md label.item-radio .item-content .item-media,
9885.md label.item-radio.item-content .item-media {
9886 -webkit-align-self: center;
9887 -ms-flex-item-align: center;
9888 align-self: center;
9889}
9890.md label.item-radio.active-state {
9891 background-color: rgba(0, 0, 0, 0.1);
9892}
9893.md .theme-dark label.item-radio.active-state {
9894 background-color: rgba(255, 255, 255, 0.05);
9895}
9896.md .theme-dark .icon-radio {
9897 border-color: rgba(255, 255, 255, 0.54);
9898}
9899.md .color-theme-red .icon-radio:after {
9900 background-color: #f44336;
9901}
9902.md .color-theme-red label.item-radio input[type="radio"]:checked ~ .icon-radio,
9903.md .color-theme-red label.item-radio input[type="radio"]:checked ~ * .icon-radio,
9904.md .color-theme-red .radio input[type="radio"]:checked ~ .icon-radio {
9905 border-color: #f44336;
9906}
9907.md .color-theme-red label.item-radio input[type="radio"]:checked ~ .icon-radio:after,
9908.md .color-theme-red label.item-radio input[type="radio"]:checked ~ * .icon-radio:after,
9909.md .color-theme-red .radio input[type="radio"]:checked ~ .icon-radio:after {
9910 background-color: #f44336;
9911}
9912.md .color-theme-red .radio .ripple-wave {
9913 background: rgba(244, 67, 54, 0.5);
9914}
9915.md .color-theme-green .icon-radio:after {
9916 background-color: #4caf50;
9917}
9918.md .color-theme-green label.item-radio input[type="radio"]:checked ~ .icon-radio,
9919.md .color-theme-green label.item-radio input[type="radio"]:checked ~ * .icon-radio,
9920.md .color-theme-green .radio input[type="radio"]:checked ~ .icon-radio {
9921 border-color: #4caf50;
9922}
9923.md .color-theme-green label.item-radio input[type="radio"]:checked ~ .icon-radio:after,
9924.md .color-theme-green label.item-radio input[type="radio"]:checked ~ * .icon-radio:after,
9925.md .color-theme-green .radio input[type="radio"]:checked ~ .icon-radio:after {
9926 background-color: #4caf50;
9927}
9928.md .color-theme-green .radio .ripple-wave {
9929 background: rgba(76, 175, 80, 0.5);
9930}
9931.md .color-theme-blue .icon-radio:after {
9932 background-color: #2196f3;
9933}
9934.md .color-theme-blue label.item-radio input[type="radio"]:checked ~ .icon-radio,
9935.md .color-theme-blue label.item-radio input[type="radio"]:checked ~ * .icon-radio,
9936.md .color-theme-blue .radio input[type="radio"]:checked ~ .icon-radio {
9937 border-color: #2196f3;
9938}
9939.md .color-theme-blue label.item-radio input[type="radio"]:checked ~ .icon-radio:after,
9940.md .color-theme-blue label.item-radio input[type="radio"]:checked ~ * .icon-radio:after,
9941.md .color-theme-blue .radio input[type="radio"]:checked ~ .icon-radio:after {
9942 background-color: #2196f3;
9943}
9944.md .color-theme-blue .radio .ripple-wave {
9945 background: rgba(33, 150, 243, 0.5);
9946}
9947.md .color-theme-pink .icon-radio:after {
9948 background-color: #e91e63;
9949}
9950.md .color-theme-pink label.item-radio input[type="radio"]:checked ~ .icon-radio,
9951.md .color-theme-pink label.item-radio input[type="radio"]:checked ~ * .icon-radio,
9952.md .color-theme-pink .radio input[type="radio"]:checked ~ .icon-radio {
9953 border-color: #e91e63;
9954}
9955.md .color-theme-pink label.item-radio input[type="radio"]:checked ~ .icon-radio:after,
9956.md .color-theme-pink label.item-radio input[type="radio"]:checked ~ * .icon-radio:after,
9957.md .color-theme-pink .radio input[type="radio"]:checked ~ .icon-radio:after {
9958 background-color: #e91e63;
9959}
9960.md .color-theme-pink .radio .ripple-wave {
9961 background: rgba(233, 30, 99, 0.5);
9962}
9963.md .color-theme-yellow .icon-radio:after {
9964 background-color: #ffeb3b;
9965}
9966.md .color-theme-yellow label.item-radio input[type="radio"]:checked ~ .icon-radio,
9967.md .color-theme-yellow label.item-radio input[type="radio"]:checked ~ * .icon-radio,
9968.md .color-theme-yellow .radio input[type="radio"]:checked ~ .icon-radio {
9969 border-color: #ffeb3b;
9970}
9971.md .color-theme-yellow label.item-radio input[type="radio"]:checked ~ .icon-radio:after,
9972.md .color-theme-yellow label.item-radio input[type="radio"]:checked ~ * .icon-radio:after,
9973.md .color-theme-yellow .radio input[type="radio"]:checked ~ .icon-radio:after {
9974 background-color: #ffeb3b;
9975}
9976.md .color-theme-yellow .radio .ripple-wave {
9977 background: rgba(255, 235, 59, 0.5);
9978}
9979.md .color-theme-orange .icon-radio:after {
9980 background-color: #ff9800;
9981}
9982.md .color-theme-orange label.item-radio input[type="radio"]:checked ~ .icon-radio,
9983.md .color-theme-orange label.item-radio input[type="radio"]:checked ~ * .icon-radio,
9984.md .color-theme-orange .radio input[type="radio"]:checked ~ .icon-radio {
9985 border-color: #ff9800;
9986}
9987.md .color-theme-orange label.item-radio input[type="radio"]:checked ~ .icon-radio:after,
9988.md .color-theme-orange label.item-radio input[type="radio"]:checked ~ * .icon-radio:after,
9989.md .color-theme-orange .radio input[type="radio"]:checked ~ .icon-radio:after {
9990 background-color: #ff9800;
9991}
9992.md .color-theme-orange .radio .ripple-wave {
9993 background: rgba(255, 152, 0, 0.5);
9994}
9995.md .color-theme-gray .icon-radio:after {
9996 background-color: #9e9e9e;
9997}
9998.md .color-theme-gray label.item-radio input[type="radio"]:checked ~ .icon-radio,
9999.md .color-theme-gray label.item-radio input[type="radio"]:checked ~ * .icon-radio,
10000.md .color-theme-gray .radio input[type="radio"]:checked ~ .icon-radio {
10001 border-color: #9e9e9e;
10002}
10003.md .color-theme-gray label.item-radio input[type="radio"]:checked ~ .icon-radio:after,
10004.md .color-theme-gray label.item-radio input[type="radio"]:checked ~ * .icon-radio:after,
10005.md .color-theme-gray .radio input[type="radio"]:checked ~ .icon-radio:after {
10006 background-color: #9e9e9e;
10007}
10008.md .color-theme-gray .radio .ripple-wave {
10009 background: rgba(158, 158, 158, 0.5);
10010}
10011.md .color-theme-white .icon-radio:after {
10012 background-color: #ffffff;
10013}
10014.md .color-theme-white label.item-radio input[type="radio"]:checked ~ .icon-radio,
10015.md .color-theme-white label.item-radio input[type="radio"]:checked ~ * .icon-radio,
10016.md .color-theme-white .radio input[type="radio"]:checked ~ .icon-radio {
10017 border-color: #ffffff;
10018}
10019.md .color-theme-white label.item-radio input[type="radio"]:checked ~ .icon-radio:after,
10020.md .color-theme-white label.item-radio input[type="radio"]:checked ~ * .icon-radio:after,
10021.md .color-theme-white .radio input[type="radio"]:checked ~ .icon-radio:after {
10022 background-color: #ffffff;
10023}
10024.md .color-theme-white .radio .ripple-wave {
10025 background: rgba(255, 255, 255, 0.5);
10026}
10027.md .color-theme-black .icon-radio:after {
10028 background-color: #000000;
10029}
10030.md .color-theme-black label.item-radio input[type="radio"]:checked ~ .icon-radio,
10031.md .color-theme-black label.item-radio input[type="radio"]:checked ~ * .icon-radio,
10032.md .color-theme-black .radio input[type="radio"]:checked ~ .icon-radio {
10033 border-color: #000000;
10034}
10035.md .color-theme-black label.item-radio input[type="radio"]:checked ~ .icon-radio:after,
10036.md .color-theme-black label.item-radio input[type="radio"]:checked ~ * .icon-radio:after,
10037.md .color-theme-black .radio input[type="radio"]:checked ~ .icon-radio:after {
10038 background-color: #000000;
10039}
10040.md .color-theme-black .radio .ripple-wave {
10041 background: rgba(0, 0, 0, 0.5);
10042}
10043.md .radio.color-red .icon-radio:after {
10044 background-color: #f44336;
10045}
10046.md label.item-radio.color-red input[type="radio"]:checked ~ .icon-radio,
10047.md label.item-radio.color-red input[type="radio"]:checked ~ * .icon-radio,
10048.md .radio.color-red input[type="radio"]:checked ~ .icon-radio {
10049 border-color: #f44336;
10050}
10051.md label.item-radio.color-red input[type="radio"]:checked ~ .icon-radio:after,
10052.md label.item-radio.color-red input[type="radio"]:checked ~ * .icon-radio:after,
10053.md .radio.color-red input[type="radio"]:checked ~ .icon-radio:after {
10054 background-color: #f44336;
10055}
10056.md .radio.color-red .ripple-wave {
10057 background: rgba(244, 67, 54, 0.5);
10058}
10059.md .radio.color-green .icon-radio:after {
10060 background-color: #4caf50;
10061}
10062.md label.item-radio.color-green input[type="radio"]:checked ~ .icon-radio,
10063.md label.item-radio.color-green input[type="radio"]:checked ~ * .icon-radio,
10064.md .radio.color-green input[type="radio"]:checked ~ .icon-radio {
10065 border-color: #4caf50;
10066}
10067.md label.item-radio.color-green input[type="radio"]:checked ~ .icon-radio:after,
10068.md label.item-radio.color-green input[type="radio"]:checked ~ * .icon-radio:after,
10069.md .radio.color-green input[type="radio"]:checked ~ .icon-radio:after {
10070 background-color: #4caf50;
10071}
10072.md .radio.color-green .ripple-wave {
10073 background: rgba(76, 175, 80, 0.5);
10074}
10075.md .radio.color-blue .icon-radio:after {
10076 background-color: #2196f3;
10077}
10078.md label.item-radio.color-blue input[type="radio"]:checked ~ .icon-radio,
10079.md label.item-radio.color-blue input[type="radio"]:checked ~ * .icon-radio,
10080.md .radio.color-blue input[type="radio"]:checked ~ .icon-radio {
10081 border-color: #2196f3;
10082}
10083.md label.item-radio.color-blue input[type="radio"]:checked ~ .icon-radio:after,
10084.md label.item-radio.color-blue input[type="radio"]:checked ~ * .icon-radio:after,
10085.md .radio.color-blue input[type="radio"]:checked ~ .icon-radio:after {
10086 background-color: #2196f3;
10087}
10088.md .radio.color-blue .ripple-wave {
10089 background: rgba(33, 150, 243, 0.5);
10090}
10091.md .radio.color-pink .icon-radio:after {
10092 background-color: #e91e63;
10093}
10094.md label.item-radio.color-pink input[type="radio"]:checked ~ .icon-radio,
10095.md label.item-radio.color-pink input[type="radio"]:checked ~ * .icon-radio,
10096.md .radio.color-pink input[type="radio"]:checked ~ .icon-radio {
10097 border-color: #e91e63;
10098}
10099.md label.item-radio.color-pink input[type="radio"]:checked ~ .icon-radio:after,
10100.md label.item-radio.color-pink input[type="radio"]:checked ~ * .icon-radio:after,
10101.md .radio.color-pink input[type="radio"]:checked ~ .icon-radio:after {
10102 background-color: #e91e63;
10103}
10104.md .radio.color-pink .ripple-wave {
10105 background: rgba(233, 30, 99, 0.5);
10106}
10107.md .radio.color-yellow .icon-radio:after {
10108 background-color: #ffeb3b;
10109}
10110.md label.item-radio.color-yellow input[type="radio"]:checked ~ .icon-radio,
10111.md label.item-radio.color-yellow input[type="radio"]:checked ~ * .icon-radio,
10112.md .radio.color-yellow input[type="radio"]:checked ~ .icon-radio {
10113 border-color: #ffeb3b;
10114}
10115.md label.item-radio.color-yellow input[type="radio"]:checked ~ .icon-radio:after,
10116.md label.item-radio.color-yellow input[type="radio"]:checked ~ * .icon-radio:after,
10117.md .radio.color-yellow input[type="radio"]:checked ~ .icon-radio:after {
10118 background-color: #ffeb3b;
10119}
10120.md .radio.color-yellow .ripple-wave {
10121 background: rgba(255, 235, 59, 0.5);
10122}
10123.md .radio.color-orange .icon-radio:after {
10124 background-color: #ff9800;
10125}
10126.md label.item-radio.color-orange input[type="radio"]:checked ~ .icon-radio,
10127.md label.item-radio.color-orange input[type="radio"]:checked ~ * .icon-radio,
10128.md .radio.color-orange input[type="radio"]:checked ~ .icon-radio {
10129 border-color: #ff9800;
10130}
10131.md label.item-radio.color-orange input[type="radio"]:checked ~ .icon-radio:after,
10132.md label.item-radio.color-orange input[type="radio"]:checked ~ * .icon-radio:after,
10133.md .radio.color-orange input[type="radio"]:checked ~ .icon-radio:after {
10134 background-color: #ff9800;
10135}
10136.md .radio.color-orange .ripple-wave {
10137 background: rgba(255, 152, 0, 0.5);
10138}
10139.md .radio.color-gray .icon-radio:after {
10140 background-color: #9e9e9e;
10141}
10142.md label.item-radio.color-gray input[type="radio"]:checked ~ .icon-radio,
10143.md label.item-radio.color-gray input[type="radio"]:checked ~ * .icon-radio,
10144.md .radio.color-gray input[type="radio"]:checked ~ .icon-radio {
10145 border-color: #9e9e9e;
10146}
10147.md label.item-radio.color-gray input[type="radio"]:checked ~ .icon-radio:after,
10148.md label.item-radio.color-gray input[type="radio"]:checked ~ * .icon-radio:after,
10149.md .radio.color-gray input[type="radio"]:checked ~ .icon-radio:after {
10150 background-color: #9e9e9e;
10151}
10152.md .radio.color-gray .ripple-wave {
10153 background: rgba(158, 158, 158, 0.5);
10154}
10155.md .radio.color-white .icon-radio:after {
10156 background-color: #ffffff;
10157}
10158.md label.item-radio.color-white input[type="radio"]:checked ~ .icon-radio,
10159.md label.item-radio.color-white input[type="radio"]:checked ~ * .icon-radio,
10160.md .radio.color-white input[type="radio"]:checked ~ .icon-radio {
10161 border-color: #ffffff;
10162}
10163.md label.item-radio.color-white input[type="radio"]:checked ~ .icon-radio:after,
10164.md label.item-radio.color-white input[type="radio"]:checked ~ * .icon-radio:after,
10165.md .radio.color-white input[type="radio"]:checked ~ .icon-radio:after {
10166 background-color: #ffffff;
10167}
10168.md .radio.color-white .ripple-wave {
10169 background: rgba(255, 255, 255, 0.5);
10170}
10171.md .radio.color-black .icon-radio:after {
10172 background-color: #000000;
10173}
10174.md label.item-radio.color-black input[type="radio"]:checked ~ .icon-radio,
10175.md label.item-radio.color-black input[type="radio"]:checked ~ * .icon-radio,
10176.md .radio.color-black input[type="radio"]:checked ~ .icon-radio {
10177 border-color: #000000;
10178}
10179.md label.item-radio.color-black input[type="radio"]:checked ~ .icon-radio:after,
10180.md label.item-radio.color-black input[type="radio"]:checked ~ * .icon-radio:after,
10181.md .radio.color-black input[type="radio"]:checked ~ .icon-radio:after {
10182 background-color: #000000;
10183}
10184.md .radio.color-black .ripple-wave {
10185 background: rgba(0, 0, 0, 0.5);
10186}
10187/* === Toggle === */
10188.toggle {
10189 display: inline-block;
10190 vertical-align: middle;
10191 position: relative;
10192 -webkit-box-sizing: border-box;
10193 box-sizing: border-box;
10194 -webkit-align-self: center;
10195 -ms-flex-item-align: center;
10196 align-self: center;
10197 -webkit-user-select: none;
10198 -moz-user-select: none;
10199 -ms-user-select: none;
10200 user-select: none;
10201}
10202.toggle input[type="checkbox"] {
10203 display: none;
10204}
10205.toggle input[disabled] ~ .toggle-icon {
10206 pointer-events: none;
10207}
10208.toggle-icon {
10209 z-index: 0;
10210 margin: 0;
10211 padding: 0;
10212 -webkit-appearance: none;
10213 -moz-appearance: none;
10214 appearance: none;
10215 border: none;
10216 position: relative;
10217 -webkit-transition: 300ms;
10218 transition: 300ms;
10219 -webkit-box-sizing: border-box;
10220 box-sizing: border-box;
10221 display: block;
10222 cursor: pointer;
10223}
10224.toggle-icon:before,
10225.toggle-icon:after {
10226 content: '';
10227}
10228.toggle-icon:after {
10229 background: #fff;
10230 position: absolute;
10231 z-index: 2;
10232 -webkit-transform: translateX(0px);
10233 transform: translateX(0px);
10234 -webkit-transition-duration: 300ms;
10235 transition-duration: 300ms;
10236}
10237.md .toggle {
10238 width: 36px;
10239 height: 14px;
10240}
10241.md .toggle input[type="checkbox"]:checked + .toggle-icon {
10242 background: rgba(33, 150, 243, 0.5);
10243}
10244.md .toggle input[type="checkbox"]:checked + .toggle-icon:after {
10245 -webkit-transform: translateX(-16px);
10246 transform: translateX(-16px);
10247 background: #2196f3;
10248}
10249.md .toggle-icon {
10250 width: 36px;
10251 height: 14px;
10252 border-radius: 14px;
10253 background: #b0afaf;
10254}
10255.md .toggle-icon:after {
10256 height: 20px;
10257 width: 20px;
10258 top: -3px;
10259 -webkit-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
10260 box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
10261 border-radius: 10px;
10262 right: 0;
10263}
10264.md .color-theme-red .toggle input[type="checkbox"]:checked + .toggle-icon {
10265 background: rgba(244, 67, 54, 0.5);
10266}
10267.md .color-theme-red .toggle input[type="checkbox"]:checked + .toggle-icon:after {
10268 background: #f44336;
10269}
10270.md .color-theme-green .toggle input[type="checkbox"]:checked + .toggle-icon {
10271 background: rgba(76, 175, 80, 0.5);
10272}
10273.md .color-theme-green .toggle input[type="checkbox"]:checked + .toggle-icon:after {
10274 background: #4caf50;
10275}
10276.md .color-theme-blue .toggle input[type="checkbox"]:checked + .toggle-icon {
10277 background: rgba(33, 150, 243, 0.5);
10278}
10279.md .color-theme-blue .toggle input[type="checkbox"]:checked + .toggle-icon:after {
10280 background: #2196f3;
10281}
10282.md .color-theme-pink .toggle input[type="checkbox"]:checked + .toggle-icon {
10283 background: rgba(233, 30, 99, 0.5);
10284}
10285.md .color-theme-pink .toggle input[type="checkbox"]:checked + .toggle-icon:after {
10286 background: #e91e63;
10287}
10288.md .color-theme-yellow .toggle input[type="checkbox"]:checked + .toggle-icon {
10289 background: rgba(255, 235, 59, 0.5);
10290}
10291.md .color-theme-yellow .toggle input[type="checkbox"]:checked + .toggle-icon:after {
10292 background: #ffeb3b;
10293}
10294.md .color-theme-orange .toggle input[type="checkbox"]:checked + .toggle-icon {
10295 background: rgba(255, 152, 0, 0.5);
10296}
10297.md .color-theme-orange .toggle input[type="checkbox"]:checked + .toggle-icon:after {
10298 background: #ff9800;
10299}
10300.md .color-theme-gray .toggle input[type="checkbox"]:checked + .toggle-icon {
10301 background: rgba(158, 158, 158, 0.5);
10302}
10303.md .color-theme-gray .toggle input[type="checkbox"]:checked + .toggle-icon:after {
10304 background: #9e9e9e;
10305}
10306.md .color-theme-white .toggle input[type="checkbox"]:checked + .toggle-icon {
10307 background: rgba(255, 255, 255, 0.5);
10308}
10309.md .color-theme-white .toggle input[type="checkbox"]:checked + .toggle-icon:after {
10310 background: #ffffff;
10311}
10312.md .color-theme-black .toggle input[type="checkbox"]:checked + .toggle-icon {
10313 background: rgba(0, 0, 0, 0.5);
10314}
10315.md .color-theme-black .toggle input[type="checkbox"]:checked + .toggle-icon:after {
10316 background: #000000;
10317}
10318.md .toggle.color-red input[type="checkbox"]:checked + .toggle-icon {
10319 background: rgba(244, 67, 54, 0.5);
10320}
10321.md .toggle.color-red input[type="checkbox"]:checked + .toggle-icon:after {
10322 background: #f44336;
10323}
10324.md .toggle.color-green input[type="checkbox"]:checked + .toggle-icon {
10325 background: rgba(76, 175, 80, 0.5);
10326}
10327.md .toggle.color-green input[type="checkbox"]:checked + .toggle-icon:after {
10328 background: #4caf50;
10329}
10330.md .toggle.color-blue input[type="checkbox"]:checked + .toggle-icon {
10331 background: rgba(33, 150, 243, 0.5);
10332}
10333.md .toggle.color-blue input[type="checkbox"]:checked + .toggle-icon:after {
10334 background: #2196f3;
10335}
10336.md .toggle.color-pink input[type="checkbox"]:checked + .toggle-icon {
10337 background: rgba(233, 30, 99, 0.5);
10338}
10339.md .toggle.color-pink input[type="checkbox"]:checked + .toggle-icon:after {
10340 background: #e91e63;
10341}
10342.md .toggle.color-yellow input[type="checkbox"]:checked + .toggle-icon {
10343 background: rgba(255, 235, 59, 0.5);
10344}
10345.md .toggle.color-yellow input[type="checkbox"]:checked + .toggle-icon:after {
10346 background: #ffeb3b;
10347}
10348.md .toggle.color-orange input[type="checkbox"]:checked + .toggle-icon {
10349 background: rgba(255, 152, 0, 0.5);
10350}
10351.md .toggle.color-orange input[type="checkbox"]:checked + .toggle-icon:after {
10352 background: #ff9800;
10353}
10354.md .toggle.color-gray input[type="checkbox"]:checked + .toggle-icon {
10355 background: rgba(158, 158, 158, 0.5);
10356}
10357.md .toggle.color-gray input[type="checkbox"]:checked + .toggle-icon:after {
10358 background: #9e9e9e;
10359}
10360.md .toggle.color-white input[type="checkbox"]:checked + .toggle-icon {
10361 background: rgba(255, 255, 255, 0.5);
10362}
10363.md .toggle.color-white input[type="checkbox"]:checked + .toggle-icon:after {
10364 background: #ffffff;
10365}
10366.md .toggle.color-black input[type="checkbox"]:checked + .toggle-icon {
10367 background: rgba(0, 0, 0, 0.5);
10368}
10369.md .toggle.color-black input[type="checkbox"]:checked + .toggle-icon:after {
10370 background: #000000;
10371}
10372/* === Range Slider === */
10373.range-slider {
10374 display: block;
10375 width: 100%;
10376 position: relative;
10377 -webkit-align-self: center;
10378 -ms-flex-item-align: center;
10379 align-self: center;
10380 cursor: pointer;
10381 -webkit-user-select: none;
10382 -moz-user-select: none;
10383 -ms-user-select: none;
10384 user-select: none;
10385}
10386.range-slider input[type="range"] {
10387 display: none;
10388}
10389.range-bar {
10390 position: absolute;
10391 left: 0;
10392 top: 50%;
10393 width: 100%;
10394 overflow: hidden;
10395}
10396.range-bar-active {
10397 position: absolute;
10398 right: 0;
10399 top: 0;
10400 height: 100%;
10401}
10402.range-knob-wrap {
10403 z-index: 20;
10404 position: absolute;
10405 top: 50%;
10406 right: 0;
10407}
10408.range-knob {
10409 -webkit-box-sizing: border-box;
10410 box-sizing: border-box;
10411 border-radius: 50%;
10412 position: absolute;
10413 left: 0;
10414 top: 0;
10415 width: 100%;
10416 height: 100%;
10417 z-index: 1;
10418}
10419.range-knob:after {
10420 content: '';
10421 position: absolute;
10422 left: 50%;
10423 top: 50%;
10424 width: 44px;
10425 height: 44px;
10426 margin-left: -22px;
10427 margin-top: -22px;
10428}
10429.range-knob-label {
10430 position: absolute;
10431 left: 50%;
10432 bottom: 100%;
10433 text-align: center;
10434 -webkit-transition-duration: 120ms;
10435 transition-duration: 120ms;
10436 -webkit-transition-property: -webkit-transform;
10437 transition-property: -webkit-transform;
10438 transition-property: transform;
10439 transition-property: transform, -webkit-transform;
10440 -webkit-transform: translateY(100%) scale(0);
10441 transform: translateY(100%) scale(0);
10442}
10443.range-knob-active-state .range-knob-label {
10444 -webkit-transform: translateY(0%) scale(1);
10445 transform: translateY(0%) scale(1);
10446}
10447.md .range-slider {
10448 height: 20px;
10449}
10450.md .range-bar {
10451 background: #b9b9b9;
10452 height: 2px;
10453 margin-top: -1px;
10454}
10455.md .range-bar-active {
10456 background: #2196f3;
10457}
10458.md .range-knob-wrap {
10459 height: 12px;
10460 width: 12px;
10461 margin-top: -6px;
10462 margin-right: -6px;
10463}
10464.md .range-knob {
10465 background: #2196f3;
10466 -webkit-transition-duration: 200ms;
10467 transition-duration: 200ms;
10468 -webkit-transition-property: background-color, -webkit-transform;
10469 transition-property: background-color, -webkit-transform;
10470 transition-property: transform, background-color;
10471 transition-property: transform, background-color, -webkit-transform;
10472}
10473.md .range-knob-active-state .range-knob {
10474 -webkit-transform: scale(1.5);
10475 transform: scale(1.5);
10476}
10477.md .range-slider-min:not(.range-slider-dual) .range-knob {
10478 background: #fff !important;
10479 border: 2px solid #b9b9b9;
10480}
10481.md .range-knob-label {
10482 width: 26px;
10483 height: 26px;
10484 margin-left: -13px;
10485 margin-bottom: 8px;
10486 background: #2196f3;
10487 color: #fff;
10488 font-size: 10px;
10489 border-radius: 50%;
10490 line-height: 26px;
10491}
10492.md .range-knob-label:before {
10493 content: '';
10494 left: 50%;
10495 top: 0px;
10496 margin-left: -13px;
10497 position: absolute;
10498 z-index: -1;
10499 width: 26px;
10500 height: 26px;
10501 background: #2196f3;
10502 -webkit-transform: rotate(-45deg);
10503 transform: rotate(-45deg);
10504 border-radius: 50% 50% 50% 0;
10505}
10506.md .range-knob-active-state .range-knob-label {
10507 -webkit-transform: translateY(0%) scale(1);
10508 transform: translateY(0%) scale(1);
10509}
10510.md .range-slider-label .range-knob-active-state .range-knob {
10511 -webkit-transform: scale(0);
10512 transform: scale(0);
10513}
10514.md .color-theme-red .range-slider .range-bar-active,
10515.md .color-theme-red .range-slider .range-knob,
10516.md .color-theme-red .range-slider .range-knob-label,
10517.md .color-theme-red .range-slider .range-knob-label:before {
10518 background-color: #f44336;
10519}
10520.md .color-theme-green .range-slider .range-bar-active,
10521.md .color-theme-green .range-slider .range-knob,
10522.md .color-theme-green .range-slider .range-knob-label,
10523.md .color-theme-green .range-slider .range-knob-label:before {
10524 background-color: #4caf50;
10525}
10526.md .color-theme-blue .range-slider .range-bar-active,
10527.md .color-theme-blue .range-slider .range-knob,
10528.md .color-theme-blue .range-slider .range-knob-label,
10529.md .color-theme-blue .range-slider .range-knob-label:before {
10530 background-color: #2196f3;
10531}
10532.md .color-theme-pink .range-slider .range-bar-active,
10533.md .color-theme-pink .range-slider .range-knob,
10534.md .color-theme-pink .range-slider .range-knob-label,
10535.md .color-theme-pink .range-slider .range-knob-label:before {
10536 background-color: #e91e63;
10537}
10538.md .color-theme-yellow .range-slider .range-bar-active,
10539.md .color-theme-yellow .range-slider .range-knob,
10540.md .color-theme-yellow .range-slider .range-knob-label,
10541.md .color-theme-yellow .range-slider .range-knob-label:before {
10542 background-color: #ffeb3b;
10543}
10544.md .color-theme-orange .range-slider .range-bar-active,
10545.md .color-theme-orange .range-slider .range-knob,
10546.md .color-theme-orange .range-slider .range-knob-label,
10547.md .color-theme-orange .range-slider .range-knob-label:before {
10548 background-color: #ff9800;
10549}
10550.md .color-theme-gray .range-slider .range-bar-active,
10551.md .color-theme-gray .range-slider .range-knob,
10552.md .color-theme-gray .range-slider .range-knob-label,
10553.md .color-theme-gray .range-slider .range-knob-label:before {
10554 background-color: #9e9e9e;
10555}
10556.md .color-theme-white .range-slider .range-bar-active,
10557.md .color-theme-white .range-slider .range-knob,
10558.md .color-theme-white .range-slider .range-knob-label,
10559.md .color-theme-white .range-slider .range-knob-label:before {
10560 background-color: #ffffff;
10561}
10562.md .color-theme-black .range-slider .range-bar-active,
10563.md .color-theme-black .range-slider .range-knob,
10564.md .color-theme-black .range-slider .range-knob-label,
10565.md .color-theme-black .range-slider .range-knob-label:before {
10566 background-color: #000000;
10567}
10568.md .range-slider.color-red .range-bar-active,
10569.md .range-slider.color-red .range-knob,
10570.md .range-slider.color-red .range-knob-label,
10571.md .range-slider.color-red .range-knob-label:before {
10572 background-color: #f44336;
10573}
10574.md .range-slider.color-green .range-bar-active,
10575.md .range-slider.color-green .range-knob,
10576.md .range-slider.color-green .range-knob-label,
10577.md .range-slider.color-green .range-knob-label:before {
10578 background-color: #4caf50;
10579}
10580.md .range-slider.color-blue .range-bar-active,
10581.md .range-slider.color-blue .range-knob,
10582.md .range-slider.color-blue .range-knob-label,
10583.md .range-slider.color-blue .range-knob-label:before {
10584 background-color: #2196f3;
10585}
10586.md .range-slider.color-pink .range-bar-active,
10587.md .range-slider.color-pink .range-knob,
10588.md .range-slider.color-pink .range-knob-label,
10589.md .range-slider.color-pink .range-knob-label:before {
10590 background-color: #e91e63;
10591}
10592.md .range-slider.color-yellow .range-bar-active,
10593.md .range-slider.color-yellow .range-knob,
10594.md .range-slider.color-yellow .range-knob-label,
10595.md .range-slider.color-yellow .range-knob-label:before {
10596 background-color: #ffeb3b;
10597}
10598.md .range-slider.color-orange .range-bar-active,
10599.md .range-slider.color-orange .range-knob,
10600.md .range-slider.color-orange .range-knob-label,
10601.md .range-slider.color-orange .range-knob-label:before {
10602 background-color: #ff9800;
10603}
10604.md .range-slider.color-gray .range-bar-active,
10605.md .range-slider.color-gray .range-knob,
10606.md .range-slider.color-gray .range-knob-label,
10607.md .range-slider.color-gray .range-knob-label:before {
10608 background-color: #9e9e9e;
10609}
10610.md .range-slider.color-white .range-bar-active,
10611.md .range-slider.color-white .range-knob,
10612.md .range-slider.color-white .range-knob-label,
10613.md .range-slider.color-white .range-knob-label:before {
10614 background-color: #ffffff;
10615}
10616.md .range-slider.color-black .range-bar-active,
10617.md .range-slider.color-black .range-knob,
10618.md .range-slider.color-black .range-knob-label,
10619.md .range-slider.color-black .range-knob-label:before {
10620 background-color: #000000;
10621}
10622/* === Stepper === */
10623.stepper {
10624 display: -webkit-inline-box;
10625 display: -webkit-inline-flex;
10626 display: -ms-inline-flexbox;
10627 display: inline-flex;
10628 -webkit-box-align: stretch;
10629 -webkit-align-items: stretch;
10630 -ms-flex-align: stretch;
10631 align-items: stretch;
10632}
10633.stepper-button,
10634.stepper-button-minus,
10635.stepper-button-plus {
10636 text-align: center;
10637 display: -webkit-box;
10638 display: -webkit-flex;
10639 display: -ms-flexbox;
10640 display: flex;
10641 -webkit-box-pack: center;
10642 -webkit-justify-content: center;
10643 -ms-flex-pack: center;
10644 justify-content: center;
10645 -webkit-align-content: center;
10646 -ms-flex-line-pack: center;
10647 align-content: center;
10648 -webkit-box-align: center;
10649 -webkit-align-items: center;
10650 -ms-flex-align: center;
10651 align-items: center;
10652 -webkit-flex-shrink: 0;
10653 -ms-flex-negative: 0;
10654 flex-shrink: 0;
10655 -webkit-box-sizing: border-box;
10656 box-sizing: border-box;
10657 position: relative;
10658 cursor: pointer;
10659}
10660.stepper-button .icon,
10661.stepper-button-minus .icon,
10662.stepper-button-plus .icon {
10663 pointer-events: none;
10664}
10665.stepper-value {
10666 display: -webkit-box;
10667 display: -webkit-flex;
10668 display: -ms-flexbox;
10669 display: flex;
10670 -webkit-align-content: center;
10671 -ms-flex-line-pack: center;
10672 align-content: center;
10673 -webkit-box-align: center;
10674 -webkit-align-items: center;
10675 -ms-flex-align: center;
10676 align-items: center;
10677 -webkit-box-pack: center;
10678 -webkit-justify-content: center;
10679 -ms-flex-pack: center;
10680 justify-content: center;
10681}
10682.stepper-input-wrap,
10683.stepper-value {
10684 -webkit-flex-shrink: 1;
10685 -ms-flex-negative: 1;
10686 flex-shrink: 1;
10687 text-align: center;
10688}
10689.stepper-button-plus,
10690.stepper-button-minus {
10691 -webkit-user-select: none;
10692 -moz-user-select: none;
10693 -ms-user-select: none;
10694 user-select: none;
10695}
10696.stepper-button-plus:after,
10697.stepper-button-minus:after,
10698.stepper-button-plus:before,
10699.stepper-button-minus:before {
10700 content: '';
10701 position: absolute;
10702 left: 50%;
10703 top: 50%;
10704 -webkit-transform: translate(-50%, -50%);
10705 transform: translate(-50%, -50%);
10706}
10707.stepper-button-plus:after,
10708.stepper-button-minus:after {
10709 width: 15px;
10710 height: 2px;
10711}
10712.stepper-button-plus:before {
10713 height: 15px;
10714 width: 2px;
10715}
10716.stepper .stepper-input-wrap input,
10717.stepper .stepper-value {
10718 width: 45px;
10719}
10720.md .stepper {
10721 height: 36px;
10722}
10723.md .stepper-button,
10724.md .stepper-button-minus,
10725.md .stepper-button-plus {
10726 border: 2px solid #2196f3;
10727 color: #2196f3;
10728 line-height: 34px;
10729 height: 36px;
10730 width: 40px;
10731 -webkit-transition-duration: 300ms;
10732 transition-duration: 300ms;
10733 -webkit-transform: translate3d(0, 0, 0);
10734 transform: translate3d(0, 0, 0);
10735 overflow: hidden;
10736}
10737.md .stepper-button + .stepper-button,
10738.md .stepper-button-minus + .stepper-button,
10739.md .stepper-button-plus + .stepper-button,
10740.md .stepper-button + .stepper-button-minus,
10741.md .stepper-button-minus + .stepper-button-minus,
10742.md .stepper-button-plus + .stepper-button-minus,
10743.md .stepper-button + .stepper-button-plus,
10744.md .stepper-button-minus + .stepper-button-plus,
10745.md .stepper-button-plus + .stepper-button-plus {
10746 border-right: none;
10747}
10748.md .stepper-button.active-state,
10749.md .stepper-button-minus.active-state,
10750.md .stepper-button-plus.active-state {
10751 background: rgba(0, 0, 0, 0.1);
10752}
10753.md .stepper-button:first-child,
10754.md .stepper-button-minus:first-child,
10755.md .stepper-button-plus:first-child {
10756 border-radius: 0 4px 4px 0;
10757}
10758.md .stepper-button:last-child,
10759.md .stepper-button-minus:last-child,
10760.md .stepper-button-plus:last-child {
10761 border-radius: 4px 0 0 4px;
10762}
10763.md .stepper-button-plus:after,
10764.md .stepper-button-minus:after,
10765.md .stepper-button-plus:before,
10766.md .stepper-button-minus:before {
10767 background: #2196f3;
10768}
10769.md .stepper-value,
10770.md .stepper-input-wrap {
10771 border-top: 2px solid #2196f3;
10772 border-bottom: 2px solid #2196f3;
10773}
10774.md .stepper .stepper-value,
10775.md .stepper .stepper-input-wrap input {
10776 color: #2196f3;
10777 font-size: 14px;
10778 font-weight: 500;
10779 text-align: center;
10780}
10781.md .stepper .stepper-input-wrap input {
10782 height: 100%;
10783}
10784.md .stepper-fill .stepper-button,
10785.md .stepper-fill-md .stepper-button,
10786.md .stepper-fill .stepper-button-minus,
10787.md .stepper-fill-md .stepper-button-minus,
10788.md .stepper-fill .stepper-button-plus,
10789.md .stepper-fill-md .stepper-button-plus {
10790 background-color: #2196f3;
10791 color: #fff;
10792 border: none;
10793 line-height: 36px;
10794}
10795.md .stepper-fill .stepper-button.active-state,
10796.md .stepper-fill-md .stepper-button.active-state,
10797.md .stepper-fill .stepper-button-minus.active-state,
10798.md .stepper-fill-md .stepper-button-minus.active-state,
10799.md .stepper-fill .stepper-button-plus.active-state,
10800.md .stepper-fill-md .stepper-button-plus.active-state {
10801 background: #0c82df;
10802}
10803.md .stepper-fill .stepper-button:after,
10804.md .stepper-fill-md .stepper-button:after,
10805.md .stepper-fill .stepper-button-minus:after,
10806.md .stepper-fill-md .stepper-button-minus:after,
10807.md .stepper-fill .stepper-button-plus:after,
10808.md .stepper-fill-md .stepper-button-plus:after,
10809.md .stepper-fill .stepper-button:before,
10810.md .stepper-fill-md .stepper-button:before,
10811.md .stepper-fill .stepper-button-minus:before,
10812.md .stepper-fill-md .stepper-button-minus:before,
10813.md .stepper-fill .stepper-button-plus:before,
10814.md .stepper-fill-md .stepper-button-plus:before {
10815 background: #fff;
10816}
10817.md .stepper-fill .stepper-button + .stepper-button,
10818.md .stepper-fill-md .stepper-button + .stepper-button,
10819.md .stepper-fill .stepper-button-minus + .stepper-button-plus,
10820.md .stepper-fill-md .stepper-button-minus + .stepper-button-plus {
10821 border-right: 1px solid rgba(0, 0, 0, 0.1);
10822}
10823.md .stepper-fill.stepper-big .stepper-button,
10824.md .stepper-fill-md.stepper-big .stepper-button,
10825.md .stepper-fill.stepper-big-md .stepper-button,
10826.md .stepper-fill-md.stepper-big-md .stepper-button,
10827.md .stepper-fill.stepper-big .stepper-button-minus,
10828.md .stepper-fill-md.stepper-big .stepper-button-minus,
10829.md .stepper-fill.stepper-big-md .stepper-button-minus,
10830.md .stepper-fill-md.stepper-big-md .stepper-button-minus,
10831.md .stepper-fill.stepper-big .stepper-button-plus,
10832.md .stepper-fill-md.stepper-big .stepper-button-plus,
10833.md .stepper-fill.stepper-big-md .stepper-button-plus,
10834.md .stepper-fill-md.stepper-big-md .stepper-button-plus {
10835 line-height: 48px;
10836}
10837.md .stepper-fill.stepper-small .stepper-button,
10838.md .stepper-fill-md.stepper-small .stepper-button,
10839.md .stepper-fill.stepper-small-md .stepper-button,
10840.md .stepper-fill-md.stepper-small-md .stepper-button,
10841.md .stepper-fill.stepper-small .stepper-button-minus,
10842.md .stepper-fill-md.stepper-small .stepper-button-minus,
10843.md .stepper-fill.stepper-small-md .stepper-button-minus,
10844.md .stepper-fill-md.stepper-small-md .stepper-button-minus,
10845.md .stepper-fill.stepper-small .stepper-button-plus,
10846.md .stepper-fill-md.stepper-small .stepper-button-plus,
10847.md .stepper-fill.stepper-small-md .stepper-button-plus,
10848.md .stepper-fill-md.stepper-small-md .stepper-button-plus {
10849 line-height: 28px;
10850}
10851.md .stepper-small,
10852.md .stepper-small-md {
10853 height: 28px;
10854}
10855.md .stepper-small .stepper-button,
10856.md .stepper-small-md .stepper-button,
10857.md .stepper-small .stepper-button-minus,
10858.md .stepper-small-md .stepper-button-minus,
10859.md .stepper-small .stepper-button-plus,
10860.md .stepper-small-md .stepper-button-plus {
10861 height: 28px;
10862 line-height: 24px;
10863}
10864.md .stepper-small .stepper-button,
10865.md .stepper-small-md .stepper-button,
10866.md .stepper-small .stepper-button-minus,
10867.md .stepper-small-md .stepper-button-minus,
10868.md .stepper-small .stepper-button-plus,
10869.md .stepper-small-md .stepper-button-plus,
10870.md .stepper-small .stepper-input-wrap,
10871.md .stepper-small-md .stepper-input-wrap,
10872.md .stepper-small .stepper-value,
10873.md .stepper-small-md .stepper-value {
10874 border-width: 2px;
10875}
10876.md .stepper-big,
10877.md .stepper-big-md {
10878 height: 48px;
10879}
10880.md .stepper-big .stepper-button,
10881.md .stepper-big-md .stepper-button,
10882.md .stepper-big .stepper-button-minus,
10883.md .stepper-big-md .stepper-button-minus,
10884.md .stepper-big .stepper-button-plus,
10885.md .stepper-big-md .stepper-button-plus {
10886 height: 48px;
10887 line-height: 46px;
10888}
10889.md .stepper-big .stepper-button:first-child,
10890.md .stepper-big-md .stepper-button:first-child,
10891.md .stepper-big .stepper-button-minus:first-child,
10892.md .stepper-big-md .stepper-button-minus:first-child,
10893.md .stepper-big .stepper-button-plus:first-child,
10894.md .stepper-big-md .stepper-button-plus:first-child {
10895 border-radius: 0 4px 4px 0;
10896}
10897.md .stepper-big .stepper-button:last-child,
10898.md .stepper-big-md .stepper-button:last-child,
10899.md .stepper-big .stepper-button-minus:last-child,
10900.md .stepper-big-md .stepper-button-minus:last-child,
10901.md .stepper-big .stepper-button-plus:last-child,
10902.md .stepper-big-md .stepper-button-plus:last-child {
10903 border-radius: 4px 0 0 4px;
10904}
10905.md .stepper-round .stepper-button:first-child,
10906.md .stepper-round-md .stepper-button:first-child,
10907.md .stepper-round .stepper-button-minus:first-child,
10908.md .stepper-round-md .stepper-button-minus:first-child,
10909.md .stepper-round .stepper-button-plus:first-child,
10910.md .stepper-round-md .stepper-button-plus:first-child {
10911 border-radius: 0 36px 36px 0;
10912}
10913.md .stepper-round .stepper-button:last-child,
10914.md .stepper-round-md .stepper-button:last-child,
10915.md .stepper-round .stepper-button-minus:last-child,
10916.md .stepper-round-md .stepper-button-minus:last-child,
10917.md .stepper-round .stepper-button-plus:last-child,
10918.md .stepper-round-md .stepper-button-plus:last-child {
10919 border-radius: 36px 0 0 36px;
10920}
10921.md .stepper-raised {
10922 -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
10923 box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
10924 border-radius: 4px;
10925}
10926.md .stepper-raised.stepper-big,
10927.md .stepper-raised.stepper-big-md {
10928 border-radius: 4px;
10929}
10930.md .stepper-raised.stepper-round,
10931.md .stepper-raised.stepper-round-md {
10932 border-radius: 36px;
10933}
10934.md .stepper-raised .stepper-value,
10935.md .stepper-raised .stepper-input-wrap {
10936 border: none;
10937}
10938.md .stepper-raised:not(.stepper-fill):not(.stepper-fill-md) .stepper-input-wrap,
10939.md .stepper-raised:not(.stepper-fill):not(.stepper-fill-md) .stepper-value {
10940 border-left: 1px solid rgba(0, 0, 0, 0.1);
10941 border-right: 1px solid rgba(0, 0, 0, 0.1);
10942}
10943.md .stepper-raised .stepper-button,
10944.md .stepper-raised .stepper-button-minus,
10945.md .stepper-raised .stepper-button-plus {
10946 border: none;
10947}
10948.md .stepper-raised .stepper-button + .stepper-button,
10949.md .stepper-raised .stepper-button-minus + .stepper-button-plus {
10950 border-right: 1px solid rgba(0, 0, 0, 0.1);
10951}
10952.md .color-theme-red .stepper-button,
10953.md .color-theme-red .stepper-button-minus,
10954.md .color-theme-red .stepper-button-plus {
10955 border-color: #f44336;
10956 color: #f44336;
10957}
10958.md .color-theme-red .stepper-button-plus:after,
10959.md .color-theme-red .stepper-button-minus:after,
10960.md .color-theme-red .stepper-button-plus:before,
10961.md .color-theme-red .stepper-button-minus:before {
10962 background: #f44336;
10963}
10964.md .color-theme-red .stepper-value,
10965.md .color-theme-red .stepper-input-wrap {
10966 border-top-color: #f44336;
10967 border-bottom-color: #f44336;
10968}
10969.md .color-theme-red .stepper-value,
10970.md .color-theme-red .stepper-input-wrap input {
10971 color: #f44336;
10972}
10973.md .color-theme-red .stepper-fill .stepper-button,
10974.md .color-theme-red .stepper-fill-md .stepper-button,
10975.md .color-theme-red .stepper-fill .stepper-button-minus,
10976.md .color-theme-red .stepper-fill-md .stepper-button-minus,
10977.md .color-theme-red .stepper-fill .stepper-button-plus,
10978.md .color-theme-red .stepper-fill-md .stepper-button-plus {
10979 background-color: #f44336;
10980 color: #fff;
10981}
10982.md .color-theme-red .stepper-fill .stepper-button.active-state,
10983.md .color-theme-red .stepper-fill-md .stepper-button.active-state,
10984.md .color-theme-red .stepper-fill .stepper-button-minus.active-state,
10985.md .color-theme-red .stepper-fill-md .stepper-button-minus.active-state,
10986.md .color-theme-red .stepper-fill .stepper-button-plus.active-state,
10987.md .color-theme-red .stepper-fill-md .stepper-button-plus.active-state {
10988 background: #f21f0f;
10989}
10990.md .color-theme-red .stepper-fill .stepper-button:after,
10991.md .color-theme-red .stepper-fill-md .stepper-button:after,
10992.md .color-theme-red .stepper-fill .stepper-button-minus:after,
10993.md .color-theme-red .stepper-fill-md .stepper-button-minus:after,
10994.md .color-theme-red .stepper-fill .stepper-button-plus:after,
10995.md .color-theme-red .stepper-fill-md .stepper-button-plus:after,
10996.md .color-theme-red .stepper-fill .stepper-button:before,
10997.md .color-theme-red .stepper-fill-md .stepper-button:before,
10998.md .color-theme-red .stepper-fill .stepper-button-minus:before,
10999.md .color-theme-red .stepper-fill-md .stepper-button-minus:before,
11000.md .color-theme-red .stepper-fill .stepper-button-plus:before,
11001.md .color-theme-red .stepper-fill-md .stepper-button-plus:before {
11002 background: #fff;
11003}
11004.md .color-theme-green .stepper-button,
11005.md .color-theme-green .stepper-button-minus,
11006.md .color-theme-green .stepper-button-plus {
11007 border-color: #4caf50;
11008 color: #4caf50;
11009}
11010.md .color-theme-green .stepper-button-plus:after,
11011.md .color-theme-green .stepper-button-minus:after,
11012.md .color-theme-green .stepper-button-plus:before,
11013.md .color-theme-green .stepper-button-minus:before {
11014 background: #4caf50;
11015}
11016.md .color-theme-green .stepper-value,
11017.md .color-theme-green .stepper-input-wrap {
11018 border-top-color: #4caf50;
11019 border-bottom-color: #4caf50;
11020}
11021.md .color-theme-green .stepper-value,
11022.md .color-theme-green .stepper-input-wrap input {
11023 color: #4caf50;
11024}
11025.md .color-theme-green .stepper-fill .stepper-button,
11026.md .color-theme-green .stepper-fill-md .stepper-button,
11027.md .color-theme-green .stepper-fill .stepper-button-minus,
11028.md .color-theme-green .stepper-fill-md .stepper-button-minus,
11029.md .color-theme-green .stepper-fill .stepper-button-plus,
11030.md .color-theme-green .stepper-fill-md .stepper-button-plus {
11031 background-color: #4caf50;
11032 color: #fff;
11033}
11034.md .color-theme-green .stepper-fill .stepper-button.active-state,
11035.md .color-theme-green .stepper-fill-md .stepper-button.active-state,
11036.md .color-theme-green .stepper-fill .stepper-button-minus.active-state,
11037.md .color-theme-green .stepper-fill-md .stepper-button-minus.active-state,
11038.md .color-theme-green .stepper-fill .stepper-button-plus.active-state,
11039.md .color-theme-green .stepper-fill-md .stepper-button-plus.active-state {
11040 background: #409343;
11041}
11042.md .color-theme-green .stepper-fill .stepper-button:after,
11043.md .color-theme-green .stepper-fill-md .stepper-button:after,
11044.md .color-theme-green .stepper-fill .stepper-button-minus:after,
11045.md .color-theme-green .stepper-fill-md .stepper-button-minus:after,
11046.md .color-theme-green .stepper-fill .stepper-button-plus:after,
11047.md .color-theme-green .stepper-fill-md .stepper-button-plus:after,
11048.md .color-theme-green .stepper-fill .stepper-button:before,
11049.md .color-theme-green .stepper-fill-md .stepper-button:before,
11050.md .color-theme-green .stepper-fill .stepper-button-minus:before,
11051.md .color-theme-green .stepper-fill-md .stepper-button-minus:before,
11052.md .color-theme-green .stepper-fill .stepper-button-plus:before,
11053.md .color-theme-green .stepper-fill-md .stepper-button-plus:before {
11054 background: #fff;
11055}
11056.md .color-theme-blue .stepper-button,
11057.md .color-theme-blue .stepper-button-minus,
11058.md .color-theme-blue .stepper-button-plus {
11059 border-color: #2196f3;
11060 color: #2196f3;
11061}
11062.md .color-theme-blue .stepper-button-plus:after,
11063.md .color-theme-blue .stepper-button-minus:after,
11064.md .color-theme-blue .stepper-button-plus:before,
11065.md .color-theme-blue .stepper-button-minus:before {
11066 background: #2196f3;
11067}
11068.md .color-theme-blue .stepper-value,
11069.md .color-theme-blue .stepper-input-wrap {
11070 border-top-color: #2196f3;
11071 border-bottom-color: #2196f3;
11072}
11073.md .color-theme-blue .stepper-value,
11074.md .color-theme-blue .stepper-input-wrap input {
11075 color: #2196f3;
11076}
11077.md .color-theme-blue .stepper-fill .stepper-button,
11078.md .color-theme-blue .stepper-fill-md .stepper-button,
11079.md .color-theme-blue .stepper-fill .stepper-button-minus,
11080.md .color-theme-blue .stepper-fill-md .stepper-button-minus,
11081.md .color-theme-blue .stepper-fill .stepper-button-plus,
11082.md .color-theme-blue .stepper-fill-md .stepper-button-plus {
11083 background-color: #2196f3;
11084 color: #fff;
11085}
11086.md .color-theme-blue .stepper-fill .stepper-button.active-state,
11087.md .color-theme-blue .stepper-fill-md .stepper-button.active-state,
11088.md .color-theme-blue .stepper-fill .stepper-button-minus.active-state,
11089.md .color-theme-blue .stepper-fill-md .stepper-button-minus.active-state,
11090.md .color-theme-blue .stepper-fill .stepper-button-plus.active-state,
11091.md .color-theme-blue .stepper-fill-md .stepper-button-plus.active-state {
11092 background: #0c82df;
11093}
11094.md .color-theme-blue .stepper-fill .stepper-button:after,
11095.md .color-theme-blue .stepper-fill-md .stepper-button:after,
11096.md .color-theme-blue .stepper-fill .stepper-button-minus:after,
11097.md .color-theme-blue .stepper-fill-md .stepper-button-minus:after,
11098.md .color-theme-blue .stepper-fill .stepper-button-plus:after,
11099.md .color-theme-blue .stepper-fill-md .stepper-button-plus:after,
11100.md .color-theme-blue .stepper-fill .stepper-button:before,
11101.md .color-theme-blue .stepper-fill-md .stepper-button:before,
11102.md .color-theme-blue .stepper-fill .stepper-button-minus:before,
11103.md .color-theme-blue .stepper-fill-md .stepper-button-minus:before,
11104.md .color-theme-blue .stepper-fill .stepper-button-plus:before,
11105.md .color-theme-blue .stepper-fill-md .stepper-button-plus:before {
11106 background: #fff;
11107}
11108.md .color-theme-pink .stepper-button,
11109.md .color-theme-pink .stepper-button-minus,
11110.md .color-theme-pink .stepper-button-plus {
11111 border-color: #e91e63;
11112 color: #e91e63;
11113}
11114.md .color-theme-pink .stepper-button-plus:after,
11115.md .color-theme-pink .stepper-button-minus:after,
11116.md .color-theme-pink .stepper-button-plus:before,
11117.md .color-theme-pink .stepper-button-minus:before {
11118 background: #e91e63;
11119}
11120.md .color-theme-pink .stepper-value,
11121.md .color-theme-pink .stepper-input-wrap {
11122 border-top-color: #e91e63;
11123 border-bottom-color: #e91e63;
11124}
11125.md .color-theme-pink .stepper-value,
11126.md .color-theme-pink .stepper-input-wrap input {
11127 color: #e91e63;
11128}
11129.md .color-theme-pink .stepper-fill .stepper-button,
11130.md .color-theme-pink .stepper-fill-md .stepper-button,
11131.md .color-theme-pink .stepper-fill .stepper-button-minus,
11132.md .color-theme-pink .stepper-fill-md .stepper-button-minus,
11133.md .color-theme-pink .stepper-fill .stepper-button-plus,
11134.md .color-theme-pink .stepper-fill-md .stepper-button-plus {
11135 background-color: #e91e63;
11136 color: #fff;
11137}
11138.md .color-theme-pink .stepper-fill .stepper-button.active-state,
11139.md .color-theme-pink .stepper-fill-md .stepper-button.active-state,
11140.md .color-theme-pink .stepper-fill .stepper-button-minus.active-state,
11141.md .color-theme-pink .stepper-fill-md .stepper-button-minus.active-state,
11142.md .color-theme-pink .stepper-fill .stepper-button-plus.active-state,
11143.md .color-theme-pink .stepper-fill-md .stepper-button-plus.active-state {
11144 background: #ca1452;
11145}
11146.md .color-theme-pink .stepper-fill .stepper-button:after,
11147.md .color-theme-pink .stepper-fill-md .stepper-button:after,
11148.md .color-theme-pink .stepper-fill .stepper-button-minus:after,
11149.md .color-theme-pink .stepper-fill-md .stepper-button-minus:after,
11150.md .color-theme-pink .stepper-fill .stepper-button-plus:after,
11151.md .color-theme-pink .stepper-fill-md .stepper-button-plus:after,
11152.md .color-theme-pink .stepper-fill .stepper-button:before,
11153.md .color-theme-pink .stepper-fill-md .stepper-button:before,
11154.md .color-theme-pink .stepper-fill .stepper-button-minus:before,
11155.md .color-theme-pink .stepper-fill-md .stepper-button-minus:before,
11156.md .color-theme-pink .stepper-fill .stepper-button-plus:before,
11157.md .color-theme-pink .stepper-fill-md .stepper-button-plus:before {
11158 background: #fff;
11159}
11160.md .color-theme-yellow .stepper-button,
11161.md .color-theme-yellow .stepper-button-minus,
11162.md .color-theme-yellow .stepper-button-plus {
11163 border-color: #ffeb3b;
11164 color: #ffeb3b;
11165}
11166.md .color-theme-yellow .stepper-button-plus:after,
11167.md .color-theme-yellow .stepper-button-minus:after,
11168.md .color-theme-yellow .stepper-button-plus:before,
11169.md .color-theme-yellow .stepper-button-minus:before {
11170 background: #ffeb3b;
11171}
11172.md .color-theme-yellow .stepper-value,
11173.md .color-theme-yellow .stepper-input-wrap {
11174 border-top-color: #ffeb3b;
11175 border-bottom-color: #ffeb3b;
11176}
11177.md .color-theme-yellow .stepper-value,
11178.md .color-theme-yellow .stepper-input-wrap input {
11179 color: #ffeb3b;
11180}
11181.md .color-theme-yellow .stepper-fill .stepper-button,
11182.md .color-theme-yellow .stepper-fill-md .stepper-button,
11183.md .color-theme-yellow .stepper-fill .stepper-button-minus,
11184.md .color-theme-yellow .stepper-fill-md .stepper-button-minus,
11185.md .color-theme-yellow .stepper-fill .stepper-button-plus,
11186.md .color-theme-yellow .stepper-fill-md .stepper-button-plus {
11187 background-color: #ffeb3b;
11188 color: #fff;
11189}
11190.md .color-theme-yellow .stepper-fill .stepper-button.active-state,
11191.md .color-theme-yellow .stepper-fill-md .stepper-button.active-state,
11192.md .color-theme-yellow .stepper-fill .stepper-button-minus.active-state,
11193.md .color-theme-yellow .stepper-fill-md .stepper-button-minus.active-state,
11194.md .color-theme-yellow .stepper-fill .stepper-button-plus.active-state,
11195.md .color-theme-yellow .stepper-fill-md .stepper-button-plus.active-state {
11196 background: #ffe712;
11197}
11198.md .color-theme-yellow .stepper-fill .stepper-button:after,
11199.md .color-theme-yellow .stepper-fill-md .stepper-button:after,
11200.md .color-theme-yellow .stepper-fill .stepper-button-minus:after,
11201.md .color-theme-yellow .stepper-fill-md .stepper-button-minus:after,
11202.md .color-theme-yellow .stepper-fill .stepper-button-plus:after,
11203.md .color-theme-yellow .stepper-fill-md .stepper-button-plus:after,
11204.md .color-theme-yellow .stepper-fill .stepper-button:before,
11205.md .color-theme-yellow .stepper-fill-md .stepper-button:before,
11206.md .color-theme-yellow .stepper-fill .stepper-button-minus:before,
11207.md .color-theme-yellow .stepper-fill-md .stepper-button-minus:before,
11208.md .color-theme-yellow .stepper-fill .stepper-button-plus:before,
11209.md .color-theme-yellow .stepper-fill-md .stepper-button-plus:before {
11210 background: #fff;
11211}
11212.md .color-theme-orange .stepper-button,
11213.md .color-theme-orange .stepper-button-minus,
11214.md .color-theme-orange .stepper-button-plus {
11215 border-color: #ff9800;
11216 color: #ff9800;
11217}
11218.md .color-theme-orange .stepper-button-plus:after,
11219.md .color-theme-orange .stepper-button-minus:after,
11220.md .color-theme-orange .stepper-button-plus:before,
11221.md .color-theme-orange .stepper-button-minus:before {
11222 background: #ff9800;
11223}
11224.md .color-theme-orange .stepper-value,
11225.md .color-theme-orange .stepper-input-wrap {
11226 border-top-color: #ff9800;
11227 border-bottom-color: #ff9800;
11228}
11229.md .color-theme-orange .stepper-value,
11230.md .color-theme-orange .stepper-input-wrap input {
11231 color: #ff9800;
11232}
11233.md .color-theme-orange .stepper-fill .stepper-button,
11234.md .color-theme-orange .stepper-fill-md .stepper-button,
11235.md .color-theme-orange .stepper-fill .stepper-button-minus,
11236.md .color-theme-orange .stepper-fill-md .stepper-button-minus,
11237.md .color-theme-orange .stepper-fill .stepper-button-plus,
11238.md .color-theme-orange .stepper-fill-md .stepper-button-plus {
11239 background-color: #ff9800;
11240 color: #fff;
11241}
11242.md .color-theme-orange .stepper-fill .stepper-button.active-state,
11243.md .color-theme-orange .stepper-fill-md .stepper-button.active-state,
11244.md .color-theme-orange .stepper-fill .stepper-button-minus.active-state,
11245.md .color-theme-orange .stepper-fill-md .stepper-button-minus.active-state,
11246.md .color-theme-orange .stepper-fill .stepper-button-plus.active-state,
11247.md .color-theme-orange .stepper-fill-md .stepper-button-plus.active-state {
11248 background: #d68000;
11249}
11250.md .color-theme-orange .stepper-fill .stepper-button:after,
11251.md .color-theme-orange .stepper-fill-md .stepper-button:after,
11252.md .color-theme-orange .stepper-fill .stepper-button-minus:after,
11253.md .color-theme-orange .stepper-fill-md .stepper-button-minus:after,
11254.md .color-theme-orange .stepper-fill .stepper-button-plus:after,
11255.md .color-theme-orange .stepper-fill-md .stepper-button-plus:after,
11256.md .color-theme-orange .stepper-fill .stepper-button:before,
11257.md .color-theme-orange .stepper-fill-md .stepper-button:before,
11258.md .color-theme-orange .stepper-fill .stepper-button-minus:before,
11259.md .color-theme-orange .stepper-fill-md .stepper-button-minus:before,
11260.md .color-theme-orange .stepper-fill .stepper-button-plus:before,
11261.md .color-theme-orange .stepper-fill-md .stepper-button-plus:before {
11262 background: #fff;
11263}
11264.md .color-theme-gray .stepper-button,
11265.md .color-theme-gray .stepper-button-minus,
11266.md .color-theme-gray .stepper-button-plus {
11267 border-color: #9e9e9e;
11268 color: #9e9e9e;
11269}
11270.md .color-theme-gray .stepper-button-plus:after,
11271.md .color-theme-gray .stepper-button-minus:after,
11272.md .color-theme-gray .stepper-button-plus:before,
11273.md .color-theme-gray .stepper-button-minus:before {
11274 background: #9e9e9e;
11275}
11276.md .color-theme-gray .stepper-value,
11277.md .color-theme-gray .stepper-input-wrap {
11278 border-top-color: #9e9e9e;
11279 border-bottom-color: #9e9e9e;
11280}
11281.md .color-theme-gray .stepper-value,
11282.md .color-theme-gray .stepper-input-wrap input {
11283 color: #9e9e9e;
11284}
11285.md .color-theme-gray .stepper-fill .stepper-button,
11286.md .color-theme-gray .stepper-fill-md .stepper-button,
11287.md .color-theme-gray .stepper-fill .stepper-button-minus,
11288.md .color-theme-gray .stepper-fill-md .stepper-button-minus,
11289.md .color-theme-gray .stepper-fill .stepper-button-plus,
11290.md .color-theme-gray .stepper-fill-md .stepper-button-plus {
11291 background-color: #9e9e9e;
11292 color: #fff;
11293}
11294.md .color-theme-gray .stepper-fill .stepper-button.active-state,
11295.md .color-theme-gray .stepper-fill-md .stepper-button.active-state,
11296.md .color-theme-gray .stepper-fill .stepper-button-minus.active-state,
11297.md .color-theme-gray .stepper-fill-md .stepper-button-minus.active-state,
11298.md .color-theme-gray .stepper-fill .stepper-button-plus.active-state,
11299.md .color-theme-gray .stepper-fill-md .stepper-button-plus.active-state {
11300 background: #8a8a8a;
11301}
11302.md .color-theme-gray .stepper-fill .stepper-button:after,
11303.md .color-theme-gray .stepper-fill-md .stepper-button:after,
11304.md .color-theme-gray .stepper-fill .stepper-button-minus:after,
11305.md .color-theme-gray .stepper-fill-md .stepper-button-minus:after,
11306.md .color-theme-gray .stepper-fill .stepper-button-plus:after,
11307.md .color-theme-gray .stepper-fill-md .stepper-button-plus:after,
11308.md .color-theme-gray .stepper-fill .stepper-button:before,
11309.md .color-theme-gray .stepper-fill-md .stepper-button:before,
11310.md .color-theme-gray .stepper-fill .stepper-button-minus:before,
11311.md .color-theme-gray .stepper-fill-md .stepper-button-minus:before,
11312.md .color-theme-gray .stepper-fill .stepper-button-plus:before,
11313.md .color-theme-gray .stepper-fill-md .stepper-button-plus:before {
11314 background: #fff;
11315}
11316.md .color-theme-white .stepper-button,
11317.md .color-theme-white .stepper-button-minus,
11318.md .color-theme-white .stepper-button-plus {
11319 border-color: #ffffff;
11320 color: #ffffff;
11321}
11322.md .color-theme-white .stepper-button-plus:after,
11323.md .color-theme-white .stepper-button-minus:after,
11324.md .color-theme-white .stepper-button-plus:before,
11325.md .color-theme-white .stepper-button-minus:before {
11326 background: #ffffff;
11327}
11328.md .color-theme-white .stepper-value,
11329.md .color-theme-white .stepper-input-wrap {
11330 border-top-color: #ffffff;
11331 border-bottom-color: #ffffff;
11332}
11333.md .color-theme-white .stepper-value,
11334.md .color-theme-white .stepper-input-wrap input {
11335 color: #ffffff;
11336}
11337.md .color-theme-white .stepper-fill .stepper-button,
11338.md .color-theme-white .stepper-fill-md .stepper-button,
11339.md .color-theme-white .stepper-fill .stepper-button-minus,
11340.md .color-theme-white .stepper-fill-md .stepper-button-minus,
11341.md .color-theme-white .stepper-fill .stepper-button-plus,
11342.md .color-theme-white .stepper-fill-md .stepper-button-plus {
11343 background-color: #ffffff;
11344 color: #fff;
11345}
11346.md .color-theme-white .stepper-fill .stepper-button.active-state,
11347.md .color-theme-white .stepper-fill-md .stepper-button.active-state,
11348.md .color-theme-white .stepper-fill .stepper-button-minus.active-state,
11349.md .color-theme-white .stepper-fill-md .stepper-button-minus.active-state,
11350.md .color-theme-white .stepper-fill .stepper-button-plus.active-state,
11351.md .color-theme-white .stepper-fill-md .stepper-button-plus.active-state {
11352 background: #ebebeb;
11353}
11354.md .color-theme-white .stepper-fill .stepper-button:after,
11355.md .color-theme-white .stepper-fill-md .stepper-button:after,
11356.md .color-theme-white .stepper-fill .stepper-button-minus:after,
11357.md .color-theme-white .stepper-fill-md .stepper-button-minus:after,
11358.md .color-theme-white .stepper-fill .stepper-button-plus:after,
11359.md .color-theme-white .stepper-fill-md .stepper-button-plus:after,
11360.md .color-theme-white .stepper-fill .stepper-button:before,
11361.md .color-theme-white .stepper-fill-md .stepper-button:before,
11362.md .color-theme-white .stepper-fill .stepper-button-minus:before,
11363.md .color-theme-white .stepper-fill-md .stepper-button-minus:before,
11364.md .color-theme-white .stepper-fill .stepper-button-plus:before,
11365.md .color-theme-white .stepper-fill-md .stepper-button-plus:before {
11366 background: #fff;
11367}
11368.md .color-theme-black .stepper-button,
11369.md .color-theme-black .stepper-button-minus,
11370.md .color-theme-black .stepper-button-plus {
11371 border-color: #000000;
11372 color: #000000;
11373}
11374.md .color-theme-black .stepper-button-plus:after,
11375.md .color-theme-black .stepper-button-minus:after,
11376.md .color-theme-black .stepper-button-plus:before,
11377.md .color-theme-black .stepper-button-minus:before {
11378 background: #000000;
11379}
11380.md .color-theme-black .stepper-value,
11381.md .color-theme-black .stepper-input-wrap {
11382 border-top-color: #000000;
11383 border-bottom-color: #000000;
11384}
11385.md .color-theme-black .stepper-value,
11386.md .color-theme-black .stepper-input-wrap input {
11387 color: #000000;
11388}
11389.md .color-theme-black .stepper-fill .stepper-button,
11390.md .color-theme-black .stepper-fill-md .stepper-button,
11391.md .color-theme-black .stepper-fill .stepper-button-minus,
11392.md .color-theme-black .stepper-fill-md .stepper-button-minus,
11393.md .color-theme-black .stepper-fill .stepper-button-plus,
11394.md .color-theme-black .stepper-fill-md .stepper-button-plus {
11395 background-color: #000000;
11396 color: #fff;
11397}
11398.md .color-theme-black .stepper-fill .stepper-button.active-state,
11399.md .color-theme-black .stepper-fill-md .stepper-button.active-state,
11400.md .color-theme-black .stepper-fill .stepper-button-minus.active-state,
11401.md .color-theme-black .stepper-fill-md .stepper-button-minus.active-state,
11402.md .color-theme-black .stepper-fill .stepper-button-plus.active-state,
11403.md .color-theme-black .stepper-fill-md .stepper-button-plus.active-state {
11404 background: #000000;
11405}
11406.md .color-theme-black .stepper-fill .stepper-button:after,
11407.md .color-theme-black .stepper-fill-md .stepper-button:after,
11408.md .color-theme-black .stepper-fill .stepper-button-minus:after,
11409.md .color-theme-black .stepper-fill-md .stepper-button-minus:after,
11410.md .color-theme-black .stepper-fill .stepper-button-plus:after,
11411.md .color-theme-black .stepper-fill-md .stepper-button-plus:after,
11412.md .color-theme-black .stepper-fill .stepper-button:before,
11413.md .color-theme-black .stepper-fill-md .stepper-button:before,
11414.md .color-theme-black .stepper-fill .stepper-button-minus:before,
11415.md .color-theme-black .stepper-fill-md .stepper-button-minus:before,
11416.md .color-theme-black .stepper-fill .stepper-button-plus:before,
11417.md .color-theme-black .stepper-fill-md .stepper-button-plus:before {
11418 background: #fff;
11419}
11420.md .stepper.color-red .stepper-button,
11421.md .stepper.color-red .stepper-button-minus,
11422.md .stepper.color-red .stepper-button-plus {
11423 border-color: #f44336;
11424 color: #f44336;
11425}
11426.md .stepper.color-red .stepper-button-plus:after,
11427.md .stepper.color-red .stepper-button-minus:after,
11428.md .stepper.color-red .stepper-button-plus:before,
11429.md .stepper.color-red .stepper-button-minus:before {
11430 background: #f44336;
11431}
11432.md .stepper.color-red .stepper-value,
11433.md .stepper.color-red .stepper-input-wrap {
11434 border-top-color: #f44336;
11435 border-bottom-color: #f44336;
11436}
11437.md .stepper.color-red .stepper-value,
11438.md .stepper.color-red .stepper-input-wrap input {
11439 color: #f44336;
11440}
11441.md .stepper-fill.color-red .stepper-button,
11442.md .stepper-fill-md.color-red .stepper-button,
11443.md .stepper-fill.color-red .stepper-button-minus,
11444.md .stepper-fill-md.color-red .stepper-button-minus,
11445.md .stepper-fill.color-red .stepper-button-plus,
11446.md .stepper-fill-md.color-red .stepper-button-plus {
11447 background-color: #f44336;
11448 color: #fff;
11449}
11450.md .stepper-fill.color-red .stepper-button.active-state,
11451.md .stepper-fill-md.color-red .stepper-button.active-state,
11452.md .stepper-fill.color-red .stepper-button-minus.active-state,
11453.md .stepper-fill-md.color-red .stepper-button-minus.active-state,
11454.md .stepper-fill.color-red .stepper-button-plus.active-state,
11455.md .stepper-fill-md.color-red .stepper-button-plus.active-state {
11456 background: #f21f0f;
11457}
11458.md .stepper-fill.color-red .stepper-button:after,
11459.md .stepper-fill-md.color-red .stepper-button:after,
11460.md .stepper-fill.color-red .stepper-button-minus:after,
11461.md .stepper-fill-md.color-red .stepper-button-minus:after,
11462.md .stepper-fill.color-red .stepper-button-plus:after,
11463.md .stepper-fill-md.color-red .stepper-button-plus:after,
11464.md .stepper-fill.color-red .stepper-button:before,
11465.md .stepper-fill-md.color-red .stepper-button:before,
11466.md .stepper-fill.color-red .stepper-button-minus:before,
11467.md .stepper-fill-md.color-red .stepper-button-minus:before,
11468.md .stepper-fill.color-red .stepper-button-plus:before,
11469.md .stepper-fill-md.color-red .stepper-button-plus:before {
11470 background: #fff;
11471}
11472.md .stepper.color-green .stepper-button,
11473.md .stepper.color-green .stepper-button-minus,
11474.md .stepper.color-green .stepper-button-plus {
11475 border-color: #4caf50;
11476 color: #4caf50;
11477}
11478.md .stepper.color-green .stepper-button-plus:after,
11479.md .stepper.color-green .stepper-button-minus:after,
11480.md .stepper.color-green .stepper-button-plus:before,
11481.md .stepper.color-green .stepper-button-minus:before {
11482 background: #4caf50;
11483}
11484.md .stepper.color-green .stepper-value,
11485.md .stepper.color-green .stepper-input-wrap {
11486 border-top-color: #4caf50;
11487 border-bottom-color: #4caf50;
11488}
11489.md .stepper.color-green .stepper-value,
11490.md .stepper.color-green .stepper-input-wrap input {
11491 color: #4caf50;
11492}
11493.md .stepper-fill.color-green .stepper-button,
11494.md .stepper-fill-md.color-green .stepper-button,
11495.md .stepper-fill.color-green .stepper-button-minus,
11496.md .stepper-fill-md.color-green .stepper-button-minus,
11497.md .stepper-fill.color-green .stepper-button-plus,
11498.md .stepper-fill-md.color-green .stepper-button-plus {
11499 background-color: #4caf50;
11500 color: #fff;
11501}
11502.md .stepper-fill.color-green .stepper-button.active-state,
11503.md .stepper-fill-md.color-green .stepper-button.active-state,
11504.md .stepper-fill.color-green .stepper-button-minus.active-state,
11505.md .stepper-fill-md.color-green .stepper-button-minus.active-state,
11506.md .stepper-fill.color-green .stepper-button-plus.active-state,
11507.md .stepper-fill-md.color-green .stepper-button-plus.active-state {
11508 background: #409343;
11509}
11510.md .stepper-fill.color-green .stepper-button:after,
11511.md .stepper-fill-md.color-green .stepper-button:after,
11512.md .stepper-fill.color-green .stepper-button-minus:after,
11513.md .stepper-fill-md.color-green .stepper-button-minus:after,
11514.md .stepper-fill.color-green .stepper-button-plus:after,
11515.md .stepper-fill-md.color-green .stepper-button-plus:after,
11516.md .stepper-fill.color-green .stepper-button:before,
11517.md .stepper-fill-md.color-green .stepper-button:before,
11518.md .stepper-fill.color-green .stepper-button-minus:before,
11519.md .stepper-fill-md.color-green .stepper-button-minus:before,
11520.md .stepper-fill.color-green .stepper-button-plus:before,
11521.md .stepper-fill-md.color-green .stepper-button-plus:before {
11522 background: #fff;
11523}
11524.md .stepper.color-blue .stepper-button,
11525.md .stepper.color-blue .stepper-button-minus,
11526.md .stepper.color-blue .stepper-button-plus {
11527 border-color: #2196f3;
11528 color: #2196f3;
11529}
11530.md .stepper.color-blue .stepper-button-plus:after,
11531.md .stepper.color-blue .stepper-button-minus:after,
11532.md .stepper.color-blue .stepper-button-plus:before,
11533.md .stepper.color-blue .stepper-button-minus:before {
11534 background: #2196f3;
11535}
11536.md .stepper.color-blue .stepper-value,
11537.md .stepper.color-blue .stepper-input-wrap {
11538 border-top-color: #2196f3;
11539 border-bottom-color: #2196f3;
11540}
11541.md .stepper.color-blue .stepper-value,
11542.md .stepper.color-blue .stepper-input-wrap input {
11543 color: #2196f3;
11544}
11545.md .stepper-fill.color-blue .stepper-button,
11546.md .stepper-fill-md.color-blue .stepper-button,
11547.md .stepper-fill.color-blue .stepper-button-minus,
11548.md .stepper-fill-md.color-blue .stepper-button-minus,
11549.md .stepper-fill.color-blue .stepper-button-plus,
11550.md .stepper-fill-md.color-blue .stepper-button-plus {
11551 background-color: #2196f3;
11552 color: #fff;
11553}
11554.md .stepper-fill.color-blue .stepper-button.active-state,
11555.md .stepper-fill-md.color-blue .stepper-button.active-state,
11556.md .stepper-fill.color-blue .stepper-button-minus.active-state,
11557.md .stepper-fill-md.color-blue .stepper-button-minus.active-state,
11558.md .stepper-fill.color-blue .stepper-button-plus.active-state,
11559.md .stepper-fill-md.color-blue .stepper-button-plus.active-state {
11560 background: #0c82df;
11561}
11562.md .stepper-fill.color-blue .stepper-button:after,
11563.md .stepper-fill-md.color-blue .stepper-button:after,
11564.md .stepper-fill.color-blue .stepper-button-minus:after,
11565.md .stepper-fill-md.color-blue .stepper-button-minus:after,
11566.md .stepper-fill.color-blue .stepper-button-plus:after,
11567.md .stepper-fill-md.color-blue .stepper-button-plus:after,
11568.md .stepper-fill.color-blue .stepper-button:before,
11569.md .stepper-fill-md.color-blue .stepper-button:before,
11570.md .stepper-fill.color-blue .stepper-button-minus:before,
11571.md .stepper-fill-md.color-blue .stepper-button-minus:before,
11572.md .stepper-fill.color-blue .stepper-button-plus:before,
11573.md .stepper-fill-md.color-blue .stepper-button-plus:before {
11574 background: #fff;
11575}
11576.md .stepper.color-pink .stepper-button,
11577.md .stepper.color-pink .stepper-button-minus,
11578.md .stepper.color-pink .stepper-button-plus {
11579 border-color: #e91e63;
11580 color: #e91e63;
11581}
11582.md .stepper.color-pink .stepper-button-plus:after,
11583.md .stepper.color-pink .stepper-button-minus:after,
11584.md .stepper.color-pink .stepper-button-plus:before,
11585.md .stepper.color-pink .stepper-button-minus:before {
11586 background: #e91e63;
11587}
11588.md .stepper.color-pink .stepper-value,
11589.md .stepper.color-pink .stepper-input-wrap {
11590 border-top-color: #e91e63;
11591 border-bottom-color: #e91e63;
11592}
11593.md .stepper.color-pink .stepper-value,
11594.md .stepper.color-pink .stepper-input-wrap input {
11595 color: #e91e63;
11596}
11597.md .stepper-fill.color-pink .stepper-button,
11598.md .stepper-fill-md.color-pink .stepper-button,
11599.md .stepper-fill.color-pink .stepper-button-minus,
11600.md .stepper-fill-md.color-pink .stepper-button-minus,
11601.md .stepper-fill.color-pink .stepper-button-plus,
11602.md .stepper-fill-md.color-pink .stepper-button-plus {
11603 background-color: #e91e63;
11604 color: #fff;
11605}
11606.md .stepper-fill.color-pink .stepper-button.active-state,
11607.md .stepper-fill-md.color-pink .stepper-button.active-state,
11608.md .stepper-fill.color-pink .stepper-button-minus.active-state,
11609.md .stepper-fill-md.color-pink .stepper-button-minus.active-state,
11610.md .stepper-fill.color-pink .stepper-button-plus.active-state,
11611.md .stepper-fill-md.color-pink .stepper-button-plus.active-state {
11612 background: #ca1452;
11613}
11614.md .stepper-fill.color-pink .stepper-button:after,
11615.md .stepper-fill-md.color-pink .stepper-button:after,
11616.md .stepper-fill.color-pink .stepper-button-minus:after,
11617.md .stepper-fill-md.color-pink .stepper-button-minus:after,
11618.md .stepper-fill.color-pink .stepper-button-plus:after,
11619.md .stepper-fill-md.color-pink .stepper-button-plus:after,
11620.md .stepper-fill.color-pink .stepper-button:before,
11621.md .stepper-fill-md.color-pink .stepper-button:before,
11622.md .stepper-fill.color-pink .stepper-button-minus:before,
11623.md .stepper-fill-md.color-pink .stepper-button-minus:before,
11624.md .stepper-fill.color-pink .stepper-button-plus:before,
11625.md .stepper-fill-md.color-pink .stepper-button-plus:before {
11626 background: #fff;
11627}
11628.md .stepper.color-yellow .stepper-button,
11629.md .stepper.color-yellow .stepper-button-minus,
11630.md .stepper.color-yellow .stepper-button-plus {
11631 border-color: #ffeb3b;
11632 color: #ffeb3b;
11633}
11634.md .stepper.color-yellow .stepper-button-plus:after,
11635.md .stepper.color-yellow .stepper-button-minus:after,
11636.md .stepper.color-yellow .stepper-button-plus:before,
11637.md .stepper.color-yellow .stepper-button-minus:before {
11638 background: #ffeb3b;
11639}
11640.md .stepper.color-yellow .stepper-value,
11641.md .stepper.color-yellow .stepper-input-wrap {
11642 border-top-color: #ffeb3b;
11643 border-bottom-color: #ffeb3b;
11644}
11645.md .stepper.color-yellow .stepper-value,
11646.md .stepper.color-yellow .stepper-input-wrap input {
11647 color: #ffeb3b;
11648}
11649.md .stepper-fill.color-yellow .stepper-button,
11650.md .stepper-fill-md.color-yellow .stepper-button,
11651.md .stepper-fill.color-yellow .stepper-button-minus,
11652.md .stepper-fill-md.color-yellow .stepper-button-minus,
11653.md .stepper-fill.color-yellow .stepper-button-plus,
11654.md .stepper-fill-md.color-yellow .stepper-button-plus {
11655 background-color: #ffeb3b;
11656 color: #fff;
11657}
11658.md .stepper-fill.color-yellow .stepper-button.active-state,
11659.md .stepper-fill-md.color-yellow .stepper-button.active-state,
11660.md .stepper-fill.color-yellow .stepper-button-minus.active-state,
11661.md .stepper-fill-md.color-yellow .stepper-button-minus.active-state,
11662.md .stepper-fill.color-yellow .stepper-button-plus.active-state,
11663.md .stepper-fill-md.color-yellow .stepper-button-plus.active-state {
11664 background: #ffe712;
11665}
11666.md .stepper-fill.color-yellow .stepper-button:after,
11667.md .stepper-fill-md.color-yellow .stepper-button:after,
11668.md .stepper-fill.color-yellow .stepper-button-minus:after,
11669.md .stepper-fill-md.color-yellow .stepper-button-minus:after,
11670.md .stepper-fill.color-yellow .stepper-button-plus:after,
11671.md .stepper-fill-md.color-yellow .stepper-button-plus:after,
11672.md .stepper-fill.color-yellow .stepper-button:before,
11673.md .stepper-fill-md.color-yellow .stepper-button:before,
11674.md .stepper-fill.color-yellow .stepper-button-minus:before,
11675.md .stepper-fill-md.color-yellow .stepper-button-minus:before,
11676.md .stepper-fill.color-yellow .stepper-button-plus:before,
11677.md .stepper-fill-md.color-yellow .stepper-button-plus:before {
11678 background: #fff;
11679}
11680.md .stepper.color-orange .stepper-button,
11681.md .stepper.color-orange .stepper-button-minus,
11682.md .stepper.color-orange .stepper-button-plus {
11683 border-color: #ff9800;
11684 color: #ff9800;
11685}
11686.md .stepper.color-orange .stepper-button-plus:after,
11687.md .stepper.color-orange .stepper-button-minus:after,
11688.md .stepper.color-orange .stepper-button-plus:before,
11689.md .stepper.color-orange .stepper-button-minus:before {
11690 background: #ff9800;
11691}
11692.md .stepper.color-orange .stepper-value,
11693.md .stepper.color-orange .stepper-input-wrap {
11694 border-top-color: #ff9800;
11695 border-bottom-color: #ff9800;
11696}
11697.md .stepper.color-orange .stepper-value,
11698.md .stepper.color-orange .stepper-input-wrap input {
11699 color: #ff9800;
11700}
11701.md .stepper-fill.color-orange .stepper-button,
11702.md .stepper-fill-md.color-orange .stepper-button,
11703.md .stepper-fill.color-orange .stepper-button-minus,
11704.md .stepper-fill-md.color-orange .stepper-button-minus,
11705.md .stepper-fill.color-orange .stepper-button-plus,
11706.md .stepper-fill-md.color-orange .stepper-button-plus {
11707 background-color: #ff9800;
11708 color: #fff;
11709}
11710.md .stepper-fill.color-orange .stepper-button.active-state,
11711.md .stepper-fill-md.color-orange .stepper-button.active-state,
11712.md .stepper-fill.color-orange .stepper-button-minus.active-state,
11713.md .stepper-fill-md.color-orange .stepper-button-minus.active-state,
11714.md .stepper-fill.color-orange .stepper-button-plus.active-state,
11715.md .stepper-fill-md.color-orange .stepper-button-plus.active-state {
11716 background: #d68000;
11717}
11718.md .stepper-fill.color-orange .stepper-button:after,
11719.md .stepper-fill-md.color-orange .stepper-button:after,
11720.md .stepper-fill.color-orange .stepper-button-minus:after,
11721.md .stepper-fill-md.color-orange .stepper-button-minus:after,
11722.md .stepper-fill.color-orange .stepper-button-plus:after,
11723.md .stepper-fill-md.color-orange .stepper-button-plus:after,
11724.md .stepper-fill.color-orange .stepper-button:before,
11725.md .stepper-fill-md.color-orange .stepper-button:before,
11726.md .stepper-fill.color-orange .stepper-button-minus:before,
11727.md .stepper-fill-md.color-orange .stepper-button-minus:before,
11728.md .stepper-fill.color-orange .stepper-button-plus:before,
11729.md .stepper-fill-md.color-orange .stepper-button-plus:before {
11730 background: #fff;
11731}
11732.md .stepper.color-gray .stepper-button,
11733.md .stepper.color-gray .stepper-button-minus,
11734.md .stepper.color-gray .stepper-button-plus {
11735 border-color: #9e9e9e;
11736 color: #9e9e9e;
11737}
11738.md .stepper.color-gray .stepper-button-plus:after,
11739.md .stepper.color-gray .stepper-button-minus:after,
11740.md .stepper.color-gray .stepper-button-plus:before,
11741.md .stepper.color-gray .stepper-button-minus:before {
11742 background: #9e9e9e;
11743}
11744.md .stepper.color-gray .stepper-value,
11745.md .stepper.color-gray .stepper-input-wrap {
11746 border-top-color: #9e9e9e;
11747 border-bottom-color: #9e9e9e;
11748}
11749.md .stepper.color-gray .stepper-value,
11750.md .stepper.color-gray .stepper-input-wrap input {
11751 color: #9e9e9e;
11752}
11753.md .stepper-fill.color-gray .stepper-button,
11754.md .stepper-fill-md.color-gray .stepper-button,
11755.md .stepper-fill.color-gray .stepper-button-minus,
11756.md .stepper-fill-md.color-gray .stepper-button-minus,
11757.md .stepper-fill.color-gray .stepper-button-plus,
11758.md .stepper-fill-md.color-gray .stepper-button-plus {
11759 background-color: #9e9e9e;
11760 color: #fff;
11761}
11762.md .stepper-fill.color-gray .stepper-button.active-state,
11763.md .stepper-fill-md.color-gray .stepper-button.active-state,
11764.md .stepper-fill.color-gray .stepper-button-minus.active-state,
11765.md .stepper-fill-md.color-gray .stepper-button-minus.active-state,
11766.md .stepper-fill.color-gray .stepper-button-plus.active-state,
11767.md .stepper-fill-md.color-gray .stepper-button-plus.active-state {
11768 background: #8a8a8a;
11769}
11770.md .stepper-fill.color-gray .stepper-button:after,
11771.md .stepper-fill-md.color-gray .stepper-button:after,
11772.md .stepper-fill.color-gray .stepper-button-minus:after,
11773.md .stepper-fill-md.color-gray .stepper-button-minus:after,
11774.md .stepper-fill.color-gray .stepper-button-plus:after,
11775.md .stepper-fill-md.color-gray .stepper-button-plus:after,
11776.md .stepper-fill.color-gray .stepper-button:before,
11777.md .stepper-fill-md.color-gray .stepper-button:before,
11778.md .stepper-fill.color-gray .stepper-button-minus:before,
11779.md .stepper-fill-md.color-gray .stepper-button-minus:before,
11780.md .stepper-fill.color-gray .stepper-button-plus:before,
11781.md .stepper-fill-md.color-gray .stepper-button-plus:before {
11782 background: #fff;
11783}
11784.md .stepper.color-white .stepper-button,
11785.md .stepper.color-white .stepper-button-minus,
11786.md .stepper.color-white .stepper-button-plus {
11787 border-color: #ffffff;
11788 color: #ffffff;
11789}
11790.md .stepper.color-white .stepper-button-plus:after,
11791.md .stepper.color-white .stepper-button-minus:after,
11792.md .stepper.color-white .stepper-button-plus:before,
11793.md .stepper.color-white .stepper-button-minus:before {
11794 background: #ffffff;
11795}
11796.md .stepper.color-white .stepper-value,
11797.md .stepper.color-white .stepper-input-wrap {
11798 border-top-color: #ffffff;
11799 border-bottom-color: #ffffff;
11800}
11801.md .stepper.color-white .stepper-value,
11802.md .stepper.color-white .stepper-input-wrap input {
11803 color: #ffffff;
11804}
11805.md .stepper-fill.color-white .stepper-button,
11806.md .stepper-fill-md.color-white .stepper-button,
11807.md .stepper-fill.color-white .stepper-button-minus,
11808.md .stepper-fill-md.color-white .stepper-button-minus,
11809.md .stepper-fill.color-white .stepper-button-plus,
11810.md .stepper-fill-md.color-white .stepper-button-plus {
11811 background-color: #ffffff;
11812 color: #fff;
11813}
11814.md .stepper-fill.color-white .stepper-button.active-state,
11815.md .stepper-fill-md.color-white .stepper-button.active-state,
11816.md .stepper-fill.color-white .stepper-button-minus.active-state,
11817.md .stepper-fill-md.color-white .stepper-button-minus.active-state,
11818.md .stepper-fill.color-white .stepper-button-plus.active-state,
11819.md .stepper-fill-md.color-white .stepper-button-plus.active-state {
11820 background: #ebebeb;
11821}
11822.md .stepper-fill.color-white .stepper-button:after,
11823.md .stepper-fill-md.color-white .stepper-button:after,
11824.md .stepper-fill.color-white .stepper-button-minus:after,
11825.md .stepper-fill-md.color-white .stepper-button-minus:after,
11826.md .stepper-fill.color-white .stepper-button-plus:after,
11827.md .stepper-fill-md.color-white .stepper-button-plus:after,
11828.md .stepper-fill.color-white .stepper-button:before,
11829.md .stepper-fill-md.color-white .stepper-button:before,
11830.md .stepper-fill.color-white .stepper-button-minus:before,
11831.md .stepper-fill-md.color-white .stepper-button-minus:before,
11832.md .stepper-fill.color-white .stepper-button-plus:before,
11833.md .stepper-fill-md.color-white .stepper-button-plus:before {
11834 background: #fff;
11835}
11836.md .stepper.color-black .stepper-button,
11837.md .stepper.color-black .stepper-button-minus,
11838.md .stepper.color-black .stepper-button-plus {
11839 border-color: #000000;
11840 color: #000000;
11841}
11842.md .stepper.color-black .stepper-button-plus:after,
11843.md .stepper.color-black .stepper-button-minus:after,
11844.md .stepper.color-black .stepper-button-plus:before,
11845.md .stepper.color-black .stepper-button-minus:before {
11846 background: #000000;
11847}
11848.md .stepper.color-black .stepper-value,
11849.md .stepper.color-black .stepper-input-wrap {
11850 border-top-color: #000000;
11851 border-bottom-color: #000000;
11852}
11853.md .stepper.color-black .stepper-value,
11854.md .stepper.color-black .stepper-input-wrap input {
11855 color: #000000;
11856}
11857.md .stepper-fill.color-black .stepper-button,
11858.md .stepper-fill-md.color-black .stepper-button,
11859.md .stepper-fill.color-black .stepper-button-minus,
11860.md .stepper-fill-md.color-black .stepper-button-minus,
11861.md .stepper-fill.color-black .stepper-button-plus,
11862.md .stepper-fill-md.color-black .stepper-button-plus {
11863 background-color: #000000;
11864 color: #fff;
11865}
11866.md .stepper-fill.color-black .stepper-button.active-state,
11867.md .stepper-fill-md.color-black .stepper-button.active-state,
11868.md .stepper-fill.color-black .stepper-button-minus.active-state,
11869.md .stepper-fill-md.color-black .stepper-button-minus.active-state,
11870.md .stepper-fill.color-black .stepper-button-plus.active-state,
11871.md .stepper-fill-md.color-black .stepper-button-plus.active-state {
11872 background: #000000;
11873}
11874.md .stepper-fill.color-black .stepper-button:after,
11875.md .stepper-fill-md.color-black .stepper-button:after,
11876.md .stepper-fill.color-black .stepper-button-minus:after,
11877.md .stepper-fill-md.color-black .stepper-button-minus:after,
11878.md .stepper-fill.color-black .stepper-button-plus:after,
11879.md .stepper-fill-md.color-black .stepper-button-plus:after,
11880.md .stepper-fill.color-black .stepper-button:before,
11881.md .stepper-fill-md.color-black .stepper-button:before,
11882.md .stepper-fill.color-black .stepper-button-minus:before,
11883.md .stepper-fill-md.color-black .stepper-button-minus:before,
11884.md .stepper-fill.color-black .stepper-button-plus:before,
11885.md .stepper-fill-md.color-black .stepper-button-plus:before {
11886 background: #fff;
11887}
11888/* === Smart Select === */
11889.smart-select select {
11890 display: none;
11891}
11892.smart-select .item-after {
11893 max-width: 70%;
11894 overflow: hidden;
11895 text-overflow: ellipsis;
11896 position: relative;
11897 display: block;
11898}
11899.sheet-modal.smart-select-sheet .sheet-modal-inner {
11900 background: #fff;
11901}
11902.sheet-modal.smart-select-sheet .list {
11903 margin: 0;
11904}
11905.sheet-modal.smart-select-sheet .list ul:before {
11906 display: none !important;
11907}
11908.sheet-modal.smart-select-sheet .list ul:after {
11909 display: none !important;
11910}
11911.smart-select-popover .popover-inner {
11912 max-height: 40vh;
11913}
11914.md .theme-dark .sheet-modal.smart-select-sheet .sheet-modal-inner {
11915 background-color: transparent;
11916}
11917/* === Grid === */
11918.row {
11919 display: -webkit-box;
11920 display: -webkit-flex;
11921 display: -ms-flexbox;
11922 display: flex;
11923 -webkit-box-pack: justify;
11924 -webkit-justify-content: space-between;
11925 -ms-flex-pack: justify;
11926 justify-content: space-between;
11927 -webkit-flex-wrap: wrap;
11928 -ms-flex-wrap: wrap;
11929 flex-wrap: wrap;
11930 -webkit-box-align: start;
11931 -webkit-align-items: flex-start;
11932 -ms-flex-align: start;
11933 align-items: flex-start;
11934}
11935.row > [class*="col-"],
11936.row > .col {
11937 -webkit-box-sizing: border-box;
11938 box-sizing: border-box;
11939}
11940.row .col {
11941 width: 100%;
11942}
11943/* === Grid === */
11944.md .row .col-100 {
11945 width: 100%;
11946 width: calc((100% - 16px*0) / 1);
11947}
11948.md .row.no-gap .col-100 {
11949 width: 100%;
11950}
11951.md .row .col-95 {
11952 width: 95%;
11953 width: calc((100% - 16px*0.05263157894736836) / 1.0526315789473684);
11954}
11955.md .row.no-gap .col-95 {
11956 width: 95%;
11957}
11958.md .row .col-90 {
11959 width: 90%;
11960 width: calc((100% - 16px*0.11111111111111116) / 1.1111111111111112);
11961}
11962.md .row.no-gap .col-90 {
11963 width: 90%;
11964}
11965.md .row .col-85 {
11966 width: 85%;
11967 width: calc((100% - 16px*0.17647058823529416) / 1.1764705882352942);
11968}
11969.md .row.no-gap .col-85 {
11970 width: 85%;
11971}
11972.md .row .col-80 {
11973 width: 80%;
11974 width: calc((100% - 16px*0.25) / 1.25);
11975}
11976.md .row.no-gap .col-80 {
11977 width: 80%;
11978}
11979.md .row .col-75 {
11980 width: 75%;
11981 width: calc((100% - 16px*0.33333333333333326) / 1.3333333333333333);
11982}
11983.md .row.no-gap .col-75 {
11984 width: 75%;
11985}
11986.md .row .col-70 {
11987 width: 70%;
11988 width: calc((100% - 16px*0.4285714285714286) / 1.4285714285714286);
11989}
11990.md .row.no-gap .col-70 {
11991 width: 70%;
11992}
11993.md .row .col-66 {
11994 width: 66.66666666666666%;
11995 width: calc((100% - 16px*0.5000000000000002) / 1.5000000000000002);
11996}
11997.md .row.no-gap .col-66 {
11998 width: 66.66666666666666%;
11999}
12000.md .row .col-65 {
12001 width: 65%;
12002 width: calc((100% - 16px*0.5384615384615385) / 1.5384615384615385);
12003}
12004.md .row.no-gap .col-65 {
12005 width: 65%;
12006}
12007.md .row .col-60 {
12008 width: 60%;
12009 width: calc((100% - 16px*0.6666666666666667) / 1.6666666666666667);
12010}
12011.md .row.no-gap .col-60 {
12012 width: 60%;
12013}
12014.md .row .col-55 {
12015 width: 55%;
12016 width: calc((100% - 16px*0.8181818181818181) / 1.8181818181818181);
12017}
12018.md .row.no-gap .col-55 {
12019 width: 55%;
12020}
12021.md .row .col-50 {
12022 width: 50%;
12023 width: calc((100% - 16px*1) / 2);
12024}
12025.md .row.no-gap .col-50 {
12026 width: 50%;
12027}
12028.md .row .col-45 {
12029 width: 45%;
12030 width: calc((100% - 16px*1.2222222222222223) / 2.2222222222222223);
12031}
12032.md .row.no-gap .col-45 {
12033 width: 45%;
12034}
12035.md .row .col-40 {
12036 width: 40%;
12037 width: calc((100% - 16px*1.5) / 2.5);
12038}
12039.md .row.no-gap .col-40 {
12040 width: 40%;
12041}
12042.md .row .col-35 {
12043 width: 35%;
12044 width: calc((100% - 16px*1.8571428571428572) / 2.857142857142857);
12045}
12046.md .row.no-gap .col-35 {
12047 width: 35%;
12048}
12049.md .row .col-33 {
12050 width: 33.333333333333336%;
12051 width: calc((100% - 16px*2) / 3);
12052}
12053.md .row.no-gap .col-33 {
12054 width: 33.333333333333336%;
12055}
12056.md .row .col-30 {
12057 width: 30%;
12058 width: calc((100% - 16px*2.3333333333333335) / 3.3333333333333335);
12059}
12060.md .row.no-gap .col-30 {
12061 width: 30%;
12062}
12063.md .row .col-25 {
12064 width: 25%;
12065 width: calc((100% - 16px*3) / 4);
12066}
12067.md .row.no-gap .col-25 {
12068 width: 25%;
12069}
12070.md .row .col-20 {
12071 width: 20%;
12072 width: calc((100% - 16px*4) / 5);
12073}
12074.md .row.no-gap .col-20 {
12075 width: 20%;
12076}
12077.md .row .col-15 {
12078 width: 15%;
12079 width: calc((100% - 16px*5.666666666666667) / 6.666666666666667);
12080}
12081.md .row.no-gap .col-15 {
12082 width: 15%;
12083}
12084.md .row .col-10 {
12085 width: 10%;
12086 width: calc((100% - 16px*9) / 10);
12087}
12088.md .row.no-gap .col-10 {
12089 width: 10%;
12090}
12091.md .row .col-5 {
12092 width: 5%;
12093 width: calc((100% - 16px*19) / 20);
12094}
12095.md .row.no-gap .col-5 {
12096 width: 5%;
12097}
12098.md .row .col:nth-last-child(1),
12099.md .row .col:nth-last-child(1) ~ .col {
12100 width: 100%;
12101 width: calc((100% - 16px*0) / 1);
12102}
12103.md .row.no-gap .col:nth-last-child(1),
12104.md .row.no-gap .col:nth-last-child(1) ~ .col {
12105 width: 100%;
12106}
12107.md .row .col:nth-last-child(2),
12108.md .row .col:nth-last-child(2) ~ .col {
12109 width: 50%;
12110 width: calc((100% - 16px*1) / 2);
12111}
12112.md .row.no-gap .col:nth-last-child(2),
12113.md .row.no-gap .col:nth-last-child(2) ~ .col {
12114 width: 50%;
12115}
12116.md .row .col:nth-last-child(3),
12117.md .row .col:nth-last-child(3) ~ .col {
12118 width: 33.33333333%;
12119 width: calc((100% - 16px*2) / 3);
12120}
12121.md .row.no-gap .col:nth-last-child(3),
12122.md .row.no-gap .col:nth-last-child(3) ~ .col {
12123 width: 33.33333333%;
12124}
12125.md .row .col:nth-last-child(4),
12126.md .row .col:nth-last-child(4) ~ .col {
12127 width: 25%;
12128 width: calc((100% - 16px*3) / 4);
12129}
12130.md .row.no-gap .col:nth-last-child(4),
12131.md .row.no-gap .col:nth-last-child(4) ~ .col {
12132 width: 25%;
12133}
12134.md .row .col:nth-last-child(5),
12135.md .row .col:nth-last-child(5) ~ .col {
12136 width: 20%;
12137 width: calc((100% - 16px*4) / 5);
12138}
12139.md .row.no-gap .col:nth-last-child(5),
12140.md .row.no-gap .col:nth-last-child(5) ~ .col {
12141 width: 20%;
12142}
12143.md .row .col:nth-last-child(6),
12144.md .row .col:nth-last-child(6) ~ .col {
12145 width: 16.66666667%;
12146 width: calc((100% - 16px*5) / 6);
12147}
12148.md .row.no-gap .col:nth-last-child(6),
12149.md .row.no-gap .col:nth-last-child(6) ~ .col {
12150 width: 16.66666667%;
12151}
12152.md .row .col:nth-last-child(7),
12153.md .row .col:nth-last-child(7) ~ .col {
12154 width: 14.28571429%;
12155 width: calc((100% - 16px*6) / 7);
12156}
12157.md .row.no-gap .col:nth-last-child(7),
12158.md .row.no-gap .col:nth-last-child(7) ~ .col {
12159 width: 14.28571429%;
12160}
12161.md .row .col:nth-last-child(8),
12162.md .row .col:nth-last-child(8) ~ .col {
12163 width: 12.5%;
12164 width: calc((100% - 16px*7) / 8);
12165}
12166.md .row.no-gap .col:nth-last-child(8),
12167.md .row.no-gap .col:nth-last-child(8) ~ .col {
12168 width: 12.5%;
12169}
12170.md .row .col:nth-last-child(9),
12171.md .row .col:nth-last-child(9) ~ .col {
12172 width: 11.11111111%;
12173 width: calc((100% - 16px*8) / 9);
12174}
12175.md .row.no-gap .col:nth-last-child(9),
12176.md .row.no-gap .col:nth-last-child(9) ~ .col {
12177 width: 11.11111111%;
12178}
12179.md .row .col:nth-last-child(10),
12180.md .row .col:nth-last-child(10) ~ .col {
12181 width: 10%;
12182 width: calc((100% - 16px*9) / 10);
12183}
12184.md .row.no-gap .col:nth-last-child(10),
12185.md .row.no-gap .col:nth-last-child(10) ~ .col {
12186 width: 10%;
12187}
12188.md .row .col:nth-last-child(11),
12189.md .row .col:nth-last-child(11) ~ .col {
12190 width: 9.09090909%;
12191 width: calc((100% - 16px*10) / 11);
12192}
12193.md .row.no-gap .col:nth-last-child(11),
12194.md .row.no-gap .col:nth-last-child(11) ~ .col {
12195 width: 9.09090909%;
12196}
12197.md .row .col:nth-last-child(12),
12198.md .row .col:nth-last-child(12) ~ .col {
12199 width: 8.33333333%;
12200 width: calc((100% - 16px*11) / 12);
12201}
12202.md .row.no-gap .col:nth-last-child(12),
12203.md .row.no-gap .col:nth-last-child(12) ~ .col {
12204 width: 8.33333333%;
12205}
12206.md .row .col:nth-last-child(13),
12207.md .row .col:nth-last-child(13) ~ .col {
12208 width: 7.69230769%;
12209 width: calc((100% - 16px*12) / 13);
12210}
12211.md .row.no-gap .col:nth-last-child(13),
12212.md .row.no-gap .col:nth-last-child(13) ~ .col {
12213 width: 7.69230769%;
12214}
12215.md .row .col:nth-last-child(14),
12216.md .row .col:nth-last-child(14) ~ .col {
12217 width: 7.14285714%;
12218 width: calc((100% - 16px*13) / 14);
12219}
12220.md .row.no-gap .col:nth-last-child(14),
12221.md .row.no-gap .col:nth-last-child(14) ~ .col {
12222 width: 7.14285714%;
12223}
12224.md .row .col:nth-last-child(15),
12225.md .row .col:nth-last-child(15) ~ .col {
12226 width: 6.66666667%;
12227 width: calc((100% - 16px*14) / 15);
12228}
12229.md .row.no-gap .col:nth-last-child(15),
12230.md .row.no-gap .col:nth-last-child(15) ~ .col {
12231 width: 6.66666667%;
12232}
12233.md .row .col:nth-last-child(16),
12234.md .row .col:nth-last-child(16) ~ .col {
12235 width: 6.25%;
12236 width: calc((100% - 16px*15) / 16);
12237}
12238.md .row.no-gap .col:nth-last-child(16),
12239.md .row.no-gap .col:nth-last-child(16) ~ .col {
12240 width: 6.25%;
12241}
12242.md .row .col:nth-last-child(17),
12243.md .row .col:nth-last-child(17) ~ .col {
12244 width: 5.88235294%;
12245 width: calc((100% - 16px*16) / 17);
12246}
12247.md .row.no-gap .col:nth-last-child(17),
12248.md .row.no-gap .col:nth-last-child(17) ~ .col {
12249 width: 5.88235294%;
12250}
12251.md .row .col:nth-last-child(18),
12252.md .row .col:nth-last-child(18) ~ .col {
12253 width: 5.55555556%;
12254 width: calc((100% - 16px*17) / 18);
12255}
12256.md .row.no-gap .col:nth-last-child(18),
12257.md .row.no-gap .col:nth-last-child(18) ~ .col {
12258 width: 5.55555556%;
12259}
12260.md .row .col:nth-last-child(19),
12261.md .row .col:nth-last-child(19) ~ .col {
12262 width: 5.26315789%;
12263 width: calc((100% - 16px*18) / 19);
12264}
12265.md .row.no-gap .col:nth-last-child(19),
12266.md .row.no-gap .col:nth-last-child(19) ~ .col {
12267 width: 5.26315789%;
12268}
12269.md .row .col:nth-last-child(20),
12270.md .row .col:nth-last-child(20) ~ .col {
12271 width: 5%;
12272 width: calc((100% - 16px*19) / 20);
12273}
12274.md .row.no-gap .col:nth-last-child(20),
12275.md .row.no-gap .col:nth-last-child(20) ~ .col {
12276 width: 5%;
12277}
12278.md .row .col:nth-last-child(21),
12279.md .row .col:nth-last-child(21) ~ .col {
12280 width: 4.76190476%;
12281 width: calc((100% - 16px*20) / 21);
12282}
12283.md .row.no-gap .col:nth-last-child(21),
12284.md .row.no-gap .col:nth-last-child(21) ~ .col {
12285 width: 4.76190476%;
12286}
12287@media (min-width: 768px) {
12288 .md .row .tablet-100 {
12289 width: 100%;
12290 width: calc((100% - 16px*0) / 1);
12291 }
12292 .md .row.no-gap .tablet-100 {
12293 width: 100%;
12294 }
12295 .md .row .tablet-95 {
12296 width: 95%;
12297 width: calc((100% - 16px*0.05263157894736836) / 1.0526315789473684);
12298 }
12299 .md .row.no-gap .tablet-95 {
12300 width: 95%;
12301 }
12302 .md .row .tablet-90 {
12303 width: 90%;
12304 width: calc((100% - 16px*0.11111111111111116) / 1.1111111111111112);
12305 }
12306 .md .row.no-gap .tablet-90 {
12307 width: 90%;
12308 }
12309 .md .row .tablet-85 {
12310 width: 85%;
12311 width: calc((100% - 16px*0.17647058823529416) / 1.1764705882352942);
12312 }
12313 .md .row.no-gap .tablet-85 {
12314 width: 85%;
12315 }
12316 .md .row .tablet-80 {
12317 width: 80%;
12318 width: calc((100% - 16px*0.25) / 1.25);
12319 }
12320 .md .row.no-gap .tablet-80 {
12321 width: 80%;
12322 }
12323 .md .row .tablet-75 {
12324 width: 75%;
12325 width: calc((100% - 16px*0.33333333333333326) / 1.3333333333333333);
12326 }
12327 .md .row.no-gap .tablet-75 {
12328 width: 75%;
12329 }
12330 .md .row .tablet-70 {
12331 width: 70%;
12332 width: calc((100% - 16px*0.4285714285714286) / 1.4285714285714286);
12333 }
12334 .md .row.no-gap .tablet-70 {
12335 width: 70%;
12336 }
12337 .md .row .tablet-66 {
12338 width: 66.66666666666666%;
12339 width: calc((100% - 16px*0.5000000000000002) / 1.5000000000000002);
12340 }
12341 .md .row.no-gap .tablet-66 {
12342 width: 66.66666666666666%;
12343 }
12344 .md .row .tablet-65 {
12345 width: 65%;
12346 width: calc((100% - 16px*0.5384615384615385) / 1.5384615384615385);
12347 }
12348 .md .row.no-gap .tablet-65 {
12349 width: 65%;
12350 }
12351 .md .row .tablet-60 {
12352 width: 60%;
12353 width: calc((100% - 16px*0.6666666666666667) / 1.6666666666666667);
12354 }
12355 .md .row.no-gap .tablet-60 {
12356 width: 60%;
12357 }
12358 .md .row .tablet-55 {
12359 width: 55%;
12360 width: calc((100% - 16px*0.8181818181818181) / 1.8181818181818181);
12361 }
12362 .md .row.no-gap .tablet-55 {
12363 width: 55%;
12364 }
12365 .md .row .tablet-50 {
12366 width: 50%;
12367 width: calc((100% - 16px*1) / 2);
12368 }
12369 .md .row.no-gap .tablet-50 {
12370 width: 50%;
12371 }
12372 .md .row .tablet-45 {
12373 width: 45%;
12374 width: calc((100% - 16px*1.2222222222222223) / 2.2222222222222223);
12375 }
12376 .md .row.no-gap .tablet-45 {
12377 width: 45%;
12378 }
12379 .md .row .tablet-40 {
12380 width: 40%;
12381 width: calc((100% - 16px*1.5) / 2.5);
12382 }
12383 .md .row.no-gap .tablet-40 {
12384 width: 40%;
12385 }
12386 .md .row .tablet-35 {
12387 width: 35%;
12388 width: calc((100% - 16px*1.8571428571428572) / 2.857142857142857);
12389 }
12390 .md .row.no-gap .tablet-35 {
12391 width: 35%;
12392 }
12393 .md .row .tablet-33 {
12394 width: 33.333333333333336%;
12395 width: calc((100% - 16px*2) / 3);
12396 }
12397 .md .row.no-gap .tablet-33 {
12398 width: 33.333333333333336%;
12399 }
12400 .md .row .tablet-30 {
12401 width: 30%;
12402 width: calc((100% - 16px*2.3333333333333335) / 3.3333333333333335);
12403 }
12404 .md .row.no-gap .tablet-30 {
12405 width: 30%;
12406 }
12407 .md .row .tablet-25 {
12408 width: 25%;
12409 width: calc((100% - 16px*3) / 4);
12410 }
12411 .md .row.no-gap .tablet-25 {
12412 width: 25%;
12413 }
12414 .md .row .tablet-20 {
12415 width: 20%;
12416 width: calc((100% - 16px*4) / 5);
12417 }
12418 .md .row.no-gap .tablet-20 {
12419 width: 20%;
12420 }
12421 .md .row .tablet-15 {
12422 width: 15%;
12423 width: calc((100% - 16px*5.666666666666667) / 6.666666666666667);
12424 }
12425 .md .row.no-gap .tablet-15 {
12426 width: 15%;
12427 }
12428 .md .row .tablet-10 {
12429 width: 10%;
12430 width: calc((100% - 16px*9) / 10);
12431 }
12432 .md .row.no-gap .tablet-10 {
12433 width: 10%;
12434 }
12435 .md .row .tablet-5 {
12436 width: 5%;
12437 width: calc((100% - 16px*19) / 20);
12438 }
12439 .md .row.no-gap .tablet-5 {
12440 width: 5%;
12441 }
12442 .md .row .tablet-auto:nth-last-child(1),
12443 .md .row .tablet-auto:nth-last-child(1) ~ .tablet-auto {
12444 width: 100%;
12445 width: calc((100% - 16px*0) / 1);
12446 }
12447 .md .row.no-gap .tablet-auto:nth-last-child(1),
12448 .md .row.no-gap .tablet-auto:nth-last-child(1) ~ .tablet-auto {
12449 width: 100%;
12450 }
12451 .md .row .tablet-auto:nth-last-child(2),
12452 .md .row .tablet-auto:nth-last-child(2) ~ .tablet-auto {
12453 width: 50%;
12454 width: calc((100% - 16px*1) / 2);
12455 }
12456 .md .row.no-gap .tablet-auto:nth-last-child(2),
12457 .md .row.no-gap .tablet-auto:nth-last-child(2) ~ .tablet-auto {
12458 width: 50%;
12459 }
12460 .md .row .tablet-auto:nth-last-child(3),
12461 .md .row .tablet-auto:nth-last-child(3) ~ .tablet-auto {
12462 width: 33.33333333%;
12463 width: calc((100% - 16px*2) / 3);
12464 }
12465 .md .row.no-gap .tablet-auto:nth-last-child(3),
12466 .md .row.no-gap .tablet-auto:nth-last-child(3) ~ .tablet-auto {
12467 width: 33.33333333%;
12468 }
12469 .md .row .tablet-auto:nth-last-child(4),
12470 .md .row .tablet-auto:nth-last-child(4) ~ .tablet-auto {
12471 width: 25%;
12472 width: calc((100% - 16px*3) / 4);
12473 }
12474 .md .row.no-gap .tablet-auto:nth-last-child(4),
12475 .md .row.no-gap .tablet-auto:nth-last-child(4) ~ .tablet-auto {
12476 width: 25%;
12477 }
12478 .md .row .tablet-auto:nth-last-child(5),
12479 .md .row .tablet-auto:nth-last-child(5) ~ .tablet-auto {
12480 width: 20%;
12481 width: calc((100% - 16px*4) / 5);
12482 }
12483 .md .row.no-gap .tablet-auto:nth-last-child(5),
12484 .md .row.no-gap .tablet-auto:nth-last-child(5) ~ .tablet-auto {
12485 width: 20%;
12486 }
12487 .md .row .tablet-auto:nth-last-child(6),
12488 .md .row .tablet-auto:nth-last-child(6) ~ .tablet-auto {
12489 width: 16.66666667%;
12490 width: calc((100% - 16px*5) / 6);
12491 }
12492 .md .row.no-gap .tablet-auto:nth-last-child(6),
12493 .md .row.no-gap .tablet-auto:nth-last-child(6) ~ .tablet-auto {
12494 width: 16.66666667%;
12495 }
12496 .md .row .tablet-auto:nth-last-child(7),
12497 .md .row .tablet-auto:nth-last-child(7) ~ .tablet-auto {
12498 width: 14.28571429%;
12499 width: calc((100% - 16px*6) / 7);
12500 }
12501 .md .row.no-gap .tablet-auto:nth-last-child(7),
12502 .md .row.no-gap .tablet-auto:nth-last-child(7) ~ .tablet-auto {
12503 width: 14.28571429%;
12504 }
12505 .md .row .tablet-auto:nth-last-child(8),
12506 .md .row .tablet-auto:nth-last-child(8) ~ .tablet-auto {
12507 width: 12.5%;
12508 width: calc((100% - 16px*7) / 8);
12509 }
12510 .md .row.no-gap .tablet-auto:nth-last-child(8),
12511 .md .row.no-gap .tablet-auto:nth-last-child(8) ~ .tablet-auto {
12512 width: 12.5%;
12513 }
12514 .md .row .tablet-auto:nth-last-child(9),
12515 .md .row .tablet-auto:nth-last-child(9) ~ .tablet-auto {
12516 width: 11.11111111%;
12517 width: calc((100% - 16px*8) / 9);
12518 }
12519 .md .row.no-gap .tablet-auto:nth-last-child(9),
12520 .md .row.no-gap .tablet-auto:nth-last-child(9) ~ .tablet-auto {
12521 width: 11.11111111%;
12522 }
12523 .md .row .tablet-auto:nth-last-child(10),
12524 .md .row .tablet-auto:nth-last-child(10) ~ .tablet-auto {
12525 width: 10%;
12526 width: calc((100% - 16px*9) / 10);
12527 }
12528 .md .row.no-gap .tablet-auto:nth-last-child(10),
12529 .md .row.no-gap .tablet-auto:nth-last-child(10) ~ .tablet-auto {
12530 width: 10%;
12531 }
12532 .md .row .tablet-auto:nth-last-child(11),
12533 .md .row .tablet-auto:nth-last-child(11) ~ .tablet-auto {
12534 width: 9.09090909%;
12535 width: calc((100% - 16px*10) / 11);
12536 }
12537 .md .row.no-gap .tablet-auto:nth-last-child(11),
12538 .md .row.no-gap .tablet-auto:nth-last-child(11) ~ .tablet-auto {
12539 width: 9.09090909%;
12540 }
12541 .md .row .tablet-auto:nth-last-child(12),
12542 .md .row .tablet-auto:nth-last-child(12) ~ .tablet-auto {
12543 width: 8.33333333%;
12544 width: calc((100% - 16px*11) / 12);
12545 }
12546 .md .row.no-gap .tablet-auto:nth-last-child(12),
12547 .md .row.no-gap .tablet-auto:nth-last-child(12) ~ .tablet-auto {
12548 width: 8.33333333%;
12549 }
12550 .md .row .tablet-auto:nth-last-child(13),
12551 .md .row .tablet-auto:nth-last-child(13) ~ .tablet-auto {
12552 width: 7.69230769%;
12553 width: calc((100% - 16px*12) / 13);
12554 }
12555 .md .row.no-gap .tablet-auto:nth-last-child(13),
12556 .md .row.no-gap .tablet-auto:nth-last-child(13) ~ .tablet-auto {
12557 width: 7.69230769%;
12558 }
12559 .md .row .tablet-auto:nth-last-child(14),
12560 .md .row .tablet-auto:nth-last-child(14) ~ .tablet-auto {
12561 width: 7.14285714%;
12562 width: calc((100% - 16px*13) / 14);
12563 }
12564 .md .row.no-gap .tablet-auto:nth-last-child(14),
12565 .md .row.no-gap .tablet-auto:nth-last-child(14) ~ .tablet-auto {
12566 width: 7.14285714%;
12567 }
12568 .md .row .tablet-auto:nth-last-child(15),
12569 .md .row .tablet-auto:nth-last-child(15) ~ .tablet-auto {
12570 width: 6.66666667%;
12571 width: calc((100% - 16px*14) / 15);
12572 }
12573 .md .row.no-gap .tablet-auto:nth-last-child(15),
12574 .md .row.no-gap .tablet-auto:nth-last-child(15) ~ .tablet-auto {
12575 width: 6.66666667%;
12576 }
12577 .md .row .tablet-auto:nth-last-child(16),
12578 .md .row .tablet-auto:nth-last-child(16) ~ .tablet-auto {
12579 width: 6.25%;
12580 width: calc((100% - 16px*15) / 16);
12581 }
12582 .md .row.no-gap .tablet-auto:nth-last-child(16),
12583 .md .row.no-gap .tablet-auto:nth-last-child(16) ~ .tablet-auto {
12584 width: 6.25%;
12585 }
12586 .md .row .tablet-auto:nth-last-child(17),
12587 .md .row .tablet-auto:nth-last-child(17) ~ .tablet-auto {
12588 width: 5.88235294%;
12589 width: calc((100% - 16px*16) / 17);
12590 }
12591 .md .row.no-gap .tablet-auto:nth-last-child(17),
12592 .md .row.no-gap .tablet-auto:nth-last-child(17) ~ .tablet-auto {
12593 width: 5.88235294%;
12594 }
12595 .md .row .tablet-auto:nth-last-child(18),
12596 .md .row .tablet-auto:nth-last-child(18) ~ .tablet-auto {
12597 width: 5.55555556%;
12598 width: calc((100% - 16px*17) / 18);
12599 }
12600 .md .row.no-gap .tablet-auto:nth-last-child(18),
12601 .md .row.no-gap .tablet-auto:nth-last-child(18) ~ .tablet-auto {
12602 width: 5.55555556%;
12603 }
12604 .md .row .tablet-auto:nth-last-child(19),
12605 .md .row .tablet-auto:nth-last-child(19) ~ .tablet-auto {
12606 width: 5.26315789%;
12607 width: calc((100% - 16px*18) / 19);
12608 }
12609 .md .row.no-gap .tablet-auto:nth-last-child(19),
12610 .md .row.no-gap .tablet-auto:nth-last-child(19) ~ .tablet-auto {
12611 width: 5.26315789%;
12612 }
12613 .md .row .tablet-auto:nth-last-child(20),
12614 .md .row .tablet-auto:nth-last-child(20) ~ .tablet-auto {
12615 width: 5%;
12616 width: calc((100% - 16px*19) / 20);
12617 }
12618 .md .row.no-gap .tablet-auto:nth-last-child(20),
12619 .md .row.no-gap .tablet-auto:nth-last-child(20) ~ .tablet-auto {
12620 width: 5%;
12621 }
12622 .md .row .tablet-auto:nth-last-child(21),
12623 .md .row .tablet-auto:nth-last-child(21) ~ .tablet-auto {
12624 width: 4.76190476%;
12625 width: calc((100% - 16px*20) / 21);
12626 }
12627 .md .row.no-gap .tablet-auto:nth-last-child(21),
12628 .md .row.no-gap .tablet-auto:nth-last-child(21) ~ .tablet-auto {
12629 width: 4.76190476%;
12630 }
12631}
12632@media (min-width: 1025px) {
12633 .md .row .desktop-100 {
12634 width: 100%;
12635 width: calc((100% - 16px*0) / 1);
12636 }
12637 .md .row.no-gap .desktop-100 {
12638 width: 100%;
12639 }
12640 .md .row .desktop-95 {
12641 width: 95%;
12642 width: calc((100% - 16px*0.05263157894736836) / 1.0526315789473684);
12643 }
12644 .md .row.no-gap .desktop-95 {
12645 width: 95%;
12646 }
12647 .md .row .desktop-90 {
12648 width: 90%;
12649 width: calc((100% - 16px*0.11111111111111116) / 1.1111111111111112);
12650 }
12651 .md .row.no-gap .desktop-90 {
12652 width: 90%;
12653 }
12654 .md .row .desktop-85 {
12655 width: 85%;
12656 width: calc((100% - 16px*0.17647058823529416) / 1.1764705882352942);
12657 }
12658 .md .row.no-gap .desktop-85 {
12659 width: 85%;
12660 }
12661 .md .row .desktop-80 {
12662 width: 80%;
12663 width: calc((100% - 16px*0.25) / 1.25);
12664 }
12665 .md .row.no-gap .desktop-80 {
12666 width: 80%;
12667 }
12668 .md .row .desktop-75 {
12669 width: 75%;
12670 width: calc((100% - 16px*0.33333333333333326) / 1.3333333333333333);
12671 }
12672 .md .row.no-gap .desktop-75 {
12673 width: 75%;
12674 }
12675 .md .row .desktop-70 {
12676 width: 70%;
12677 width: calc((100% - 16px*0.4285714285714286) / 1.4285714285714286);
12678 }
12679 .md .row.no-gap .desktop-70 {
12680 width: 70%;
12681 }
12682 .md .row .desktop-66 {
12683 width: 66.66666666666666%;
12684 width: calc((100% - 16px*0.5000000000000002) / 1.5000000000000002);
12685 }
12686 .md .row.no-gap .desktop-66 {
12687 width: 66.66666666666666%;
12688 }
12689 .md .row .desktop-65 {
12690 width: 65%;
12691 width: calc((100% - 16px*0.5384615384615385) / 1.5384615384615385);
12692 }
12693 .md .row.no-gap .desktop-65 {
12694 width: 65%;
12695 }
12696 .md .row .desktop-60 {
12697 width: 60%;
12698 width: calc((100% - 16px*0.6666666666666667) / 1.6666666666666667);
12699 }
12700 .md .row.no-gap .desktop-60 {
12701 width: 60%;
12702 }
12703 .md .row .desktop-55 {
12704 width: 55%;
12705 width: calc((100% - 16px*0.8181818181818181) / 1.8181818181818181);
12706 }
12707 .md .row.no-gap .desktop-55 {
12708 width: 55%;
12709 }
12710 .md .row .desktop-50 {
12711 width: 50%;
12712 width: calc((100% - 16px*1) / 2);
12713 }
12714 .md .row.no-gap .desktop-50 {
12715 width: 50%;
12716 }
12717 .md .row .desktop-45 {
12718 width: 45%;
12719 width: calc((100% - 16px*1.2222222222222223) / 2.2222222222222223);
12720 }
12721 .md .row.no-gap .desktop-45 {
12722 width: 45%;
12723 }
12724 .md .row .desktop-40 {
12725 width: 40%;
12726 width: calc((100% - 16px*1.5) / 2.5);
12727 }
12728 .md .row.no-gap .desktop-40 {
12729 width: 40%;
12730 }
12731 .md .row .desktop-35 {
12732 width: 35%;
12733 width: calc((100% - 16px*1.8571428571428572) / 2.857142857142857);
12734 }
12735 .md .row.no-gap .desktop-35 {
12736 width: 35%;
12737 }
12738 .md .row .desktop-33 {
12739 width: 33.333333333333336%;
12740 width: calc((100% - 16px*2) / 3);
12741 }
12742 .md .row.no-gap .desktop-33 {
12743 width: 33.333333333333336%;
12744 }
12745 .md .row .desktop-30 {
12746 width: 30%;
12747 width: calc((100% - 16px*2.3333333333333335) / 3.3333333333333335);
12748 }
12749 .md .row.no-gap .desktop-30 {
12750 width: 30%;
12751 }
12752 .md .row .desktop-25 {
12753 width: 25%;
12754 width: calc((100% - 16px*3) / 4);
12755 }
12756 .md .row.no-gap .desktop-25 {
12757 width: 25%;
12758 }
12759 .md .row .desktop-20 {
12760 width: 20%;
12761 width: calc((100% - 16px*4) / 5);
12762 }
12763 .md .row.no-gap .desktop-20 {
12764 width: 20%;
12765 }
12766 .md .row .desktop-15 {
12767 width: 15%;
12768 width: calc((100% - 16px*5.666666666666667) / 6.666666666666667);
12769 }
12770 .md .row.no-gap .desktop-15 {
12771 width: 15%;
12772 }
12773 .md .row .desktop-10 {
12774 width: 10%;
12775 width: calc((100% - 16px*9) / 10);
12776 }
12777 .md .row.no-gap .desktop-10 {
12778 width: 10%;
12779 }
12780 .md .row .desktop-5 {
12781 width: 5%;
12782 width: calc((100% - 16px*19) / 20);
12783 }
12784 .md .row.no-gap .desktop-5 {
12785 width: 5%;
12786 }
12787 .md .row .desktop-auto:nth-last-child(1),
12788 .md .row .desktop-auto:nth-last-child(1) ~ .desktop-auto {
12789 width: 100%;
12790 width: calc((100% - 16px*0) / 1);
12791 }
12792 .md .row.no-gap .desktop-auto:nth-last-child(1),
12793 .md .row.no-gap .desktop-auto:nth-last-child(1) ~ .desktop-auto {
12794 width: 100%;
12795 }
12796 .md .row .desktop-auto:nth-last-child(2),
12797 .md .row .desktop-auto:nth-last-child(2) ~ .desktop-auto {
12798 width: 50%;
12799 width: calc((100% - 16px*1) / 2);
12800 }
12801 .md .row.no-gap .desktop-auto:nth-last-child(2),
12802 .md .row.no-gap .desktop-auto:nth-last-child(2) ~ .desktop-auto {
12803 width: 50%;
12804 }
12805 .md .row .desktop-auto:nth-last-child(3),
12806 .md .row .desktop-auto:nth-last-child(3) ~ .desktop-auto {
12807 width: 33.33333333%;
12808 width: calc((100% - 16px*2) / 3);
12809 }
12810 .md .row.no-gap .desktop-auto:nth-last-child(3),
12811 .md .row.no-gap .desktop-auto:nth-last-child(3) ~ .desktop-auto {
12812 width: 33.33333333%;
12813 }
12814 .md .row .desktop-auto:nth-last-child(4),
12815 .md .row .desktop-auto:nth-last-child(4) ~ .desktop-auto {
12816 width: 25%;
12817 width: calc((100% - 16px*3) / 4);
12818 }
12819 .md .row.no-gap .desktop-auto:nth-last-child(4),
12820 .md .row.no-gap .desktop-auto:nth-last-child(4) ~ .desktop-auto {
12821 width: 25%;
12822 }
12823 .md .row .desktop-auto:nth-last-child(5),
12824 .md .row .desktop-auto:nth-last-child(5) ~ .desktop-auto {
12825 width: 20%;
12826 width: calc((100% - 16px*4) / 5);
12827 }
12828 .md .row.no-gap .desktop-auto:nth-last-child(5),
12829 .md .row.no-gap .desktop-auto:nth-last-child(5) ~ .desktop-auto {
12830 width: 20%;
12831 }
12832 .md .row .desktop-auto:nth-last-child(6),
12833 .md .row .desktop-auto:nth-last-child(6) ~ .desktop-auto {
12834 width: 16.66666667%;
12835 width: calc((100% - 16px*5) / 6);
12836 }
12837 .md .row.no-gap .desktop-auto:nth-last-child(6),
12838 .md .row.no-gap .desktop-auto:nth-last-child(6) ~ .desktop-auto {
12839 width: 16.66666667%;
12840 }
12841 .md .row .desktop-auto:nth-last-child(7),
12842 .md .row .desktop-auto:nth-last-child(7) ~ .desktop-auto {
12843 width: 14.28571429%;
12844 width: calc((100% - 16px*6) / 7);
12845 }
12846 .md .row.no-gap .desktop-auto:nth-last-child(7),
12847 .md .row.no-gap .desktop-auto:nth-last-child(7) ~ .desktop-auto {
12848 width: 14.28571429%;
12849 }
12850 .md .row .desktop-auto:nth-last-child(8),
12851 .md .row .desktop-auto:nth-last-child(8) ~ .desktop-auto {
12852 width: 12.5%;
12853 width: calc((100% - 16px*7) / 8);
12854 }
12855 .md .row.no-gap .desktop-auto:nth-last-child(8),
12856 .md .row.no-gap .desktop-auto:nth-last-child(8) ~ .desktop-auto {
12857 width: 12.5%;
12858 }
12859 .md .row .desktop-auto:nth-last-child(9),
12860 .md .row .desktop-auto:nth-last-child(9) ~ .desktop-auto {
12861 width: 11.11111111%;
12862 width: calc((100% - 16px*8) / 9);
12863 }
12864 .md .row.no-gap .desktop-auto:nth-last-child(9),
12865 .md .row.no-gap .desktop-auto:nth-last-child(9) ~ .desktop-auto {
12866 width: 11.11111111%;
12867 }
12868 .md .row .desktop-auto:nth-last-child(10),
12869 .md .row .desktop-auto:nth-last-child(10) ~ .desktop-auto {
12870 width: 10%;
12871 width: calc((100% - 16px*9) / 10);
12872 }
12873 .md .row.no-gap .desktop-auto:nth-last-child(10),
12874 .md .row.no-gap .desktop-auto:nth-last-child(10) ~ .desktop-auto {
12875 width: 10%;
12876 }
12877 .md .row .desktop-auto:nth-last-child(11),
12878 .md .row .desktop-auto:nth-last-child(11) ~ .desktop-auto {
12879 width: 9.09090909%;
12880 width: calc((100% - 16px*10) / 11);
12881 }
12882 .md .row.no-gap .desktop-auto:nth-last-child(11),
12883 .md .row.no-gap .desktop-auto:nth-last-child(11) ~ .desktop-auto {
12884 width: 9.09090909%;
12885 }
12886 .md .row .desktop-auto:nth-last-child(12),
12887 .md .row .desktop-auto:nth-last-child(12) ~ .desktop-auto {
12888 width: 8.33333333%;
12889 width: calc((100% - 16px*11) / 12);
12890 }
12891 .md .row.no-gap .desktop-auto:nth-last-child(12),
12892 .md .row.no-gap .desktop-auto:nth-last-child(12) ~ .desktop-auto {
12893 width: 8.33333333%;
12894 }
12895 .md .row .desktop-auto:nth-last-child(13),
12896 .md .row .desktop-auto:nth-last-child(13) ~ .desktop-auto {
12897 width: 7.69230769%;
12898 width: calc((100% - 16px*12) / 13);
12899 }
12900 .md .row.no-gap .desktop-auto:nth-last-child(13),
12901 .md .row.no-gap .desktop-auto:nth-last-child(13) ~ .desktop-auto {
12902 width: 7.69230769%;
12903 }
12904 .md .row .desktop-auto:nth-last-child(14),
12905 .md .row .desktop-auto:nth-last-child(14) ~ .desktop-auto {
12906 width: 7.14285714%;
12907 width: calc((100% - 16px*13) / 14);
12908 }
12909 .md .row.no-gap .desktop-auto:nth-last-child(14),
12910 .md .row.no-gap .desktop-auto:nth-last-child(14) ~ .desktop-auto {
12911 width: 7.14285714%;
12912 }
12913 .md .row .desktop-auto:nth-last-child(15),
12914 .md .row .desktop-auto:nth-last-child(15) ~ .desktop-auto {
12915 width: 6.66666667%;
12916 width: calc((100% - 16px*14) / 15);
12917 }
12918 .md .row.no-gap .desktop-auto:nth-last-child(15),
12919 .md .row.no-gap .desktop-auto:nth-last-child(15) ~ .desktop-auto {
12920 width: 6.66666667%;
12921 }
12922 .md .row .desktop-auto:nth-last-child(16),
12923 .md .row .desktop-auto:nth-last-child(16) ~ .desktop-auto {
12924 width: 6.25%;
12925 width: calc((100% - 16px*15) / 16);
12926 }
12927 .md .row.no-gap .desktop-auto:nth-last-child(16),
12928 .md .row.no-gap .desktop-auto:nth-last-child(16) ~ .desktop-auto {
12929 width: 6.25%;
12930 }
12931 .md .row .desktop-auto:nth-last-child(17),
12932 .md .row .desktop-auto:nth-last-child(17) ~ .desktop-auto {
12933 width: 5.88235294%;
12934 width: calc((100% - 16px*16) / 17);
12935 }
12936 .md .row.no-gap .desktop-auto:nth-last-child(17),
12937 .md .row.no-gap .desktop-auto:nth-last-child(17) ~ .desktop-auto {
12938 width: 5.88235294%;
12939 }
12940 .md .row .desktop-auto:nth-last-child(18),
12941 .md .row .desktop-auto:nth-last-child(18) ~ .desktop-auto {
12942 width: 5.55555556%;
12943 width: calc((100% - 16px*17) / 18);
12944 }
12945 .md .row.no-gap .desktop-auto:nth-last-child(18),
12946 .md .row.no-gap .desktop-auto:nth-last-child(18) ~ .desktop-auto {
12947 width: 5.55555556%;
12948 }
12949 .md .row .desktop-auto:nth-last-child(19),
12950 .md .row .desktop-auto:nth-last-child(19) ~ .desktop-auto {
12951 width: 5.26315789%;
12952 width: calc((100% - 16px*18) / 19);
12953 }
12954 .md .row.no-gap .desktop-auto:nth-last-child(19),
12955 .md .row.no-gap .desktop-auto:nth-last-child(19) ~ .desktop-auto {
12956 width: 5.26315789%;
12957 }
12958 .md .row .desktop-auto:nth-last-child(20),
12959 .md .row .desktop-auto:nth-last-child(20) ~ .desktop-auto {
12960 width: 5%;
12961 width: calc((100% - 16px*19) / 20);
12962 }
12963 .md .row.no-gap .desktop-auto:nth-last-child(20),
12964 .md .row.no-gap .desktop-auto:nth-last-child(20) ~ .desktop-auto {
12965 width: 5%;
12966 }
12967 .md .row .desktop-auto:nth-last-child(21),
12968 .md .row .desktop-auto:nth-last-child(21) ~ .desktop-auto {
12969 width: 4.76190476%;
12970 width: calc((100% - 16px*20) / 21);
12971 }
12972 .md .row.no-gap .desktop-auto:nth-last-child(21),
12973 .md .row.no-gap .desktop-auto:nth-last-child(21) ~ .desktop-auto {
12974 width: 4.76190476%;
12975 }
12976}
12977/* === Calendar/Datepicker === */
12978.calendar {
12979 overflow: hidden;
12980 height: 320px;
12981 width: 100%;
12982 display: -webkit-box;
12983 display: -webkit-flex;
12984 display: -ms-flexbox;
12985 display: flex;
12986 -webkit-box-orient: vertical;
12987 -webkit-box-direction: normal;
12988 -webkit-flex-direction: column;
12989 -ms-flex-direction: column;
12990 flex-direction: column;
12991}
12992.calendar.modal-in {
12993 display: -webkit-box;
12994 display: -webkit-flex;
12995 display: -ms-flexbox;
12996 display: flex;
12997}
12998@media (orientation: landscape) and (max-height: 415px) {
12999 .calendar.calendar-sheet {
13000 height: 220px;
13001 }
13002 .calendar.calendar-modal {
13003 height: calc(100vh - 44px);
13004 }
13005}
13006.calendar.calendar-inline,
13007.calendar.calendar-popover .calendar {
13008 position: relative;
13009}
13010.calendar-modal {
13011 position: absolute;
13012 height: 420px;
13013 overflow: hidden;
13014 top: 50%;
13015 left: 50%;
13016 min-width: 300px;
13017 max-width: 380px;
13018 -webkit-transform: translate3d(-50%, 100%, 0);
13019 transform: translate3d(-50%, 100%, 0);
13020 -webkit-transition-property: -webkit-transform;
13021 transition-property: -webkit-transform;
13022 transition-property: transform;
13023 transition-property: transform, -webkit-transform;
13024 display: -webkit-box;
13025 display: -webkit-flex;
13026 display: -ms-flexbox;
13027 display: flex;
13028 z-index: 12000;
13029 background: #fff;
13030 width: 90%;
13031 border-radius: 4px;
13032 -webkit-box-shadow: 0 19px 38px rgba(0, 0, 0, 0.3), 0 15px 12px rgba(0, 0, 0, 0.22);
13033 box-shadow: 0 19px 38px rgba(0, 0, 0, 0.3), 0 15px 12px rgba(0, 0, 0, 0.22);
13034}
13035.calendar-modal.modal-in,
13036.calendar-modal.modal-out {
13037 -webkit-transition-duration: 400ms;
13038 transition-duration: 400ms;
13039}
13040.calendar-modal.modal-in {
13041 -webkit-transform: translate3d(-50%, -50%, 0);
13042 transform: translate3d(-50%, -50%, 0);
13043}
13044.calendar-modal.modal-out {
13045 -webkit-transform: translate3d(-50%, 100%, 0);
13046 transform: translate3d(-50%, 100%, 0);
13047}
13048.calendar-popover {
13049 width: 320px;
13050}
13051.calendar-popover .calendar {
13052 height: 320px;
13053}
13054.calendar-week-header {
13055 display: -webkit-box;
13056 display: -webkit-flex;
13057 display: -ms-flexbox;
13058 display: flex;
13059 -webkit-box-sizing: border-box;
13060 box-sizing: border-box;
13061 position: relative;
13062 font-size: 11px;
13063}
13064.calendar-week-header .calendar-week-day {
13065 -webkit-flex-shrink: 1;
13066 -ms-flex-negative: 1;
13067 flex-shrink: 1;
13068 width: 14.28571429%;
13069 width: calc(100% / 7);
13070 text-align: center;
13071}
13072.calendar-months {
13073 width: 100%;
13074 height: 100%;
13075 overflow: hidden;
13076 position: relative;
13077 -webkit-flex-shrink: 10;
13078 -ms-flex-negative: 10;
13079 flex-shrink: 10;
13080}
13081.calendar-months-wrapper {
13082 position: relative;
13083 width: 100%;
13084 height: 100%;
13085 -webkit-transition: 300ms;
13086 transition: 300ms;
13087}
13088.calendar-month {
13089 display: -webkit-box;
13090 display: -webkit-flex;
13091 display: -ms-flexbox;
13092 display: flex;
13093 -webkit-box-orient: vertical;
13094 -webkit-box-direction: normal;
13095 -webkit-flex-direction: column;
13096 -ms-flex-direction: column;
13097 flex-direction: column;
13098 width: 100%;
13099 height: 100%;
13100 position: absolute;
13101 left: 0;
13102 top: 0;
13103}
13104.calendar-row {
13105 height: 16.66666667%;
13106 height: calc(100% / 6);
13107 display: -webkit-box;
13108 display: -webkit-flex;
13109 display: -ms-flexbox;
13110 display: flex;
13111 -webkit-flex-shrink: 1;
13112 -ms-flex-negative: 1;
13113 flex-shrink: 1;
13114 width: 100%;
13115 position: relative;
13116 -webkit-box-sizing: border-box;
13117 box-sizing: border-box;
13118}
13119.calendar-day {
13120 -webkit-flex-shrink: 1;
13121 -ms-flex-negative: 1;
13122 flex-shrink: 1;
13123 display: -webkit-box;
13124 display: -webkit-flex;
13125 display: -ms-flexbox;
13126 display: flex;
13127 -webkit-box-pack: center;
13128 -webkit-justify-content: center;
13129 -ms-flex-pack: center;
13130 justify-content: center;
13131 -webkit-box-align: center;
13132 -webkit-align-items: center;
13133 -ms-flex-align: center;
13134 align-items: center;
13135 -webkit-box-sizing: border-box;
13136 box-sizing: border-box;
13137 width: 14.28571429%;
13138 width: calc(100% / 7);
13139 text-align: center;
13140 cursor: pointer;
13141 z-index: 20;
13142 color: #000;
13143 height: 100%;
13144}
13145.calendar-day.calendar-day-prev,
13146.calendar-day.calendar-day-next {
13147 color: #b8b8b8;
13148}
13149.calendar-day.calendar-day-disabled {
13150 color: #d4d4d4;
13151 cursor: auto;
13152}
13153.calendar-day.calendar-day-selected .calendar-day-number {
13154 color: #fff;
13155}
13156.calendar-day .calendar-day-number {
13157 display: inline-block;
13158 border-radius: 100%;
13159 position: relative;
13160}
13161.calendar-day .calendar-day-events {
13162 position: absolute;
13163 display: -webkit-box;
13164 display: -webkit-flex;
13165 display: -ms-flexbox;
13166 display: flex;
13167 left: 0;
13168 width: 100%;
13169 top: 100%;
13170 -webkit-box-align: center;
13171 -webkit-align-items: center;
13172 -ms-flex-align: center;
13173 align-items: center;
13174 -webkit-box-pack: center;
13175 -webkit-justify-content: center;
13176 -ms-flex-pack: center;
13177 justify-content: center;
13178 margin-top: 1px;
13179}
13180.calendar-day .calendar-day-event {
13181 width: 4px;
13182 height: 4px;
13183 border-radius: 50%;
13184}
13185.calendar-day .calendar-day-event + .calendar-day-event {
13186 margin-left: 2px;
13187}
13188.calendar-range .calendar-day.calendar-day-selected {
13189 -webkit-box-align: stretch;
13190 -webkit-align-items: stretch;
13191 -ms-flex-align: stretch;
13192 align-items: stretch;
13193 -webkit-align-content: stretch;
13194 -ms-flex-line-pack: stretch;
13195 align-content: stretch;
13196}
13197.calendar-range .calendar-day.calendar-day-selected .calendar-day-number {
13198 width: 100%;
13199 border-radius: 0;
13200 height: auto;
13201 text-align: center;
13202 display: -webkit-box;
13203 display: -webkit-flex;
13204 display: -ms-flexbox;
13205 display: flex;
13206 -webkit-box-align: center;
13207 -webkit-align-items: center;
13208 -ms-flex-align: center;
13209 align-items: center;
13210 -webkit-box-pack: center;
13211 -webkit-justify-content: center;
13212 -ms-flex-pack: center;
13213 justify-content: center;
13214}
13215.calendar-month-selector,
13216.calendar-year-selector {
13217 display: -webkit-box;
13218 display: -webkit-flex;
13219 display: -ms-flexbox;
13220 display: flex;
13221 -webkit-box-pack: justify;
13222 -webkit-justify-content: space-between;
13223 -ms-flex-pack: justify;
13224 justify-content: space-between;
13225 -webkit-box-align: center;
13226 -webkit-align-items: center;
13227 -ms-flex-align: center;
13228 align-items: center;
13229 width: 50%;
13230 max-width: 200px;
13231 -webkit-flex-shrink: 10;
13232 -ms-flex-negative: 10;
13233 flex-shrink: 10;
13234}
13235.calendar-month-selector .calendar-day-number,
13236.calendar-year-selector .calendar-day-number {
13237 -webkit-flex-shrink: 1;
13238 -ms-flex-negative: 1;
13239 flex-shrink: 1;
13240 position: relative;
13241 overflow: hidden;
13242 text-overflow: ellipsis;
13243}
13244.md .calendar-header {
13245 height: 56px;
13246 background: #2196f3;
13247 font-size: 20px;
13248 line-height: 56px;
13249 padding: 0 24px;
13250 color: #fff;
13251 position: relative;
13252 overflow: hidden;
13253 white-space: nowrap;
13254 text-overflow: ellipsis;
13255 -webkit-box-sizing: border-box;
13256 box-sizing: border-box;
13257}
13258.md .calendar-footer {
13259 position: relative;
13260 width: 100%;
13261 height: 48px;
13262 padding: 6px 8px;
13263 overflow: hidden;
13264 -webkit-box-sizing: border-box;
13265 box-sizing: border-box;
13266 display: -webkit-box;
13267 display: -webkit-flex;
13268 display: -ms-flexbox;
13269 display: flex;
13270 -webkit-box-pack: end;
13271 -webkit-justify-content: flex-end;
13272 -ms-flex-pack: end;
13273 justify-content: flex-end;
13274}
13275.md .calendar .toolbar {
13276 background: none !important;
13277 color: #212121;
13278}
13279.md .calendar .toolbar a.link:before {
13280 content: '';
13281 width: 152%;
13282 height: 152%;
13283 position: absolute;
13284 left: -26%;
13285 top: -26%;
13286 background-image: -webkit-radial-gradient(center, circle, rgba(0, 0, 0, 0.15) 66%, rgba(0, 0, 0, 0) 66%);
13287 background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0.15) 66%, rgba(0, 0, 0, 0) 66%);
13288 background-repeat: no-repeat;
13289 background-position: center;
13290 background-size: 100% 100%;
13291 opacity: 0;
13292 pointer-events: none;
13293 -webkit-transition-duration: 600ms;
13294 transition-duration: 600ms;
13295}
13296.md .calendar .toolbar a.link.active-state:before {
13297 opacity: 1;
13298 -webkit-transition-duration: 150ms;
13299 transition-duration: 150ms;
13300}
13301.md .calendar .toolbar a.link .ripple-wave {
13302 background: rgba(0, 0, 0, 0.1);
13303}
13304.md .calendar .toolbar .icon-next,
13305.md .calendar .toolbar .icon-prev,
13306.md .calendar .toolbar .icon-forward,
13307.md .calendar .toolbar .icon-back {
13308 opacity: 0.54;
13309}
13310.md .calendar-week-header {
13311 color: rgba(0, 0, 0, 0.54);
13312 height: 24px;
13313}
13314.md .calendar-week-header .calendar-week-day {
13315 line-height: 24px;
13316}
13317.md .calendar-day.calendar-day-today .calendar-day-number {
13318 color: #2196f3;
13319}
13320.md .calendar-day.calendar-day-selected .calendar-day-number {
13321 background: #2196f3;
13322 color: #fff;
13323}
13324.md .calendar-day .calendar-day-number {
13325 width: 32px;
13326 height: 32px;
13327 line-height: 32px;
13328}
13329.md .calendar-day .calendar-day-event {
13330 background: #2196f3;
13331}
13332.md .calendar-range .calendar-day.calendar-day-selected .calendar-day-number {
13333 color: #fff;
13334}
13335.md .calendar-month-selector a.icon-only,
13336.md .calendar-year-selector a.icon-only {
13337 min-width: 36px;
13338}
13339.md .calendar-sheet:before {
13340 content: '';
13341 position: absolute;
13342 background-color: #ccc;
13343 display: block;
13344 z-index: 15;
13345 top: 0;
13346 right: auto;
13347 bottom: auto;
13348 left: 0;
13349 height: 1px;
13350 width: 100%;
13351 -webkit-transform-origin: 50% 0%;
13352 transform-origin: 50% 0%;
13353}
13354.md.device-pixel-ratio-2 .calendar-sheet:before {
13355 -webkit-transform: scaleY(0.5);
13356 transform: scaleY(0.5);
13357}
13358.md.device-pixel-ratio-3 .calendar-sheet:before {
13359 -webkit-transform: scaleY(0.33);
13360 transform: scaleY(0.33);
13361}
13362.md.device-iphone-x .calendar-sheet .sheet-modal-inner {
13363 margin-bottom: constant(safe-area-inset-bottom);
13364 margin-bottom: env(safe-area-inset-bottom);
13365}
13366@media (orientation: landscape) {
13367 .md.device-iphone-x .ios-left-edge.calendar .calendar-row,
13368 .md.device-iphone-x .ios-edges.calendar .calendar-row,
13369 .md.device-iphone-x .popup.calendar .calendar-row,
13370 .md.device-iphone-x .sheet-modal.calendar .calendar-row,
13371 .md.device-iphone-x .panel-left.calendar .calendar-row,
13372 .md.device-iphone-x .ios-left-edge .calendar:not(.no-ios-edges):not(.no-ios-left-edge) .calendar-row,
13373 .md.device-iphone-x .ios-edges .calendar:not(.no-ios-edges):not(.no-ios-left-edge) .calendar-row,
13374 .md.device-iphone-x .popup .calendar:not(.no-ios-edges):not(.no-ios-left-edge) .calendar-row,
13375 .md.device-iphone-x .sheet-modal .calendar:not(.no-ios-edges):not(.no-ios-left-edge) .calendar-row,
13376 .md.device-iphone-x .panel-left .calendar:not(.no-ios-edges):not(.no-ios-left-edge) .calendar-row,
13377 .md.device-iphone-x .ios-left-edge.calendar .calendar-week-header,
13378 .md.device-iphone-x .ios-edges.calendar .calendar-week-header,
13379 .md.device-iphone-x .popup.calendar .calendar-week-header,
13380 .md.device-iphone-x .sheet-modal.calendar .calendar-week-header,
13381 .md.device-iphone-x .panel-left.calendar .calendar-week-header,
13382 .md.device-iphone-x .ios-left-edge .calendar:not(.no-ios-edges):not(.no-ios-left-edge) .calendar-week-header,
13383 .md.device-iphone-x .ios-edges .calendar:not(.no-ios-edges):not(.no-ios-left-edge) .calendar-week-header,
13384 .md.device-iphone-x .popup .calendar:not(.no-ios-edges):not(.no-ios-left-edge) .calendar-week-header,
13385 .md.device-iphone-x .sheet-modal .calendar:not(.no-ios-edges):not(.no-ios-left-edge) .calendar-week-header,
13386 .md.device-iphone-x .panel-left .calendar:not(.no-ios-edges):not(.no-ios-left-edge) .calendar-week-header {
13387 padding-left: constant(safe-area-inset-left);
13388 padding-left: env(safe-area-inset-left);
13389 }
13390 .md.device-iphone-x .ios-right-edge.calendar .calendar-row,
13391 .md.device-iphone-x .ios-edges.calendar .calendar-row,
13392 .md.device-iphone-x .popup.calendar .calendar-row,
13393 .md.device-iphone-x .sheet-modal.calendar .calendar-row,
13394 .md.device-iphone-x .panel-right.calendar .calendar-row,
13395 .md.device-iphone-x .ios-right-edge .calendar:not(.no-ios-edges):not(.no-ios-right-edge) .calendar-row,
13396 .md.device-iphone-x .ios-edges .calendar:not(.no-ios-edges):not(.no-ios-right-edge) .calendar-row,
13397 .md.device-iphone-x .popup .calendar:not(.no-ios-edges):not(.no-ios-right-edge) .calendar-row,
13398 .md.device-iphone-x .sheet-modal .calendar:not(.no-ios-edges):not(.no-ios-right-edge) .calendar-row,
13399 .md.device-iphone-x .panel-right .calendar:not(.no-ios-edges):not(.no-ios-right-edge) .calendar-row,
13400 .md.device-iphone-x .ios-right-edge.calendar .calendar-week-header,
13401 .md.device-iphone-x .ios-edges.calendar .calendar-week-header,
13402 .md.device-iphone-x .popup.calendar .calendar-week-header,
13403 .md.device-iphone-x .sheet-modal.calendar .calendar-week-header,
13404 .md.device-iphone-x .panel-right.calendar .calendar-week-header,
13405 .md.device-iphone-x .ios-right-edge .calendar:not(.no-ios-edges):not(.no-ios-right-edge) .calendar-week-header,
13406 .md.device-iphone-x .ios-edges .calendar:not(.no-ios-edges):not(.no-ios-right-edge) .calendar-week-header,
13407 .md.device-iphone-x .popup .calendar:not(.no-ios-edges):not(.no-ios-right-edge) .calendar-week-header,
13408 .md.device-iphone-x .sheet-modal .calendar:not(.no-ios-edges):not(.no-ios-right-edge) .calendar-week-header,
13409 .md.device-iphone-x .panel-right .calendar:not(.no-ios-edges):not(.no-ios-right-edge) .calendar-week-header {
13410 padding-right: constant(safe-area-inset-right);
13411 padding-right: env(safe-area-inset-right);
13412 }
13413}
13414.md .theme-dark .calendar-popover .calendar-week-header {
13415 background-color: transparent;
13416}
13417.md .theme-dark .calendar-week-header {
13418 color: rgba(255, 255, 255, 0.54);
13419}
13420.md .theme-dark .calendar-day {
13421 color: rgba(255, 255, 255, 0.87);
13422}
13423.md .theme-dark .calendar-day.calendar-day-disabled {
13424 color: rgba(255, 255, 255, 0.54);
13425}
13426.md .theme-dark .calendar-day.calendar-day-prev,
13427.md .theme-dark .calendar-day.calendar-day-next {
13428 color: rgba(255, 255, 255, 0.35);
13429}
13430.md .theme-dark .calendar-modal,
13431.calendar-modal.md .theme-dark {
13432 background: #202020;
13433}
13434.md .theme-dark .calendar.calendar-sheet:before,
13435.calendar.md .theme-dark.calendar-sheet:before {
13436 background-color: rgba(255, 255, 255, 0.2);
13437}
13438.md .theme-dark .calendar .toolbar,
13439.calendar.md .theme-dark .toolbar {
13440 color: rgba(255, 255, 255, 0.54);
13441}
13442.md .theme-dark .calendar .toolbar a.link:before,
13443.calendar.md .theme-dark .toolbar a.link:before {
13444 content: '';
13445 width: 152%;
13446 height: 152%;
13447 position: absolute;
13448 left: -26%;
13449 top: -26%;
13450 background-image: -webkit-radial-gradient(center, circle, rgba(255, 255, 255, 0.15) 66%, rgba(255, 255, 255, 0) 66%);
13451 background-image: radial-gradient(circle at center, rgba(255, 255, 255, 0.15) 66%, rgba(255, 255, 255, 0) 66%);
13452 background-repeat: no-repeat;
13453 background-position: center;
13454 background-size: 100% 100%;
13455 opacity: 0;
13456 pointer-events: none;
13457 -webkit-transition-duration: 600ms;
13458 transition-duration: 600ms;
13459}
13460.md .theme-dark .calendar .toolbar a.link.active-state:before,
13461.calendar.md .theme-dark .toolbar a.link.active-state:before {
13462 opacity: 1;
13463 -webkit-transition-duration: 150ms;
13464 transition-duration: 150ms;
13465}
13466.md .theme-dark .calendar .toolbar a.link .ripple-wave,
13467.calendar.md .theme-dark .toolbar a.link .ripple-wave {
13468 background-color: rgba(255, 255, 255, 0.3);
13469}
13470.md .color-theme-red .calendar-header,
13471.md .color-red .calendar-header {
13472 background: #f44336;
13473}
13474.md .color-theme-red .calendar-day.calendar-day-today .calendar-day-number,
13475.md .color-red .calendar-day.calendar-day-today .calendar-day-number {
13476 color: #f44336;
13477}
13478.md .color-theme-red .calendar-day.calendar-day-selected .calendar-day-number,
13479.md .color-red .calendar-day.calendar-day-selected .calendar-day-number {
13480 background: #f44336;
13481 color: #fff;
13482}
13483.md .color-theme-red .calendar-day.calendar-day-selected .calendar-day-number:after,
13484.md .color-red .calendar-day.calendar-day-selected .calendar-day-number:after {
13485 background-color: #fff;
13486}
13487.md .color-theme-red .calendar-day .calendar-day-event,
13488.md .color-red .calendar-day .calendar-day-event {
13489 background: #f44336;
13490}
13491.md .color-theme-green .calendar-header,
13492.md .color-green .calendar-header {
13493 background: #4caf50;
13494}
13495.md .color-theme-green .calendar-day.calendar-day-today .calendar-day-number,
13496.md .color-green .calendar-day.calendar-day-today .calendar-day-number {
13497 color: #4caf50;
13498}
13499.md .color-theme-green .calendar-day.calendar-day-selected .calendar-day-number,
13500.md .color-green .calendar-day.calendar-day-selected .calendar-day-number {
13501 background: #4caf50;
13502 color: #fff;
13503}
13504.md .color-theme-green .calendar-day.calendar-day-selected .calendar-day-number:after,
13505.md .color-green .calendar-day.calendar-day-selected .calendar-day-number:after {
13506 background-color: #fff;
13507}
13508.md .color-theme-green .calendar-day .calendar-day-event,
13509.md .color-green .calendar-day .calendar-day-event {
13510 background: #4caf50;
13511}
13512.md .color-theme-blue .calendar-header,
13513.md .color-blue .calendar-header {
13514 background: #2196f3;
13515}
13516.md .color-theme-blue .calendar-day.calendar-day-today .calendar-day-number,
13517.md .color-blue .calendar-day.calendar-day-today .calendar-day-number {
13518 color: #2196f3;
13519}
13520.md .color-theme-blue .calendar-day.calendar-day-selected .calendar-day-number,
13521.md .color-blue .calendar-day.calendar-day-selected .calendar-day-number {
13522 background: #2196f3;
13523 color: #fff;
13524}
13525.md .color-theme-blue .calendar-day.calendar-day-selected .calendar-day-number:after,
13526.md .color-blue .calendar-day.calendar-day-selected .calendar-day-number:after {
13527 background-color: #fff;
13528}
13529.md .color-theme-blue .calendar-day .calendar-day-event,
13530.md .color-blue .calendar-day .calendar-day-event {
13531 background: #2196f3;
13532}
13533.md .color-theme-pink .calendar-header,
13534.md .color-pink .calendar-header {
13535 background: #e91e63;
13536}
13537.md .color-theme-pink .calendar-day.calendar-day-today .calendar-day-number,
13538.md .color-pink .calendar-day.calendar-day-today .calendar-day-number {
13539 color: #e91e63;
13540}
13541.md .color-theme-pink .calendar-day.calendar-day-selected .calendar-day-number,
13542.md .color-pink .calendar-day.calendar-day-selected .calendar-day-number {
13543 background: #e91e63;
13544 color: #fff;
13545}
13546.md .color-theme-pink .calendar-day.calendar-day-selected .calendar-day-number:after,
13547.md .color-pink .calendar-day.calendar-day-selected .calendar-day-number:after {
13548 background-color: #fff;
13549}
13550.md .color-theme-pink .calendar-day .calendar-day-event,
13551.md .color-pink .calendar-day .calendar-day-event {
13552 background: #e91e63;
13553}
13554.md .color-theme-yellow .calendar-header,
13555.md .color-yellow .calendar-header {
13556 background: #ffeb3b;
13557}
13558.md .color-theme-yellow .calendar-day.calendar-day-today .calendar-day-number,
13559.md .color-yellow .calendar-day.calendar-day-today .calendar-day-number {
13560 color: #ffeb3b;
13561}
13562.md .color-theme-yellow .calendar-day.calendar-day-selected .calendar-day-number,
13563.md .color-yellow .calendar-day.calendar-day-selected .calendar-day-number {
13564 background: #ffeb3b;
13565 color: #fff;
13566}
13567.md .color-theme-yellow .calendar-day.calendar-day-selected .calendar-day-number:after,
13568.md .color-yellow .calendar-day.calendar-day-selected .calendar-day-number:after {
13569 background-color: #fff;
13570}
13571.md .color-theme-yellow .calendar-day .calendar-day-event,
13572.md .color-yellow .calendar-day .calendar-day-event {
13573 background: #ffeb3b;
13574}
13575.md .color-theme-orange .calendar-header,
13576.md .color-orange .calendar-header {
13577 background: #ff9800;
13578}
13579.md .color-theme-orange .calendar-day.calendar-day-today .calendar-day-number,
13580.md .color-orange .calendar-day.calendar-day-today .calendar-day-number {
13581 color: #ff9800;
13582}
13583.md .color-theme-orange .calendar-day.calendar-day-selected .calendar-day-number,
13584.md .color-orange .calendar-day.calendar-day-selected .calendar-day-number {
13585 background: #ff9800;
13586 color: #fff;
13587}
13588.md .color-theme-orange .calendar-day.calendar-day-selected .calendar-day-number:after,
13589.md .color-orange .calendar-day.calendar-day-selected .calendar-day-number:after {
13590 background-color: #fff;
13591}
13592.md .color-theme-orange .calendar-day .calendar-day-event,
13593.md .color-orange .calendar-day .calendar-day-event {
13594 background: #ff9800;
13595}
13596.md .color-theme-gray .calendar-header,
13597.md .color-gray .calendar-header {
13598 background: #9e9e9e;
13599}
13600.md .color-theme-gray .calendar-day.calendar-day-today .calendar-day-number,
13601.md .color-gray .calendar-day.calendar-day-today .calendar-day-number {
13602 color: #9e9e9e;
13603}
13604.md .color-theme-gray .calendar-day.calendar-day-selected .calendar-day-number,
13605.md .color-gray .calendar-day.calendar-day-selected .calendar-day-number {
13606 background: #9e9e9e;
13607 color: #fff;
13608}
13609.md .color-theme-gray .calendar-day.calendar-day-selected .calendar-day-number:after,
13610.md .color-gray .calendar-day.calendar-day-selected .calendar-day-number:after {
13611 background-color: #fff;
13612}
13613.md .color-theme-gray .calendar-day .calendar-day-event,
13614.md .color-gray .calendar-day .calendar-day-event {
13615 background: #9e9e9e;
13616}
13617.md .color-theme-white .calendar-header,
13618.md .color-white .calendar-header {
13619 background: #ffffff;
13620}
13621.md .color-theme-white .calendar-day.calendar-day-today .calendar-day-number,
13622.md .color-white .calendar-day.calendar-day-today .calendar-day-number {
13623 color: #ffffff;
13624}
13625.md .color-theme-white .calendar-day.calendar-day-selected .calendar-day-number,
13626.md .color-white .calendar-day.calendar-day-selected .calendar-day-number {
13627 background: #ffffff;
13628 color: #fff;
13629}
13630.md .color-theme-white .calendar-day.calendar-day-selected .calendar-day-number:after,
13631.md .color-white .calendar-day.calendar-day-selected .calendar-day-number:after {
13632 background-color: #fff;
13633}
13634.md .color-theme-white .calendar-day .calendar-day-event,
13635.md .color-white .calendar-day .calendar-day-event {
13636 background: #ffffff;
13637}
13638.md .color-theme-black .calendar-header,
13639.md .color-black .calendar-header {
13640 background: #000000;
13641}
13642.md .color-theme-black .calendar-day.calendar-day-today .calendar-day-number,
13643.md .color-black .calendar-day.calendar-day-today .calendar-day-number {
13644 color: #000000;
13645}
13646.md .color-theme-black .calendar-day.calendar-day-selected .calendar-day-number,
13647.md .color-black .calendar-day.calendar-day-selected .calendar-day-number {
13648 background: #000000;
13649 color: #fff;
13650}
13651.md .color-theme-black .calendar-day.calendar-day-selected .calendar-day-number:after,
13652.md .color-black .calendar-day.calendar-day-selected .calendar-day-number:after {
13653 background-color: #fff;
13654}
13655.md .color-theme-black .calendar-day .calendar-day-event,
13656.md .color-black .calendar-day .calendar-day-event {
13657 background: #000000;
13658}
13659/* === Picker === */
13660.picker {
13661 width: 100%;
13662 height: 260px;
13663}
13664.picker.picker-inline,
13665.popover .picker {
13666 height: 200px;
13667}
13668@media (orientation: landscape) and (max-height: 415px) {
13669 .picker:not(.picker-inline) {
13670 height: 200px;
13671 }
13672}
13673.picker-popover {
13674 width: 280px;
13675}
13676.picker-columns {
13677 display: -webkit-box;
13678 display: -webkit-flex;
13679 display: -ms-flexbox;
13680 display: flex;
13681 overflow: hidden;
13682 -webkit-box-pack: center;
13683 -webkit-justify-content: center;
13684 -ms-flex-pack: center;
13685 justify-content: center;
13686 padding: 0;
13687 text-align: right;
13688 height: 100%;
13689 position: relative;
13690 -webkit-mask-box-image: linear-gradient(to top, transparent, transparent 5%, white 20%, white 80%, transparent 95%, transparent);
13691}
13692.picker-column {
13693 position: relative;
13694 max-height: 100%;
13695}
13696.picker-column.picker-column-first:before,
13697.picker-column.picker-column-last:after {
13698 height: 100%;
13699 width: 100vw;
13700 position: absolute;
13701 content: '';
13702 top: 0;
13703}
13704.picker-column.picker-column-first:before {
13705 left: 100%;
13706}
13707.picker-column.picker-column-last:after {
13708 right: 100%;
13709}
13710.picker-column.picker-column-left {
13711 text-align: left;
13712}
13713.picker-column.picker-column-center {
13714 text-align: center;
13715}
13716.picker-column.picker-column-right {
13717 text-align: right;
13718}
13719.picker-column.picker-column-divider {
13720 display: -webkit-box;
13721 display: -webkit-flex;
13722 display: -ms-flexbox;
13723 display: flex;
13724 -webkit-box-align: center;
13725 -webkit-align-items: center;
13726 -ms-flex-align: center;
13727 align-items: center;
13728}
13729.picker-items {
13730 -webkit-transition: 300ms;
13731 transition: 300ms;
13732 -webkit-transition-timing-function: ease-out;
13733 transition-timing-function: ease-out;
13734}
13735.picker-item {
13736 height: 36px;
13737 line-height: 36px;
13738 white-space: nowrap;
13739 position: relative;
13740 overflow: hidden;
13741 text-overflow: ellipsis;
13742 left: 0;
13743 top: 0;
13744 width: 100%;
13745 -webkit-box-sizing: border-box;
13746 box-sizing: border-box;
13747 -webkit-transition: 300ms;
13748 transition: 300ms;
13749}
13750.picker-item span {
13751 padding: 0 10px;
13752}
13753.picker-column-absolute .picker-item {
13754 position: absolute;
13755}
13756.picker-item.picker-item-far {
13757 pointer-events: none;
13758}
13759.picker-item.picker-item-selected {
13760 -webkit-transform: translate3d(0, 0, 0) rotateX(0deg);
13761 transform: translate3d(0, 0, 0) rotateX(0deg);
13762}
13763.picker-center-highlight {
13764 height: 36px;
13765 -webkit-box-sizing: border-box;
13766 box-sizing: border-box;
13767 position: absolute;
13768 left: 0;
13769 width: 100%;
13770 top: 50%;
13771 margin-top: -18px;
13772 pointer-events: none;
13773}
13774.picker-3d .picker-columns {
13775 overflow: hidden;
13776 -webkit-perspective: 1200px;
13777 perspective: 1200px;
13778}
13779.picker-3d .picker-column,
13780.picker-3d .picker-items,
13781.picker-3d .picker-item {
13782 -webkit-transform-style: preserve-3d;
13783 transform-style: preserve-3d;
13784}
13785.picker-3d .picker-column {
13786 overflow: visible;
13787}
13788.picker-3d .picker-item {
13789 -webkit-transform-origin: center center -110px;
13790 transform-origin: center center -110px;
13791 -webkit-backface-visibility: hidden;
13792 backface-visibility: hidden;
13793 -webkit-transition-timing-function: ease-out;
13794 transition-timing-function: ease-out;
13795}
13796.md .picker-popover .toolbar {
13797 border-radius: 2px 2px 0 0;
13798}
13799.md .picker-columns {
13800 font-size: 20px;
13801}
13802.md .picker-column-divider {
13803 color: rgba(0, 0, 0, 0.87);
13804}
13805.md .picker-popover .picker > .toolbar + .picker-columns {
13806 height: calc(100% - 48px);
13807}
13808.md .picker-center-highlight:before {
13809 content: '';
13810 position: absolute;
13811 background-color: rgba(0, 0, 0, 0.15);
13812 display: block;
13813 z-index: 15;
13814 top: 0;
13815 right: auto;
13816 bottom: auto;
13817 left: 0;
13818 height: 1px;
13819 width: 100%;
13820 -webkit-transform-origin: 50% 0%;
13821 transform-origin: 50% 0%;
13822}
13823.md.device-pixel-ratio-2 .picker-center-highlight:before {
13824 -webkit-transform: scaleY(0.5);
13825 transform: scaleY(0.5);
13826}
13827.md.device-pixel-ratio-3 .picker-center-highlight:before {
13828 -webkit-transform: scaleY(0.33);
13829 transform: scaleY(0.33);
13830}
13831.md .picker-center-highlight:after {
13832 content: '';
13833 position: absolute;
13834 background-color: rgba(0, 0, 0, 0.15);
13835 display: block;
13836 z-index: 15;
13837 top: auto;
13838 right: auto;
13839 bottom: 0;
13840 left: 0;
13841 height: 1px;
13842 width: 100%;
13843 -webkit-transform-origin: 50% 100%;
13844 transform-origin: 50% 100%;
13845}
13846.md.device-pixel-ratio-2 .picker-center-highlight:after {
13847 -webkit-transform: scaleY(0.5);
13848 transform: scaleY(0.5);
13849}
13850.md.device-pixel-ratio-3 .picker-center-highlight:after {
13851 -webkit-transform: scaleY(0.33);
13852 transform: scaleY(0.33);
13853}
13854.md .theme-dark .picker-column-divider {
13855 color: rgba(255, 255, 255, 0.87);
13856}
13857.md .theme-dark .picker-center-highlight:before {
13858 background-color: rgba(255, 255, 255, 0.15);
13859}
13860.md .theme-dark .picker-center-highlight:after {
13861 background-color: rgba(255, 255, 255, 0.15);
13862}
13863/* === Infinite === */
13864.infinite-scroll-preloader {
13865 margin-left: auto;
13866 margin-right: auto;
13867 text-align: center;
13868}
13869.infinite-scroll-preloader.preloader {
13870 display: block;
13871}
13872.md .infinite-scroll-preloader {
13873 margin-top: 32px;
13874 margin-bottom: 32px;
13875}
13876/* === PTR === */
13877.ptr-preloader .preloader {
13878 position: absolute;
13879 left: 50%;
13880}
13881.md .ptr-preloader {
13882 position: absolute;
13883 left: 50%;
13884 top: 16px;
13885 width: 40px;
13886 height: 40px;
13887 border-radius: 50%;
13888 background: #fff;
13889 margin-left: -20px;
13890 margin-top: -7px;
13891 z-index: 100;
13892 -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
13893 box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
13894}
13895@media (min-width: 768px) {
13896 .md .ptr-preloader {
13897 top: 24px;
13898 }
13899}
13900.md .ptr-preloader .preloader {
13901 width: 22px;
13902 height: 22px;
13903 margin-left: -11px;
13904 margin-top: -11px;
13905 top: 50%;
13906 visibility: hidden;
13907}
13908.md .ptr-preloader .preloader .preloader-inner-gap,
13909.md .ptr-preloader .preloader .preloader-inner-half-circle {
13910 border-width: 3px;
13911}
13912.md .ptr-arrow {
13913 width: 22px;
13914 height: 22px;
13915 -webkit-box-sizing: border-box;
13916 box-sizing: border-box;
13917 border: 3px solid #757575;
13918 position: absolute;
13919 left: 50%;
13920 top: 50%;
13921 margin-left: -11px;
13922 margin-top: -11px;
13923 border-left-color: transparent;
13924 border-radius: 50%;
13925 opacity: 1;
13926 -webkit-transform: rotate(150deg);
13927 transform: rotate(150deg);
13928}
13929.md .ptr-arrow:after {
13930 content: '';
13931 width: 0px;
13932 height: 0px;
13933 position: absolute;
13934 left: -5px;
13935 bottom: 0px;
13936 border-bottom-width: 6px;
13937 border-bottom-style: solid;
13938 border-bottom-color: inherit;
13939 border-left: 5px solid transparent;
13940 border-right: 5px solid transparent;
13941 -webkit-transform: rotate(-40deg);
13942 transform: rotate(-40deg);
13943}
13944.md .ptr-content:not(.ptr-refreshing):not(.ptr-pull-up) .ptr-preloader .preloader,
13945.md .ptr-content:not(.ptr-refreshing):not(.ptr-pull-up) .ptr-preloader .preloader * {
13946 -webkit-animation: none;
13947 animation: none;
13948}
13949.md .ptr-refreshing .ptr-preloader .preloader,
13950.md .ptr-pull-up .ptr-preloader .preloader {
13951 visibility: visible;
13952}
13953.md .ptr-refreshing .ptr-arrow,
13954.md .ptr-pull-up .ptr-arrow {
13955 visibility: hidden;
13956}
13957.md .ptr-refreshing .ptr-preloader {
13958 -webkit-transform: translate3d(0, 66px, 0);
13959 transform: translate3d(0, 66px, 0);
13960}
13961.md .ptr-transitioning .ptr-arrow {
13962 -webkit-transition: 300ms;
13963 transition: 300ms;
13964}
13965.md .ptr-pull-up .ptr-arrow {
13966 -webkit-transition: 400ms;
13967 transition: 400ms;
13968 -webkit-transform: rotate(620deg) !important;
13969 transform: rotate(620deg) !important;
13970 opacity: 0;
13971}
13972.md .ptr-transitioning .ptr-preloader,
13973.md .ptr-refreshing .ptr-preloader {
13974 -webkit-transition-duration: 300ms;
13975 transition-duration: 300ms;
13976 -webkit-transition-property: -webkit-transform;
13977 transition-property: -webkit-transform;
13978 transition-property: transform;
13979 transition-property: transform, -webkit-transform;
13980}
13981.md .ptr-no-navbar .ptr-preloader {
13982 top: auto;
13983 bottom: 100%;
13984 margin-bottom: 7px;
13985}
13986.md .page-with-subnavbar .ptr-preloader,
13987.md .toolbar:not(.toolbar-bottom-md) ~ .ptr-content .ptr-preloader,
13988.md .searchbar ~ .ptr-content .ptr-preloader {
13989 top: 64px;
13990}
13991@media (min-width: 768px) {
13992 .md .page-with-subnavbar .ptr-preloader,
13993 .md .toolbar:not(.toolbar-bottom-md) ~ .ptr-content .ptr-preloader,
13994 .md .searchbar ~ .ptr-content .ptr-preloader {
13995 top: 72px;
13996 }
13997}
13998/* === Images Lazy Loading === */
13999.lazy-loaded.lazy-fade-in {
14000 -webkit-animation: lazyFadeIn 600ms;
14001 animation: lazyFadeIn 600ms;
14002}
14003@-webkit-keyframes lazyFadeIn {
14004 from {
14005 opacity: 0;
14006 }
14007 to {
14008 opacity: 1;
14009 }
14010}
14011@keyframes lazyFadeIn {
14012 from {
14013 opacity: 0;
14014 }
14015 to {
14016 opacity: 1;
14017 }
14018}
14019/* === Data Table === */
14020.data-table {
14021 overflow-x: auto;
14022}
14023.data-table table {
14024 width: 100%;
14025 border: none;
14026 padding: 0;
14027 margin: 0;
14028 border-collapse: collapse;
14029 text-align: right;
14030}
14031.data-table thead {
14032 font-size: 12px;
14033}
14034.data-table thead th,
14035.data-table thead td {
14036 overflow: hidden;
14037 white-space: nowrap;
14038 text-overflow: ellipsis;
14039 line-height: 16px;
14040}
14041.data-table thead i.icon,
14042.data-table thead i.f7-icons,
14043.data-table thead i.material-icons {
14044 vertical-align: top;
14045}
14046.data-table th,
14047.data-table td {
14048 padding: 0;
14049 position: relative;
14050}
14051.data-table th.numeric-cell,
14052.data-table td.numeric-cell {
14053 text-align: left;
14054}
14055.data-table th.checkbox-cell,
14056.data-table td.checkbox-cell {
14057 overflow: visible;
14058}
14059.data-table th.checkbox-cell label + span,
14060.data-table td.checkbox-cell label + span {
14061 margin-right: 8px;
14062}
14063.data-table th.actions-cell,
14064.data-table td.actions-cell {
14065 text-align: left;
14066 white-space: nowrap;
14067}
14068.data-table th a.icon-only,
14069.data-table td a.icon-only,
14070.card .data-table th a.icon-only,
14071.card .data-table td a.icon-only,
14072.card.data-table th a.icon-only,
14073.card.data-table td a.icon-only {
14074 display: inline-block;
14075 vertical-align: middle;
14076 text-align: center;
14077 font-size: 0;
14078 min-width: 0;
14079}
14080.data-table th a.icon-only i,
14081.data-table td a.icon-only i,
14082.card .data-table th a.icon-only i,
14083.card .data-table td a.icon-only i,
14084.card.data-table th a.icon-only i,
14085.card.data-table td a.icon-only i {
14086 font-size: 18px;
14087 vertical-align: middle;
14088}
14089.data-table .sortable-cell:not(.input-cell) {
14090 cursor: pointer;
14091 position: relative;
14092}
14093.data-table .sortable-cell.input-cell .table-head-label {
14094 cursor: pointer;
14095 position: relative;
14096}
14097.data-table .sortable-cell:not(.numeric-cell):not(.input-cell):after,
14098.data-table .sortable-cell.numeric-cell:not(.input-cell):before,
14099.data-table .sortable-cell:not(.numeric-cell).input-cell > .table-head-label:after,
14100.data-table .sortable-cell.numeric-cell.input-cell > .table-head-label:before {
14101 content: '';
14102 display: inline-block;
14103 vertical-align: top;
14104 width: 16px;
14105 height: 16px;
14106 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");
14107 background-size: 100% auto;
14108 background-position: center;
14109 background-repeat: no-repeat;
14110 font-size: 0;
14111 -webkit-transition-duration: 300ms;
14112 transition-duration: 300ms;
14113 -webkit-transform: rotate(0);
14114 transform: rotate(0);
14115 opacity: 0;
14116}
14117html.device-desktop .data-table .sortable-cell:not(.sortable-cell-active):hover:after,
14118html.device-desktop .data-table .sortable-cell:not(.sortable-cell-active) .table-head-label:hover:after,
14119html.device-desktop .data-table .sortable-cell:not(.sortable-cell-active):hover:before,
14120html.device-desktop .data-table .sortable-cell:not(.sortable-cell-active) .table-head-label:hover:before {
14121 opacity: 0.54;
14122}
14123.data-table .sortable-cell.sortable-cell-active:after,
14124.data-table .sortable-cell.sortable-cell-active .table-head-label:after,
14125.data-table .sortable-cell.sortable-cell-active:before,
14126.data-table .sortable-cell.sortable-cell-active .table-head-label:before {
14127 opacity: 0.87 !important;
14128}
14129.data-table .sortable-cell.sortable-desc:after,
14130.data-table .sortable-cell.sortable-desc:after,
14131.data-table .table-head-label:after,
14132.data-table .sortable-cell.sortable-desc:before,
14133.data-table .sortable-cell.sortable-desc:before,
14134.data-table .table-head-label:before {
14135 -webkit-transform: rotate(180deg) !important;
14136 transform: rotate(180deg) !important;
14137}
14138.data-table.card .card-header,
14139.card .data-table .card-header {
14140 height: 64px;
14141}
14142.data-table.card .card-content,
14143.card .data-table .card-content {
14144 overflow-x: auto;
14145}
14146.data-table .data-table-links,
14147.data-table .data-table-actions {
14148 display: -webkit-box;
14149 display: -webkit-flex;
14150 display: -ms-flexbox;
14151 display: flex;
14152}
14153.data-table .data-table-actions {
14154 margin-right: auto;
14155 -webkit-box-align: center;
14156 -webkit-align-items: center;
14157 -ms-flex-align: center;
14158 align-items: center;
14159}
14160.data-table .data-table-actions a.link {
14161 min-width: 0;
14162}
14163.data-table .data-table-actions a.link.icon-only {
14164 line-height: 1;
14165 -webkit-box-pack: center;
14166 -webkit-justify-content: center;
14167 -ms-flex-pack: center;
14168 justify-content: center;
14169 padding: 0;
14170}
14171.data-table .data-table-header,
14172.data-table .data-table-header-selected {
14173 display: -webkit-box;
14174 display: -webkit-flex;
14175 display: -ms-flexbox;
14176 display: flex;
14177 -webkit-box-pack: justify;
14178 -webkit-justify-content: space-between;
14179 -ms-flex-pack: justify;
14180 justify-content: space-between;
14181 -webkit-box-align: center;
14182 -webkit-align-items: center;
14183 -ms-flex-align: center;
14184 align-items: center;
14185 width: 100%;
14186}
14187.data-table .data-table-header-selected {
14188 display: none;
14189}
14190.data-table.data-table-has-checked .data-table-header {
14191 display: none;
14192}
14193.data-table.data-table-has-checked .data-table-header-selected {
14194 display: -webkit-box;
14195 display: -webkit-flex;
14196 display: -ms-flexbox;
14197 display: flex;
14198}
14199.data-table .data-table-title-selected {
14200 font-size: 14px;
14201}
14202.data-table .data-table-footer {
14203 display: -webkit-box;
14204 display: -webkit-flex;
14205 display: -ms-flexbox;
14206 display: flex;
14207 -webkit-box-align: center;
14208 -webkit-align-items: center;
14209 -ms-flex-align: center;
14210 align-items: center;
14211 -webkit-box-sizing: border-box;
14212 box-sizing: border-box;
14213 position: relative;
14214 font-size: 12px;
14215 overflow: hidden;
14216 -webkit-box-pack: start;
14217 -webkit-justify-content: flex-start;
14218 -ms-flex-pack: start;
14219 justify-content: flex-start;
14220}
14221.data-table .data-table-rows-select,
14222.data-table .data-table-pagination {
14223 display: -webkit-box;
14224 display: -webkit-flex;
14225 display: -ms-flexbox;
14226 display: flex;
14227 -webkit-box-align: center;
14228 -webkit-align-items: center;
14229 -ms-flex-align: center;
14230 align-items: center;
14231}
14232@media (max-width: 480px) and (orientation: portrait) {
14233 .data-table.data-table-collapsible thead {
14234 display: none;
14235 }
14236 .data-table.data-table-collapsible tbody,
14237 .data-table.data-table-collapsible tr,
14238 .data-table.data-table-collapsible td {
14239 display: block;
14240 }
14241 .data-table.data-table-collapsible tr {
14242 position: relative;
14243 }
14244 .data-table.data-table-collapsible tr:hover {
14245 background-color: inherit;
14246 }
14247 .data-table.data-table-collapsible td {
14248 display: -webkit-box;
14249 display: -webkit-flex;
14250 display: -ms-flexbox;
14251 display: flex;
14252 -webkit-align-content: center;
14253 -ms-flex-line-pack: center;
14254 align-content: center;
14255 -webkit-box-align: center;
14256 -webkit-align-items: center;
14257 -ms-flex-align: center;
14258 align-items: center;
14259 -webkit-box-pack: start;
14260 -webkit-justify-content: flex-start;
14261 -ms-flex-pack: start;
14262 justify-content: flex-start;
14263 text-align: right;
14264 }
14265 .data-table.data-table-collapsible td:before {
14266 display: none !important;
14267 }
14268 .data-table.data-table-collapsible td:not(.checkbox-cell):before {
14269 width: 40%;
14270 display: block !important;
14271 content: attr(data-collapsible-title);
14272 position: relative;
14273 height: auto;
14274 background: none !important;
14275 -webkit-transform: none !important;
14276 transform: none !important;
14277 font-size: 12px;
14278 margin-left: 16px;
14279 -webkit-flex-shrink: 0;
14280 -ms-flex-negative: 0;
14281 flex-shrink: 0;
14282 }
14283 .data-table.data-table-collapsible td.checkbox-cell {
14284 position: absolute;
14285 top: 0;
14286 right: 0;
14287 }
14288 .data-table.data-table-collapsible td.checkbox-cell + td {
14289 padding-right: 16px;
14290 }
14291 .data-table.data-table-collapsible td.checkbox-cell ~ td {
14292 margin-right: 32px;
14293 }
14294}
14295.data-table .tablet-only,
14296.data-table .tablet-landscape-only {
14297 display: none;
14298}
14299@media (min-width: 768px) {
14300 .data-table .tablet-only {
14301 display: table-cell;
14302 }
14303}
14304@media (min-width: 768px) and (orientation: landscape) {
14305 .data-table .tablet-landscape-only {
14306 display: table-cell;
14307 }
14308}
14309.theme-dark .data-table .sortable-cell:not(.numeric-cell):not(.input-cell):after,
14310.theme-dark .data-table .sortable-cell.numeric-cell:not(.input-cell):before,
14311.theme-dark .data-table .sortable-cell:not(.numeric-cell).input-cell > .table-head-label:after,
14312.theme-dark .data-table .sortable-cell.numeric-cell.input-cell > .table-head-label:before {
14313 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");
14314}
14315.md .data-table thead th,
14316.md .data-table thead td {
14317 font-weight: 500;
14318 height: 56px;
14319 -webkit-box-sizing: border-box;
14320 box-sizing: border-box;
14321}
14322.md .data-table thead th:not(.sortable-cell-active),
14323.md .data-table thead td:not(.sortable-cell-active) {
14324 color: rgba(0, 0, 0, 0.54);
14325}
14326.md .data-table thead i.icon,
14327.md .data-table thead i.material-icons {
14328 font-size: 16px;
14329 width: 16px;
14330 height: 16px;
14331}
14332.md .data-table tbody {
14333 font-size: 13px;
14334}
14335.md .data-table tbody tr.data-table-row-selected {
14336 background: #f5f5f5;
14337}
14338.md .data-table tbody td {
14339 height: 48px;
14340}
14341.md .data-table th,
14342.md .data-table td {
14343 padding-left: 28px;
14344 padding-right: 28px;
14345}
14346.md .data-table th.label-cell,
14347.md .data-table td.label-cell {
14348 padding-left: 24px;
14349 padding-right: 24px;
14350}
14351.md .data-table th:first-child,
14352.md .data-table td:first-child {
14353 padding-right: 24px;
14354}
14355.md .data-table th:last-child,
14356.md .data-table td:last-child {
14357 padding-left: 24px;
14358}
14359.md .data-table th.checkbox-cell,
14360.md .data-table td.checkbox-cell {
14361 width: 18px;
14362 padding-right: 24px;
14363 padding-left: 12px;
14364}
14365.md .data-table th.checkbox-cell + td,
14366.md .data-table td.checkbox-cell + td,
14367.md .data-table th.checkbox-cell + th,
14368.md .data-table td.checkbox-cell + th {
14369 padding-right: 12px;
14370}
14371.md .data-table th.actions-cell a.link,
14372.md .data-table td.actions-cell a.link {
14373 color: rgba(0, 0, 0, 0.54);
14374}
14375.md .data-table th.actions-cell a.link + a.link,
14376.md .data-table td.actions-cell a.link + a.link {
14377 margin-right: 24px;
14378}
14379.md .data-table th.actions-cell a.icon-only,
14380.md .data-table td.actions-cell a.icon-only {
14381 width: 24px;
14382 height: 24px;
14383 line-height: 24px;
14384}
14385.md .sortable-cell:not(.numeric-cell):after {
14386 margin-right: 8px;
14387}
14388.md .sortable-cell.numeric-cell:before {
14389 margin-left: 8px;
14390}
14391.md .data-table.card .card-header,
14392.md .card .data-table .card-header,
14393.md .data-table.card .card-footer,
14394.md .card .data-table .card-footer {
14395 padding-right: 24px;
14396 padding-left: 14px;
14397}
14398.md .data-table.card .card-footer,
14399.md .card .data-table .card-footer {
14400 height: 56px;
14401}
14402.md .data-table-title {
14403 font-size: 20px;
14404}
14405.md .data-table-links a.link + a.link,
14406.md .data-table-actions a.link + a.link {
14407 margin-right: 24px;
14408}
14409.md .data-table-actions a.link {
14410 color: rgba(0, 0, 0, 0.54);
14411}
14412.md .data-table-actions a.link.icon-only {
14413 width: 24px;
14414 height: 24px;
14415 overflow: visible;
14416}
14417.md .data-table-actions a.link.icon-only.active-state {
14418 background: none;
14419}
14420.md .data-table .card-header > .data-table-header,
14421.md .data-table .card-header > .data-table-header-selected {
14422 padding-right: 24px;
14423 padding-left: 14px;
14424 margin-right: -24px;
14425 margin-left: -14px;
14426 padding-top: 4px;
14427 padding-bottom: 4px;
14428 height: 100%;
14429}
14430.md .data-table-header-selected {
14431 background: rgba(33, 150, 243, 0.1);
14432}
14433.md .data-table-title-selected {
14434 color: #2196f3;
14435}
14436.md .data-table tbody td:before {
14437 content: '';
14438 position: absolute;
14439 background-color: rgba(0, 0, 0, 0.12);
14440 display: block;
14441 z-index: 15;
14442 top: 0;
14443 right: auto;
14444 bottom: auto;
14445 left: 0;
14446 height: 1px;
14447 width: 100%;
14448 -webkit-transform-origin: 50% 0%;
14449 transform-origin: 50% 0%;
14450}
14451.md.device-pixel-ratio-2 .data-table tbody td:before {
14452 -webkit-transform: scaleY(0.5);
14453 transform: scaleY(0.5);
14454}
14455.md.device-pixel-ratio-3 .data-table tbody td:before {
14456 -webkit-transform: scaleY(0.33);
14457 transform: scaleY(0.33);
14458}
14459.md.device-desktop .data-table tbody tr:hover {
14460 background: #f5f5f5;
14461}
14462.md .data-table-footer {
14463 height: 56px;
14464 color: rgba(0, 0, 0, 0.54);
14465}
14466.md .data-table-rows-select a.link,
14467.md .data-table-pagination a.link {
14468 width: 48px;
14469 height: 48px;
14470}
14471.md .data-table-rows-select a.link:before,
14472.md .data-table-pagination a.link:before {
14473 content: '';
14474 width: 152%;
14475 height: 152%;
14476 position: absolute;
14477 left: -26%;
14478 top: -26%;
14479 background-image: -webkit-radial-gradient(center, circle, rgba(0, 0, 0, 0.1) 66%, rgba(0, 0, 0, 0) 66%);
14480 background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0.1) 66%, rgba(0, 0, 0, 0) 66%);
14481 background-repeat: no-repeat;
14482 background-position: center;
14483 background-size: 100% 100%;
14484 opacity: 0;
14485 pointer-events: none;
14486 -webkit-transition-duration: 600ms;
14487 transition-duration: 600ms;
14488}
14489.md .data-table-rows-select a.link.active-state:before,
14490.md .data-table-pagination a.link.active-state:before {
14491 opacity: 1;
14492 -webkit-transition-duration: 150ms;
14493 transition-duration: 150ms;
14494}
14495.md .data-table-rows-select + .data-table-pagination {
14496 margin-right: 32px;
14497}
14498.md .data-table-rows-select .input {
14499 margin-right: 24px;
14500}
14501.md .data-table-pagination-label {
14502 margin-left: 20px;
14503}
14504.md .data-table-footer:before {
14505 content: '';
14506 position: absolute;
14507 background-color: rgba(0, 0, 0, 0.12);
14508 display: block;
14509 z-index: 15;
14510 top: 0;
14511 right: auto;
14512 bottom: auto;
14513 left: 0;
14514 height: 1px;
14515 width: 100%;
14516 -webkit-transform-origin: 50% 0%;
14517 transform-origin: 50% 0%;
14518}
14519.md.device-pixel-ratio-2 .data-table-footer:before {
14520 -webkit-transform: scaleY(0.5);
14521 transform: scaleY(0.5);
14522}
14523.md.device-pixel-ratio-3 .data-table-footer:before {
14524 -webkit-transform: scaleY(0.33);
14525 transform: scaleY(0.33);
14526}
14527.md .input-cell {
14528 padding-top: 8px;
14529 padding-bottom: 8px;
14530 height: auto;
14531 vertical-align: top;
14532}
14533.md .input-cell .table-head-label + .input {
14534 margin-top: 4px;
14535}
14536.md .input-cell .input {
14537 height: 24px;
14538}
14539.md .input-cell .input input,
14540.md .input-cell .input textarea,
14541.md .input-cell .input select {
14542 height: 24px;
14543 color: #212121;
14544 font-size: 14px;
14545}
14546.md .input-cell .input .input-clear-button {
14547 -webkit-transform: scale(0.8);
14548 transform: scale(0.8);
14549}
14550@media (max-width: 480px) and (orientation: portrait) {
14551 .md .data-table.data-table-collapsible td {
14552 padding-left: 16px;
14553 padding-right: 16px;
14554 }
14555 .md .data-table.data-table-collapsible td:not(.checkbox-cell):before {
14556 color: rgba(0, 0, 0, 0.54);
14557 font-weight: 500;
14558 line-height: 16px;
14559 }
14560 .md .data-table-collapsible tr:before {
14561 content: '';
14562 position: absolute;
14563 background-color: rgba(0, 0, 0, 0.12);
14564 display: block;
14565 z-index: 15;
14566 top: 0;
14567 right: auto;
14568 bottom: auto;
14569 left: 0;
14570 height: 1px;
14571 width: 100%;
14572 -webkit-transform-origin: 50% 0%;
14573 transform-origin: 50% 0%;
14574 }
14575 .md.device-pixel-ratio-2 .data-table-collapsible tr:before {
14576 -webkit-transform: scaleY(0.5);
14577 transform: scaleY(0.5);
14578 }
14579 .md.device-pixel-ratio-3 .data-table-collapsible tr:before {
14580 -webkit-transform: scaleY(0.33);
14581 transform: scaleY(0.33);
14582 }
14583}
14584.md .theme-dark .data-table thead th:not(.sortable-cell-active),
14585.data-table.md .theme-dark thead th:not(.sortable-cell-active),
14586.md .theme-dark .data-table thead td:not(.sortable-cell-active),
14587.data-table.md .theme-dark thead td:not(.sortable-cell-active),
14588.md .theme-dark .data-table .data-table-actions a.link,
14589.data-table.md .theme-dark .data-table-actions a.link,
14590.md .theme-dark .data-table td.actions-cell a.link,
14591.data-table.md .theme-dark td.actions-cell a.link,
14592.md .theme-dark .data-table th.actions-cell a.link,
14593.data-table.md .theme-dark th.actions-cell a.link {
14594 color: rgba(255, 255, 255, 0.54);
14595}
14596.md .theme-dark .data-table .data-table-links a.link:before,
14597.data-table.md .theme-dark .data-table-links a.link:before {
14598 content: '';
14599 width: 152%;
14600 height: 152%;
14601 position: absolute;
14602 left: -26%;
14603 top: -26%;
14604 background-image: -webkit-radial-gradient(center, circle, rgba(255, 255, 255, 0.15) 66%, rgba(255, 255, 255, 0) 66%);
14605 background-image: radial-gradient(circle at center, rgba(255, 255, 255, 0.15) 66%, rgba(255, 255, 255, 0) 66%);
14606 background-repeat: no-repeat;
14607 background-position: center;
14608 background-size: 100% 100%;
14609 opacity: 0;
14610 pointer-events: none;
14611 -webkit-transition-duration: 600ms;
14612 transition-duration: 600ms;
14613}
14614.md .theme-dark .data-table .data-table-links a.link.active-state:before,
14615.data-table.md .theme-dark .data-table-links a.link.active-state:before {
14616 opacity: 1;
14617 -webkit-transition-duration: 150ms;
14618 transition-duration: 150ms;
14619}
14620.md .theme-dark .data-table tbody td:before,
14621.data-table.md .theme-dark tbody td:before {
14622 background-color: rgba(255, 255, 255, 0.08);
14623}
14624.md .theme-dark .data-table.data-table-collapsible tr:before,
14625.data-table.md .theme-dark.data-table-collapsible tr:before {
14626 background-color: rgba(255, 255, 255, 0.08);
14627}
14628.md .theme-dark .data-table tbody tr.data-table-row-selected,
14629.data-table.md .theme-dark tbody tr.data-table-row-selected {
14630 background-color: rgba(255, 255, 255, 0.05);
14631}
14632.md.device-desktop .theme-dark .data-table tbody tr:hover,
14633.md.device-desktop .theme-dark.data-table tbody tr:hover {
14634 background-color: rgba(255, 255, 255, 0.05);
14635}
14636.md .color-theme-red .data-table-header-selected,
14637.md .data-table-header-selected.color-red {
14638 background: rgba(244, 67, 54, 0.1);
14639}
14640.md .color-theme-red .data-table-title-selected,
14641.md .color-red .data-table-title-selected {
14642 color: #f44336;
14643}
14644.md .color-theme-green .data-table-header-selected,
14645.md .data-table-header-selected.color-green {
14646 background: rgba(76, 175, 80, 0.1);
14647}
14648.md .color-theme-green .data-table-title-selected,
14649.md .color-green .data-table-title-selected {
14650 color: #4caf50;
14651}
14652.md .color-theme-blue .data-table-header-selected,
14653.md .data-table-header-selected.color-blue {
14654 background: rgba(33, 150, 243, 0.1);
14655}
14656.md .color-theme-blue .data-table-title-selected,
14657.md .color-blue .data-table-title-selected {
14658 color: #2196f3;
14659}
14660.md .color-theme-pink .data-table-header-selected,
14661.md .data-table-header-selected.color-pink {
14662 background: rgba(233, 30, 99, 0.1);
14663}
14664.md .color-theme-pink .data-table-title-selected,
14665.md .color-pink .data-table-title-selected {
14666 color: #e91e63;
14667}
14668.md .color-theme-yellow .data-table-header-selected,
14669.md .data-table-header-selected.color-yellow {
14670 background: rgba(255, 235, 59, 0.1);
14671}
14672.md .color-theme-yellow .data-table-title-selected,
14673.md .color-yellow .data-table-title-selected {
14674 color: #ffeb3b;
14675}
14676.md .color-theme-orange .data-table-header-selected,
14677.md .data-table-header-selected.color-orange {
14678 background: rgba(255, 152, 0, 0.1);
14679}
14680.md .color-theme-orange .data-table-title-selected,
14681.md .color-orange .data-table-title-selected {
14682 color: #ff9800;
14683}
14684.md .color-theme-gray .data-table-header-selected,
14685.md .data-table-header-selected.color-gray {
14686 background: rgba(158, 158, 158, 0.1);
14687}
14688.md .color-theme-gray .data-table-title-selected,
14689.md .color-gray .data-table-title-selected {
14690 color: #9e9e9e;
14691}
14692.md .color-theme-white .data-table-header-selected,
14693.md .data-table-header-selected.color-white {
14694 background: rgba(255, 255, 255, 0.1);
14695}
14696.md .color-theme-white .data-table-title-selected,
14697.md .color-white .data-table-title-selected {
14698 color: #ffffff;
14699}
14700.md .color-theme-black .data-table-header-selected,
14701.md .data-table-header-selected.color-black {
14702 background: rgba(0, 0, 0, 0.1);
14703}
14704.md .color-theme-black .data-table-title-selected,
14705.md .color-black .data-table-title-selected {
14706 color: #000000;
14707}
14708/* === FAB === */
14709.fab {
14710 position: absolute;
14711 z-index: 1500;
14712}
14713.fab > a,
14714.fab-buttons a {
14715 position: relative;
14716 -webkit-transition-duration: 300ms;
14717 transition-duration: 300ms;
14718 display: -webkit-box;
14719 display: -webkit-flex;
14720 display: -ms-flexbox;
14721 display: flex;
14722 -webkit-box-align: center;
14723 -webkit-align-items: center;
14724 -ms-flex-align: center;
14725 align-items: center;
14726 -webkit-box-pack: center;
14727 -webkit-justify-content: center;
14728 -ms-flex-pack: center;
14729 justify-content: center;
14730 overflow: hidden;
14731 z-index: 1;
14732}
14733.fab > a i {
14734 position: absolute;
14735 left: 50%;
14736 top: 50%;
14737 -webkit-transform: translate3d(-50%, -50%, 0) rotate(0deg) scale(1);
14738 transform: translate3d(-50%, -50%, 0) rotate(0deg) scale(1);
14739 -webkit-transition: 300ms;
14740 transition: 300ms;
14741}
14742.fab > a i + i {
14743 -webkit-transform: translate3d(-50%, -50%, 0) rotate(-90deg) scale(0.5);
14744 transform: translate3d(-50%, -50%, 0) rotate(-90deg) scale(0.5);
14745 opacity: 0;
14746}
14747.fab[class*="fab-center"] {
14748 left: 50%;
14749 -webkit-transform: translateX(-50%);
14750 transform: translateX(-50%);
14751}
14752.fab[class*="left-center"],
14753.fab[class*="right-center"] {
14754 top: 50%;
14755 -webkit-transform: translateY(-50%);
14756 transform: translateY(-50%);
14757}
14758.fab[class*="center-center"] {
14759 top: 50%;
14760 left: 50%;
14761 -webkit-transform: translateX(-50%) translateY(-50%);
14762 transform: translateX(-50%) translateY(-50%);
14763}
14764.fab div.fab-buttons a {
14765 width: 40px;
14766 height: 40px;
14767}
14768.fab-buttons {
14769 display: -webkit-box;
14770 display: -webkit-flex;
14771 display: -ms-flexbox;
14772 display: flex;
14773 visibility: hidden;
14774 pointer-events: none;
14775 position: absolute;
14776}
14777.fab-buttons a {
14778 opacity: 0;
14779}
14780.fab-opened:not(.fab-morph) > a i {
14781 -webkit-transform: translate3d(-50%, -50%, 0) rotate(90deg) scale(0.5);
14782 transform: translate3d(-50%, -50%, 0) rotate(90deg) scale(0.5);
14783 opacity: 0;
14784}
14785.fab-opened:not(.fab-morph) > a i + i {
14786 -webkit-transform: translate3d(-50%, -50%, 0) rotate(0deg) scale(1);
14787 transform: translate3d(-50%, -50%, 0) rotate(0deg) scale(1);
14788 opacity: 1;
14789}
14790.fab-opened .fab-buttons {
14791 visibility: visible;
14792 pointer-events: auto;
14793}
14794.fab-opened .fab-buttons a {
14795 opacity: 1;
14796 -webkit-transform: translate3d(0, 0px, 0) scale(1) !important;
14797 transform: translate3d(0, 0px, 0) scale(1) !important;
14798}
14799.fab-opened .fab-buttons a:nth-child(2) {
14800 -webkit-transition-delay: 50ms;
14801 transition-delay: 50ms;
14802}
14803.fab-opened .fab-buttons a:nth-child(3) {
14804 -webkit-transition-delay: 100ms;
14805 transition-delay: 100ms;
14806}
14807.fab-opened .fab-buttons a:nth-child(4) {
14808 -webkit-transition-delay: 150ms;
14809 transition-delay: 150ms;
14810}
14811.fab-opened .fab-buttons a:nth-child(5) {
14812 -webkit-transition-delay: 200ms;
14813 transition-delay: 200ms;
14814}
14815.fab-opened .fab-buttons a:nth-child(6) {
14816 -webkit-transition-delay: 250ms;
14817 transition-delay: 250ms;
14818}
14819.fab-buttons-top,
14820.fab-buttons-bottom {
14821 left: 50%;
14822 width: 40px;
14823 margin-left: -20px;
14824}
14825.fab-buttons-top {
14826 bottom: 100%;
14827 margin-bottom: 16px;
14828 -webkit-box-orient: vertical;
14829 -webkit-box-direction: reverse;
14830 -webkit-flex-direction: column-reverse;
14831 -ms-flex-direction: column-reverse;
14832 flex-direction: column-reverse;
14833}
14834.fab-buttons-top a {
14835 -webkit-transform: translate3d(0, 8px, 0) scale(0.3);
14836 transform: translate3d(0, 8px, 0) scale(0.3);
14837 -webkit-transform-origin: center bottom;
14838 transform-origin: center bottom;
14839}
14840.fab-buttons-top a + a {
14841 margin-bottom: 16px;
14842}
14843.fab-buttons-bottom {
14844 top: 100%;
14845 margin-top: 16px;
14846 -webkit-box-orient: vertical;
14847 -webkit-box-direction: normal;
14848 -webkit-flex-direction: column;
14849 -ms-flex-direction: column;
14850 flex-direction: column;
14851}
14852.fab-buttons-bottom a {
14853 -webkit-transform: translate3d(0, -8px, 0) scale(0.3);
14854 transform: translate3d(0, -8px, 0) scale(0.3);
14855 -webkit-transform-origin: center top;
14856 transform-origin: center top;
14857}
14858.fab-buttons-bottom a + a {
14859 margin-top: 16px;
14860}
14861.fab-buttons-left,
14862.fab-buttons-right {
14863 top: 50%;
14864 height: 40px;
14865 margin-top: -20px;
14866}
14867.fab-buttons-left {
14868 right: 100%;
14869 margin-right: 16px;
14870}
14871.fab-buttons-left a {
14872 -webkit-transform: translate3d(8px, 0px, 0) scale(0.3);
14873 transform: translate3d(8px, 0px, 0) scale(0.3);
14874 -webkit-transform-origin: right center;
14875 transform-origin: right center;
14876}
14877.fab-buttons-left a + a {
14878 margin-right: 16px;
14879}
14880.fab-buttons-right {
14881 left: 100%;
14882 margin-left: 16px;
14883 -webkit-box-orient: horizontal;
14884 -webkit-box-direction: reverse;
14885 -webkit-flex-direction: row-reverse;
14886 -ms-flex-direction: row-reverse;
14887 flex-direction: row-reverse;
14888}
14889.fab-buttons-right a {
14890 -webkit-transform: translate3d(-8px, 0, 0) scale(0.3);
14891 transform: translate3d(-8px, 0, 0) scale(0.3);
14892 -webkit-transform-origin: left center;
14893 transform-origin: left center;
14894}
14895.fab-buttons-right a + a {
14896 margin-left: 16px;
14897}
14898.fab-buttons-center {
14899 left: 0%;
14900 top: 0%;
14901 width: 100%;
14902 height: 100%;
14903}
14904.fab-buttons-center a {
14905 position: absolute;
14906}
14907.fab-buttons-center a:nth-child(1) {
14908 left: 50%;
14909 margin-left: -20px;
14910 bottom: 100%;
14911 margin-bottom: 16px;
14912 -webkit-transform: translateY(-8px) scale(0.3);
14913 transform: translateY(-8px) scale(0.3);
14914 -webkit-transform-origin: center bottom;
14915 transform-origin: center bottom;
14916}
14917.fab-buttons-center a:nth-child(2) {
14918 left: 100%;
14919 margin-top: -20px;
14920 top: 50%;
14921 margin-left: 16px;
14922 -webkit-transform: translateX(-8px) scale(0.3);
14923 transform: translateX(-8px) scale(0.3);
14924 -webkit-transform-origin: left center;
14925 transform-origin: left center;
14926}
14927.fab-buttons-center a:nth-child(3) {
14928 left: 50%;
14929 margin-left: -20px;
14930 top: 100%;
14931 margin-top: 16px;
14932 -webkit-transform: translateY(8px) scale(0.3);
14933 transform: translateY(8px) scale(0.3);
14934 -webkit-transform-origin: center top;
14935 transform-origin: center top;
14936}
14937.fab-buttons-center a:nth-child(4) {
14938 right: 100%;
14939 margin-top: -20px;
14940 top: 50%;
14941 margin-right: 16px;
14942 -webkit-transform: translateX(8px) scale(0.3);
14943 transform: translateX(8px) scale(0.3);
14944 -webkit-transform-origin: right center;
14945 transform-origin: right center;
14946}
14947.fab-opened.fab-morph > a i {
14948 opacity: 0;
14949}
14950.fab-morph,
14951.fab-morph > a,
14952.fab-morph-target {
14953 -webkit-transition-duration: 250ms;
14954 transition-duration: 250ms;
14955}
14956.fab-morph-target:not(.fab-morph-target-visible) {
14957 display: none;
14958}
14959.fab-extended {
14960 width: auto;
14961}
14962.fab-extended > a {
14963 width: 100% !important;
14964}
14965.fab-text {
14966 padding-left: 20px;
14967 padding-right: 20px;
14968 -webkit-box-sizing: border-box;
14969 box-sizing: border-box;
14970 font-size: 14px;
14971 text-transform: uppercase;
14972}
14973.fab-label-button {
14974 overflow: visible !important;
14975}
14976.fab-label {
14977 position: absolute;
14978 top: 50%;
14979 padding: 4px 12px;
14980 border-radius: 4px;
14981 background: #fff;
14982 color: #333;
14983 white-space: nowrap;
14984 -webkit-transform: translateY(-50%);
14985 transform: translateY(-50%);
14986 pointer-events: none;
14987}
14988.fab[class*="fab-right-"] .fab-label {
14989 right: 100%;
14990 margin-right: 8px;
14991}
14992.fab[class*="fab-left-"] .fab-label {
14993 left: 100%;
14994 margin-left: 8px;
14995}
14996.md .fab > a,
14997.md .fab-buttons a {
14998 background: #2196f3;
14999 width: 56px;
15000 height: 56px;
15001 border-radius: 28px;
15002 color: #fff;
15003 -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);
15004 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);
15005}
15006.md .fab > a.active-state,
15007.md .fab-buttons a.active-state {
15008 background: #0c82df;
15009}
15010.md .fab[class*="fab-left"] {
15011 left: 15px;
15012}
15013.md .fab[class*="fab-right"] {
15014 right: 15px;
15015}
15016.md .fab[class*="-top"] {
15017 top: 15px;
15018}
15019.md .fab[class*="-bottom"] {
15020 bottom: 15px;
15021}
15022.md .navbar ~ * .fab[class*="-top"],
15023.md .navbar ~ .fab[class*="-top"] {
15024 margin-top: 56px;
15025}
15026@media (min-width: 768px) {
15027 .md .navbar ~ * .fab[class*="-top"],
15028 .md .navbar ~ .fab[class*="-top"] {
15029 margin-top: 64px;
15030 }
15031}
15032.md .toolbar:not(.toolbar-bottom-md):not(.messagebar) ~ * .fab[class*="-top"],
15033.md .toolbar:not(.toolbar-bottom-md):not(.messagebar) ~ .fab[class*="-top"] {
15034 margin-top: 48px;
15035}
15036.md .tabbar-labels:not(.toolbar-bottom-md) ~ * .fab[class*="-top"],
15037.md .tabbar-labels:not(.toolbar-bottom-md) ~ .fab[class*="-top"] {
15038 margin-top: 72px;
15039}
15040.md .navbar + .toolbar:not(.toolbar-bottom-md):not(.messagebar) ~ * .fab[class*="-top"],
15041.md .navbar + .toolbar:not(.toolbar-bottom-md):not(.messagebar) ~ .fab[class*="-top"] {
15042 margin-top: 104px;
15043}
15044.md .navbar + .tabbar-labels:not(.toolbar-bottom-md) ~ * .fab[class*="-top"],
15045.md .navbar + .tabbar-labels:not(.toolbar-bottom-md) ~ .fab[class*="-top"] {
15046 margin-top: 128px;
15047}
15048@media (min-width: 768px) {
15049 .md .navbar + .toolbar:not(.toolbar-bottom-md):not(.messagebar) ~ * .fab[class*="-top"],
15050 .md .navbar + .toolbar:not(.toolbar-bottom-md):not(.messagebar) ~ .fab[class*="-top"] {
15051 margin-top: 112px;
15052 }
15053 .md .navbar + .tabbar-labels:not(.toolbar-bottom-md) ~ * .fab[class*="-top"],
15054 .md .navbar + .tabbar-labels:not(.toolbar-bottom-md) ~ .fab[class*="-top"] {
15055 margin-top: 136px;
15056 }
15057}
15058.md .toolbar-bottom-md ~ * .fab[class*="-bottom"],
15059.md .toolbar-bottom-md ~ .fab[class*="-bottom"],
15060.md .messagebar ~ * .fab[class*="-bottom"],
15061.md .messagebar ~ .fab[class*="-bottom"] {
15062 margin-bottom: 48px;
15063}
15064.md .toolbar-bottom-md.tabbar-labels ~ * .fab[class*="-bottom"],
15065.md .toolbar-bottom-md.tabbar-labels ~ .fab[class*="-bottom"] {
15066 margin-bottom: 72px;
15067}
15068.md .fab-morph {
15069 border-radius: 28px;
15070 background: #2196f3;
15071 -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);
15072 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);
15073}
15074.md .fab-morph > a {
15075 -webkit-box-shadow: none;
15076 box-shadow: none;
15077 background: none !important;
15078}
15079.md .fab-extended {
15080 min-width: 48px;
15081}
15082.md .fab-extended > a {
15083 height: 48px;
15084}
15085.md .fab-extended > a i {
15086 left: 24px;
15087}
15088.md .fab-extended i ~ .fab-text {
15089 padding-left: 48px;
15090}
15091.md .fab-text {
15092 font-weight: 500;
15093 letter-spacing: 0.03em;
15094}
15095.md .fab-label {
15096 -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);
15097 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);
15098}
15099.md .color-theme-red .fab > a,
15100.md .color-theme-red .fab-buttons a,
15101.md .color-theme-red.fab > a,
15102.md .color-theme-red.fab-buttons a {
15103 background: #f44336;
15104}
15105.md .color-theme-red .fab > a.active-state,
15106.md .color-theme-red .fab-buttons a.active-state,
15107.md .color-theme-red.fab > a.active-state,
15108.md .color-theme-red.fab-buttons a.active-state {
15109 background: #f21f0f;
15110}
15111.md .color-theme-red .fab-morph,
15112.md .color-theme-red.fab-morph {
15113 background: #f44336;
15114}
15115.md .color-theme-green .fab > a,
15116.md .color-theme-green .fab-buttons a,
15117.md .color-theme-green.fab > a,
15118.md .color-theme-green.fab-buttons a {
15119 background: #4caf50;
15120}
15121.md .color-theme-green .fab > a.active-state,
15122.md .color-theme-green .fab-buttons a.active-state,
15123.md .color-theme-green.fab > a.active-state,
15124.md .color-theme-green.fab-buttons a.active-state {
15125 background: #409343;
15126}
15127.md .color-theme-green .fab-morph,
15128.md .color-theme-green.fab-morph {
15129 background: #4caf50;
15130}
15131.md .color-theme-blue .fab > a,
15132.md .color-theme-blue .fab-buttons a,
15133.md .color-theme-blue.fab > a,
15134.md .color-theme-blue.fab-buttons a {
15135 background: #2196f3;
15136}
15137.md .color-theme-blue .fab > a.active-state,
15138.md .color-theme-blue .fab-buttons a.active-state,
15139.md .color-theme-blue.fab > a.active-state,
15140.md .color-theme-blue.fab-buttons a.active-state {
15141 background: #0c82df;
15142}
15143.md .color-theme-blue .fab-morph,
15144.md .color-theme-blue.fab-morph {
15145 background: #2196f3;
15146}
15147.md .color-theme-pink .fab > a,
15148.md .color-theme-pink .fab-buttons a,
15149.md .color-theme-pink.fab > a,
15150.md .color-theme-pink.fab-buttons a {
15151 background: #e91e63;
15152}
15153.md .color-theme-pink .fab > a.active-state,
15154.md .color-theme-pink .fab-buttons a.active-state,
15155.md .color-theme-pink.fab > a.active-state,
15156.md .color-theme-pink.fab-buttons a.active-state {
15157 background: #ca1452;
15158}
15159.md .color-theme-pink .fab-morph,
15160.md .color-theme-pink.fab-morph {
15161 background: #e91e63;
15162}
15163.md .color-theme-yellow .fab > a,
15164.md .color-theme-yellow .fab-buttons a,
15165.md .color-theme-yellow.fab > a,
15166.md .color-theme-yellow.fab-buttons a {
15167 background: #ffeb3b;
15168}
15169.md .color-theme-yellow .fab > a.active-state,
15170.md .color-theme-yellow .fab-buttons a.active-state,
15171.md .color-theme-yellow.fab > a.active-state,
15172.md .color-theme-yellow.fab-buttons a.active-state {
15173 background: #ffe712;
15174}
15175.md .color-theme-yellow .fab-morph,
15176.md .color-theme-yellow.fab-morph {
15177 background: #ffeb3b;
15178}
15179.md .color-theme-orange .fab > a,
15180.md .color-theme-orange .fab-buttons a,
15181.md .color-theme-orange.fab > a,
15182.md .color-theme-orange.fab-buttons a {
15183 background: #ff9800;
15184}
15185.md .color-theme-orange .fab > a.active-state,
15186.md .color-theme-orange .fab-buttons a.active-state,
15187.md .color-theme-orange.fab > a.active-state,
15188.md .color-theme-orange.fab-buttons a.active-state {
15189 background: #d68000;
15190}
15191.md .color-theme-orange .fab-morph,
15192.md .color-theme-orange.fab-morph {
15193 background: #ff9800;
15194}
15195.md .color-theme-gray .fab > a,
15196.md .color-theme-gray .fab-buttons a,
15197.md .color-theme-gray.fab > a,
15198.md .color-theme-gray.fab-buttons a {
15199 background: #9e9e9e;
15200}
15201.md .color-theme-gray .fab > a.active-state,
15202.md .color-theme-gray .fab-buttons a.active-state,
15203.md .color-theme-gray.fab > a.active-state,
15204.md .color-theme-gray.fab-buttons a.active-state {
15205 background: #8a8a8a;
15206}
15207.md .color-theme-gray .fab-morph,
15208.md .color-theme-gray.fab-morph {
15209 background: #9e9e9e;
15210}
15211.md .color-theme-white .fab > a,
15212.md .color-theme-white .fab-buttons a,
15213.md .color-theme-white.fab > a,
15214.md .color-theme-white.fab-buttons a {
15215 background: #ffffff;
15216}
15217.md .color-theme-white .fab > a.active-state,
15218.md .color-theme-white .fab-buttons a.active-state,
15219.md .color-theme-white.fab > a.active-state,
15220.md .color-theme-white.fab-buttons a.active-state {
15221 background: #ebebeb;
15222}
15223.md .color-theme-white .fab-morph,
15224.md .color-theme-white.fab-morph {
15225 background: #ffffff;
15226}
15227.md .color-theme-black .fab > a,
15228.md .color-theme-black .fab-buttons a,
15229.md .color-theme-black.fab > a,
15230.md .color-theme-black.fab-buttons a {
15231 background: #000000;
15232}
15233.md .color-theme-black .fab > a.active-state,
15234.md .color-theme-black .fab-buttons a.active-state,
15235.md .color-theme-black.fab > a.active-state,
15236.md .color-theme-black.fab-buttons a.active-state {
15237 background: #000000;
15238}
15239.md .color-theme-black .fab-morph,
15240.md .color-theme-black.fab-morph {
15241 background: #000000;
15242}
15243.md .fab.color-red > a,
15244.md .fab.color-red .fab-buttons > a,
15245.md .fab-buttons.color-red a,
15246.md .fab > a.color-red,
15247.md .fab .fab-buttons > a.color-red {
15248 background: #f44336;
15249}
15250.md .fab.color-red > a.active-state,
15251.md .fab.color-red .fab-buttons > a.active-state,
15252.md .fab-buttons.color-red a.active-state,
15253.md .fab > a.color-red.active-state,
15254.md .fab .fab-buttons > a.color-red.active-state {
15255 background: #f21f0f;
15256}
15257.md .fab-morph.color-red {
15258 background: #f44336;
15259}
15260.md .fab.color-green > a,
15261.md .fab.color-green .fab-buttons > a,
15262.md .fab-buttons.color-green a,
15263.md .fab > a.color-green,
15264.md .fab .fab-buttons > a.color-green {
15265 background: #4caf50;
15266}
15267.md .fab.color-green > a.active-state,
15268.md .fab.color-green .fab-buttons > a.active-state,
15269.md .fab-buttons.color-green a.active-state,
15270.md .fab > a.color-green.active-state,
15271.md .fab .fab-buttons > a.color-green.active-state {
15272 background: #409343;
15273}
15274.md .fab-morph.color-green {
15275 background: #4caf50;
15276}
15277.md .fab.color-blue > a,
15278.md .fab.color-blue .fab-buttons > a,
15279.md .fab-buttons.color-blue a,
15280.md .fab > a.color-blue,
15281.md .fab .fab-buttons > a.color-blue {
15282 background: #2196f3;
15283}
15284.md .fab.color-blue > a.active-state,
15285.md .fab.color-blue .fab-buttons > a.active-state,
15286.md .fab-buttons.color-blue a.active-state,
15287.md .fab > a.color-blue.active-state,
15288.md .fab .fab-buttons > a.color-blue.active-state {
15289 background: #0c82df;
15290}
15291.md .fab-morph.color-blue {
15292 background: #2196f3;
15293}
15294.md .fab.color-pink > a,
15295.md .fab.color-pink .fab-buttons > a,
15296.md .fab-buttons.color-pink a,
15297.md .fab > a.color-pink,
15298.md .fab .fab-buttons > a.color-pink {
15299 background: #e91e63;
15300}
15301.md .fab.color-pink > a.active-state,
15302.md .fab.color-pink .fab-buttons > a.active-state,
15303.md .fab-buttons.color-pink a.active-state,
15304.md .fab > a.color-pink.active-state,
15305.md .fab .fab-buttons > a.color-pink.active-state {
15306 background: #ca1452;
15307}
15308.md .fab-morph.color-pink {
15309 background: #e91e63;
15310}
15311.md .fab.color-yellow > a,
15312.md .fab.color-yellow .fab-buttons > a,
15313.md .fab-buttons.color-yellow a,
15314.md .fab > a.color-yellow,
15315.md .fab .fab-buttons > a.color-yellow {
15316 background: #ffeb3b;
15317}
15318.md .fab.color-yellow > a.active-state,
15319.md .fab.color-yellow .fab-buttons > a.active-state,
15320.md .fab-buttons.color-yellow a.active-state,
15321.md .fab > a.color-yellow.active-state,
15322.md .fab .fab-buttons > a.color-yellow.active-state {
15323 background: #ffe712;
15324}
15325.md .fab-morph.color-yellow {
15326 background: #ffeb3b;
15327}
15328.md .fab.color-orange > a,
15329.md .fab.color-orange .fab-buttons > a,
15330.md .fab-buttons.color-orange a,
15331.md .fab > a.color-orange,
15332.md .fab .fab-buttons > a.color-orange {
15333 background: #ff9800;
15334}
15335.md .fab.color-orange > a.active-state,
15336.md .fab.color-orange .fab-buttons > a.active-state,
15337.md .fab-buttons.color-orange a.active-state,
15338.md .fab > a.color-orange.active-state,
15339.md .fab .fab-buttons > a.color-orange.active-state {
15340 background: #d68000;
15341}
15342.md .fab-morph.color-orange {
15343 background: #ff9800;
15344}
15345.md .fab.color-gray > a,
15346.md .fab.color-gray .fab-buttons > a,
15347.md .fab-buttons.color-gray a,
15348.md .fab > a.color-gray,
15349.md .fab .fab-buttons > a.color-gray {
15350 background: #9e9e9e;
15351}
15352.md .fab.color-gray > a.active-state,
15353.md .fab.color-gray .fab-buttons > a.active-state,
15354.md .fab-buttons.color-gray a.active-state,
15355.md .fab > a.color-gray.active-state,
15356.md .fab .fab-buttons > a.color-gray.active-state {
15357 background: #8a8a8a;
15358}
15359.md .fab-morph.color-gray {
15360 background: #9e9e9e;
15361}
15362.md .fab.color-white > a,
15363.md .fab.color-white .fab-buttons > a,
15364.md .fab-buttons.color-white a,
15365.md .fab > a.color-white,
15366.md .fab .fab-buttons > a.color-white {
15367 background: #ffffff;
15368}
15369.md .fab.color-white > a.active-state,
15370.md .fab.color-white .fab-buttons > a.active-state,
15371.md .fab-buttons.color-white a.active-state,
15372.md .fab > a.color-white.active-state,
15373.md .fab .fab-buttons > a.color-white.active-state {
15374 background: #ebebeb;
15375}
15376.md .fab-morph.color-white {
15377 background: #ffffff;
15378}
15379.md .fab.color-black > a,
15380.md .fab.color-black .fab-buttons > a,
15381.md .fab-buttons.color-black a,
15382.md .fab > a.color-black,
15383.md .fab .fab-buttons > a.color-black {
15384 background: #000000;
15385}
15386.md .fab.color-black > a.active-state,
15387.md .fab.color-black .fab-buttons > a.active-state,
15388.md .fab-buttons.color-black a.active-state,
15389.md .fab > a.color-black.active-state,
15390.md .fab .fab-buttons > a.color-black.active-state {
15391 background: #000000;
15392}
15393.md .fab-morph.color-black {
15394 background: #000000;
15395}
15396.md.device-iphone-x .fab[class*="-bottom"] {
15397 bottom: calc(16px + constant(safe-area-inset-bottom));
15398 bottom: calc(16px + env(safe-area-inset-bottom));
15399}
15400@media (orientation: landscape) {
15401 .md.device-iphone-x .ios-left-edge .fab[class*="fab-left"],
15402 .md.device-iphone-x .ios-edges .fab[class*="fab-left"],
15403 .md.device-iphone-x .popup .fab[class*="fab-left"],
15404 .md.device-iphone-x .sheet-modal .fab[class*="fab-left"],
15405 .md.device-iphone-x .panel-left .fab[class*="fab-left"] {
15406 left: calc(16px + constant(safe-area-inset-left));
15407 left: calc(16px + env(safe-area-inset-left));
15408 }
15409 .md.device-iphone-x .ios-right-edge .fab[class*="fab-right"],
15410 .md.device-iphone-x .ios-edges .fab[class*="fab-right"],
15411 .md.device-iphone-x .popup .fab[class*="fab-right"],
15412 .md.device-iphone-x .sheet-modal .fab[class*="fab-right"],
15413 .md.device-iphone-x .panel-right .fab[class*="fab-right"] {
15414 right: calc(16px + constant(safe-area-inset-right));
15415 right: calc(16px + env(safe-area-inset-right));
15416 }
15417}
15418/* === Searchbar === */
15419.searchbar {
15420 width: 100%;
15421 position: relative;
15422 z-index: 200;
15423}
15424.searchbar .searchbar-input-wrap {
15425 -webkit-flex-shrink: 1;
15426 -ms-flex-negative: 1;
15427 flex-shrink: 1;
15428 width: 100%;
15429 height: 100%;
15430 position: relative;
15431}
15432.searchbar .searchbar-input-wrap input[type="search"] {
15433 padding: 0;
15434}
15435.searchbar .searchbar-input-wrap input::-webkit-search-cancel-button {
15436 -webkit-appearance: none;
15437 appearance: none;
15438}
15439.page > .searchbar {
15440 position: absolute;
15441 left: 0;
15442 top: 0;
15443}
15444.searchbar-expandable {
15445 position: absolute;
15446 -webkit-transition-duration: 300ms;
15447 transition-duration: 300ms;
15448 pointer-events: none;
15449}
15450.searchbar-inner {
15451 position: absolute;
15452 left: 0;
15453 top: 0;
15454 width: 100%;
15455 height: 100%;
15456 display: -webkit-box;
15457 display: -webkit-flex;
15458 display: -ms-flexbox;
15459 display: flex;
15460 -webkit-box-align: center;
15461 -webkit-align-items: center;
15462 -ms-flex-align: center;
15463 align-items: center;
15464 -webkit-box-sizing: border-box;
15465 box-sizing: border-box;
15466}
15467.searchbar-disable-button {
15468 cursor: pointer;
15469 pointer-events: none;
15470 -webkit-appearance: none;
15471 -moz-appearance: none;
15472 appearance: none;
15473 background: none;
15474 border: none;
15475 outline: 0;
15476 padding: 0;
15477 margin: 0;
15478 width: auto;
15479 opacity: 0;
15480}
15481.searchbar-icon {
15482 pointer-events: none;
15483 background-position: center;
15484 background-repeat: no-repeat;
15485}
15486.searchbar-backdrop {
15487 position: absolute;
15488 left: 0;
15489 top: 0;
15490 width: 100%;
15491 height: 100%;
15492 z-index: 100;
15493 opacity: 0;
15494 pointer-events: none;
15495 -webkit-transition-duration: 300ms;
15496 transition-duration: 300ms;
15497 -webkit-transform: translate3d(0, 0, 0);
15498 transform: translate3d(0, 0, 0);
15499}
15500.searchbar-backdrop.searchbar-backdrop-in {
15501 opacity: 1;
15502 pointer-events: auto;
15503}
15504.page-content > .searchbar-backdrop {
15505 position: fixed;
15506}
15507.searchbar-not-found {
15508 display: none;
15509}
15510.hidden-by-searchbar,
15511.list .hidden-by-searchbar,
15512.list.li.hidden-by-searchbar,
15513.list li.hidden-by-searchbar {
15514 display: none !important;
15515}
15516.md .searchbar {
15517 height: 48px;
15518 background: #fff;
15519}
15520.md .searchbar input[type="search"],
15521.md .searchbar input[type="text"] {
15522 padding-right: 65px;
15523 padding-left: 48px;
15524 -webkit-box-sizing: border-box;
15525 box-sizing: border-box;
15526 width: 100%;
15527 height: 100%;
15528 display: block;
15529 border: none;
15530 -webkit-appearance: none;
15531 -moz-appearance: none;
15532 appearance: none;
15533 font-family: inherit;
15534 font-size: 20px;
15535 color: #000;
15536 font-weight: normal;
15537}
15538.md .searchbar input[type="search"]::-webkit-input-placeholder,
15539.md .searchbar input[type="text"]::-webkit-input-placeholder {
15540 color: #939398;
15541 opacity: 1;
15542}
15543.md .searchbar input[type="search"]:-ms-input-placeholder,
15544.md .searchbar input[type="text"]:-ms-input-placeholder {
15545 color: #939398;
15546 opacity: 1;
15547}
15548.md .searchbar input[type="search"]::-ms-input-placeholder,
15549.md .searchbar input[type="text"]::-ms-input-placeholder {
15550 color: #939398;
15551 opacity: 1;
15552}
15553.md .searchbar input[type="search"]::placeholder,
15554.md .searchbar input[type="text"]::placeholder {
15555 color: #939398;
15556 opacity: 1;
15557}
15558.md .searchbar-expandable {
15559 height: 100%;
15560}
15561.md .searchbar-backdrop {
15562 background: rgba(0, 0, 0, 0.25);
15563}
15564.md .searchbar-icon,
15565.md .searchbar-disable-button {
15566 position: absolute;
15567 width: 48px;
15568 height: 48px;
15569 right: -4px;
15570 top: 50%;
15571 margin-top: -24px;
15572 background-size: 24px 24px;
15573 background-repeat: no-repeat;
15574 background-position: center;
15575 -webkit-transition-duration: 300ms;
15576 transition-duration: 300ms;
15577}
15578.md .searchbar-icon {
15579 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");
15580}
15581.md .searchbar-disable-button {
15582 -webkit-transform: rotate(-90deg) scale(0.5);
15583 transform: rotate(-90deg) scale(0.5);
15584 font-size: 0 !important;
15585 display: block;
15586 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'%23737373'%2F%3E%3C%2Fsvg%3E");
15587}
15588.md .searchbar-disable-button:before {
15589 content: '';
15590 width: 152%;
15591 height: 152%;
15592 position: absolute;
15593 left: -26%;
15594 top: -26%;
15595 background-image: -webkit-radial-gradient(center, circle, rgba(0, 0, 0, 0.1) 66%, rgba(0, 0, 0, 0) 66%);
15596 background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0.1) 66%, rgba(0, 0, 0, 0) 66%);
15597 background-repeat: no-repeat;
15598 background-position: center;
15599 background-size: 100% 100%;
15600 opacity: 0;
15601 pointer-events: none;
15602 -webkit-transition-duration: 600ms;
15603 transition-duration: 600ms;
15604}
15605.md .searchbar-disable-button.active-state:before {
15606 opacity: 1;
15607 -webkit-transition-duration: 150ms;
15608 transition-duration: 150ms;
15609}
15610.md .searchbar-enabled:not(.searchbar-enabled-no-disable-button) .searchbar-disable-button {
15611 -webkit-transform: rotate(0deg) scale(1);
15612 transform: rotate(0deg) scale(1);
15613 pointer-events: auto;
15614 opacity: 1;
15615}
15616.md .searchbar-enabled:not(.searchbar-enabled-no-disable-button) .searchbar-icon {
15617 opacity: 0;
15618 -webkit-transform: rotate(90deg) scale(0.5);
15619 transform: rotate(90deg) scale(0.5);
15620}
15621.md .searchbar .input-clear-button {
15622 width: 48px;
15623 height: 48px;
15624 margin-top: -24px;
15625 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");
15626 border-radius: 0;
15627 background-repeat: no-repeat;
15628 background-position: center;
15629 background-size: 24px 24px;
15630 background-color: transparent;
15631 left: 0;
15632}
15633.md .searchbar .input-clear-button:before {
15634 content: '';
15635 width: 152%;
15636 height: 152%;
15637 position: absolute;
15638 left: -26%;
15639 top: -26%;
15640 background-image: -webkit-radial-gradient(center, circle, rgba(0, 0, 0, 0.1) 66%, rgba(0, 0, 0, 0) 66%);
15641 background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0.1) 66%, rgba(0, 0, 0, 0) 66%);
15642 background-repeat: no-repeat;
15643 background-position: center;
15644 background-size: 100% 100%;
15645 opacity: 0;
15646 pointer-events: none;
15647 -webkit-transition-duration: 600ms;
15648 transition-duration: 600ms;
15649}
15650.md .searchbar .input-clear-button.active-state:before {
15651 opacity: 1;
15652 -webkit-transition-duration: 150ms;
15653 transition-duration: 150ms;
15654}
15655.md .searchbar .input-clear-button:after {
15656 display: none;
15657}
15658.md .searchbar .input-clear-button:before {
15659 margin-left: 0;
15660 margin-top: 0;
15661}
15662.md .page-content .searchbar {
15663 border-radius: 2px;
15664 margin: 8px;
15665 width: auto;
15666 -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
15667 box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
15668}
15669.md .page-content .searchbar .searchbar-inner {
15670 border-radius: 2px;
15671}
15672.md .page > .searchbar {
15673 z-index: 510;
15674}
15675.md .page > .searchbar:after {
15676 content: '';
15677 position: absolute;
15678 right: 0;
15679 width: 100%;
15680 top: 100%;
15681 bottom: auto;
15682 height: 10px;
15683 pointer-events: none;
15684 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)));
15685 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%);
15686 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%);
15687}
15688.md .page > .searchbar.no-shadow:after {
15689 display: none;
15690}
15691.md .page > .searchbar input[type="search"],
15692.md .subnavbar .searchbar input[type="search"],
15693.md .searchbar-expandable input[type="search"],
15694.md .page > .searchbar input[type="text"],
15695.md .subnavbar .searchbar input[type="text"],
15696.md .searchbar-expandable input[type="text"] {
15697 padding-right: 73px;
15698}
15699.md .page > .searchbar .searchbar-icon,
15700.md .subnavbar .searchbar .searchbar-icon,
15701.md .searchbar-expandable .searchbar-icon,
15702.md .page > .searchbar .searchbar-disable-button,
15703.md .subnavbar .searchbar .searchbar-disable-button,
15704.md .searchbar-expandable .searchbar-disable-button {
15705 right: 4px;
15706}
15707.md .searchbar-expandable {
15708 width: 56px;
15709 height: 100%;
15710 opacity: 0;
15711 top: 50%;
15712 margin-top: -28px;
15713 -webkit-transform: translate3d(0px, 0px, 0px);
15714 transform: translate3d(0px, 0px, 0px);
15715 right: 100%;
15716 margin-right: -56px;
15717}
15718.md .navbar .searchbar-expandable {
15719 border-radius: 28px;
15720 width: 56px;
15721 margin-top: -28px;
15722 margin-right: -56px;
15723}
15724@media (min-width: 768px) {
15725 .md .navbar .searchbar-expandable {
15726 border-radius: 32px;
15727 width: 64px;
15728 margin-top: -32px;
15729 margin-right: -64px;
15730 }
15731}
15732.md .toolbar .searchbar-expandable,
15733.md .subnavbar .searchbar-expandable {
15734 border-radius: 24px;
15735 width: 48px;
15736 margin-top: -24px;
15737 margin-right: -56px;
15738}
15739.md .tabbar-labels .searchbar-expandable {
15740 border-radius: 36px;
15741 width: 72px;
15742 margin-top: -36px;
15743 margin-right: -72px;
15744}
15745.md .searchbar-expandable.searchbar-enabled {
15746 width: 100%;
15747 border-radius: 0;
15748 opacity: 1;
15749 pointer-events: auto;
15750 top: 0;
15751 margin-top: 0;
15752 right: 0;
15753 margin-right: 0;
15754}
15755.md .page > .searchbar ~ * .page-content,
15756.md .page > .searchbar ~ .page-content {
15757 padding-top: 48px;
15758}
15759.md .page > .navbar ~ .searchbar {
15760 top: 56px;
15761}
15762@media (min-width: 768px) {
15763 .md .page > .navbar ~ .searchbar {
15764 top: 64px;
15765 }
15766}
15767.md .page > .navbar ~ .searchbar ~ * .page-content,
15768.md .page > .navbar ~ .searchbar ~ .page-content {
15769 padding-top: 104px;
15770}
15771@media (min-width: 768px) {
15772 .md .page > .navbar ~ .searchbar ~ * .page-content,
15773 .md .page > .navbar ~ .searchbar ~ .page-content {
15774 padding-top: 112px;
15775 }
15776}
15777.md .page > .toolbar:not(.toolbar-bottom-md):not(.messagebar) ~ .searchbar {
15778 top: 48px;
15779}
15780.md .page > .toolbar:not(.toolbar-bottom-md):not(.messagebar) ~ .searchbar ~ * .page-content,
15781.md .page > .toolbar:not(.toolbar-bottom-md):not(.messagebar) ~ .searchbar ~ .page-content {
15782 padding-top: 96px;
15783}
15784.md .page > .tabbar-labels:not(.toolbar-bottom-md) ~ .searchbar {
15785 top: 72px;
15786}
15787.md .page > .tabbar-labels:not(.toolbar-bottom-md) ~ .searchbar ~ * .page-content,
15788.md .page > .tabbar-labels:not(.toolbar-bottom-md) ~ .searchbar ~ .page-content {
15789 padding-top: 120px;
15790}
15791.md .page > .navbar ~ .toolbar:not(.toolbar-bottom-md):not(.messagebar) ~ .searchbar {
15792 top: 104px;
15793}
15794@media (min-width: 768px) {
15795 .md .page > .navbar ~ .toolbar:not(.toolbar-bottom-md):not(.messagebar) ~ .searchbar {
15796 top: 112px;
15797 }
15798}
15799.md .page > .navbar ~ .toolbar:not(.toolbar-bottom-md):not(.messagebar) ~ .searchbar ~ * .page-content,
15800.md .page > .navbar ~ .toolbar:not(.toolbar-bottom-md):not(.messagebar) ~ .searchbar ~ .page-content {
15801 padding-top: 152px;
15802}
15803@media (min-width: 768px) {
15804 .md .page > .navbar ~ .toolbar:not(.toolbar-bottom-md):not(.messagebar) ~ .searchbar ~ * .page-content,
15805 .md .page > .navbar ~ .toolbar:not(.toolbar-bottom-md):not(.messagebar) ~ .searchbar ~ .page-content {
15806 padding-top: 160px;
15807 }
15808}
15809.md .page > .navbar ~ .tabbar-labels:not(.toolbar-bottom-md) ~ .searchbar {
15810 top: 128px;
15811}
15812@media (min-width: 768px) {
15813 .md .page > .navbar ~ .tabbar-labels:not(.toolbar-bottom-md) ~ .searchbar {
15814 top: 136px;
15815 }
15816}
15817.md .page > .navbar ~ .tabbar-labels:not(.toolbar-bottom-md) ~ .searchbar ~ * .page-content,
15818.md .page > .navbar ~ .tabbar-labels:not(.toolbar-bottom-md) ~ .searchbar ~ .page-content {
15819 padding-top: 176px;
15820}
15821@media (min-width: 768px) {
15822 .md .page > .navbar ~ .tabbar-labels:not(.toolbar-bottom-md) ~ .searchbar ~ * .page-content,
15823 .md .page > .navbar ~ .tabbar-labels:not(.toolbar-bottom-md) ~ .searchbar ~ .page-content {
15824 padding-top: 184px;
15825 }
15826}
15827@media (orientation: landscape) {
15828 .md.device-iphone-x .ios-left-edge .searchbar-inner,
15829 .md.device-iphone-x .ios-edges .searchbar-inner,
15830 .md.device-iphone-x .popup .searchbar-inner,
15831 .md.device-iphone-x .sheet-modal .searchbar-inner,
15832 .md.device-iphone-x .panel-left .searchbar-inner {
15833 padding-left: constant(safe-area-inset-left);
15834 padding-left: env(safe-area-inset-left);
15835 }
15836 .md.device-iphone-x .ios-right-edge .searchbar-inner,
15837 .md.device-iphone-x .ios-edges .searchbar-inner,
15838 .md.device-iphone-x .popup .searchbar-inner,
15839 .md.device-iphone-x .sheet-modal .searchbar-inner,
15840 .md.device-iphone-x .panel-right .searchbar-inner {
15841 padding-right: constant(safe-area-inset-right);
15842 padding-right: env(safe-area-inset-right);
15843 }
15844 .md.device-iphone-x .ios-right-edge .searchbar-disable-button,
15845 .md.device-iphone-x .ios-edges .searchbar-disable-button,
15846 .md.device-iphone-x .popup .searchbar-disable-button,
15847 .md.device-iphone-x .sheet-modal .searchbar-disable-button,
15848 .md.device-iphone-x .panel-right .searchbar-disable-button {
15849 right: calc(4px + constant(safe-area-inset-right));
15850 right: calc(4px + env(safe-area-inset-right));
15851 }
15852}
15853/* === Messages === */
15854.messages {
15855 display: -webkit-box;
15856 display: -webkit-flex;
15857 display: -ms-flexbox;
15858 display: flex;
15859 -webkit-box-orient: vertical;
15860 -webkit-box-direction: normal;
15861 -webkit-flex-direction: column;
15862 -ms-flex-direction: column;
15863 flex-direction: column;
15864 min-height: 100%;
15865 position: relative;
15866 z-index: 1;
15867}
15868.messages-title {
15869 text-align: center;
15870 width: 100%;
15871 line-height: 1;
15872}
15873.message {
15874 max-width: 70%;
15875 -webkit-box-sizing: border-box;
15876 box-sizing: border-box;
15877 display: -webkit-box;
15878 display: -webkit-flex;
15879 display: -ms-flexbox;
15880 display: flex;
15881 -webkit-box-align: end;
15882 -webkit-align-items: flex-end;
15883 -ms-flex-align: end;
15884 align-items: flex-end;
15885 position: relative;
15886 z-index: 1;
15887 -webkit-transform: translate3d(0, 0, 0);
15888 transform: translate3d(0, 0, 0);
15889}
15890.message-avatar {
15891 border-radius: 50%;
15892 position: relative;
15893 background-size: cover;
15894 -webkit-align-self: flex-end;
15895 -ms-flex-item-align: end;
15896 align-self: flex-end;
15897 -webkit-flex-shrink: 0;
15898 -ms-flex-negative: 0;
15899 flex-shrink: 0;
15900}
15901.message-content {
15902 position: relative;
15903 display: -webkit-box;
15904 display: -webkit-flex;
15905 display: -ms-flexbox;
15906 display: flex;
15907 -webkit-box-orient: vertical;
15908 -webkit-box-direction: normal;
15909 -webkit-flex-direction: column;
15910 -ms-flex-direction: column;
15911 flex-direction: column;
15912}
15913.message-header,
15914.message-footer,
15915.message-name {
15916 line-height: 1;
15917 font-size: 12px;
15918}
15919.message-footer {
15920 font-size: 11px;
15921 margin-bottom: -1em;
15922}
15923.message-bubble {
15924 -webkit-box-sizing: border-box;
15925 box-sizing: border-box;
15926 word-break: break-word;
15927 display: -webkit-box;
15928 display: -webkit-flex;
15929 display: -ms-flexbox;
15930 display: flex;
15931 -webkit-box-orient: vertical;
15932 -webkit-box-direction: normal;
15933 -webkit-flex-direction: column;
15934 -ms-flex-direction: column;
15935 flex-direction: column;
15936 position: relative;
15937 line-height: 1.2;
15938}
15939.message-image img {
15940 display: block;
15941 max-width: 100%;
15942 height: auto;
15943 width: auto;
15944}
15945.message-text-header,
15946.message-text-footer {
15947 font-size: 12px;
15948 line-height: 1;
15949}
15950.message-text {
15951 text-align: left;
15952}
15953.message-sent {
15954 text-align: right;
15955 -webkit-box-orient: horizontal;
15956 -webkit-box-direction: normal;
15957 -webkit-flex-direction: row;
15958 -ms-flex-direction: row;
15959 flex-direction: row;
15960 -webkit-align-self: flex-start;
15961 -ms-flex-item-align: start;
15962 align-self: flex-start;
15963}
15964.message-received {
15965 -webkit-box-orient: horizontal;
15966 -webkit-box-direction: reverse;
15967 -webkit-flex-direction: row-reverse;
15968 -ms-flex-direction: row-reverse;
15969 flex-direction: row-reverse;
15970 -webkit-align-self: flex-end;
15971 -ms-flex-item-align: end;
15972 align-self: flex-end;
15973}
15974.message-received .message-content {
15975 -webkit-box-align: end;
15976 -webkit-align-items: flex-end;
15977 -ms-flex-align: end;
15978 align-items: flex-end;
15979}
15980.message-sent .message-content {
15981 -webkit-box-align: start;
15982 -webkit-align-items: flex-start;
15983 -ms-flex-align: start;
15984 align-items: flex-start;
15985}
15986.message:not(.message-last) .message-avatar {
15987 opacity: 0;
15988}
15989.message:not(.message-first) .message-name {
15990 display: none;
15991}
15992.message.message-same-name .message-name {
15993 display: none;
15994}
15995.message.message-same-header .message-header {
15996 display: none;
15997}
15998.message.message-same-footer .message-footer {
15999 display: none;
16000}
16001.message-appear-from-bottom {
16002 -webkit-animation: message-appear-from-bottom 300ms;
16003 animation: message-appear-from-bottom 300ms;
16004}
16005.message-appear-from-top {
16006 -webkit-animation: message-appear-from-top 300ms;
16007 animation: message-appear-from-top 300ms;
16008}
16009.message-typing-indicator {
16010 display: inline-block;
16011 font-size: 0;
16012 vertical-align: middle;
16013}
16014.message-typing-indicator > div {
16015 display: inline-block;
16016 position: relative;
16017 background: #000;
16018 vertical-align: middle;
16019 border-radius: 50%;
16020}
16021@-webkit-keyframes message-appear-from-bottom {
16022 from {
16023 -webkit-transform: translate3d(0, 100%, 0);
16024 transform: translate3d(0, 100%, 0);
16025 }
16026 to {
16027 -webkit-transform: translate3d(0, 0, 0);
16028 transform: translate3d(0, 0, 0);
16029 }
16030}
16031@keyframes message-appear-from-bottom {
16032 from {
16033 -webkit-transform: translate3d(0, 100%, 0);
16034 transform: translate3d(0, 100%, 0);
16035 }
16036 to {
16037 -webkit-transform: translate3d(0, 0, 0);
16038 transform: translate3d(0, 0, 0);
16039 }
16040}
16041@-webkit-keyframes message-appear-from-top {
16042 from {
16043 -webkit-transform: translate3d(0, -100%, 0);
16044 transform: translate3d(0, -100%, 0);
16045 }
16046 to {
16047 -webkit-transform: translate3d(0, 0, 0);
16048 transform: translate3d(0, 0, 0);
16049 }
16050}
16051@keyframes message-appear-from-top {
16052 from {
16053 -webkit-transform: translate3d(0, -100%, 0);
16054 transform: translate3d(0, -100%, 0);
16055 }
16056 to {
16057 -webkit-transform: translate3d(0, 0, 0);
16058 transform: translate3d(0, 0, 0);
16059 }
16060}
16061.md .messages-content,
16062.md .messages {
16063 background: #eee;
16064}
16065.md .message {
16066 margin-top: 16px;
16067}
16068.md .message:last-child {
16069 margin-bottom: 16px;
16070}
16071.md .messages-title {
16072 font-size: 12px;
16073 color: rgba(0, 0, 0, 0.51);
16074 margin-top: 16px;
16075}
16076.md .messages-title:last-child {
16077 margin-bottom: 16px;
16078}
16079.md .messages-title b {
16080 font-weight: 500;
16081}
16082.md .message-avatar {
16083 width: 32px;
16084 height: 32px;
16085}
16086.md .message-header,
16087.md .message-footer,
16088.md .message-name {
16089 color: rgba(0, 0, 0, 0.51);
16090}
16091.md .message-header b,
16092.md .message-footer b,
16093.md .message-name b {
16094 font-weight: 500;
16095}
16096.md .message-header,
16097.md .message-name {
16098 margin-bottom: 2px;
16099}
16100.md .message-footer {
16101 margin-top: 2px;
16102}
16103.md .message-bubble {
16104 font-size: 16px;
16105 border-radius: 2px;
16106 padding: 6px 8px;
16107 min-height: 32px;
16108}
16109.md .message-text-header,
16110.md .message-text-footer {
16111 color: rgba(0, 0, 0, 0.51);
16112}
16113.md .message-text-header {
16114 margin-bottom: 4px;
16115}
16116.md .message-text-footer {
16117 margin-top: 4px;
16118}
16119.md .message-received {
16120 margin-left: 8px;
16121}
16122.md .message-received .message-bubble {
16123 color: #333;
16124 background: #fff;
16125}
16126.md .message-received .message-avatar + .message-content {
16127 margin-left: 8px;
16128}
16129.md .message-received.message-tail .message-bubble {
16130 border-radius: 2px 2px 2px 0;
16131}
16132.md .message-received.message-tail .message-bubble:before {
16133 position: absolute;
16134 content: '';
16135 border-left: 8px solid transparent;
16136 border-right: 0 solid transparent;
16137 border-bottom: 8px solid #fff;
16138 right: 100%;
16139 bottom: 0;
16140 width: 0;
16141 height: 0;
16142}
16143.md .message-sent {
16144 margin-right: 8px;
16145}
16146.md .message-sent .message-bubble {
16147 color: #333;
16148 background: #c8e6c9;
16149}
16150.md .message-sent .message-avatar + .message-content {
16151 margin-right: 8px;
16152}
16153.md .message-sent.message-tail .message-bubble {
16154 border-radius: 2px 2px 0 2px;
16155}
16156.md .message-sent.message-tail .message-bubble:before {
16157 position: absolute;
16158 content: '';
16159 border-right: 8px solid transparent;
16160 border-left: 0 solid transparent;
16161 border-bottom: 8px solid #c8e6c9;
16162 left: 100%;
16163 bottom: 0;
16164 width: 0;
16165 height: 0;
16166}
16167.md .message + .message:not(.message-first) {
16168 margin-top: 8px;
16169}
16170.md .message-typing-indicator > div {
16171 width: 6px;
16172 height: 6px;
16173 opacity: 0.6;
16174}
16175.md .message-typing-indicator > div + div {
16176 margin-right: 6px;
16177}
16178.md .message-typing-indicator > div:nth-child(1) {
16179 -webkit-animation: md-message-typing-indicator 900ms infinite;
16180 animation: md-message-typing-indicator 900ms infinite;
16181}
16182.md .message-typing-indicator > div:nth-child(2) {
16183 -webkit-animation: md-message-typing-indicator 900ms 150ms infinite;
16184 animation: md-message-typing-indicator 900ms 150ms infinite;
16185}
16186.md .message-typing-indicator > div:nth-child(3) {
16187 -webkit-animation: md-message-typing-indicator 900ms 300ms infinite;
16188 animation: md-message-typing-indicator 900ms 300ms infinite;
16189}
16190.md .theme-dark .messages-content,
16191.messages-content.md .theme-dark,
16192.md .theme-dark .messages,
16193.messages.md .theme-dark {
16194 background-color: transparent;
16195}
16196.md .theme-dark .messages-title {
16197 color: rgba(255, 255, 255, 0.54);
16198}
16199.md .theme-dark .message-header,
16200.md .theme-dark .message-footer,
16201.md .theme-dark .message-name {
16202 color: rgba(255, 255, 255, 0.54);
16203}
16204@media (orientation: landscape) {
16205 .md.device-iphone-x .ios-left-edge .message-received,
16206 .md.device-iphone-x .ios-edges .message-received,
16207 .md.device-iphone-x .popup .message-received,
16208 .md.device-iphone-x .sheet-modal .message-received,
16209 .md.device-iphone-x .panel-left .message-received {
16210 margin-left: calc(8px + constant(safe-area-inset-left));
16211 margin-left: calc(8px + env(safe-area-inset-left));
16212 }
16213 .md.device-iphone-x .ios-right-edge .message-sent,
16214 .md.device-iphone-x .ios-edges .message-sent,
16215 .md.device-iphone-x .popup .message-sent,
16216 .md.device-iphone-x .sheet-modal .message-sent,
16217 .md.device-iphone-x .panel-right .message-sent {
16218 margin-right: calc(8px + constant(safe-area-inset-right));
16219 margin-right: calc(8px + env(safe-area-inset-right));
16220 }
16221}
16222@-webkit-keyframes md-message-typing-indicator {
16223 0% {
16224 -webkit-transform: translateY(0%);
16225 transform: translateY(0%);
16226 }
16227 25% {
16228 -webkit-transform: translateY(-5px);
16229 transform: translateY(-5px);
16230 }
16231 50% {
16232 -webkit-transform: translateY(0%);
16233 transform: translateY(0%);
16234 }
16235}
16236@keyframes md-message-typing-indicator {
16237 0% {
16238 -webkit-transform: translateY(0%);
16239 transform: translateY(0%);
16240 }
16241 25% {
16242 -webkit-transform: translateY(-5px);
16243 transform: translateY(-5px);
16244 }
16245 50% {
16246 -webkit-transform: translateY(0%);
16247 transform: translateY(0%);
16248 }
16249}
16250/* === Messagebar === */
16251.toolbar.messagebar {
16252 -webkit-transform: translate3d(0, 0, 0);
16253 transform: translate3d(0, 0, 0);
16254 background: #fff;
16255 height: auto;
16256}
16257.toolbar.messagebar .toolbar-inner {
16258 position: relative;
16259 -webkit-box-orient: horizontal;
16260 -webkit-box-direction: reverse;
16261 -webkit-flex-direction: row-reverse;
16262 -ms-flex-direction: row-reverse;
16263 flex-direction: row-reverse;
16264}
16265.toolbar.messagebar .messagebar-area {
16266 width: 100%;
16267 -webkit-flex-shrink: 1;
16268 -ms-flex-negative: 1;
16269 flex-shrink: 1;
16270 overflow: hidden;
16271 position: relative;
16272}
16273.toolbar.messagebar textarea {
16274 width: 100%;
16275 -webkit-flex-shrink: 1;
16276 -ms-flex-negative: 1;
16277 flex-shrink: 1;
16278}
16279.toolbar.messagebar a.link {
16280 -webkit-align-self: flex-end;
16281 -ms-flex-item-align: end;
16282 align-self: flex-end;
16283 -webkit-flex-shrink: 0;
16284 -ms-flex-negative: 0;
16285 flex-shrink: 0;
16286}
16287.messagebar-attachments {
16288 width: 100%;
16289 overflow: auto;
16290 -webkit-overflow-scrolling: touch;
16291 font-size: 0;
16292 white-space: nowrap;
16293 -webkit-box-sizing: border-box;
16294 box-sizing: border-box;
16295 position: relative;
16296}
16297.messagebar:not(.messagebar-attachments-visible) .messagebar-attachments {
16298 display: none;
16299}
16300.messagebar-attachment {
16301 background-size: cover;
16302 background-position: center;
16303 background-repeat: no-repeat;
16304 display: inline-block;
16305 vertical-align: middle;
16306 white-space: normal;
16307 height: 155px;
16308 position: relative;
16309}
16310@media (orientation: landscape) {
16311 .messagebar-attachment {
16312 height: 120px;
16313 }
16314}
16315.messagebar-attachment img {
16316 display: block;
16317 width: auto;
16318 height: 100%;
16319}
16320.messagebar-attachment + .messagebar-attachment {
16321 margin-right: 8px;
16322}
16323.messagebar-sheet {
16324 overflow: auto;
16325 -webkit-overflow-scrolling: touch;
16326 display: -webkit-box;
16327 display: -webkit-flex;
16328 display: -ms-flexbox;
16329 display: flex;
16330 -webkit-flex-wrap: wrap;
16331 -ms-flex-wrap: wrap;
16332 flex-wrap: wrap;
16333 -webkit-box-orient: vertical;
16334 -webkit-box-direction: normal;
16335 -webkit-flex-direction: column;
16336 -ms-flex-direction: column;
16337 flex-direction: column;
16338 -webkit-align-content: flex-start;
16339 -ms-flex-line-pack: start;
16340 align-content: flex-start;
16341 height: 252px;
16342}
16343@media (orientation: landscape) {
16344 .messagebar-sheet {
16345 height: 192px;
16346 }
16347}
16348.messagebar-sheet-image,
16349.messagebar-sheet-item {
16350 -webkit-box-sizing: border-box;
16351 box-sizing: border-box;
16352 -webkit-flex-shrink: 0;
16353 -ms-flex-negative: 0;
16354 flex-shrink: 0;
16355 margin-top: 1px;
16356 position: relative;
16357 overflow: hidden;
16358 height: 125px;
16359 width: 125px;
16360 margin-right: 1px;
16361}
16362@media (orientation: landscape) {
16363 .messagebar-sheet-image,
16364 .messagebar-sheet-item {
16365 width: 95px;
16366 height: 95px;
16367 }
16368}
16369.messagebar-sheet-image .icon-checkbox,
16370.messagebar-sheet-item .icon-checkbox,
16371.messagebar-sheet-image .icon-radio,
16372.messagebar-sheet-item .icon-radio {
16373 position: absolute;
16374 right: 8px;
16375 bottom: 8px;
16376}
16377.messagebar-sheet-image {
16378 background-size: cover;
16379 background-position: center;
16380 background-repeat: no-repeat;
16381}
16382.messagebar-attachment-delete {
16383 display: block;
16384 position: absolute;
16385 border-radius: 50%;
16386 -webkit-box-sizing: border-box;
16387 box-sizing: border-box;
16388 cursor: pointer;
16389 -webkit-box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.2);
16390 box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.2);
16391}
16392.messagebar-attachment-delete:after,
16393.messagebar-attachment-delete:before {
16394 position: absolute;
16395 content: '';
16396 left: 50%;
16397 top: 50%;
16398}
16399.messagebar-attachment-delete:after {
16400 -webkit-transform: rotate(45deg);
16401 transform: rotate(45deg);
16402}
16403.messagebar-attachment-delete:before {
16404 -webkit-transform: rotate(-45deg);
16405 transform: rotate(-45deg);
16406}
16407.messagebar:not(.messagebar-sheet-visible) .messagebar-sheet {
16408 display: none;
16409}
16410.ios.device-iphone-x .messagebar:not(.messagebar-top),
16411.md.device-iphone-x .messagebar:not(.messagebar-top) {
16412 height: auto !important;
16413}
16414.ios.device-iphone-x .messagebar:not(.messagebar-top):not(.messagebar-sheet-visible),
16415.md.device-iphone-x .messagebar:not(.messagebar-top):not(.messagebar-sheet-visible) {
16416 padding-bottom: constant(safe-area-inset-bottom);
16417 padding-bottom: env(safe-area-inset-bottom);
16418}
16419.ios.device-iphone-x .messagebar-sheet,
16420.md.device-iphone-x .messagebar-sheet {
16421 padding-left: constant(safe-area-inset-left);
16422 padding-left: env(safe-area-inset-left);
16423 padding-right: constant(safe-area-inset-right);
16424 padding-right: env(safe-area-inset-right);
16425 padding-bottom: constant(safe-area-inset-bottom);
16426 padding-bottom: env(safe-area-inset-bottom);
16427}
16428.md .messagebar {
16429 font-size: 16px;
16430}
16431.md .messagebar:after {
16432 display: none;
16433}
16434.md .messagebar textarea {
16435 padding: 5px 8px;
16436 height: 32px;
16437 color: #333;
16438 font-size: 16px;
16439 line-height: 22px;
16440}
16441.md .messagebar a.link {
16442 color: #333;
16443}
16444.md .messagebar a.link:before {
16445 content: '';
16446 width: 152%;
16447 height: 152%;
16448 position: absolute;
16449 left: -26%;
16450 top: -26%;
16451 background-image: -webkit-radial-gradient(center, circle, rgba(0, 0, 0, 0.1) 66%, rgba(0, 0, 0, 0) 66%);
16452 background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0.1) 66%, rgba(0, 0, 0, 0) 66%);
16453 background-repeat: no-repeat;
16454 background-position: center;
16455 background-size: 100% 100%;
16456 opacity: 0;
16457 pointer-events: none;
16458 -webkit-transition-duration: 600ms;
16459 transition-duration: 600ms;
16460}
16461.md .messagebar a.link.active-state:before {
16462 opacity: 1;
16463 -webkit-transition-duration: 150ms;
16464 transition-duration: 150ms;
16465}
16466.md .messagebar:before {
16467 content: '';
16468 position: absolute;
16469 background-color: #d1d1d1;
16470 display: block;
16471 z-index: 15;
16472 top: 0;
16473 right: auto;
16474 bottom: auto;
16475 left: 0;
16476 height: 1px;
16477 width: 100%;
16478 -webkit-transform-origin: 50% 0%;
16479 transform-origin: 50% 0%;
16480}
16481.md.device-pixel-ratio-2 .messagebar:before {
16482 -webkit-transform: scaleY(0.5);
16483 transform: scaleY(0.5);
16484}
16485.md.device-pixel-ratio-3 .messagebar:before {
16486 -webkit-transform: scaleY(0.33);
16487 transform: scaleY(0.33);
16488}
16489.md .messagebar-attachments {
16490 padding: 8px;
16491 border-bottom: 1px solid #ddd;
16492}
16493.md .messagebar-area {
16494 margin-top: 8px;
16495 margin-bottom: 8px;
16496}
16497.md .messagebar-sheet {
16498 background: #fff;
16499}
16500.md .messagebar-sheet-image .icon-checkbox,
16501.md .messagebar-sheet-item .icon-checkbox {
16502 border-color: #fff;
16503 background: rgba(255, 255, 255, 0.25);
16504 -webkit-box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.5);
16505 box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.5);
16506}
16507.md .messagebar-attachment-delete {
16508 right: 8px;
16509 top: 8px;
16510 width: 24px;
16511 height: 24px;
16512 background: #2196f3;
16513 cursor: pointer;
16514 border-radius: 2px;
16515}
16516.md .messagebar-attachment-delete:after,
16517.md .messagebar-attachment-delete:before {
16518 width: 14px;
16519 height: 2px;
16520 background: #fff;
16521 margin-left: -7px;
16522 margin-top: -1px;
16523}
16524.md .theme-dark .messagebar,
16525.messagebar.md .theme-dark {
16526 background: #000;
16527}
16528.md .theme-dark .messagebar:before,
16529.messagebar.md .theme-dark:before {
16530 background-color: rgba(255, 255, 255, 0.2);
16531}
16532.md .theme-dark .messagebar a.link,
16533.messagebar.md .theme-dark a.link {
16534 color: rgba(255, 255, 255, 0.87);
16535}
16536.md .theme-dark .messagebar a.link:before,
16537.messagebar.md .theme-dark a.link:before {
16538 content: '';
16539 width: 152%;
16540 height: 152%;
16541 position: absolute;
16542 left: -26%;
16543 top: -26%;
16544 background-image: -webkit-radial-gradient(center, circle, rgba(255, 255, 255, 0.15) 66%, rgba(255, 255, 255, 0) 66%);
16545 background-image: radial-gradient(circle at center, rgba(255, 255, 255, 0.15) 66%, rgba(255, 255, 255, 0) 66%);
16546 background-repeat: no-repeat;
16547 background-position: center;
16548 background-size: 100% 100%;
16549 opacity: 0;
16550 pointer-events: none;
16551 -webkit-transition-duration: 600ms;
16552 transition-duration: 600ms;
16553}
16554.md .theme-dark .messagebar a.link.active-state:before,
16555.messagebar.md .theme-dark a.link.active-state:before {
16556 opacity: 1;
16557 -webkit-transition-duration: 150ms;
16558 transition-duration: 150ms;
16559}
16560.md .theme-dark .messagebar textarea,
16561.messagebar.md .theme-dark textarea {
16562 color: rgba(255, 255, 255, 0.87);
16563}
16564.md .theme-dark .messagebar-attachments {
16565 border-bottom-color: rgba(255, 255, 255, 0.2);
16566}
16567/* === Swiper === */
16568.swiper-container {
16569 margin: 0 auto;
16570 position: relative;
16571 overflow: hidden;
16572 list-style: none;
16573 padding: 0;
16574 /* Fix of Webkit flickering */
16575 z-index: 1;
16576}
16577.swiper-container-no-flexbox .swiper-slide {
16578 float: left;
16579}
16580.swiper-container-vertical > .swiper-wrapper {
16581 -webkit-box-orient: vertical;
16582 -webkit-box-direction: normal;
16583 -webkit-flex-direction: column;
16584 -ms-flex-direction: column;
16585 flex-direction: column;
16586}
16587.swiper-wrapper {
16588 position: relative;
16589 width: 100%;
16590 height: 100%;
16591 z-index: 1;
16592 display: -webkit-box;
16593 display: -webkit-flex;
16594 display: -ms-flexbox;
16595 display: flex;
16596 -webkit-transition-property: -webkit-transform;
16597 transition-property: -webkit-transform;
16598 transition-property: transform;
16599 transition-property: transform, -webkit-transform;
16600 -webkit-box-sizing: content-box;
16601 box-sizing: content-box;
16602}
16603.swiper-container-android .swiper-slide,
16604.swiper-wrapper {
16605 -webkit-transform: translate3d(0px, 0, 0);
16606 transform: translate3d(0px, 0, 0);
16607}
16608.swiper-container-multirow > .swiper-wrapper {
16609 -webkit-flex-wrap: wrap;
16610 -ms-flex-wrap: wrap;
16611 flex-wrap: wrap;
16612}
16613.swiper-container-free-mode > .swiper-wrapper {
16614 -webkit-transition-timing-function: ease-out;
16615 transition-timing-function: ease-out;
16616 margin: 0 auto;
16617}
16618.swiper-slide {
16619 -webkit-flex-shrink: 0;
16620 -ms-flex-negative: 0;
16621 flex-shrink: 0;
16622 width: 100%;
16623 height: 100%;
16624 position: relative;
16625 -webkit-transition-property: -webkit-transform;
16626 transition-property: -webkit-transform;
16627 transition-property: transform;
16628 transition-property: transform, -webkit-transform;
16629}
16630.swiper-slide-invisible-blank {
16631 visibility: hidden;
16632}
16633/* Auto Height */
16634.swiper-container-autoheight,
16635.swiper-container-autoheight .swiper-slide {
16636 height: auto;
16637}
16638.swiper-container-autoheight .swiper-wrapper {
16639 -webkit-box-align: start;
16640 -webkit-align-items: flex-start;
16641 -ms-flex-align: start;
16642 align-items: flex-start;
16643 -webkit-transition-property: height, -webkit-transform;
16644 transition-property: height, -webkit-transform;
16645 transition-property: transform, height;
16646 transition-property: transform, height, -webkit-transform;
16647}
16648/* 3D Effects */
16649.swiper-container-3d {
16650 -webkit-perspective: 1200px;
16651 perspective: 1200px;
16652}
16653.swiper-container-3d .swiper-wrapper,
16654.swiper-container-3d .swiper-slide,
16655.swiper-container-3d .swiper-slide-shadow-left,
16656.swiper-container-3d .swiper-slide-shadow-right,
16657.swiper-container-3d .swiper-slide-shadow-top,
16658.swiper-container-3d .swiper-slide-shadow-bottom,
16659.swiper-container-3d .swiper-cube-shadow {
16660 -webkit-transform-style: preserve-3d;
16661 transform-style: preserve-3d;
16662}
16663.swiper-container-3d .swiper-slide-shadow-left,
16664.swiper-container-3d .swiper-slide-shadow-right,
16665.swiper-container-3d .swiper-slide-shadow-top,
16666.swiper-container-3d .swiper-slide-shadow-bottom {
16667 position: absolute;
16668 left: 0;
16669 top: 0;
16670 width: 100%;
16671 height: 100%;
16672 pointer-events: none;
16673 z-index: 10;
16674}
16675.swiper-container-3d .swiper-slide-shadow-left {
16676 background-image: -webkit-gradient(linear, right top, left top, from(rgba(0, 0, 0, 0.5)), to(rgba(0, 0, 0, 0)));
16677 background-image: -webkit-linear-gradient(right, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
16678 background-image: linear-gradient(to left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
16679}
16680.swiper-container-3d .swiper-slide-shadow-right {
16681 background-image: -webkit-gradient(linear, left top, right top, from(rgba(0, 0, 0, 0.5)), to(rgba(0, 0, 0, 0)));
16682 background-image: -webkit-linear-gradient(left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
16683 background-image: linear-gradient(to right, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
16684}
16685.swiper-container-3d .swiper-slide-shadow-top {
16686 background-image: -webkit-gradient(linear, left bottom, left top, from(rgba(0, 0, 0, 0.5)), to(rgba(0, 0, 0, 0)));
16687 background-image: -webkit-linear-gradient(bottom, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
16688 background-image: linear-gradient(to top, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
16689}
16690.swiper-container-3d .swiper-slide-shadow-bottom {
16691 background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0.5)), to(rgba(0, 0, 0, 0)));
16692 background-image: -webkit-linear-gradient(top, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
16693 background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
16694}
16695/* IE10 Windows Phone 8 Fixes */
16696.swiper-container-wp8-horizontal,
16697.swiper-container-wp8-horizontal > .swiper-wrapper {
16698 -ms-touch-action: pan-y;
16699 touch-action: pan-y;
16700}
16701.swiper-container-wp8-vertical,
16702.swiper-container-wp8-vertical > .swiper-wrapper {
16703 -ms-touch-action: pan-x;
16704 touch-action: pan-x;
16705}
16706/* a11y */
16707.swiper-container .swiper-notification {
16708 position: absolute;
16709 left: 0;
16710 top: 0;
16711 pointer-events: none;
16712 opacity: 0;
16713 z-index: -1000;
16714}
16715.swiper-container-coverflow .swiper-wrapper {
16716 /* Windows 8 IE 10 fix */
16717 -ms-perspective: 1200px;
16718}
16719.swiper-container-cube {
16720 overflow: visible;
16721}
16722.swiper-container-cube .swiper-slide {
16723 pointer-events: none;
16724 -webkit-backface-visibility: hidden;
16725 backface-visibility: hidden;
16726 z-index: 1;
16727 visibility: hidden;
16728 -webkit-transform-origin: 0 0;
16729 transform-origin: 0 0;
16730 width: 100%;
16731 height: 100%;
16732}
16733.swiper-container-cube .swiper-slide .swiper-slide {
16734 pointer-events: none;
16735}
16736.swiper-container-cube.swiper-container-rtl .swiper-slide {
16737 -webkit-transform-origin: 100% 0;
16738 transform-origin: 100% 0;
16739}
16740.swiper-container-cube .swiper-slide-active,
16741.swiper-container-cube .swiper-slide-active .swiper-slide-active {
16742 pointer-events: auto;
16743}
16744.swiper-container-cube .swiper-slide-active,
16745.swiper-container-cube .swiper-slide-next,
16746.swiper-container-cube .swiper-slide-prev,
16747.swiper-container-cube .swiper-slide-next + .swiper-slide {
16748 pointer-events: auto;
16749 visibility: visible;
16750}
16751.swiper-container-cube .swiper-slide-shadow-top,
16752.swiper-container-cube .swiper-slide-shadow-bottom,
16753.swiper-container-cube .swiper-slide-shadow-left,
16754.swiper-container-cube .swiper-slide-shadow-right {
16755 z-index: 0;
16756 -webkit-backface-visibility: hidden;
16757 backface-visibility: hidden;
16758}
16759.swiper-container-cube .swiper-cube-shadow {
16760 position: absolute;
16761 left: 0;
16762 bottom: 0px;
16763 width: 100%;
16764 height: 100%;
16765 background: #000;
16766 opacity: 0.6;
16767 -webkit-filter: blur(50px);
16768 filter: blur(50px);
16769 z-index: 0;
16770}
16771.swiper-container-fade.swiper-container-free-mode .swiper-slide {
16772 -webkit-transition-timing-function: ease-out;
16773 transition-timing-function: ease-out;
16774}
16775.swiper-container-fade .swiper-slide {
16776 pointer-events: none;
16777 -webkit-transition-property: opacity;
16778 transition-property: opacity;
16779}
16780.swiper-container-fade .swiper-slide .swiper-slide {
16781 pointer-events: none;
16782}
16783.swiper-container-fade .swiper-slide-active,
16784.swiper-container-fade .swiper-slide-active .swiper-slide-active {
16785 pointer-events: auto;
16786}
16787.swiper-container-flip {
16788 overflow: visible;
16789}
16790.swiper-container-flip .swiper-slide {
16791 pointer-events: none;
16792 -webkit-backface-visibility: hidden;
16793 backface-visibility: hidden;
16794 z-index: 1;
16795}
16796.swiper-container-flip .swiper-slide .swiper-slide {
16797 pointer-events: none;
16798}
16799.swiper-container-flip .swiper-slide-active,
16800.swiper-container-flip .swiper-slide-active .swiper-slide-active {
16801 pointer-events: auto;
16802}
16803.swiper-container-flip .swiper-slide-shadow-top,
16804.swiper-container-flip .swiper-slide-shadow-bottom,
16805.swiper-container-flip .swiper-slide-shadow-left,
16806.swiper-container-flip .swiper-slide-shadow-right {
16807 z-index: 0;
16808 -webkit-backface-visibility: hidden;
16809 backface-visibility: hidden;
16810}
16811/* Scrollbar */
16812.swiper-scrollbar {
16813 border-radius: 10px;
16814 position: relative;
16815 -ms-touch-action: none;
16816 background: rgba(0, 0, 0, 0.1);
16817}
16818.swiper-container-horizontal > .swiper-scrollbar {
16819 position: absolute;
16820 left: 1%;
16821 bottom: 3px;
16822 z-index: 50;
16823 height: 5px;
16824 width: 98%;
16825}
16826.swiper-container-vertical > .swiper-scrollbar {
16827 position: absolute;
16828 right: 3px;
16829 top: 1%;
16830 z-index: 50;
16831 width: 5px;
16832 height: 98%;
16833}
16834.swiper-scrollbar-drag {
16835 height: 100%;
16836 width: 100%;
16837 position: relative;
16838 background: rgba(0, 0, 0, 0.5);
16839 border-radius: 10px;
16840 left: 0;
16841 top: 0;
16842}
16843.swiper-scrollbar-cursor-drag {
16844 cursor: move;
16845}
16846.swiper-scrollbar-lock {
16847 display: none;
16848}
16849.swiper-zoom-container {
16850 width: 100%;
16851 height: 100%;
16852 display: -webkit-box;
16853 display: -webkit-flex;
16854 display: -ms-flexbox;
16855 display: flex;
16856 -webkit-box-pack: center;
16857 -webkit-justify-content: center;
16858 -ms-flex-pack: center;
16859 justify-content: center;
16860 -webkit-box-align: center;
16861 -webkit-align-items: center;
16862 -ms-flex-align: center;
16863 align-items: center;
16864 text-align: center;
16865}
16866.swiper-zoom-container > img,
16867.swiper-zoom-container > svg,
16868.swiper-zoom-container > canvas {
16869 max-width: 100%;
16870 max-height: 100%;
16871 -o-object-fit: contain;
16872 object-fit: contain;
16873}
16874.swiper-slide-zoomed {
16875 cursor: move;
16876}
16877.swiper-button-prev,
16878.swiper-button-next {
16879 position: absolute;
16880 top: 50%;
16881 width: 27px;
16882 height: 44px;
16883 margin-top: -22px;
16884 z-index: 10;
16885 cursor: pointer;
16886 background-size: 27px 44px;
16887 background-position: center;
16888 background-repeat: no-repeat;
16889}
16890.swiper-button-prev.swiper-button-disabled,
16891.swiper-button-next.swiper-button-disabled {
16892 opacity: 0.35;
16893 cursor: auto;
16894 pointer-events: none;
16895}
16896.swiper-button-prev,
16897.swiper-container-rtl .swiper-button-next {
16898 left: 10px;
16899 right: auto;
16900}
16901.swiper-button-next,
16902.swiper-container-rtl .swiper-button-prev {
16903 right: 10px;
16904 left: auto;
16905}
16906.swiper-pagination {
16907 position: absolute;
16908 text-align: center;
16909 -webkit-transition: 300ms opacity;
16910 transition: 300ms opacity;
16911 -webkit-transform: translate3d(0, 0, 0);
16912 transform: translate3d(0, 0, 0);
16913 z-index: 10;
16914}
16915.swiper-pagination.swiper-pagination-hidden {
16916 opacity: 0;
16917}
16918.swiper-pagination-fraction,
16919.swiper-pagination-custom,
16920.swiper-container-horizontal > .swiper-pagination-bullets {
16921 bottom: 10px;
16922 left: 0;
16923 width: 100%;
16924}
16925.swiper-pagination-bullets-dynamic {
16926 overflow: hidden;
16927 font-size: 0;
16928}
16929.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
16930 -webkit-transform: scale(0.33);
16931 transform: scale(0.33);
16932 position: relative;
16933}
16934.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active {
16935 -webkit-transform: scale(1);
16936 transform: scale(1);
16937}
16938.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev {
16939 -webkit-transform: scale(0.66);
16940 transform: scale(0.66);
16941}
16942.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev-prev {
16943 -webkit-transform: scale(0.33);
16944 transform: scale(0.33);
16945}
16946.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next {
16947 -webkit-transform: scale(0.66);
16948 transform: scale(0.66);
16949}
16950.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next-next {
16951 -webkit-transform: scale(0.33);
16952 transform: scale(0.33);
16953}
16954.swiper-pagination-bullet {
16955 width: 8px;
16956 height: 8px;
16957 display: inline-block;
16958 border-radius: 100%;
16959 background: #000;
16960 opacity: 0.2;
16961}
16962button.swiper-pagination-bullet {
16963 border: none;
16964 margin: 0;
16965 padding: 0;
16966 -webkit-box-shadow: none;
16967 box-shadow: none;
16968 -webkit-appearance: none;
16969 -moz-appearance: none;
16970 appearance: none;
16971}
16972.swiper-pagination-clickable .swiper-pagination-bullet {
16973 cursor: pointer;
16974}
16975.swiper-pagination-bullet-active {
16976 opacity: 1;
16977}
16978.swiper-container-vertical > .swiper-pagination-bullets {
16979 right: 10px;
16980 top: 50%;
16981 -webkit-transform: translate3d(0px, -50%, 0);
16982 transform: translate3d(0px, -50%, 0);
16983}
16984.swiper-container-vertical > .swiper-pagination-bullets .swiper-pagination-bullet {
16985 margin: 6px 0;
16986 display: block;
16987}
16988.swiper-container-vertical > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic {
16989 top: 50%;
16990 -webkit-transform: translateY(-50%);
16991 transform: translateY(-50%);
16992 width: 8px;
16993}
16994.swiper-container-vertical > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
16995 display: inline-block;
16996 -webkit-transition: 200ms top, 200ms -webkit-transform;
16997 transition: 200ms top, 200ms -webkit-transform;
16998 transition: 200ms transform, 200ms top;
16999 transition: 200ms transform, 200ms top, 200ms -webkit-transform;
17000}
17001.swiper-container-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet {
17002 margin: 0 4px;
17003}
17004.swiper-container-horizontal > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic {
17005 left: 50%;
17006 -webkit-transform: translateX(-50%);
17007 transform: translateX(-50%);
17008 white-space: nowrap;
17009}
17010.swiper-container-horizontal > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
17011 -webkit-transition: 200ms left, 200ms -webkit-transform;
17012 transition: 200ms left, 200ms -webkit-transform;
17013 transition: 200ms transform, 200ms left;
17014 transition: 200ms transform, 200ms left, 200ms -webkit-transform;
17015}
17016.swiper-pagination-progressbar {
17017 background: rgba(0, 0, 0, 0.25);
17018 position: absolute;
17019}
17020.swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
17021 position: absolute;
17022 left: 0;
17023 top: 0;
17024 width: 100%;
17025 height: 100%;
17026 -webkit-transform: scale(0);
17027 transform: scale(0);
17028 -webkit-transform-origin: left top;
17029 transform-origin: left top;
17030}
17031.swiper-container-rtl .swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
17032 -webkit-transform-origin: right top;
17033 transform-origin: right top;
17034}
17035.swiper-container-horizontal > .swiper-pagination-progressbar,
17036.swiper-container-vertical > .swiper-pagination-progressbar.swiper-pagination-progressbar-opposite {
17037 width: 100%;
17038 height: 4px;
17039 left: 0;
17040 top: 0;
17041}
17042.swiper-container-vertical > .swiper-pagination-progressbar,
17043.swiper-container-horizontal > .swiper-pagination-progressbar.swiper-pagination-progressbar-opposite {
17044 width: 4px;
17045 height: 100%;
17046 left: 0;
17047 top: 0;
17048}
17049.swiper-lazy-preloader {
17050 position: absolute;
17051 left: 50%;
17052 top: 50%;
17053 z-index: 10;
17054}
17055.md .swiper-lazy-preloader {
17056 width: 32px;
17057 height: 32px;
17058 margin-left: -16px;
17059 margin-top: -16px;
17060}
17061.md .swiper-button-prev,
17062.md .swiper-container-rtl .swiper-button-next {
17063 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");
17064}
17065.md .swiper-button-next,
17066.md .swiper-container-rtl .swiper-button-prev {
17067 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");
17068}
17069.md .swiper-pagination-bullet-active {
17070 background: #2196f3;
17071}
17072.md .swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
17073 background: #2196f3;
17074}
17075.md .swiper-button-prev.color-red,
17076.md .swiper-container-rtl .swiper-button-next.color-red,
17077.md .color-theme-red .swiper-button-prev,
17078.md .color-theme-red .swiper-container-rtl .swiper-button-next {
17079 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");
17080}
17081.md .swiper-button-next.color-red,
17082.md .swiper-container-rtl .swiper-button-prev.color-red,
17083.md .color-theme-red .swiper-button-next,
17084.md .color-theme-red .swiper-container-rtl .swiper-button-prev {
17085 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");
17086}
17087.md .color-red .swiper-pagination-bullet-active,
17088.md .color-theme-red .swiper-pagination-bullet-active {
17089 background: #f44336;
17090}
17091.md .color-red .swiper-pagination-progressbar,
17092.md .color-theme-red .swiper-pagination-progressbar,
17093.md .color-red.swiper-pagination-progressbar,
17094.md .color-theme-red.swiper-pagination-progressbar {
17095 background: rgba(244, 67, 54, 0.25);
17096}
17097.md .color-red .swiper-pagination-progressbar .swiper-pagination-progressbar-fill,
17098.md .color-theme-red .swiper-pagination-progressbar .swiper-pagination-progressbar-fill,
17099.md .color-red.swiper-pagination-progressbar .swiper-pagination-progressbar-fill,
17100.md .color-theme-red.swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
17101 background: #f44336;
17102}
17103.md .swiper-button-prev.color-green,
17104.md .swiper-container-rtl .swiper-button-next.color-green,
17105.md .color-theme-green .swiper-button-prev,
17106.md .color-theme-green .swiper-container-rtl .swiper-button-next {
17107 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");
17108}
17109.md .swiper-button-next.color-green,
17110.md .swiper-container-rtl .swiper-button-prev.color-green,
17111.md .color-theme-green .swiper-button-next,
17112.md .color-theme-green .swiper-container-rtl .swiper-button-prev {
17113 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");
17114}
17115.md .color-green .swiper-pagination-bullet-active,
17116.md .color-theme-green .swiper-pagination-bullet-active {
17117 background: #4caf50;
17118}
17119.md .color-green .swiper-pagination-progressbar,
17120.md .color-theme-green .swiper-pagination-progressbar,
17121.md .color-green.swiper-pagination-progressbar,
17122.md .color-theme-green.swiper-pagination-progressbar {
17123 background: rgba(76, 175, 80, 0.25);
17124}
17125.md .color-green .swiper-pagination-progressbar .swiper-pagination-progressbar-fill,
17126.md .color-theme-green .swiper-pagination-progressbar .swiper-pagination-progressbar-fill,
17127.md .color-green.swiper-pagination-progressbar .swiper-pagination-progressbar-fill,
17128.md .color-theme-green.swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
17129 background: #4caf50;
17130}
17131.md .swiper-button-prev.color-blue,
17132.md .swiper-container-rtl .swiper-button-next.color-blue,
17133.md .color-theme-blue .swiper-button-prev,
17134.md .color-theme-blue .swiper-container-rtl .swiper-button-next {
17135 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");
17136}
17137.md .swiper-button-next.color-blue,
17138.md .swiper-container-rtl .swiper-button-prev.color-blue,
17139.md .color-theme-blue .swiper-button-next,
17140.md .color-theme-blue .swiper-container-rtl .swiper-button-prev {
17141 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");
17142}
17143.md .color-blue .swiper-pagination-bullet-active,
17144.md .color-theme-blue .swiper-pagination-bullet-active {
17145 background: #2196f3;
17146}
17147.md .color-blue .swiper-pagination-progressbar,
17148.md .color-theme-blue .swiper-pagination-progressbar,
17149.md .color-blue.swiper-pagination-progressbar,
17150.md .color-theme-blue.swiper-pagination-progressbar {
17151 background: rgba(33, 150, 243, 0.25);
17152}
17153.md .color-blue .swiper-pagination-progressbar .swiper-pagination-progressbar-fill,
17154.md .color-theme-blue .swiper-pagination-progressbar .swiper-pagination-progressbar-fill,
17155.md .color-blue.swiper-pagination-progressbar .swiper-pagination-progressbar-fill,
17156.md .color-theme-blue.swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
17157 background: #2196f3;
17158}
17159.md .swiper-button-prev.color-pink,
17160.md .swiper-container-rtl .swiper-button-next.color-pink,
17161.md .color-theme-pink .swiper-button-prev,
17162.md .color-theme-pink .swiper-container-rtl .swiper-button-next {
17163 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");
17164}
17165.md .swiper-button-next.color-pink,
17166.md .swiper-container-rtl .swiper-button-prev.color-pink,
17167.md .color-theme-pink .swiper-button-next,
17168.md .color-theme-pink .swiper-container-rtl .swiper-button-prev {
17169 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");
17170}
17171.md .color-pink .swiper-pagination-bullet-active,
17172.md .color-theme-pink .swiper-pagination-bullet-active {
17173 background: #e91e63;
17174}
17175.md .color-pink .swiper-pagination-progressbar,
17176.md .color-theme-pink .swiper-pagination-progressbar,
17177.md .color-pink.swiper-pagination-progressbar,
17178.md .color-theme-pink.swiper-pagination-progressbar {
17179 background: rgba(233, 30, 99, 0.25);
17180}
17181.md .color-pink .swiper-pagination-progressbar .swiper-pagination-progressbar-fill,
17182.md .color-theme-pink .swiper-pagination-progressbar .swiper-pagination-progressbar-fill,
17183.md .color-pink.swiper-pagination-progressbar .swiper-pagination-progressbar-fill,
17184.md .color-theme-pink.swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
17185 background: #e91e63;
17186}
17187.md .swiper-button-prev.color-yellow,
17188.md .swiper-container-rtl .swiper-button-next.color-yellow,
17189.md .color-theme-yellow .swiper-button-prev,
17190.md .color-theme-yellow .swiper-container-rtl .swiper-button-next {
17191 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");
17192}
17193.md .swiper-button-next.color-yellow,
17194.md .swiper-container-rtl .swiper-button-prev.color-yellow,
17195.md .color-theme-yellow .swiper-button-next,
17196.md .color-theme-yellow .swiper-container-rtl .swiper-button-prev {
17197 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");
17198}
17199.md .color-yellow .swiper-pagination-bullet-active,
17200.md .color-theme-yellow .swiper-pagination-bullet-active {
17201 background: #ffeb3b;
17202}
17203.md .color-yellow .swiper-pagination-progressbar,
17204.md .color-theme-yellow .swiper-pagination-progressbar,
17205.md .color-yellow.swiper-pagination-progressbar,
17206.md .color-theme-yellow.swiper-pagination-progressbar {
17207 background: rgba(255, 235, 59, 0.25);
17208}
17209.md .color-yellow .swiper-pagination-progressbar .swiper-pagination-progressbar-fill,
17210.md .color-theme-yellow .swiper-pagination-progressbar .swiper-pagination-progressbar-fill,
17211.md .color-yellow.swiper-pagination-progressbar .swiper-pagination-progressbar-fill,
17212.md .color-theme-yellow.swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
17213 background: #ffeb3b;
17214}
17215.md .swiper-button-prev.color-orange,
17216.md .swiper-container-rtl .swiper-button-next.color-orange,
17217.md .color-theme-orange .swiper-button-prev,
17218.md .color-theme-orange .swiper-container-rtl .swiper-button-next {
17219 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");
17220}
17221.md .swiper-button-next.color-orange,
17222.md .swiper-container-rtl .swiper-button-prev.color-orange,
17223.md .color-theme-orange .swiper-button-next,
17224.md .color-theme-orange .swiper-container-rtl .swiper-button-prev {
17225 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");
17226}
17227.md .color-orange .swiper-pagination-bullet-active,
17228.md .color-theme-orange .swiper-pagination-bullet-active {
17229 background: #ff9800;
17230}
17231.md .color-orange .swiper-pagination-progressbar,
17232.md .color-theme-orange .swiper-pagination-progressbar,
17233.md .color-orange.swiper-pagination-progressbar,
17234.md .color-theme-orange.swiper-pagination-progressbar {
17235 background: rgba(255, 152, 0, 0.25);
17236}
17237.md .color-orange .swiper-pagination-progressbar .swiper-pagination-progressbar-fill,
17238.md .color-theme-orange .swiper-pagination-progressbar .swiper-pagination-progressbar-fill,
17239.md .color-orange.swiper-pagination-progressbar .swiper-pagination-progressbar-fill,
17240.md .color-theme-orange.swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
17241 background: #ff9800;
17242}
17243.md .swiper-button-prev.color-gray,
17244.md .swiper-container-rtl .swiper-button-next.color-gray,
17245.md .color-theme-gray .swiper-button-prev,
17246.md .color-theme-gray .swiper-container-rtl .swiper-button-next {
17247 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");
17248}
17249.md .swiper-button-next.color-gray,
17250.md .swiper-container-rtl .swiper-button-prev.color-gray,
17251.md .color-theme-gray .swiper-button-next,
17252.md .color-theme-gray .swiper-container-rtl .swiper-button-prev {
17253 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");
17254}
17255.md .color-gray .swiper-pagination-bullet-active,
17256.md .color-theme-gray .swiper-pagination-bullet-active {
17257 background: #9e9e9e;
17258}
17259.md .color-gray .swiper-pagination-progressbar,
17260.md .color-theme-gray .swiper-pagination-progressbar,
17261.md .color-gray.swiper-pagination-progressbar,
17262.md .color-theme-gray.swiper-pagination-progressbar {
17263 background: rgba(158, 158, 158, 0.25);
17264}
17265.md .color-gray .swiper-pagination-progressbar .swiper-pagination-progressbar-fill,
17266.md .color-theme-gray .swiper-pagination-progressbar .swiper-pagination-progressbar-fill,
17267.md .color-gray.swiper-pagination-progressbar .swiper-pagination-progressbar-fill,
17268.md .color-theme-gray.swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
17269 background: #9e9e9e;
17270}
17271.md .swiper-button-prev.color-white,
17272.md .swiper-container-rtl .swiper-button-next.color-white,
17273.md .color-theme-white .swiper-button-prev,
17274.md .color-theme-white .swiper-container-rtl .swiper-button-next {
17275 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");
17276}
17277.md .swiper-button-next.color-white,
17278.md .swiper-container-rtl .swiper-button-prev.color-white,
17279.md .color-theme-white .swiper-button-next,
17280.md .color-theme-white .swiper-container-rtl .swiper-button-prev {
17281 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");
17282}
17283.md .color-white .swiper-pagination-bullet-active,
17284.md .color-theme-white .swiper-pagination-bullet-active {
17285 background: #ffffff;
17286}
17287.md .color-white .swiper-pagination-progressbar,
17288.md .color-theme-white .swiper-pagination-progressbar,
17289.md .color-white.swiper-pagination-progressbar,
17290.md .color-theme-white.swiper-pagination-progressbar {
17291 background: rgba(255, 255, 255, 0.25);
17292}
17293.md .color-white .swiper-pagination-progressbar .swiper-pagination-progressbar-fill,
17294.md .color-theme-white .swiper-pagination-progressbar .swiper-pagination-progressbar-fill,
17295.md .color-white.swiper-pagination-progressbar .swiper-pagination-progressbar-fill,
17296.md .color-theme-white.swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
17297 background: #ffffff;
17298}
17299.md .swiper-button-prev.color-black,
17300.md .swiper-container-rtl .swiper-button-next.color-black,
17301.md .color-theme-black .swiper-button-prev,
17302.md .color-theme-black .swiper-container-rtl .swiper-button-next {
17303 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");
17304}
17305.md .swiper-button-next.color-black,
17306.md .swiper-container-rtl .swiper-button-prev.color-black,
17307.md .color-theme-black .swiper-button-next,
17308.md .color-theme-black .swiper-container-rtl .swiper-button-prev {
17309 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");
17310}
17311.md .color-black .swiper-pagination-bullet-active,
17312.md .color-theme-black .swiper-pagination-bullet-active {
17313 background: #000000;
17314}
17315.md .color-black .swiper-pagination-progressbar,
17316.md .color-theme-black .swiper-pagination-progressbar,
17317.md .color-black.swiper-pagination-progressbar,
17318.md .color-theme-black.swiper-pagination-progressbar {
17319 background: rgba(0, 0, 0, 0.25);
17320}
17321.md .color-black .swiper-pagination-progressbar .swiper-pagination-progressbar-fill,
17322.md .color-theme-black .swiper-pagination-progressbar .swiper-pagination-progressbar-fill,
17323.md .color-black.swiper-pagination-progressbar .swiper-pagination-progressbar-fill,
17324.md .color-theme-black.swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
17325 background: #000000;
17326}
17327/* === Photo Browser === */
17328.photo-browser {
17329 position: absolute;
17330 left: 0;
17331 top: 0;
17332 width: 100%;
17333 height: 100%;
17334 z-index: 400;
17335}
17336.photo-browser-standalone.modal-in {
17337 -webkit-transition-duration: 0ms;
17338 transition-duration: 0ms;
17339 -webkit-animation: photo-browser-in 400ms;
17340 animation: photo-browser-in 400ms;
17341}
17342.photo-browser-standalone.modal-out {
17343 -webkit-transition-duration: 0ms;
17344 transition-duration: 0ms;
17345 -webkit-animation: photo-browser-out 400ms;
17346 animation: photo-browser-out 400ms;
17347}
17348.photo-browser-standalone.modal-out.swipe-close-to-bottom,
17349.photo-browser-standalone.modal-out.swipe-close-to-top {
17350 -webkit-animation: none;
17351 animation: none;
17352}
17353.photo-browser-popup.modal-out.swipe-close-to-bottom,
17354.photo-browser-popup.modal-out.swipe-close-to-top {
17355 -webkit-transition-duration: 300ms;
17356 transition-duration: 300ms;
17357}
17358.photo-browser-popup.modal-out.swipe-close-to-bottom {
17359 -webkit-transform: translate3d(0, 100%, 0);
17360 transform: translate3d(0, 100%, 0);
17361}
17362.photo-browser-popup.modal-out.swipe-close-to-top {
17363 -webkit-transform: translate3d(0, -100vh, 0);
17364 transform: translate3d(0, -100vh, 0);
17365}
17366.page.photo-browser-page {
17367 background: none;
17368}
17369.photo-browser-popup {
17370 background: none;
17371}
17372.photo-browser-exposed .navbar,
17373.photo-browser-exposed .toolbar {
17374 opacity: 0;
17375 visibility: hidden;
17376 pointer-events: none;
17377}
17378.photo-browser-exposed .photo-browser-swiper-container {
17379 background: #000;
17380}
17381.photo-browser-of {
17382 margin: 0 5px;
17383}
17384.photo-browser-captions {
17385 pointer-events: none;
17386 position: absolute;
17387 left: 0;
17388 width: 100%;
17389 bottom: 0;
17390 z-index: 10;
17391 opacity: 1;
17392 -webkit-transition: 400ms;
17393 transition: 400ms;
17394}
17395.photo-browser-captions.photo-browser-captions-exposed {
17396 opacity: 0;
17397}
17398.photo-browser-caption {
17399 -webkit-box-sizing: border-box;
17400 box-sizing: border-box;
17401 -webkit-transition: 300ms;
17402 transition: 300ms;
17403 position: absolute;
17404 bottom: 0;
17405 left: 0;
17406 opacity: 0;
17407 padding: 4px 5px;
17408 width: 100%;
17409 text-align: center;
17410 color: #fff;
17411 background: rgba(0, 0, 0, 0.8);
17412}
17413.photo-browser-caption:empty {
17414 display: none;
17415}
17416.photo-browser-caption.photo-browser-caption-active {
17417 opacity: 1;
17418}
17419.photo-browser-captions-light .photo-browser-caption {
17420 background: rgba(255, 255, 255, 0.8);
17421 color: #000;
17422}
17423.photo-browser-captions-dark .photo-browser-caption {
17424 color: #fff;
17425}
17426.photo-browser-exposed .photo-browser-caption {
17427 color: #fff;
17428 background: rgba(0, 0, 0, 0.8);
17429}
17430.photo-browser-swiper-container {
17431 position: absolute;
17432 left: 0;
17433 top: 0;
17434 width: 100%;
17435 height: 100%;
17436 overflow: hidden;
17437 background: #fff;
17438 -webkit-transition: 400ms;
17439 transition: 400ms;
17440 -webkit-transition-property: background-color;
17441 transition-property: background-color;
17442}
17443.photo-browser-prev.swiper-button-disabled,
17444.photo-browser-next.swiper-button-disabled {
17445 opacity: 0.3;
17446}
17447.photo-browser-slide {
17448 width: 100%;
17449 height: 100%;
17450 position: relative;
17451 overflow: hidden;
17452 display: -webkit-box;
17453 display: -webkit-flex;
17454 display: -ms-flexbox;
17455 display: flex;
17456 -webkit-box-pack: center;
17457 -webkit-justify-content: center;
17458 -ms-flex-pack: center;
17459 justify-content: center;
17460 -webkit-box-align: center;
17461 -webkit-align-items: center;
17462 -ms-flex-align: center;
17463 align-items: center;
17464 -webkit-flex-shrink: 0;
17465 -ms-flex-negative: 0;
17466 flex-shrink: 0;
17467 -webkit-box-sizing: border-box;
17468 box-sizing: border-box;
17469}
17470.photo-browser-slide.photo-browser-transitioning {
17471 -webkit-transition: 400ms;
17472 transition: 400ms;
17473 -webkit-transition-property: -webkit-transform;
17474 transition-property: -webkit-transform;
17475 transition-property: transform;
17476 transition-property: transform, -webkit-transform;
17477}
17478.photo-browser-slide span.swiper-zoom-container {
17479 display: none;
17480}
17481.photo-browser-slide img {
17482 width: auto;
17483 height: auto;
17484 max-width: 100%;
17485 max-height: 100%;
17486 display: none;
17487}
17488.photo-browser-slide.swiper-slide-active span.swiper-zoom-container,
17489.photo-browser-slide.swiper-slide-next span.swiper-zoom-container,
17490.photo-browser-slide.swiper-slide-prev span.swiper-zoom-container {
17491 display: -webkit-box;
17492 display: -webkit-flex;
17493 display: -ms-flexbox;
17494 display: flex;
17495}
17496.photo-browser-slide.swiper-slide-active img,
17497.photo-browser-slide.swiper-slide-next img,
17498.photo-browser-slide.swiper-slide-prev img {
17499 display: inline;
17500}
17501.photo-browser-slide.swiper-slide-active.photo-browser-slide-lazy .preloader,
17502.photo-browser-slide.swiper-slide-next.photo-browser-slide-lazy .preloader,
17503.photo-browser-slide.swiper-slide-prev.photo-browser-slide-lazy .preloader {
17504 display: block;
17505}
17506.photo-browser-slide iframe {
17507 width: 100%;
17508 height: 100%;
17509}
17510.photo-browser-slide .preloader {
17511 display: none;
17512 position: absolute;
17513 width: 42px;
17514 height: 42px;
17515 margin-left: -21px;
17516 margin-top: -21px;
17517 left: 50%;
17518 top: 50%;
17519}
17520.photo-browser-dark .photo-browser-swiper-container,
17521.photo-browser-page-dark .photo-browser-swiper-container {
17522 background: #000;
17523}
17524@-webkit-keyframes photo-browser-in {
17525 0% {
17526 -webkit-transform: translate3d(0, 0, 0) scale(0.5);
17527 transform: translate3d(0, 0, 0) scale(0.5);
17528 opacity: 0;
17529 }
17530 50% {
17531 -webkit-transform: translate3d(0, 0, 0) scale(1.05);
17532 transform: translate3d(0, 0, 0) scale(1.05);
17533 opacity: 1;
17534 }
17535 100% {
17536 -webkit-transform: translate3d(0, 0, 0) scale(1);
17537 transform: translate3d(0, 0, 0) scale(1);
17538 opacity: 1;
17539 }
17540}
17541@keyframes photo-browser-in {
17542 0% {
17543 -webkit-transform: translate3d(0, 0, 0) scale(0.5);
17544 transform: translate3d(0, 0, 0) scale(0.5);
17545 opacity: 0;
17546 }
17547 50% {
17548 -webkit-transform: translate3d(0, 0, 0) scale(1.05);
17549 transform: translate3d(0, 0, 0) scale(1.05);
17550 opacity: 1;
17551 }
17552 100% {
17553 -webkit-transform: translate3d(0, 0, 0) scale(1);
17554 transform: translate3d(0, 0, 0) scale(1);
17555 opacity: 1;
17556 }
17557}
17558@-webkit-keyframes photo-browser-out {
17559 0% {
17560 -webkit-transform: translate3d(0, 0, 0) scale(1);
17561 transform: translate3d(0, 0, 0) scale(1);
17562 opacity: 1;
17563 }
17564 50% {
17565 -webkit-transform: translate3d(0, 0, 0) scale(1.05);
17566 transform: translate3d(0, 0, 0) scale(1.05);
17567 opacity: 1;
17568 }
17569 100% {
17570 -webkit-transform: translate3d(0, 0, 0) scale(0.5);
17571 transform: translate3d(0, 0, 0) scale(0.5);
17572 opacity: 0;
17573 }
17574}
17575@keyframes photo-browser-out {
17576 0% {
17577 -webkit-transform: translate3d(0, 0, 0) scale(1);
17578 transform: translate3d(0, 0, 0) scale(1);
17579 opacity: 1;
17580 }
17581 50% {
17582 -webkit-transform: translate3d(0, 0, 0) scale(1.05);
17583 transform: translate3d(0, 0, 0) scale(1.05);
17584 opacity: 1;
17585 }
17586 100% {
17587 -webkit-transform: translate3d(0, 0, 0) scale(0.5);
17588 transform: translate3d(0, 0, 0) scale(0.5);
17589 opacity: 0;
17590 }
17591}
17592.md .toolbar ~ .photo-browser-captions {
17593 bottom: 48px;
17594 -webkit-transform: translate3d(0, 0px, 0);
17595 transform: translate3d(0, 0px, 0);
17596}
17597.md .toolbar ~ .photo-browser-captions.photo-browser-captions-exposed {
17598 -webkit-transform: translate3d(0, 0px, 0);
17599 transform: translate3d(0, 0px, 0);
17600}
17601.md .photo-browser-exposed .toolbar ~ .photo-browser-captions {
17602 -webkit-transform: translate3d(0, 48px, 0);
17603 transform: translate3d(0, 48px, 0);
17604}
17605.md .photo-browser-page .toolbar {
17606 -webkit-transform: none;
17607 transform: none;
17608}
17609.md .photo-browser-page .navbar,
17610.md .photo-browser-page .toolbar {
17611 background: rgba(33, 150, 243, 0.95);
17612 -webkit-transition: 400ms;
17613 transition: 400ms;
17614}
17615.md .photo-browser-dark .navbar,
17616.md .photo-browser-page-dark .navbar,
17617.md .photo-browser-dark .toolbar,
17618.md .photo-browser-page-dark .toolbar {
17619 background: rgba(30, 30, 30, 0.8) !important;
17620 color: #fff;
17621}
17622.md .photo-browser-dark .navbar a,
17623.md .photo-browser-page-dark .navbar a,
17624.md .photo-browser-dark .toolbar a,
17625.md .photo-browser-page-dark .toolbar a {
17626 color: #fff;
17627}
17628.md .color-theme-red .photo-browser-page:not(.photo-browser-page-dark) .navbar,
17629.md .color-red .photo-browser-page:not(.photo-browser-page-dark) .navbar,
17630.md .color-theme-red .photo-browser-page:not(.photo-browser-page-dark) .toolbar,
17631.md .color-red .photo-browser-page:not(.photo-browser-page-dark) .toolbar {
17632 background-color: rgba(244, 67, 54, 0.95);
17633}
17634.md .color-theme-green .photo-browser-page:not(.photo-browser-page-dark) .navbar,
17635.md .color-green .photo-browser-page:not(.photo-browser-page-dark) .navbar,
17636.md .color-theme-green .photo-browser-page:not(.photo-browser-page-dark) .toolbar,
17637.md .color-green .photo-browser-page:not(.photo-browser-page-dark) .toolbar {
17638 background-color: rgba(76, 175, 80, 0.95);
17639}
17640.md .color-theme-blue .photo-browser-page:not(.photo-browser-page-dark) .navbar,
17641.md .color-blue .photo-browser-page:not(.photo-browser-page-dark) .navbar,
17642.md .color-theme-blue .photo-browser-page:not(.photo-browser-page-dark) .toolbar,
17643.md .color-blue .photo-browser-page:not(.photo-browser-page-dark) .toolbar {
17644 background-color: rgba(33, 150, 243, 0.95);
17645}
17646.md .color-theme-pink .photo-browser-page:not(.photo-browser-page-dark) .navbar,
17647.md .color-pink .photo-browser-page:not(.photo-browser-page-dark) .navbar,
17648.md .color-theme-pink .photo-browser-page:not(.photo-browser-page-dark) .toolbar,
17649.md .color-pink .photo-browser-page:not(.photo-browser-page-dark) .toolbar {
17650 background-color: rgba(233, 30, 99, 0.95);
17651}
17652.md .color-theme-yellow .photo-browser-page:not(.photo-browser-page-dark) .navbar,
17653.md .color-yellow .photo-browser-page:not(.photo-browser-page-dark) .navbar,
17654.md .color-theme-yellow .photo-browser-page:not(.photo-browser-page-dark) .toolbar,
17655.md .color-yellow .photo-browser-page:not(.photo-browser-page-dark) .toolbar {
17656 background-color: rgba(255, 235, 59, 0.95);
17657}
17658.md .color-theme-orange .photo-browser-page:not(.photo-browser-page-dark) .navbar,
17659.md .color-orange .photo-browser-page:not(.photo-browser-page-dark) .navbar,
17660.md .color-theme-orange .photo-browser-page:not(.photo-browser-page-dark) .toolbar,
17661.md .color-orange .photo-browser-page:not(.photo-browser-page-dark) .toolbar {
17662 background-color: rgba(255, 152, 0, 0.95);
17663}
17664.md .color-theme-gray .photo-browser-page:not(.photo-browser-page-dark) .navbar,
17665.md .color-gray .photo-browser-page:not(.photo-browser-page-dark) .navbar,
17666.md .color-theme-gray .photo-browser-page:not(.photo-browser-page-dark) .toolbar,
17667.md .color-gray .photo-browser-page:not(.photo-browser-page-dark) .toolbar {
17668 background-color: rgba(158, 158, 158, 0.95);
17669}
17670.md .color-theme-white .photo-browser-page:not(.photo-browser-page-dark) .navbar,
17671.md .color-white .photo-browser-page:not(.photo-browser-page-dark) .navbar,
17672.md .color-theme-white .photo-browser-page:not(.photo-browser-page-dark) .toolbar,
17673.md .color-white .photo-browser-page:not(.photo-browser-page-dark) .toolbar {
17674 background-color: rgba(255, 255, 255, 0.95);
17675}
17676.md .color-theme-black .photo-browser-page:not(.photo-browser-page-dark) .navbar,
17677.md .color-black .photo-browser-page:not(.photo-browser-page-dark) .navbar,
17678.md .color-theme-black .photo-browser-page:not(.photo-browser-page-dark) .toolbar,
17679.md .color-black .photo-browser-page:not(.photo-browser-page-dark) .toolbar {
17680 background-color: rgba(0, 0, 0, 0.95);
17681}
17682.md.device-iphone-x .photo-browser-captions {
17683 bottom: constant(safe-area-inset-bottom);
17684 bottom: env(safe-area-inset-bottom);
17685}
17686.md.device-iphone-x .toolbar ~ .photo-browser-captions {
17687 bottom: calc(48px + constant(safe-area-inset-bottom));
17688 bottom: calc(48px + env(safe-area-inset-bottom));
17689}
17690/* === Notifications === */
17691.notification {
17692 position: absolute;
17693 left: 0;
17694 top: 0;
17695 width: 100%;
17696 z-index: 20000;
17697 font-size: 14px;
17698 margin: 0;
17699 border: none;
17700 display: none;
17701 -webkit-box-sizing: border-box;
17702 box-sizing: border-box;
17703 -webkit-transition-property: -webkit-transform;
17704 transition-property: -webkit-transform;
17705 transition-property: transform;
17706 transition-property: transform, -webkit-transform;
17707 direction: ltr;
17708}
17709.notification-icon {
17710 font-size: 0;
17711}
17712.notification-header {
17713 display: -webkit-box;
17714 display: -webkit-flex;
17715 display: -ms-flexbox;
17716 display: flex;
17717 -webkit-box-pack: start;
17718 -webkit-justify-content: flex-start;
17719 -ms-flex-pack: start;
17720 justify-content: flex-start;
17721 -webkit-box-align: center;
17722 -webkit-align-items: center;
17723 -ms-flex-align: center;
17724 align-items: center;
17725}
17726.notification-close-button {
17727 margin-left: auto;
17728 cursor: pointer;
17729}
17730html.with-statusbar.device-ios .notification,
17731html.with-statusbar.ios:not(.device-ios):not(.device-android) .notification {
17732 margin-top: 20px;
17733}
17734html.with-statusbar.device-android .notification,
17735html.with-statusbar.md:not(.device-ios):not(.device-android) .notification {
17736 margin-top: 24px;
17737}
17738html.with-statusbar.device-iphone-x .notification {
17739 margin-top: constant(safe-area-inset-top);
17740 margin-top: env(safe-area-inset-top);
17741}
17742.md .notification {
17743 left: 0;
17744 top: 0;
17745 width: 100%;
17746 background: #fff;
17747 border-radius: 0px;
17748 -webkit-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.22), 0 1px 2px rgba(0, 0, 0, 0.24);
17749 box-shadow: 0 2px 4px rgba(0, 0, 0, 0.22), 0 1px 2px rgba(0, 0, 0, 0.24);
17750 padding: 16px;
17751 color: #000;
17752 max-width: 568px;
17753}
17754@media (min-width: 568px) {
17755 .md .notification {
17756 left: 50%;
17757 margin-left: -284px;
17758 }
17759}
17760.md .notification.modal-in {
17761 -webkit-transition-duration: 0ms;
17762 transition-duration: 0ms;
17763 -webkit-animation: notification-md-in 400ms ease-out;
17764 animation: notification-md-in 400ms ease-out;
17765}
17766.md .notification.modal-in.notification-transitioning {
17767 -webkit-transition-duration: 200ms;
17768 transition-duration: 200ms;
17769}
17770.md .notification.modal-out {
17771 -webkit-animation: none;
17772 animation: none;
17773 -webkit-transition-duration: 200ms;
17774 transition-duration: 200ms;
17775 -webkit-transition-timing-function: ease-in;
17776 transition-timing-function: ease-in;
17777 -webkit-transform: translate3d(0, -150%, 0);
17778 transform: translate3d(0, -150%, 0);
17779}
17780.md .notification-icon {
17781 width: 16px;
17782 height: 16px;
17783 margin-right: 8px;
17784 line-height: 16px;
17785}
17786.md .notification-icon i {
17787 width: 16px;
17788 height: 16px;
17789 font-size: 16px;
17790}
17791.md .notification-title {
17792 font-size: 12px;
17793 line-height: 1;
17794 color: #2196f3;
17795}
17796.md .notification-subtitle {
17797 font-size: 14px;
17798 line-height: 1.35;
17799 color: #212121;
17800}
17801.md .notification-subtitle + .notification-text {
17802 margin-top: 2px;
17803}
17804.md .notification-text {
17805 font-size: 14px;
17806 line-height: 1.35;
17807 color: #757575;
17808}
17809.md .notification-header + .notification-content {
17810 margin-top: 6px;
17811}
17812.md .notification-title-right-text {
17813 font-size: 12px;
17814 color: #757575;
17815 margin-left: 4px;
17816}
17817.md .notification-title-right-text:before {
17818 content: '';
17819 width: 3px;
17820 height: 3px;
17821 border-radius: 50%;
17822 display: inline-block;
17823 vertical-align: middle;
17824 margin-right: 4px;
17825 background: #757575;
17826}
17827.md .notification-close-button {
17828 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");
17829 width: 16px;
17830 height: 16px;
17831 background-position: center top;
17832 background-repeat: no-repeat;
17833 background-size: 100% auto;
17834 position: relative;
17835 -webkit-transition-duration: 300ms;
17836 transition-duration: 300ms;
17837}
17838.md .notification-close-button:before {
17839 content: '';
17840 width: 152%;
17841 height: 152%;
17842 position: absolute;
17843 left: -26%;
17844 top: -26%;
17845 background-image: -webkit-radial-gradient(center, circle, rgba(0, 0, 0, 0.1) 66%, rgba(0, 0, 0, 0) 66%);
17846 background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0.1) 66%, rgba(0, 0, 0, 0) 66%);
17847 background-repeat: no-repeat;
17848 background-position: center;
17849 background-size: 100% 100%;
17850 opacity: 0;
17851 pointer-events: none;
17852 -webkit-transition-duration: 600ms;
17853 transition-duration: 600ms;
17854}
17855.md .notification-close-button.active-state:before {
17856 opacity: 1;
17857 -webkit-transition-duration: 150ms;
17858 transition-duration: 150ms;
17859}
17860.md .notification-close-button:before {
17861 width: 48px;
17862 height: 48px;
17863 left: 50%;
17864 top: 50%;
17865 margin-left: -24px;
17866 margin-top: -24px;
17867}
17868.md .notification-close-button:after {
17869 content: '';
17870 position: absolute;
17871 left: 50%;
17872 top: 50%;
17873 width: 48px;
17874 height: 48px;
17875 margin-left: -22px;
17876 margin-top: -22px;
17877}
17878@-webkit-keyframes notification-md-in {
17879 0% {
17880 -webkit-transform: translate3d(0, -150%, 0);
17881 transform: translate3d(0, -150%, 0);
17882 }
17883 50% {
17884 -webkit-transform: translate3d(0, 10%, 0);
17885 transform: translate3d(0, 10%, 0);
17886 }
17887 100% {
17888 -webkit-transform: translate3d(0, 0%, 0);
17889 transform: translate3d(0, 0%, 0);
17890 }
17891}
17892@keyframes notification-md-in {
17893 0% {
17894 -webkit-transform: translate3d(0, -150%, 0);
17895 transform: translate3d(0, -150%, 0);
17896 }
17897 50% {
17898 -webkit-transform: translate3d(0, 10%, 0);
17899 transform: translate3d(0, 10%, 0);
17900 }
17901 100% {
17902 -webkit-transform: translate3d(0, 0%, 0);
17903 transform: translate3d(0, 0%, 0);
17904 }
17905}
17906/* === Autocomplete === */
17907.autocomplete-page .autocomplete-found {
17908 display: block;
17909}
17910.autocomplete-page .autocomplete-not-found {
17911 display: none;
17912}
17913.autocomplete-page .autocomplete-values {
17914 display: block;
17915}
17916.autocomplete-page .list ul:empty {
17917 display: none;
17918}
17919.autocomplete-preloader:not(.autocomplete-preloader-visible) {
17920 visibility: hidden;
17921}
17922.autocomplete-preloader:not(.autocomplete-preloader-visible),
17923.autocomplete-preloader:not(.autocomplete-preloader-visible) * {
17924 -webkit-animation: none;
17925 animation: none;
17926}
17927.autocomplete-dropdown {
17928 background: #fff;
17929 -webkit-box-sizing: border-box;
17930 box-sizing: border-box;
17931 position: absolute;
17932 z-index: 500;
17933 width: 100%;
17934 right: 0;
17935}
17936.autocomplete-dropdown .autocomplete-dropdown-inner {
17937 position: relative;
17938 overflow: auto;
17939 -webkit-overflow-scrolling: touch;
17940 height: 100%;
17941 z-index: 1;
17942}
17943.autocomplete-dropdown .autocomplete-preloader {
17944 display: none;
17945 position: absolute;
17946 bottom: 100%;
17947 width: 20px;
17948 height: 20px;
17949}
17950.autocomplete-dropdown .autocomplete-preloader-visible {
17951 display: block;
17952}
17953.autocomplete-dropdown .autocomplete-dropdown-placeholder {
17954 color: #a9a9a9;
17955}
17956.autocomplete-dropdown .list {
17957 margin: 0;
17958}
17959.autocomplete-dropdown .list ul {
17960 background: none !important;
17961}
17962.autocomplete-dropdown .list ul:before {
17963 display: none !important;
17964}
17965.autocomplete-dropdown .list ul:after {
17966 display: none !important;
17967}
17968.list .item-content-dropdown-expanded .item-title.item-label {
17969 width: 0;
17970 -webkit-flex-shrink: 10;
17971 -ms-flex-negative: 10;
17972 flex-shrink: 10;
17973 overflow: hidden;
17974}
17975.list .item-content-dropdown-expanded .item-title.item-label + .item-input-wrap {
17976 margin-right: 0;
17977}
17978.list .item-content-dropdown-expanded .item-input-wrap {
17979 width: 100%;
17980}
17981.md .autocomplete-page .navbar .autocomplete-preloader {
17982 margin-left: 16px;
17983}
17984.md .autocomplete-dropdown {
17985 -webkit-box-shadow: 0 2px 2px rgba(0, 0, 0, 0.25);
17986 box-shadow: 0 2px 2px rgba(0, 0, 0, 0.25);
17987}
17988.md .autocomplete-dropdown .autocomplete-preloader {
17989 left: 16px;
17990 margin-bottom: 8px;
17991}
17992.md .autocomplete-dropdown .autocomplete-preloader .preloader-inner-gap,
17993.md .autocomplete-dropdown .autocomplete-preloader .preloader-inner-half-circle {
17994 border-width: 3px;
17995}
17996.md .autocomplete-dropdown .list {
17997 color: rgba(0, 0, 0, 0.54);
17998}
17999.md .autocomplete-dropdown .list b {
18000 font-weight: normal;
18001 color: #212121;
18002}
18003.md .searchbar-input-wrap .autocomplete-dropdown .item-content {
18004 padding-right: 73px;
18005}
18006.md .searchbar-input-wrap .autocomplete-dropdown li:last-child {
18007 border-radius: 0 0 8px 8px;
18008 position: relative;
18009 overflow: hidden;
18010}
18011.md .searchbar-input-wrap .autocomplete-dropdown .autocomplete-dropdown-placeholder {
18012 color: #939398;
18013}
18014/* === Tooltip === */
18015.tooltip {
18016 position: absolute;
18017 z-index: 20000;
18018 background: rgba(0, 0, 0, 0.87);
18019 border-radius: 4px;
18020 padding: 8px 16px;
18021 color: #fff;
18022 font-size: 14px;
18023 -webkit-box-sizing: border-box;
18024 box-sizing: border-box;
18025 line-height: 1.2;
18026 opacity: 0;
18027 -webkit-transform: scale(0.9);
18028 transform: scale(0.9);
18029 -webkit-transition-duration: 150ms;
18030 transition-duration: 150ms;
18031 -webkit-transition-property: opacity, -webkit-transform;
18032 transition-property: opacity, -webkit-transform;
18033 transition-property: opacity, transform;
18034 transition-property: opacity, transform, -webkit-transform;
18035 z-index: 99000;
18036 font-weight: 500;
18037}
18038.tooltip.tooltip-in {
18039 -webkit-transform: scale(1);
18040 transform: scale(1);
18041 opacity: 1;
18042}
18043.tooltip.tooltip-out {
18044 opacity: 0;
18045 -webkit-transform: scale(1);
18046 transform: scale(1);
18047}
18048.device-desktop .tooltip {
18049 font-size: 12px;
18050 padding: 6px 8px;
18051}
18052/* === Gauge === */
18053.gauge {
18054 position: relative;
18055 text-align: center;
18056 margin-left: auto;
18057 margin-right: auto;
18058 display: inline-block;
18059}
18060.gauge-svg,
18061.gauge svg {
18062 max-width: 100%;
18063 height: auto;
18064}
18065.gauge-svg circle,
18066.gauge svg circle,
18067.gauge-svg path,
18068.gauge svg path {
18069 -webkit-transition-duration: 400ms;
18070 transition-duration: 400ms;
18071}
18072iframe#viAd {
18073 z-index: 12900 !important;
18074 background: #000 !important;
18075}
18076.vi-overlay {
18077 background: rgba(0, 0, 0, 0.85);
18078 z-index: 13100;
18079 position: absolute;
18080 left: 0%;
18081 top: 0%;
18082 width: 100%;
18083 height: 100%;
18084 border-radius: 3px;
18085 display: -webkit-box;
18086 display: -webkit-flex;
18087 display: -ms-flexbox;
18088 display: flex;
18089 -webkit-box-pack: center;
18090 -webkit-justify-content: center;
18091 -ms-flex-pack: center;
18092 justify-content: center;
18093 -webkit-box-orient: vertical;
18094 -webkit-box-direction: normal;
18095 -webkit-flex-direction: column;
18096 -ms-flex-direction: column;
18097 flex-direction: column;
18098 -webkit-box-align: center;
18099 -webkit-align-items: center;
18100 -ms-flex-align: center;
18101 align-items: center;
18102 -webkit-align-content: center;
18103 -ms-flex-line-pack: center;
18104 align-content: center;
18105 text-align: center;
18106 -webkit-user-select: none;
18107 -moz-user-select: none;
18108 -ms-user-select: none;
18109 user-select: none;
18110}
18111@supports ((-webkit-backdrop-filter: blur(10px)) or (backdrop-filter: blur(10px))) {
18112 .vi-overlay {
18113 background: rgba(0, 0, 0, 0.65);
18114 -webkit-backdrop-filter: blur(10px);
18115 backdrop-filter: blur(10px);
18116 }
18117}
18118.vi-overlay .vi-overlay-text {
18119 text-align: center;
18120 color: #fff;
18121 max-width: 80%;
18122}
18123.vi-overlay .vi-overlay-text + .vi-overlay-play-button {
18124 margin-top: 15px;
18125}
18126.vi-overlay .vi-overlay-play-button {
18127 width: 44px;
18128 height: 44px;
18129 border-radius: 50%;
18130 border: 2px solid #fff;
18131 position: relative;
18132}
18133.vi-overlay .vi-overlay-play-button.active-state {
18134 opacity: 0.55;
18135}
18136.vi-overlay .vi-overlay-play-button:before {
18137 content: '';
18138 width: 0;
18139 height: 0;
18140 border-top: 8px solid transparent;
18141 border-bottom: 8px solid transparent;
18142 border-left: 14px solid #fff;
18143 position: absolute;
18144 left: 50%;
18145 top: 50%;
18146 margin-left: 2px;
18147 -webkit-transform: translate(-50%, -50%);
18148 transform: translate(-50%, -50%);
18149}
18150/* === Elevation === */
18151.elevation-0 {
18152 -webkit-box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0) !important;
18153 box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0) !important;
18154}
18155.elevation-1 {
18156 -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;
18157 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;
18158}
18159.elevation-2 {
18160 -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;
18161 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;
18162}
18163.elevation-3 {
18164 -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;
18165 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;
18166}
18167.elevation-4 {
18168 -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;
18169 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;
18170}
18171.elevation-5 {
18172 -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;
18173 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;
18174}
18175.elevation-6 {
18176 -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;
18177 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;
18178}
18179.elevation-7 {
18180 -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;
18181 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;
18182}
18183.elevation-8 {
18184 -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;
18185 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;
18186}
18187.elevation-9 {
18188 -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;
18189 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;
18190}
18191.elevation-10 {
18192 -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;
18193 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;
18194}
18195.elevation-11 {
18196 -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;
18197 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;
18198}
18199.elevation-12 {
18200 -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;
18201 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;
18202}
18203.elevation-13 {
18204 -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;
18205 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;
18206}
18207.elevation-14 {
18208 -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;
18209 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;
18210}
18211.elevation-15 {
18212 -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;
18213 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;
18214}
18215.elevation-16 {
18216 -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;
18217 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;
18218}
18219.elevation-17 {
18220 -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;
18221 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;
18222}
18223.elevation-18 {
18224 -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;
18225 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;
18226}
18227.elevation-19 {
18228 -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;
18229 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;
18230}
18231.elevation-20 {
18232 -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;
18233 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;
18234}
18235.elevation-21 {
18236 -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;
18237 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;
18238}
18239.elevation-22 {
18240 -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;
18241 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;
18242}
18243.elevation-23 {
18244 -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;
18245 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;
18246}
18247.elevation-24 {
18248 -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;
18249 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;
18250}
18251.device-desktop .elevation-hover-0:hover {
18252 -webkit-box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0) !important;
18253 box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0) !important;
18254}
18255.device-desktop .elevation-hover-1:hover {
18256 -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;
18257 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;
18258}
18259.device-desktop .elevation-hover-2:hover {
18260 -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;
18261 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;
18262}
18263.device-desktop .elevation-hover-3:hover {
18264 -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;
18265 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;
18266}
18267.device-desktop .elevation-hover-4:hover {
18268 -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;
18269 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;
18270}
18271.device-desktop .elevation-hover-5:hover {
18272 -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;
18273 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;
18274}
18275.device-desktop .elevation-hover-6:hover {
18276 -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;
18277 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;
18278}
18279.device-desktop .elevation-hover-7:hover {
18280 -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;
18281 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;
18282}
18283.device-desktop .elevation-hover-8:hover {
18284 -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;
18285 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;
18286}
18287.device-desktop .elevation-hover-9:hover {
18288 -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;
18289 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;
18290}
18291.device-desktop .elevation-hover-10:hover {
18292 -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;
18293 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;
18294}
18295.device-desktop .elevation-hover-11:hover {
18296 -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;
18297 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;
18298}
18299.device-desktop .elevation-hover-12:hover {
18300 -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;
18301 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;
18302}
18303.device-desktop .elevation-hover-13:hover {
18304 -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;
18305 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;
18306}
18307.device-desktop .elevation-hover-14:hover {
18308 -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;
18309 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;
18310}
18311.device-desktop .elevation-hover-15:hover {
18312 -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;
18313 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;
18314}
18315.device-desktop .elevation-hover-16:hover {
18316 -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;
18317 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;
18318}
18319.device-desktop .elevation-hover-17:hover {
18320 -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;
18321 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;
18322}
18323.device-desktop .elevation-hover-18:hover {
18324 -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;
18325 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;
18326}
18327.device-desktop .elevation-hover-19:hover {
18328 -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;
18329 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;
18330}
18331.device-desktop .elevation-hover-20:hover {
18332 -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;
18333 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;
18334}
18335.device-desktop .elevation-hover-21:hover {
18336 -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;
18337 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;
18338}
18339.device-desktop .elevation-hover-22:hover {
18340 -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;
18341 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;
18342}
18343.device-desktop .elevation-hover-23:hover {
18344 -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;
18345 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;
18346}
18347.device-desktop .elevation-hover-24:hover {
18348 -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;
18349 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;
18350}
18351.active-state.elevation-pressed-0,
18352.device-desktop .active-state.elevation-pressed-0 {
18353 -webkit-box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0) !important;
18354 box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0) !important;
18355}
18356.active-state.elevation-pressed-1,
18357.device-desktop .active-state.elevation-pressed-1 {
18358 -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;
18359 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;
18360}
18361.active-state.elevation-pressed-2,
18362.device-desktop .active-state.elevation-pressed-2 {
18363 -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;
18364 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;
18365}
18366.active-state.elevation-pressed-3,
18367.device-desktop .active-state.elevation-pressed-3 {
18368 -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;
18369 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;
18370}
18371.active-state.elevation-pressed-4,
18372.device-desktop .active-state.elevation-pressed-4 {
18373 -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;
18374 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;
18375}
18376.active-state.elevation-pressed-5,
18377.device-desktop .active-state.elevation-pressed-5 {
18378 -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;
18379 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;
18380}
18381.active-state.elevation-pressed-6,
18382.device-desktop .active-state.elevation-pressed-6 {
18383 -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;
18384 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;
18385}
18386.active-state.elevation-pressed-7,
18387.device-desktop .active-state.elevation-pressed-7 {
18388 -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;
18389 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;
18390}
18391.active-state.elevation-pressed-8,
18392.device-desktop .active-state.elevation-pressed-8 {
18393 -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;
18394 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;
18395}
18396.active-state.elevation-pressed-9,
18397.device-desktop .active-state.elevation-pressed-9 {
18398 -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;
18399 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;
18400}
18401.active-state.elevation-pressed-10,
18402.device-desktop .active-state.elevation-pressed-10 {
18403 -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;
18404 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;
18405}
18406.active-state.elevation-pressed-11,
18407.device-desktop .active-state.elevation-pressed-11 {
18408 -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;
18409 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;
18410}
18411.active-state.elevation-pressed-12,
18412.device-desktop .active-state.elevation-pressed-12 {
18413 -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;
18414 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;
18415}
18416.active-state.elevation-pressed-13,
18417.device-desktop .active-state.elevation-pressed-13 {
18418 -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;
18419 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;
18420}
18421.active-state.elevation-pressed-14,
18422.device-desktop .active-state.elevation-pressed-14 {
18423 -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;
18424 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;
18425}
18426.active-state.elevation-pressed-15,
18427.device-desktop .active-state.elevation-pressed-15 {
18428 -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;
18429 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;
18430}
18431.active-state.elevation-pressed-16,
18432.device-desktop .active-state.elevation-pressed-16 {
18433 -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;
18434 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;
18435}
18436.active-state.elevation-pressed-17,
18437.device-desktop .active-state.elevation-pressed-17 {
18438 -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;
18439 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;
18440}
18441.active-state.elevation-pressed-18,
18442.device-desktop .active-state.elevation-pressed-18 {
18443 -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;
18444 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;
18445}
18446.active-state.elevation-pressed-19,
18447.device-desktop .active-state.elevation-pressed-19 {
18448 -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;
18449 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;
18450}
18451.active-state.elevation-pressed-20,
18452.device-desktop .active-state.elevation-pressed-20 {
18453 -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;
18454 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;
18455}
18456.active-state.elevation-pressed-21,
18457.device-desktop .active-state.elevation-pressed-21 {
18458 -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;
18459 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;
18460}
18461.active-state.elevation-pressed-22,
18462.device-desktop .active-state.elevation-pressed-22 {
18463 -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;
18464 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;
18465}
18466.active-state.elevation-pressed-23,
18467.device-desktop .active-state.elevation-pressed-23 {
18468 -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;
18469 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;
18470}
18471.active-state.elevation-pressed-24,
18472.device-desktop .active-state.elevation-pressed-24 {
18473 -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;
18474 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;
18475}
18476.elevation-transition-100 {
18477 -webkit-transition-duration: 100ms;
18478 transition-duration: 100ms;
18479 -webkit-transition-property: -webkit-box-shadow;
18480 transition-property: -webkit-box-shadow;
18481 transition-property: box-shadow;
18482 transition-property: box-shadow, -webkit-box-shadow;
18483}
18484.elevation-transition,
18485.elevation-transition-200 {
18486 -webkit-transition-duration: 200ms;
18487 transition-duration: 200ms;
18488 -webkit-transition-property: -webkit-box-shadow;
18489 transition-property: -webkit-box-shadow;
18490 transition-property: box-shadow;
18491 transition-property: box-shadow, -webkit-box-shadow;
18492}
18493.elevation-transition-300 {
18494 -webkit-transition-duration: 300ms;
18495 transition-duration: 300ms;
18496 -webkit-transition-property: -webkit-box-shadow;
18497 transition-property: -webkit-box-shadow;
18498 transition-property: box-shadow;
18499 transition-property: box-shadow, -webkit-box-shadow;
18500}
18501.elevation-transition-400 {
18502 -webkit-transition-duration: 400ms;
18503 transition-duration: 400ms;
18504 -webkit-transition-property: -webkit-box-shadow;
18505 transition-property: -webkit-box-shadow;
18506 transition-property: box-shadow;
18507 transition-property: box-shadow, -webkit-box-shadow;
18508}
18509.elevation-transition-500 {
18510 -webkit-transition-duration: 500ms;
18511 transition-duration: 500ms;
18512 -webkit-transition-property: -webkit-box-shadow;
18513 transition-property: -webkit-box-shadow;
18514 transition-property: box-shadow;
18515 transition-property: box-shadow, -webkit-box-shadow;
18516}
18517/* === Typography === */
18518.display-flex {
18519 display: -webkit-box !important;
18520 display: -webkit-flex !important;
18521 display: -ms-flexbox !important;
18522 display: flex !important;
18523}
18524.display-block {
18525 display: block !important;
18526}
18527.display-inline-flex {
18528 display: -webkit-inline-box !important;
18529 display: -webkit-inline-flex !important;
18530 display: -ms-inline-flexbox !important;
18531 display: inline-flex !important;
18532}
18533.display-inline-block {
18534 display: inline-block !important;
18535}
18536.display-inline {
18537 display: inline !important;
18538}
18539.display-none {
18540 display: none !important;
18541}
18542.flex-shrink-0 {
18543 -webkit-flex-shrink: 0 !important;
18544 -ms-flex-negative: 0 !important;
18545 flex-shrink: 0 !important;
18546}
18547.flex-shrink-1 {
18548 -webkit-flex-shrink: 1 !important;
18549 -ms-flex-negative: 1 !important;
18550 flex-shrink: 1 !important;
18551}
18552.flex-shrink-2 {
18553 -webkit-flex-shrink: 2 !important;
18554 -ms-flex-negative: 2 !important;
18555 flex-shrink: 2 !important;
18556}
18557.flex-shrink-3 {
18558 -webkit-flex-shrink: 3 !important;
18559 -ms-flex-negative: 3 !important;
18560 flex-shrink: 3 !important;
18561}
18562.flex-shrink-4 {
18563 -webkit-flex-shrink: 4 !important;
18564 -ms-flex-negative: 4 !important;
18565 flex-shrink: 4 !important;
18566}
18567.flex-shrink-5 {
18568 -webkit-flex-shrink: 5 !important;
18569 -ms-flex-negative: 5 !important;
18570 flex-shrink: 5 !important;
18571}
18572.flex-shrink-6 {
18573 -webkit-flex-shrink: 6 !important;
18574 -ms-flex-negative: 6 !important;
18575 flex-shrink: 6 !important;
18576}
18577.flex-shrink-7 {
18578 -webkit-flex-shrink: 7 !important;
18579 -ms-flex-negative: 7 !important;
18580 flex-shrink: 7 !important;
18581}
18582.flex-shrink-8 {
18583 -webkit-flex-shrink: 8 !important;
18584 -ms-flex-negative: 8 !important;
18585 flex-shrink: 8 !important;
18586}
18587.flex-shrink-9 {
18588 -webkit-flex-shrink: 9 !important;
18589 -ms-flex-negative: 9 !important;
18590 flex-shrink: 9 !important;
18591}
18592.flex-shrink-10 {
18593 -webkit-flex-shrink: 10 !important;
18594 -ms-flex-negative: 10 !important;
18595 flex-shrink: 10 !important;
18596}
18597.justify-content-flex-start {
18598 -webkit-box-pack: start !important;
18599 -webkit-justify-content: flex-start !important;
18600 -ms-flex-pack: start !important;
18601 justify-content: flex-start !important;
18602}
18603.justify-content-center {
18604 -webkit-box-pack: center !important;
18605 -webkit-justify-content: center !important;
18606 -ms-flex-pack: center !important;
18607 justify-content: center !important;
18608}
18609.justify-content-flex-end {
18610 -webkit-box-pack: end !important;
18611 -webkit-justify-content: flex-end !important;
18612 -ms-flex-pack: end !important;
18613 justify-content: flex-end !important;
18614}
18615.justify-content-space-between {
18616 -webkit-box-pack: justify !important;
18617 -webkit-justify-content: space-between !important;
18618 -ms-flex-pack: justify !important;
18619 justify-content: space-between !important;
18620}
18621.justify-content-space-around {
18622 -webkit-justify-content: space-around !important;
18623 -ms-flex-pack: distribute !important;
18624 justify-content: space-around !important;
18625}
18626.justify-content-space-evenly {
18627 -webkit-box-pack: space-evenly !important;
18628 -webkit-justify-content: space-evenly !important;
18629 -ms-flex-pack: space-evenly !important;
18630 justify-content: space-evenly !important;
18631}
18632.justify-content-stretch {
18633 -webkit-box-pack: stretch !important;
18634 -webkit-justify-content: stretch !important;
18635 -ms-flex-pack: stretch !important;
18636 justify-content: stretch !important;
18637}
18638.justify-content-start {
18639 -webkit-box-pack: start !important;
18640 -webkit-justify-content: start !important;
18641 -ms-flex-pack: start !important;
18642 justify-content: start !important;
18643}
18644.justify-content-end {
18645 -webkit-box-pack: end !important;
18646 -webkit-justify-content: end !important;
18647 -ms-flex-pack: end !important;
18648 justify-content: end !important;
18649}
18650.justify-content-left {
18651 -webkit-box-pack: left !important;
18652 -webkit-justify-content: left !important;
18653 -ms-flex-pack: left !important;
18654 justify-content: left !important;
18655}
18656.justify-content-right {
18657 -webkit-box-pack: right !important;
18658 -webkit-justify-content: right !important;
18659 -ms-flex-pack: right !important;
18660 justify-content: right !important;
18661}
18662.align-content-flex-start {
18663 -webkit-align-content: flex-start !important;
18664 -ms-flex-line-pack: start !important;
18665 align-content: flex-start !important;
18666}
18667.align-content-flex-end {
18668 -webkit-align-content: flex-end !important;
18669 -ms-flex-line-pack: end !important;
18670 align-content: flex-end !important;
18671}
18672.align-content-center {
18673 -webkit-align-content: center !important;
18674 -ms-flex-line-pack: center !important;
18675 align-content: center !important;
18676}
18677.align-content-space-between {
18678 -webkit-align-content: space-between !important;
18679 -ms-flex-line-pack: justify !important;
18680 align-content: space-between !important;
18681}
18682.align-content-space-around {
18683 -webkit-align-content: space-around !important;
18684 -ms-flex-line-pack: distribute !important;
18685 align-content: space-around !important;
18686}
18687.align-content-stretch {
18688 -webkit-align-content: stretch !important;
18689 -ms-flex-line-pack: stretch !important;
18690 align-content: stretch !important;
18691}
18692.align-items-flex-start {
18693 -webkit-box-align: start !important;
18694 -webkit-align-items: flex-start !important;
18695 -ms-flex-align: start !important;
18696 align-items: flex-start !important;
18697}
18698.align-items-flex-end {
18699 -webkit-box-align: end !important;
18700 -webkit-align-items: flex-end !important;
18701 -ms-flex-align: end !important;
18702 align-items: flex-end !important;
18703}
18704.align-items-center {
18705 -webkit-box-align: center !important;
18706 -webkit-align-items: center !important;
18707 -ms-flex-align: center !important;
18708 align-items: center !important;
18709}
18710.align-items-stretch {
18711 -webkit-box-align: stretch !important;
18712 -webkit-align-items: stretch !important;
18713 -ms-flex-align: stretch !important;
18714 align-items: stretch !important;
18715}
18716.align-self-flex-start {
18717 -webkit-align-self: flex-start !important;
18718 -ms-flex-item-align: start !important;
18719 align-self: flex-start !important;
18720}
18721.align-self-flex-end {
18722 -webkit-align-self: flex-end !important;
18723 -ms-flex-item-align: end !important;
18724 align-self: flex-end !important;
18725}
18726.align-self-center {
18727 -webkit-align-self: center !important;
18728 -ms-flex-item-align: center !important;
18729 align-self: center !important;
18730}
18731.align-self-stretch {
18732 -webkit-align-self: stretch !important;
18733 -ms-flex-item-align: stretch !important;
18734 align-self: stretch !important;
18735}
18736.text-align-left {
18737 text-align: left !important;
18738}
18739.text-align-center {
18740 text-align: center !important;
18741}
18742.text-align-right {
18743 text-align: right !important;
18744}
18745.text-align-justify {
18746 text-align: justify !important;
18747}
18748.float-left {
18749 float: left !important;
18750}
18751.float-right {
18752 float: right !important;
18753}
18754.float-none {
18755 float: none !important;
18756}
18757.vertical-align-bottom {
18758 vertical-align: bottom !important;
18759}
18760.vertical-align-middle {
18761 vertical-align: middle !important;
18762}
18763.vertical-align-top {
18764 vertical-align: top !important;
18765}
18766.no-padding {
18767 padding: 0 !important;
18768}
18769.no-padding-left {
18770 padding-left: 0 !important;
18771}
18772.no-padding-right {
18773 padding-right: 0 !important;
18774}
18775.no-padding-top {
18776 padding-top: 0 !important;
18777}
18778.no-padding-bottom {
18779 padding-bottom: 0 !important;
18780}
18781.no-margin {
18782 margin: 0 !important;
18783}
18784.no-margin-left {
18785 margin-left: 0 !important;
18786}
18787.no-margin-right {
18788 margin-right: 0 !important;
18789}
18790.no-margin-top {
18791 margin-top: 0 !important;
18792}
18793.no-margin-bottom {
18794 margin-bottom: 0 !important;
18795}
18796.width-auto {
18797 width: auto !important;
18798}
18799.width-100 {
18800 width: 100% !important;
18801}
18802.md .padding {
18803 padding: 16px !important;
18804}
18805.md .padding-top {
18806 padding-top: 16px !important;
18807}
18808.md .padding-bottom {
18809 padding-bottom: 16px !important;
18810}
18811.md .padding-left {
18812 padding-left: 16px !important;
18813}
18814.md .padding-right {
18815 padding-right: 16px !important;
18816}
18817.md .padding-vertical {
18818 padding-top: 16px !important;
18819 padding-bottom: 16px !important;
18820}
18821.md .padding-horizontal {
18822 padding-left: 16px !important;
18823 padding-right: 16px !important;
18824}
18825.md .margin {
18826 margin: 16px !important;
18827}
18828.md .margin-top {
18829 margin-top: 16px !important;
18830}
18831.md .margin-bottom {
18832 margin-bottom: 16px !important;
18833}
18834.md .margin-left {
18835 margin-left: 16px !important;
18836}
18837.md .margin-right {
18838 margin-right: 16px !important;
18839}
18840.md .margin-vertical {
18841 margin-top: 16px !important;
18842 margin-bottom: 16px !important;
18843}
18844.md .margin-horizontal {
18845 margin-left: 16px !important;
18846 margin-right: 16px !important;
18847}
18848.md .text-color-red {
18849 color: #f44336 !important;
18850}
18851.md .bg-color-red {
18852 background-color: #f44336 !important;
18853}
18854.md .border-color-red {
18855 border-color: #f44336 !important;
18856}
18857.md .text-color-green {
18858 color: #4caf50 !important;
18859}
18860.md .bg-color-green {
18861 background-color: #4caf50 !important;
18862}
18863.md .border-color-green {
18864 border-color: #4caf50 !important;
18865}
18866.md .text-color-blue {
18867 color: #2196f3 !important;
18868}
18869.md .bg-color-blue {
18870 background-color: #2196f3 !important;
18871}
18872.md .border-color-blue {
18873 border-color: #2196f3 !important;
18874}
18875.md .text-color-pink {
18876 color: #e91e63 !important;
18877}
18878.md .bg-color-pink {
18879 background-color: #e91e63 !important;
18880}
18881.md .border-color-pink {
18882 border-color: #e91e63 !important;
18883}
18884.md .text-color-yellow {
18885 color: #ffeb3b !important;
18886}
18887.md .bg-color-yellow {
18888 background-color: #ffeb3b !important;
18889}
18890.md .border-color-yellow {
18891 border-color: #ffeb3b !important;
18892}
18893.md .text-color-orange {
18894 color: #ff9800 !important;
18895}
18896.md .bg-color-orange {
18897 background-color: #ff9800 !important;
18898}
18899.md .border-color-orange {
18900 border-color: #ff9800 !important;
18901}
18902.md .text-color-gray {
18903 color: #9e9e9e !important;
18904}
18905.md .bg-color-gray {
18906 background-color: #9e9e9e !important;
18907}
18908.md .border-color-gray {
18909 border-color: #9e9e9e !important;
18910}
18911.md .text-color-white {
18912 color: #ffffff !important;
18913}
18914.md .bg-color-white {
18915 background-color: #ffffff !important;
18916}
18917.md .border-color-white {
18918 border-color: #ffffff !important;
18919}
18920.md .text-color-black {
18921 color: #000000 !important;
18922}
18923.md .bg-color-black {
18924 background-color: #000000 !important;
18925}
18926.md .border-color-black {
18927 border-color: #000000 !important;
18928}