]> git.proxmox.com Git - framework7.git/blame - framework7/css/framework7.ios.css
intial commit
[framework7.git] / framework7 / css / framework7.ios.css
CommitLineData
5309fbda
DC
1/**
2 * Framework7 3.6.6
3 * Full featured mobile HTML framework for building iOS & Android apps
4 * http://framework7.io/
5 *
6 * Copyright 2014-2019 Vladimir Kharlampidi
7 *
8 * Released under the MIT License
9 *
10 * Released on: February 5, 2019
11 */
12html,
13body,
14.framework7-root {
15 position: relative;
16 height: 100%;
17 width: 100%;
18 overflow-x: hidden;
19}
20body {
21 margin: 0;
22 padding: 0;
23 font-size: 14px;
24 width: 100%;
25 background: #fff;
26 overflow: hidden;
27 -webkit-text-size-adjust: 100%;
28 -webkit-font-smoothing: antialiased;
29}
30.framework7-root {
31 overflow: hidden;
32 -webkit-box-sizing: border-box;
33 box-sizing: border-box;
34}
35.framework7-initializing *,
36.framework7-initializing *:before,
37.framework7-initializing *:after {
38 -webkit-transition-duration: 0ms !important;
39 transition-duration: 0ms !important;
40}
41/*
42a, button, input, textarea, .link, .button, label, .sortable-handler {
43 touch-action: manipulation;
44 -ms-touch-action: manipulation;
45}
46*/
47@media (width: 1024px) and (height: 691px) and (orientation: landscape) {
48 html,
49 body,
50 .framework7-root {
51 height: 671px;
52 }
53}
54@media (width: 1024px) and (height: 692px) and (orientation: landscape) {
55 html,
56 body,
57 .framework7-root {
58 height: 672px;
59 }
60}
61* {
62 -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
63 -webkit-touch-callout: none;
64}
65a,
66input,
67textarea,
68select {
69 outline: 0;
70}
71a {
72 cursor: pointer;
73 text-decoration: none;
74}
75p {
76 margin: 1em 0;
77}
78.disabled {
79 opacity: 0.55 !important;
80 pointer-events: none !important;
81}
82.ios body {
83 font-family: -apple-system, SF Pro Text, SF UI Text, system-ui, Helvetica Neue, Helvetica, Arial, sans-serif;
84 color: #000;
85 line-height: 1.4;
86}
87.ios .md-only,
88.ios .if-md {
89 display: none !important;
90}
91.ios a {
92 color: #007aff;
93}
94@media (width: 1024px) and (height: 691px) and (orientation: landscape) {
95 .ios,
96 .ios body,
97 .ios .framework7-root {
98 height: 671px;
99 }
100}
101@media (width: 1024px) and (height: 692px) and (orientation: landscape) {
102 .ios,
103 .ios body,
104 .ios .framework7-root {
105 height: 672px;
106 }
107}
108.ios .theme-dark {
109 color: #fff;
110}
111.ios .color-theme-red a {
112 color: #ff3b30;
113}
114.ios .color-theme-green a {
115 color: #4cd964;
116}
117.ios .color-theme-blue a {
118 color: #007aff;
119}
120.ios .color-theme-pink a {
121 color: #ff2d55;
122}
123.ios .color-theme-yellow a {
124 color: #ffcc00;
125}
126.ios .color-theme-orange a {
127 color: #ff9500;
128}
129.ios .color-theme-gray a {
130 color: #8e8e93;
131}
132.ios .color-theme-white a {
133 color: #ffffff;
134}
135.ios .color-theme-black a {
136 color: #000000;
137}
138.ios a.color-red {
139 color: #ff3b30;
140}
141.ios a.color-green {
142 color: #4cd964;
143}
144.ios a.color-blue {
145 color: #007aff;
146}
147.ios a.color-pink {
148 color: #ff2d55;
149}
150.ios a.color-yellow {
151 color: #ffcc00;
152}
153.ios a.color-orange {
154 color: #ff9500;
155}
156.ios a.color-gray {
157 color: #8e8e93;
158}
159.ios a.color-white {
160 color: #ffffff;
161}
162.ios a.color-black {
163 color: #000000;
164}
165/* === Statusbar === */
166.statusbar {
167 position: absolute;
168 left: 0;
169 top: 0;
170 width: 100%;
171 z-index: 10000;
172 -webkit-box-sizing: border-box;
173 box-sizing: border-box;
174 display: none;
175}
176html.device-ios .statusbar,
177html.ios:not(.device-ios):not(.device-android) .statusbar {
178 height: 20px;
179}
180html.device-android .statusbar,
181html.md:not(.device-ios):not(.device-android) .statusbar {
182 height: 24px;
183}
184html.device-ios.device-iphone-x .statusbar {
185 height: constant(safe-area-inset-top);
186 height: env(safe-area-inset-top);
187}
188html.with-statusbar .statusbar {
189 display: block;
190}
191html.with-statusbar.device-ios .framework7-root,
192html.with-statusbar.ios:not(.device-ios):not(.device-android) .framework7-root {
193 padding-top: 20px;
194}
195html.with-statusbar.device-android .framework7-root,
196html.with-statusbar.md:not(.device-ios):not(.device-android) .framework7-root {
197 padding-top: 24px;
198}
199html.with-statusbar.device-iphone-x .framework7-root {
200 padding-top: constant(safe-area-inset-top);
201 padding-top: env(safe-area-inset-top);
202}
203.ios .statusbar {
204 background: #f7f7f8;
205}
206.ios .theme-dark .statusbar {
207 background-color: #1b1b1b;
208}
209/* === Views === */
210.views,
211.view {
212 position: relative;
213 height: 100%;
214 z-index: 5000;
215 overflow: hidden;
216 -webkit-box-sizing: border-box;
217 box-sizing: border-box;
218}
219/* === Pages === */
220.pages {
221 position: relative;
222 width: 100%;
223 height: 100%;
224 overflow: hidden;
225}
226.page {
227 -webkit-box-sizing: border-box;
228 box-sizing: border-box;
229 position: absolute;
230 left: 0;
231 top: 0;
232 width: 100%;
233 height: 100%;
234 -webkit-transform: translate3d(0, 0, 0);
235 transform: translate3d(0, 0, 0);
236}
237.page.stacked {
238 display: none;
239}
240.page-previous {
241 pointer-events: none;
242}
243.page-content {
244 overflow: auto;
245 -webkit-overflow-scrolling: touch;
246 -webkit-box-sizing: border-box;
247 box-sizing: border-box;
248 height: 100%;
249 position: relative;
250 z-index: 1;
251}
252.ios .page-shadow-effect {
253 position: absolute;
254 top: 0;
255 width: 16px;
256 bottom: 0;
257 z-index: -1;
258 content: '';
259 opacity: 0;
260 right: 100%;
261 background: -webkit-gradient(linear, left top, right top, from(rgba(0, 0, 0, 0)), color-stop(10%, rgba(0, 0, 0, 0)), color-stop(50%, rgba(0, 0, 0, 0.01)), to(rgba(0, 0, 0, 0.2)));
262 background: -webkit-linear-gradient(left, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, rgba(0, 0, 0, 0.01) 50%, rgba(0, 0, 0, 0.2) 100%);
263 background: linear-gradient(to right, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, rgba(0, 0, 0, 0.01) 50%, rgba(0, 0, 0, 0.2) 100%);
264}
265.ios .page-opacity-effect {
266 position: absolute;
267 left: 0;
268 top: 0;
269 background: rgba(0, 0, 0, 0.1);
270 width: 100%;
271 bottom: 0;
272 content: '';
273 opacity: 0;
274 z-index: 10000;
275}
276.ios .router-dynamic-navbar-inside .page-shadow-effect,
277.ios .router-dynamic-navbar-inside .page-opacity-effect {
278 top: 44px;
279}
280.ios .page {
281 background: #efeff4;
282}
283.ios .page-previous {
284 -webkit-transform: translate3d(-20%, 0, 0);
285 transform: translate3d(-20%, 0, 0);
286}
287.ios .page-next {
288 -webkit-transform: translate3d(100%, 0, 0);
289 transform: translate3d(100%, 0, 0);
290}
291.ios .page-previous .page-opacity-effect {
292 opacity: 1;
293}
294.ios .page-previous:after {
295 opacity: 1;
296}
297.ios .page-current .page-shadow-effect {
298 opacity: 1;
299}
300.ios .page-transitioning,
301.ios .page-transitioning .page-shadow-effect,
302.ios .page-transitioning .page-opacity-effect {
303 -webkit-transition-duration: 400ms;
304 transition-duration: 400ms;
305}
306.ios .router-transition-forward .page-next,
307.ios .router-transition-backward .page-next,
308.ios .router-transition-forward .page-current,
309.ios .router-transition-backward .page-current,
310.ios .router-transition-forward .page-previous:not(.stacked),
311.ios .router-transition-backward .page-previous:not(.stacked) {
312 pointer-events: none;
313}
314.ios .router-transition-css-forward .page-next {
315 -webkit-animation: ios-page-next-to-current 400ms forwards;
316 animation: ios-page-next-to-current 400ms forwards;
317}
318.ios .router-transition-css-forward .page-next:before {
319 position: absolute;
320 top: 0;
321 width: 16px;
322 bottom: 0;
323 z-index: -1;
324 content: '';
325 opacity: 0;
326 right: 100%;
327 background: -webkit-gradient(linear, left top, right top, from(rgba(0, 0, 0, 0)), color-stop(10%, rgba(0, 0, 0, 0)), color-stop(50%, rgba(0, 0, 0, 0.01)), to(rgba(0, 0, 0, 0.2)));
328 background: -webkit-linear-gradient(left, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, rgba(0, 0, 0, 0.01) 50%, rgba(0, 0, 0, 0.2) 100%);
329 background: linear-gradient(to right, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, rgba(0, 0, 0, 0.01) 50%, rgba(0, 0, 0, 0.2) 100%);
330 -webkit-animation: ios-page-next-to-current-shadow 400ms forwards;
331 animation: ios-page-next-to-current-shadow 400ms forwards;
332}
333.ios .router-transition-css-forward .page-current {
334 -webkit-animation: ios-page-current-to-previous 400ms forwards;
335 animation: ios-page-current-to-previous 400ms forwards;
336}
337.ios .router-transition-css-forward .page-current:after {
338 position: absolute;
339 left: 0;
340 top: 0;
341 background: rgba(0, 0, 0, 0.1);
342 width: 100%;
343 bottom: 0;
344 content: '';
345 opacity: 0;
346 z-index: 10000;
347 -webkit-animation: ios-page-current-to-previous-opacity 400ms forwards;
348 animation: ios-page-current-to-previous-opacity 400ms forwards;
349}
350.ios .router-transition-css-forward.router-dynamic-navbar-inside .page-next:before,
351.ios .router-transition-css-forward.router-dynamic-navbar-inside .page-current:after {
352 top: 44px;
353}
354.ios .router-transition-css-backward .page-previous,
355.ios .router-transition-css-backward .page-current {
356 pointer-events: none;
357}
358.ios .router-transition-css-backward .page-previous {
359 -webkit-animation: ios-page-previous-to-current 400ms forwards;
360 animation: ios-page-previous-to-current 400ms forwards;
361}
362.ios .router-transition-css-backward .page-previous:after {
363 position: absolute;
364 left: 0;
365 top: 0;
366 background: rgba(0, 0, 0, 0.1);
367 width: 100%;
368 bottom: 0;
369 content: '';
370 opacity: 0;
371 z-index: 10000;
372 -webkit-animation: ios-page-previous-to-current-opacity 400ms forwards;
373 animation: ios-page-previous-to-current-opacity 400ms forwards;
374}
375.ios .router-transition-css-backward .page-current {
376 -webkit-animation: ios-page-current-to-next 400ms forwards;
377 animation: ios-page-current-to-next 400ms forwards;
378}
379.ios .router-transition-css-backward .page-current:before {
380 position: absolute;
381 top: 0;
382 width: 16px;
383 bottom: 0;
384 z-index: -1;
385 content: '';
386 opacity: 0;
387 right: 100%;
388 background: -webkit-gradient(linear, left top, right top, from(rgba(0, 0, 0, 0)), color-stop(10%, rgba(0, 0, 0, 0)), color-stop(50%, rgba(0, 0, 0, 0.01)), to(rgba(0, 0, 0, 0.2)));
389 background: -webkit-linear-gradient(left, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, rgba(0, 0, 0, 0.01) 50%, rgba(0, 0, 0, 0.2) 100%);
390 background: linear-gradient(to right, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, rgba(0, 0, 0, 0.01) 50%, rgba(0, 0, 0, 0.2) 100%);
391 -webkit-animation: ios-page-current-to-next-shadow 400ms forwards;
392 animation: ios-page-current-to-next-shadow 400ms forwards;
393}
394.ios .router-transition-css-backward.router-dynamic-navbar-inside .page-current:before,
395.ios .router-transition-css-backward.router-dynamic-navbar-inside .page-previous:after {
396 top: 44px;
397}
398.ios .theme-dark .page,
399.page.ios .theme-dark {
400 background: #171717;
401}
402@-webkit-keyframes ios-page-next-to-current {
403 from {
404 -webkit-transform: translate3d(100%, 0, 0);
405 transform: translate3d(100%, 0, 0);
406 }
407 to {
408 -webkit-transform: translate3d(0%, 0, 0);
409 transform: translate3d(0%, 0, 0);
410 }
411}
412@keyframes ios-page-next-to-current {
413 from {
414 -webkit-transform: translate3d(100%, 0, 0);
415 transform: translate3d(100%, 0, 0);
416 }
417 to {
418 -webkit-transform: translate3d(0%, 0, 0);
419 transform: translate3d(0%, 0, 0);
420 }
421}
422@-webkit-keyframes ios-page-previous-to-current {
423 from {
424 -webkit-transform: translate3d(-20%, 0, 0);
425 transform: translate3d(-20%, 0, 0);
426 }
427 to {
428 -webkit-transform: translate3d(0%, 0, 0);
429 transform: translate3d(0%, 0, 0);
430 }
431}
432@keyframes ios-page-previous-to-current {
433 from {
434 -webkit-transform: translate3d(-20%, 0, 0);
435 transform: translate3d(-20%, 0, 0);
436 }
437 to {
438 -webkit-transform: translate3d(0%, 0, 0);
439 transform: translate3d(0%, 0, 0);
440 }
441}
442@-webkit-keyframes ios-page-current-to-previous {
443 from {
444 -webkit-transform: translate3d(0, 0, 0);
445 transform: translate3d(0, 0, 0);
446 }
447 to {
448 -webkit-transform: translate3d(-20%, 0, 0);
449 transform: translate3d(-20%, 0, 0);
450 }
451}
452@keyframes ios-page-current-to-previous {
453 from {
454 -webkit-transform: translate3d(0, 0, 0);
455 transform: translate3d(0, 0, 0);
456 }
457 to {
458 -webkit-transform: translate3d(-20%, 0, 0);
459 transform: translate3d(-20%, 0, 0);
460 }
461}
462@-webkit-keyframes ios-page-current-to-next {
463 from {
464 -webkit-transform: translate3d(0, 0, 0);
465 transform: translate3d(0, 0, 0);
466 }
467 to {
468 -webkit-transform: translate3d(100%, 0, 0);
469 transform: translate3d(100%, 0, 0);
470 }
471}
472@keyframes ios-page-current-to-next {
473 from {
474 -webkit-transform: translate3d(0, 0, 0);
475 transform: translate3d(0, 0, 0);
476 }
477 to {
478 -webkit-transform: translate3d(100%, 0, 0);
479 transform: translate3d(100%, 0, 0);
480 }
481}
482@-webkit-keyframes ios-page-next-to-current-shadow {
483 from {
484 opacity: 0;
485 }
486 to {
487 opacity: 1;
488 }
489}
490@keyframes ios-page-next-to-current-shadow {
491 from {
492 opacity: 0;
493 }
494 to {
495 opacity: 1;
496 }
497}
498@-webkit-keyframes ios-page-previous-to-current-opacity {
499 from {
500 opacity: 1;
501 }
502 to {
503 opacity: 0;
504 }
505}
506@keyframes ios-page-previous-to-current-opacity {
507 from {
508 opacity: 1;
509 }
510 to {
511 opacity: 0;
512 }
513}
514@-webkit-keyframes ios-page-current-to-previous-opacity {
515 from {
516 opacity: 0;
517 }
518 to {
519 opacity: 1;
520 }
521}
522@keyframes ios-page-current-to-previous-opacity {
523 from {
524 opacity: 0;
525 }
526 to {
527 opacity: 1;
528 }
529}
530@-webkit-keyframes ios-page-current-to-next-shadow {
531 from {
532 opacity: 1;
533 }
534 to {
535 opacity: 0;
536 }
537}
538@keyframes ios-page-current-to-next-shadow {
539 from {
540 opacity: 1;
541 }
542 to {
543 opacity: 0;
544 }
545}
546/* === Link === */
547.link,
548.tab-link {
549 display: -webkit-inline-box;
550 display: -webkit-inline-flex;
551 display: -ms-inline-flexbox;
552 display: inline-flex;
553 -webkit-box-align: center;
554 -webkit-align-items: center;
555 -ms-flex-align: center;
556 align-items: center;
557 -webkit-align-content: center;
558 -ms-flex-line-pack: center;
559 align-content: center;
560 -webkit-box-pack: center;
561 -webkit-justify-content: center;
562 -ms-flex-pack: center;
563 justify-content: center;
564 position: relative;
565 -webkit-box-sizing: border-box;
566 box-sizing: border-box;
567 -webkit-transform: translate3d(0, 0, 0);
568 transform: translate3d(0, 0, 0);
569 z-index: 1;
570}
571.ios .link {
572 -webkit-transition: opacity 300ms;
573 transition: opacity 300ms;
574}
575.ios .link i + span,
576.ios .link i + i,
577.ios .link span + i,
578.ios .link span + span {
579 margin-left: 7px;
580}
581.ios .link.active-state {
582 opacity: 0.3;
583 -webkit-transition-duration: 0ms;
584 transition-duration: 0ms;
585}
586/* === Navbar === */
587.navbar {
588 position: relative;
589 left: 0;
590 top: 0;
591 width: 100%;
592 z-index: 500;
593 -webkit-backface-visibility: hidden;
594 backface-visibility: hidden;
595 -webkit-box-sizing: border-box;
596 box-sizing: border-box;
597 margin: 0;
598 -webkit-transform: translate3d(0, 0, 0);
599 transform: translate3d(0, 0, 0);
600}
601.navbar b {
602 font-weight: 500;
603}
604.navbar a.link {
605 display: -webkit-box;
606 display: -webkit-flex;
607 display: -ms-flexbox;
608 display: flex;
609}
610.navbar .title,
611.navbar .left,
612.navbar .right {
613 position: relative;
614 z-index: 1;
615}
616.navbar .title {
617 text-align: center;
618 position: relative;
619 overflow: hidden;
620 text-overflow: ellipsis;
621 white-space: nowrap;
622 -webkit-flex-shrink: 10;
623 -ms-flex-negative: 10;
624 flex-shrink: 10;
625 font-weight: 500;
626 display: inline-block;
627}
628.navbar .subtitle {
629 display: block;
630}
631.navbar .left,
632.navbar .right {
633 -webkit-flex-shrink: 0;
634 -ms-flex-negative: 0;
635 flex-shrink: 0;
636 display: -webkit-box;
637 display: -webkit-flex;
638 display: -ms-flexbox;
639 display: flex;
640 -webkit-box-pack: start;
641 -webkit-justify-content: flex-start;
642 -ms-flex-pack: start;
643 justify-content: flex-start;
644 -webkit-box-align: center;
645 -webkit-align-items: center;
646 -ms-flex-align: center;
647 align-items: center;
648 -webkit-transform: translate3d(0, 0, 0);
649 transform: translate3d(0, 0, 0);
650}
651.navbar .right:first-child {
652 position: absolute;
653 height: 100%;
654}
655.navbar-inner {
656 position: absolute;
657 left: 0;
658 top: 0;
659 width: 100%;
660 height: 100%;
661 display: -webkit-box;
662 display: -webkit-flex;
663 display: -ms-flexbox;
664 display: flex;
665 -webkit-box-align: center;
666 -webkit-align-items: center;
667 -ms-flex-align: center;
668 align-items: center;
669 -webkit-box-sizing: border-box;
670 box-sizing: border-box;
671}
672.navbar-inner.stacked {
673 display: none;
674}
675.views > .navbar,
676.view > .navbar,
677.page > .navbar {
678 position: absolute;
679}
680.ios .navbar {
681 height: 44px;
682 font-size: 17px;
683 background: #f7f7f8;
684}
685.ios .navbar.no-hairline:after {
686 display: none !important;
687}
688.ios .navbar:after {
689 -webkit-backface-visibility: hidden;
690 backface-visibility: hidden;
691}
692.ios .navbar a.link {
693 -webkit-box-pack: start;
694 -webkit-justify-content: flex-start;
695 -ms-flex-pack: start;
696 justify-content: flex-start;
697 line-height: 44px;
698 height: 44px;
699}
700.ios .navbar a.icon-only {
701 width: 44px;
702 margin: 0;
703 -webkit-box-pack: center;
704 -webkit-justify-content: center;
705 -ms-flex-pack: center;
706 justify-content: center;
707}
708.ios .navbar .title {
709 font-size: 17px;
710 margin: 0;
711 line-height: 1.2;
712}
713.ios .navbar .subtitle {
714 color: #6d6d72;
715 line-height: 1;
716 font-size: 10px;
717 text-align: center;
718 font-weight: normal;
719}
720.ios .navbar .left a + a,
721.ios .navbar .right a + a {
722 margin-left: 15px;
723}
724.ios .navbar b,
725.ios .navbar .title {
726 font-weight: 600;
727}
728.ios .navbar .left {
729 margin-right: 10px;
730}
731.ios .navbar .right {
732 margin-left: 10px;
733}
734.ios .navbar .right:first-child {
735 right: 8px;
736}
737.ios .navbar:after {
738 content: '';
739 position: absolute;
740 background-color: #c4c4c4;
741 display: block;
742 z-index: 15;
743 top: auto;
744 right: auto;
745 bottom: 0;
746 left: 0;
747 height: 1px;
748 width: 100%;
749 -webkit-transform-origin: 50% 100%;
750 transform-origin: 50% 100%;
751}
752.ios.device-pixel-ratio-2 .navbar:after {
753 -webkit-transform: scaleY(0.5);
754 transform: scaleY(0.5);
755}
756.ios.device-pixel-ratio-3 .navbar:after {
757 -webkit-transform: scaleY(0.33);
758 transform: scaleY(0.33);
759}
760.ios .navbar-inner {
761 -webkit-box-pack: justify;
762 -webkit-justify-content: space-between;
763 -ms-flex-pack: justify;
764 justify-content: space-between;
765 padding: 0 8px;
766}
767.ios .navbar ~ *:not(.no-navbar) .page-content,
768.ios .navbar ~ .page-content {
769 padding-top: 44px;
770}
771.ios .navbar-previous {
772 pointer-events: none;
773}
774.ios .navbar-previous .left,
775.ios .navbar-previous .right,
776.ios .navbar-previous > .title,
777.ios .navbar-previous .subnavbar,
778.ios .navbar-previous .fading {
779 opacity: 0;
780}
781.ios .navbar-previous .sliding {
782 opacity: 0;
783}
784.ios .navbar-previous .subnavbar.sliding,
785.ios .navbar-previous.sliding .subnavbar {
786 opacity: 1;
787 -webkit-transform: translate3d(-100%, 0, 0);
788 transform: translate3d(-100%, 0, 0);
789}
790.ios .navbar-next {
791 pointer-events: none;
792}
793.ios .navbar-next .left,
794.ios .navbar-next .right,
795.ios .navbar-next > .title,
796.ios .navbar-next .subnavbar,
797.ios .navbar-next .fading {
798 opacity: 0;
799}
800.ios .navbar-next .sliding {
801 opacity: 0;
802}
803.ios .navbar-next.sliding .left,
804.ios .navbar-next.sliding .right,
805.ios .navbar-next.sliding > .title,
806.ios .navbar-next.sliding .subnavbar {
807 opacity: 0;
808}
809.ios .navbar-next .subnavbar.sliding,
810.ios .navbar-next.sliding .subnavbar {
811 opacity: 1;
812 -webkit-transform: translate3d(100%, 0, 0);
813 transform: translate3d(100%, 0, 0);
814}
815.ios .navbar-transitioning {
816 -webkit-transition-duration: 400ms;
817 transition-duration: 400ms;
818}
819.ios .navbar-hidden {
820 -webkit-transform: translate3d(0, -100%, 0);
821 transform: translate3d(0, -100%, 0);
822}
823.ios .router-transition-css-forward .navbar-current .left,
824.ios .router-transition-css-backward .navbar-current .left,
825.ios .router-transition-css-forward .navbar-current > .title,
826.ios .router-transition-css-backward .navbar-current > .title,
827.ios .router-transition-css-forward .navbar-current .right,
828.ios .router-transition-css-backward .navbar-current .right,
829.ios .router-transition-css-forward .navbar-current .subnavbar,
830.ios .router-transition-css-backward .navbar-current .subnavbar {
831 -webkit-animation: ios-navbar-element-fade-out 400ms forwards;
832 animation: ios-navbar-element-fade-out 400ms forwards;
833}
834.ios .router-transition-css-forward .navbar-current .sliding,
835.ios .router-transition-css-backward .navbar-current .sliding,
836.ios .router-transition-css-forward .navbar-current .left.sliding .icon,
837.ios .router-transition-css-backward .navbar-current .left.sliding .icon,
838.ios .router-transition-css-forward .navbar-current.sliding .left,
839.ios .router-transition-css-backward .navbar-current.sliding .left,
840.ios .router-transition-css-forward .navbar-current.sliding .left .icon,
841.ios .router-transition-css-backward .navbar-current.sliding .left .icon,
842.ios .router-transition-css-forward .navbar-current.sliding > .title,
843.ios .router-transition-css-backward .navbar-current.sliding > .title,
844.ios .router-transition-css-forward .navbar-current.sliding .right,
845.ios .router-transition-css-backward .navbar-current.sliding .right {
846 -webkit-transition-duration: 400ms;
847 transition-duration: 400ms;
848 opacity: 0 !important;
849 -webkit-animation: none;
850 animation: none;
851}
852.ios .router-transition-css-forward .navbar-current.sliding .subnavbar,
853.ios .router-transition-css-backward .navbar-current.sliding .subnavbar,
854.ios .router-transition-css-forward .navbar-current .sliding.subnavbar,
855.ios .router-transition-css-backward .navbar-current .sliding.subnavbar {
856 -webkit-transition-duration: 400ms;
857 transition-duration: 400ms;
858 -webkit-animation: none;
859 animation: none;
860 opacity: 1;
861}
862.ios .router-transition-css-forward .navbar-next .left,
863.ios .router-transition-css-backward .navbar-previous .left,
864.ios .router-transition-css-forward .navbar-next > .title,
865.ios .router-transition-css-backward .navbar-previous > .title,
866.ios .router-transition-css-forward .navbar-next .right,
867.ios .router-transition-css-backward .navbar-previous .right,
868.ios .router-transition-css-forward .navbar-next .subnavbar,
869.ios .router-transition-css-backward .navbar-previous .subnavbar {
870 -webkit-animation: ios-navbar-element-fade-in 400ms forwards;
871 animation: ios-navbar-element-fade-in 400ms forwards;
872}
873.ios .router-transition-css-forward .navbar-next .sliding,
874.ios .router-transition-css-backward .navbar-previous .sliding,
875.ios .router-transition-css-forward .navbar-next .left.sliding .icon,
876.ios .router-transition-css-backward .navbar-previous .left.sliding .icon,
877.ios .router-transition-css-forward .navbar-next.sliding .left,
878.ios .router-transition-css-backward .navbar-previous.sliding .left,
879.ios .router-transition-css-forward .navbar-next.sliding .left .icon,
880.ios .router-transition-css-backward .navbar-previous.sliding .left .icon,
881.ios .router-transition-css-forward .navbar-next.sliding > .title,
882.ios .router-transition-css-backward .navbar-previous.sliding > .title,
883.ios .router-transition-css-forward .navbar-next.sliding .right,
884.ios .router-transition-css-backward .navbar-previous.sliding .right,
885.ios .router-transition-css-forward .navbar-next.sliding .subnavbar,
886.ios .router-transition-css-backward .navbar-previous.sliding .subnavbar {
887 -webkit-transition-duration: 400ms;
888 transition-duration: 400ms;
889 -webkit-animation: none;
890 animation: none;
891 -webkit-transform: translate3d(0, 0, 0) !important;
892 transform: translate3d(0, 0, 0) !important;
893 opacity: 1 !important;
894}
895.ios .theme-dark .navbar,
896.navbar.ios .theme-dark {
897 background: #1b1b1b;
898}
899.ios .theme-dark .navbar:after,
900.navbar.ios .theme-dark:after {
901 background-color: #282829;
902}
903.ios .theme-dark .navbar .subtitle,
904.navbar.ios .theme-dark .subtitle {
905 color: #8e8e93;
906}
907@media (orientation: landscape) {
908 .ios.device-iphone-x .ios-left-edge .navbar-inner,
909 .ios.device-iphone-x .ios-edges .navbar-inner,
910 .ios.device-iphone-x .popup .navbar-inner,
911 .ios.device-iphone-x .sheet-modal .navbar-inner,
912 .ios.device-iphone-x .panel-left .navbar-inner {
913 padding-left: calc(8px + constant(safe-area-inset-right));
914 padding-left: calc(8px + env(safe-area-inset-right));
915 }
916 .ios.device-iphone-x .ios-right-edge .navbar-inner,
917 .ios.device-iphone-x .ios-edges .navbar-inner,
918 .ios.device-iphone-x .popup .navbar-inner,
919 .ios.device-iphone-x .sheet-modal .navbar-inner,
920 .ios.device-iphone-x .panel-right .navbar-inner {
921 padding-right: calc(8px + constant(safe-area-inset-right));
922 padding-right: calc(8px + env(safe-area-inset-right));
923 }
924}
925@-webkit-keyframes ios-navbar-element-fade-in {
926 from {
927 opacity: 0;
928 }
929 to {
930 opacity: 1;
931 }
932}
933@keyframes ios-navbar-element-fade-in {
934 from {
935 opacity: 0;
936 }
937 to {
938 opacity: 1;
939 }
940}
941@-webkit-keyframes ios-navbar-element-fade-out {
942 from {
943 opacity: 1;
944 }
945 to {
946 opacity: 0;
947 }
948}
949@keyframes ios-navbar-element-fade-out {
950 from {
951 opacity: 1;
952 }
953 to {
954 opacity: 0;
955 }
956}
957/* === Toolbar === */
958.toolbar {
959 width: 100%;
960 position: relative;
961 margin: 0;
962 -webkit-transform: translate3d(0, 0, 0);
963 transform: translate3d(0, 0, 0);
964 -webkit-backface-visibility: hidden;
965 backface-visibility: hidden;
966 z-index: 500;
967 -webkit-box-sizing: border-box;
968 box-sizing: border-box;
969 left: 0;
970}
971.toolbar b {
972 font-weight: 500;
973}
974.toolbar a {
975 -webkit-box-sizing: border-box;
976 box-sizing: border-box;
977 -webkit-flex-shrink: 1;
978 -ms-flex-negative: 1;
979 flex-shrink: 1;
980 position: relative;
981 white-space: nowrap;
982 text-overflow: ellipsis;
983}
984.toolbar a.link {
985 display: -webkit-box;
986 display: -webkit-flex;
987 display: -ms-flexbox;
988 display: flex;
989}
990.toolbar i.icon {
991 display: block;
992}
993.toolbar-inner {
994 position: absolute;
995 left: 0;
996 top: 0;
997 width: 100%;
998 height: 100%;
999 display: -webkit-box;
1000 display: -webkit-flex;
1001 display: -ms-flexbox;
1002 display: flex;
1003 -webkit-box-pack: justify;
1004 -webkit-justify-content: space-between;
1005 -ms-flex-pack: justify;
1006 justify-content: space-between;
1007 -webkit-box-sizing: border-box;
1008 box-sizing: border-box;
1009 -webkit-box-align: center;
1010 -webkit-align-items: center;
1011 -ms-flex-align: center;
1012 align-items: center;
1013 -webkit-align-content: center;
1014 -ms-flex-line-pack: center;
1015 align-content: center;
1016}
1017.views > .tabbar,
1018.views > .tabbar-labels {
1019 z-index: 5001;
1020}
1021.tabbar a.link,
1022.tabbar-labels a.link {
1023 line-height: 1.4;
1024}
1025.tabbar a.tab-link,
1026.tabbar-labels a.tab-link,
1027.tabbar a.link,
1028.tabbar-labels a.link {
1029 height: 100%;
1030 width: 100%;
1031 -webkit-box-sizing: border-box;
1032 box-sizing: border-box;
1033 display: -webkit-box;
1034 display: -webkit-flex;
1035 display: -ms-flexbox;
1036 display: flex;
1037 -webkit-box-pack: center;
1038 -webkit-justify-content: center;
1039 -ms-flex-pack: center;
1040 justify-content: center;
1041 -webkit-box-align: center;
1042 -webkit-align-items: center;
1043 -ms-flex-align: center;
1044 align-items: center;
1045 -webkit-box-orient: vertical;
1046 -webkit-box-direction: normal;
1047 -webkit-flex-direction: column;
1048 -ms-flex-direction: column;
1049 flex-direction: column;
1050}
1051.tabbar-labels a.tab-link,
1052.tabbar-labels a.link {
1053 height: 100%;
1054 -webkit-box-pack: justify;
1055 -webkit-justify-content: space-between;
1056 -ms-flex-pack: justify;
1057 justify-content: space-between;
1058 -webkit-box-align: center;
1059 -webkit-align-items: center;
1060 -ms-flex-align: center;
1061 align-items: center;
1062}
1063.tabbar-labels a.tab-link .tabbar-label,
1064.tabbar-labels a.link .tabbar-label {
1065 display: block;
1066 line-height: 1;
1067 margin: 0;
1068 position: relative;
1069 text-overflow: ellipsis;
1070 white-space: nowrap;
1071}
1072.tabbar-scrollable .toolbar-inner {
1073 overflow: auto;
1074 -webkit-overflow-scrolling: touch;
1075}
1076.tabbar-scrollable .toolbar-inner::-webkit-scrollbar {
1077 display: none !important;
1078 width: 0 !important;
1079 height: 0 !important;
1080 -webkit-appearance: none;
1081 opacity: 0 !important;
1082}
1083.tabbar-scrollable a.tab-link,
1084.tabbar-scrollable a.link {
1085 width: auto;
1086 -webkit-flex-shrink: 0;
1087 -ms-flex-negative: 0;
1088 flex-shrink: 0;
1089}
1090.views > .toolbar,
1091.view > .toolbar,
1092.page > .toolbar {
1093 position: absolute;
1094}
1095.ios .toolbar {
1096 height: 44px;
1097 font-size: 17px;
1098 background: #f7f7f8;
1099 bottom: 0;
1100}
1101.ios .toolbar:after {
1102 -webkit-backface-visibility: hidden;
1103 backface-visibility: hidden;
1104}
1105.ios .toolbar a.link {
1106 line-height: 44px;
1107 height: 44px;
1108}
1109.ios .toolbar a.link i + span,
1110.ios .toolbar a.link i + i,
1111.ios .toolbar a.link span + i,
1112.ios .toolbar a.link span + span {
1113 margin-left: 7px;
1114}
1115.ios .toolbar a.icon-only {
1116 min-height: 44px;
1117 display: -webkit-box;
1118 display: -webkit-flex;
1119 display: -ms-flexbox;
1120 display: flex;
1121 -webkit-box-pack: center;
1122 -webkit-justify-content: center;
1123 -ms-flex-pack: center;
1124 justify-content: center;
1125 -webkit-box-align: center;
1126 -webkit-align-items: center;
1127 -ms-flex-align: center;
1128 align-items: center;
1129 margin: 0;
1130 min-width: 44px;
1131}
1132.ios .toolbar b {
1133 font-weight: 600;
1134}
1135.ios .toolbar.no-hairline:before {
1136 display: none !important;
1137}
1138.ios .toolbar:before {
1139 content: '';
1140 position: absolute;
1141 background-color: #c4c4c4;
1142 display: block;
1143 z-index: 15;
1144 top: 0;
1145 right: auto;
1146 bottom: auto;
1147 left: 0;
1148 height: 1px;
1149 width: 100%;
1150 -webkit-transform-origin: 50% 0%;
1151 transform-origin: 50% 0%;
1152}
1153.ios.device-pixel-ratio-2 .toolbar:before {
1154 -webkit-transform: scaleY(0.5);
1155 transform: scaleY(0.5);
1156}
1157.ios.device-pixel-ratio-3 .toolbar:before {
1158 -webkit-transform: scaleY(0.33);
1159 transform: scaleY(0.33);
1160}
1161.ios .toolbar-inner {
1162 padding: 0 8px;
1163}
1164.ios .tabbar,
1165.ios .tabbar-labels {
1166 color: #929292;
1167}
1168.ios .tabbar a,
1169.ios .tabbar-labels a {
1170 color: #929292;
1171}
1172.ios .tabbar a.tab-link-active,
1173.ios .tabbar-labels a.tab-link-active {
1174 color: #007aff;
1175}
1176.ios .tabbar i.icon,
1177.ios .tabbar-labels i.icon {
1178 height: 30px;
1179}
1180.ios .tabbar-labels {
1181 height: 50px;
1182}
1183.ios .tabbar-labels a.tab-link,
1184.ios .tabbar-labels a.link {
1185 padding-top: 4px;
1186 padding-bottom: 4px;
1187}
1188.ios .tabbar-labels a.tab-link i + span,
1189.ios .tabbar-labels a.link i + span {
1190 margin: 0;
1191}
1192.ios .tabbar-labels .tabbar-label {
1193 letter-spacing: 0.01em;
1194 font-size: 10px;
1195}
1196@media (min-width: 768px) {
1197 .ios .tabbar .toolbar-inner,
1198 .ios .tabbar-labels .toolbar-inner {
1199 -webkit-box-pack: center;
1200 -webkit-justify-content: center;
1201 -ms-flex-pack: center;
1202 justify-content: center;
1203 }
1204 .ios .tabbar a.tab-link,
1205 .ios .tabbar-labels a.tab-link,
1206 .ios .tabbar a.link,
1207 .ios .tabbar-labels a.link {
1208 width: auto;
1209 min-width: 105px;
1210 }
1211 .ios .tabbar-labels {
1212 height: 56px;
1213 }
1214 .ios .tabbar-labels .tabbar-label {
1215 font-size: 14px;
1216 }
1217}
1218.ios .tabbar-scrollable .toolbar-inner {
1219 -webkit-box-pack: start;
1220 -webkit-justify-content: flex-start;
1221 -ms-flex-pack: start;
1222 justify-content: flex-start;
1223}
1224.ios .tabbar-scrollable a.tab-link,
1225.ios .tabbar-scrollable a.link {
1226 padding: 0 8px;
1227}
1228.ios .toolbar ~ * .page-content,
1229.ios .toolbar ~ .page-content {
1230 padding-bottom: 44px;
1231}
1232.ios .tabbar-labels ~ * .page-content,
1233.ios .tabbar-labels ~ .page-content {
1234 padding-bottom: 50px;
1235}
1236@media (min-width: 768px) {
1237 .ios .tabbar-labels ~ * .page-content,
1238 .ios .tabbar-labels ~ .page-content {
1239 padding-bottom: 56px;
1240 }
1241}
1242.ios .toolbar-transitioning {
1243 -webkit-transition-duration: 400ms;
1244 transition-duration: 400ms;
1245}
1246.ios .toolbar-hidden {
1247 -webkit-transform: translate3d(0, 100%, 0);
1248 transform: translate3d(0, 100%, 0);
1249}
1250.ios .theme-dark .toolbar,
1251.toolbar.ios .theme-dark {
1252 background: #1b1b1b;
1253}
1254.ios .theme-dark .toolbar:before,
1255.toolbar.ios .theme-dark:before {
1256 background-color: #282829;
1257}
1258.ios .color-theme-red .tabbar a.tab-link-active,
1259.ios .color-theme-red .tabbar-labels a.tab-link-active,
1260.ios .color-theme-red.tabbar-labels a.tab-link-active,
1261.ios .color-theme-red.tabbar a.tab-link-active {
1262 color: #ff3b30;
1263}
1264.ios .color-theme-green .tabbar a.tab-link-active,
1265.ios .color-theme-green .tabbar-labels a.tab-link-active,
1266.ios .color-theme-green.tabbar-labels a.tab-link-active,
1267.ios .color-theme-green.tabbar a.tab-link-active {
1268 color: #4cd964;
1269}
1270.ios .color-theme-blue .tabbar a.tab-link-active,
1271.ios .color-theme-blue .tabbar-labels a.tab-link-active,
1272.ios .color-theme-blue.tabbar-labels a.tab-link-active,
1273.ios .color-theme-blue.tabbar a.tab-link-active {
1274 color: #007aff;
1275}
1276.ios .color-theme-pink .tabbar a.tab-link-active,
1277.ios .color-theme-pink .tabbar-labels a.tab-link-active,
1278.ios .color-theme-pink.tabbar-labels a.tab-link-active,
1279.ios .color-theme-pink.tabbar a.tab-link-active {
1280 color: #ff2d55;
1281}
1282.ios .color-theme-yellow .tabbar a.tab-link-active,
1283.ios .color-theme-yellow .tabbar-labels a.tab-link-active,
1284.ios .color-theme-yellow.tabbar-labels a.tab-link-active,
1285.ios .color-theme-yellow.tabbar a.tab-link-active {
1286 color: #ffcc00;
1287}
1288.ios .color-theme-orange .tabbar a.tab-link-active,
1289.ios .color-theme-orange .tabbar-labels a.tab-link-active,
1290.ios .color-theme-orange.tabbar-labels a.tab-link-active,
1291.ios .color-theme-orange.tabbar a.tab-link-active {
1292 color: #ff9500;
1293}
1294.ios .color-theme-gray .tabbar a.tab-link-active,
1295.ios .color-theme-gray .tabbar-labels a.tab-link-active,
1296.ios .color-theme-gray.tabbar-labels a.tab-link-active,
1297.ios .color-theme-gray.tabbar a.tab-link-active {
1298 color: #8e8e93;
1299}
1300.ios .color-theme-white .tabbar a.tab-link-active,
1301.ios .color-theme-white .tabbar-labels a.tab-link-active,
1302.ios .color-theme-white.tabbar-labels a.tab-link-active,
1303.ios .color-theme-white.tabbar a.tab-link-active {
1304 color: #ffffff;
1305}
1306.ios .color-theme-black .tabbar a.tab-link-active,
1307.ios .color-theme-black .tabbar-labels a.tab-link-active,
1308.ios .color-theme-black.tabbar-labels a.tab-link-active,
1309.ios .color-theme-black.tabbar a.tab-link-active {
1310 color: #000000;
1311}
1312.ios .tabbar-labels.color-red a.tab-link-active,
1313.ios .tabbar.color-red a.tab-link-active {
1314 color: #ff3b30;
1315}
1316.ios .tabbar-labels.color-green a.tab-link-active,
1317.ios .tabbar.color-green a.tab-link-active {
1318 color: #4cd964;
1319}
1320.ios .tabbar-labels.color-blue a.tab-link-active,
1321.ios .tabbar.color-blue a.tab-link-active {
1322 color: #007aff;
1323}
1324.ios .tabbar-labels.color-pink a.tab-link-active,
1325.ios .tabbar.color-pink a.tab-link-active {
1326 color: #ff2d55;
1327}
1328.ios .tabbar-labels.color-yellow a.tab-link-active,
1329.ios .tabbar.color-yellow a.tab-link-active {
1330 color: #ffcc00;
1331}
1332.ios .tabbar-labels.color-orange a.tab-link-active,
1333.ios .tabbar.color-orange a.tab-link-active {
1334 color: #ff9500;
1335}
1336.ios .tabbar-labels.color-gray a.tab-link-active,
1337.ios .tabbar.color-gray a.tab-link-active {
1338 color: #8e8e93;
1339}
1340.ios .tabbar-labels.color-white a.tab-link-active,
1341.ios .tabbar.color-white a.tab-link-active {
1342 color: #ffffff;
1343}
1344.ios .tabbar-labels.color-black a.tab-link-active,
1345.ios .tabbar.color-black a.tab-link-active {
1346 color: #000000;
1347}
1348.ios.device-iphone-x .views > .toolbar,
1349.ios.device-iphone-x .view > .toolbar,
1350.ios.device-iphone-x .page > .toolbar,
1351.ios.device-iphone-x .popup > .toolbar,
1352.ios.device-iphone-x .panel > .toolbar,
1353.ios.device-iphone-x .login-screen > .toolbar {
1354 height: calc(44px + constant(safe-area-inset-bottom));
1355 height: calc(44px + env(safe-area-inset-bottom));
1356}
1357.ios.device-iphone-x .views > .toolbar .toolbar-inner,
1358.ios.device-iphone-x .view > .toolbar .toolbar-inner,
1359.ios.device-iphone-x .page > .toolbar .toolbar-inner,
1360.ios.device-iphone-x .popup > .toolbar .toolbar-inner,
1361.ios.device-iphone-x .panel > .toolbar .toolbar-inner,
1362.ios.device-iphone-x .login-screen > .toolbar .toolbar-inner {
1363 height: auto;
1364 bottom: constant(safe-area-inset-bottom);
1365 bottom: env(safe-area-inset-bottom);
1366}
1367.ios.device-iphone-x .views > .tabbar-labels,
1368.ios.device-iphone-x .view > .tabbar-labels,
1369.ios.device-iphone-x .page > .tabbar-labels,
1370.ios.device-iphone-x .popup > .tabbar-labels,
1371.ios.device-iphone-x .panel > .tabbar-labels,
1372.ios.device-iphone-x .login-screen > .tabbar-labels {
1373 height: calc(50px + constant(safe-area-inset-bottom));
1374 height: calc(50px + env(safe-area-inset-bottom));
1375}
1376@media (min-width: 768px) {
1377 .ios.device-iphone-x .views > .tabbar-labels,
1378 .ios.device-iphone-x .view > .tabbar-labels,
1379 .ios.device-iphone-x .page > .tabbar-labels,
1380 .ios.device-iphone-x .popup > .tabbar-labels,
1381 .ios.device-iphone-x .panel > .tabbar-labels,
1382 .ios.device-iphone-x .login-screen > .tabbar-labels {
1383 height: calc(56px + constant(safe-area-inset-bottom));
1384 height: calc(56px + env(safe-area-inset-bottom));
1385 }
1386}
1387.ios.device-iphone-x .toolbar ~ * .page-content,
1388.ios.device-iphone-x .toolbar ~ .page-content {
1389 padding-bottom: calc(44px + constant(safe-area-inset-bottom));
1390 padding-bottom: calc(44px + env(safe-area-inset-bottom));
1391}
1392.ios.device-iphone-x .tabbar-labels ~ * .page-content,
1393.ios.device-iphone-x .tabbar-labels ~ .page-content {
1394 padding-bottom: calc(50px + constant(safe-area-inset-bottom));
1395 padding-bottom: calc(50px + env(safe-area-inset-bottom));
1396}
1397@media (min-width: 768px) {
1398 .ios.device-iphone-x .tabbar-labels ~ * .page-content,
1399 .ios.device-iphone-x .tabbar-labels ~ .page-content {
1400 padding-bottom: calc(56px + constant(safe-area-inset-bottom));
1401 padding-bottom: calc(56px + env(safe-area-inset-bottom));
1402 }
1403}
1404@media (orientation: landscape) {
1405 .ios.device-iphone-x .ios-left-edge .toolbar-inner,
1406 .ios.device-iphone-x .ios-edges .toolbar-inner,
1407 .ios.device-iphone-x .popup .toolbar-inner,
1408 .ios.device-iphone-x .sheet-modal .toolbar-inner,
1409 .ios.device-iphone-x .panel-left .toolbar-inner {
1410 padding-left: calc(8px + constant(safe-area-inset-left));
1411 padding-left: calc(8px + env(safe-area-inset-left));
1412 }
1413 .ios.device-iphone-x .ios-right-edge .toolbar-inner,
1414 .ios.device-iphone-x .ios-edges .toolbar-inner,
1415 .ios.device-iphone-x .popup .toolbar-inner,
1416 .ios.device-iphone-x .sheet-modal .toolbar-inner,
1417 .ios.device-iphone-x .panel-right .toolbar-inner {
1418 padding-right: calc(8px + constant(safe-area-inset-right));
1419 padding-right: calc(8px + env(safe-area-inset-right));
1420 }
1421}
1422/* === Subnavbar === */
1423.subnavbar {
1424 width: 100%;
1425 position: absolute;
1426 left: 0;
1427 top: 0;
1428 z-index: 500;
1429 -webkit-box-sizing: border-box;
1430 box-sizing: border-box;
1431 display: -webkit-box;
1432 display: -webkit-flex;
1433 display: -ms-flexbox;
1434 display: flex;
1435 -webkit-box-pack: justify;
1436 -webkit-justify-content: space-between;
1437 -ms-flex-pack: justify;
1438 justify-content: space-between;
1439 -webkit-box-align: center;
1440 -webkit-align-items: center;
1441 -ms-flex-align: center;
1442 align-items: center;
1443}
1444.subnavbar .title {
1445 position: relative;
1446 overflow: hidden;
1447 text-overflow: ellpsis;
1448 white-space: nowrap;
1449}
1450.subnavbar .left,
1451.subnavbar .right {
1452 -webkit-flex-shrink: 0;
1453 -ms-flex-negative: 0;
1454 flex-shrink: 0;
1455 display: -webkit-box;
1456 display: -webkit-flex;
1457 display: -ms-flexbox;
1458 display: flex;
1459 -webkit-box-pack: start;
1460 -webkit-justify-content: flex-start;
1461 -ms-flex-pack: start;
1462 justify-content: flex-start;
1463 -webkit-box-align: center;
1464 -webkit-align-items: center;
1465 -ms-flex-align: center;
1466 align-items: center;
1467}
1468.subnavbar .right:first-child {
1469 position: absolute;
1470 height: 100%;
1471}
1472.subnavbar-inner {
1473 width: 100%;
1474 height: 100%;
1475 display: -webkit-box;
1476 display: -webkit-flex;
1477 display: -ms-flexbox;
1478 display: flex;
1479 -webkit-box-align: center;
1480 -webkit-align-items: center;
1481 -ms-flex-align: center;
1482 align-items: center;
1483 -webkit-box-sizing: border-box;
1484 box-sizing: border-box;
1485 -webkit-box-pack: justify;
1486 -webkit-justify-content: space-between;
1487 -ms-flex-pack: justify;
1488 justify-content: space-between;
1489 overflow: hidden;
1490}
1491.subnavbar-inner.stacked {
1492 display: none;
1493}
1494.navbar .subnavbar {
1495 top: 100%;
1496}
1497.views > .navbar,
1498.view > .navbar,
1499.page > .navbar {
1500 position: absolute;
1501}
1502.ios .subnavbar {
1503 height: 45px;
1504 margin-top: -1px;
1505 padding-top: 1px;
1506 background: #f7f7f8;
1507}
1508.ios .subnavbar.no-hairline:after {
1509 display: none !important;
1510}
1511.ios .subnavbar .title {
1512 font-weight: 700;
1513 line-height: 1;
1514 overflow: visible;
1515 font-size: 34px;
1516 text-align: center;
1517 display: -webkit-box;
1518 display: -webkit-flex;
1519 display: -ms-flexbox;
1520 display: flex;
1521 -webkit-box-align: center;
1522 -webkit-align-items: center;
1523 -ms-flex-align: center;
1524 align-items: center;
1525 -webkit-align-self: flex-start;
1526 -ms-flex-item-align: start;
1527 align-self: flex-start;
1528 -webkit-flex-shrink: 10;
1529 -ms-flex-negative: 10;
1530 flex-shrink: 10;
1531 letter-spacing: -0.03em;
1532}
1533.ios .subnavbar .title {
1534 margin-left: 7px;
1535}
1536.ios .subnavbar .left a + a,
1537.ios .subnavbar .right a + a {
1538 margin-left: 15px;
1539}
1540.ios .subnavbar .left {
1541 margin-right: 10px;
1542}
1543.ios .subnavbar .right {
1544 margin-left: 10px;
1545}
1546.ios .subnavbar .right:first-child {
1547 right: 8px;
1548}
1549.ios .subnavbar a.link {
1550 line-height: 44px;
1551 height: 44px;
1552 -webkit-box-pack: start;
1553 -webkit-justify-content: flex-start;
1554 -ms-flex-pack: start;
1555 justify-content: flex-start;
1556}
1557.ios .subnavbar a.icon-only {
1558 min-width: 44px;
1559 -webkit-box-pack: center;
1560 -webkit-justify-content: center;
1561 -ms-flex-pack: center;
1562 justify-content: center;
1563 margin: 0;
1564}
1565.ios .subnavbar:after {
1566 content: '';
1567 position: absolute;
1568 background-color: #c4c4c4;
1569 display: block;
1570 z-index: 15;
1571 top: auto;
1572 right: auto;
1573 bottom: 0;
1574 left: 0;
1575 height: 1px;
1576 width: 100%;
1577 -webkit-transform-origin: 50% 100%;
1578 transform-origin: 50% 100%;
1579}
1580.ios.device-pixel-ratio-2 .subnavbar:after {
1581 -webkit-transform: scaleY(0.5);
1582 transform: scaleY(0.5);
1583}
1584.ios.device-pixel-ratio-3 .subnavbar:after {
1585 -webkit-transform: scaleY(0.33);
1586 transform: scaleY(0.33);
1587}
1588.ios .subnavbar-inner {
1589 padding: 0 8px;
1590}
1591.ios .navbar ~ .page-with-subnavbar:not(.no-navbar) .subnavbar,
1592.ios .navbar ~ .subnavbar {
1593 top: 44px;
1594}
1595.ios .page-with-subnavbar .page-content,
1596.ios .subnavbar ~ .page-content,
1597.ios .subnavbar ~ * .page-content {
1598 padding-top: 44px;
1599}
1600.ios .navbar ~ .page-with-subnavbar:not(.no-navbar) .page-content,
1601.ios .page-with-subnavbar .navbar ~ .page-content,
1602.ios .navbar ~ *:not(.no-navbar) .subnavbar ~ .page-content,
1603.ios .navbar ~ *:not(.no-navbar) .subnavbar ~ * .page-content {
1604 padding-top: 88px;
1605}
1606.ios .theme-dark .subnavbar,
1607.subnavbar.ios .theme-dark {
1608 background: #1b1b1b;
1609}
1610.ios .theme-dark .subnavbar:after,
1611.subnavbar.ios .theme-dark:after {
1612 background-color: #282829;
1613}
1614@media (orientation: landscape) {
1615 .ios.device-iphone-x .ios-left-edge .subnavbar-inner,
1616 .ios.device-iphone-x .ios-edges .subnavbar-inner,
1617 .ios.device-iphone-x .popup .subnavbar-inner,
1618 .ios.device-iphone-x .sheet-modal .subnavbar-inner,
1619 .ios.device-iphone-x .panel-left .subnavbar-inner {
1620 padding-left: calc(8px + constant(safe-area-inset-left));
1621 padding-left: calc(8px + env(safe-area-inset-left));
1622 }
1623 .ios.device-iphone-x .ios-right-edge .subnavbar-inner,
1624 .ios.device-iphone-x .ios-edges .subnavbar-inner,
1625 .ios.device-iphone-x .popup .subnavbar-inner,
1626 .ios.device-iphone-x .sheet-modal .subnavbar-inner,
1627 .ios.device-iphone-x .panel-right .subnavbar-inner {
1628 padding-right: calc(8px + constant(safe-area-inset-right));
1629 padding-right: calc(8px + env(safe-area-inset-right));
1630 }
1631}
1632/* === Content Block === */
1633.block {
1634 -webkit-box-sizing: border-box;
1635 box-sizing: border-box;
1636 position: relative;
1637 z-index: 1;
1638}
1639.block.no-hairlines:before,
1640.block.no-hairlines ul:before,
1641.md .block.no-hairlines-md:before,
1642.md .block.no-hairlines-md ul:before,
1643.ios .block.no-hairlines-ios:before,
1644.ios .block.no-hairlines-ios ul:before {
1645 display: none !important;
1646}
1647.block.no-hairlines:after,
1648.block.no-hairlines ul:after,
1649.md .block.no-hairlines-md:after,
1650.md .block.no-hairlines-md ul:after,
1651.ios .block.no-hairlines-ios:after,
1652.ios .block.no-hairlines-ios ul:after {
1653 display: none !important;
1654}
1655.block.no-hairline-top:before,
1656.block.no-hairline-top ul:before,
1657.md .block.no-hairline-top-md:before,
1658.md .block.no-hairline-top-md ul:before,
1659.ios .block.no-hairline-top-ios:before,
1660.ios .block.no-hairline-top-ios ul:before {
1661 display: none !important;
1662}
1663.block.no-hairline-bottom:after,
1664.block.no-hairline-bottom ul:after,
1665.md .block.no-hairline-bottom-md:after,
1666.md .block.no-hairline-bottom-md ul:after,
1667.ios .block.no-hairline-bottom-ios:after,
1668.ios .block.no-hairline-bottom-ios ul:after {
1669 display: none !important;
1670}
1671.block > h1:first-child,
1672.block > h2:first-child,
1673.block > h3:first-child,
1674.block > h4:first-child,
1675.block > p:first-child {
1676 margin-top: 0;
1677}
1678.block > h1:last-child,
1679.block > h2:last-child,
1680.block > h3:last-child,
1681.block > h4:last-child,
1682.block > p:last-child {
1683 margin-bottom: 0;
1684}
1685.block-title {
1686 position: relative;
1687 overflow: hidden;
1688 margin: 0;
1689 white-space: nowrap;
1690 text-overflow: ellipsis;
1691 font-size: 14px;
1692 line-height: 1;
1693}
1694.block-strong.inset {
1695 border-radius: 7px;
1696}
1697.block-strong.inset:before {
1698 display: none !important;
1699}
1700.block-strong.inset:after {
1701 display: none !important;
1702}
1703.block-footer,
1704.block-header {
1705 font-size: 14px;
1706}
1707.block-footer ul:first-child,
1708.block-header ul:first-child,
1709.block-footer p:first-child,
1710.block-header p:first-child,
1711.block-footer h1:first-child,
1712.block-header h1:first-child,
1713.block-footer h2:first-child,
1714.block-header h2:first-child,
1715.block-footer h3:first-child,
1716.block-header h3:first-child,
1717.block-footer h4:first-child,
1718.block-header h4:first-child {
1719 margin-top: 0;
1720}
1721.block-footer ul:last-child,
1722.block-header ul:last-child,
1723.block-footer p:last-child,
1724.block-header p:last-child,
1725.block-footer h1:last-child,
1726.block-header h1:last-child,
1727.block-footer h2:last-child,
1728.block-header h2:last-child,
1729.block-footer h3:last-child,
1730.block-header h3:last-child,
1731.block-footer h4:last-child,
1732.block-header h4:last-child {
1733 margin-bottom: 0;
1734}
1735.block-footer ul:first-child:last-child,
1736.block-header ul:first-child:last-child,
1737.block-footer p:first-child:last-child,
1738.block-header p:first-child:last-child,
1739.block-footer h1:first-child:last-child,
1740.block-header h1:first-child:last-child,
1741.block-footer h2:first-child:last-child,
1742.block-header h2:first-child:last-child,
1743.block-footer h3:first-child:last-child,
1744.block-header h3:first-child:last-child,
1745.block-footer h4:first-child:last-child,
1746.block-header h4:first-child:last-child {
1747 margin-top: 0;
1748 margin-bottom: 0;
1749}
1750.block-header {
1751 margin-bottom: 10px;
1752}
1753.block-footer {
1754 margin-top: 10px;
1755}
1756@media (min-width: 768px) {
1757 .block-strong.tablet-inset:before {
1758 display: none !important;
1759 }
1760 .block-strong.tablet-inset:after {
1761 display: none !important;
1762 }
1763}
1764/* === Content Block === */
1765.ios .block {
1766 margin: 35px 0;
1767 padding: 0 15px;
1768 color: #6d6d72;
1769}
1770.ios .block-title {
1771 text-transform: uppercase;
1772 color: #6d6d72;
1773 margin: 35px 15px 10px;
1774 line-height: 17px;
1775}
1776.ios .block-title + .list,
1777.ios .block-title + .block,
1778.ios .block-title + .card,
1779.ios .block-title + .timeline,
1780.ios .block-title + .block-header {
1781 margin-top: 10px;
1782}
1783.ios .block-strong {
1784 color: #000;
1785 background: #fff;
1786 padding: 15px 15px;
1787}
1788.ios .block-strong:before {
1789 content: '';
1790 position: absolute;
1791 background-color: #c8c7cc;
1792 display: block;
1793 z-index: 15;
1794 top: 0;
1795 right: auto;
1796 bottom: auto;
1797 left: 0;
1798 height: 1px;
1799 width: 100%;
1800 -webkit-transform-origin: 50% 0%;
1801 transform-origin: 50% 0%;
1802}
1803.ios.device-pixel-ratio-2 .block-strong:before {
1804 -webkit-transform: scaleY(0.5);
1805 transform: scaleY(0.5);
1806}
1807.ios.device-pixel-ratio-3 .block-strong:before {
1808 -webkit-transform: scaleY(0.33);
1809 transform: scaleY(0.33);
1810}
1811.ios .block-strong:after {
1812 content: '';
1813 position: absolute;
1814 background-color: #c8c7cc;
1815 display: block;
1816 z-index: 15;
1817 top: auto;
1818 right: auto;
1819 bottom: 0;
1820 left: 0;
1821 height: 1px;
1822 width: 100%;
1823 -webkit-transform-origin: 50% 100%;
1824 transform-origin: 50% 100%;
1825}
1826.ios.device-pixel-ratio-2 .block-strong:after {
1827 -webkit-transform: scaleY(0.5);
1828 transform: scaleY(0.5);
1829}
1830.ios.device-pixel-ratio-3 .block-strong:after {
1831 -webkit-transform: scaleY(0.33);
1832 transform: scaleY(0.33);
1833}
1834.ios .block.inset {
1835 margin-left: 15px;
1836 margin-right: 15px;
1837}
1838.ios .block-strong-inset {
1839 border-radius: 7px;
1840}
1841.ios .block-header,
1842.ios .block-footer {
1843 padding: 0 15px;
1844 color: #8f8f94;
1845}
1846.ios .block .block-header,
1847.ios .block .block-footer {
1848 padding: 0 !important;
1849}
1850.ios .block-header {
1851 margin-top: 35px;
1852}
1853.ios .block-header + .list,
1854.ios .block-header + .block,
1855.ios .block-header + .card,
1856.ios .block-header + .timeline {
1857 margin-top: 10px;
1858}
1859.ios .block-footer {
1860 margin-bottom: 35px;
1861}
1862.ios .list .block-header,
1863.ios .block .block-header,
1864.ios .card .block-header,
1865.ios .timeline .block-header {
1866 margin-top: 0;
1867}
1868.ios .list .block-footer,
1869.ios .block .block-footer,
1870.ios .card .block-footer,
1871.ios .timeline .block-footer {
1872 margin-bottom: 0;
1873}
1874.ios .list + .block-footer,
1875.ios .block + .block-footer,
1876.ios .card + .block-footer,
1877.ios .timeline + .block-footer {
1878 margin-top: -25px;
1879}
1880.ios .block + .block-footer {
1881 margin-top: -25px;
1882 margin-bottom: 35px;
1883}
1884@media (min-width: 768px) {
1885 .ios .block.tablet-inset {
1886 margin-left: 15px;
1887 margin-right: 15px;
1888 border-radius: 7px;
1889 }
1890 .ios .block-strong.tablet-inset {
1891 border-radius: 7px;
1892 }
1893}
1894.ios .theme-dark .block-title,
1895.ios .theme-dark .block-header,
1896.ios .theme-dark .block-footer {
1897 color: #8E8E93;
1898}
1899.ios .theme-dark .block {
1900 color: #8E8E93;
1901}
1902.ios .theme-dark .block-strong,
1903.ios .theme-dark.block-strong {
1904 background-color: #1c1c1d;
1905 color: #fff;
1906}
1907.ios .theme-dark .block-strong:before,
1908.ios .theme-dark.block-strong:before {
1909 background-color: #282829;
1910}
1911.ios .theme-dark .block-strong:after,
1912.ios .theme-dark.block-strong:after {
1913 background-color: #282829;
1914}
1915@media (orientation: landscape) {
1916 .ios.device-iphone-x .ios-left-edge .block:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge),
1917 .ios.device-iphone-x .ios-edges .block:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge),
1918 .ios.device-iphone-x .popup .block:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge),
1919 .ios.device-iphone-x .sheet-modal .block:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge),
1920 .ios.device-iphone-x .panel-left .block:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge),
1921 .ios.device-iphone-x .ios-left-edge .block-header,
1922 .ios.device-iphone-x .ios-edges .block-header,
1923 .ios.device-iphone-x .popup .block-header,
1924 .ios.device-iphone-x .sheet-modal .block-header,
1925 .ios.device-iphone-x .panel-left .block-header,
1926 .ios.device-iphone-x .ios-left-edge .block-footer,
1927 .ios.device-iphone-x .ios-edges .block-footer,
1928 .ios.device-iphone-x .popup .block-footer,
1929 .ios.device-iphone-x .sheet-modal .block-footer,
1930 .ios.device-iphone-x .panel-left .block-footer {
1931 padding-left: calc(15px + constant(safe-area-inset-left));
1932 padding-left: calc(15px + env(safe-area-inset-left));
1933 }
1934 .ios.device-iphone-x .ios-left-edge .block:not(.no-ios-edges):not(.no-ios-left-edge) .block-header,
1935 .ios.device-iphone-x .ios-edges .block:not(.no-ios-edges):not(.no-ios-left-edge) .block-header,
1936 .ios.device-iphone-x .popup .block:not(.no-ios-edges):not(.no-ios-left-edge) .block-header,
1937 .ios.device-iphone-x .sheet-modal .block:not(.no-ios-edges):not(.no-ios-left-edge) .block-header,
1938 .ios.device-iphone-x .panel-left .block:not(.no-ios-edges):not(.no-ios-left-edge) .block-header,
1939 .ios.device-iphone-x .ios-left-edge .block:not(.no-ios-edges):not(.no-ios-left-edge) .block-footer,
1940 .ios.device-iphone-x .ios-edges .block:not(.no-ios-edges):not(.no-ios-left-edge) .block-footer,
1941 .ios.device-iphone-x .popup .block:not(.no-ios-edges):not(.no-ios-left-edge) .block-footer,
1942 .ios.device-iphone-x .sheet-modal .block:not(.no-ios-edges):not(.no-ios-left-edge) .block-footer,
1943 .ios.device-iphone-x .panel-left .block:not(.no-ios-edges):not(.no-ios-left-edge) .block-footer {
1944 padding-left: 0;
1945 }
1946 .ios.device-iphone-x .ios-left-edge .block.inset:not(.no-ios-edges):not(.no-ios-left-edge),
1947 .ios.device-iphone-x .ios-edges .block.inset:not(.no-ios-edges):not(.no-ios-left-edge),
1948 .ios.device-iphone-x .popup .block.inset:not(.no-ios-edges):not(.no-ios-left-edge),
1949 .ios.device-iphone-x .sheet-modal .block.inset:not(.no-ios-edges):not(.no-ios-left-edge),
1950 .ios.device-iphone-x .panel-left .block.inset:not(.no-ios-edges):not(.no-ios-left-edge),
1951 .ios.device-iphone-x .ios-left-edge .block-title:not(.no-ios-edges):not(.no-ios-left-edge),
1952 .ios.device-iphone-x .ios-edges .block-title:not(.no-ios-edges):not(.no-ios-left-edge),
1953 .ios.device-iphone-x .popup .block-title:not(.no-ios-edges):not(.no-ios-left-edge),
1954 .ios.device-iphone-x .sheet-modal .block-title:not(.no-ios-edges):not(.no-ios-left-edge),
1955 .ios.device-iphone-x .panel-left .block-title:not(.no-ios-edges):not(.no-ios-left-edge) {
1956 margin-left: calc(15px + constant(safe-area-inset-left));
1957 margin-left: calc(15px + env(safe-area-inset-left));
1958 }
1959 .ios.device-iphone-x .ios-right-edge .block:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge),
1960 .ios.device-iphone-x .ios-edges .block:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge),
1961 .ios.device-iphone-x .popup .block:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge),
1962 .ios.device-iphone-x .sheet-modal .block:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge),
1963 .ios.device-iphone-x .panel-right .block:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge),
1964 .ios.device-iphone-x .ios-right-edge .block-header,
1965 .ios.device-iphone-x .ios-edges .block-header,
1966 .ios.device-iphone-x .popup .block-header,
1967 .ios.device-iphone-x .sheet-modal .block-header,
1968 .ios.device-iphone-x .panel-right .block-header,
1969 .ios.device-iphone-x .ios-right-edge .block-footer,
1970 .ios.device-iphone-x .ios-edges .block-footer,
1971 .ios.device-iphone-x .popup .block-footer,
1972 .ios.device-iphone-x .sheet-modal .block-footer,
1973 .ios.device-iphone-x .panel-right .block-footer {
1974 padding-right: calc(15px + constant(safe-area-inset-right));
1975 padding-right: calc(15px + env(safe-area-inset-right));
1976 }
1977 .ios.device-iphone-x .ios-right-edge .block:not(.no-ios-edges):not(.no-ios-right-edge) .block-header,
1978 .ios.device-iphone-x .ios-edges .block:not(.no-ios-edges):not(.no-ios-right-edge) .block-header,
1979 .ios.device-iphone-x .popup .block:not(.no-ios-edges):not(.no-ios-right-edge) .block-header,
1980 .ios.device-iphone-x .sheet-modal .block:not(.no-ios-edges):not(.no-ios-right-edge) .block-header,
1981 .ios.device-iphone-x .panel-right .block:not(.no-ios-edges):not(.no-ios-right-edge) .block-header,
1982 .ios.device-iphone-x .ios-right-edge .block:not(.no-ios-edges):not(.no-ios-right-edge) .block-footer,
1983 .ios.device-iphone-x .ios-edges .block:not(.no-ios-edges):not(.no-ios-right-edge) .block-footer,
1984 .ios.device-iphone-x .popup .block:not(.no-ios-edges):not(.no-ios-right-edge) .block-footer,
1985 .ios.device-iphone-x .sheet-modal .block:not(.no-ios-edges):not(.no-ios-right-edge) .block-footer,
1986 .ios.device-iphone-x .panel-right .block:not(.no-ios-edges):not(.no-ios-right-edge) .block-footer {
1987 padding-right: 0;
1988 }
1989 .ios.device-iphone-x .ios-right-edge .block.inset:not(.no-ios-edges):not(.no-ios-right-edge),
1990 .ios.device-iphone-x .ios-edges .block.inset:not(.no-ios-edges):not(.no-ios-right-edge),
1991 .ios.device-iphone-x .popup .block.inset:not(.no-ios-edges):not(.no-ios-right-edge),
1992 .ios.device-iphone-x .sheet-modal .block.inset:not(.no-ios-edges):not(.no-ios-right-edge),
1993 .ios.device-iphone-x .panel-right .block.inset:not(.no-ios-edges):not(.no-ios-right-edge),
1994 .ios.device-iphone-x .ios-right-edge .block-title:not(.no-ios-edges):not(.no-ios-right-edge),
1995 .ios.device-iphone-x .ios-edges .block-title:not(.no-ios-edges):not(.no-ios-right-edge),
1996 .ios.device-iphone-x .popup .block-title:not(.no-ios-edges):not(.no-ios-right-edge),
1997 .ios.device-iphone-x .sheet-modal .block-title:not(.no-ios-edges):not(.no-ios-right-edge),
1998 .ios.device-iphone-x .panel-right .block-title:not(.no-ios-edges):not(.no-ios-right-edge) {
1999 margin-right: calc(15px + constant(safe-area-inset-right));
2000 margin-right: calc(15px + env(safe-area-inset-right));
2001 }
2002}
2003@media (orientation: landscape) and (min-width: 768px) {
2004 .ios.device-iphone-x .ios-left-edge .block.tablet-inset:not(.no-ios-edges):not(.no-ios-left-edge),
2005 .ios.device-iphone-x .ios-edges .block.tablet-inset:not(.no-ios-edges):not(.no-ios-left-edge),
2006 .ios.device-iphone-x .popup .block.tablet-inset:not(.no-ios-edges):not(.no-ios-left-edge),
2007 .ios.device-iphone-x .sheet-modal .block.tablet-inset:not(.no-ios-edges):not(.no-ios-left-edge),
2008 .ios.device-iphone-x .panel-left .block.tablet-inset:not(.no-ios-edges):not(.no-ios-left-edge) {
2009 margin-left: calc(15px + constant(safe-area-inset-left));
2010 margin-left: calc(15px + env(safe-area-inset-left));
2011 }
2012}
2013@media (orientation: landscape) and (min-width: 768px) {
2014 .ios.device-iphone-x .ios-right-edge .block.tablet-inset:not(.no-ios-edges):not(.no-ios-right-edge),
2015 .ios.device-iphone-x .ios-edges .block.tablet-inset:not(.no-ios-edges):not(.no-ios-right-edge),
2016 .ios.device-iphone-x .popup .block.tablet-inset:not(.no-ios-edges):not(.no-ios-right-edge),
2017 .ios.device-iphone-x .sheet-modal .block.tablet-inset:not(.no-ios-edges):not(.no-ios-right-edge),
2018 .ios.device-iphone-x .panel-right .block.tablet-inset:not(.no-ios-edges):not(.no-ios-right-edge) {
2019 margin-right: calc(15px + constant(safe-area-inset-right));
2020 margin-right: calc(15px + env(safe-area-inset-right));
2021 }
2022}
2023/* === List View === */
2024.list {
2025 position: relative;
2026 z-index: 1;
2027}
2028.list ul {
2029 list-style: none;
2030 margin: 0;
2031 padding: 0;
2032 position: relative;
2033}
2034.list ul ul:before {
2035 display: none !important;
2036}
2037.list ul ul:after {
2038 display: none !important;
2039}
2040.list li {
2041 position: relative;
2042 -webkit-box-sizing: border-box;
2043 box-sizing: border-box;
2044}
2045.list .item-media {
2046 display: -webkit-box;
2047 display: -webkit-flex;
2048 display: -ms-flexbox;
2049 display: flex;
2050 -webkit-flex-shrink: 0;
2051 -ms-flex-negative: 0;
2052 flex-shrink: 0;
2053 -webkit-flex-wrap: nowrap;
2054 -ms-flex-wrap: nowrap;
2055 flex-wrap: nowrap;
2056 -webkit-box-align: center;
2057 -webkit-align-items: center;
2058 -ms-flex-align: center;
2059 align-items: center;
2060 -webkit-box-sizing: border-box;
2061 box-sizing: border-box;
2062 padding-bottom: 8px;
2063}
2064.list .item-inner {
2065 position: relative;
2066 width: 100%;
2067 padding-top: 8px;
2068 padding-bottom: 8px;
2069 min-width: 0;
2070 display: -webkit-box;
2071 display: -webkit-flex;
2072 display: -ms-flexbox;
2073 display: flex;
2074 -webkit-box-pack: justify;
2075 -webkit-justify-content: space-between;
2076 -ms-flex-pack: justify;
2077 justify-content: space-between;
2078 -webkit-box-sizing: border-box;
2079 box-sizing: border-box;
2080 -webkit-box-align: center;
2081 -webkit-align-items: center;
2082 -ms-flex-align: center;
2083 align-items: center;
2084 -webkit-align-self: stretch;
2085 -ms-flex-item-align: stretch;
2086 align-self: stretch;
2087}
2088.list .item-title {
2089 min-width: 0;
2090 -webkit-flex-shrink: 1;
2091 -ms-flex-negative: 1;
2092 flex-shrink: 1;
2093 white-space: nowrap;
2094 position: relative;
2095 overflow: hidden;
2096 text-overflow: ellipsis;
2097 max-width: 100%;
2098}
2099.list .item-after {
2100 white-space: nowrap;
2101 -webkit-flex-shrink: 0;
2102 -ms-flex-negative: 0;
2103 flex-shrink: 0;
2104 display: -webkit-box;
2105 display: -webkit-flex;
2106 display: -ms-flexbox;
2107 display: flex;
2108 margin-left: auto;
2109}
2110.list .item-link,
2111.list .list-button {
2112 -webkit-transition-duration: 300ms;
2113 transition-duration: 300ms;
2114 -webkit-transition-property: background-color;
2115 transition-property: background-color;
2116 display: block;
2117 position: relative;
2118 overflow: hidden;
2119 z-index: 0;
2120}
2121.list .item-content {
2122 display: -webkit-box;
2123 display: -webkit-flex;
2124 display: -ms-flexbox;
2125 display: flex;
2126 -webkit-box-pack: justify;
2127 -webkit-justify-content: space-between;
2128 -ms-flex-pack: justify;
2129 justify-content: space-between;
2130 -webkit-box-sizing: border-box;
2131 box-sizing: border-box;
2132 -webkit-box-align: center;
2133 -webkit-align-items: center;
2134 -ms-flex-align: center;
2135 align-items: center;
2136}
2137.list .item-subtitle {
2138 position: relative;
2139 overflow: hidden;
2140 white-space: nowrap;
2141 max-width: 100%;
2142 text-overflow: ellipsis;
2143}
2144.list .item-text {
2145 position: relative;
2146 overflow: hidden;
2147 text-overflow: hidden;
2148 -webkit-line-clamp: 2;
2149 -webkit-box-orient: vertical;
2150 display: -webkit-box;
2151}
2152.list .item-title-row {
2153 display: -webkit-box;
2154 display: -webkit-flex;
2155 display: -ms-flexbox;
2156 display: flex;
2157 -webkit-box-pack: justify;
2158 -webkit-justify-content: space-between;
2159 -ms-flex-pack: justify;
2160 justify-content: space-between;
2161 -webkit-box-sizing: border-box;
2162 box-sizing: border-box;
2163}
2164.list .item-title-row .item-after {
2165 -webkit-align-self: center;
2166 -ms-flex-item-align: center;
2167 align-self: center;
2168}
2169.list .item-row {
2170 display: -webkit-box;
2171 display: -webkit-flex;
2172 display: -ms-flexbox;
2173 display: flex;
2174 -webkit-box-pack: justify;
2175 -webkit-justify-content: space-between;
2176 -ms-flex-pack: justify;
2177 justify-content: space-between;
2178 -webkit-box-sizing: border-box;
2179 box-sizing: border-box;
2180}
2181.list .item-cell {
2182 display: block;
2183 -webkit-align-self: center;
2184 -ms-flex-item-align: center;
2185 align-self: center;
2186 -webkit-box-sizing: border-box;
2187 box-sizing: border-box;
2188 -webkit-flex-shrink: 1;
2189 -ms-flex-negative: 1;
2190 flex-shrink: 1;
2191}
2192.list li:last-child .list-button:after {
2193 display: none !important;
2194}
2195.list li:last-child > .item-inner:after,
2196.list li:last-child li:last-child > .item-inner:after,
2197.list li:last-child > .item-content > .item-inner:after,
2198.list li:last-child li:last-child > .item-content > .item-inner:after,
2199.list li:last-child > .swipeout-content > .item-content > .item-inner:after,
2200.list li:last-child li:last-child > .swipeout-content > .item-content > .item-inner:after,
2201.list li:last-child > .item-link > .item-content > .item-inner:after,
2202.list li:last-child li:last-child > .item-link > .item-content > .item-inner:after {
2203 display: none !important;
2204}
2205.list.no-hairlines:before,
2206.list.no-hairlines ul:before,
2207.md .list.no-hairlines-md:before,
2208.md .list.no-hairlines-md ul:before,
2209.ios .list.no-hairlines-ios:before,
2210.ios .list.no-hairlines-ios ul:before {
2211 display: none !important;
2212}
2213.list.no-hairlines:after,
2214.list.no-hairlines ul:after,
2215.md .list.no-hairlines-md:after,
2216.md .list.no-hairlines-md ul:after,
2217.ios .list.no-hairlines-ios:after,
2218.ios .list.no-hairlines-ios ul:after {
2219 display: none !important;
2220}
2221.list.no-hairline-top:before,
2222.list.no-hairline-top ul:before,
2223.md .list.no-hairline-top-md:before,
2224.md .list.no-hairline-top-md ul:before,
2225.ios .list.no-hairline-top-ios:before,
2226.ios .list.no-hairline-top-ios ul:before {
2227 display: none !important;
2228}
2229.list.no-hairline-bottom:after,
2230.list.no-hairline-bottom ul:after,
2231.md .list.no-hairline-bottom-md:after,
2232.md .list.no-hairline-bottom-md ul:after,
2233.ios .list.no-hairline-bottom-ios:after,
2234.ios .list.no-hairline-bottom-ios ul:after {
2235 display: none !important;
2236}
2237.list.no-hairlines-between .item-inner:after,
2238.md .list.no-hairlines-between-md .item-inner:after,
2239.ios .list.no-hairlines-between-ios .item-inner:after,
2240.list.no-hairlines-between .list-button:after,
2241.md .list.no-hairlines-between-md .list-button:after,
2242.ios .list.no-hairlines-between-ios .list-button:after,
2243.list.no-hairlines-between .item-divider:after,
2244.md .list.no-hairlines-between-md .item-divider:after,
2245.ios .list.no-hairlines-between-ios .item-divider:after,
2246.list.no-hairlines-between .list-group-title:after,
2247.md .list.no-hairlines-between-md .list-group-title:after,
2248.ios .list.no-hairlines-between-ios .list-group-title:after,
2249.list.no-hairlines-between .list-group-title:after,
2250.md .list.no-hairlines-between-md .list-group-title:after,
2251.ios .list.no-hairlines-between-ios .list-group-title:after {
2252 display: none !important;
2253}
2254.list.no-hairlines-between.simple-list li:after,
2255.md .list.no-hairlines-between-md.simple-list li:after,
2256.ios .list.no-hairlines-between-ios.simple-list li:after {
2257 display: none !important;
2258}
2259.list.no-hairlines-between.links-list a:after,
2260.md .list.no-hairlines-between-md.links-list a:after,
2261.ios .list.no-hairlines-between-ios.links-list a:after {
2262 display: none !important;
2263}
2264.list.simple-list li {
2265 position: relative;
2266 white-space: nowrap;
2267 text-overflow: ellipsis;
2268 max-width: 100%;
2269 -webkit-box-sizing: border-box;
2270 box-sizing: border-box;
2271 display: -webkit-box;
2272 display: -webkit-flex;
2273 display: -ms-flexbox;
2274 display: flex;
2275 -webkit-box-pack: justify;
2276 -webkit-justify-content: space-between;
2277 -ms-flex-pack: justify;
2278 justify-content: space-between;
2279 -webkit-box-align: center;
2280 -webkit-align-items: center;
2281 -ms-flex-align: center;
2282 align-items: center;
2283 -webkit-align-content: center;
2284 -ms-flex-line-pack: center;
2285 align-content: center;
2286}
2287.list.simple-list li:last-child:after {
2288 display: none !important;
2289}
2290.list.links-list a {
2291 -webkit-transition-duration: 300ms;
2292 transition-duration: 300ms;
2293 -webkit-transition-property: background-color;
2294 transition-property: background-color;
2295 display: block;
2296 position: relative;
2297 overflow: hidden;
2298 display: -webkit-box;
2299 display: -webkit-flex;
2300 display: -ms-flexbox;
2301 display: flex;
2302 -webkit-box-align: center;
2303 -webkit-align-items: center;
2304 -ms-flex-align: center;
2305 align-items: center;
2306 -webkit-align-content: center;
2307 -ms-flex-line-pack: center;
2308 align-content: center;
2309 -webkit-box-pack: justify;
2310 -webkit-justify-content: space-between;
2311 -ms-flex-pack: justify;
2312 justify-content: space-between;
2313 -webkit-box-sizing: border-box;
2314 box-sizing: border-box;
2315 white-space: nowrap;
2316 text-overflow: ellipsis;
2317 max-width: 100%;
2318}
2319.list.links-list li:last-child a:after {
2320 display: none !important;
2321}
2322.media-list .item-inner,
2323li.media-item .item-inner {
2324 display: block;
2325 -webkit-align-self: stretch;
2326 -ms-flex-item-align: stretch;
2327 align-self: stretch;
2328}
2329.media-list .item-link .item-inner,
2330li.media-item .item-link .item-inner {
2331 background: none;
2332}
2333.media-list .item-media,
2334li.media-item .item-media {
2335 -webkit-align-self: flex-start;
2336 -ms-flex-item-align: start;
2337 align-self: flex-start;
2338}
2339.media-list .item-media img,
2340li.media-item .item-media img {
2341 display: block;
2342}
2343.list .item-link .item-inner,
2344.links-list a,
2345.media-list .item-link .item-title-row,
2346li.media-item .item-link .item-title-row,
2347.media-list.chevron-center .item-link .item-inner,
2348.media-list .chevron-center .item-link .item-inner,
2349.media-list .item-link.chevron-center .item-inner,
2350li.media-item.chevron-center .item-link .item-inner,
2351li.media-item .chevron-center .item-link .item-inner,
2352li.media-item .item-link.chevron-center .item-inner {
2353 background-size: 8px 13px;
2354 background-repeat: no-repeat;
2355 background-position: 95% center;
2356 background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D'8px'%20height%3D'13px'%20viewBox%3D'0%200%208%2013'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%3Cpolygon%20fill%3D'%23c7c7cc'%20transform%3D'translate(1.500000%2C%206.500000)%20rotate(-45.000000)%20translate(-1.500000%2C%20-6.500000)%20'%20points%3D'6%2011%206%202%204%202%204%209%20-3%209%20-3%2011%205%2011'%3E%3C%2Fpolygon%3E%3C%2Fsvg%3E");
2357}
2358.links-list.no-chevron a,
2359.no-chevron .links-list a,
2360.links-list .no-chevron a,
2361.item-link.no-chevron .item-inner,
2362.no-chevron .item-link .item-inner,
2363.media-list.no-chevron .item-link .item-title-row,
2364.no-chevron .media-list .item-link .item-title-row,
2365li.media-item .no-chevron .item-title-row,
2366li.media-item.no-chevron .item-title-row,
2367.media-list.chevron-center .item-title-row,
2368.media-list .chevron-center .item-title-row,
2369li.media-item.chevron-center .item-title-row,
2370li.media-item .chevron-center .item-title-row {
2371 background-image: none !important;
2372}
2373.media-list .item-link .item-inner,
2374li.media-item .item-link .item-inner {
2375 background-image: none;
2376}
2377.media-list .item-link .item-title-row,
2378li.media-item .item-link .item-title-row {
2379 background-position: right center !important;
2380}
2381.list-group ul:after,
2382.list-group ul:before {
2383 z-index: 25 !important;
2384}
2385.list-group + .list-group ul:before {
2386 display: none !important;
2387}
2388li.item-divider,
2389.item-divider,
2390li.list-group-title {
2391 white-space: nowrap;
2392 position: relative;
2393 max-width: 100%;
2394 text-overflow: ellipsis;
2395 overflow: hidden;
2396 z-index: 15;
2397}
2398li.list-group-title,
2399.list li.list-group-title {
2400 position: relative;
2401 position: -webkit-sticky;
2402 position: sticky;
2403 top: 0;
2404 margin-top: 0;
2405 z-index: 20;
2406}
2407li.list-group-title:before,
2408.list li.list-group-title:before {
2409 display: none !important;
2410}
2411.list.inset .block-title {
2412 margin-left: 0;
2413 margin-right: 0;
2414}
2415.list.inset ul:before {
2416 display: none !important;
2417}
2418.list.inset ul:after {
2419 display: none !important;
2420}
2421@media (min-width: 768px) {
2422 .list.tablet-inset .block-title {
2423 margin-left: 0;
2424 margin-right: 0;
2425 }
2426 .list.tablet-inset ul:before {
2427 display: none !important;
2428 }
2429 .list.tablet-inset ul:after {
2430 display: none !important;
2431 }
2432}
2433.theme-dark .list .item-link .item-inner,
2434.list.theme-dark .item-link .item-inner,
2435.theme-dark .links-list a,
2436.links-list.theme-dark a,
2437.theme-dark .media-list .item-link .item-title-row,
2438.media-list.theme-dark .item-link .item-title-row,
2439.theme-dark li.media-item .item-link .item-title-row {
2440 background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D'8px'%20height%3D'13px'%20viewBox%3D'0%200%208%2013'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%3Cpolygon%20fill%3D'%23434345'%20transform%3D'translate(1.500000%2C%206.500000)%20rotate(-45.000000)%20translate(-1.500000%2C%20-6.500000)%20'%20points%3D'6%2011%206%202%204%202%204%209%20-3%209%20-3%2011%205%2011'%3E%3C%2Fpolygon%3E%3C%2Fsvg%3E");
2441}
2442.theme-dark .media-list .item-link .item-inner,
2443.media-list.theme-dark .item-link .item-inner,
2444.theme-dark li.media-item .item-link .item-inner {
2445 background-image: none;
2446}
2447.ios .list {
2448 margin: 35px 0;
2449 font-size: 17px;
2450}
2451.ios .list .item-cell {
2452 width: 100%;
2453 min-width: 0;
2454 margin-left: 15px;
2455}
2456.ios .list .item-cell:first-child {
2457 margin-left: 0;
2458}
2459.ios .list ul {
2460 background: #fff;
2461}
2462.ios .list ul ul {
2463 padding-left: 45px;
2464}
2465.ios .list .item-media {
2466 padding-top: 7px;
2467}
2468.ios .list .item-media i + i,
2469.ios .list .item-media i + img {
2470 margin-left: 5px;
2471}
2472.ios .list .item-media + .item-inner {
2473 margin-left: 15px;
2474}
2475.ios .list .item-inner {
2476 min-height: 44px;
2477 padding-right: 15px;
2478}
2479.ios .list .item-after {
2480 color: #8e8e93;
2481 padding-left: 5px;
2482}
2483.ios .list .item-link,
2484.ios .list .list-button {
2485 color: inherit;
2486}
2487.ios .list .item-link .item-inner,
2488.ios .list .list-button .item-inner {
2489 padding-right: 35px;
2490}
2491.ios .list .item-link.active-state,
2492.ios .list .list-button.active-state {
2493 -webkit-transition-duration: 0ms;
2494 transition-duration: 0ms;
2495 background-color: #d9d9d9;
2496}
2497.ios .list .item-link.active-state .item-inner:after,
2498.ios .list .list-button.active-state .item-inner:after {
2499 background-color: transparent;
2500}
2501.ios .list .list-button {
2502 padding: 0 15px;
2503 text-align: center;
2504 color: #007aff;
2505 line-height: 44px;
2506}
2507.ios .list .item-content {
2508 min-height: 44px;
2509 padding-left: 15px;
2510}
2511.ios .list .item-subtitle {
2512 font-size: 15px;
2513}
2514.ios .list .item-text {
2515 font-size: 15px;
2516 color: #8e8e93;
2517 line-height: 21px;
2518 max-height: 42px;
2519}
2520.ios .list .item-header,
2521.ios .list .item-footer {
2522 font-weight: normal;
2523 font-size: 12px;
2524 line-height: 1.2;
2525 white-space: normal;
2526}
2527.ios .list .item-footer {
2528 color: #8e8e93;
2529}
2530.ios .list .item-link.no-chevron .item-inner,
2531.ios .list.no-chevron .item-link .item-inner,
2532.ios .list .no-chevron .item-link .item-inner,
2533.ios .no-chevron .list .item-link .item-inner {
2534 padding-right: 15px;
2535}
2536.ios .simple-list li:after {
2537 content: '';
2538 position: absolute;
2539 background-color: #c8c7cc;
2540 display: block;
2541 z-index: 15;
2542 top: auto;
2543 right: auto;
2544 bottom: 0;
2545 left: 0;
2546 height: 1px;
2547 width: 100%;
2548 -webkit-transform-origin: 50% 100%;
2549 transform-origin: 50% 100%;
2550}
2551.ios.device-pixel-ratio-2 .simple-list li:after {
2552 -webkit-transform: scaleY(0.5);
2553 transform: scaleY(0.5);
2554}
2555.ios.device-pixel-ratio-3 .simple-list li:after {
2556 -webkit-transform: scaleY(0.33);
2557 transform: scaleY(0.33);
2558}
2559.ios .simple-list li {
2560 padding-left: 15px;
2561 padding-right: 15px;
2562 line-height: 44px;
2563 height: 44px;
2564}
2565.ios .simple-list li:after {
2566 width: auto;
2567 left: 15px;
2568 right: 0;
2569}
2570.ios .links-list a:after {
2571 content: '';
2572 position: absolute;
2573 background-color: #c8c7cc;
2574 display: block;
2575 z-index: 15;
2576 top: auto;
2577 right: auto;
2578 bottom: 0;
2579 left: 0;
2580 height: 1px;
2581 width: 100%;
2582 -webkit-transform-origin: 50% 100%;
2583 transform-origin: 50% 100%;
2584}
2585.ios.device-pixel-ratio-2 .links-list a:after {
2586 -webkit-transform: scaleY(0.5);
2587 transform: scaleY(0.5);
2588}
2589.ios.device-pixel-ratio-3 .links-list a:after {
2590 -webkit-transform: scaleY(0.33);
2591 transform: scaleY(0.33);
2592}
2593.ios .links-list a {
2594 height: 44px;
2595 color: inherit;
2596}
2597.ios .links-list a.active-state {
2598 -webkit-transition-duration: 0ms;
2599 transition-duration: 0ms;
2600 background-color: #d9d9d9;
2601}
2602.ios .links-list a:after {
2603 width: auto;
2604}
2605.ios .links-list a {
2606 padding-left: 15px;
2607 padding-right: 35px;
2608}
2609.ios .links-list a:after {
2610 left: 15px;
2611 right: 0;
2612}
2613.ios .links-list.no-chevron a,
2614.ios .no-chevron .links-list a,
2615.ios .links-list a.no-chevron,
2616.ios .links-list .no-chevron a {
2617 padding-right: 15px;
2618}
2619.ios .media-list .item-title,
2620.ios li.media-item .item-title {
2621 font-weight: 600;
2622}
2623.ios .media-list .item-inner,
2624.ios li.media-item .item-inner {
2625 padding-top: 10px;
2626 padding-bottom: 9px;
2627}
2628.ios .media-list .item-media,
2629.ios li.media-item .item-media {
2630 padding-top: 9px;
2631 padding-bottom: 10px;
2632}
2633.ios .media-list .item-link .item-inner,
2634.ios li.media-item .item-link .item-inner {
2635 padding-right: 15px;
2636}
2637.ios .media-list .item-link .item-title-row,
2638.ios li.media-item .item-link .item-title-row {
2639 padding-right: 20px;
2640}
2641.ios .media-list.chevron-center .item-link .item-inner,
2642.ios .media-list .chevron-center .item-link .item-inner,
2643.ios .media-list .item-link.chevron-center .item-inner,
2644.ios li.media-item.chevron-center .item-link .item-inner,
2645.ios li.media-item .item-link.chevron-center .item-inner,
2646.ios li.media-item .chevron-center .item-link .item-inner {
2647 padding-right: 35px;
2648}
2649.ios .media-list.no-chevron .item-link .item-title-row,
2650.ios .no-chevron .media-list .item-link .item-title-row,
2651.ios .media-list .no-chevron .item-link .item-title-row,
2652.ios li.media-item.no-chevron .item-link .item-title-row,
2653.ios .no-chevron li.media-item .item-link .item-title-row,
2654.ios .media-list.chevron-center .item-title-row,
2655.ios .media-list .chevron-center .item-title-row,
2656.ios li.media-item.chevron-center .item-title-row,
2657.ios li.media-item .chevron-center .item-title-row {
2658 padding-right: 0 !important;
2659}
2660.ios .list .item-link .item-inner,
2661.ios .links-list a {
2662 background-position: calc(100% - 15px) center;
2663}
2664.ios .item-divider,
2665.ios .list-group-title {
2666 margin-top: -1px;
2667 padding: 4px 15px;
2668 background: #f7f7f7;
2669 color: #8e8e93;
2670}
2671.ios .item-divider:after,
2672.ios .list-group-title:after {
2673 display: none !important;
2674}
2675.ios .list-group-title {
2676 margin-top: 0;
2677}
2678.ios .item-divider:before {
2679 content: '';
2680 position: absolute;
2681 background-color: #c8c7cc;
2682 display: block;
2683 z-index: 15;
2684 top: 0;
2685 right: auto;
2686 bottom: auto;
2687 left: 0;
2688 height: 1px;
2689 width: 100%;
2690 -webkit-transform-origin: 50% 0%;
2691 transform-origin: 50% 0%;
2692}
2693.ios.device-pixel-ratio-2 .item-divider:before {
2694 -webkit-transform: scaleY(0.5);
2695 transform: scaleY(0.5);
2696}
2697.ios.device-pixel-ratio-3 .item-divider:before {
2698 -webkit-transform: scaleY(0.33);
2699 transform: scaleY(0.33);
2700}
2701.ios .list-group-title:before {
2702 content: '';
2703 position: absolute;
2704 background-color: #c8c7cc;
2705 display: block;
2706 z-index: 15;
2707 top: 0;
2708 right: auto;
2709 bottom: auto;
2710 left: 0;
2711 height: 1px;
2712 width: 100%;
2713 -webkit-transform-origin: 50% 0%;
2714 transform-origin: 50% 0%;
2715}
2716.ios.device-pixel-ratio-2 .list-group-title:before {
2717 -webkit-transform: scaleY(0.5);
2718 transform: scaleY(0.5);
2719}
2720.ios.device-pixel-ratio-3 .list-group-title:before {
2721 -webkit-transform: scaleY(0.33);
2722 transform: scaleY(0.33);
2723}
2724.ios .list .list-button:after {
2725 content: '';
2726 position: absolute;
2727 background-color: #c8c7cc;
2728 display: block;
2729 z-index: 15;
2730 top: auto;
2731 right: auto;
2732 bottom: 0;
2733 left: 0;
2734 height: 1px;
2735 width: 100%;
2736 -webkit-transform-origin: 50% 100%;
2737 transform-origin: 50% 100%;
2738}
2739.ios.device-pixel-ratio-2 .list .list-button:after {
2740 -webkit-transform: scaleY(0.5);
2741 transform: scaleY(0.5);
2742}
2743.ios.device-pixel-ratio-3 .list .list-button:after {
2744 -webkit-transform: scaleY(0.33);
2745 transform: scaleY(0.33);
2746}
2747.ios .list .item-inner:after {
2748 content: '';
2749 position: absolute;
2750 background-color: #c8c7cc;
2751 display: block;
2752 z-index: 15;
2753 top: auto;
2754 right: auto;
2755 bottom: 0;
2756 left: 0;
2757 height: 1px;
2758 width: 100%;
2759 -webkit-transform-origin: 50% 100%;
2760 transform-origin: 50% 100%;
2761}
2762.ios.device-pixel-ratio-2 .list .item-inner:after {
2763 -webkit-transform: scaleY(0.5);
2764 transform: scaleY(0.5);
2765}
2766.ios.device-pixel-ratio-3 .list .item-inner:after {
2767 -webkit-transform: scaleY(0.33);
2768 transform: scaleY(0.33);
2769}
2770.ios .list ul:before {
2771 content: '';
2772 position: absolute;
2773 background-color: #c8c7cc;
2774 display: block;
2775 z-index: 15;
2776 top: 0;
2777 right: auto;
2778 bottom: auto;
2779 left: 0;
2780 height: 1px;
2781 width: 100%;
2782 -webkit-transform-origin: 50% 0%;
2783 transform-origin: 50% 0%;
2784}
2785.ios.device-pixel-ratio-2 .list ul:before {
2786 -webkit-transform: scaleY(0.5);
2787 transform: scaleY(0.5);
2788}
2789.ios.device-pixel-ratio-3 .list ul:before {
2790 -webkit-transform: scaleY(0.33);
2791 transform: scaleY(0.33);
2792}
2793.ios .list ul:after {
2794 content: '';
2795 position: absolute;
2796 background-color: #c8c7cc;
2797 display: block;
2798 z-index: 15;
2799 top: auto;
2800 right: auto;
2801 bottom: 0;
2802 left: 0;
2803 height: 1px;
2804 width: 100%;
2805 -webkit-transform-origin: 50% 100%;
2806 transform-origin: 50% 100%;
2807}
2808.ios.device-pixel-ratio-2 .list ul:after {
2809 -webkit-transform: scaleY(0.5);
2810 transform: scaleY(0.5);
2811}
2812.ios.device-pixel-ratio-3 .list ul:after {
2813 -webkit-transform: scaleY(0.33);
2814 transform: scaleY(0.33);
2815}
2816.ios .list.inset {
2817 margin-left: 15px;
2818 margin-right: 15px;
2819 border-radius: 7px;
2820}
2821.ios .list.inset ul {
2822 border-radius: 7px;
2823}
2824.ios .list.inset li:first-child > a {
2825 border-radius: 7px 7px 0 0;
2826}
2827.ios .list.inset li:last-child > a {
2828 border-radius: 0 0 7px 7px;
2829}
2830.ios .list.inset li:first-child:last-child > a {
2831 border-radius: 7px;
2832}
2833@media (min-width: 768px) {
2834 .ios .list.tablet-inset {
2835 margin-left: 15px;
2836 margin-right: 15px;
2837 border-radius: 7px;
2838 }
2839 .ios .list.tablet-inset ul {
2840 border-radius: 7px;
2841 }
2842 .ios .list.tablet-inset li:first-child > a {
2843 border-radius: 7px 7px 0 0;
2844 }
2845 .ios .list.tablet-inset li:last-child > a {
2846 border-radius: 0 0 7px 7px;
2847 }
2848 .ios .list.tablet-inset li:first-child:last-child > a {
2849 border-radius: 7px;
2850 }
2851}
2852.ios li li:last-child .item-inner:after,
2853.ios li:last-child li .item-inner:after {
2854 content: '';
2855 position: absolute;
2856 background-color: #c8c7cc;
2857 display: block;
2858 z-index: 15;
2859 top: auto;
2860 right: auto;
2861 bottom: 0;
2862 left: 0;
2863 height: 1px;
2864 width: 100%;
2865 -webkit-transform-origin: 50% 100%;
2866 transform-origin: 50% 100%;
2867}
2868html.device-pixel-ratio-2 .ios li li:last-child .item-inner:after,
2869html.device-pixel-ratio-2 .ios li:last-child li .item-inner:after {
2870 -webkit-transform: scaleY(0.5);
2871 transform: scaleY(0.5);
2872}
2873html.device-pixel-ratio-3 .ios li li:last-child .item-inner:after,
2874html.device-pixel-ratio-3 .ios li:last-child li .item-inner:after {
2875 -webkit-transform: scaleY(0.33);
2876 transform: scaleY(0.33);
2877}
2878@media (orientation: landscape) {
2879 .ios.device-iphone-x .ios-left-edge .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge).simple-list li,
2880 .ios.device-iphone-x .ios-edges .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge).simple-list li,
2881 .ios.device-iphone-x .popup .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge).simple-list li,
2882 .ios.device-iphone-x .sheet-modal .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge).simple-list li,
2883 .ios.device-iphone-x .panel-left .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge).simple-list li {
2884 padding-left: calc(15px + constant(safe-area-inset-left));
2885 padding-left: calc(15px + env(safe-area-inset-left));
2886 }
2887 .ios.device-iphone-x .ios-left-edge .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge) .item-divider,
2888 .ios.device-iphone-x .ios-edges .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge) .item-divider,
2889 .ios.device-iphone-x .popup .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge) .item-divider,
2890 .ios.device-iphone-x .sheet-modal .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge) .item-divider,
2891 .ios.device-iphone-x .panel-left .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge) .item-divider,
2892 .ios.device-iphone-x .ios-left-edge .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge) .list-group-title,
2893 .ios.device-iphone-x .ios-edges .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge) .list-group-title,
2894 .ios.device-iphone-x .popup .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge) .list-group-title,
2895 .ios.device-iphone-x .sheet-modal .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge) .list-group-title,
2896 .ios.device-iphone-x .panel-left .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge) .list-group-title {
2897 padding-left: calc(15px + constant(safe-area-inset-left));
2898 padding-left: calc(15px + env(safe-area-inset-left));
2899 }
2900 .ios.device-iphone-x .ios-left-edge .list.inset:not(.no-ios-edges):not(.no-ios-left-edge),
2901 .ios.device-iphone-x .ios-edges .list.inset:not(.no-ios-edges):not(.no-ios-left-edge),
2902 .ios.device-iphone-x .popup .list.inset:not(.no-ios-edges):not(.no-ios-left-edge),
2903 .ios.device-iphone-x .sheet-modal .list.inset:not(.no-ios-edges):not(.no-ios-left-edge),
2904 .ios.device-iphone-x .panel-left .list.inset:not(.no-ios-edges):not(.no-ios-left-edge) {
2905 margin-left: calc(15px + constant(safe-area-inset-left));
2906 margin-left: calc(15px + env(safe-area-inset-left));
2907 }
2908 .ios.device-iphone-x .ios-left-edge .list.inset:not(.no-ios-edges):not(.no-ios-left-edge) .block-header,
2909 .ios.device-iphone-x .ios-edges .list.inset:not(.no-ios-edges):not(.no-ios-left-edge) .block-header,
2910 .ios.device-iphone-x .popup .list.inset:not(.no-ios-edges):not(.no-ios-left-edge) .block-header,
2911 .ios.device-iphone-x .sheet-modal .list.inset:not(.no-ios-edges):not(.no-ios-left-edge) .block-header,
2912 .ios.device-iphone-x .panel-left .list.inset:not(.no-ios-edges):not(.no-ios-left-edge) .block-header,
2913 .ios.device-iphone-x .ios-left-edge .list.inset:not(.no-ios-edges):not(.no-ios-left-edge) .block-footer,
2914 .ios.device-iphone-x .ios-edges .list.inset:not(.no-ios-edges):not(.no-ios-left-edge) .block-footer,
2915 .ios.device-iphone-x .popup .list.inset:not(.no-ios-edges):not(.no-ios-left-edge) .block-footer,
2916 .ios.device-iphone-x .sheet-modal .list.inset:not(.no-ios-edges):not(.no-ios-left-edge) .block-footer,
2917 .ios.device-iphone-x .panel-left .list.inset:not(.no-ios-edges):not(.no-ios-left-edge) .block-footer {
2918 padding-left: 15px;
2919 }
2920 .ios.device-iphone-x .ios-left-edge .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge) .item-content,
2921 .ios.device-iphone-x .ios-edges .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge) .item-content,
2922 .ios.device-iphone-x .popup .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge) .item-content,
2923 .ios.device-iphone-x .sheet-modal .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge) .item-content,
2924 .ios.device-iphone-x .panel-left .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge) .item-content {
2925 padding-left: calc(15px + constant(safe-area-inset-left));
2926 padding-left: calc(15px + env(safe-area-inset-left));
2927 }
2928 .ios.device-iphone-x .ios-left-edge .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge).simple-list li:after,
2929 .ios.device-iphone-x .ios-edges .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge).simple-list li:after,
2930 .ios.device-iphone-x .popup .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge).simple-list li:after,
2931 .ios.device-iphone-x .sheet-modal .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge).simple-list li:after,
2932 .ios.device-iphone-x .panel-left .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge).simple-list li:after {
2933 left: calc(15px + constant(safe-area-inset-left));
2934 left: calc(15px + env(safe-area-inset-left));
2935 }
2936 .ios.device-iphone-x .ios-left-edge .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge).links-list a,
2937 .ios.device-iphone-x .ios-edges .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge).links-list a,
2938 .ios.device-iphone-x .popup .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge).links-list a,
2939 .ios.device-iphone-x .sheet-modal .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge).links-list a,
2940 .ios.device-iphone-x .panel-left .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge).links-list a {
2941 padding-left: calc(15px + constant(safe-area-inset-left));
2942 padding-left: calc(15px + env(safe-area-inset-left));
2943 }
2944 .ios.device-iphone-x .ios-left-edge .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge).links-list a:after,
2945 .ios.device-iphone-x .ios-edges .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge).links-list a:after,
2946 .ios.device-iphone-x .popup .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge).links-list a:after,
2947 .ios.device-iphone-x .sheet-modal .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge).links-list a:after,
2948 .ios.device-iphone-x .panel-left .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-left-edge).links-list a:after {
2949 left: calc(15px + constant(safe-area-inset-left));
2950 left: calc(15px + env(safe-area-inset-left));
2951 }
2952 .ios.device-iphone-x .ios-right-edge .list.inset:not(.no-ios-edges):not(.no-ios-right-edge),
2953 .ios.device-iphone-x .ios-edges .list.inset:not(.no-ios-edges):not(.no-ios-right-edge),
2954 .ios.device-iphone-x .popup .list.inset:not(.no-ios-edges):not(.no-ios-right-edge),
2955 .ios.device-iphone-x .sheet-modal .list.inset:not(.no-ios-edges):not(.no-ios-right-edge),
2956 .ios.device-iphone-x .panel-right .list.inset:not(.no-ios-edges):not(.no-ios-right-edge) {
2957 margin-right: calc(15px + constant(safe-area-inset-right));
2958 margin-right: calc(15px + env(safe-area-inset-right));
2959 }
2960 .ios.device-iphone-x .ios-right-edge .list.inset:not(.no-ios-edges):not(.no-ios-right-edge) .block-header,
2961 .ios.device-iphone-x .ios-edges .list.inset:not(.no-ios-edges):not(.no-ios-right-edge) .block-header,
2962 .ios.device-iphone-x .popup .list.inset:not(.no-ios-edges):not(.no-ios-right-edge) .block-header,
2963 .ios.device-iphone-x .sheet-modal .list.inset:not(.no-ios-edges):not(.no-ios-right-edge) .block-header,
2964 .ios.device-iphone-x .panel-right .list.inset:not(.no-ios-edges):not(.no-ios-right-edge) .block-header,
2965 .ios.device-iphone-x .ios-right-edge .list.inset:not(.no-ios-edges):not(.no-ios-right-edge) .block-footer,
2966 .ios.device-iphone-x .ios-edges .list.inset:not(.no-ios-edges):not(.no-ios-right-edge) .block-footer,
2967 .ios.device-iphone-x .popup .list.inset:not(.no-ios-edges):not(.no-ios-right-edge) .block-footer,
2968 .ios.device-iphone-x .sheet-modal .list.inset:not(.no-ios-edges):not(.no-ios-right-edge) .block-footer,
2969 .ios.device-iphone-x .panel-right .list.inset:not(.no-ios-edges):not(.no-ios-right-edge) .block-footer {
2970 padding-right: 15px;
2971 }
2972 .ios.device-iphone-x .ios-right-edge .list.tablet-inset:not(.no-ios-edges):not(.no-ios-right-edge) .block-header,
2973 .ios.device-iphone-x .ios-edges .list.tablet-inset:not(.no-ios-edges):not(.no-ios-right-edge) .block-header,
2974 .ios.device-iphone-x .popup .list.tablet-inset:not(.no-ios-edges):not(.no-ios-right-edge) .block-header,
2975 .ios.device-iphone-x .sheet-modal .list.tablet-inset:not(.no-ios-edges):not(.no-ios-right-edge) .block-header,
2976 .ios.device-iphone-x .panel-right .list.tablet-inset:not(.no-ios-edges):not(.no-ios-right-edge) .block-header,
2977 .ios.device-iphone-x .ios-right-edge .list.tablet-inset:not(.no-ios-edges):not(.no-ios-right-edge) .block-footer,
2978 .ios.device-iphone-x .ios-edges .list.tablet-inset:not(.no-ios-edges):not(.no-ios-right-edge) .block-footer,
2979 .ios.device-iphone-x .popup .list.tablet-inset:not(.no-ios-edges):not(.no-ios-right-edge) .block-footer,
2980 .ios.device-iphone-x .sheet-modal .list.tablet-inset:not(.no-ios-edges):not(.no-ios-right-edge) .block-footer,
2981 .ios.device-iphone-x .panel-right .list.tablet-inset:not(.no-ios-edges):not(.no-ios-right-edge) .block-footer {
2982 padding-right: 15px;
2983 }
2984 .ios.device-iphone-x .ios-right-edge .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) .item-divider,
2985 .ios.device-iphone-x .ios-edges .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) .item-divider,
2986 .ios.device-iphone-x .popup .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) .item-divider,
2987 .ios.device-iphone-x .sheet-modal .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) .item-divider,
2988 .ios.device-iphone-x .panel-right .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) .item-divider,
2989 .ios.device-iphone-x .ios-right-edge .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) .list-group-title,
2990 .ios.device-iphone-x .ios-edges .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) .list-group-title,
2991 .ios.device-iphone-x .popup .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) .list-group-title,
2992 .ios.device-iphone-x .sheet-modal .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) .list-group-title,
2993 .ios.device-iphone-x .panel-right .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) .list-group-title {
2994 padding-right: calc(15px + constant(safe-area-inset-right));
2995 padding-right: calc(15px + env(safe-area-inset-right));
2996 }
2997 .ios.device-iphone-x .ios-right-edge .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).simple-list li,
2998 .ios.device-iphone-x .ios-edges .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).simple-list li,
2999 .ios.device-iphone-x .popup .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).simple-list li,
3000 .ios.device-iphone-x .sheet-modal .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).simple-list li,
3001 .ios.device-iphone-x .panel-right .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).simple-list li {
3002 padding-right: calc(15px + constant(safe-area-inset-right));
3003 padding-right: calc(15px + env(safe-area-inset-right));
3004 }
3005 .ios.device-iphone-x .ios-right-edge .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) .item-link .item-inner,
3006 .ios.device-iphone-x .ios-edges .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) .item-link .item-inner,
3007 .ios.device-iphone-x .popup .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) .item-link .item-inner,
3008 .ios.device-iphone-x .sheet-modal .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) .item-link .item-inner,
3009 .ios.device-iphone-x .panel-right .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) .item-link .item-inner,
3010 .ios.device-iphone-x .ios-right-edge .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).links-list a,
3011 .ios.device-iphone-x .ios-edges .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).links-list a,
3012 .ios.device-iphone-x .popup .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).links-list a,
3013 .ios.device-iphone-x .sheet-modal .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).links-list a,
3014 .ios.device-iphone-x .panel-right .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).links-list a {
3015 background-position: calc(100% - 15px - constant(safe-area-inset-right)) center;
3016 background-position: calc(100% - 15px - env(safe-area-inset-right)) center;
3017 }
3018 .ios.device-iphone-x .ios-right-edge .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) .item-inner,
3019 .ios.device-iphone-x .ios-edges .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) .item-inner,
3020 .ios.device-iphone-x .popup .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) .item-inner,
3021 .ios.device-iphone-x .sheet-modal .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) .item-inner,
3022 .ios.device-iphone-x .panel-right .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) .item-inner {
3023 padding-right: calc(15px + constant(safe-area-inset-right));
3024 padding-right: calc(15px + env(safe-area-inset-right));
3025 }
3026 .ios.device-iphone-x .ios-right-edge .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) .item-link .item-inner,
3027 .ios.device-iphone-x .ios-edges .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) .item-link .item-inner,
3028 .ios.device-iphone-x .popup .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) .item-link .item-inner,
3029 .ios.device-iphone-x .sheet-modal .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) .item-link .item-inner,
3030 .ios.device-iphone-x .panel-right .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) .item-link .item-inner {
3031 padding-right: calc(35px + constant(safe-area-inset-right));
3032 padding-right: calc(35px + env(safe-area-inset-right));
3033 }
3034 .ios.device-iphone-x .ios-right-edge .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).media-list .item-link .item-inner,
3035 .ios.device-iphone-x .ios-edges .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).media-list .item-link .item-inner,
3036 .ios.device-iphone-x .popup .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).media-list .item-link .item-inner,
3037 .ios.device-iphone-x .sheet-modal .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).media-list .item-link .item-inner,
3038 .ios.device-iphone-x .panel-right .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).media-list .item-link .item-inner,
3039 .ios.device-iphone-x .ios-right-edge .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) li.media-item .item-link .item-inner,
3040 .ios.device-iphone-x .ios-edges .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) li.media-item .item-link .item-inner,
3041 .ios.device-iphone-x .popup .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) li.media-item .item-link .item-inner,
3042 .ios.device-iphone-x .sheet-modal .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) li.media-item .item-link .item-inner,
3043 .ios.device-iphone-x .panel-right .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) li.media-item .item-link .item-inner {
3044 padding-right: calc(15px + constant(safe-area-inset-right));
3045 padding-right: calc(15px + env(safe-area-inset-right));
3046 }
3047 .ios.device-iphone-x .ios-right-edge .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).links-list a,
3048 .ios.device-iphone-x .ios-edges .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).links-list a,
3049 .ios.device-iphone-x .popup .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).links-list a,
3050 .ios.device-iphone-x .sheet-modal .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).links-list a,
3051 .ios.device-iphone-x .panel-right .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).links-list a {
3052 padding-right: calc(35px + constant(safe-area-inset-right));
3053 padding-right: calc(35px + env(safe-area-inset-right));
3054 }
3055 .ios.device-iphone-x .ios-right-edge .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).media-list.chevron-center .item-link .item-inner,
3056 .ios.device-iphone-x .ios-edges .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).media-list.chevron-center .item-link .item-inner,
3057 .ios.device-iphone-x .popup .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).media-list.chevron-center .item-link .item-inner,
3058 .ios.device-iphone-x .sheet-modal .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).media-list.chevron-center .item-link .item-inner,
3059 .ios.device-iphone-x .panel-right .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).media-list.chevron-center .item-link .item-inner,
3060 .ios.device-iphone-x .ios-right-edge .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).media-list .chevron-center .item-link .item-inner,
3061 .ios.device-iphone-x .ios-edges .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).media-list .chevron-center .item-link .item-inner,
3062 .ios.device-iphone-x .popup .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).media-list .chevron-center .item-link .item-inner,
3063 .ios.device-iphone-x .sheet-modal .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).media-list .chevron-center .item-link .item-inner,
3064 .ios.device-iphone-x .panel-right .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).media-list .chevron-center .item-link .item-inner,
3065 .ios.device-iphone-x .ios-right-edge .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).media-list .item-link.chevron-center .item-inner,
3066 .ios.device-iphone-x .ios-edges .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).media-list .item-link.chevron-center .item-inner,
3067 .ios.device-iphone-x .popup .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).media-list .item-link.chevron-center .item-inner,
3068 .ios.device-iphone-x .sheet-modal .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).media-list .item-link.chevron-center .item-inner,
3069 .ios.device-iphone-x .panel-right .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).media-list .item-link.chevron-center .item-inner,
3070 .ios.device-iphone-x .ios-right-edge .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) li.media-item.chevron-center .item-link .item-inner,
3071 .ios.device-iphone-x .ios-edges .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) li.media-item.chevron-center .item-link .item-inner,
3072 .ios.device-iphone-x .popup .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) li.media-item.chevron-center .item-link .item-inner,
3073 .ios.device-iphone-x .sheet-modal .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) li.media-item.chevron-center .item-link .item-inner,
3074 .ios.device-iphone-x .panel-right .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) li.media-item.chevron-center .item-link .item-inner,
3075 .ios.device-iphone-x .ios-right-edge .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) li.media-item .item-link.chevron-center .item-inner,
3076 .ios.device-iphone-x .ios-edges .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) li.media-item .item-link.chevron-center .item-inner,
3077 .ios.device-iphone-x .popup .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) li.media-item .item-link.chevron-center .item-inner,
3078 .ios.device-iphone-x .sheet-modal .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) li.media-item .item-link.chevron-center .item-inner,
3079 .ios.device-iphone-x .panel-right .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) li.media-item .item-link.chevron-center .item-inner,
3080 .ios.device-iphone-x .ios-right-edge .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) li.media-item .chevron-center .item-link .item-inner,
3081 .ios.device-iphone-x .ios-edges .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) li.media-item .chevron-center .item-link .item-inner,
3082 .ios.device-iphone-x .popup .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) li.media-item .chevron-center .item-link .item-inner,
3083 .ios.device-iphone-x .sheet-modal .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) li.media-item .chevron-center .item-link .item-inner,
3084 .ios.device-iphone-x .panel-right .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) li.media-item .chevron-center .item-link .item-inner {
3085 padding-right: calc(35px + constant(safe-area-inset-right));
3086 padding-right: calc(35px + env(safe-area-inset-right));
3087 }
3088 .ios.device-iphone-x .ios-right-edge .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) .item-link.no-chevron .item-inner,
3089 .ios.device-iphone-x .ios-edges .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) .item-link.no-chevron .item-inner,
3090 .ios.device-iphone-x .popup .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) .item-link.no-chevron .item-inner,
3091 .ios.device-iphone-x .sheet-modal .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) .item-link.no-chevron .item-inner,
3092 .ios.device-iphone-x .panel-right .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) .item-link.no-chevron .item-inner,
3093 .ios.device-iphone-x .ios-right-edge .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).no-chevron .item-link .item-inner,
3094 .ios.device-iphone-x .ios-edges .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).no-chevron .item-link .item-inner,
3095 .ios.device-iphone-x .popup .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).no-chevron .item-link .item-inner,
3096 .ios.device-iphone-x .sheet-modal .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).no-chevron .item-link .item-inner,
3097 .ios.device-iphone-x .panel-right .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).no-chevron .item-link .item-inner,
3098 .ios.device-iphone-x .ios-right-edge .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) .no-chevron .item-link .item-inner,
3099 .ios.device-iphone-x .ios-edges .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) .no-chevron .item-link .item-inner,
3100 .ios.device-iphone-x .popup .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) .no-chevron .item-link .item-inner,
3101 .ios.device-iphone-x .sheet-modal .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) .no-chevron .item-link .item-inner,
3102 .ios.device-iphone-x .panel-right .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) .no-chevron .item-link .item-inner,
3103 .ios.device-iphone-x .ios-right-edge .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).links-list.no-chevron a,
3104 .ios.device-iphone-x .ios-edges .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).links-list.no-chevron a,
3105 .ios.device-iphone-x .popup .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).links-list.no-chevron a,
3106 .ios.device-iphone-x .sheet-modal .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).links-list.no-chevron a,
3107 .ios.device-iphone-x .panel-right .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).links-list.no-chevron a,
3108 .ios.device-iphone-x .ios-right-edge .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).links-list a.no-chevron,
3109 .ios.device-iphone-x .ios-edges .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).links-list a.no-chevron,
3110 .ios.device-iphone-x .popup .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).links-list a.no-chevron,
3111 .ios.device-iphone-x .sheet-modal .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).links-list a.no-chevron,
3112 .ios.device-iphone-x .panel-right .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).links-list a.no-chevron,
3113 .ios.device-iphone-x .ios-right-edge .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).links-list .no-chevron a,
3114 .ios.device-iphone-x .ios-edges .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).links-list .no-chevron a,
3115 .ios.device-iphone-x .popup .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).links-list .no-chevron a,
3116 .ios.device-iphone-x .sheet-modal .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).links-list .no-chevron a,
3117 .ios.device-iphone-x .panel-right .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).links-list .no-chevron a {
3118 padding-right: calc(15px + constant(safe-area-inset-right));
3119 padding-right: calc(15px + env(safe-area-inset-right));
3120 }
3121 .ios.device-iphone-x .ios-right-edge .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).media-list.no-chevron .item-link .item-title-row,
3122 .ios.device-iphone-x .ios-edges .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).media-list.no-chevron .item-link .item-title-row,
3123 .ios.device-iphone-x .popup .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).media-list.no-chevron .item-link .item-title-row,
3124 .ios.device-iphone-x .sheet-modal .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).media-list.no-chevron .item-link .item-title-row,
3125 .ios.device-iphone-x .panel-right .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).media-list.no-chevron .item-link .item-title-row,
3126 .ios.device-iphone-x .ios-right-edge .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).media-list .no-chevron .item-link .item-title-row,
3127 .ios.device-iphone-x .ios-edges .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).media-list .no-chevron .item-link .item-title-row,
3128 .ios.device-iphone-x .popup .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).media-list .no-chevron .item-link .item-title-row,
3129 .ios.device-iphone-x .sheet-modal .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).media-list .no-chevron .item-link .item-title-row,
3130 .ios.device-iphone-x .panel-right .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).media-list .no-chevron .item-link .item-title-row,
3131 .ios.device-iphone-x .ios-right-edge .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) li.media-item.no-chevron .item-link .item-title-row,
3132 .ios.device-iphone-x .ios-edges .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) li.media-item.no-chevron .item-link .item-title-row,
3133 .ios.device-iphone-x .popup .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) li.media-item.no-chevron .item-link .item-title-row,
3134 .ios.device-iphone-x .sheet-modal .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) li.media-item.no-chevron .item-link .item-title-row,
3135 .ios.device-iphone-x .panel-right .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) li.media-item.no-chevron .item-link .item-title-row,
3136 .ios.device-iphone-x .ios-right-edge .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).no-chevron li.media-item .item-link .item-title-row,
3137 .ios.device-iphone-x .ios-edges .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).no-chevron li.media-item .item-link .item-title-row,
3138 .ios.device-iphone-x .popup .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).no-chevron li.media-item .item-link .item-title-row,
3139 .ios.device-iphone-x .sheet-modal .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).no-chevron li.media-item .item-link .item-title-row,
3140 .ios.device-iphone-x .panel-right .list:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge).no-chevron li.media-item .item-link .item-title-row {
3141 padding-right: 0;
3142 }
3143}
3144@media (orientation: landscape) and (min-width: 768px) {
3145 .ios.device-iphone-x .ios-left-edge .list.tablet-inset:not(.no-ios-edges):not(.no-ios-left-edge),
3146 .ios.device-iphone-x .ios-edges .list.tablet-inset:not(.no-ios-edges):not(.no-ios-left-edge),
3147 .ios.device-iphone-x .popup .list.tablet-inset:not(.no-ios-edges):not(.no-ios-left-edge),
3148 .ios.device-iphone-x .sheet-modal .list.tablet-inset:not(.no-ios-edges):not(.no-ios-left-edge),
3149 .ios.device-iphone-x .panel-left .list.tablet-inset:not(.no-ios-edges):not(.no-ios-left-edge) {
3150 margin-left: calc(15px + constant(safe-area-inset-left));
3151 margin-left: calc(15px + env(safe-area-inset-left));
3152 }
3153 .ios.device-iphone-x .ios-left-edge .list.tablet-inset:not(.no-ios-edges):not(.no-ios-left-edge) .block-header,
3154 .ios.device-iphone-x .ios-edges .list.tablet-inset:not(.no-ios-edges):not(.no-ios-left-edge) .block-header,
3155 .ios.device-iphone-x .popup .list.tablet-inset:not(.no-ios-edges):not(.no-ios-left-edge) .block-header,
3156 .ios.device-iphone-x .sheet-modal .list.tablet-inset:not(.no-ios-edges):not(.no-ios-left-edge) .block-header,
3157 .ios.device-iphone-x .panel-left .list.tablet-inset:not(.no-ios-edges):not(.no-ios-left-edge) .block-header,
3158 .ios.device-iphone-x .ios-left-edge .list.tablet-inset:not(.no-ios-edges):not(.no-ios-left-edge) .block-footer,
3159 .ios.device-iphone-x .ios-edges .list.tablet-inset:not(.no-ios-edges):not(.no-ios-left-edge) .block-footer,
3160 .ios.device-iphone-x .popup .list.tablet-inset:not(.no-ios-edges):not(.no-ios-left-edge) .block-footer,
3161 .ios.device-iphone-x .sheet-modal .list.tablet-inset:not(.no-ios-edges):not(.no-ios-left-edge) .block-footer,
3162 .ios.device-iphone-x .panel-left .list.tablet-inset:not(.no-ios-edges):not(.no-ios-left-edge) .block-footer {
3163 padding-left: 15px;
3164 }
3165}
3166@media (orientation: landscape) and (min-width: 768px) {
3167 .ios.device-iphone-x .ios-right-edge .list.tablet-inset:not(.no-ios-edges):not(.no-ios-right-edge),
3168 .ios.device-iphone-x .ios-edges .list.tablet-inset:not(.no-ios-edges):not(.no-ios-right-edge),
3169 .ios.device-iphone-x .popup .list.tablet-inset:not(.no-ios-edges):not(.no-ios-right-edge),
3170 .ios.device-iphone-x .sheet-modal .list.tablet-inset:not(.no-ios-edges):not(.no-ios-right-edge),
3171 .ios.device-iphone-x .panel-right .list.tablet-inset:not(.no-ios-edges):not(.no-ios-right-edge) {
3172 margin-right: calc(15px + constant(safe-area-inset-right));
3173 margin-right: calc(15px + env(safe-area-inset-right));
3174 }
3175}
3176.ios .theme-dark .list ul,
3177.list.ios .theme-dark ul {
3178 background: #1c1c1d;
3179}
3180.ios .theme-dark .list ul:before,
3181.list.ios .theme-dark ul:before {
3182 background-color: #282829;
3183}
3184.ios .theme-dark .list ul:after,
3185.list.ios .theme-dark ul:after {
3186 background-color: #282829;
3187}
3188.ios .theme-dark .list li li:last-child .item-inner:after,
3189.list.ios .theme-dark li li:last-child .item-inner:after,
3190.ios .theme-dark .list li:last-child li .item-inner:after,
3191.list.ios .theme-dark li:last-child li .item-inner:after {
3192 background-color: #282829;
3193}
3194.ios .theme-dark .item-divider:before {
3195 background-color: #282829;
3196}
3197.ios .theme-dark .list-group-title:before {
3198 background-color: #282829;
3199}
3200.ios .theme-dark .list-button:after {
3201 background-color: #282829;
3202}
3203.ios .theme-dark .item-inner:after {
3204 background-color: #282829;
3205}
3206.ios .theme-dark .item-divider,
3207.ios .theme-dark .list-group-title {
3208 background-color: #111;
3209}
3210.ios .theme-dark .links-list a:after,
3211.ios .theme-dark .simple-list li:after,
3212.ios .theme-dark .links-list a:after,
3213.links-list.ios .theme-dark a .simple-list li:after,
3214.simple-list.ios .theme-dark li:after {
3215 background-color: #282829;
3216}
3217.ios .theme-dark .list .item-link.active-state,
3218.list.ios .theme-dark .item-link.active-state,
3219.ios .theme-dark .list .list-button.active-state,
3220.list.ios .theme-dark .list-button.active-state,
3221.ios .theme-dark .links-list a.active-state,
3222.links-list.ios .theme-dark a.active-state {
3223 background-color: #363636;
3224}
3225.ios .color-theme-red .list-button {
3226 color: #ff3b30;
3227}
3228.ios .color-theme-green .list-button {
3229 color: #4cd964;
3230}
3231.ios .color-theme-blue .list-button {
3232 color: #007aff;
3233}
3234.ios .color-theme-pink .list-button {
3235 color: #ff2d55;
3236}
3237.ios .color-theme-yellow .list-button {
3238 color: #ffcc00;
3239}
3240.ios .color-theme-orange .list-button {
3241 color: #ff9500;
3242}
3243.ios .color-theme-gray .list-button {
3244 color: #8e8e93;
3245}
3246.ios .color-theme-white .list-button {
3247 color: #ffffff;
3248}
3249.ios .color-theme-black .list-button {
3250 color: #000000;
3251}
3252.ios .list .list-button.color-red,
3253.ios .list li.color-red .list-button,
3254.ios .links-list li.color-red a,
3255.ios .simple-list li.color-red,
3256.ios .links-list a.color-red,
3257.ios .list .item-link.color-red,
3258.ios .list li.color-red .item-link {
3259 color: #ff3b30;
3260}
3261.ios .list .list-button.color-green,
3262.ios .list li.color-green .list-button,
3263.ios .links-list li.color-green a,
3264.ios .simple-list li.color-green,
3265.ios .links-list a.color-green,
3266.ios .list .item-link.color-green,
3267.ios .list li.color-green .item-link {
3268 color: #4cd964;
3269}
3270.ios .list .list-button.color-blue,
3271.ios .list li.color-blue .list-button,
3272.ios .links-list li.color-blue a,
3273.ios .simple-list li.color-blue,
3274.ios .links-list a.color-blue,
3275.ios .list .item-link.color-blue,
3276.ios .list li.color-blue .item-link {
3277 color: #007aff;
3278}
3279.ios .list .list-button.color-pink,
3280.ios .list li.color-pink .list-button,
3281.ios .links-list li.color-pink a,
3282.ios .simple-list li.color-pink,
3283.ios .links-list a.color-pink,
3284.ios .list .item-link.color-pink,
3285.ios .list li.color-pink .item-link {
3286 color: #ff2d55;
3287}
3288.ios .list .list-button.color-yellow,
3289.ios .list li.color-yellow .list-button,
3290.ios .links-list li.color-yellow a,
3291.ios .simple-list li.color-yellow,
3292.ios .links-list a.color-yellow,
3293.ios .list .item-link.color-yellow,
3294.ios .list li.color-yellow .item-link {
3295 color: #ffcc00;
3296}
3297.ios .list .list-button.color-orange,
3298.ios .list li.color-orange .list-button,
3299.ios .links-list li.color-orange a,
3300.ios .simple-list li.color-orange,
3301.ios .links-list a.color-orange,
3302.ios .list .item-link.color-orange,
3303.ios .list li.color-orange .item-link {
3304 color: #ff9500;
3305}
3306.ios .list .list-button.color-gray,
3307.ios .list li.color-gray .list-button,
3308.ios .links-list li.color-gray a,
3309.ios .simple-list li.color-gray,
3310.ios .links-list a.color-gray,
3311.ios .list .item-link.color-gray,
3312.ios .list li.color-gray .item-link {
3313 color: #8e8e93;
3314}
3315.ios .list .list-button.color-white,
3316.ios .list li.color-white .list-button,
3317.ios .links-list li.color-white a,
3318.ios .simple-list li.color-white,
3319.ios .links-list a.color-white,
3320.ios .list .item-link.color-white,
3321.ios .list li.color-white .item-link {
3322 color: #ffffff;
3323}
3324.ios .list .list-button.color-black,
3325.ios .list li.color-black .list-button,
3326.ios .links-list li.color-black a,
3327.ios .simple-list li.color-black,
3328.ios .links-list a.color-black,
3329.ios .list .item-link.color-black,
3330.ios .list li.color-black .item-link {
3331 color: #000000;
3332}
3333/* === Badge === */
3334.badge {
3335 display: inline-block;
3336 color: #fff;
3337 background: #8e8e93;
3338 position: relative;
3339 -webkit-box-sizing: border-box;
3340 box-sizing: border-box;
3341 text-align: center;
3342}
3343.icon .badge,
3344.f7-icons .badge,
3345.framework7-icons .badge,
3346.material-icons .badge {
3347 position: absolute;
3348 left: 100%;
3349 margin-left: -10px;
3350 top: -2px;
3351}
3352.ios .badge {
3353 font-size: 13px;
3354 border-radius: 20px;
3355 padding: 0 6px;
3356 height: 20px;
3357 line-height: 20px;
3358}
3359.ios .icon .badge,
3360.ios .f7-icons .badge,
3361.ios .framework7-icons .badge,
3362.ios .material-icons .badge {
3363 line-height: 16px;
3364 height: 16px;
3365 border-radius: 16px;
3366 padding: 0 4px;
3367 min-width: 16px;
3368 font-family: -apple-system, SF UI Text, Helvetica Neue, Helvetica, Arial, sans-serif;
3369 font-size: 10px;
3370}
3371.ios .badge.color-red {
3372 background-color: #ff3b30;
3373}
3374.ios .badge.color-green {
3375 background-color: #4cd964;
3376}
3377.ios .badge.color-blue {
3378 background-color: #007aff;
3379}
3380.ios .badge.color-pink {
3381 background-color: #ff2d55;
3382}
3383.ios .badge.color-yellow {
3384 background-color: #ffcc00;
3385}
3386.ios .badge.color-orange {
3387 background-color: #ff9500;
3388}
3389.ios .badge.color-gray {
3390 background-color: #8e8e93;
3391}
3392.ios .badge.color-white {
3393 background-color: #ffffff;
3394}
3395.ios .badge.color-black {
3396 background-color: #000000;
3397}
3398button {
3399 -webkit-appearance: none;
3400 -moz-appearance: none;
3401 appearance: none;
3402}
3403.button {
3404 text-decoration: none;
3405 text-align: center;
3406 display: block;
3407 -webkit-appearance: none;
3408 -moz-appearance: none;
3409 appearance: none;
3410 background: none;
3411 padding: 0 10px;
3412 margin: 0;
3413 white-space: nowrap;
3414 text-overflow: ellipsis;
3415 font-size: 14px;
3416 position: relative;
3417 overflow: hidden;
3418 font-family: inherit;
3419 cursor: pointer;
3420 outline: 0;
3421 -webkit-box-sizing: border-box;
3422 box-sizing: border-box;
3423 vertical-align: middle;
3424}
3425input[type="submit"].button,
3426input[type="button"].button {
3427 width: 100%;
3428}
3429button {
3430 width: 100%;
3431}
3432.segmented {
3433 -webkit-align-self: center;
3434 -ms-flex-item-align: center;
3435 align-self: center;
3436 display: -webkit-box;
3437 display: -webkit-flex;
3438 display: -ms-flexbox;
3439 display: flex;
3440 -webkit-flex-wrap: nowrap;
3441 -ms-flex-wrap: nowrap;
3442 flex-wrap: nowrap;
3443}
3444.segmented .button,
3445.segmented button {
3446 width: 100%;
3447 -webkit-flex-shrink: 1;
3448 -ms-flex-negative: 1;
3449 flex-shrink: 1;
3450 min-width: 0;
3451}
3452.subnavbar .segmented {
3453 width: 100%;
3454}
3455.ios .button {
3456 border: 1px solid #007aff;
3457 color: #007aff;
3458 border-radius: 5px;
3459 line-height: 27px;
3460 height: 29px;
3461}
3462.ios .button.active-state {
3463 background: rgba(0, 122, 255, 0.15);
3464}
3465.ios .button.button-round,
3466.ios .button.button-round-ios {
3467 border-radius: 29px;
3468}
3469.ios .button.button-active,
3470.ios .button.tab-link-active {
3471 background: #007aff;
3472 color: #fff;
3473}
3474.ios .button.button-big,
3475.ios .button.button-big-ios {
3476 font-size: 17px;
3477 height: 44px;
3478 line-height: 42px;
3479}
3480.ios .button.button-small,
3481.ios .button.button-small-ios {
3482 height: 26px;
3483 line-height: 22px;
3484 border-width: 2px;
3485 font-size: 13px;
3486 font-weight: 600;
3487 text-transform: uppercase;
3488 -webkit-transition-duration: 200ms;
3489 transition-duration: 200ms;
3490}
3491.ios .button.button-small.button-fill.active-state,
3492.ios .button.button-small-ios.button-fill.active-state,
3493.ios .button.button-small.button-fill-ios.active-state,
3494.ios .button.button-small-ios.button-fill-ios.active-state {
3495 color: #007aff;
3496 border: 2px solid #007aff;
3497 background-color: transparent;
3498 opacity: 1;
3499}
3500.ios .button.button-fill,
3501.ios .button.button-fill-ios {
3502 color: #fff;
3503 background: #007aff;
3504 border-color: transparent;
3505}
3506.ios .button.button-fill.active-state,
3507.ios .button.button-fill-ios.active-state {
3508 opacity: 0.8;
3509}
3510.ios .button i.icon:first-child {
3511 margin-right: 10px;
3512}
3513.ios .button i.icon:last-child {
3514 margin-left: 10px;
3515}
3516.ios .button i.icon:first-child:last-child {
3517 margin-left: 0;
3518 margin-right: 0;
3519}
3520.ios .segmented .button {
3521 border-radius: 0;
3522 border-left-width: 0;
3523}
3524.ios .segmented .button:first-child {
3525 border-radius: 5px 0 0 5px;
3526 border-left-width: 1px;
3527 border-left-style: solid;
3528}
3529.ios .segmented .button:first-child.button-small {
3530 border-left-width: 2px;
3531}
3532.ios .segmented .button:last-child {
3533 border-radius: 0 5px 5px 0;
3534}
3535.ios .segmented .button:first-child:last-child {
3536 border-radius: 5px;
3537}
3538.ios .segmented .button.button-round:first-child,
3539.ios .segmented .button.button-round-ios:first-child {
3540 border-radius: 29px 0 0 29px;
3541}
3542.ios .segmented .button.button-round:last-child,
3543.ios .segmented .button.button-round-ios:last-child {
3544 border-radius: 0 29px 29px 0;
3545}
3546.ios .color-theme-red .button {
3547 border-color: #ff3b30;
3548 color: #ff3b30;
3549}
3550.ios .color-theme-red .button.active-state {
3551 background: rgba(255, 59, 48, 0.15);
3552}
3553.ios .color-theme-red .button.button-active,
3554.ios .color-theme-red .button.tab-link-active,
3555.ios .color-theme-red .button.button-fill,
3556.ios .color-theme-red .button.button-fill-ios {
3557 color: #fff;
3558}
3559.ios .color-theme-red .button.button-active,
3560.ios .color-theme-red .button.tab-link-active {
3561 background: #ff3b30;
3562}
3563.ios .color-theme-red .button.button-fill,
3564.ios .color-theme-red .button.button-fill-ios {
3565 background: #ff3b30;
3566 border-color: transparent;
3567}
3568.ios .color-theme-red .button.button-small.button-fill.active-state,
3569.ios .color-theme-red .button.button-small-ios.button-fill.active-state,
3570.ios .color-theme-red .button.button-small.button-fill-ios.active-state,
3571.ios .color-theme-red .button.button-small-ios.button-fill-ios.active-state {
3572 color: #ff3b30;
3573 border: 2px solid #ff3b30;
3574 background-color: transparent;
3575}
3576.ios .color-theme-green .button {
3577 border-color: #4cd964;
3578 color: #4cd964;
3579}
3580.ios .color-theme-green .button.active-state {
3581 background: rgba(76, 217, 100, 0.15);
3582}
3583.ios .color-theme-green .button.button-active,
3584.ios .color-theme-green .button.tab-link-active,
3585.ios .color-theme-green .button.button-fill,
3586.ios .color-theme-green .button.button-fill-ios {
3587 color: #fff;
3588}
3589.ios .color-theme-green .button.button-active,
3590.ios .color-theme-green .button.tab-link-active {
3591 background: #4cd964;
3592}
3593.ios .color-theme-green .button.button-fill,
3594.ios .color-theme-green .button.button-fill-ios {
3595 background: #4cd964;
3596 border-color: transparent;
3597}
3598.ios .color-theme-green .button.button-small.button-fill.active-state,
3599.ios .color-theme-green .button.button-small-ios.button-fill.active-state,
3600.ios .color-theme-green .button.button-small.button-fill-ios.active-state,
3601.ios .color-theme-green .button.button-small-ios.button-fill-ios.active-state {
3602 color: #4cd964;
3603 border: 2px solid #4cd964;
3604 background-color: transparent;
3605}
3606.ios .color-theme-blue .button {
3607 border-color: #007aff;
3608 color: #007aff;
3609}
3610.ios .color-theme-blue .button.active-state {
3611 background: rgba(0, 122, 255, 0.15);
3612}
3613.ios .color-theme-blue .button.button-active,
3614.ios .color-theme-blue .button.tab-link-active,
3615.ios .color-theme-blue .button.button-fill,
3616.ios .color-theme-blue .button.button-fill-ios {
3617 color: #fff;
3618}
3619.ios .color-theme-blue .button.button-active,
3620.ios .color-theme-blue .button.tab-link-active {
3621 background: #007aff;
3622}
3623.ios .color-theme-blue .button.button-fill,
3624.ios .color-theme-blue .button.button-fill-ios {
3625 background: #007aff;
3626 border-color: transparent;
3627}
3628.ios .color-theme-blue .button.button-small.button-fill.active-state,
3629.ios .color-theme-blue .button.button-small-ios.button-fill.active-state,
3630.ios .color-theme-blue .button.button-small.button-fill-ios.active-state,
3631.ios .color-theme-blue .button.button-small-ios.button-fill-ios.active-state {
3632 color: #007aff;
3633 border: 2px solid #007aff;
3634 background-color: transparent;
3635}
3636.ios .color-theme-pink .button {
3637 border-color: #ff2d55;
3638 color: #ff2d55;
3639}
3640.ios .color-theme-pink .button.active-state {
3641 background: rgba(255, 45, 85, 0.15);
3642}
3643.ios .color-theme-pink .button.button-active,
3644.ios .color-theme-pink .button.tab-link-active,
3645.ios .color-theme-pink .button.button-fill,
3646.ios .color-theme-pink .button.button-fill-ios {
3647 color: #fff;
3648}
3649.ios .color-theme-pink .button.button-active,
3650.ios .color-theme-pink .button.tab-link-active {
3651 background: #ff2d55;
3652}
3653.ios .color-theme-pink .button.button-fill,
3654.ios .color-theme-pink .button.button-fill-ios {
3655 background: #ff2d55;
3656 border-color: transparent;
3657}
3658.ios .color-theme-pink .button.button-small.button-fill.active-state,
3659.ios .color-theme-pink .button.button-small-ios.button-fill.active-state,
3660.ios .color-theme-pink .button.button-small.button-fill-ios.active-state,
3661.ios .color-theme-pink .button.button-small-ios.button-fill-ios.active-state {
3662 color: #ff2d55;
3663 border: 2px solid #ff2d55;
3664 background-color: transparent;
3665}
3666.ios .color-theme-yellow .button {
3667 border-color: #ffcc00;
3668 color: #ffcc00;
3669}
3670.ios .color-theme-yellow .button.active-state {
3671 background: rgba(255, 204, 0, 0.15);
3672}
3673.ios .color-theme-yellow .button.button-active,
3674.ios .color-theme-yellow .button.tab-link-active,
3675.ios .color-theme-yellow .button.button-fill,
3676.ios .color-theme-yellow .button.button-fill-ios {
3677 color: #fff;
3678}
3679.ios .color-theme-yellow .button.button-active,
3680.ios .color-theme-yellow .button.tab-link-active {
3681 background: #ffcc00;
3682}
3683.ios .color-theme-yellow .button.button-fill,
3684.ios .color-theme-yellow .button.button-fill-ios {
3685 background: #ffcc00;
3686 border-color: transparent;
3687}
3688.ios .color-theme-yellow .button.button-small.button-fill.active-state,
3689.ios .color-theme-yellow .button.button-small-ios.button-fill.active-state,
3690.ios .color-theme-yellow .button.button-small.button-fill-ios.active-state,
3691.ios .color-theme-yellow .button.button-small-ios.button-fill-ios.active-state {
3692 color: #ffcc00;
3693 border: 2px solid #ffcc00;
3694 background-color: transparent;
3695}
3696.ios .color-theme-orange .button {
3697 border-color: #ff9500;
3698 color: #ff9500;
3699}
3700.ios .color-theme-orange .button.active-state {
3701 background: rgba(255, 149, 0, 0.15);
3702}
3703.ios .color-theme-orange .button.button-active,
3704.ios .color-theme-orange .button.tab-link-active,
3705.ios .color-theme-orange .button.button-fill,
3706.ios .color-theme-orange .button.button-fill-ios {
3707 color: #fff;
3708}
3709.ios .color-theme-orange .button.button-active,
3710.ios .color-theme-orange .button.tab-link-active {
3711 background: #ff9500;
3712}
3713.ios .color-theme-orange .button.button-fill,
3714.ios .color-theme-orange .button.button-fill-ios {
3715 background: #ff9500;
3716 border-color: transparent;
3717}
3718.ios .color-theme-orange .button.button-small.button-fill.active-state,
3719.ios .color-theme-orange .button.button-small-ios.button-fill.active-state,
3720.ios .color-theme-orange .button.button-small.button-fill-ios.active-state,
3721.ios .color-theme-orange .button.button-small-ios.button-fill-ios.active-state {
3722 color: #ff9500;
3723 border: 2px solid #ff9500;
3724 background-color: transparent;
3725}
3726.ios .color-theme-gray .button {
3727 border-color: #8e8e93;
3728 color: #8e8e93;
3729}
3730.ios .color-theme-gray .button.active-state {
3731 background: rgba(142, 142, 147, 0.15);
3732}
3733.ios .color-theme-gray .button.button-active,
3734.ios .color-theme-gray .button.tab-link-active,
3735.ios .color-theme-gray .button.button-fill,
3736.ios .color-theme-gray .button.button-fill-ios {
3737 color: #fff;
3738}
3739.ios .color-theme-gray .button.button-active,
3740.ios .color-theme-gray .button.tab-link-active {
3741 background: #8e8e93;
3742}
3743.ios .color-theme-gray .button.button-fill,
3744.ios .color-theme-gray .button.button-fill-ios {
3745 background: #8e8e93;
3746 border-color: transparent;
3747}
3748.ios .color-theme-gray .button.button-small.button-fill.active-state,
3749.ios .color-theme-gray .button.button-small-ios.button-fill.active-state,
3750.ios .color-theme-gray .button.button-small.button-fill-ios.active-state,
3751.ios .color-theme-gray .button.button-small-ios.button-fill-ios.active-state {
3752 color: #8e8e93;
3753 border: 2px solid #8e8e93;
3754 background-color: transparent;
3755}
3756.ios .color-theme-white .button {
3757 border-color: #ffffff;
3758 color: #ffffff;
3759}
3760.ios .color-theme-white .button.active-state {
3761 background: rgba(255, 255, 255, 0.15);
3762}
3763.ios .color-theme-white .button.button-active,
3764.ios .color-theme-white .button.tab-link-active,
3765.ios .color-theme-white .button.button-fill,
3766.ios .color-theme-white .button.button-fill-ios {
3767 color: #fff;
3768}
3769.ios .color-theme-white .button.button-active,
3770.ios .color-theme-white .button.tab-link-active {
3771 background: #ffffff;
3772}
3773.ios .color-theme-white .button.button-fill,
3774.ios .color-theme-white .button.button-fill-ios {
3775 background: #ffffff;
3776 border-color: transparent;
3777}
3778.ios .color-theme-white .button.button-small.button-fill.active-state,
3779.ios .color-theme-white .button.button-small-ios.button-fill.active-state,
3780.ios .color-theme-white .button.button-small.button-fill-ios.active-state,
3781.ios .color-theme-white .button.button-small-ios.button-fill-ios.active-state {
3782 color: #ffffff;
3783 border: 2px solid #ffffff;
3784 background-color: transparent;
3785}
3786.ios .color-theme-black .button {
3787 border-color: #000000;
3788 color: #000000;
3789}
3790.ios .color-theme-black .button.active-state {
3791 background: rgba(0, 0, 0, 0.15);
3792}
3793.ios .color-theme-black .button.button-active,
3794.ios .color-theme-black .button.tab-link-active,
3795.ios .color-theme-black .button.button-fill,
3796.ios .color-theme-black .button.button-fill-ios {
3797 color: #fff;
3798}
3799.ios .color-theme-black .button.button-active,
3800.ios .color-theme-black .button.tab-link-active {
3801 background: #000000;
3802}
3803.ios .color-theme-black .button.button-fill,
3804.ios .color-theme-black .button.button-fill-ios {
3805 background: #000000;
3806 border-color: transparent;
3807}
3808.ios .color-theme-black .button.button-small.button-fill.active-state,
3809.ios .color-theme-black .button.button-small-ios.button-fill.active-state,
3810.ios .color-theme-black .button.button-small.button-fill-ios.active-state,
3811.ios .color-theme-black .button.button-small-ios.button-fill-ios.active-state {
3812 color: #000000;
3813 border: 2px solid #000000;
3814 background-color: transparent;
3815}
3816.ios .button.color-red {
3817 border-color: #ff3b30;
3818 color: #ff3b30;
3819}
3820.ios .button.color-red.active-state {
3821 background: rgba(255, 59, 48, 0.15);
3822}
3823.ios .button.color-red.button-active,
3824.ios .button.color-red.tab-link-active,
3825.ios .button.color-red.button-fill,
3826.ios .button.color-red.button-fill-ios {
3827 color: #fff;
3828}
3829.ios .button.color-red.button-active,
3830.ios .button.color-red.tab-link-active {
3831 background: #ff3b30;
3832}
3833.ios .button.color-red.button-fill,
3834.ios .button.color-red.button-fill-ios {
3835 background: #ff3b30;
3836 border-color: transparent;
3837}
3838.ios .button.color-red.button-small.button-fill.active-state,
3839.ios .button.color-red.button-small-ios.button-fill.active-state,
3840.ios .button.color-red.button-small.button-fill-ios.active-state,
3841.ios .button.color-red.button-small-ios.button-fill-ios.active-state {
3842 color: #ff3b30;
3843 border: 2px solid #ff3b30;
3844 background-color: transparent;
3845}
3846.ios .button.color-green {
3847 border-color: #4cd964;
3848 color: #4cd964;
3849}
3850.ios .button.color-green.active-state {
3851 background: rgba(76, 217, 100, 0.15);
3852}
3853.ios .button.color-green.button-active,
3854.ios .button.color-green.tab-link-active,
3855.ios .button.color-green.button-fill,
3856.ios .button.color-green.button-fill-ios {
3857 color: #fff;
3858}
3859.ios .button.color-green.button-active,
3860.ios .button.color-green.tab-link-active {
3861 background: #4cd964;
3862}
3863.ios .button.color-green.button-fill,
3864.ios .button.color-green.button-fill-ios {
3865 background: #4cd964;
3866 border-color: transparent;
3867}
3868.ios .button.color-green.button-small.button-fill.active-state,
3869.ios .button.color-green.button-small-ios.button-fill.active-state,
3870.ios .button.color-green.button-small.button-fill-ios.active-state,
3871.ios .button.color-green.button-small-ios.button-fill-ios.active-state {
3872 color: #4cd964;
3873 border: 2px solid #4cd964;
3874 background-color: transparent;
3875}
3876.ios .button.color-blue {
3877 border-color: #007aff;
3878 color: #007aff;
3879}
3880.ios .button.color-blue.active-state {
3881 background: rgba(0, 122, 255, 0.15);
3882}
3883.ios .button.color-blue.button-active,
3884.ios .button.color-blue.tab-link-active,
3885.ios .button.color-blue.button-fill,
3886.ios .button.color-blue.button-fill-ios {
3887 color: #fff;
3888}
3889.ios .button.color-blue.button-active,
3890.ios .button.color-blue.tab-link-active {
3891 background: #007aff;
3892}
3893.ios .button.color-blue.button-fill,
3894.ios .button.color-blue.button-fill-ios {
3895 background: #007aff;
3896 border-color: transparent;
3897}
3898.ios .button.color-blue.button-small.button-fill.active-state,
3899.ios .button.color-blue.button-small-ios.button-fill.active-state,
3900.ios .button.color-blue.button-small.button-fill-ios.active-state,
3901.ios .button.color-blue.button-small-ios.button-fill-ios.active-state {
3902 color: #007aff;
3903 border: 2px solid #007aff;
3904 background-color: transparent;
3905}
3906.ios .button.color-pink {
3907 border-color: #ff2d55;
3908 color: #ff2d55;
3909}
3910.ios .button.color-pink.active-state {
3911 background: rgba(255, 45, 85, 0.15);
3912}
3913.ios .button.color-pink.button-active,
3914.ios .button.color-pink.tab-link-active,
3915.ios .button.color-pink.button-fill,
3916.ios .button.color-pink.button-fill-ios {
3917 color: #fff;
3918}
3919.ios .button.color-pink.button-active,
3920.ios .button.color-pink.tab-link-active {
3921 background: #ff2d55;
3922}
3923.ios .button.color-pink.button-fill,
3924.ios .button.color-pink.button-fill-ios {
3925 background: #ff2d55;
3926 border-color: transparent;
3927}
3928.ios .button.color-pink.button-small.button-fill.active-state,
3929.ios .button.color-pink.button-small-ios.button-fill.active-state,
3930.ios .button.color-pink.button-small.button-fill-ios.active-state,
3931.ios .button.color-pink.button-small-ios.button-fill-ios.active-state {
3932 color: #ff2d55;
3933 border: 2px solid #ff2d55;
3934 background-color: transparent;
3935}
3936.ios .button.color-yellow {
3937 border-color: #ffcc00;
3938 color: #ffcc00;
3939}
3940.ios .button.color-yellow.active-state {
3941 background: rgba(255, 204, 0, 0.15);
3942}
3943.ios .button.color-yellow.button-active,
3944.ios .button.color-yellow.tab-link-active,
3945.ios .button.color-yellow.button-fill,
3946.ios .button.color-yellow.button-fill-ios {
3947 color: #fff;
3948}
3949.ios .button.color-yellow.button-active,
3950.ios .button.color-yellow.tab-link-active {
3951 background: #ffcc00;
3952}
3953.ios .button.color-yellow.button-fill,
3954.ios .button.color-yellow.button-fill-ios {
3955 background: #ffcc00;
3956 border-color: transparent;
3957}
3958.ios .button.color-yellow.button-small.button-fill.active-state,
3959.ios .button.color-yellow.button-small-ios.button-fill.active-state,
3960.ios .button.color-yellow.button-small.button-fill-ios.active-state,
3961.ios .button.color-yellow.button-small-ios.button-fill-ios.active-state {
3962 color: #ffcc00;
3963 border: 2px solid #ffcc00;
3964 background-color: transparent;
3965}
3966.ios .button.color-orange {
3967 border-color: #ff9500;
3968 color: #ff9500;
3969}
3970.ios .button.color-orange.active-state {
3971 background: rgba(255, 149, 0, 0.15);
3972}
3973.ios .button.color-orange.button-active,
3974.ios .button.color-orange.tab-link-active,
3975.ios .button.color-orange.button-fill,
3976.ios .button.color-orange.button-fill-ios {
3977 color: #fff;
3978}
3979.ios .button.color-orange.button-active,
3980.ios .button.color-orange.tab-link-active {
3981 background: #ff9500;
3982}
3983.ios .button.color-orange.button-fill,
3984.ios .button.color-orange.button-fill-ios {
3985 background: #ff9500;
3986 border-color: transparent;
3987}
3988.ios .button.color-orange.button-small.button-fill.active-state,
3989.ios .button.color-orange.button-small-ios.button-fill.active-state,
3990.ios .button.color-orange.button-small.button-fill-ios.active-state,
3991.ios .button.color-orange.button-small-ios.button-fill-ios.active-state {
3992 color: #ff9500;
3993 border: 2px solid #ff9500;
3994 background-color: transparent;
3995}
3996.ios .button.color-gray {
3997 border-color: #8e8e93;
3998 color: #8e8e93;
3999}
4000.ios .button.color-gray.active-state {
4001 background: rgba(142, 142, 147, 0.15);
4002}
4003.ios .button.color-gray.button-active,
4004.ios .button.color-gray.tab-link-active,
4005.ios .button.color-gray.button-fill,
4006.ios .button.color-gray.button-fill-ios {
4007 color: #fff;
4008}
4009.ios .button.color-gray.button-active,
4010.ios .button.color-gray.tab-link-active {
4011 background: #8e8e93;
4012}
4013.ios .button.color-gray.button-fill,
4014.ios .button.color-gray.button-fill-ios {
4015 background: #8e8e93;
4016 border-color: transparent;
4017}
4018.ios .button.color-gray.button-small.button-fill.active-state,
4019.ios .button.color-gray.button-small-ios.button-fill.active-state,
4020.ios .button.color-gray.button-small.button-fill-ios.active-state,
4021.ios .button.color-gray.button-small-ios.button-fill-ios.active-state {
4022 color: #8e8e93;
4023 border: 2px solid #8e8e93;
4024 background-color: transparent;
4025}
4026.ios .button.color-white {
4027 border-color: #ffffff;
4028 color: #ffffff;
4029}
4030.ios .button.color-white.active-state {
4031 background: rgba(255, 255, 255, 0.15);
4032}
4033.ios .button.color-white.button-active,
4034.ios .button.color-white.tab-link-active,
4035.ios .button.color-white.button-fill,
4036.ios .button.color-white.button-fill-ios {
4037 color: #fff;
4038}
4039.ios .button.color-white.button-active,
4040.ios .button.color-white.tab-link-active {
4041 background: #ffffff;
4042}
4043.ios .button.color-white.button-fill,
4044.ios .button.color-white.button-fill-ios {
4045 background: #ffffff;
4046 border-color: transparent;
4047}
4048.ios .button.color-white.button-small.button-fill.active-state,
4049.ios .button.color-white.button-small-ios.button-fill.active-state,
4050.ios .button.color-white.button-small.button-fill-ios.active-state,
4051.ios .button.color-white.button-small-ios.button-fill-ios.active-state {
4052 color: #ffffff;
4053 border: 2px solid #ffffff;
4054 background-color: transparent;
4055}
4056.ios .button.color-black {
4057 border-color: #000000;
4058 color: #000000;
4059}
4060.ios .button.color-black.active-state {
4061 background: rgba(0, 0, 0, 0.15);
4062}
4063.ios .button.color-black.button-active,
4064.ios .button.color-black.tab-link-active,
4065.ios .button.color-black.button-fill,
4066.ios .button.color-black.button-fill-ios {
4067 color: #fff;
4068}
4069.ios .button.color-black.button-active,
4070.ios .button.color-black.tab-link-active {
4071 background: #000000;
4072}
4073.ios .button.color-black.button-fill,
4074.ios .button.color-black.button-fill-ios {
4075 background: #000000;
4076 border-color: transparent;
4077}
4078.ios .button.color-black.button-small.button-fill.active-state,
4079.ios .button.color-black.button-small-ios.button-fill.active-state,
4080.ios .button.color-black.button-small.button-fill-ios.active-state,
4081.ios .button.color-black.button-small-ios.button-fill-ios.active-state {
4082 color: #000000;
4083 border: 2px solid #000000;
4084 background-color: transparent;
4085}
4086/* === Touch Ripple === */
4087/* === Icon === */
4088i.icon {
4089 display: inline-block;
4090 vertical-align: middle;
4091 background-size: 100% auto;
4092 background-position: center;
4093 background-repeat: no-repeat;
4094 font-style: normal;
4095 position: relative;
4096}
4097.ios .icon-back,
4098.ios .icon-prev {
4099 width: 12px;
4100 height: 20px;
4101}
4102.ios .icon-forward,
4103.ios .icon-next {
4104 width: 12px;
4105 height: 20px;
4106}
4107.ios .icon-next,
4108.ios .icon-prev {
4109 width: 10px;
4110}
4111.ios .icon-back,
4112.ios .icon-prev {
4113 background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D'12'%20height%3D'20'%20viewBox%3D'0%200%2012%2020'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%3Cpath%20d%3D'M.18261596%209.4221638c.0352203-.05148305.07573462-.10050698.1215468-.14631917L9.1425872.4374202c.5830904-.58309038%201.52656832-.5849888%202.11643872.00488163.5857864.58578644.591222%201.53009836.0048816%202.11643873L3.82594417%209.9967039l7.43188553%207.4318855c.5830904.5830904.5849888%201.5265683-.0048817%202.1164387-.5857864.5857865-1.5300983.591222-2.11643868.0048816L.2980849%2010.7114853c-.3526746-.3526746-.3939974-.89699-.11546894-1.2893215z'%20fill%3D'%23007aff'%20fill-rule%3D'evenodd'%2F%3E%3C%2Fsvg%3E");
4114}
4115.ios .icon-forward,
4116.ios .icon-next {
4117 background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D'12'%20height%3D'20'%20viewBox%3D'0%200%2012%2020'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%3Cpath%20d%3D'M11.51840604%2010.5648622c-.0352203.05148305-.07573462.10050698-.1215468.14631917L2.5584348%2019.5496058c-.5830904.58309038-1.52656832.5849888-2.11643872-.00488163-.5857864-.58578644-.591222-1.53009836-.0048816-2.11643873L7.87507783%209.9903221.4431923%202.5584366C-.1398981%201.9753462-.1417965%201.0318683.448074.4419979c.5857864-.5857865%201.5300983-.591222%202.11643868-.0048816l8.83842442%208.8384244c.3526746.3526746.3939974.89699.11546894%201.2893215z'%20fill%3D'%23007aff'%20fill-rule%3D'evenodd'%2F%3E%3C%2Fsvg%3E");
4118}
4119.ios .navbar .f7-icons,
4120.ios .toolbar .f7-icons {
4121 font-size: 22px;
4122}
4123.ios .tabbar .f7-icons,
4124.ios .tabbar-labels .f7-icons {
4125 font-size: 25px;
4126}
4127.ios .item-media .f7-icons {
4128 font-size: 25px;
4129 width: 29px;
4130 height: 29px;
4131}
4132.ios .button .f7-icons {
4133 font-size: 22px;
4134}
4135.ios .item-media .icon {
4136 color: #808080;
4137}
4138.ios .color-theme-red .icon-back,
4139.ios .icon-back.color-red,
4140.ios a.link.color-red .icon-back,
4141.ios .color-theme-red .icon-prev,
4142.ios .icon-prev.color-red,
4143.ios a.link.color-red .icon-prev {
4144 background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D'12'%20height%3D'20'%20viewBox%3D'0%200%2012%2020'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%3Cpath%20d%3D'M.18261596%209.4221638c.0352203-.05148305.07573462-.10050698.1215468-.14631917L9.1425872.4374202c.5830904-.58309038%201.52656832-.5849888%202.11643872.00488163.5857864.58578644.591222%201.53009836.0048816%202.11643873L3.82594417%209.9967039l7.43188553%207.4318855c.5830904.5830904.5849888%201.5265683-.0048817%202.1164387-.5857864.5857865-1.5300983.591222-2.11643868.0048816L.2980849%2010.7114853c-.3526746-.3526746-.3939974-.89699-.11546894-1.2893215z'%20fill%3D'%23ff3b30'%20fill-rule%3D'evenodd'%2F%3E%3C%2Fsvg%3E");
4145}
4146.ios .color-theme-red .icon-forward,
4147.ios .icon-forward.color-red,
4148.ios a.link.color-red .icon-forward,
4149.ios .color-theme-red .icon-next,
4150.ios .icon-next.color-red,
4151.ios a.link.color-red .icon-next {
4152 background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D'12'%20height%3D'20'%20viewBox%3D'0%200%2012%2020'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%3Cpath%20d%3D'M11.51840604%2010.5648622c-.0352203.05148305-.07573462.10050698-.1215468.14631917L2.5584348%2019.5496058c-.5830904.58309038-1.52656832.5849888-2.11643872-.00488163-.5857864-.58578644-.591222-1.53009836-.0048816-2.11643873L7.87507783%209.9903221.4431923%202.5584366C-.1398981%201.9753462-.1417965%201.0318683.448074.4419979c.5857864-.5857865%201.5300983-.591222%202.11643868-.0048816l8.83842442%208.8384244c.3526746.3526746.3939974.89699.11546894%201.2893215z'%20fill%3D'%23ff3b30'%20fill-rule%3D'evenodd'%2F%3E%3C%2Fsvg%3E");
4153}
4154.ios .color-theme-green .icon-back,
4155.ios .icon-back.color-green,
4156.ios a.link.color-green .icon-back,
4157.ios .color-theme-green .icon-prev,
4158.ios .icon-prev.color-green,
4159.ios a.link.color-green .icon-prev {
4160 background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D'12'%20height%3D'20'%20viewBox%3D'0%200%2012%2020'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%3Cpath%20d%3D'M.18261596%209.4221638c.0352203-.05148305.07573462-.10050698.1215468-.14631917L9.1425872.4374202c.5830904-.58309038%201.52656832-.5849888%202.11643872.00488163.5857864.58578644.591222%201.53009836.0048816%202.11643873L3.82594417%209.9967039l7.43188553%207.4318855c.5830904.5830904.5849888%201.5265683-.0048817%202.1164387-.5857864.5857865-1.5300983.591222-2.11643868.0048816L.2980849%2010.7114853c-.3526746-.3526746-.3939974-.89699-.11546894-1.2893215z'%20fill%3D'%234cd964'%20fill-rule%3D'evenodd'%2F%3E%3C%2Fsvg%3E");
4161}
4162.ios .color-theme-green .icon-forward,
4163.ios .icon-forward.color-green,
4164.ios a.link.color-green .icon-forward,
4165.ios .color-theme-green .icon-next,
4166.ios .icon-next.color-green,
4167.ios a.link.color-green .icon-next {
4168 background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D'12'%20height%3D'20'%20viewBox%3D'0%200%2012%2020'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%3Cpath%20d%3D'M11.51840604%2010.5648622c-.0352203.05148305-.07573462.10050698-.1215468.14631917L2.5584348%2019.5496058c-.5830904.58309038-1.52656832.5849888-2.11643872-.00488163-.5857864-.58578644-.591222-1.53009836-.0048816-2.11643873L7.87507783%209.9903221.4431923%202.5584366C-.1398981%201.9753462-.1417965%201.0318683.448074.4419979c.5857864-.5857865%201.5300983-.591222%202.11643868-.0048816l8.83842442%208.8384244c.3526746.3526746.3939974.89699.11546894%201.2893215z'%20fill%3D'%234cd964'%20fill-rule%3D'evenodd'%2F%3E%3C%2Fsvg%3E");
4169}
4170.ios .color-theme-blue .icon-back,
4171.ios .icon-back.color-blue,
4172.ios a.link.color-blue .icon-back,
4173.ios .color-theme-blue .icon-prev,
4174.ios .icon-prev.color-blue,
4175.ios a.link.color-blue .icon-prev {
4176 background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D'12'%20height%3D'20'%20viewBox%3D'0%200%2012%2020'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%3Cpath%20d%3D'M.18261596%209.4221638c.0352203-.05148305.07573462-.10050698.1215468-.14631917L9.1425872.4374202c.5830904-.58309038%201.52656832-.5849888%202.11643872.00488163.5857864.58578644.591222%201.53009836.0048816%202.11643873L3.82594417%209.9967039l7.43188553%207.4318855c.5830904.5830904.5849888%201.5265683-.0048817%202.1164387-.5857864.5857865-1.5300983.591222-2.11643868.0048816L.2980849%2010.7114853c-.3526746-.3526746-.3939974-.89699-.11546894-1.2893215z'%20fill%3D'%23007aff'%20fill-rule%3D'evenodd'%2F%3E%3C%2Fsvg%3E");
4177}
4178.ios .color-theme-blue .icon-forward,
4179.ios .icon-forward.color-blue,
4180.ios a.link.color-blue .icon-forward,
4181.ios .color-theme-blue .icon-next,
4182.ios .icon-next.color-blue,
4183.ios a.link.color-blue .icon-next {
4184 background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D'12'%20height%3D'20'%20viewBox%3D'0%200%2012%2020'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%3Cpath%20d%3D'M11.51840604%2010.5648622c-.0352203.05148305-.07573462.10050698-.1215468.14631917L2.5584348%2019.5496058c-.5830904.58309038-1.52656832.5849888-2.11643872-.00488163-.5857864-.58578644-.591222-1.53009836-.0048816-2.11643873L7.87507783%209.9903221.4431923%202.5584366C-.1398981%201.9753462-.1417965%201.0318683.448074.4419979c.5857864-.5857865%201.5300983-.591222%202.11643868-.0048816l8.83842442%208.8384244c.3526746.3526746.3939974.89699.11546894%201.2893215z'%20fill%3D'%23007aff'%20fill-rule%3D'evenodd'%2F%3E%3C%2Fsvg%3E");
4185}
4186.ios .color-theme-pink .icon-back,
4187.ios .icon-back.color-pink,
4188.ios a.link.color-pink .icon-back,
4189.ios .color-theme-pink .icon-prev,
4190.ios .icon-prev.color-pink,
4191.ios a.link.color-pink .icon-prev {
4192 background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D'12'%20height%3D'20'%20viewBox%3D'0%200%2012%2020'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%3Cpath%20d%3D'M.18261596%209.4221638c.0352203-.05148305.07573462-.10050698.1215468-.14631917L9.1425872.4374202c.5830904-.58309038%201.52656832-.5849888%202.11643872.00488163.5857864.58578644.591222%201.53009836.0048816%202.11643873L3.82594417%209.9967039l7.43188553%207.4318855c.5830904.5830904.5849888%201.5265683-.0048817%202.1164387-.5857864.5857865-1.5300983.591222-2.11643868.0048816L.2980849%2010.7114853c-.3526746-.3526746-.3939974-.89699-.11546894-1.2893215z'%20fill%3D'%23ff2d55'%20fill-rule%3D'evenodd'%2F%3E%3C%2Fsvg%3E");
4193}
4194.ios .color-theme-pink .icon-forward,
4195.ios .icon-forward.color-pink,
4196.ios a.link.color-pink .icon-forward,
4197.ios .color-theme-pink .icon-next,
4198.ios .icon-next.color-pink,
4199.ios a.link.color-pink .icon-next {
4200 background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D'12'%20height%3D'20'%20viewBox%3D'0%200%2012%2020'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%3Cpath%20d%3D'M11.51840604%2010.5648622c-.0352203.05148305-.07573462.10050698-.1215468.14631917L2.5584348%2019.5496058c-.5830904.58309038-1.52656832.5849888-2.11643872-.00488163-.5857864-.58578644-.591222-1.53009836-.0048816-2.11643873L7.87507783%209.9903221.4431923%202.5584366C-.1398981%201.9753462-.1417965%201.0318683.448074.4419979c.5857864-.5857865%201.5300983-.591222%202.11643868-.0048816l8.83842442%208.8384244c.3526746.3526746.3939974.89699.11546894%201.2893215z'%20fill%3D'%23ff2d55'%20fill-rule%3D'evenodd'%2F%3E%3C%2Fsvg%3E");
4201}
4202.ios .color-theme-yellow .icon-back,
4203.ios .icon-back.color-yellow,
4204.ios a.link.color-yellow .icon-back,
4205.ios .color-theme-yellow .icon-prev,
4206.ios .icon-prev.color-yellow,
4207.ios a.link.color-yellow .icon-prev {
4208 background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D'12'%20height%3D'20'%20viewBox%3D'0%200%2012%2020'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%3Cpath%20d%3D'M.18261596%209.4221638c.0352203-.05148305.07573462-.10050698.1215468-.14631917L9.1425872.4374202c.5830904-.58309038%201.52656832-.5849888%202.11643872.00488163.5857864.58578644.591222%201.53009836.0048816%202.11643873L3.82594417%209.9967039l7.43188553%207.4318855c.5830904.5830904.5849888%201.5265683-.0048817%202.1164387-.5857864.5857865-1.5300983.591222-2.11643868.0048816L.2980849%2010.7114853c-.3526746-.3526746-.3939974-.89699-.11546894-1.2893215z'%20fill%3D'%23ffcc00'%20fill-rule%3D'evenodd'%2F%3E%3C%2Fsvg%3E");
4209}
4210.ios .color-theme-yellow .icon-forward,
4211.ios .icon-forward.color-yellow,
4212.ios a.link.color-yellow .icon-forward,
4213.ios .color-theme-yellow .icon-next,
4214.ios .icon-next.color-yellow,
4215.ios a.link.color-yellow .icon-next {
4216 background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D'12'%20height%3D'20'%20viewBox%3D'0%200%2012%2020'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%3Cpath%20d%3D'M11.51840604%2010.5648622c-.0352203.05148305-.07573462.10050698-.1215468.14631917L2.5584348%2019.5496058c-.5830904.58309038-1.52656832.5849888-2.11643872-.00488163-.5857864-.58578644-.591222-1.53009836-.0048816-2.11643873L7.87507783%209.9903221.4431923%202.5584366C-.1398981%201.9753462-.1417965%201.0318683.448074.4419979c.5857864-.5857865%201.5300983-.591222%202.11643868-.0048816l8.83842442%208.8384244c.3526746.3526746.3939974.89699.11546894%201.2893215z'%20fill%3D'%23ffcc00'%20fill-rule%3D'evenodd'%2F%3E%3C%2Fsvg%3E");
4217}
4218.ios .color-theme-orange .icon-back,
4219.ios .icon-back.color-orange,
4220.ios a.link.color-orange .icon-back,
4221.ios .color-theme-orange .icon-prev,
4222.ios .icon-prev.color-orange,
4223.ios a.link.color-orange .icon-prev {
4224 background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D'12'%20height%3D'20'%20viewBox%3D'0%200%2012%2020'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%3Cpath%20d%3D'M.18261596%209.4221638c.0352203-.05148305.07573462-.10050698.1215468-.14631917L9.1425872.4374202c.5830904-.58309038%201.52656832-.5849888%202.11643872.00488163.5857864.58578644.591222%201.53009836.0048816%202.11643873L3.82594417%209.9967039l7.43188553%207.4318855c.5830904.5830904.5849888%201.5265683-.0048817%202.1164387-.5857864.5857865-1.5300983.591222-2.11643868.0048816L.2980849%2010.7114853c-.3526746-.3526746-.3939974-.89699-.11546894-1.2893215z'%20fill%3D'%23ff9500'%20fill-rule%3D'evenodd'%2F%3E%3C%2Fsvg%3E");
4225}
4226.ios .color-theme-orange .icon-forward,
4227.ios .icon-forward.color-orange,
4228.ios a.link.color-orange .icon-forward,
4229.ios .color-theme-orange .icon-next,
4230.ios .icon-next.color-orange,
4231.ios a.link.color-orange .icon-next {
4232 background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D'12'%20height%3D'20'%20viewBox%3D'0%200%2012%2020'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%3Cpath%20d%3D'M11.51840604%2010.5648622c-.0352203.05148305-.07573462.10050698-.1215468.14631917L2.5584348%2019.5496058c-.5830904.58309038-1.52656832.5849888-2.11643872-.00488163-.5857864-.58578644-.591222-1.53009836-.0048816-2.11643873L7.87507783%209.9903221.4431923%202.5584366C-.1398981%201.9753462-.1417965%201.0318683.448074.4419979c.5857864-.5857865%201.5300983-.591222%202.11643868-.0048816l8.83842442%208.8384244c.3526746.3526746.3939974.89699.11546894%201.2893215z'%20fill%3D'%23ff9500'%20fill-rule%3D'evenodd'%2F%3E%3C%2Fsvg%3E");
4233}
4234.ios .color-theme-gray .icon-back,
4235.ios .icon-back.color-gray,
4236.ios a.link.color-gray .icon-back,
4237.ios .color-theme-gray .icon-prev,
4238.ios .icon-prev.color-gray,
4239.ios a.link.color-gray .icon-prev {
4240 background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D'12'%20height%3D'20'%20viewBox%3D'0%200%2012%2020'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%3Cpath%20d%3D'M.18261596%209.4221638c.0352203-.05148305.07573462-.10050698.1215468-.14631917L9.1425872.4374202c.5830904-.58309038%201.52656832-.5849888%202.11643872.00488163.5857864.58578644.591222%201.53009836.0048816%202.11643873L3.82594417%209.9967039l7.43188553%207.4318855c.5830904.5830904.5849888%201.5265683-.0048817%202.1164387-.5857864.5857865-1.5300983.591222-2.11643868.0048816L.2980849%2010.7114853c-.3526746-.3526746-.3939974-.89699-.11546894-1.2893215z'%20fill%3D'%238e8e93'%20fill-rule%3D'evenodd'%2F%3E%3C%2Fsvg%3E");
4241}
4242.ios .color-theme-gray .icon-forward,
4243.ios .icon-forward.color-gray,
4244.ios a.link.color-gray .icon-forward,
4245.ios .color-theme-gray .icon-next,
4246.ios .icon-next.color-gray,
4247.ios a.link.color-gray .icon-next {
4248 background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D'12'%20height%3D'20'%20viewBox%3D'0%200%2012%2020'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%3Cpath%20d%3D'M11.51840604%2010.5648622c-.0352203.05148305-.07573462.10050698-.1215468.14631917L2.5584348%2019.5496058c-.5830904.58309038-1.52656832.5849888-2.11643872-.00488163-.5857864-.58578644-.591222-1.53009836-.0048816-2.11643873L7.87507783%209.9903221.4431923%202.5584366C-.1398981%201.9753462-.1417965%201.0318683.448074.4419979c.5857864-.5857865%201.5300983-.591222%202.11643868-.0048816l8.83842442%208.8384244c.3526746.3526746.3939974.89699.11546894%201.2893215z'%20fill%3D'%238e8e93'%20fill-rule%3D'evenodd'%2F%3E%3C%2Fsvg%3E");
4249}
4250.ios .color-theme-white .icon-back,
4251.ios .icon-back.color-white,
4252.ios a.link.color-white .icon-back,
4253.ios .color-theme-white .icon-prev,
4254.ios .icon-prev.color-white,
4255.ios a.link.color-white .icon-prev {
4256 background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D'12'%20height%3D'20'%20viewBox%3D'0%200%2012%2020'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%3Cpath%20d%3D'M.18261596%209.4221638c.0352203-.05148305.07573462-.10050698.1215468-.14631917L9.1425872.4374202c.5830904-.58309038%201.52656832-.5849888%202.11643872.00488163.5857864.58578644.591222%201.53009836.0048816%202.11643873L3.82594417%209.9967039l7.43188553%207.4318855c.5830904.5830904.5849888%201.5265683-.0048817%202.1164387-.5857864.5857865-1.5300983.591222-2.11643868.0048816L.2980849%2010.7114853c-.3526746-.3526746-.3939974-.89699-.11546894-1.2893215z'%20fill%3D'%23ffffff'%20fill-rule%3D'evenodd'%2F%3E%3C%2Fsvg%3E");
4257}
4258.ios .color-theme-white .icon-forward,
4259.ios .icon-forward.color-white,
4260.ios a.link.color-white .icon-forward,
4261.ios .color-theme-white .icon-next,
4262.ios .icon-next.color-white,
4263.ios a.link.color-white .icon-next {
4264 background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D'12'%20height%3D'20'%20viewBox%3D'0%200%2012%2020'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%3Cpath%20d%3D'M11.51840604%2010.5648622c-.0352203.05148305-.07573462.10050698-.1215468.14631917L2.5584348%2019.5496058c-.5830904.58309038-1.52656832.5849888-2.11643872-.00488163-.5857864-.58578644-.591222-1.53009836-.0048816-2.11643873L7.87507783%209.9903221.4431923%202.5584366C-.1398981%201.9753462-.1417965%201.0318683.448074.4419979c.5857864-.5857865%201.5300983-.591222%202.11643868-.0048816l8.83842442%208.8384244c.3526746.3526746.3939974.89699.11546894%201.2893215z'%20fill%3D'%23ffffff'%20fill-rule%3D'evenodd'%2F%3E%3C%2Fsvg%3E");
4265}
4266.ios .color-theme-black .icon-back,
4267.ios .icon-back.color-black,
4268.ios a.link.color-black .icon-back,
4269.ios .color-theme-black .icon-prev,
4270.ios .icon-prev.color-black,
4271.ios a.link.color-black .icon-prev {
4272 background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D'12'%20height%3D'20'%20viewBox%3D'0%200%2012%2020'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%3Cpath%20d%3D'M.18261596%209.4221638c.0352203-.05148305.07573462-.10050698.1215468-.14631917L9.1425872.4374202c.5830904-.58309038%201.52656832-.5849888%202.11643872.00488163.5857864.58578644.591222%201.53009836.0048816%202.11643873L3.82594417%209.9967039l7.43188553%207.4318855c.5830904.5830904.5849888%201.5265683-.0048817%202.1164387-.5857864.5857865-1.5300983.591222-2.11643868.0048816L.2980849%2010.7114853c-.3526746-.3526746-.3939974-.89699-.11546894-1.2893215z'%20fill%3D'%23000000'%20fill-rule%3D'evenodd'%2F%3E%3C%2Fsvg%3E");
4273}
4274.ios .color-theme-black .icon-forward,
4275.ios .icon-forward.color-black,
4276.ios a.link.color-black .icon-forward,
4277.ios .color-theme-black .icon-next,
4278.ios .icon-next.color-black,
4279.ios a.link.color-black .icon-next {
4280 background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D'12'%20height%3D'20'%20viewBox%3D'0%200%2012%2020'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%3Cpath%20d%3D'M11.51840604%2010.5648622c-.0352203.05148305-.07573462.10050698-.1215468.14631917L2.5584348%2019.5496058c-.5830904.58309038-1.52656832.5849888-2.11643872-.00488163-.5857864-.58578644-.591222-1.53009836-.0048816-2.11643873L7.87507783%209.9903221.4431923%202.5584366C-.1398981%201.9753462-.1417965%201.0318683.448074.4419979c.5857864-.5857865%201.5300983-.591222%202.11643868-.0048816l8.83842442%208.8384244c.3526746.3526746.3939974.89699.11546894%201.2893215z'%20fill%3D'%23000000'%20fill-rule%3D'evenodd'%2F%3E%3C%2Fsvg%3E");
4281}
4282.ios .icon.color-red {
4283 color: #ff3b30;
4284}
4285.ios .icon.color-green {
4286 color: #4cd964;
4287}
4288.ios .icon.color-blue {
4289 color: #007aff;
4290}
4291.ios .icon.color-pink {
4292 color: #ff2d55;
4293}
4294.ios .icon.color-yellow {
4295 color: #ffcc00;
4296}
4297.ios .icon.color-orange {
4298 color: #ff9500;
4299}
4300.ios .icon.color-gray {
4301 color: #8e8e93;
4302}
4303.ios .icon.color-white {
4304 color: #ffffff;
4305}
4306.ios .icon.color-black {
4307 color: #000000;
4308}
4309.custom-modal-backdrop {
4310 position: absolute;
4311 left: 0;
4312 top: 0;
4313 width: 100%;
4314 height: 100%;
4315 background: rgba(0, 0, 0, 0.4);
4316 z-index: 13000;
4317 visibility: hidden;
4318 opacity: 0;
4319 -webkit-transition-duration: 400ms;
4320 transition-duration: 400ms;
4321 z-index: 10500;
4322}
4323.custom-modal-backdrop.not-animated {
4324 -webkit-transition-duration: 0ms;
4325 transition-duration: 0ms;
4326}
4327.custom-modal-backdrop.backdrop-in {
4328 visibility: visible;
4329 opacity: 1;
4330}
4331/* === Dialog === */
4332.dialog-backdrop {
4333 position: absolute;
4334 left: 0;
4335 top: 0;
4336 width: 100%;
4337 height: 100%;
4338 background: rgba(0, 0, 0, 0.4);
4339 z-index: 13000;
4340 visibility: hidden;
4341 opacity: 0;
4342 -webkit-transition-duration: 400ms;
4343 transition-duration: 400ms;
4344}
4345.dialog-backdrop.not-animated {
4346 -webkit-transition-duration: 0ms;
4347 transition-duration: 0ms;
4348}
4349.dialog-backdrop.backdrop-in {
4350 visibility: visible;
4351 opacity: 1;
4352}
4353.dialog {
4354 position: absolute;
4355 z-index: 13500;
4356 left: 50%;
4357 margin-top: 0;
4358 top: 50%;
4359 overflow: hidden;
4360 opacity: 0;
4361 -webkit-transform: translate3d(0, 0, 0) scale(1.185);
4362 transform: translate3d(0, 0, 0) scale(1.185);
4363 -webkit-transition-property: opacity, -webkit-transform;
4364 transition-property: opacity, -webkit-transform;
4365 transition-property: transform, opacity;
4366 transition-property: transform, opacity, -webkit-transform;
4367 display: none;
4368 -webkit-transition-duration: 400ms;
4369 transition-duration: 400ms;
4370}
4371.dialog.modal-in {
4372 opacity: 1;
4373 -webkit-transform: translate3d(0, 0, 0) scale(1);
4374 transform: translate3d(0, 0, 0) scale(1);
4375}
4376.dialog.modal-out {
4377 opacity: 0;
4378 z-index: 13499;
4379}
4380.dialog.not-animated {
4381 -webkit-transition-duration: 0ms;
4382 transition-duration: 0ms;
4383}
4384.dialog-inner {
4385 position: relative;
4386}
4387.dialog-title {
4388 font-weight: 500;
4389}
4390.dialog-buttons {
4391 position: relative;
4392 display: -webkit-box;
4393 display: -webkit-flex;
4394 display: -ms-flexbox;
4395 display: flex;
4396}
4397.dialog-buttons-vertical .dialog-buttons {
4398 display: block;
4399 height: auto !important;
4400}
4401.dialog-no-buttons .dialog-buttons {
4402 display: none;
4403}
4404.dialog-input-field {
4405 position: relative;
4406}
4407.dialog-input-field .item-input-wrap {
4408 margin: 0;
4409 padding: 0;
4410}
4411.dialog-input {
4412 -webkit-box-sizing: border-box;
4413 box-sizing: border-box;
4414 margin: 0;
4415 margin-top: 15px;
4416 border-radius: 0;
4417 -webkit-appearance: none;
4418 -moz-appearance: none;
4419 appearance: none;
4420 width: 100%;
4421 display: block;
4422 font-family: inherit;
4423 -webkit-box-shadow: none;
4424 box-shadow: none;
4425}
4426html.with-modal-dialog .page-content {
4427 overflow: hidden;
4428 -webkit-overflow-scrolling: auto;
4429}
4430.ios .dialog {
4431 width: 270px;
4432 margin-left: -135px;
4433 text-align: center;
4434 border-radius: 13px;
4435 color: #000;
4436}
4437.ios .dialog.modal-out {
4438 -webkit-transform: translate3d(0, 0, 0) scale(1);
4439 transform: translate3d(0, 0, 0) scale(1);
4440}
4441.ios .dialog-inner {
4442 padding: 15px;
4443 border-radius: 13px 13px 0 0;
4444 background: rgba(255, 255, 255, 0.95);
4445}
4446.ios .dialog-inner:after {
4447 content: '';
4448 position: absolute;
4449 background-color: rgba(0, 0, 0, 0.2);
4450 display: block;
4451 z-index: 15;
4452 top: auto;
4453 right: auto;
4454 bottom: 0;
4455 left: 0;
4456 height: 1px;
4457 width: 100%;
4458 -webkit-transform-origin: 50% 100%;
4459 transform-origin: 50% 100%;
4460}
4461.ios.device-pixel-ratio-2 .dialog-inner:after {
4462 -webkit-transform: scaleY(0.5);
4463 transform: scaleY(0.5);
4464}
4465.ios.device-pixel-ratio-3 .dialog-inner:after {
4466 -webkit-transform: scaleY(0.33);
4467 transform: scaleY(0.33);
4468}
4469.ios .dialog-title {
4470 font-size: 18px;
4471 text-align: center;
4472 font-weight: 600;
4473}
4474.ios .dialog-title + .dialog-text {
4475 margin-top: 5px;
4476}
4477.ios .dialog-buttons {
4478 height: 44px;
4479 -webkit-box-pack: center;
4480 -webkit-justify-content: center;
4481 -ms-flex-pack: center;
4482 justify-content: center;
4483}
4484.ios .dialog-button {
4485 width: 100%;
4486 padding: 0 5px;
4487 height: 44px;
4488 font-size: 17px;
4489 line-height: 44px;
4490 text-align: center;
4491 color: #007aff;
4492 display: block;
4493 position: relative;
4494 white-space: nowrap;
4495 text-overflow: ellipsis;
4496 overflow: hidden;
4497 cursor: pointer;
4498 -webkit-box-sizing: border-box;
4499 box-sizing: border-box;
4500 -webkit-box-flex: 1;
4501 -ms-flex: 1;
4502 background: rgba(255, 255, 255, 0.95);
4503}
4504.ios .dialog-button:first-child {
4505 border-radius: 0 0 0 13px;
4506}
4507.ios .dialog-button:last-child {
4508 border-radius: 0 0 13px 0;
4509}
4510.ios .dialog-button:last-child:after {
4511 display: none !important;
4512}
4513.ios .dialog-button:first-child:last-child {
4514 border-radius: 0 0 13px 13px;
4515}
4516.ios .dialog-button.dialog-button-bold {
4517 font-weight: 500;
4518}
4519.ios .dialog-button.active-state {
4520 background: rgba(230, 230, 230, 0.95);
4521}
4522.ios .dialog-buttons-vertical .dialog-buttons {
4523 height: auto;
4524}
4525.ios .dialog-buttons-vertical .dialog-button {
4526 border-radius: 0;
4527}
4528.ios .dialog-buttons-vertical .dialog-button:last-child {
4529 border-radius: 0 0 13px 13px;
4530}
4531.ios .dialog-buttons-vertical .dialog-button:last-child:after {
4532 display: none !important;
4533}
4534.ios .dialog-button:after {
4535 content: '';
4536 position: absolute;
4537 background-color: rgba(0, 0, 0, 0.2);
4538 display: block;
4539 z-index: 15;
4540 top: 0;
4541 right: 0;
4542 bottom: auto;
4543 left: auto;
4544 width: 1px;
4545 height: 100%;
4546 -webkit-transform-origin: 100% 50%;
4547 transform-origin: 100% 50%;
4548}
4549.ios.device-pixel-ratio-2 .dialog-button:after {
4550 -webkit-transform: scaleX(0.5);
4551 transform: scaleX(0.5);
4552}
4553.ios.device-pixel-ratio-3 .dialog-button:after {
4554 -webkit-transform: scaleX(0.33);
4555 transform: scaleX(0.33);
4556}
4557.ios .dialog-buttons-vertical .dialog-button:after {
4558 content: '';
4559 position: absolute;
4560 background-color: rgba(0, 0, 0, 0.2);
4561 display: block;
4562 z-index: 15;
4563 top: auto;
4564 right: auto;
4565 bottom: 0;
4566 left: 0;
4567 height: 1px;
4568 width: 100%;
4569 -webkit-transform-origin: 50% 100%;
4570 transform-origin: 50% 100%;
4571}
4572.ios.device-pixel-ratio-2 .dialog-buttons-vertical .dialog-button:after {
4573 -webkit-transform: scaleY(0.5);
4574 transform: scaleY(0.5);
4575}
4576.ios.device-pixel-ratio-3 .dialog-buttons-vertical .dialog-button:after {
4577 -webkit-transform: scaleY(0.33);
4578 transform: scaleY(0.33);
4579}
4580.ios .dialog-no-buttons .dialog-inner {
4581 border-radius: 13px;
4582}
4583.ios .dialog-no-buttons .dialog-inner:after {
4584 display: none !important;
4585}
4586.ios .dialog-input-field {
4587 margin-top: 15px;
4588}
4589.ios .dialog-input-field .item-input-wrap {
4590 margin: 0;
4591}
4592.ios .dialog-input {
4593 height: 26px;
4594 background: #fff;
4595 padding: 0 5px;
4596 border: 1px solid rgba(0, 0, 0, 0.3);
4597 font-size: 14px;
4598}
4599.ios .dialog-input + .dialog-input {
4600 margin-top: 5px;
4601}
4602.ios .dialog-input-double + .dialog-input-double {
4603 margin-top: 0;
4604}
4605.ios .dialog-input-double + .dialog-input-double .dialog-input {
4606 border-top: 0;
4607 margin-top: 0;
4608}
4609.ios .dialog-preloader .dialog-title ~ .preloader,
4610.ios .dialog-preloader .dialog-text ~ .preloader {
4611 margin-top: 5px;
4612}
4613.ios .dialog-preloader .preloader {
4614 width: 34px;
4615 height: 34px;
4616}
4617.ios .dialog-progress .dialog-title ~ .progressbar,
4618.ios .dialog-progress .dialog-text ~ .progressbar,
4619.ios .dialog-progress .dialog-title ~ .progressbar-infinite,
4620.ios .dialog-progress .dialog-text ~ .progressbar-infinite {
4621 margin-top: 15px;
4622}
4623.ios .dialog-button.color-red {
4624 color: #ff3b30;
4625}
4626.ios .dialog-button.color-green {
4627 color: #4cd964;
4628}
4629.ios .dialog-button.color-blue {
4630 color: #007aff;
4631}
4632.ios .dialog-button.color-pink {
4633 color: #ff2d55;
4634}
4635.ios .dialog-button.color-yellow {
4636 color: #ffcc00;
4637}
4638.ios .dialog-button.color-orange {
4639 color: #ff9500;
4640}
4641.ios .dialog-button.color-gray {
4642 color: #8e8e93;
4643}
4644.ios .dialog-button.color-white {
4645 color: #ffffff;
4646}
4647.ios .dialog-button.color-black {
4648 color: #000000;
4649}
4650/* === Popup === */
4651.popup-backdrop {
4652 position: absolute;
4653 left: 0;
4654 top: 0;
4655 width: 100%;
4656 height: 100%;
4657 background: rgba(0, 0, 0, 0.4);
4658 z-index: 13000;
4659 visibility: hidden;
4660 opacity: 0;
4661 -webkit-transition-duration: 400ms;
4662 transition-duration: 400ms;
4663 z-index: 10500;
4664}
4665.popup-backdrop.not-animated {
4666 -webkit-transition-duration: 0ms;
4667 transition-duration: 0ms;
4668}
4669.popup-backdrop.backdrop-in {
4670 visibility: visible;
4671 opacity: 1;
4672}
4673.popup {
4674 position: absolute;
4675 left: 0;
4676 top: 0;
4677 width: 100%;
4678 height: 100%;
4679 display: none;
4680 -webkit-box-sizing: border-box;
4681 box-sizing: border-box;
4682 -webkit-transition-property: -webkit-transform;
4683 transition-property: -webkit-transform;
4684 transition-property: transform;
4685 transition-property: transform, -webkit-transform;
4686 -webkit-transform: translate3d(0, 100%, 0);
4687 transform: translate3d(0, 100%, 0);
4688 background: #fff;
4689 z-index: 11000;
4690}
4691.popup.modal-in,
4692.popup.modal-out {
4693 -webkit-transition-duration: 400ms;
4694 transition-duration: 400ms;
4695}
4696.popup.not-animated {
4697 -webkit-transition-duration: 0ms;
4698 transition-duration: 0ms;
4699}
4700.popup.modal-in {
4701 display: block;
4702 -webkit-transform: translate3d(0, 0, 0);
4703 transform: translate3d(0, 0, 0);
4704}
4705.popup.modal-out {
4706 -webkit-transform: translate3d(0, 100%, 0);
4707 transform: translate3d(0, 100%, 0);
4708}
4709@media (min-width: 630px) and (min-height: 630px) {
4710 .popup:not(.popup-tablet-fullscreen) {
4711 width: 630px;
4712 height: 630px;
4713 left: 50%;
4714 top: 50%;
4715 margin-left: -315px;
4716 margin-top: -315px;
4717 -webkit-transform: translate3d(0, 100vh, 0);
4718 transform: translate3d(0, 100vh, 0);
4719 }
4720 .popup:not(.popup-tablet-fullscreen).modal-in {
4721 -webkit-transform: translate3d(0, 0, 0);
4722 transform: translate3d(0, 0, 0);
4723 }
4724 .popup:not(.popup-tablet-fullscreen).modal-out {
4725 -webkit-transform: translate3d(0, 100vh, 0);
4726 transform: translate3d(0, 100vh, 0);
4727 }
4728}
4729@media (max-width: 629px), (max-height: 629px) {
4730 html.with-statusbar .popup-backdrop {
4731 z-index: 9500;
4732 }
4733 html.with-statusbar.device-ios .popup,
4734 html.with-statusbar.ios:not(.device-ios):not(.device-android) .popup {
4735 height: calc(100% - 20px);
4736 top: 20px;
4737 }
4738 html.with-statusbar.device-iphone-x .popup {
4739 height: calc(100% - constant(safe-area-inset-top));
4740 height: calc(100% - env(safe-area-inset-top));
4741 top: constant(safe-area-inset-top);
4742 top: env(safe-area-inset-top);
4743 }
4744 html.with-statusbar.device-android .popup,
4745 html.with-statusbar.md:not(.device-ios):not(.device-android) .popup {
4746 height: calc(100% - 24px);
4747 top: 24px;
4748 }
4749}
4750@media (min-width: 630px), (min-height: 630px) {
4751 html.with-statusbar.device-ios .popup-tablet-fullscreen,
4752 html.with-statusbar.ios:not(.device-ios):not(.device-android) .popup-tablet-fullscreen {
4753 height: calc(100% - 20px);
4754 top: 20px;
4755 }
4756 html.with-statusbar.device-iphone-x .popup-tablet-fullscreen {
4757 height: calc(100% - constant(safe-area-inset-top));
4758 height: calc(100% - env(safe-area-inset-top));
4759 top: constant(safe-area-inset-top);
4760 top: env(safe-area-inset-top);
4761 }
4762 html.with-statusbar.device-android .popup-tablet-fullscreen,
4763 html.with-statusbar.md:not(.device-ios):not(.device-android) .popup-tablet-fullscreen {
4764 height: calc(100% - 24px);
4765 top: 24px;
4766 }
4767}
4768html.with-modal-popup .framework7-root > .views .page-content,
4769html.with-modal-popup .framework7-root > .view .page-content,
4770html.with-modal-popup .framework7-root > .panel .page-content {
4771 overflow: hidden;
4772 -webkit-overflow-scrolling: auto;
4773}
4774/* === Login Screen === */
4775.login-screen {
4776 position: absolute;
4777 left: 0;
4778 top: 0;
4779 width: 100%;
4780 height: 100%;
4781 display: none;
4782 -webkit-box-sizing: border-box;
4783 box-sizing: border-box;
4784 -webkit-transition-property: -webkit-transform;
4785 transition-property: -webkit-transform;
4786 transition-property: transform;
4787 transition-property: transform, -webkit-transform;
4788 -webkit-transform: translate3d(0, 100%, 0);
4789 transform: translate3d(0, 100%, 0);
4790 background: #fff;
4791 z-index: 11000;
4792}
4793.login-screen.modal-in,
4794.login-screen.modal-out {
4795 -webkit-transition-duration: 400ms;
4796 transition-duration: 400ms;
4797}
4798.login-screen.not-animated {
4799 -webkit-transition-duration: 0ms;
4800 transition-duration: 0ms;
4801}
4802.login-screen.modal-in {
4803 display: block;
4804 -webkit-transform: translate3d(0, 0, 0);
4805 transform: translate3d(0, 0, 0);
4806}
4807.login-screen.modal-out {
4808 -webkit-transform: translate3d(0, 100%, 0);
4809 transform: translate3d(0, 100%, 0);
4810}
4811html.with-statusbar.device-ios .login-screen,
4812html.with-statusbar.ios:not(.device-ios):not(.device-android) .login-screen {
4813 height: calc(100% - 20px);
4814 top: 20px;
4815}
4816html.with-statusbar.device-iphone-x .login-screen {
4817 height: calc(100% - constant(safe-area-inset-top));
4818 height: calc(100% - env(safe-area-inset-top));
4819 top: constant(safe-area-inset-top);
4820 top: env(safe-area-inset-top);
4821}
4822html.with-statusbar.device-android .login-screen,
4823html.with-statusbar.md:not(.device-ios):not(.device-android) .login-screen {
4824 height: calc(100% - 24px);
4825 top: 24px;
4826}
4827.login-screen-content {
4828 background: #fff;
4829}
4830.login-screen-content .login-screen-title,
4831.login-screen-content .list,
4832.login-screen-content .block,
4833.login-screen-content .block-footer,
4834.login-screen-content .block-header {
4835 max-width: 480px;
4836}
4837.login-screen-content .list ul {
4838 background: none;
4839}
4840.login-screen-content .list ul:before {
4841 display: none !important;
4842}
4843.login-screen-content .list ul:after {
4844 display: none !important;
4845}
4846.login-screen-content .block-footer,
4847.login-screen-content .block-header {
4848 text-align: center;
4849 margin-left: auto;
4850 margin-right: auto;
4851}
4852.login-screen-title {
4853 text-align: center;
4854}
4855.ios .login-screen-content .login-screen-title,
4856.ios .login-screen-content .list,
4857.ios .login-screen-content .block {
4858 margin: 25px auto;
4859}
4860.ios .login-screen-title {
4861 font-size: 30px;
4862}
4863.ios .theme-dark .login-screen-content,
4864.ios .theme-dark .login-screen-content .list ul {
4865 background-color: transparent;
4866}
4867/* === Popover === */
4868.popover-backdrop {
4869 position: absolute;
4870 left: 0;
4871 top: 0;
4872 width: 100%;
4873 height: 100%;
4874 background: rgba(0, 0, 0, 0.4);
4875 z-index: 13000;
4876 visibility: hidden;
4877 opacity: 0;
4878 -webkit-transition-duration: 400ms;
4879 transition-duration: 400ms;
4880}
4881.popover-backdrop.not-animated {
4882 -webkit-transition-duration: 0ms;
4883 transition-duration: 0ms;
4884}
4885.popover-backdrop.backdrop-in {
4886 visibility: visible;
4887 opacity: 1;
4888}
4889.popover {
4890 width: 260px;
4891 z-index: 13500;
4892 margin: 0;
4893 top: 0;
4894 opacity: 0;
4895 left: 0;
4896 position: absolute;
4897 display: none;
4898 -webkit-transition-duration: 300ms;
4899 transition-duration: 300ms;
4900}
4901.popover .list {
4902 margin: 0;
4903}
4904.popover .list ul {
4905 background: none;
4906}
4907.popover .list:first-child ul:before {
4908 display: none !important;
4909}
4910.popover .list:last-child ul:after {
4911 display: none !important;
4912}
4913.popover.modal-in {
4914 opacity: 1;
4915}
4916.popover.not-animated {
4917 -webkit-transition-duration: 0ms;
4918 transition-duration: 0ms;
4919}
4920.popover-inner {
4921 overflow: auto;
4922 -webkit-overflow-scrolling: touch;
4923}
4924.popover-from-actions-bold {
4925 font-weight: 600;
4926}
4927.popover-from-actions-label {
4928 line-height: 1.3;
4929 position: relative;
4930}
4931.popover-from-actions-label:last-child:after {
4932 display: none !important;
4933}
4934.ios .popover {
4935 background: rgba(255, 255, 255, 0.95);
4936 border-radius: 13px;
4937 -webkit-transform: none;
4938 transform: none;
4939 -webkit-transition-property: opacity;
4940 transition-property: opacity;
4941}
4942.ios .popover .list:first-child ul {
4943 border-radius: 13px 13px 0 0;
4944}
4945.ios .popover .list:first-child li:first-child,
4946.ios .popover .list:first-child li:first-child a,
4947.ios .popover .list:first-child li:first-child > label {
4948 border-radius: 13px 13px 0 0;
4949}
4950.ios .popover .list:last-child ul {
4951 border-radius: 0 0 13px 13px;
4952}
4953.ios .popover .list:last-child li:last-child,
4954.ios .popover .list:last-child li:last-child a,
4955.ios .popover .list:last-child li:last-child > label {
4956 border-radius: 0 0 13px 13px;
4957}
4958.ios .popover .list:first-child:last-child li:first-child:last-child,
4959.ios .popover .list:first-child:last-child li:first-child:last-child a,
4960.ios .popover .list:first-child:last-child li:first-child:last-child > label,
4961.ios .popover .list:first-child:last-child ul {
4962 border-radius: 13px;
4963}
4964.ios .popover .list + .list {
4965 margin-top: 35px;
4966}
4967.ios .popover-angle {
4968 width: 26px;
4969 height: 26px;
4970 position: absolute;
4971 left: -26px;
4972 top: 0;
4973 z-index: 100;
4974 overflow: hidden;
4975}
4976.ios .popover-angle:after {
4977 content: '';
4978 background: rgba(255, 255, 255, 0.95);
4979 width: 26px;
4980 height: 26px;
4981 position: absolute;
4982 left: 0;
4983 top: 0;
4984 border-radius: 3px;
4985 -webkit-transform: rotate(45deg);
4986 transform: rotate(45deg);
4987}
4988.ios .popover-angle.on-left {
4989 left: -26px;
4990}
4991.ios .popover-angle.on-left:after {
4992 left: 19px;
4993 top: 0;
4994}
4995.ios .popover-angle.on-right {
4996 left: 100%;
4997}
4998.ios .popover-angle.on-right:after {
4999 left: -19px;
5000 top: 0;
5001}
5002.ios .popover-angle.on-top {
5003 left: 0;
5004 top: -26px;
5005}
5006.ios .popover-angle.on-top:after {
5007 left: 0;
5008 top: 19px;
5009}
5010.ios .popover-angle.on-bottom {
5011 left: 0;
5012 top: 100%;
5013}
5014.ios .popover-angle.on-bottom:after {
5015 left: 0;
5016 top: -19px;
5017}
5018.ios .popover-from-actions .list + .list {
5019 margin-top: 20px;
5020}
5021.ios .popover-from-actions .list ul {
5022 background: #fff;
5023}
5024.ios .popover-from-actions .item-link i.icon {
5025 width: 29px;
5026 height: 29px;
5027 font-size: 29px;
5028}
5029.ios .popover-from-actions-label {
5030 padding: 8px 10px;
5031 color: #8a8a8a;
5032 font-size: 13px;
5033 text-align: center;
5034}
5035.ios .popover-from-actions-label:after {
5036 content: '';
5037 position: absolute;
5038 background-color: rgba(0, 0, 0, 0.2);
5039 display: block;
5040 z-index: 15;
5041 top: auto;
5042 right: auto;
5043 bottom: 0;
5044 left: 0;
5045 height: 1px;
5046 width: 100%;
5047 -webkit-transform-origin: 50% 100%;
5048 transform-origin: 50% 100%;
5049}
5050.ios.device-pixel-ratio-2 .popover-from-actions-label:after {
5051 -webkit-transform: scaleY(0.5);
5052 transform: scaleY(0.5);
5053}
5054.ios.device-pixel-ratio-3 .popover-from-actions-label:after {
5055 -webkit-transform: scaleY(0.33);
5056 transform: scaleY(0.33);
5057}
5058.ios .theme-dark .popover,
5059.popover.ios .theme-dark {
5060 background: rgba(30, 30, 30, 0.95);
5061}
5062.ios .theme-dark .popover .popover-angle:after,
5063.popover.ios .theme-dark .popover-angle:after {
5064 background: rgba(30, 30, 30, 0.95);
5065}
5066.ios .theme-dark .popover .list ul,
5067.popover.ios .theme-dark .list ul {
5068 background-color: transparent;
5069}
5070/* === Actions === */
5071.actions-backdrop {
5072 position: absolute;
5073 left: 0;
5074 top: 0;
5075 width: 100%;
5076 height: 100%;
5077 background: rgba(0, 0, 0, 0.4);
5078 z-index: 13000;
5079 visibility: hidden;
5080 opacity: 0;
5081 -webkit-transition-duration: 400ms;
5082 transition-duration: 400ms;
5083}
5084.actions-backdrop.not-animated {
5085 -webkit-transition-duration: 0ms;
5086 transition-duration: 0ms;
5087}
5088.actions-backdrop.backdrop-in {
5089 visibility: visible;
5090 opacity: 1;
5091}
5092.actions-modal {
5093 position: absolute;
5094 left: 0;
5095 bottom: 0;
5096 z-index: 13500;
5097 width: 100%;
5098 -webkit-transform: translate3d(0, 100%, 0);
5099 transform: translate3d(0, 100%, 0);
5100 display: none;
5101 max-height: 100%;
5102 overflow: auto;
5103 -webkit-overflow-scrolling: touch;
5104 -webkit-transition-property: -webkit-transform;
5105 transition-property: -webkit-transform;
5106 transition-property: transform;
5107 transition-property: transform, -webkit-transform;
5108}
5109.actions-modal.modal-in,
5110.actions-modal.modal-out {
5111 -webkit-transition-duration: 300ms;
5112 transition-duration: 300ms;
5113}
5114.actions-modal.not-animated {
5115 -webkit-transition-duration: 0ms;
5116 transition-duration: 0ms;
5117}
5118.actions-modal.modal-in {
5119 -webkit-transform: translate3d(0, 0, 0);
5120 transform: translate3d(0, 0, 0);
5121}
5122.actions-modal.modal-out {
5123 z-index: 13499;
5124 -webkit-transform: translate3d(0, 100%, 0);
5125 transform: translate3d(0, 100%, 0);
5126}
5127@media (min-width: 496px) {
5128 .actions-modal {
5129 width: 480px;
5130 left: 50%;
5131 margin-left: -240px;
5132 }
5133}
5134.actions-group {
5135 position: relative;
5136}
5137.actions-button,
5138.actions-label {
5139 width: 100%;
5140 font-weight: normal;
5141 margin: 0;
5142 -webkit-box-sizing: border-box;
5143 box-sizing: border-box;
5144 display: block;
5145 position: relative;
5146}
5147.actions-button a,
5148.actions-label a {
5149 text-decoration: none;
5150 color: inherit;
5151 display: block;
5152}
5153.actions-button b,
5154.actions-label b,
5155.actions-button.actions-button-bold,
5156.actions-label.actions-button-bold {
5157 font-weight: 500;
5158}
5159.actions-button {
5160 cursor: pointer;
5161 display: -webkit-box;
5162 display: -webkit-flex;
5163 display: -ms-flexbox;
5164 display: flex;
5165}
5166.actions-button-media {
5167 -webkit-flex-shrink: 0;
5168 -ms-flex-negative: 0;
5169 flex-shrink: 0;
5170 display: -webkit-box;
5171 display: -webkit-flex;
5172 display: -ms-flexbox;
5173 display: flex;
5174 -webkit-box-align: center;
5175 -webkit-align-items: center;
5176 -ms-flex-align: center;
5177 align-items: center;
5178}
5179.actions-button-text {
5180 width: 100%;
5181 -webkit-flex-shrink: 1;
5182 -ms-flex-negative: 1;
5183 flex-shrink: 1;
5184}
5185.actions-label {
5186 line-height: 1.3;
5187 display: -webkit-box;
5188 display: -webkit-flex;
5189 display: -ms-flexbox;
5190 display: flex;
5191 -webkit-box-align: center;
5192 -webkit-align-items: center;
5193 -ms-flex-align: center;
5194 align-items: center;
5195}
5196.actions-grid .actions-group {
5197 display: -webkit-box;
5198 display: -webkit-flex;
5199 display: -ms-flexbox;
5200 display: flex;
5201 -webkit-flex-wrap: wrap;
5202 -ms-flex-wrap: wrap;
5203 flex-wrap: wrap;
5204 -webkit-box-pack: start;
5205 -webkit-justify-content: flex-start;
5206 -ms-flex-pack: start;
5207 justify-content: flex-start;
5208}
5209.actions-grid .actions-button {
5210 width: 33.33333333%;
5211 display: block;
5212}
5213.actions-grid .actions-button-media {
5214 margin-left: auto;
5215 margin-right: auto;
5216}
5217.actions-grid .actions-button-text {
5218 margin-left: 0 !important;
5219 text-align: center;
5220}
5221.ios .actions-group {
5222 margin: 8px;
5223 border-radius: 13px;
5224 overflow: hidden;
5225 -webkit-transform: translate3d(0, 0, 0);
5226 transform: translate3d(0, 0, 0);
5227}
5228.ios .actions-button,
5229.ios .actions-label {
5230 text-align: center;
5231 overflow: hidden;
5232 background: rgba(255, 255, 255, 0.95);
5233}
5234.ios .actions-button b,
5235.ios .actions-label b,
5236.ios .actions-button.actions-button-bold,
5237.ios .actions-label.actions-button-bold {
5238 font-weight: 600;
5239}
5240.ios .actions-button:first-child,
5241.ios .actions-label:first-child {
5242 border-radius: 13px 13px 0 0;
5243}
5244.ios .actions-button:last-child,
5245.ios .actions-label:last-child {
5246 border-radius: 0 0 13px 13px;
5247}
5248.ios .actions-button:last-child:after,
5249.ios .actions-label:last-child:after {
5250 display: none !important;
5251}
5252.ios .actions-button:first-child:last-child,
5253.ios .actions-label:first-child:last-child {
5254 border-radius: 13px;
5255}
5256.ios .actions-button {
5257 height: 57px;
5258 line-height: 57px;
5259 font-size: 20px;
5260 color: #007aff;
5261 white-space: normal;
5262 text-overflow: ellipsis;
5263 -webkit-box-pack: center;
5264 -webkit-justify-content: center;
5265 -ms-flex-pack: center;
5266 justify-content: center;
5267}
5268.ios .actions-button.active-state {
5269 background: rgba(230, 230, 230, 0.9);
5270}
5271.ios .actions-button-media {
5272 margin-left: 15px;
5273}
5274.ios .actions-button-media i.icon {
5275 width: 29px;
5276 height: 29px;
5277 font-size: 29px;
5278}
5279.ios .actions-button-media + .actions-button-text {
5280 text-align: left;
5281 margin-left: 15px;
5282}
5283.ios .actions-label {
5284 font-size: 13px;
5285 min-height: 57px;
5286 padding: 8px 10px;
5287 color: #8a8a8a;
5288 -webkit-box-pack: center;
5289 -webkit-justify-content: center;
5290 -ms-flex-pack: center;
5291 justify-content: center;
5292}
5293@media (orientation: lanscape) {
5294 .ios .actions-label {
5295 min-height: 44px;
5296 }
5297 .ios .actions-button {
5298 height: 44px;
5299 line-height: 44px;
5300 }
5301}
5302.ios .actions-grid .actions-group {
5303 margin-top: 0;
5304 border-radius: 0;
5305 background: rgba(255, 255, 255, 0.95);
5306}
5307.ios .actions-grid .actions-group:first-child {
5308 border-radius: 13px 13px 0 0;
5309}
5310.ios .actions-grid .actions-group:last-child {
5311 border-radius: 0 0 13px 13px;
5312}
5313.ios .actions-grid .actions-group:first-child:last-child {
5314 border-radius: 13px;
5315}
5316.ios .actions-grid .actions-group:not(:last-child) {
5317 margin-bottom: 0;
5318}
5319.ios .actions-grid .actions-button,
5320.ios .actions-grid .actions-label {
5321 border-radius: 0 !important;
5322 background: none;
5323}
5324.ios .actions-grid .actions-button-media {
5325 width: 48px;
5326 height: 48px;
5327 margin-left: auto;
5328 margin-right: auto;
5329}
5330.ios .actions-grid .actions-button-media i.icon {
5331 width: 48px;
5332 height: 48px;
5333 font-size: 48px;
5334}
5335.ios .actions-grid .actions-button-media + .actions-button-text {
5336 text-align: center;
5337}
5338.ios .actions-grid .actions-button {
5339 padding: 16px;
5340 line-height: 1;
5341 height: auto;
5342}
5343.ios .actions-grid .actions-button:after {
5344 display: none !important;
5345}
5346.ios .actions-grid .actions-button.active-state {
5347 background: rgba(230, 230, 230, 0.9);
5348}
5349.ios .actions-grid .actions-button-text {
5350 margin-top: 8px;
5351 line-height: 16px;
5352 height: 16px;
5353 font-size: 12px;
5354 color: #757575;
5355}
5356.ios .actions-button:after {
5357 content: '';
5358 position: absolute;
5359 background-color: rgba(0, 0, 0, 0.2);
5360 display: block;
5361 z-index: 15;
5362 top: auto;
5363 right: auto;
5364 bottom: 0;
5365 left: 0;
5366 height: 1px;
5367 width: 100%;
5368 -webkit-transform-origin: 50% 100%;
5369 transform-origin: 50% 100%;
5370}
5371.ios.device-pixel-ratio-2 .actions-button:after {
5372 -webkit-transform: scaleY(0.5);
5373 transform: scaleY(0.5);
5374}
5375.ios.device-pixel-ratio-3 .actions-button:after {
5376 -webkit-transform: scaleY(0.33);
5377 transform: scaleY(0.33);
5378}
5379.ios .actions-label:after {
5380 content: '';
5381 position: absolute;
5382 background-color: rgba(0, 0, 0, 0.2);
5383 display: block;
5384 z-index: 15;
5385 top: auto;
5386 right: auto;
5387 bottom: 0;
5388 left: 0;
5389 height: 1px;
5390 width: 100%;
5391 -webkit-transform-origin: 50% 100%;
5392 transform-origin: 50% 100%;
5393}
5394.ios.device-pixel-ratio-2 .actions-label:after {
5395 -webkit-transform: scaleY(0.5);
5396 transform: scaleY(0.5);
5397}
5398.ios.device-pixel-ratio-3 .actions-label:after {
5399 -webkit-transform: scaleY(0.33);
5400 transform: scaleY(0.33);
5401}
5402.ios .actions-button.color-red,
5403.ios .actions-label.color-red {
5404 color: #ff3b30;
5405}
5406.ios .actions-button.color-green,
5407.ios .actions-label.color-green {
5408 color: #4cd964;
5409}
5410.ios .actions-button.color-blue,
5411.ios .actions-label.color-blue {
5412 color: #007aff;
5413}
5414.ios .actions-button.color-pink,
5415.ios .actions-label.color-pink {
5416 color: #ff2d55;
5417}
5418.ios .actions-button.color-yellow,
5419.ios .actions-label.color-yellow {
5420 color: #ffcc00;
5421}
5422.ios .actions-button.color-orange,
5423.ios .actions-label.color-orange {
5424 color: #ff9500;
5425}
5426.ios .actions-button.color-gray,
5427.ios .actions-label.color-gray {
5428 color: #8e8e93;
5429}
5430.ios .actions-button.color-white,
5431.ios .actions-label.color-white {
5432 color: #ffffff;
5433}
5434.ios .actions-button.color-black,
5435.ios .actions-label.color-black {
5436 color: #000000;
5437}
5438.ios.device-iphone-x .actions-modal.modal-in {
5439 -webkit-transform: translate3d(0, calc(0px - constant(safe-area-inset-bottom)), 0);
5440 transform: translate3d(0, calc(0px - constant(safe-area-inset-bottom)), 0);
5441 -webkit-transform: translate3d(0, calc(0px - env(safe-area-inset-bottom)), 0);
5442 transform: translate3d(0, calc(0px - env(safe-area-inset-bottom)), 0);
5443}
5444/* === Sheet Modal === */
5445.sheet-backdrop {
5446 position: absolute;
5447 left: 0;
5448 top: 0;
5449 width: 100%;
5450 height: 100%;
5451 background: rgba(0, 0, 0, 0.4);
5452 z-index: 13000;
5453 visibility: hidden;
5454 opacity: 0;
5455 -webkit-transition-duration: 400ms;
5456 transition-duration: 400ms;
5457 z-index: 11000;
5458}
5459.sheet-backdrop.not-animated {
5460 -webkit-transition-duration: 0ms;
5461 transition-duration: 0ms;
5462}
5463.sheet-backdrop.backdrop-in {
5464 visibility: visible;
5465 opacity: 1;
5466}
5467.sheet-modal {
5468 position: absolute;
5469 left: 0;
5470 bottom: 0;
5471 width: 100%;
5472 height: 260px;
5473 display: none;
5474 -webkit-box-sizing: border-box;
5475 box-sizing: border-box;
5476 -webkit-transition-property: -webkit-transform;
5477 transition-property: -webkit-transform;
5478 transition-property: transform;
5479 transition-property: transform, -webkit-transform;
5480 -webkit-transform: translate3d(0, 100%, 0);
5481 transform: translate3d(0, 100%, 0);
5482 background: #fff;
5483 z-index: 12500;
5484}
5485.sheet-modal.modal-in,
5486.sheet-modal.modal-out {
5487 -webkit-transition-duration: 300ms;
5488 transition-duration: 300ms;
5489}
5490.sheet-modal.not-animated {
5491 -webkit-transition-duration: 0ms;
5492 transition-duration: 0ms;
5493}
5494.sheet-modal.modal-in {
5495 display: block;
5496 -webkit-transform: translate3d(0, 0, 0);
5497 transform: translate3d(0, 0, 0);
5498}
5499.sheet-modal.modal-out {
5500 -webkit-transform: translate3d(0, 100%, 0);
5501 transform: translate3d(0, 100%, 0);
5502}
5503.sheet-modal .sheet-modal-inner {
5504 height: 100%;
5505 position: relative;
5506 overflow: hidden;
5507}
5508.sheet-modal .toolbar {
5509 position: relative;
5510 width: 100%;
5511}
5512.ios .sheet-modal {
5513 background: #cfd5da;
5514}
5515.ios .sheet-modal .toolbar {
5516 background: #f7f7f8;
5517}
5518.ios .sheet-modal .toolbar + .sheet-modal-inner {
5519 height: calc(100% - 44px);
5520}
5521.ios .sheet-modal .toolbar ~ .sheet-modal-inner .page-content {
5522 padding-bottom: 0;
5523}
5524.ios .sheet-modal .toolbar:before {
5525 content: '';
5526 position: absolute;
5527 background-color: #929499;
5528 display: block;
5529 z-index: 15;
5530 top: 0;
5531 right: auto;
5532 bottom: auto;
5533 left: 0;
5534 height: 1px;
5535 width: 100%;
5536 -webkit-transform-origin: 50% 0%;
5537 transform-origin: 50% 0%;
5538}
5539.ios.device-pixel-ratio-2 .sheet-modal .toolbar:before {
5540 -webkit-transform: scaleY(0.5);
5541 transform: scaleY(0.5);
5542}
5543.ios.device-pixel-ratio-3 .sheet-modal .toolbar:before {
5544 -webkit-transform: scaleY(0.33);
5545 transform: scaleY(0.33);
5546}
5547.ios.device-iphone-x .sheet-modal .toolbar ~ .sheet-modal-inner .page-content,
5548.ios.device-iphone-x .sheet-modal .sheet-modal-inner > .page-content {
5549 padding-bottom: constant(safe-area-inset-bottom);
5550 padding-bottom: env(safe-area-inset-bottom);
5551}
5552.ios .theme-dark .sheet-modal,
5553.sheet-modal.ios .theme-dark {
5554 background-color: #171717;
5555}
5556.ios .theme-dark .sheet-modal .toolbar,
5557.sheet-modal.ios .theme-dark .toolbar {
5558 background-color: #1b1b1b;
5559}
5560.ios .theme-dark .sheet-modal .toolbar:before,
5561.sheet-modal.ios .theme-dark .toolbar:before {
5562 background-color: #282829;
5563}
5564/* === Toast === */
5565.toast {
5566 -webkit-transition-property: opacity, -webkit-transform;
5567 transition-property: opacity, -webkit-transform;
5568 transition-property: transform, opacity;
5569 transition-property: transform, opacity, -webkit-transform;
5570 position: absolute;
5571 max-width: 568px;
5572 z-index: 20000;
5573 color: #fff;
5574 font-size: 14px;
5575 -webkit-box-sizing: border-box;
5576 box-sizing: border-box;
5577}
5578.toast.modal-in {
5579 opacity: 1;
5580}
5581.toast .toast-content {
5582 display: -webkit-box;
5583 display: -webkit-flex;
5584 display: -ms-flexbox;
5585 display: flex;
5586 -webkit-box-pack: justify;
5587 -webkit-justify-content: space-between;
5588 -ms-flex-pack: justify;
5589 justify-content: space-between;
5590 -webkit-box-align: center;
5591 -webkit-align-items: center;
5592 -ms-flex-align: center;
5593 align-items: center;
5594 -webkit-box-sizing: border-box;
5595 box-sizing: border-box;
5596}
5597.toast .toast-text {
5598 line-height: 20px;
5599 -webkit-flex-shrink: 1;
5600 -ms-flex-negative: 1;
5601 flex-shrink: 1;
5602 min-width: 0;
5603}
5604.toast .toast-button {
5605 -webkit-flex-shrink: 0;
5606 -ms-flex-negative: 0;
5607 flex-shrink: 0;
5608}
5609.toast.toast-with-icon .toast-content {
5610 display: block;
5611 text-align: center;
5612}
5613.toast.toast-with-icon .toast-text {
5614 text-align: center;
5615}
5616.toast.toast-with-icon .toast-icon .f7-icons {
5617 font-size: 50px;
5618 width: 50px;
5619 height: 50px;
5620}
5621.toast.toast-with-icon .toast-icon .material-icons {
5622 font-size: 48px;
5623 width: 48px;
5624 height: 48px;
5625}
5626.toast.toast-center {
5627 top: 50%;
5628 opacity: 0;
5629}
5630@media (min-width: 1024px) {
5631 .toast {
5632 opacity: 0;
5633 }
5634}
5635html.with-statusbar.device-ios .toast-top,
5636html.with-statusbar.ios:not(.device-ios):not(.device-android) .toast-top {
5637 margin-top: 20px;
5638}
5639html.with-statusbar.device-iphone-x .toast-top {
5640 margin-top: constant(safe-area-inset-top);
5641 margin-top: env(safe-area-inset-top);
5642}
5643html.with-statusbar.device-android .toast-top,
5644html.with-statusbar.md:not(.device-ios):not(.device-android) .toast-top {
5645 margin-top: 24px;
5646}
5647.ios .toast {
5648 -webkit-transition-duration: 450ms;
5649 transition-duration: 450ms;
5650 background: rgba(0, 0, 0, 0.75);
5651 opacity: 0;
5652 width: 100%;
5653 left: 0;
5654}
5655@supports ((-webkit-backdrop-filter: blur(10px)) or (backdrop-filter: blur(10px))) {
5656 .ios .toast {
5657 background: rgba(0, 0, 0, 0.65);
5658 -webkit-backdrop-filter: blur(10px);
5659 backdrop-filter: blur(10px);
5660 }
5661}
5662.ios .toast.toast-center {
5663 width: auto;
5664 left: 50%;
5665 border-radius: 8px;
5666 -webkit-transform: translate3d(-50%, -50%, 0);
5667 transform: translate3d(-50%, -50%, 0);
5668}
5669.ios .toast.toast-center.modal-in {
5670 -webkit-transform: translate3d(-50%, -50%, 0);
5671 transform: translate3d(-50%, -50%, 0);
5672 opacity: 1;
5673}
5674.ios .toast.toast-top {
5675 top: 0;
5676 -webkit-transform: translate3d(0, -100%, 0);
5677 transform: translate3d(0, -100%, 0);
5678}
5679.ios .toast.toast-top.modal-in {
5680 -webkit-transform: translate3d(0, 0%, 0);
5681 transform: translate3d(0, 0%, 0);
5682 opacity: 1;
5683}
5684.ios .toast.toast-bottom {
5685 bottom: 0;
5686 -webkit-transform: translate3d(0, 100%, 0);
5687 transform: translate3d(0, 100%, 0);
5688}
5689.ios .toast.toast-bottom.modal-in {
5690 -webkit-transform: translate3d(0, 0%, 0);
5691 transform: translate3d(0, 0%, 0);
5692 opacity: 1;
5693}
5694@media (min-width: 569px) {
5695 .ios .toast {
5696 left: 50%;
5697 margin-left: -284px;
5698 }
5699 .ios .toast.toast-center {
5700 margin-left: 0;
5701 }
5702}
5703@media (min-width: 569px) {
5704 .ios .toast {
5705 border-radius: 8px;
5706 }
5707 .ios .toast.toast-bottom {
5708 bottom: 15px;
5709 }
5710 .ios .toast.toast-top {
5711 top: 15px;
5712 }
5713}
5714@media (min-width: 1024px) {
5715 .ios .toast {
5716 margin-left: 0;
5717 width: auto;
5718 }
5719 .ios .toast.toast-bottom,
5720 .ios .toast.toast-top {
5721 left: 15px;
5722 }
5723}
5724.ios .toast-content {
5725 padding: 12px 15px;
5726}
5727.ios .toast-button {
5728 color: #fff;
5729 margin-left: 15px;
5730}
5731@media (max-width: 568px) {
5732 .ios.device-iphone-x .toast-bottom .toast-content {
5733 padding-bottom: calc(12px + constant(safe-area-inset-bottom));
5734 padding-bottom: calc(12px + env(safe-area-inset-bottom));
5735 }
5736}
5737@media (min-width: 569px) {
5738 .ios.device-iphone-x .toast-bottom {
5739 bottom: calc(15px + constant(safe-area-inset-bottom));
5740 bottom: calc(15px + env(safe-area-inset-bottom));
5741 }
5742}
5743/* === Preloader === */
5744.preloader {
5745 display: inline-block;
5746 vertical-align: middle;
5747}
5748/* === Preloader Modal === */
5749.preloader-backdrop {
5750 position: absolute;
5751 left: 0;
5752 top: 0;
5753 width: 100%;
5754 height: 100%;
5755 background: rgba(0, 0, 0, 0.4);
5756 z-index: 13000;
5757 visibility: hidden;
5758 -webkit-transition-duration: 400ms;
5759 transition-duration: 400ms;
5760 visibility: visible;
5761 opacity: 0;
5762 background: none;
5763 z-index: 14000;
5764}
5765.preloader-backdrop.not-animated {
5766 -webkit-transition-duration: 0ms;
5767 transition-duration: 0ms;
5768}
5769.preloader-backdrop.backdrop-in {
5770 visibility: visible;
5771 opacity: 1;
5772}
5773.preloader-modal {
5774 position: absolute;
5775 left: 50%;
5776 top: 50%;
5777 padding: 8px;
5778 background: rgba(0, 0, 0, 0.8);
5779 z-index: 14500;
5780 -webkit-transform: translateX(-50%) translateY(-50%);
5781 transform: translateX(-50%) translateY(-50%);
5782}
5783.preloader-modal .preloader {
5784 display: block !important;
5785}
5786html.with-modal-preloader .page-content {
5787 overflow: hidden;
5788 -webkit-overflow-scrolling: auto;
5789}
5790.ios .preloader {
5791 width: 20px;
5792 height: 20px;
5793 background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20viewBox%3D'0%200%20120%20120'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20xmlns%3Axlink%3D'http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink'%3E%3Cdefs%3E%3Cline%20id%3D'l'%20x1%3D'60'%20x2%3D'60'%20y1%3D'7'%20y2%3D'27'%20stroke%3D'%236c6c6c'%20stroke-width%3D'11'%20stroke-linecap%3D'round'%2F%3E%3C%2Fdefs%3E%3Cg%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(30%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(60%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(90%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(120%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(150%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.37'%20transform%3D'rotate(180%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.46'%20transform%3D'rotate(210%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.56'%20transform%3D'rotate(240%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.66'%20transform%3D'rotate(270%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.75'%20transform%3D'rotate(300%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.85'%20transform%3D'rotate(330%2060%2C60)'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");
5794 background-position: 50%;
5795 background-size: 100%;
5796 background-repeat: no-repeat;
5797 -webkit-animation: ios-preloader-spin 1s steps(12, end) infinite;
5798 animation: ios-preloader-spin 1s steps(12, end) infinite;
5799}
5800.ios .preloader-modal {
5801 border-radius: 5px;
5802}
5803.ios .preloader-modal .preloader {
5804 width: 34px;
5805 height: 34px;
5806}
5807.ios .preloader.color-red,
5808.ios .preloader.preloader-red {
5809 background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20viewBox%3D'0%200%20120%20120'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20xmlns%3Axlink%3D'http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink'%3E%3Cdefs%3E%3Cline%20id%3D'l'%20x1%3D'60'%20x2%3D'60'%20y1%3D'7'%20y2%3D'27'%20stroke%3D'%23ff3b30'%20stroke-width%3D'11'%20stroke-linecap%3D'round'%2F%3E%3C%2Fdefs%3E%3Cg%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(30%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(60%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(90%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(120%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(150%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.37'%20transform%3D'rotate(180%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.46'%20transform%3D'rotate(210%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.56'%20transform%3D'rotate(240%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.66'%20transform%3D'rotate(270%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.75'%20transform%3D'rotate(300%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.85'%20transform%3D'rotate(330%2060%2C60)'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");
5810}
5811.ios .preloader.color-green,
5812.ios .preloader.preloader-green {
5813 background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20viewBox%3D'0%200%20120%20120'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20xmlns%3Axlink%3D'http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink'%3E%3Cdefs%3E%3Cline%20id%3D'l'%20x1%3D'60'%20x2%3D'60'%20y1%3D'7'%20y2%3D'27'%20stroke%3D'%234cd964'%20stroke-width%3D'11'%20stroke-linecap%3D'round'%2F%3E%3C%2Fdefs%3E%3Cg%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(30%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(60%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(90%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(120%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(150%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.37'%20transform%3D'rotate(180%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.46'%20transform%3D'rotate(210%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.56'%20transform%3D'rotate(240%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.66'%20transform%3D'rotate(270%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.75'%20transform%3D'rotate(300%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.85'%20transform%3D'rotate(330%2060%2C60)'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");
5814}
5815.ios .preloader.color-blue,
5816.ios .preloader.preloader-blue {
5817 background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20viewBox%3D'0%200%20120%20120'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20xmlns%3Axlink%3D'http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink'%3E%3Cdefs%3E%3Cline%20id%3D'l'%20x1%3D'60'%20x2%3D'60'%20y1%3D'7'%20y2%3D'27'%20stroke%3D'%23007aff'%20stroke-width%3D'11'%20stroke-linecap%3D'round'%2F%3E%3C%2Fdefs%3E%3Cg%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(30%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(60%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(90%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(120%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(150%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.37'%20transform%3D'rotate(180%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.46'%20transform%3D'rotate(210%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.56'%20transform%3D'rotate(240%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.66'%20transform%3D'rotate(270%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.75'%20transform%3D'rotate(300%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.85'%20transform%3D'rotate(330%2060%2C60)'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");
5818}
5819.ios .preloader.color-pink,
5820.ios .preloader.preloader-pink {
5821 background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20viewBox%3D'0%200%20120%20120'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20xmlns%3Axlink%3D'http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink'%3E%3Cdefs%3E%3Cline%20id%3D'l'%20x1%3D'60'%20x2%3D'60'%20y1%3D'7'%20y2%3D'27'%20stroke%3D'%23ff2d55'%20stroke-width%3D'11'%20stroke-linecap%3D'round'%2F%3E%3C%2Fdefs%3E%3Cg%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(30%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(60%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(90%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(120%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(150%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.37'%20transform%3D'rotate(180%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.46'%20transform%3D'rotate(210%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.56'%20transform%3D'rotate(240%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.66'%20transform%3D'rotate(270%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.75'%20transform%3D'rotate(300%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.85'%20transform%3D'rotate(330%2060%2C60)'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");
5822}
5823.ios .preloader.color-yellow,
5824.ios .preloader.preloader-yellow {
5825 background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20viewBox%3D'0%200%20120%20120'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20xmlns%3Axlink%3D'http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink'%3E%3Cdefs%3E%3Cline%20id%3D'l'%20x1%3D'60'%20x2%3D'60'%20y1%3D'7'%20y2%3D'27'%20stroke%3D'%23ffcc00'%20stroke-width%3D'11'%20stroke-linecap%3D'round'%2F%3E%3C%2Fdefs%3E%3Cg%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(30%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(60%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(90%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(120%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(150%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.37'%20transform%3D'rotate(180%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.46'%20transform%3D'rotate(210%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.56'%20transform%3D'rotate(240%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.66'%20transform%3D'rotate(270%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.75'%20transform%3D'rotate(300%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.85'%20transform%3D'rotate(330%2060%2C60)'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");
5826}
5827.ios .preloader.color-orange,
5828.ios .preloader.preloader-orange {
5829 background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20viewBox%3D'0%200%20120%20120'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20xmlns%3Axlink%3D'http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink'%3E%3Cdefs%3E%3Cline%20id%3D'l'%20x1%3D'60'%20x2%3D'60'%20y1%3D'7'%20y2%3D'27'%20stroke%3D'%23ff9500'%20stroke-width%3D'11'%20stroke-linecap%3D'round'%2F%3E%3C%2Fdefs%3E%3Cg%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(30%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(60%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(90%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(120%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(150%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.37'%20transform%3D'rotate(180%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.46'%20transform%3D'rotate(210%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.56'%20transform%3D'rotate(240%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.66'%20transform%3D'rotate(270%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.75'%20transform%3D'rotate(300%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.85'%20transform%3D'rotate(330%2060%2C60)'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");
5830}
5831.ios .preloader.color-gray,
5832.ios .preloader.preloader-gray {
5833 background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20viewBox%3D'0%200%20120%20120'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20xmlns%3Axlink%3D'http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink'%3E%3Cdefs%3E%3Cline%20id%3D'l'%20x1%3D'60'%20x2%3D'60'%20y1%3D'7'%20y2%3D'27'%20stroke%3D'%238e8e93'%20stroke-width%3D'11'%20stroke-linecap%3D'round'%2F%3E%3C%2Fdefs%3E%3Cg%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(30%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(60%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(90%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(120%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(150%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.37'%20transform%3D'rotate(180%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.46'%20transform%3D'rotate(210%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.56'%20transform%3D'rotate(240%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.66'%20transform%3D'rotate(270%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.75'%20transform%3D'rotate(300%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.85'%20transform%3D'rotate(330%2060%2C60)'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");
5834}
5835.ios .preloader.color-white,
5836.ios .preloader.preloader-white {
5837 background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20viewBox%3D'0%200%20120%20120'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20xmlns%3Axlink%3D'http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink'%3E%3Cdefs%3E%3Cline%20id%3D'l'%20x1%3D'60'%20x2%3D'60'%20y1%3D'7'%20y2%3D'27'%20stroke%3D'%23ffffff'%20stroke-width%3D'11'%20stroke-linecap%3D'round'%2F%3E%3C%2Fdefs%3E%3Cg%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(30%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(60%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(90%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(120%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(150%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.37'%20transform%3D'rotate(180%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.46'%20transform%3D'rotate(210%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.56'%20transform%3D'rotate(240%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.66'%20transform%3D'rotate(270%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.75'%20transform%3D'rotate(300%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.85'%20transform%3D'rotate(330%2060%2C60)'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");
5838}
5839.ios .preloader.color-black,
5840.ios .preloader.preloader-black {
5841 background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20viewBox%3D'0%200%20120%20120'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20xmlns%3Axlink%3D'http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink'%3E%3Cdefs%3E%3Cline%20id%3D'l'%20x1%3D'60'%20x2%3D'60'%20y1%3D'7'%20y2%3D'27'%20stroke%3D'%23000000'%20stroke-width%3D'11'%20stroke-linecap%3D'round'%2F%3E%3C%2Fdefs%3E%3Cg%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(30%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(60%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(90%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(120%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(150%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.37'%20transform%3D'rotate(180%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.46'%20transform%3D'rotate(210%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.56'%20transform%3D'rotate(240%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.66'%20transform%3D'rotate(270%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.75'%20transform%3D'rotate(300%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.85'%20transform%3D'rotate(330%2060%2C60)'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");
5842}
5843@-webkit-keyframes ios-preloader-spin {
5844 100% {
5845 -webkit-transform: rotate(360deg);
5846 transform: rotate(360deg);
5847 }
5848}
5849@keyframes ios-preloader-spin {
5850 100% {
5851 -webkit-transform: rotate(360deg);
5852 transform: rotate(360deg);
5853 }
5854}
5855/* === Progressbar === */
5856.progressbar,
5857.progressbar-infinite {
5858 width: 100%;
5859 overflow: hidden;
5860 position: relative;
5861 display: block;
5862 -webkit-transform-style: preserve-3d;
5863 transform-style: preserve-3d;
5864}
5865body > .progressbar,
5866.view > .progressbar,
5867.views > .progressbar,
5868.page > .progressbar,
5869.panel > .progressbar,
5870.popup > .progressbar,
5871.framework7-root > .progressbar,
5872body > .progressbar-infinite,
5873.view > .progressbar-infinite,
5874.views > .progressbar-infinite,
5875.page > .progressbar-infinite,
5876.panel > .progressbar-infinite,
5877.popup > .progressbar-infinite,
5878.framework7-root > .progressbar-infinite {
5879 position: absolute;
5880 left: 0;
5881 top: 0;
5882 z-index: 15000;
5883 border-radius: 0 !important;
5884 -webkit-transform-origin: center top !important;
5885 transform-origin: center top !important;
5886}
5887.with-statusbar.device-ios body > .progressbar,
5888.with-statusbar.ios:not(.device-ios):not(.device-android) body > .progressbar,
5889.with-statusbar.device-ios .framework7-root > .progressbar,
5890.with-statusbar.ios:not(.device-ios):not(.device-android) .framework7-root > .progressbar,
5891.with-statusbar.device-ios body > .progressbar-infinite,
5892.with-statusbar.ios:not(.device-ios):not(.device-android) body > .progressbar-infinite,
5893.with-statusbar.device-ios .framework7-root > .progressbar-infinite,
5894.with-statusbar.ios:not(.device-ios):not(.device-android) .framework7-root > .progressbar-infinite {
5895 top: 20px;
5896}
5897.with-statusbar.device-android body > .progressbar,
5898.with-statusbar.md:not(.device-ios):not(.device-android) body > .progressbar,
5899.with-statusbar.device-android .framework7-root > .progressbar,
5900.with-statusbar.md:not(.device-ios):not(.device-android) .framework7-root > .progressbar,
5901.with-statusbar.device-android body > .progressbar-infinite,
5902.with-statusbar.md:not(.device-ios):not(.device-android) body > .progressbar-infinite,
5903.with-statusbar.device-android .framework7-root > .progressbar-infinite,
5904.with-statusbar.md:not(.device-ios):not(.device-android) .framework7-root > .progressbar-infinite {
5905 top: 24px;
5906}
5907.with-statusbar.device-iphone-x body > .progressbar,
5908.with-statusbar.device-iphone-x .framework7-root > .progressbar,
5909.with-statusbar.device-iphone-x body > .progressbar-infinite,
5910.with-statusbar.device-iphone-x .framework7-root > .progressbar-infinite {
5911 top: constant(safe-area-inset-top);
5912 top: env(safe-area-inset-top);
5913}
5914.progressbar {
5915 vertical-align: middle;
5916}
5917.progressbar span {
5918 width: 100%;
5919 height: 100%;
5920 position: absolute;
5921 left: 0;
5922 top: 0;
5923 -webkit-transform: translate3d(-100%, 0, 0);
5924 transform: translate3d(-100%, 0, 0);
5925 -webkit-transition-duration: 150ms;
5926 transition-duration: 150ms;
5927}
5928.progressbar-infinite:before,
5929.progressbar-infinite:after {
5930 position: absolute;
5931 left: 0;
5932 top: 0;
5933 width: 100%;
5934 height: 100%;
5935 -webkit-transform-origin: left center;
5936 transform-origin: left center;
5937 -webkit-transform: translate3d(0, 0, 0);
5938 transform: translate3d(0, 0, 0);
5939 display: block;
5940}
5941.progressbar-infinite.color-multi {
5942 background: none !important;
5943}
5944.progressbar-in {
5945 -webkit-animation: progressbar-in 150ms forwards;
5946 animation: progressbar-in 150ms forwards;
5947}
5948.progressbar-out {
5949 -webkit-animation: progressbar-out 150ms forwards;
5950 animation: progressbar-out 150ms forwards;
5951}
5952@-webkit-keyframes progressbar-in {
5953 from {
5954 opacity: 0;
5955 -webkit-transform: scaleY(0);
5956 transform: scaleY(0);
5957 }
5958 to {
5959 opacity: 1;
5960 -webkit-transform: scaleY(1);
5961 transform: scaleY(1);
5962 }
5963}
5964@keyframes progressbar-in {
5965 from {
5966 opacity: 0;
5967 -webkit-transform: scaleY(0);
5968 transform: scaleY(0);
5969 }
5970 to {
5971 opacity: 1;
5972 -webkit-transform: scaleY(1);
5973 transform: scaleY(1);
5974 }
5975}
5976@-webkit-keyframes progressbar-out {
5977 from {
5978 opacity: 1;
5979 -webkit-transform: scaleY(1);
5980 transform: scaleY(1);
5981 }
5982 to {
5983 opacity: 0;
5984 -webkit-transform: scaleY(0);
5985 transform: scaleY(0);
5986 }
5987}
5988@keyframes progressbar-out {
5989 from {
5990 opacity: 1;
5991 -webkit-transform: scaleY(1);
5992 transform: scaleY(1);
5993 }
5994 to {
5995 opacity: 0;
5996 -webkit-transform: scaleY(0);
5997 transform: scaleY(0);
5998 }
5999}
6000.ios .progressbar,
6001.ios .progressbar-infinite {
6002 height: 2px;
6003 background: #b6b6b6;
6004 -webkit-transform-origin: center top;
6005 transform-origin: center top;
6006 border-radius: 2px;
6007}
6008.ios .progressbar span {
6009 background: #007aff;
6010}
6011.ios .progressbar-infinite:before {
6012 content: '';
6013 background: #007aff;
6014 -webkit-animation: ios-progressbar-infinite 1s linear infinite;
6015 animation: ios-progressbar-infinite 1s linear infinite;
6016}
6017.ios .progressbar-infinite.color-multi:before {
6018 width: 400%;
6019 background-image: -webkit-gradient(linear, left top, right top, from(#4cd964), color-stop(#5ac8fa), color-stop(#007aff), color-stop(#34aadc), color-stop(#5856d6), color-stop(#ff2d55), color-stop(#5856d6), color-stop(#34aadc), color-stop(#007aff), color-stop(#5ac8fa), to(#4cd964));
6020 background-image: -webkit-linear-gradient(left, #4cd964, #5ac8fa, #007aff, #34aadc, #5856d6, #ff2d55, #5856d6, #34aadc, #007aff, #5ac8fa, #4cd964);
6021 background-image: linear-gradient(to right, #4cd964, #5ac8fa, #007aff, #34aadc, #5856d6, #ff2d55, #5856d6, #34aadc, #007aff, #5ac8fa, #4cd964);
6022 background-size: 25% 100%;
6023 background-repeat: repeat-x;
6024 -webkit-animation: ios-progressbar-infinite-multicolor 3s linear infinite;
6025 animation: ios-progressbar-infinite-multicolor 3s linear infinite;
6026}
6027.ios .color-theme-red .progressbar span {
6028 background: #ff3b30;
6029}
6030.ios .color-theme-red .progressbar-infinite:before {
6031 background: #ff3b30;
6032}
6033.ios .color-theme-green .progressbar span {
6034 background: #4cd964;
6035}
6036.ios .color-theme-green .progressbar-infinite:before {
6037 background: #4cd964;
6038}
6039.ios .color-theme-blue .progressbar span {
6040 background: #007aff;
6041}
6042.ios .color-theme-blue .progressbar-infinite:before {
6043 background: #007aff;
6044}
6045.ios .color-theme-pink .progressbar span {
6046 background: #ff2d55;
6047}
6048.ios .color-theme-pink .progressbar-infinite:before {
6049 background: #ff2d55;
6050}
6051.ios .color-theme-yellow .progressbar span {
6052 background: #ffcc00;
6053}
6054.ios .color-theme-yellow .progressbar-infinite:before {
6055 background: #ffcc00;
6056}
6057.ios .color-theme-orange .progressbar span {
6058 background: #ff9500;
6059}
6060.ios .color-theme-orange .progressbar-infinite:before {
6061 background: #ff9500;
6062}
6063.ios .color-theme-gray .progressbar span {
6064 background: #8e8e93;
6065}
6066.ios .color-theme-gray .progressbar-infinite:before {
6067 background: #8e8e93;
6068}
6069.ios .color-theme-white .progressbar span {
6070 background: #ffffff;
6071}
6072.ios .color-theme-white .progressbar-infinite:before {
6073 background: #ffffff;
6074}
6075.ios .color-theme-black .progressbar span {
6076 background: #000000;
6077}
6078.ios .color-theme-black .progressbar-infinite:before {
6079 background: #000000;
6080}
6081.ios .progressbar.color-red span {
6082 background: #ff3b30;
6083}
6084.ios .progressbar-infinite.color-red:before {
6085 background: #ff3b30;
6086}
6087.ios .progressbar.color-green span {
6088 background: #4cd964;
6089}
6090.ios .progressbar-infinite.color-green:before {
6091 background: #4cd964;
6092}
6093.ios .progressbar.color-blue span {
6094 background: #007aff;
6095}
6096.ios .progressbar-infinite.color-blue:before {
6097 background: #007aff;
6098}
6099.ios .progressbar.color-pink span {
6100 background: #ff2d55;
6101}
6102.ios .progressbar-infinite.color-pink:before {
6103 background: #ff2d55;
6104}
6105.ios .progressbar.color-yellow span {
6106 background: #ffcc00;
6107}
6108.ios .progressbar-infinite.color-yellow:before {
6109 background: #ffcc00;
6110}
6111.ios .progressbar.color-orange span {
6112 background: #ff9500;
6113}
6114.ios .progressbar-infinite.color-orange:before {
6115 background: #ff9500;
6116}
6117.ios .progressbar.color-gray span {
6118 background: #8e8e93;
6119}
6120.ios .progressbar-infinite.color-gray:before {
6121 background: #8e8e93;
6122}
6123.ios .progressbar.color-white span {
6124 background: #ffffff;
6125}
6126.ios .progressbar-infinite.color-white:before {
6127 background: #ffffff;
6128}
6129.ios .progressbar.color-black span {
6130 background: #000000;
6131}
6132.ios .progressbar-infinite.color-black:before {
6133 background: #000000;
6134}
6135@-webkit-keyframes ios-progressbar-infinite {
6136 0% {
6137 -webkit-transform: translate3d(-100%, 0, 0);
6138 transform: translate3d(-100%, 0, 0);
6139 }
6140 100% {
6141 -webkit-transform: translate3d(100%, 0, 0);
6142 transform: translate3d(100%, 0, 0);
6143 }
6144}
6145@keyframes ios-progressbar-infinite {
6146 0% {
6147 -webkit-transform: translate3d(-100%, 0, 0);
6148 transform: translate3d(-100%, 0, 0);
6149 }
6150 100% {
6151 -webkit-transform: translate3d(100%, 0, 0);
6152 transform: translate3d(100%, 0, 0);
6153 }
6154}
6155@-webkit-keyframes ios-progressbar-infinite-multicolor {
6156 0% {
6157 -webkit-transform: translate3d(0%, 0, 0);
6158 transform: translate3d(0%, 0, 0);
6159 }
6160 100% {
6161 -webkit-transform: translate3d(-50%, 0, 0);
6162 transform: translate3d(-50%, 0, 0);
6163 }
6164}
6165@keyframes ios-progressbar-infinite-multicolor {
6166 0% {
6167 -webkit-transform: translate3d(0%, 0, 0);
6168 transform: translate3d(0%, 0, 0);
6169 }
6170 100% {
6171 -webkit-transform: translate3d(-50%, 0, 0);
6172 transform: translate3d(-50%, 0, 0);
6173 }
6174}
6175/* === Sortable === */
6176.sortable .sortable-handler {
6177 position: absolute;
6178 top: 0;
6179 bottom: 1px;
6180 z-index: 10;
6181 background-repeat: no-repeat;
6182 background-size: 18px 12px;
6183 opacity: 0;
6184 pointer-events: none;
6185 cursor: move;
6186 -webkit-transition-duration: 300ms;
6187 transition-duration: 300ms;
6188 right: 0;
6189 background-position: 100% 50%;
6190}
6191.sortable .item-inner {
6192 -webkit-transition-duration: 300ms;
6193 transition-duration: 300ms;
6194}
6195.sortable li.sorting {
6196 z-index: 50;
6197 background: rgba(255, 255, 255, 0.8);
6198 -webkit-transition-duration: 0ms;
6199 transition-duration: 0ms;
6200}
6201.sortable li.sorting .item-inner:after {
6202 display: none !important;
6203}
6204.sortable-sorting li {
6205 -webkit-transition-duration: 300ms;
6206 transition-duration: 300ms;
6207}
6208.sortable-enabled .sortable-handler {
6209 pointer-events: auto;
6210 opacity: 1;
6211 background-position: 50% 50%;
6212}
6213.sortable-enabled .item-link .item-inner,
6214.sortable-enabled .item-link .item-title-row {
6215 background-image: none !important;
6216}
6217.theme-dark .sortable li.sorting,
6218.sortable.theme-dark li.sorting {
6219 background-color: rgba(50, 50, 50, 0.8);
6220}
6221.ios .sortable-handler {
6222 width: 35px;
6223 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%2012'%20fill%3D'%23c7c7cc'%3E%3Cpath%20d%3D'M0%2C2V0h22v2H0z'%2F%3E%3Cpath%20d%3D'M0%2C7V5h22v2H0z'%2F%3E%3Cpath%20d%3D'M0%2C12v-2h22v2H0z'%2F%3E%3C%2Fsvg%3E");
6224}
6225.ios .sortable li.sorting {
6226 -webkit-box-shadow: 0px 2px 8px rgba(0, 0, 0, 0.6);
6227 box-shadow: 0px 2px 8px rgba(0, 0, 0, 0.6);
6228}
6229.ios .sortable-enabled .item-inner,
6230.ios .sortable-enabled .item-link .item-inner {
6231 padding-right: 35px;
6232}
6233.ios .list.sortable-enabled .item-link.no-chevron .item-inner,
6234.ios .list.sortable-enabled.no-chevron .item-link .item-inner,
6235.ios .list.sortable-enabled .no-chevron .item-link .item-inner,
6236.ios .no-chevron .list.sortable-enabled .item-link .item-inner {
6237 padding-right: 35px;
6238}
6239@media (orientation: landscape) {
6240 .ios.device-iphone-x .ios-right-edge .sortable-handler,
6241 .ios.device-iphone-x .ios-edges .sortable-handler,
6242 .ios.device-iphone-x .popup .sortable-handler,
6243 .ios.device-iphone-x .sheet-modal .sortable-handler,
6244 .ios.device-iphone-x .panel-right .sortable-handler {
6245 right: constant(safe-area-inset-right);
6246 right: env(safe-area-inset-right);
6247 }
6248 .ios.device-iphone-x .ios-right-edge .sortable-enabled:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) .item-inner,
6249 .ios.device-iphone-x .ios-edges .sortable-enabled:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) .item-inner,
6250 .ios.device-iphone-x .popup .sortable-enabled:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) .item-inner,
6251 .ios.device-iphone-x .sheet-modal .sortable-enabled:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) .item-inner,
6252 .ios.device-iphone-x .panel-right .sortable-enabled:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) .item-inner,
6253 .ios.device-iphone-x .ios-right-edge .sortable-enabled:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) .item-link .item-inner,
6254 .ios.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,
6255 .ios.device-iphone-x .popup .sortable-enabled:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) .item-link .item-inner,
6256 .ios.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,
6257 .ios.device-iphone-x .panel-right .sortable-enabled:not(.inset):not(.tablet-inset):not(.no-ios-edges):not(.no-ios-right-edge) .item-link .item-inner {
6258 padding-right: calc(35px + constant(safe-area-inset-right));
6259 padding-right: calc(35px + env(safe-area-inset-right));
6260 }
6261}
6262/* === Swipeout === */
6263.swipeout {
6264 overflow: hidden;
6265 -webkit-transform-style: preserve-3d;
6266 transform-style: preserve-3d;
6267}
6268.swipeout-deleting {
6269 -webkit-transition-duration: 300ms;
6270 transition-duration: 300ms;
6271}
6272.swipeout-deleting .swipeout-content {
6273 -webkit-transform: translateX(-100%);
6274 transform: translateX(-100%);
6275}
6276.swipeout-transitioning .swipeout-content,
6277.swipeout-transitioning .swipeout-actions-right a,
6278.swipeout-transitioning .swipeout-actions-left a,
6279.swipeout-transitioning .swipeout-overswipe {
6280 -webkit-transition-duration: 300ms;
6281 transition-duration: 300ms;
6282 -webkit-transition-property: left, -webkit-transform;
6283 transition-property: left, -webkit-transform;
6284 transition-property: transform, left;
6285 transition-property: transform, left, -webkit-transform;
6286}
6287.swipeout-content {
6288 position: relative;
6289 z-index: 10;
6290}
6291.swipeout-overswipe {
6292 -webkit-transition-duration: 200ms;
6293 transition-duration: 200ms;
6294 -webkit-transition-property: left;
6295 transition-property: left;
6296}
6297.swipeout-actions-left,
6298.swipeout-actions-right {
6299 position: absolute;
6300 top: 0;
6301 height: 100%;
6302 display: -webkit-box;
6303 display: -webkit-flex;
6304 display: -ms-flexbox;
6305 display: flex;
6306 direction: ltr;
6307}
6308.swipeout-actions-left > a,
6309.swipeout-actions-right > a,
6310.swipeout-actions-left > button,
6311.swipeout-actions-right > button,
6312.swipeout-actions-left > span,
6313.swipeout-actions-right > span,
6314.swipeout-actions-left > div,
6315.swipeout-actions-right > div {
6316 color: #fff;
6317 background: #c7c7cc;
6318 display: -webkit-box;
6319 display: -webkit-flex;
6320 display: -ms-flexbox;
6321 display: flex;
6322 -webkit-box-align: center;
6323 -webkit-align-items: center;
6324 -ms-flex-align: center;
6325 align-items: center;
6326 position: relative;
6327 left: 0;
6328}
6329.swipeout-actions-left > a:after,
6330.swipeout-actions-right > a:after,
6331.swipeout-actions-left > button:after,
6332.swipeout-actions-right > button:after,
6333.swipeout-actions-left > span:after,
6334.swipeout-actions-right > span:after,
6335.swipeout-actions-left > div:after,
6336.swipeout-actions-right > div:after {
6337 content: '';
6338 position: absolute;
6339 top: 0;
6340 width: 600%;
6341 height: 100%;
6342 background: inherit;
6343 z-index: -1;
6344 -webkit-transform: translate3d(0, 0, 0);
6345 transform: translate3d(0, 0, 0);
6346 pointer-events: none;
6347}
6348.swipeout-actions-right {
6349 right: 0%;
6350 -webkit-transform: translateX(100%);
6351 transform: translateX(100%);
6352}
6353.swipeout-actions-right > a:after,
6354.swipeout-actions-right > button:after,
6355.swipeout-actions-right > span:after,
6356.swipeout-actions-right > div:after {
6357 left: 100%;
6358 margin-left: -1px;
6359}
6360.swipeout-actions-left {
6361 left: 0%;
6362 -webkit-transform: translateX(-100%);
6363 transform: translateX(-100%);
6364}
6365.swipeout-actions-left > a:after,
6366.swipeout-actions-left > button:after,
6367.swipeout-actions-left > span:after,
6368.swipeout-actions-left > div:after {
6369 right: 100%;
6370 margin-right: -1px;
6371}
6372.ios .swipeout-actions-left > a,
6373.ios .swipeout-actions-right > a,
6374.ios .swipeout-actions-left > button,
6375.ios .swipeout-actions-right > button,
6376.ios .swipeout-actions-left > span,
6377.ios .swipeout-actions-right > span,
6378.ios .swipeout-actions-left > div,
6379.ios .swipeout-actions-right > div {
6380 padding: 0 30px;
6381 color: #fff;
6382}
6383.ios .swipeout-actions-left .swipeout-delete,
6384.ios .swipeout-actions-right .swipeout-delete {
6385 background: #ff3b30;
6386}
6387.ios .swipeout-actions-left > a.color-red,
6388.ios .swipeout-actions-right > a.color-red,
6389.ios .swipeout-actions-left > button.color-red,
6390.ios .swipeout-actions-right > button.color-red,
6391.ios .swipeout-actions-left > span.color-red,
6392.ios .swipeout-actions-right > span.color-red,
6393.ios .swipeout-actions-left > div.color-red,
6394.ios .swipeout-actions-right > div.color-red {
6395 background-color: #ff3b30;
6396}
6397.ios .swipeout-actions-left > a.color-green,
6398.ios .swipeout-actions-right > a.color-green,
6399.ios .swipeout-actions-left > button.color-green,
6400.ios .swipeout-actions-right > button.color-green,
6401.ios .swipeout-actions-left > span.color-green,
6402.ios .swipeout-actions-right > span.color-green,
6403.ios .swipeout-actions-left > div.color-green,
6404.ios .swipeout-actions-right > div.color-green {
6405 background-color: #4cd964;
6406}
6407.ios .swipeout-actions-left > a.color-blue,
6408.ios .swipeout-actions-right > a.color-blue,
6409.ios .swipeout-actions-left > button.color-blue,
6410.ios .swipeout-actions-right > button.color-blue,
6411.ios .swipeout-actions-left > span.color-blue,
6412.ios .swipeout-actions-right > span.color-blue,
6413.ios .swipeout-actions-left > div.color-blue,
6414.ios .swipeout-actions-right > div.color-blue {
6415 background-color: #007aff;
6416}
6417.ios .swipeout-actions-left > a.color-pink,
6418.ios .swipeout-actions-right > a.color-pink,
6419.ios .swipeout-actions-left > button.color-pink,
6420.ios .swipeout-actions-right > button.color-pink,
6421.ios .swipeout-actions-left > span.color-pink,
6422.ios .swipeout-actions-right > span.color-pink,
6423.ios .swipeout-actions-left > div.color-pink,
6424.ios .swipeout-actions-right > div.color-pink {
6425 background-color: #ff2d55;
6426}
6427.ios .swipeout-actions-left > a.color-yellow,
6428.ios .swipeout-actions-right > a.color-yellow,
6429.ios .swipeout-actions-left > button.color-yellow,
6430.ios .swipeout-actions-right > button.color-yellow,
6431.ios .swipeout-actions-left > span.color-yellow,
6432.ios .swipeout-actions-right > span.color-yellow,
6433.ios .swipeout-actions-left > div.color-yellow,
6434.ios .swipeout-actions-right > div.color-yellow {
6435 background-color: #ffcc00;
6436}
6437.ios .swipeout-actions-left > a.color-orange,
6438.ios .swipeout-actions-right > a.color-orange,
6439.ios .swipeout-actions-left > button.color-orange,
6440.ios .swipeout-actions-right > button.color-orange,
6441.ios .swipeout-actions-left > span.color-orange,
6442.ios .swipeout-actions-right > span.color-orange,
6443.ios .swipeout-actions-left > div.color-orange,
6444.ios .swipeout-actions-right > div.color-orange {
6445 background-color: #ff9500;
6446}
6447.ios .swipeout-actions-left > a.color-gray,
6448.ios .swipeout-actions-right > a.color-gray,
6449.ios .swipeout-actions-left > button.color-gray,
6450.ios .swipeout-actions-right > button.color-gray,
6451.ios .swipeout-actions-left > span.color-gray,
6452.ios .swipeout-actions-right > span.color-gray,
6453.ios .swipeout-actions-left > div.color-gray,
6454.ios .swipeout-actions-right > div.color-gray {
6455 background-color: #8e8e93;
6456}
6457.ios .swipeout-actions-left > a.color-white,
6458.ios .swipeout-actions-right > a.color-white,
6459.ios .swipeout-actions-left > button.color-white,
6460.ios .swipeout-actions-right > button.color-white,
6461.ios .swipeout-actions-left > span.color-white,
6462.ios .swipeout-actions-right > span.color-white,
6463.ios .swipeout-actions-left > div.color-white,
6464.ios .swipeout-actions-right > div.color-white {
6465 background-color: #ffffff;
6466}
6467.ios .swipeout-actions-left > a.color-black,
6468.ios .swipeout-actions-right > a.color-black,
6469.ios .swipeout-actions-left > button.color-black,
6470.ios .swipeout-actions-right > button.color-black,
6471.ios .swipeout-actions-left > span.color-black,
6472.ios .swipeout-actions-right > span.color-black,
6473.ios .swipeout-actions-left > div.color-black,
6474.ios .swipeout-actions-right > div.color-black {
6475 background-color: #000000;
6476}
6477/* === Accordion === */
6478.accordion-item-toggle {
6479 cursor: pointer;
6480 -webkit-transition-duration: 300ms;
6481 transition-duration: 300ms;
6482}
6483.accordion-item-toggle.active-state {
6484 -webkit-transition-duration: 300ms;
6485 transition-duration: 300ms;
6486}
6487.accordion-item-toggle.active-state > .item-inner:after {
6488 background-color: transparent;
6489}
6490.accordion-item-toggle .item-inner {
6491 -webkit-transition-duration: 300ms;
6492 transition-duration: 300ms;
6493 -webkit-transition-property: background-color;
6494 transition-property: background-color;
6495}
6496.accordion-item-toggle .item-inner:after {
6497 -webkit-transition-duration: 300ms;
6498 transition-duration: 300ms;
6499}
6500.accordion-item .item-link .item-inner:after {
6501 -webkit-transition-duration: 300ms;
6502 transition-duration: 300ms;
6503}
6504.accordion-item .list,
6505.accordion-item .block {
6506 margin-top: 0;
6507 margin-bottom: 0;
6508}
6509.accordion-item .block > h1:first-child,
6510.accordion-item .block > h2:first-child,
6511.accordion-item .block > h3:first-child,
6512.accordion-item .block > h4:first-child,
6513.accordion-item .block > p:first-child {
6514 margin-top: 10px;
6515}
6516.accordion-item .block > h1:last-child,
6517.accordion-item .block > h2:last-child,
6518.accordion-item .block > h3:last-child,
6519.accordion-item .block > h4:last-child,
6520.accordion-item .block > p:last-child {
6521 margin-bottom: 10px;
6522}
6523.accordion-item-opened .accordion-item-toggle .item-inner:after,
6524.accordion-item-opened > .item-link .item-inner:after {
6525 background-color: transparent;
6526}
6527.list li.accordion-item ul {
6528 padding-left: 0;
6529}
6530.accordion-item-content {
6531 position: relative;
6532 overflow: hidden;
6533 height: 0;
6534 font-size: 14px;
6535 -webkit-transition-duration: 300ms;
6536 transition-duration: 300ms;
6537}
6538.accordion-item-opened > .accordion-item-content {
6539 height: auto;
6540}
6541html.device-android-4 .accordion-item-content {
6542 -webkit-transform: none;
6543 transform: none;
6544}
6545.ios .list .accordion-item-toggle .item-inner {
6546 background-size: 8px 13px;
6547 background: no-repeat calc(100% - 15px) center;
6548 background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D'8px'%20height%3D'13px'%20viewBox%3D'0%200%208%2013'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%3Cpolygon%20fill%3D'%23c7c7cc'%20transform%3D'translate(1.500000%2C%206.500000)%20rotate(-45.000000)%20translate(-1.500000%2C%20-6.500000)%20'%20points%3D'6%2011%206%202%204%202%204%209%20-3%209%20-3%2011%205%2011'%3E%3C%2Fpolygon%3E%3C%2Fsvg%3E");
6549 padding-right: 35px;
6550}
6551.ios .list .accordion-item-toggle.active-state {
6552 background-color: #d9d9d9;
6553}
6554.ios .list:not(.media-list) .accordion-item-opened:not(.media-item) .accordion-item-toggle .item-inner,
6555.ios .list:not(.media-list) .accordion-item-opened:not(.media-item) > .item-link .item-inner,
6556.ios .media-list .accordion-item-opened .accordion-item-toggle .item-title-row,
6557.ios .media-list .accordion-item-opened > .item-link .item-title-row,
6558.ios .accordion-item-opened.media-item .accordion-item-toggle .item-title-row,
6559.ios .accordion-item-opened.media-item > .item-link .item-title-row,
6560.ios .links-list .accordion-item-opened > a {
6561 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");
6562 background-size: 13px 13px;
6563}
6564.ios .theme-dark .list .accordion-item-toggle .item-inner {
6565 background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D'8px'%20height%3D'13px'%20viewBox%3D'0%200%208%2013'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%3Cpolygon%20fill%3D'%23434345'%20transform%3D'translate(1.500000%2C%206.500000)%20rotate(-45.000000)%20translate(-1.500000%2C%20-6.500000)%20'%20points%3D'6%2011%206%202%204%202%204%209%20-3%209%20-3%2011%205%2011'%3E%3C%2Fpolygon%3E%3C%2Fsvg%3E");
6566}
6567.ios .theme-dark .list .accordion-item-toggle.active-state {
6568 background-color: #363636;
6569}
6570.ios .theme-dark .list:not(.media-list) .accordion-item-opened:not(.media-item) .accordion-item-toggle .item-inner,
6571.ios .theme-dark .list:not(.media-list) .accordion-item-opened:not(.media-item) > .item-link .item-inner,
6572.ios .theme-dark .media-list .accordion-item-opened .accordion-item-toggle .item-title-row,
6573.ios .theme-dark .media-list .accordion-item-opened > .item-link .item-title-row,
6574.ios .theme-dark .accordion-item-opened.media-item .accordion-item-toggle .item-title-row,
6575.ios .theme-dark .accordion-item-opened.media-item > .item-link .item-title-row,
6576.ios .theme-dark .links-list .accordion-item-opened > a {
6577 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");
6578}
6579/* === Contacts === */
6580.contacts-list .list-group:first-child ul:before {
6581 display: none !important;
6582}
6583.contacts-list .list-group:last-child ul:after {
6584 display: none !important;
6585}
6586.ios .contacts-list {
6587 margin: 0;
6588}
6589.ios .contacts-list .list-group-title {
6590 padding: 0 15px;
6591 background: #f7f7f7;
6592 color: #000;
6593 font-weight: 600;
6594 line-height: 22px;
6595 height: 22px;
6596}
6597.ios .theme-dark .contacts-list .list-group-title,
6598.contacts-list.ios .theme-dark .list-group-title {
6599 background-color: #111;
6600 color: #fff;
6601}
6602/* === Virtual List === */
6603/* === Indexed List === */
6604.list-index {
6605 position: absolute;
6606 top: 0;
6607 bottom: 0;
6608 right: 0;
6609 text-align: center;
6610 z-index: 10;
6611 width: 16px;
6612 cursor: pointer;
6613 -webkit-user-select: none;
6614 -moz-user-select: none;
6615 -ms-user-select: none;
6616 user-select: none;
6617}
6618.list-index:before {
6619 content: '';
6620 position: absolute;
6621 width: 20px;
6622 top: 0;
6623 right: 100%;
6624 height: 100%;
6625}
6626.list-index ul {
6627 font-size: 11px;
6628 font-weight: 600;
6629 list-style: none;
6630 margin: 0;
6631 padding: 0;
6632 display: -webkit-box;
6633 display: -webkit-flex;
6634 display: -ms-flexbox;
6635 display: flex;
6636 -webkit-box-orient: vertical;
6637 -webkit-box-direction: normal;
6638 -webkit-flex-direction: column;
6639 -ms-flex-direction: column;
6640 flex-direction: column;
6641 -webkit-box-pack: center;
6642 -webkit-justify-content: center;
6643 -ms-flex-pack: center;
6644 justify-content: center;
6645 -webkit-box-align: center;
6646 -webkit-align-items: center;
6647 -ms-flex-align: center;
6648 align-items: center;
6649 -webkit-flex-shrink: 0;
6650 -ms-flex-negative: 0;
6651 flex-shrink: 0;
6652 height: 100%;
6653 width: 100%;
6654 position: relative;
6655}
6656.list-index li {
6657 margin: 0;
6658 padding: 0;
6659 list-style: none;
6660 position: relative;
6661 height: 14px;
6662 line-height: 14px;
6663 -webkit-flex-shrink: 0;
6664 -ms-flex-negative: 0;
6665 flex-shrink: 0;
6666 display: block;
6667 width: 100%;
6668}
6669.list-index .list-index-skip-placeholder:after {
6670 content: '';
6671 position: absolute;
6672 left: 50%;
6673 top: 50%;
6674 border-radius: 50%;
6675}
6676.list-index .list-index-label {
6677 position: absolute;
6678 bottom: 0;
6679 right: 100%;
6680 text-align: center;
6681 border-radius: 50%;
6682 color: #fff;
6683 font-weight: 500;
6684}
6685.ios .list-index ul {
6686 color: #007aff;
6687}
6688.ios .list-index .list-index-skip-placeholder:after {
6689 content: '';
6690 width: 6px;
6691 height: 6px;
6692 margin-left: -3px;
6693 margin-top: -3px;
6694 background: #007aff;
6695}
6696.ios .list-index .list-index-label {
6697 margin-bottom: -22px;
6698 margin-right: 15px;
6699 width: 44px;
6700 height: 44px;
6701 line-height: 44px;
6702 border-radius: 50%;
6703 background: #007aff;
6704 font-size: 17px;
6705}
6706.ios .list-index .list-index-label:before {
6707 position: absolute;
6708 width: 100%;
6709 height: 100%;
6710 border-radius: 50% 0% 50% 50%;
6711 content: '';
6712 background-color: inherit;
6713 left: 0;
6714 top: 0;
6715 -webkit-transform: rotate(45deg);
6716 transform: rotate(45deg);
6717 z-index: -1;
6718}
6719.ios .navbar ~ .page > .list-index,
6720.ios .navbar ~ .list-index {
6721 top: 44px;
6722}
6723.ios .toolbar ~ .page > .list-index,
6724.ios .toolbar ~ * .page > .list-index,
6725.ios .toolbar ~ .list-index {
6726 bottom: 44px;
6727}
6728.ios .tabbar-labels ~ .page > .list-index,
6729.ios .tabbar-labels ~ * .page > .list-index,
6730.ios .tabbar-labels ~ .list-index {
6731 bottom: 50px;
6732}
6733@media (min-width: 768px) {
6734 .ios .tabbar-labels ~ .page > .list-index,
6735 .ios .tabbar-labels ~ * .page > .list-index,
6736 .ios .tabbar-labels ~ .list-index {
6737 bottom: 56px;
6738 }
6739}
6740.ios.device-iphone-x .toolbar ~ .page > .list-index,
6741.ios.device-iphone-x .toolbar ~ * .page > .list-index,
6742.ios.device-iphone-x .toolbar ~ .list-index {
6743 bottom: calc(44px + constant(safe-area-inset-bottom));
6744 bottom: calc(44px + env(safe-area-inset-bottom));
6745}
6746.ios.device-iphone-x .tabbar-labels ~ .page > .list-index,
6747.ios.device-iphone-x .tabbar-labels ~ * .page > .list-index,
6748.ios.device-iphone-x .tabbar-labels ~ .list-index {
6749 bottom: calc(50px + constant(safe-area-inset-bottom));
6750 bottom: calc(50px + env(safe-area-inset-bottom));
6751}
6752@media (min-width: 768px) {
6753 .ios.device-iphone-x .tabbar-labels ~ .page > .list-index,
6754 .ios.device-iphone-x .tabbar-labels ~ * .page > .list-index,
6755 .ios.device-iphone-x .tabbar-labels ~ .list-index {
6756 bottom: calc(56px + constant(safe-area-inset-bottom));
6757 bottom: calc(56px + env(safe-area-inset-bottom));
6758 }
6759}
6760.ios .color-theme-red .list-index ul,
6761.ios .list-index.color-theme-red ul {
6762 color: #ff3b30;
6763}
6764.ios .color-theme-red .list-index .list-index-skip-placeholder:after,
6765.ios .list-index.color-theme-red .list-index-skip-placeholder:after,
6766.ios .color-theme-red .list-index .list-index-label,
6767.ios .list-index.color-theme-red .list-index-label {
6768 background-color: #ff3b30;
6769}
6770.ios .color-theme-green .list-index ul,
6771.ios .list-index.color-theme-green ul {
6772 color: #4cd964;
6773}
6774.ios .color-theme-green .list-index .list-index-skip-placeholder:after,
6775.ios .list-index.color-theme-green .list-index-skip-placeholder:after,
6776.ios .color-theme-green .list-index .list-index-label,
6777.ios .list-index.color-theme-green .list-index-label {
6778 background-color: #4cd964;
6779}
6780.ios .color-theme-blue .list-index ul,
6781.ios .list-index.color-theme-blue ul {
6782 color: #007aff;
6783}
6784.ios .color-theme-blue .list-index .list-index-skip-placeholder:after,
6785.ios .list-index.color-theme-blue .list-index-skip-placeholder:after,
6786.ios .color-theme-blue .list-index .list-index-label,
6787.ios .list-index.color-theme-blue .list-index-label {
6788 background-color: #007aff;
6789}
6790.ios .color-theme-pink .list-index ul,
6791.ios .list-index.color-theme-pink ul {
6792 color: #ff2d55;
6793}
6794.ios .color-theme-pink .list-index .list-index-skip-placeholder:after,
6795.ios .list-index.color-theme-pink .list-index-skip-placeholder:after,
6796.ios .color-theme-pink .list-index .list-index-label,
6797.ios .list-index.color-theme-pink .list-index-label {
6798 background-color: #ff2d55;
6799}
6800.ios .color-theme-yellow .list-index ul,
6801.ios .list-index.color-theme-yellow ul {
6802 color: #ffcc00;
6803}
6804.ios .color-theme-yellow .list-index .list-index-skip-placeholder:after,
6805.ios .list-index.color-theme-yellow .list-index-skip-placeholder:after,
6806.ios .color-theme-yellow .list-index .list-index-label,
6807.ios .list-index.color-theme-yellow .list-index-label {
6808 background-color: #ffcc00;
6809}
6810.ios .color-theme-orange .list-index ul,
6811.ios .list-index.color-theme-orange ul {
6812 color: #ff9500;
6813}
6814.ios .color-theme-orange .list-index .list-index-skip-placeholder:after,
6815.ios .list-index.color-theme-orange .list-index-skip-placeholder:after,
6816.ios .color-theme-orange .list-index .list-index-label,
6817.ios .list-index.color-theme-orange .list-index-label {
6818 background-color: #ff9500;
6819}
6820.ios .color-theme-gray .list-index ul,
6821.ios .list-index.color-theme-gray ul {
6822 color: #8e8e93;
6823}
6824.ios .color-theme-gray .list-index .list-index-skip-placeholder:after,
6825.ios .list-index.color-theme-gray .list-index-skip-placeholder:after,
6826.ios .color-theme-gray .list-index .list-index-label,
6827.ios .list-index.color-theme-gray .list-index-label {
6828 background-color: #8e8e93;
6829}
6830.ios .color-theme-white .list-index ul,
6831.ios .list-index.color-theme-white ul {
6832 color: #ffffff;
6833}
6834.ios .color-theme-white .list-index .list-index-skip-placeholder:after,
6835.ios .list-index.color-theme-white .list-index-skip-placeholder:after,
6836.ios .color-theme-white .list-index .list-index-label,
6837.ios .list-index.color-theme-white .list-index-label {
6838 background-color: #ffffff;
6839}
6840.ios .color-theme-black .list-index ul,
6841.ios .list-index.color-theme-black ul {
6842 color: #000000;
6843}
6844.ios .color-theme-black .list-index .list-index-skip-placeholder:after,
6845.ios .list-index.color-theme-black .list-index-skip-placeholder:after,
6846.ios .color-theme-black .list-index .list-index-label,
6847.ios .list-index.color-theme-black .list-index-label {
6848 background-color: #000000;
6849}
6850.ios .list-index.color-red ul {
6851 color: #ff3b30;
6852}
6853.ios .list-index.color-red .list-index-skip-placeholder:after,
6854.ios .list-index.color-red .list-index-label {
6855 background-color: #ff3b30;
6856}
6857.ios .list-index.color-green ul {
6858 color: #4cd964;
6859}
6860.ios .list-index.color-green .list-index-skip-placeholder:after,
6861.ios .list-index.color-green .list-index-label {
6862 background-color: #4cd964;
6863}
6864.ios .list-index.color-blue ul {
6865 color: #007aff;
6866}
6867.ios .list-index.color-blue .list-index-skip-placeholder:after,
6868.ios .list-index.color-blue .list-index-label {
6869 background-color: #007aff;
6870}
6871.ios .list-index.color-pink ul {
6872 color: #ff2d55;
6873}
6874.ios .list-index.color-pink .list-index-skip-placeholder:after,
6875.ios .list-index.color-pink .list-index-label {
6876 background-color: #ff2d55;
6877}
6878.ios .list-index.color-yellow ul {
6879 color: #ffcc00;
6880}
6881.ios .list-index.color-yellow .list-index-skip-placeholder:after,
6882.ios .list-index.color-yellow .list-index-label {
6883 background-color: #ffcc00;
6884}
6885.ios .list-index.color-orange ul {
6886 color: #ff9500;
6887}
6888.ios .list-index.color-orange .list-index-skip-placeholder:after,
6889.ios .list-index.color-orange .list-index-label {
6890 background-color: #ff9500;
6891}
6892.ios .list-index.color-gray ul {
6893 color: #8e8e93;
6894}
6895.ios .list-index.color-gray .list-index-skip-placeholder:after,
6896.ios .list-index.color-gray .list-index-label {
6897 background-color: #8e8e93;
6898}
6899.ios .list-index.color-white ul {
6900 color: #ffffff;
6901}
6902.ios .list-index.color-white .list-index-skip-placeholder:after,
6903.ios .list-index.color-white .list-index-label {
6904 background-color: #ffffff;
6905}
6906.ios .list-index.color-black ul {
6907 color: #000000;
6908}
6909.ios .list-index.color-black .list-index-skip-placeholder:after,
6910.ios .list-index.color-black .list-index-label {
6911 background-color: #000000;
6912}
6913/* === Timeline === */
6914.timeline {
6915 -webkit-box-sizing: border-box;
6916 box-sizing: border-box;
6917}
6918.block-strong .timeline {
6919 padding: 0;
6920 margin: 0;
6921}
6922.timeline-item {
6923 display: -webkit-box;
6924 display: -webkit-flex;
6925 display: -ms-flexbox;
6926 display: flex;
6927 -webkit-box-pack: start;
6928 -webkit-justify-content: flex-start;
6929 -ms-flex-pack: start;
6930 justify-content: flex-start;
6931 overflow: hidden;
6932 -webkit-box-sizing: border-box;
6933 box-sizing: border-box;
6934 position: relative;
6935}
6936.timeline-item-date {
6937 -webkit-flex-shrink: 0;
6938 -ms-flex-negative: 0;
6939 flex-shrink: 0;
6940 width: 50px;
6941 text-align: right;
6942 -webkit-box-sizing: border-box;
6943 box-sizing: border-box;
6944}
6945.timeline-item-date small {
6946 font-size: 10px;
6947}
6948.timeline-item-content {
6949 margin: 2px;
6950 min-width: 0;
6951 position: relative;
6952 -webkit-flex-shrink: 10;
6953 -ms-flex-negative: 10;
6954 flex-shrink: 10;
6955}
6956.timeline-item-content p:first-child,
6957.timeline-item-content ul:first-child,
6958.timeline-item-content ol:first-child,
6959.timeline-item-content h1:first-child,
6960.timeline-item-content h2:first-child,
6961.timeline-item-content h3:first-child,
6962.timeline-item-content h4:first-child {
6963 margin-top: 0;
6964}
6965.timeline-item-content p:last-child,
6966.timeline-item-content ul:last-child,
6967.timeline-item-content ol:last-child,
6968.timeline-item-content h1:last-child,
6969.timeline-item-content h2:last-child,
6970.timeline-item-content h3:last-child,
6971.timeline-item-content h4:last-child {
6972 margin-bottom: 0;
6973}
6974.timeline-item-inner {
6975 background: #fff;
6976 -webkit-box-sizing: border-box;
6977 box-sizing: border-box;
6978}
6979.timeline-item-inner .block {
6980 padding: 0;
6981 color: inherit;
6982}
6983.timeline-item-inner .block-strong {
6984 padding-left: 0;
6985 padding-right: 0;
6986 margin: 0;
6987}
6988.timeline-item-inner .block-strong:before {
6989 display: none !important;
6990}
6991.timeline-item-inner .block-strong:after {
6992 display: none !important;
6993}
6994.timeline-item-inner .list ul:before {
6995 display: none !important;
6996}
6997.timeline-item-inner .list ul:after {
6998 display: none !important;
6999}
7000.timeline-item-divider {
7001 width: 1px;
7002 position: relative;
7003 width: 10px;
7004 height: 10px;
7005 background: #bbb;
7006 border-radius: 50%;
7007 margin-top: 3px;
7008 -webkit-flex-shrink: 0;
7009 -ms-flex-negative: 0;
7010 flex-shrink: 0;
7011}
7012.timeline-item-divider:after,
7013.timeline-item-divider:before {
7014 content: ' ';
7015 width: 1px;
7016 height: 100vh;
7017 position: absolute;
7018 left: 50%;
7019 background: inherit;
7020 -webkit-transform: translate3d(-50%, 0, 0);
7021 transform: translate3d(-50%, 0, 0);
7022}
7023.timeline-item-divider:after {
7024 top: 100%;
7025}
7026.timeline-item-divider:before {
7027 bottom: 100%;
7028}
7029.timeline-item:last-child .timeline-item-divider:after {
7030 display: none;
7031}
7032.timeline-item:first-child .timeline-item-divider:before {
7033 display: none;
7034}
7035.timeline-item-time {
7036 font-size: 13px;
7037}
7038.timeline-item-time:first-child,
7039.timeline-item-time:last-child {
7040 margin-top: 0;
7041}
7042.timeline-item-title + .timeline-item-time {
7043 margin-top: 0;
7044}
7045.timeline-horizontal {
7046 height: 100%;
7047 display: -webkit-box;
7048 display: -webkit-flex;
7049 display: -ms-flexbox;
7050 display: flex;
7051}
7052.timeline-horizontal .timeline-item {
7053 display: block;
7054 width: 33.33333333vw;
7055 margin: 0;
7056 padding: 0;
7057 -webkit-flex-shrink: 0;
7058 -ms-flex-negative: 0;
7059 flex-shrink: 0;
7060 position: relative;
7061 height: 100%;
7062}
7063.timeline-horizontal .timeline-item-date {
7064 width: auto;
7065 line-height: 34px;
7066 position: absolute;
7067 left: 0;
7068 top: 0;
7069 width: 100%;
7070 height: 34px;
7071 text-align: left;
7072}
7073.timeline-horizontal .timeline-item-content {
7074 overflow: auto;
7075 -webkit-overflow-scrolling: touch;
7076 margin: 0;
7077}
7078.timeline-horizontal .timeline-item-divider {
7079 display: none;
7080}
7081.timeline-horizontal.col-100 .timeline-item {
7082 width: 100vw;
7083}
7084.timeline-horizontal.col-95 .timeline-item {
7085 width: 95vw;
7086}
7087.timeline-horizontal.col-90 .timeline-item {
7088 width: 90vw;
7089}
7090.timeline-horizontal.col-85 .timeline-item {
7091 width: 85vw;
7092}
7093.timeline-horizontal.col-80 .timeline-item {
7094 width: 80vw;
7095}
7096.timeline-horizontal.col-75 .timeline-item {
7097 width: 75vw;
7098}
7099.timeline-horizontal.col-70 .timeline-item {
7100 width: 70vw;
7101}
7102.timeline-horizontal.col-66 .timeline-item {
7103 width: 66.66666666666666vw;
7104}
7105.timeline-horizontal.col-65 .timeline-item {
7106 width: 65vw;
7107}
7108.timeline-horizontal.col-60 .timeline-item {
7109 width: 60vw;
7110}
7111.timeline-horizontal.col-55 .timeline-item {
7112 width: 55vw;
7113}
7114.timeline-horizontal.col-50 .timeline-item {
7115 width: 50vw;
7116}
7117.timeline-horizontal.col-45 .timeline-item {
7118 width: 45vw;
7119}
7120.timeline-horizontal.col-40 .timeline-item {
7121 width: 40vw;
7122}
7123.timeline-horizontal.col-35 .timeline-item {
7124 width: 35vw;
7125}
7126.timeline-horizontal.col-33 .timeline-item {
7127 width: 33.333333333333336vw;
7128}
7129.timeline-horizontal.col-30 .timeline-item {
7130 width: 30vw;
7131}
7132.timeline-horizontal.col-25 .timeline-item {
7133 width: 25vw;
7134}
7135.timeline-horizontal.col-20 .timeline-item {
7136 width: 20vw;
7137}
7138.timeline-horizontal.col-15 .timeline-item {
7139 width: 15vw;
7140}
7141.timeline-horizontal.col-10 .timeline-item {
7142 width: 10vw;
7143}
7144.timeline-horizontal.col-5 .timeline-item {
7145 width: 5vw;
7146}
7147@media (min-width: 768px) {
7148 .timeline-horizontal.tablet-100 .timeline-item {
7149 width: 100vw;
7150 }
7151 .timeline-horizontal.tablet-95 .timeline-item {
7152 width: 95vw;
7153 }
7154 .timeline-horizontal.tablet-90 .timeline-item {
7155 width: 90vw;
7156 }
7157 .timeline-horizontal.tablet-85 .timeline-item {
7158 width: 85vw;
7159 }
7160 .timeline-horizontal.tablet-80 .timeline-item {
7161 width: 80vw;
7162 }
7163 .timeline-horizontal.tablet-75 .timeline-item {
7164 width: 75vw;
7165 }
7166 .timeline-horizontal.tablet-70 .timeline-item {
7167 width: 70vw;
7168 }
7169 .timeline-horizontal.tablet-66 .timeline-item {
7170 width: 66.66666666666666vw;
7171 }
7172 .timeline-horizontal.tablet-65 .timeline-item {
7173 width: 65vw;
7174 }
7175 .timeline-horizontal.tablet-60 .timeline-item {
7176 width: 60vw;
7177 }
7178 .timeline-horizontal.tablet-55 .timeline-item {
7179 width: 55vw;
7180 }
7181 .timeline-horizontal.tablet-50 .timeline-item {
7182 width: 50vw;
7183 }
7184 .timeline-horizontal.tablet-45 .timeline-item {
7185 width: 45vw;
7186 }
7187 .timeline-horizontal.tablet-40 .timeline-item {
7188 width: 40vw;
7189 }
7190 .timeline-horizontal.tablet-35 .timeline-item {
7191 width: 35vw;
7192 }
7193 .timeline-horizontal.tablet-33 .timeline-item {
7194 width: 33.333333333333336vw;
7195 }
7196 .timeline-horizontal.tablet-30 .timeline-item {
7197 width: 30vw;
7198 }
7199 .timeline-horizontal.tablet-25 .timeline-item {
7200 width: 25vw;
7201 }
7202 .timeline-horizontal.tablet-20 .timeline-item {
7203 width: 20vw;
7204 }
7205 .timeline-horizontal.tablet-15 .timeline-item {
7206 width: 15vw;
7207 }
7208 .timeline-horizontal.tablet-10 .timeline-item {
7209 width: 10vw;
7210 }
7211 .timeline-horizontal.tablet-5 .timeline-item {
7212 width: 5vw;
7213 }
7214}
7215.timeline-horizontal .timeline-year,
7216.timeline-horizontal .timeline-month {
7217 display: -webkit-box;
7218 display: -webkit-flex;
7219 display: -ms-flexbox;
7220 display: flex;
7221 -webkit-flex-shrink: 0;
7222 -ms-flex-negative: 0;
7223 flex-shrink: 0;
7224 padding-top: 24px;
7225 position: relative;
7226 -webkit-box-sizing: border-box;
7227 box-sizing: border-box;
7228 height: 100%;
7229}
7230.timeline-horizontal .timeline-year-title,
7231.timeline-horizontal .timeline-month-title {
7232 position: absolute;
7233 left: 0;
7234 top: 0;
7235 width: 100%;
7236 line-height: 24px;
7237 height: 24px;
7238 -webkit-box-sizing: border-box;
7239 box-sizing: border-box;
7240}
7241.timeline-horizontal .timeline-year-title span,
7242.timeline-horizontal .timeline-month-title span {
7243 display: inline-block;
7244 position: -webkit-sticky;
7245 position: sticky;
7246}
7247.timeline-horizontal .timeline-year-title {
7248 font-size: 16px;
7249}
7250.timeline-horizontal .timeline-month-title span {
7251 margin-top: -2px;
7252}
7253/* === Timeline iOS === */
7254.ios .timeline {
7255 margin: 35px 0;
7256 padding: 0 15px;
7257}
7258.ios .block-strong .timeline {
7259 padding: 0;
7260 margin: 0;
7261}
7262.ios .timeline-item {
7263 padding: 2px 0px 15px;
7264}
7265.ios .timeline-item:last-child {
7266 padding-bottom: 2px;
7267}
7268.ios .timeline-item-content .card,
7269.ios .timeline-item-content.card,
7270.ios .timeline-item-content .list,
7271.ios .timeline-item-content.list,
7272.ios .timeline-item-content .block,
7273.ios .timeline-item-content.block {
7274 margin: 0;
7275 width: 100%;
7276}
7277.ios .timeline-item-content .card + .card,
7278.ios .timeline-item-content .list + .card,
7279.ios .timeline-item-content .block + .card,
7280.ios .timeline-item-content .card + .list,
7281.ios .timeline-item-content .list + .list,
7282.ios .timeline-item-content .block + .list,
7283.ios .timeline-item-content .card + .block,
7284.ios .timeline-item-content .list + .block,
7285.ios .timeline-item-content .block + .block {
7286 margin: 15px 0 0;
7287}
7288.ios .timeline-item-inner {
7289 border-radius: 7px;
7290 padding: 8px 15px;
7291}
7292.ios .timeline-item-inner + .timeline-item-inner {
7293 margin-top: 15px;
7294}
7295.ios .block-strong .timeline-item-inner {
7296 border-radius: 3px;
7297 border: 1px solid rgba(0, 0, 0, 0.1);
7298}
7299.ios .timeline-item-divider {
7300 margin-left: 15px;
7301 margin-right: 15px;
7302}
7303.ios .timeline-item-time {
7304 margin-top: 15px;
7305 color: #6d6d72;
7306}
7307.ios .timeline-item-time:first-child,
7308.ios .timeline-item-time:last-child {
7309 margin-top: 0;
7310}
7311.ios .timeline-item-title {
7312 font-size: 17px;
7313 font-weight: 600;
7314}
7315.ios .timeline-item-subtitle {
7316 font-size: 15px;
7317}
7318.ios .timeline-sides .timeline-item {
7319 margin-left: calc(50% - (30px + 10px) / 2 - 50px);
7320 margin-right: 0;
7321}
7322.ios .timeline-sides .timeline-item .timeline-item-date {
7323 text-align: right;
7324}
7325.ios .timeline-sides .timeline-item:not(.timeline-item-right):nth-child(2n) {
7326 -webkit-box-orient: horizontal;
7327 -webkit-box-direction: reverse;
7328 -webkit-flex-direction: row-reverse;
7329 -ms-flex-direction: row-reverse;
7330 flex-direction: row-reverse;
7331 margin-right: calc(50% - (30px + 10px) / 2 - 50px);
7332 margin-left: 0;
7333}
7334.ios .timeline-sides .timeline-item:not(.timeline-item-right):nth-child(2n) .timeline-item-date {
7335 text-align: left;
7336}
7337.ios .timeline-sides .timeline-item-left {
7338 -webkit-box-orient: horizontal;
7339 -webkit-box-direction: reverse;
7340 -webkit-flex-direction: row-reverse;
7341 -ms-flex-direction: row-reverse;
7342 flex-direction: row-reverse;
7343 margin-right: calc(50% - (30px + 10px) / 2 - 50px);
7344 margin-left: 0;
7345}
7346.ios .timeline-sides .timeline-item-left .timeline-item-date {
7347 text-align: left;
7348}
7349.ios .timeline-sides .timeline-item-right {
7350 margin-left: calc(50% - (30px + 10px) / 2 - 50px);
7351 margin-right: 0;
7352}
7353.ios .timeline-sides .timeline-item-right .timeline-item-date {
7354 text-align: right;
7355}
7356@media (min-width: 768px) {
7357 .ios .tablet-sides .timeline-item {
7358 margin-left: calc(50% - (30px + 10px) / 2 - 50px);
7359 margin-right: 0;
7360 }
7361 .ios .tablet-sides .timeline-item .timeline-item-date {
7362 text-align: right;
7363 }
7364 .ios .tablet-sides .timeline-item:not(.timeline-item-right):nth-child(2n) {
7365 -webkit-box-orient: horizontal;
7366 -webkit-box-direction: reverse;
7367 -webkit-flex-direction: row-reverse;
7368 -ms-flex-direction: row-reverse;
7369 flex-direction: row-reverse;
7370 margin-right: calc(50% - (30px + 10px) / 2 - 50px);
7371 margin-left: 0;
7372 }
7373 .ios .tablet-sides .timeline-item:not(.timeline-item-right):nth-child(2n) .timeline-item-date {
7374 text-align: left;
7375 }
7376 .ios .tablet-sides .timeline-item-left {
7377 -webkit-box-orient: horizontal;
7378 -webkit-box-direction: reverse;
7379 -webkit-flex-direction: row-reverse;
7380 -ms-flex-direction: row-reverse;
7381 flex-direction: row-reverse;
7382 margin-right: calc(50% - (30px + 10px) / 2 - 50px);
7383 margin-left: 0;
7384 }
7385 .ios .tablet-sides .timeline-item-left .timeline-item-date {
7386 text-align: left;
7387 }
7388 .ios .tablet-sides .timeline-item-right {
7389 margin-left: calc(50% - (30px + 10px) / 2 - 50px);
7390 margin-right: 0;
7391 }
7392 .ios .tablet-sides .timeline-item-right .timeline-item-date {
7393 text-align: right;
7394 }
7395}
7396.ios .timeline-horizontal {
7397 padding: 0;
7398 margin: 0;
7399}
7400.ios .timeline-horizontal .timeline-item {
7401 padding-top: 34px !important;
7402 padding-bottom: 10px;
7403}
7404.ios .timeline-horizontal > .timeline-item:last-child:after,
7405.ios .timeline-horizontal .timeline-month:last-child .timeline-item:last-child:after {
7406 display: none !important;
7407}
7408.ios .timeline-horizontal .timeline-item-date {
7409 background: #f7f7f8;
7410 padding: 0px 10px;
7411}
7412.ios .timeline-horizontal .timeline-item-content {
7413 padding: 10px;
7414 height: calc(100% - 10px);
7415}
7416.ios .timeline-horizontal .timeline-item-date:after {
7417 content: '';
7418 position: absolute;
7419 background-color: #c4c4c4;
7420 display: block;
7421 z-index: 15;
7422 top: auto;
7423 right: auto;
7424 bottom: 0;
7425 left: 0;
7426 height: 1px;
7427 width: 100%;
7428 -webkit-transform-origin: 50% 100%;
7429 transform-origin: 50% 100%;
7430}
7431.ios.device-pixel-ratio-2 .timeline-horizontal .timeline-item-date:after {
7432 -webkit-transform: scaleY(0.5);
7433 transform: scaleY(0.5);
7434}
7435.ios.device-pixel-ratio-3 .timeline-horizontal .timeline-item-date:after {
7436 -webkit-transform: scaleY(0.33);
7437 transform: scaleY(0.33);
7438}
7439.ios .timeline-horizontal .timeline-month .timeline-item:before {
7440 content: '';
7441 position: absolute;
7442 background-color: #c4c4c4;
7443 display: block;
7444 z-index: 15;
7445 top: 0;
7446 right: auto;
7447 bottom: auto;
7448 left: 0;
7449 height: 1px;
7450 width: 100%;
7451 -webkit-transform-origin: 50% 0%;
7452 transform-origin: 50% 0%;
7453}
7454.ios.device-pixel-ratio-2 .timeline-horizontal .timeline-month .timeline-item:before {
7455 -webkit-transform: scaleY(0.5);
7456 transform: scaleY(0.5);
7457}
7458.ios.device-pixel-ratio-3 .timeline-horizontal .timeline-month .timeline-item:before {
7459 -webkit-transform: scaleY(0.33);
7460 transform: scaleY(0.33);
7461}
7462.ios .timeline-horizontal .timeline-item:after {
7463 content: '';
7464 position: absolute;
7465 background-color: #c4c4c4;
7466 display: block;
7467 z-index: 15;
7468 top: 0;
7469 right: 0;
7470 bottom: auto;
7471 left: auto;
7472 width: 1px;
7473 height: 100%;
7474 -webkit-transform-origin: 100% 50%;
7475 transform-origin: 100% 50%;
7476}
7477.ios.device-pixel-ratio-2 .timeline-horizontal .timeline-item:after {
7478 -webkit-transform: scaleX(0.5);
7479 transform: scaleX(0.5);
7480}
7481.ios.device-pixel-ratio-3 .timeline-horizontal .timeline-item:after {
7482 -webkit-transform: scaleX(0.33);
7483 transform: scaleX(0.33);
7484}
7485.ios .timeline-horizontal .timeline-year:after {
7486 content: '';
7487 position: absolute;
7488 background-color: #c4c4c4;
7489 display: block;
7490 z-index: 15;
7491 top: 0;
7492 right: 0;
7493 bottom: auto;
7494 left: auto;
7495 width: 1px;
7496 height: 100%;
7497 -webkit-transform-origin: 100% 50%;
7498 transform-origin: 100% 50%;
7499}
7500.ios.device-pixel-ratio-2 .timeline-horizontal .timeline-year:after {
7501 -webkit-transform: scaleX(0.5);
7502 transform: scaleX(0.5);
7503}
7504.ios.device-pixel-ratio-3 .timeline-horizontal .timeline-year:after {
7505 -webkit-transform: scaleX(0.33);
7506 transform: scaleX(0.33);
7507}
7508.ios .timeline-year:last-child:after {
7509 display: none !important;
7510}
7511.ios .timeline-year-title,
7512.ios .timeline-month-title {
7513 padding: 0 10px;
7514 background: #f7f7f8;
7515}
7516.ios .timeline-year-title span,
7517.ios .timeline-month-title span {
7518 left: 10px;
7519}
7520.ios .timeline-year-title span {
7521 margin-top: 3px;
7522}
7523@media (orientation: landscape) {
7524 .ios.device-iphone-x .ios-left-edge .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge),
7525 .ios.device-iphone-x .ios-edges .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge),
7526 .ios.device-iphone-x .popup .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge),
7527 .ios.device-iphone-x .sheet-modal .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge),
7528 .ios.device-iphone-x .panel-left .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge) {
7529 padding-left: constant(safe-area-inset-left);
7530 padding-left: env(safe-area-inset-left);
7531 }
7532 .ios.device-iphone-x .ios-left-edge .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge) .timeline-year-title span,
7533 .ios.device-iphone-x .ios-edges .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge) .timeline-year-title span,
7534 .ios.device-iphone-x .popup .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge) .timeline-year-title span,
7535 .ios.device-iphone-x .sheet-modal .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge) .timeline-year-title span,
7536 .ios.device-iphone-x .panel-left .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge) .timeline-year-title span,
7537 .ios.device-iphone-x .ios-left-edge .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge) .timeline-month-title span,
7538 .ios.device-iphone-x .ios-edges .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge) .timeline-month-title span,
7539 .ios.device-iphone-x .popup .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge) .timeline-month-title span,
7540 .ios.device-iphone-x .sheet-modal .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge) .timeline-month-title span,
7541 .ios.device-iphone-x .panel-left .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge) .timeline-month-title span {
7542 left: calc(10px + constant(safe-area-inset-left));
7543 left: calc(10px + env(safe-area-inset-left));
7544 }
7545 .ios.device-iphone-x .ios-left-edge .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge) .timeline-year:first-child .timeline-year-title,
7546 .ios.device-iphone-x .ios-edges .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge) .timeline-year:first-child .timeline-year-title,
7547 .ios.device-iphone-x .popup .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge) .timeline-year:first-child .timeline-year-title,
7548 .ios.device-iphone-x .sheet-modal .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge) .timeline-year:first-child .timeline-year-title,
7549 .ios.device-iphone-x .panel-left .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge) .timeline-year:first-child .timeline-year-title,
7550 .ios.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,
7551 .ios.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,
7552 .ios.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,
7553 .ios.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,
7554 .ios.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,
7555 .ios.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,
7556 .ios.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,
7557 .ios.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,
7558 .ios.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,
7559 .ios.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 {
7560 left: -44px;
7561 right: 0;
7562 width: auto;
7563 }
7564 .ios.device-iphone-x .ios-left-edge .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge) > .timeline-item:first-child,
7565 .ios.device-iphone-x .ios-edges .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge) > .timeline-item:first-child,
7566 .ios.device-iphone-x .popup .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge) > .timeline-item:first-child,
7567 .ios.device-iphone-x .sheet-modal .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge) > .timeline-item:first-child,
7568 .ios.device-iphone-x .panel-left .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge) > .timeline-item:first-child,
7569 .ios.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,
7570 .ios.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,
7571 .ios.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,
7572 .ios.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,
7573 .ios.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,
7574 .ios.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,
7575 .ios.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,
7576 .ios.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,
7577 .ios.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,
7578 .ios.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,
7579 .ios.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,
7580 .ios.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,
7581 .ios.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,
7582 .ios.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,
7583 .ios.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 {
7584 overflow: visible;
7585 }
7586 .ios.device-iphone-x .ios-left-edge .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge) > .timeline-item:first-child .timeline-item-date,
7587 .ios.device-iphone-x .ios-edges .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge) > .timeline-item:first-child .timeline-item-date,
7588 .ios.device-iphone-x .popup .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge) > .timeline-item:first-child .timeline-item-date,
7589 .ios.device-iphone-x .sheet-modal .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge) > .timeline-item:first-child .timeline-item-date,
7590 .ios.device-iphone-x .panel-left .timeline-horizontal:not(.no-ios-edges):not(.no-ios-left-edge) > .timeline-item:first-child .timeline-item-date,
7591 .ios.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,
7592 .ios.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,
7593 .ios.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,
7594 .ios.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,
7595 .ios.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,
7596 .ios.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,
7597 .ios.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,
7598 .ios.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,
7599 .ios.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,
7600 .ios.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,
7601 .ios.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,
7602 .ios.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,
7603 .ios.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,
7604 .ios.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,
7605 .ios.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 {
7606 width: auto;
7607 padding-left: calc(10px + constant(safe-area-inset-left));
7608 padding-left: calc(10px + env(safe-area-inset-left));
7609 left: calc(0px - constant(safe-area-inset-left));
7610 left: calc(0px - env(safe-area-inset-left));
7611 right: 0;
7612 }
7613 .ios.device-iphone-x .ios-left-edge .timeline:not(.no-ios-edges):not(.no-ios-left-edge):not(.timeline-horizontal),
7614 .ios.device-iphone-x .ios-edges .timeline:not(.no-ios-edges):not(.no-ios-left-edge):not(.timeline-horizontal),
7615 .ios.device-iphone-x .popup .timeline:not(.no-ios-edges):not(.no-ios-left-edge):not(.timeline-horizontal),
7616 .ios.device-iphone-x .sheet-modal .timeline:not(.no-ios-edges):not(.no-ios-left-edge):not(.timeline-horizontal),
7617 .ios.device-iphone-x .panel-left .timeline:not(.no-ios-edges):not(.no-ios-left-edge):not(.timeline-horizontal) {
7618 padding-left: calc(15px + constant(safe-area-inset-left));
7619 padding-left: calc(15px + env(safe-area-inset-left));
7620 }
7621 .ios.device-iphone-x .ios-right-edge .timeline-horizontal:not(.no-ios-edges):not(.no-ios-right-edge) .timeline-year:last-child .timeline-year-title,
7622 .ios.device-iphone-x .ios-edges .timeline-horizontal:not(.no-ios-edges):not(.no-ios-right-edge) .timeline-year:last-child .timeline-year-title,
7623 .ios.device-iphone-x .popup .timeline-horizontal:not(.no-ios-edges):not(.no-ios-right-edge) .timeline-year:last-child .timeline-year-title,
7624 .ios.device-iphone-x .sheet-modal .timeline-horizontal:not(.no-ios-edges):not(.no-ios-right-edge) .timeline-year:last-child .timeline-year-title,
7625 .ios.device-iphone-x .panel-right .timeline-horizontal:not(.no-ios-edges):not(.no-ios-right-edge) .timeline-year:last-child .timeline-year-title,
7626 .ios.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,
7627 .ios.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,
7628 .ios.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,
7629 .ios.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,
7630 .ios.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 {
7631 width: auto;
7632 right: calc(0px - constant(safe-area-inset-right));
7633 right: calc(0px - env(safe-area-inset-right));
7634 }
7635 .ios.device-iphone-x .ios-right-edge .timeline-horizontal:not(.no-ios-edges):not(.no-ios-right-edge) > .timeline-item:last-child,
7636 .ios.device-iphone-x .ios-edges .timeline-horizontal:not(.no-ios-edges):not(.no-ios-right-edge) > .timeline-item:last-child,
7637 .ios.device-iphone-x .popup .timeline-horizontal:not(.no-ios-edges):not(.no-ios-right-edge) > .timeline-item:last-child,
7638 .ios.device-iphone-x .sheet-modal .timeline-horizontal:not(.no-ios-edges):not(.no-ios-right-edge) > .timeline-item:last-child,
7639 .ios.device-iphone-x .panel-right .timeline-horizontal:not(.no-ios-edges):not(.no-ios-right-edge) > .timeline-item:last-child,
7640 .ios.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,
7641 .ios.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,
7642 .ios.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,
7643 .ios.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,
7644 .ios.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 {
7645 overflow: visible;
7646 }
7647 .ios.device-iphone-x .ios-right-edge .timeline-horizontal:not(.no-ios-edges):not(.no-ios-right-edge) > .timeline-item:last-child .timeline-item-date,
7648 .ios.device-iphone-x .ios-edges .timeline-horizontal:not(.no-ios-edges):not(.no-ios-right-edge) > .timeline-item:last-child .timeline-item-date,
7649 .ios.device-iphone-x .popup .timeline-horizontal:not(.no-ios-edges):not(.no-ios-right-edge) > .timeline-item:last-child .timeline-item-date,
7650 .ios.device-iphone-x .sheet-modal .timeline-horizontal:not(.no-ios-edges):not(.no-ios-right-edge) > .timeline-item:last-child .timeline-item-date,
7651 .ios.device-iphone-x .panel-right .timeline-horizontal:not(.no-ios-edges):not(.no-ios-right-edge) > .timeline-item:last-child .timeline-item-date,
7652 .ios.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,
7653 .ios.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,
7654 .ios.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,
7655 .ios.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,
7656 .ios.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 {
7657 width: auto;
7658 right: calc(0px - constant(safe-area-inset-right));
7659 right: calc(0px - env(safe-area-inset-right));
7660 left: 0;
7661 }
7662 .ios.device-iphone-x .ios-right-edge .timeline:not(.no-ios-edges):not(.no-ios-right-edge):not(.timeline-horizontal),
7663 .ios.device-iphone-x .ios-edges .timeline:not(.no-ios-edges):not(.no-ios-right-edge):not(.timeline-horizontal),
7664 .ios.device-iphone-x .popup .timeline:not(.no-ios-edges):not(.no-ios-right-edge):not(.timeline-horizontal),
7665 .ios.device-iphone-x .sheet-modal .timeline:not(.no-ios-edges):not(.no-ios-right-edge):not(.timeline-horizontal),
7666 .ios.device-iphone-x .panel-right .timeline:not(.no-ios-edges):not(.no-ios-right-edge):not(.timeline-horizontal) {
7667 padding-right: calc(15px + constant(safe-area-inset-right));
7668 padding-right: calc(15px + env(safe-area-inset-right));
7669 }
7670}
7671.ios .theme-dark .timeline-year-title,
7672.ios .theme-dark .timeline-month-title {
7673 background: #1b1b1b;
7674}
7675.ios .theme-dark .timeline-item-inner {
7676 background-color: #1c1c1d;
7677}
7678.ios .theme-dark .timeline-item-time {
7679 color: #8E8E93;
7680}
7681.ios .theme-dark .timeline-horizontal .timeline-item-date,
7682.timeline-horizontal.ios .theme-dark .timeline-item-date {
7683 background: #1b1b1b;
7684}
7685.ios .theme-dark .timeline-horizontal .timeline-item-date:after,
7686.timeline-horizontal.ios .theme-dark .timeline-item-date:after {
7687 background-color: #282829;
7688}
7689.ios .theme-dark .timeline-horizontal .timeline-month .timeline-item:before,
7690.timeline-horizontal.ios .theme-dark .timeline-month .timeline-item:before {
7691 background-color: #282829;
7692}
7693.ios .theme-dark .timeline-horizontal .timeline-item:after,
7694.timeline-horizontal.ios .theme-dark .timeline-item:after {
7695 background-color: #282829;
7696}
7697.ios .theme-dark .timeline-horizontal .timeline-year:after,
7698.timeline-horizontal.ios .theme-dark .timeline-year:after {
7699 background-color: #282829;
7700}
7701/* === Tabs === */
7702.tabs .tab {
7703 display: none;
7704}
7705.tabs .tab-active {
7706 display: block;
7707}
7708.tabs-animated-wrap {
7709 position: relative;
7710 width: 100%;
7711 overflow: hidden;
7712 height: 100%;
7713}
7714.tabs-animated-wrap > .tabs {
7715 display: -webkit-box;
7716 display: -webkit-flex;
7717 display: -ms-flexbox;
7718 display: flex;
7719 height: 100%;
7720 -webkit-transition-duration: 300ms;
7721 transition-duration: 300ms;
7722}
7723.tabs-animated-wrap > .tabs > .tab {
7724 width: 100%;
7725 display: block;
7726 -webkit-flex-shrink: 0;
7727 -ms-flex-negative: 0;
7728 flex-shrink: 0;
7729}
7730.tabs-animated-wrap.not-animated > .tabs {
7731 -webkit-transition-duration: 300ms;
7732 transition-duration: 300ms;
7733}
7734.tabs-swipeable-wrap {
7735 height: 100%;
7736}
7737.tabs-swipeable-wrap > .tabs {
7738 height: 100%;
7739}
7740.tabs-swipeable-wrap > .tabs > .tab {
7741 display: block;
7742}
7743.page > .tabs {
7744 height: 100%;
7745}
7746/* === Panels === */
7747.panel-backdrop {
7748 position: absolute;
7749 left: 0;
7750 top: 0;
7751 width: 100%;
7752 height: 100%;
7753 opacity: 0;
7754 z-index: 5999;
7755 display: none;
7756 -webkit-transform: translate3d(0, 0, 0);
7757 transform: translate3d(0, 0, 0);
7758}
7759.panel-backdrop.not-animated {
7760 -webkit-transition-duration: 0ms !important;
7761 transition-duration: 0ms !important;
7762}
7763.panel {
7764 z-index: 1000;
7765 display: none;
7766 -webkit-box-sizing: border-box;
7767 box-sizing: border-box;
7768 position: absolute;
7769 overflow: auto;
7770 -webkit-overflow-scrolling: touch;
7771 top: 0;
7772 height: 100%;
7773 -webkit-transform: translate3d(0, 0, 0);
7774 transform: translate3d(0, 0, 0);
7775 width: 260px;
7776 background-color: #fff;
7777}
7778.panel.not-animated {
7779 -webkit-transition-duration: 0ms !important;
7780 transition-duration: 0ms !important;
7781}
7782.panel.panel-reveal.not-animated ~ .views,
7783.panel.panel-reveal.not-animated ~ .view {
7784 -webkit-transition-duration: 0ms !important;
7785 transition-duration: 0ms !important;
7786}
7787.panel-cover {
7788 z-index: 6000;
7789}
7790.panel-left {
7791 left: 0;
7792}
7793.panel-left.panel-cover {
7794 -webkit-transform: translate3d(-100%, 0, 0);
7795 transform: translate3d(-100%, 0, 0);
7796}
7797.panel-right {
7798 right: 0;
7799}
7800.panel-right.panel-cover {
7801 -webkit-transform: translate3d(100%, 0, 0);
7802 transform: translate3d(100%, 0, 0);
7803}
7804.panel-visible-by-breakpoint {
7805 display: block;
7806 -webkit-transform: translate3d(0, 0, 0) !important;
7807 transform: translate3d(0, 0, 0) !important;
7808}
7809.panel-visible-by-breakpoint.panel-cover {
7810 z-index: 5900;
7811}
7812html.with-panel .framework7-root > .views .page-content,
7813html.with-panel .framework7-root > .view .page-content {
7814 overflow: hidden;
7815 -webkit-overflow-scrolling: auto;
7816}
7817html.with-panel-left-cover .panel-backdrop,
7818html.with-panel-right-cover .panel-backdrop {
7819 display: block;
7820 opacity: 1;
7821}
7822html.with-panel-left-reveal .panel-backdrop,
7823html.with-panel-right-reveal .panel-backdrop,
7824html.with-panel-transitioning .panel-backdrop {
7825 background: rgba(0, 0, 0, 0);
7826 display: block;
7827 opacity: 0;
7828}
7829html.with-panel-left-reveal .views,
7830html.with-panel-left-reveal .framework7-root > .view,
7831html.with-panel-left-reveal .panel-backdrop {
7832 -webkit-transform: translate3d(260px, 0, 0);
7833 transform: translate3d(260px, 0, 0);
7834}
7835html.with-panel-right-reveal .views,
7836html.with-panel-right-reveal .framework7-root > .view,
7837html.with-panel-right-reveal .panel-backdrop {
7838 -webkit-transform: translate3d(-260px, 0, 0);
7839 transform: translate3d(-260px, 0, 0);
7840}
7841html.with-panel-left-cover .panel-left {
7842 -webkit-transform: translate3d(0px, 0, 0);
7843 transform: translate3d(0px, 0, 0);
7844}
7845html.with-panel-right-cover .panel-right {
7846 -webkit-transform: translate3d(0px, 0, 0);
7847 transform: translate3d(0px, 0, 0);
7848}
7849html.with-statusbar.device-ios .panel,
7850html.with-statusbar.ios:not(.device-ios):not(.device-android) .panel {
7851 top: 20px;
7852 height: calc(100% - 20px);
7853}
7854html.with-statusbar.device-android .panel,
7855html.with-statusbar.md:not(.device-ios):not(.device-android) .panel {
7856 top: 24px;
7857 height: calc(100% - 24px);
7858}
7859html.with-statusbar.device-iphone-x .panel {
7860 top: constant(safe-area-inset-top);
7861 top: env(safe-area-inset-top);
7862 height: calc(100% - constant(safe-area-inset-top));
7863 height: calc(100% - env(safe-area-inset-top));
7864}
7865.ios .panel-backdrop {
7866 -webkit-transition-duration: 400ms;
7867 transition-duration: 400ms;
7868 background: rgba(0, 0, 0, 0);
7869}
7870.ios .panel {
7871 -webkit-transition-duration: 400ms;
7872 transition-duration: 400ms;
7873}
7874.ios.with-panel-left-reveal .views,
7875.ios.with-panel-right-reveal .views,
7876.ios.with-panel-transitioning .views,
7877.ios.with-panel-left-reveal .framework7-root > .view,
7878.ios.with-panel-right-reveal .framework7-root > .view,
7879.ios.with-panel-transitioning .framework7-root > .view {
7880 -webkit-transition-duration: 400ms;
7881 transition-duration: 400ms;
7882 -webkit-transition-property: -webkit-transform;
7883 transition-property: -webkit-transform;
7884 transition-property: transform;
7885 transition-property: transform, -webkit-transform;
7886}
7887/* === Card === */
7888.cards-list > ul:before,
7889.card .list > ul:before {
7890 display: none !important;
7891}
7892.cards-list > ul:after,
7893.card .list > ul:after {
7894 display: none !important;
7895}
7896.card {
7897 background: #fff;
7898 position: relative;
7899 border-radius: 4px;
7900 font-size: 14px;
7901}
7902.card .list,
7903.card .block {
7904 margin: 0;
7905}
7906.row:not(.no-gap) .col > .card {
7907 margin-left: 0;
7908 margin-right: 0;
7909}
7910.card-content {
7911 position: relative;
7912}
7913.card-content-padding {
7914 position: relative;
7915}
7916.card-content-padding > p:first-child {
7917 margin-top: 0;
7918}
7919.card-content-padding > p:last-child {
7920 margin-bottom: 0;
7921}
7922.card-header,
7923.card-footer {
7924 min-height: 44px;
7925 position: relative;
7926 -webkit-box-sizing: border-box;
7927 box-sizing: border-box;
7928 display: -webkit-box;
7929 display: -webkit-flex;
7930 display: -ms-flexbox;
7931 display: flex;
7932 -webkit-box-pack: justify;
7933 -webkit-justify-content: space-between;
7934 -ms-flex-pack: justify;
7935 justify-content: space-between;
7936 -webkit-box-align: center;
7937 -webkit-align-items: center;
7938 -ms-flex-align: center;
7939 align-items: center;
7940}
7941.card-header[valign="top"],
7942.card-footer[valign="top"] {
7943 -webkit-box-align: start;
7944 -webkit-align-items: flex-start;
7945 -ms-flex-align: start;
7946 align-items: flex-start;
7947}
7948.card-header[valign="bottom"],
7949.card-footer[valign="bottom"] {
7950 -webkit-box-align: end;
7951 -webkit-align-items: flex-end;
7952 -ms-flex-align: end;
7953 align-items: flex-end;
7954}
7955.card-header a.link,
7956.card-footer a.link {
7957 position: relative;
7958}
7959.card-header a.link i.icon,
7960.card-footer a.link i.icon {
7961 display: block;
7962}
7963.card-header a.icon-only,
7964.card-footer a.icon-only {
7965 display: -webkit-box;
7966 display: -webkit-flex;
7967 display: -ms-flexbox;
7968 display: flex;
7969 -webkit-box-pack: center;
7970 -webkit-justify-content: center;
7971 -ms-flex-pack: center;
7972 justify-content: center;
7973 -webkit-box-align: center;
7974 -webkit-align-items: center;
7975 -ms-flex-align: center;
7976 align-items: center;
7977 margin: 0;
7978}
7979.card-header {
7980 border-radius: 4px 4px 0 0;
7981}
7982.card-header:after {
7983 content: '';
7984 position: absolute;
7985 background-color: #e1e1e1;
7986 display: block;
7987 z-index: 15;
7988 top: auto;
7989 right: auto;
7990 bottom: 0;
7991 left: 0;
7992 height: 1px;
7993 width: 100%;
7994 -webkit-transform-origin: 50% 100%;
7995 transform-origin: 50% 100%;
7996}
7997html.device-pixel-ratio-2 .card-header:after {
7998 -webkit-transform: scaleY(0.5);
7999 transform: scaleY(0.5);
8000}
8001html.device-pixel-ratio-3 .card-header:after {
8002 -webkit-transform: scaleY(0.33);
8003 transform: scaleY(0.33);
8004}
8005.card-header.no-hairline:after {
8006 display: none !important;
8007}
8008.card-footer {
8009 border-radius: 0 0 4px 4px;
8010}
8011.card-footer:before {
8012 content: '';
8013 position: absolute;
8014 background-color: #e1e1e1;
8015 display: block;
8016 z-index: 15;
8017 top: 0;
8018 right: auto;
8019 bottom: auto;
8020 left: 0;
8021 height: 1px;
8022 width: 100%;
8023 -webkit-transform-origin: 50% 0%;
8024 transform-origin: 50% 0%;
8025}
8026html.device-pixel-ratio-2 .card-footer:before {
8027 -webkit-transform: scaleY(0.5);
8028 transform: scaleY(0.5);
8029}
8030html.device-pixel-ratio-3 .card-footer:before {
8031 -webkit-transform: scaleY(0.33);
8032 transform: scaleY(0.33);
8033}
8034.card-footer.no-hairline:before {
8035 display: none !important;
8036}
8037.ios .cards-list ul,
8038.ios .card .list ul {
8039 background: none;
8040}
8041.ios .card {
8042 -webkit-box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.3);
8043 box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.3);
8044 margin: 10px;
8045}
8046.ios .card-outline {
8047 -webkit-box-shadow: none;
8048 box-shadow: none;
8049 border: 1px solid rgba(0, 0, 0, 0.12);
8050}
8051.ios .card-header a.link,
8052.ios .card-footer a.link {
8053 line-height: 44px;
8054 height: 44px;
8055 margin-top: -10px;
8056 margin-bottom: -10px;
8057 display: -webkit-box;
8058 display: -webkit-flex;
8059 display: -ms-flexbox;
8060 display: flex;
8061 -webkit-box-pack: start;
8062 -webkit-justify-content: flex-start;
8063 -ms-flex-pack: start;
8064 justify-content: flex-start;
8065}
8066.ios .card-header a.icon-only,
8067.ios .card-footer a.icon-only {
8068 min-width: 44px;
8069}
8070.ios .card-content-padding {
8071 padding: 15px;
8072}
8073.ios .card-content-padding > .list,
8074.ios .card-content-padding > .block {
8075 margin: -15px;
8076}
8077.ios .card-header,
8078.ios .card-footer {
8079 min-height: 44px;
8080 padding: 10px 15px;
8081}
8082.ios .card-header {
8083 font-size: 17px;
8084}
8085.ios .card-footer {
8086 color: #6d6d72;
8087}
8088@media (orientation: landscape) {
8089 .ios.device-iphone-x .ios-left-edge .card:not(.no-ios-edges):not(.no-ios-left-edge),
8090 .ios.device-iphone-x .ios-edges .card:not(.no-ios-edges):not(.no-ios-left-edge),
8091 .ios.device-iphone-x .popup .card:not(.no-ios-edges):not(.no-ios-left-edge),
8092 .ios.device-iphone-x .sheet-modal .card:not(.no-ios-edges):not(.no-ios-left-edge),
8093 .ios.device-iphone-x .panel-left .card:not(.no-ios-edges):not(.no-ios-left-edge) {
8094 margin-left: calc(10px + constant(safe-area-inset-left));
8095 margin-left: calc(10px + env(safe-area-inset-left));
8096 }
8097 .ios.device-iphone-x .ios-right-edge .card:not(.no-ios-edges):not(.no-ios-right-edge),
8098 .ios.device-iphone-x .ios-edges .card:not(.no-ios-edges):not(.no-ios-right-edge),
8099 .ios.device-iphone-x .popup .card:not(.no-ios-edges):not(.no-ios-right-edge),
8100 .ios.device-iphone-x .sheet-modal .card:not(.no-ios-edges):not(.no-ios-right-edge),
8101 .ios.device-iphone-x .panel-right .card:not(.no-ios-edges):not(.no-ios-right-edge) {
8102 margin-right: calc(10px + constant(safe-area-inset-right));
8103 margin-right: calc(10px + env(safe-area-inset-right));
8104 }
8105}
8106.ios .theme-dark .card {
8107 background-color: #1c1c1d;
8108}
8109.ios .theme-dark .card-outline {
8110 border-color: #282829;
8111}
8112.ios .theme-dark .card-header:after {
8113 background-color: #282829;
8114}
8115.ios .theme-dark .card-footer {
8116 color: #8E8E93;
8117}
8118.ios .theme-dark .card-footer:before {
8119 background-color: #282829;
8120}
8121/* === Chips === */
8122.chip {
8123 font-weight: normal;
8124 display: -webkit-inline-box;
8125 display: -webkit-inline-flex;
8126 display: -ms-inline-flexbox;
8127 display: inline-flex;
8128 -webkit-box-sizing: border-box;
8129 box-sizing: border-box;
8130 vertical-align: middle;
8131 -webkit-box-align: center;
8132 -webkit-align-items: center;
8133 -ms-flex-align: center;
8134 align-items: center;
8135 margin: 2px 0;
8136}
8137.chip-media {
8138 border-radius: 50%;
8139 text-align: center;
8140 color: #fff;
8141 -webkit-flex-shrink: 0;
8142 -ms-flex-negative: 0;
8143 flex-shrink: 0;
8144 display: -webkit-box;
8145 display: -webkit-flex;
8146 display: -ms-flexbox;
8147 display: flex;
8148 -webkit-box-align: center;
8149 -webkit-align-items: center;
8150 -ms-flex-align: center;
8151 align-items: center;
8152 -webkit-box-pack: center;
8153 -webkit-justify-content: center;
8154 -ms-flex-pack: center;
8155 justify-content: center;
8156}
8157.chip-media img {
8158 max-width: 100%;
8159 max-height: 100%;
8160 width: auto;
8161 height: auto;
8162 border-radius: 50%;
8163 display: block;
8164}
8165.chip-label {
8166 white-space: nowrap;
8167 overflow: hidden;
8168 text-overflow: ellipsis;
8169 position: relative;
8170 -webkit-flex-shrink: 1;
8171 -ms-flex-negative: 1;
8172 flex-shrink: 1;
8173 min-width: 0;
8174}
8175.chip-delete {
8176 text-align: center;
8177 cursor: pointer;
8178 -webkit-flex-shrink: 0;
8179 -ms-flex-negative: 0;
8180 flex-shrink: 0;
8181 background-repeat: no-repeat;
8182}
8183.chip .chip-delete.active-state {
8184 opacity: 1;
8185}
8186.ios .chip {
8187 font-size: 13px;
8188 color: #000;
8189 background: rgba(0, 0, 0, 0.12);
8190 height: 24px;
8191 border-radius: 12px;
8192 padding: 0 10px;
8193}
8194.ios .chip-outline {
8195 background: none;
8196 border: 1px solid rgba(0, 0, 0, 0.12);
8197}
8198.ios .chip-media {
8199 width: 24px;
8200 height: 24px;
8201 vertical-align: middle;
8202 border-radius: 50%;
8203 text-align: center;
8204 line-height: 16px;
8205 color: #fff;
8206 font-size: 12px;
8207 -webkit-box-sizing: border-box;
8208 box-sizing: border-box;
8209 margin-left: -10px;
8210}
8211.ios .chip-media + .chip-label {
8212 margin-left: 4px;
8213}
8214.ios .chip-media i.icon {
8215 font-size: 16px;
8216 height: 16px;
8217}
8218.ios .chip-delete {
8219 width: 24px;
8220 height: 24px;
8221 line-height: 24px;
8222 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%2028%2028'%3E%3Ccircle%20cx%3D'14'%20cy%3D'14'%20r%3D'14'%20fill%3D'%23000'%2F%3E%3Cline%20stroke%3D'%23fff'%20stroke-width%3D'3'%20stroke-miterlimit%3D'10'%20x1%3D'8'%20y1%3D'8'%20x2%3D'20'%20y2%3D'20'%2F%3E%3Cline%20fill%3D'none'%20stroke%3D'%23fff'%20stroke-width%3D'3'%20stroke-miterlimit%3D'10'%20x1%3D'20'%20y1%3D'8'%20x2%3D'8'%20y2%3D'20'%2F%3E%3C%2Fsvg%3E");
8223 background-position: center;
8224 background-size: 14px 14px;
8225 opacity: 0.54;
8226 margin-right: -10px;
8227}
8228.ios .theme-dark .chip {
8229 background-color: #333;
8230 color: #fff;
8231}
8232.ios .theme-dark .chip-outline {
8233 background: none;
8234 border-color: #333;
8235}
8236.ios .theme-dark .chip-delete {
8237 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%2028%2028'%3E%3Ccircle%20cx%3D'14'%20cy%3D'14'%20r%3D'14'%20fill%3D'%23fff'%2F%3E%3Cline%20stroke%3D'%23000'%20stroke-width%3D'3'%20stroke-miterlimit%3D'10'%20x1%3D'8'%20y1%3D'8'%20x2%3D'20'%20y2%3D'20'%2F%3E%3Cline%20fill%3D'none'%20stroke%3D'%23000'%20stroke-width%3D'3'%20stroke-miterlimit%3D'10'%20x1%3D'20'%20y1%3D'8'%20x2%3D'8'%20y2%3D'20'%2F%3E%3C%2Fsvg%3E");
8238}
8239.ios .chip.color-red {
8240 background: #ff3b30;
8241 color: #fff;
8242}
8243.ios .chip.color-red.chip-outline {
8244 background: none;
8245 border-color: #ff3b30;
8246 color: #ff3b30;
8247}
8248.ios .chip.color-green {
8249 background: #4cd964;
8250 color: #fff;
8251}
8252.ios .chip.color-green.chip-outline {
8253 background: none;
8254 border-color: #4cd964;
8255 color: #4cd964;
8256}
8257.ios .chip.color-blue {
8258 background: #007aff;
8259 color: #fff;
8260}
8261.ios .chip.color-blue.chip-outline {
8262 background: none;
8263 border-color: #007aff;
8264 color: #007aff;
8265}
8266.ios .chip.color-pink {
8267 background: #ff2d55;
8268 color: #fff;
8269}
8270.ios .chip.color-pink.chip-outline {
8271 background: none;
8272 border-color: #ff2d55;
8273 color: #ff2d55;
8274}
8275.ios .chip.color-yellow {
8276 background: #ffcc00;
8277 color: #fff;
8278}
8279.ios .chip.color-yellow.chip-outline {
8280 background: none;
8281 border-color: #ffcc00;
8282 color: #ffcc00;
8283}
8284.ios .chip.color-orange {
8285 background: #ff9500;
8286 color: #fff;
8287}
8288.ios .chip.color-orange.chip-outline {
8289 background: none;
8290 border-color: #ff9500;
8291 color: #ff9500;
8292}
8293.ios .chip.color-gray {
8294 background: #8e8e93;
8295 color: #fff;
8296}
8297.ios .chip.color-gray.chip-outline {
8298 background: none;
8299 border-color: #8e8e93;
8300 color: #8e8e93;
8301}
8302.ios .chip.color-white {
8303 background: #ffffff;
8304 color: #fff;
8305}
8306.ios .chip.color-white.chip-outline {
8307 background: none;
8308 border-color: #ffffff;
8309 color: #ffffff;
8310}
8311.ios .chip.color-black {
8312 background: #000000;
8313 color: #fff;
8314}
8315.ios .chip.color-black.chip-outline {
8316 background: none;
8317 border-color: #000000;
8318 color: #000000;
8319}
8320/* === Input === */
8321input[type="text"],
8322input[type="password"],
8323input[type="search"],
8324input[type="email"],
8325input[type="tel"],
8326input[type="url"],
8327input[type="date"],
8328input[type="datetime-local"],
8329input[type="time"],
8330input[type="number"],
8331select,
8332textarea {
8333 -webkit-box-sizing: border-box;
8334 box-sizing: border-box;
8335 -webkit-appearance: none;
8336 -moz-appearance: none;
8337 appearance: none;
8338 border: none;
8339 -webkit-box-shadow: none;
8340 box-shadow: none;
8341 border-radius: 0;
8342 outline: 0;
8343 display: block;
8344 padding: 0;
8345 margin: 0;
8346 font-family: inherit;
8347 background: none;
8348 resize: none;
8349 font-size: inherit;
8350 color: inherit;
8351}
8352.textarea-resizable-shadow {
8353 opacity: 0;
8354 position: absolute;
8355 z-index: -1000;
8356 pointer-events: none;
8357 left: -1000px;
8358 top: -1000px;
8359 visibility: hidden;
8360}
8361.list input[type="text"],
8362.list input[type="password"],
8363.list input[type="search"],
8364.list input[type="email"],
8365.list input[type="tel"],
8366.list input[type="url"],
8367.list input[type="date"],
8368.list input[type="datetime-local"],
8369.list input[type="time"],
8370.list input[type="number"],
8371.list select,
8372.list textarea {
8373 width: 100%;
8374}
8375.list input[type="datetime-local"] {
8376 max-width: 50vw;
8377}
8378.list input[type="date"],
8379.list input[type="datetime-local"] {
8380 line-height: 44px;
8381}
8382.list textarea {
8383 resize: none;
8384 line-height: 1.4;
8385 height: 100px;
8386}
8387.list .item-label,
8388.list .item-floating-label {
8389 vertical-align: top;
8390 -webkit-flex-shrink: 0;
8391 -ms-flex-negative: 0;
8392 flex-shrink: 0;
8393}
8394.list .item-input-wrap {
8395 width: 100%;
8396 -webkit-flex-shrink: 1;
8397 -ms-flex-negative: 1;
8398 flex-shrink: 1;
8399 position: relative;
8400}
8401.input {
8402 position: relative;
8403}
8404.input input,
8405.input select,
8406.input textarea {
8407 width: 100%;
8408}
8409.input-clear-button {
8410 opacity: 0;
8411 pointer-events: none;
8412 visibility: hidden;
8413 -webkit-transition-duration: 100ms;
8414 transition-duration: 100ms;
8415 position: absolute;
8416 top: 50%;
8417 border-radius: 50%;
8418 border: none;
8419 padding: 0;
8420 margin: 0;
8421 outline: 0;
8422 z-index: 1;
8423 cursor: pointer;
8424 background: none;
8425 right: 0;
8426}
8427.input-clear-button:after {
8428 content: '';
8429 position: absolute;
8430 width: 100%;
8431 height: 100%;
8432 left: 0;
8433 top: 0;
8434 background-repeat: no-repeat;
8435 background-position: center center;
8436}
8437.input-clear-button:before {
8438 position: absolute;
8439 content: '';
8440 left: 50%;
8441 top: 50%;
8442}
8443.input-with-value ~ .input-clear-button,
8444.item-input-with-value .input-clear-button,
8445.input-with-value .input-clear-button {
8446 opacity: 1;
8447 pointer-events: auto;
8448 visibility: visible;
8449}
8450.input-dropdown-wrap,
8451.input-dropdown {
8452 position: relative;
8453}
8454.input-dropdown-wrap:before,
8455.input-dropdown:before {
8456 content: '';
8457 pointer-events: none;
8458 position: absolute;
8459 top: 50%;
8460 margin-top: -2px;
8461 width: 0;
8462 height: 0;
8463 border-left: 5px solid transparent;
8464 border-right: 5px solid transparent;
8465 border-top: 5px solid #727272;
8466 right: 2px;
8467}
8468.input-dropdown-wrap select,
8469.input-dropdown select,
8470.input-dropdown-wrap input,
8471.input-dropdown input,
8472.input-dropdown-wrap textarea,
8473.input-dropdown textarea {
8474 padding-right: 14px;
8475}
8476.ios .list input[type="text"],
8477.ios .list input[type="password"],
8478.ios .list input[type="search"],
8479.ios .list input[type="email"],
8480.ios .list input[type="tel"],
8481.ios .list input[type="url"],
8482.ios .list input[type="date"],
8483.ios .list input[type="datetime-local"],
8484.ios .list input[type="time"],
8485.ios .list input[type="number"],
8486.ios .list select {
8487 height: 44px;
8488 color: #000;
8489 font-size: 17px;
8490}
8491.ios .list textarea {
8492 color: #000;
8493 font-size: 17px;
8494 padding-top: 11px;
8495 padding-bottom: 11px;
8496}
8497.ios .list textarea.resizable {
8498 height: 44px;
8499}
8500.ios .item-label,
8501.ios .item-floating-label {
8502 font-size: 12px;
8503 width: 100%;
8504 line-height: 1;
8505 overflow: visible;
8506}
8507.ios .item-label + .item-input-wrap,
8508.ios .item-floating-label + .item-input-wrap {
8509 margin-top: 0;
8510}
8511.ios .item-input .item-inner {
8512 display: block;
8513}
8514.ios .item-input .item-media {
8515 -webkit-align-self: flex-start;
8516 -ms-flex-item-align: start;
8517 align-self: flex-start;
8518}
8519.ios .item-input-wrap {
8520 margin-top: -8px;
8521 margin-bottom: -8px;
8522}
8523.ios .inline-labels .item-inner,
8524.ios .inline-label .item-inner {
8525 display: -webkit-box;
8526 display: -webkit-flex;
8527 display: -ms-flexbox;
8528 display: flex;
8529}
8530.ios .inline-labels .item-label,
8531.ios .inline-label .item-label,
8532.ios .inline-labels .item-floating-label,
8533.ios .inline-label .item-floating-label {
8534 font-size: 17px;
8535 width: 35%;
8536 line-height: 1.4;
8537 -webkit-align-self: flex-start;
8538 -ms-flex-item-align: start;
8539 align-self: flex-start;
8540 padding-top: 3px;
8541}
8542.ios .inline-labels .item-label + .item-input-wrap,
8543.ios .inline-label .item-label + .item-input-wrap,
8544.ios .inline-labels .item-floating-label + .item-input-wrap,
8545.ios .inline-label .item-floating-label + .item-input-wrap {
8546 margin-top: -8px;
8547 margin-left: 5px;
8548}
8549.ios .inline-labels .item-input-wrap,
8550.ios .inline-label .item-input-wrap {
8551 margin-top: -8px;
8552}
8553.ios .item-input-with-error-message .item-input-wrap input,
8554.ios div.input-with-error-message input,
8555.ios span.input-with-error-message input,
8556.ios .item-input-with-error-message .item-input-wrap select,
8557.ios div.input-with-error-message select,
8558.ios span.input-with-error-message select,
8559.ios .item-input-with-error-message .item-input-wrap textarea,
8560.ios div.input-with-error-message textarea,
8561.ios span.input-with-error-message textarea {
8562 color: #ff3b30;
8563}
8564.ios .item-input-error-message,
8565.ios .item-input-info,
8566.ios .input-error-message,
8567.ios .input-info {
8568 font-size: 12px;
8569 line-height: 1.4;
8570 position: relative;
8571 margin-bottom: 6px;
8572 margin-top: -8px;
8573}
8574.ios .item-input-info,
8575.ios .input-info {
8576 color: #8e8e93;
8577}
8578.ios .item-input-error-message,
8579.ios .input-error-message {
8580 color: #ff3b30;
8581 display: none;
8582}
8583.ios .item-input-invalid .item-input-error-message {
8584 display: block;
8585}
8586.ios .item-input-invalid .item-input-info {
8587 display: none;
8588}
8589.ios .input-invalid .input-error-message {
8590 display: block;
8591}
8592.ios .input-invalid .input-info {
8593 display: none;
8594}
8595.ios .input-clear-button {
8596 width: 14px;
8597 height: 14px;
8598 margin-top: -7px;
8599}
8600.ios .input-clear-button:after {
8601 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%2028%2028'%3E%3Ccircle%20cx%3D'14'%20cy%3D'14'%20r%3D'14'%20fill%3D'%238e8e93'%2F%3E%3Cline%20stroke%3D'%23ffffff'%20stroke-width%3D'3'%20stroke-miterlimit%3D'10'%20x1%3D'8'%20y1%3D'8'%20x2%3D'20'%20y2%3D'20'%2F%3E%3Cline%20fill%3D'none'%20stroke%3D'%23ffffff'%20stroke-width%3D'3'%20stroke-miterlimit%3D'10'%20x1%3D'20'%20y1%3D'8'%20x2%3D'8'%20y2%3D'20'%2F%3E%3C%2Fsvg%3E");
8602 background-size: 14px 14px;
8603}
8604.ios .input-clear-button:before {
8605 width: 44px;
8606 height: 44px;
8607 margin-left: -22px;
8608 margin-top: -22px;
8609}
8610.ios .item-input-wrap .input-clear-button {
8611 top: 22px;
8612}
8613.ios .theme-dark .list input[type="text"],
8614.list.ios .theme-dark input[type="text"],
8615.ios .theme-dark .list input[type="password"],
8616.list.ios .theme-dark input[type="password"],
8617.ios .theme-dark .list input[type="search"],
8618.list.ios .theme-dark input[type="search"],
8619.ios .theme-dark .list input[type="email"],
8620.list.ios .theme-dark input[type="email"],
8621.ios .theme-dark .list input[type="tel"],
8622.list.ios .theme-dark input[type="tel"],
8623.ios .theme-dark .list input[type="url"],
8624.list.ios .theme-dark input[type="url"],
8625.ios .theme-dark .list input[type="date"],
8626.list.ios .theme-dark input[type="date"],
8627.ios .theme-dark .list input[type="datetime-local"],
8628.list.ios .theme-dark input[type="datetime-local"],
8629.ios .theme-dark .list input[type="time"],
8630.list.ios .theme-dark input[type="time"],
8631.ios .theme-dark .list input[type="number"],
8632.list.ios .theme-dark input[type="number"],
8633.ios .theme-dark .list select,
8634.list.ios .theme-dark select {
8635 color: #fff;
8636}
8637.ios .theme-dark .list textarea,
8638.list.ios .theme-dark textarea {
8639 color: #fff;
8640}
8641/* === Checkbox === */
8642.icon-checkbox,
8643.checkbox i {
8644 -webkit-flex-shrink: 0;
8645 -ms-flex-negative: 0;
8646 flex-shrink: 0;
8647}
8648.checkbox {
8649 position: relative;
8650 display: inline-block;
8651 vertical-align: middle;
8652 z-index: 1;
8653}
8654label.item-checkbox,
8655.checkbox {
8656 cursor: pointer;
8657}
8658label.item-checkbox input[type="checkbox"],
8659.checkbox input[type="checkbox"],
8660label.item-checkbox input[type="radio"],
8661.checkbox input[type="radio"] {
8662 display: none;
8663}
8664label.item-checkbox .icon-checkbox,
8665.checkbox .icon-checkbox {
8666 -webkit-box-sizing: border-box;
8667 box-sizing: border-box;
8668 position: relative;
8669 display: block;
8670}
8671label.item-checkbox .icon-checkbox:after,
8672.checkbox .icon-checkbox:after {
8673 content: '';
8674 position: absolute;
8675}
8676label.item-checkbox {
8677 -webkit-transition-duration: 300ms;
8678 transition-duration: 300ms;
8679}
8680label.item-checkbox.active-state:after {
8681 background-color: transparent;
8682}
8683label.item-checkbox.disabled,
8684.disabled label.item-checkbox {
8685 opacity: 0.55;
8686 pointer-events: none;
8687 opacity: 0.55 !important;
8688 pointer-events: none !important;
8689}
8690.ios .icon-checkbox,
8691.ios .checkbox i {
8692 width: 22px;
8693 height: 22px;
8694 border-radius: 50%;
8695 border: 1px solid #c7c7cc;
8696}
8697.ios .icon-checkbox:after,
8698.ios .checkbox i:after {
8699 left: 50%;
8700 top: 50%;
8701 margin-left: -6px;
8702 margin-top: -4px;
8703 width: 12px;
8704 height: 9px;
8705}
8706.ios label.item-checkbox input[type="checkbox"]:checked ~ .icon-checkbox,
8707.ios .checkbox input[type="checkbox"]:checked ~ i {
8708 border: none;
8709 background: #007aff;
8710}
8711.ios label.item-checkbox input[type="checkbox"]:checked ~ .icon-checkbox:after,
8712.ios .checkbox input[type="checkbox"]:checked ~ i:after {
8713 background: no-repeat center;
8714 background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20x%3D'0px'%20y%3D'0px'%20viewBox%3D'0%200%2012%209'%20xml%3Aspace%3D'preserve'%3E%3Cpolygon%20fill%3D'%23ffffff'%20points%3D'12%2C0.7%2011.3%2C0%203.9%2C7.4%200.7%2C4.2%200%2C4.9%203.9%2C8.8%203.9%2C8.8%203.9%2C8.8%20'%2F%3E%3C%2Fsvg%3E");
8715 background-size: 12px 9px;
8716}
8717.ios label.item-checkbox > .icon-checkbox {
8718 margin-right: 15px;
8719}
8720.ios label.item-checkbox .item-content .item-media,
8721.ios label.item-checkbox.item-content .item-media {
8722 -webkit-align-self: center;
8723 -ms-flex-item-align: center;
8724 align-self: center;
8725}
8726.ios label.item-checkbox.active-state {
8727 -webkit-transition-duration: 0ms;
8728 transition-duration: 0ms;
8729 background-color: #d9d9d9;
8730}
8731.ios .theme-dark label.item-checkbox.active-state {
8732 background-color: #363636;
8733}
8734.ios .color-theme-red label.item-checkbox input[type="checkbox"]:checked ~ .icon-checkbox,
8735.ios .color-theme-red .checkbox input[type="checkbox"]:checked ~ i {
8736 background: #ff3b30;
8737}
8738.ios .color-theme-green label.item-checkbox input[type="checkbox"]:checked ~ .icon-checkbox,
8739.ios .color-theme-green .checkbox input[type="checkbox"]:checked ~ i {
8740 background: #4cd964;
8741}
8742.ios .color-theme-blue label.item-checkbox input[type="checkbox"]:checked ~ .icon-checkbox,
8743.ios .color-theme-blue .checkbox input[type="checkbox"]:checked ~ i {
8744 background: #007aff;
8745}
8746.ios .color-theme-pink label.item-checkbox input[type="checkbox"]:checked ~ .icon-checkbox,
8747.ios .color-theme-pink .checkbox input[type="checkbox"]:checked ~ i {
8748 background: #ff2d55;
8749}
8750.ios .color-theme-yellow label.item-checkbox input[type="checkbox"]:checked ~ .icon-checkbox,
8751.ios .color-theme-yellow .checkbox input[type="checkbox"]:checked ~ i {
8752 background: #ffcc00;
8753}
8754.ios .color-theme-orange label.item-checkbox input[type="checkbox"]:checked ~ .icon-checkbox,
8755.ios .color-theme-orange .checkbox input[type="checkbox"]:checked ~ i {
8756 background: #ff9500;
8757}
8758.ios .color-theme-gray label.item-checkbox input[type="checkbox"]:checked ~ .icon-checkbox,
8759.ios .color-theme-gray .checkbox input[type="checkbox"]:checked ~ i {
8760 background: #8e8e93;
8761}
8762.ios .color-theme-white label.item-checkbox input[type="checkbox"]:checked ~ .icon-checkbox,
8763.ios .color-theme-white .checkbox input[type="checkbox"]:checked ~ i {
8764 background: #ffffff;
8765}
8766.ios .color-theme-black label.item-checkbox input[type="checkbox"]:checked ~ .icon-checkbox,
8767.ios .color-theme-black .checkbox input[type="checkbox"]:checked ~ i {
8768 background: #000000;
8769}
8770.ios label.item-checkbox.color-red input[type="checkbox"]:checked ~ .icon-checkbox,
8771.ios .checkbox.color-red input[type="checkbox"]:checked ~ i {
8772 background: #ff3b30;
8773}
8774.ios label.item-checkbox.color-green input[type="checkbox"]:checked ~ .icon-checkbox,
8775.ios .checkbox.color-green input[type="checkbox"]:checked ~ i {
8776 background: #4cd964;
8777}
8778.ios label.item-checkbox.color-blue input[type="checkbox"]:checked ~ .icon-checkbox,
8779.ios .checkbox.color-blue input[type="checkbox"]:checked ~ i {
8780 background: #007aff;
8781}
8782.ios label.item-checkbox.color-pink input[type="checkbox"]:checked ~ .icon-checkbox,
8783.ios .checkbox.color-pink input[type="checkbox"]:checked ~ i {
8784 background: #ff2d55;
8785}
8786.ios label.item-checkbox.color-yellow input[type="checkbox"]:checked ~ .icon-checkbox,
8787.ios .checkbox.color-yellow input[type="checkbox"]:checked ~ i {
8788 background: #ffcc00;
8789}
8790.ios label.item-checkbox.color-orange input[type="checkbox"]:checked ~ .icon-checkbox,
8791.ios .checkbox.color-orange input[type="checkbox"]:checked ~ i {
8792 background: #ff9500;
8793}
8794.ios label.item-checkbox.color-gray input[type="checkbox"]:checked ~ .icon-checkbox,
8795.ios .checkbox.color-gray input[type="checkbox"]:checked ~ i {
8796 background: #8e8e93;
8797}
8798.ios label.item-checkbox.color-white input[type="checkbox"]:checked ~ .icon-checkbox,
8799.ios .checkbox.color-white input[type="checkbox"]:checked ~ i {
8800 background: #ffffff;
8801}
8802.ios label.item-checkbox.color-black input[type="checkbox"]:checked ~ .icon-checkbox,
8803.ios .checkbox.color-black input[type="checkbox"]:checked ~ i {
8804 background: #000000;
8805}
8806/* === Radio === */
8807.icon-radio {
8808 -webkit-flex-shrink: 0;
8809 -ms-flex-negative: 0;
8810 flex-shrink: 0;
8811}
8812.radio {
8813 position: relative;
8814 display: inline-block;
8815 vertical-align: middle;
8816 z-index: 1;
8817}
8818label.item-radio,
8819.radio {
8820 cursor: pointer;
8821}
8822label.item-radio input[type="checkbox"],
8823.radio input[type="checkbox"],
8824label.item-radio input[type="radio"],
8825.radio input[type="radio"] {
8826 display: none;
8827}
8828label.item-radio .icon-radio,
8829.radio .icon-radio {
8830 -webkit-box-sizing: border-box;
8831 box-sizing: border-box;
8832 position: relative;
8833 display: block;
8834}
8835label.item-radio .icon-radio:after,
8836.radio .icon-radio:after {
8837 content: '';
8838 position: absolute;
8839}
8840label.item-radio {
8841 -webkit-transition-duration: 300ms;
8842 transition-duration: 300ms;
8843}
8844label.item-radio.active-state:after {
8845 background-color: transparent;
8846}
8847label.item-radio.disabled,
8848.disabled label.item-radio {
8849 opacity: 0.55;
8850 pointer-events: none;
8851 opacity: 0.55 !important;
8852 pointer-events: none !important;
8853}
8854.ios .icon-radio {
8855 width: 22px;
8856 height: 22px;
8857 position: relative;
8858 -webkit-box-sizing: border-box;
8859 box-sizing: border-box;
8860 display: block;
8861}
8862.ios .radio .icon-radio {
8863 border-radius: 50%;
8864 border: 1px solid #c7c7cc;
8865}
8866.ios label.item-radio input[type="radio"] ~ .icon-radio {
8867 position: absolute;
8868 top: 50%;
8869 margin-top: -11px;
8870 right: 10px;
8871}
8872.ios label.item-radio .item-inner {
8873 padding-right: 35px;
8874}
8875.ios label.item-radio input[type="radio"]:checked ~ .icon-radio,
8876.ios label.item-radio input[type="radio"]:checked ~ * .icon-radio,
8877.ios .radio input[type="radio"]:checked ~ .icon-radio {
8878 background: no-repeat center;
8879 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%2013%2010'%3E%3Cpolygon%20fill%3D'%23007aff'%20points%3D'11.6%2C0%204.4%2C7.2%201.4%2C4.2%200%2C5.6%204.4%2C10%204.4%2C10%204.4%2C10%2013%2C1.4%20'%2F%3E%3C%2Fsvg%3E");
8880 background-size: 13px 10px;
8881}
8882.ios .radio input[type="radio"]:checked ~ .icon-radio {
8883 border-color: #007aff;
8884}
8885.ios label.item-radio .item-content .item-media,
8886.ios label.item-radio.item-content .item-media {
8887 -webkit-align-self: center;
8888 -ms-flex-item-align: center;
8889 align-self: center;
8890}
8891.ios label.item-radio.active-state {
8892 -webkit-transition-duration: 0ms;
8893 transition-duration: 0ms;
8894 background-color: #d9d9d9;
8895}
8896@media (orientation: landscape) {
8897 .ios.device-iphone-x .ios-right-edge label.item-radio input[type="radio"] ~ .icon-radio,
8898 .ios.device-iphone-x .ios-edges label.item-radio input[type="radio"] ~ .icon-radio,
8899 .ios.device-iphone-x .popup label.item-radio input[type="radio"] ~ .icon-radio,
8900 .ios.device-iphone-x .sheet-modal label.item-radio input[type="radio"] ~ .icon-radio,
8901 .ios.device-iphone-x .panel-right label.item-radio input[type="radio"] ~ .icon-radio {
8902 right: calc(10px + constant(safe-area-inset-right));
8903 right: calc(10px + env(safe-area-inset-right));
8904 }
8905 .ios.device-iphone-x .ios-right-edge .list:not(.inset):not(.tablet-inset) label.item-radio .item-inner,
8906 .ios.device-iphone-x .ios-edges .list:not(.inset):not(.tablet-inset) label.item-radio .item-inner,
8907 .ios.device-iphone-x .popup .list:not(.inset):not(.tablet-inset) label.item-radio .item-inner,
8908 .ios.device-iphone-x .sheet-modal .list:not(.inset):not(.tablet-inset) label.item-radio .item-inner,
8909 .ios.device-iphone-x .panel-right .list:not(.inset):not(.tablet-inset) label.item-radio .item-inner {
8910 padding-right: calc(35px + constant(safe-area-inset-right)) !important;
8911 padding-right: calc(35px + env(safe-area-inset-right));
8912 }
8913}
8914.ios .theme-dark label.item-radio.active-state {
8915 background-color: #363636;
8916}
8917.ios .color-theme-red label.item-radio input[type="radio"]:checked ~ .icon-radio,
8918.ios .color-theme-red label.item-radio input[type="radio"]:checked ~ * .icon-radio,
8919.ios .color-theme-red .radio input[type="radio"]:checked ~ .icon-radio {
8920 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%2013%2010'%3E%3Cpolygon%20fill%3D'%23ff3b30'%20points%3D'11.6%2C0%204.4%2C7.2%201.4%2C4.2%200%2C5.6%204.4%2C10%204.4%2C10%204.4%2C10%2013%2C1.4%20'%2F%3E%3C%2Fsvg%3E");
8921}
8922.ios .color-theme-red .radio input[type="radio"]:checked ~ .icon-radio {
8923 border-color: #ff3b30;
8924}
8925.ios .color-theme-green label.item-radio input[type="radio"]:checked ~ .icon-radio,
8926.ios .color-theme-green label.item-radio input[type="radio"]:checked ~ * .icon-radio,
8927.ios .color-theme-green .radio input[type="radio"]:checked ~ .icon-radio {
8928 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%2013%2010'%3E%3Cpolygon%20fill%3D'%234cd964'%20points%3D'11.6%2C0%204.4%2C7.2%201.4%2C4.2%200%2C5.6%204.4%2C10%204.4%2C10%204.4%2C10%2013%2C1.4%20'%2F%3E%3C%2Fsvg%3E");
8929}
8930.ios .color-theme-green .radio input[type="radio"]:checked ~ .icon-radio {
8931 border-color: #4cd964;
8932}
8933.ios .color-theme-blue label.item-radio input[type="radio"]:checked ~ .icon-radio,
8934.ios .color-theme-blue label.item-radio input[type="radio"]:checked ~ * .icon-radio,
8935.ios .color-theme-blue .radio input[type="radio"]:checked ~ .icon-radio {
8936 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%2013%2010'%3E%3Cpolygon%20fill%3D'%23007aff'%20points%3D'11.6%2C0%204.4%2C7.2%201.4%2C4.2%200%2C5.6%204.4%2C10%204.4%2C10%204.4%2C10%2013%2C1.4%20'%2F%3E%3C%2Fsvg%3E");
8937}
8938.ios .color-theme-blue .radio input[type="radio"]:checked ~ .icon-radio {
8939 border-color: #007aff;
8940}
8941.ios .color-theme-pink label.item-radio input[type="radio"]:checked ~ .icon-radio,
8942.ios .color-theme-pink label.item-radio input[type="radio"]:checked ~ * .icon-radio,
8943.ios .color-theme-pink .radio input[type="radio"]:checked ~ .icon-radio {
8944 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%2013%2010'%3E%3Cpolygon%20fill%3D'%23ff2d55'%20points%3D'11.6%2C0%204.4%2C7.2%201.4%2C4.2%200%2C5.6%204.4%2C10%204.4%2C10%204.4%2C10%2013%2C1.4%20'%2F%3E%3C%2Fsvg%3E");
8945}
8946.ios .color-theme-pink .radio input[type="radio"]:checked ~ .icon-radio {
8947 border-color: #ff2d55;
8948}
8949.ios .color-theme-yellow label.item-radio input[type="radio"]:checked ~ .icon-radio,
8950.ios .color-theme-yellow label.item-radio input[type="radio"]:checked ~ * .icon-radio,
8951.ios .color-theme-yellow .radio input[type="radio"]:checked ~ .icon-radio {
8952 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%2013%2010'%3E%3Cpolygon%20fill%3D'%23ffcc00'%20points%3D'11.6%2C0%204.4%2C7.2%201.4%2C4.2%200%2C5.6%204.4%2C10%204.4%2C10%204.4%2C10%2013%2C1.4%20'%2F%3E%3C%2Fsvg%3E");
8953}
8954.ios .color-theme-yellow .radio input[type="radio"]:checked ~ .icon-radio {
8955 border-color: #ffcc00;
8956}
8957.ios .color-theme-orange label.item-radio input[type="radio"]:checked ~ .icon-radio,
8958.ios .color-theme-orange label.item-radio input[type="radio"]:checked ~ * .icon-radio,
8959.ios .color-theme-orange .radio input[type="radio"]:checked ~ .icon-radio {
8960 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%2013%2010'%3E%3Cpolygon%20fill%3D'%23ff9500'%20points%3D'11.6%2C0%204.4%2C7.2%201.4%2C4.2%200%2C5.6%204.4%2C10%204.4%2C10%204.4%2C10%2013%2C1.4%20'%2F%3E%3C%2Fsvg%3E");
8961}
8962.ios .color-theme-orange .radio input[type="radio"]:checked ~ .icon-radio {
8963 border-color: #ff9500;
8964}
8965.ios .color-theme-gray label.item-radio input[type="radio"]:checked ~ .icon-radio,
8966.ios .color-theme-gray label.item-radio input[type="radio"]:checked ~ * .icon-radio,
8967.ios .color-theme-gray .radio input[type="radio"]:checked ~ .icon-radio {
8968 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%2013%2010'%3E%3Cpolygon%20fill%3D'%238e8e93'%20points%3D'11.6%2C0%204.4%2C7.2%201.4%2C4.2%200%2C5.6%204.4%2C10%204.4%2C10%204.4%2C10%2013%2C1.4%20'%2F%3E%3C%2Fsvg%3E");
8969}
8970.ios .color-theme-gray .radio input[type="radio"]:checked ~ .icon-radio {
8971 border-color: #8e8e93;
8972}
8973.ios .color-theme-white label.item-radio input[type="radio"]:checked ~ .icon-radio,
8974.ios .color-theme-white label.item-radio input[type="radio"]:checked ~ * .icon-radio,
8975.ios .color-theme-white .radio input[type="radio"]:checked ~ .icon-radio {
8976 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%2013%2010'%3E%3Cpolygon%20fill%3D'%23ffffff'%20points%3D'11.6%2C0%204.4%2C7.2%201.4%2C4.2%200%2C5.6%204.4%2C10%204.4%2C10%204.4%2C10%2013%2C1.4%20'%2F%3E%3C%2Fsvg%3E");
8977}
8978.ios .color-theme-white .radio input[type="radio"]:checked ~ .icon-radio {
8979 border-color: #ffffff;
8980}
8981.ios .color-theme-black label.item-radio input[type="radio"]:checked ~ .icon-radio,
8982.ios .color-theme-black label.item-radio input[type="radio"]:checked ~ * .icon-radio,
8983.ios .color-theme-black .radio input[type="radio"]:checked ~ .icon-radio {
8984 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%2013%2010'%3E%3Cpolygon%20fill%3D'%23000000'%20points%3D'11.6%2C0%204.4%2C7.2%201.4%2C4.2%200%2C5.6%204.4%2C10%204.4%2C10%204.4%2C10%2013%2C1.4%20'%2F%3E%3C%2Fsvg%3E");
8985}
8986.ios .color-theme-black .radio input[type="radio"]:checked ~ .icon-radio {
8987 border-color: #000000;
8988}
8989.ios label.item-radio.color-red input[type="radio"]:checked ~ .icon-radio,
8990.ios label.item-radio.color-red input[type="radio"]:checked ~ * .icon-radio,
8991.ios .radio.color-red input[type="radio"]:checked ~ .icon-radio {
8992 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%2013%2010'%3E%3Cpolygon%20fill%3D'%23ff3b30'%20points%3D'11.6%2C0%204.4%2C7.2%201.4%2C4.2%200%2C5.6%204.4%2C10%204.4%2C10%204.4%2C10%2013%2C1.4%20'%2F%3E%3C%2Fsvg%3E");
8993}
8994.ios .radio.color-red input[type="radio"]:checked ~ .icon-radio {
8995 border-color: #ff3b30;
8996}
8997.ios label.item-radio.color-green input[type="radio"]:checked ~ .icon-radio,
8998.ios label.item-radio.color-green input[type="radio"]:checked ~ * .icon-radio,
8999.ios .radio.color-green input[type="radio"]:checked ~ .icon-radio {
9000 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%2013%2010'%3E%3Cpolygon%20fill%3D'%234cd964'%20points%3D'11.6%2C0%204.4%2C7.2%201.4%2C4.2%200%2C5.6%204.4%2C10%204.4%2C10%204.4%2C10%2013%2C1.4%20'%2F%3E%3C%2Fsvg%3E");
9001}
9002.ios .radio.color-green input[type="radio"]:checked ~ .icon-radio {
9003 border-color: #4cd964;
9004}
9005.ios label.item-radio.color-blue input[type="radio"]:checked ~ .icon-radio,
9006.ios label.item-radio.color-blue input[type="radio"]:checked ~ * .icon-radio,
9007.ios .radio.color-blue input[type="radio"]:checked ~ .icon-radio {
9008 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%2013%2010'%3E%3Cpolygon%20fill%3D'%23007aff'%20points%3D'11.6%2C0%204.4%2C7.2%201.4%2C4.2%200%2C5.6%204.4%2C10%204.4%2C10%204.4%2C10%2013%2C1.4%20'%2F%3E%3C%2Fsvg%3E");
9009}
9010.ios .radio.color-blue input[type="radio"]:checked ~ .icon-radio {
9011 border-color: #007aff;
9012}
9013.ios label.item-radio.color-pink input[type="radio"]:checked ~ .icon-radio,
9014.ios label.item-radio.color-pink input[type="radio"]:checked ~ * .icon-radio,
9015.ios .radio.color-pink input[type="radio"]:checked ~ .icon-radio {
9016 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%2013%2010'%3E%3Cpolygon%20fill%3D'%23ff2d55'%20points%3D'11.6%2C0%204.4%2C7.2%201.4%2C4.2%200%2C5.6%204.4%2C10%204.4%2C10%204.4%2C10%2013%2C1.4%20'%2F%3E%3C%2Fsvg%3E");
9017}
9018.ios .radio.color-pink input[type="radio"]:checked ~ .icon-radio {
9019 border-color: #ff2d55;
9020}
9021.ios label.item-radio.color-yellow input[type="radio"]:checked ~ .icon-radio,
9022.ios label.item-radio.color-yellow input[type="radio"]:checked ~ * .icon-radio,
9023.ios .radio.color-yellow input[type="radio"]:checked ~ .icon-radio {
9024 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%2013%2010'%3E%3Cpolygon%20fill%3D'%23ffcc00'%20points%3D'11.6%2C0%204.4%2C7.2%201.4%2C4.2%200%2C5.6%204.4%2C10%204.4%2C10%204.4%2C10%2013%2C1.4%20'%2F%3E%3C%2Fsvg%3E");
9025}
9026.ios .radio.color-yellow input[type="radio"]:checked ~ .icon-radio {
9027 border-color: #ffcc00;
9028}
9029.ios label.item-radio.color-orange input[type="radio"]:checked ~ .icon-radio,
9030.ios label.item-radio.color-orange input[type="radio"]:checked ~ * .icon-radio,
9031.ios .radio.color-orange input[type="radio"]:checked ~ .icon-radio {
9032 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%2013%2010'%3E%3Cpolygon%20fill%3D'%23ff9500'%20points%3D'11.6%2C0%204.4%2C7.2%201.4%2C4.2%200%2C5.6%204.4%2C10%204.4%2C10%204.4%2C10%2013%2C1.4%20'%2F%3E%3C%2Fsvg%3E");
9033}
9034.ios .radio.color-orange input[type="radio"]:checked ~ .icon-radio {
9035 border-color: #ff9500;
9036}
9037.ios label.item-radio.color-gray input[type="radio"]:checked ~ .icon-radio,
9038.ios label.item-radio.color-gray input[type="radio"]:checked ~ * .icon-radio,
9039.ios .radio.color-gray input[type="radio"]:checked ~ .icon-radio {
9040 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%2013%2010'%3E%3Cpolygon%20fill%3D'%238e8e93'%20points%3D'11.6%2C0%204.4%2C7.2%201.4%2C4.2%200%2C5.6%204.4%2C10%204.4%2C10%204.4%2C10%2013%2C1.4%20'%2F%3E%3C%2Fsvg%3E");
9041}
9042.ios .radio.color-gray input[type="radio"]:checked ~ .icon-radio {
9043 border-color: #8e8e93;
9044}
9045.ios label.item-radio.color-white input[type="radio"]:checked ~ .icon-radio,
9046.ios label.item-radio.color-white input[type="radio"]:checked ~ * .icon-radio,
9047.ios .radio.color-white input[type="radio"]:checked ~ .icon-radio {
9048 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%2013%2010'%3E%3Cpolygon%20fill%3D'%23ffffff'%20points%3D'11.6%2C0%204.4%2C7.2%201.4%2C4.2%200%2C5.6%204.4%2C10%204.4%2C10%204.4%2C10%2013%2C1.4%20'%2F%3E%3C%2Fsvg%3E");
9049}
9050.ios .radio.color-white input[type="radio"]:checked ~ .icon-radio {
9051 border-color: #ffffff;
9052}
9053.ios label.item-radio.color-black input[type="radio"]:checked ~ .icon-radio,
9054.ios label.item-radio.color-black input[type="radio"]:checked ~ * .icon-radio,
9055.ios .radio.color-black input[type="radio"]:checked ~ .icon-radio {
9056 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%2013%2010'%3E%3Cpolygon%20fill%3D'%23000000'%20points%3D'11.6%2C0%204.4%2C7.2%201.4%2C4.2%200%2C5.6%204.4%2C10%204.4%2C10%204.4%2C10%2013%2C1.4%20'%2F%3E%3C%2Fsvg%3E");
9057}
9058.ios .radio.color-black input[type="radio"]:checked ~ .icon-radio {
9059 border-color: #000000;
9060}
9061/* === Toggle === */
9062.toggle {
9063 display: inline-block;
9064 vertical-align: middle;
9065 position: relative;
9066 -webkit-box-sizing: border-box;
9067 box-sizing: border-box;
9068 -webkit-align-self: center;
9069 -ms-flex-item-align: center;
9070 align-self: center;
9071 -webkit-user-select: none;
9072 -moz-user-select: none;
9073 -ms-user-select: none;
9074 user-select: none;
9075}
9076.toggle input[type="checkbox"] {
9077 display: none;
9078}
9079.toggle input[disabled] ~ .toggle-icon {
9080 pointer-events: none;
9081}
9082.toggle-icon {
9083 z-index: 0;
9084 margin: 0;
9085 padding: 0;
9086 -webkit-appearance: none;
9087 -moz-appearance: none;
9088 appearance: none;
9089 border: none;
9090 position: relative;
9091 -webkit-transition: 300ms;
9092 transition: 300ms;
9093 -webkit-box-sizing: border-box;
9094 box-sizing: border-box;
9095 display: block;
9096 cursor: pointer;
9097}
9098.toggle-icon:before,
9099.toggle-icon:after {
9100 content: '';
9101}
9102.toggle-icon:after {
9103 background: #fff;
9104 position: absolute;
9105 z-index: 2;
9106 -webkit-transform: translateX(0px);
9107 transform: translateX(0px);
9108 -webkit-transition-duration: 300ms;
9109 transition-duration: 300ms;
9110}
9111.ios .toggle {
9112 width: 52px;
9113 border-radius: 16px;
9114 height: 32px;
9115}
9116.ios .toggle input[type="checkbox"]:checked + .toggle-icon {
9117 background: #4cd964;
9118}
9119.ios .toggle input[type="checkbox"]:checked + .toggle-icon:before {
9120 -webkit-transform: scale(0);
9121 transform: scale(0);
9122}
9123.ios .toggle input[type="checkbox"]:checked + .toggle-icon:after {
9124 -webkit-transform: translateX(20px);
9125 transform: translateX(20px);
9126}
9127.ios .toggle-icon {
9128 width: 52px;
9129 border-radius: 16px;
9130 height: 32px;
9131 background: #e5e5e5;
9132}
9133.ios .toggle-icon:before {
9134 position: absolute;
9135 left: 2px;
9136 top: 2px;
9137 width: 48px;
9138 height: 28px;
9139 border-radius: 16px;
9140 -webkit-box-sizing: border-box;
9141 box-sizing: border-box;
9142 background: #fff;
9143 z-index: 1;
9144 -webkit-transition-duration: 300ms;
9145 transition-duration: 300ms;
9146 -webkit-transform: scale(1);
9147 transform: scale(1);
9148}
9149.ios .toggle-icon:after {
9150 height: 28px;
9151 width: 28px;
9152 top: 2px;
9153 left: 2px;
9154 -webkit-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
9155 box-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
9156 border-radius: 14px;
9157}
9158.ios .toggle-active-state input[type="checkbox"]:not(:checked) + .toggle-icon:before {
9159 -webkit-transform: scale(0);
9160 transform: scale(0);
9161}
9162.ios .toggle-active-state input[type="checkbox"] + .toggle-icon:after {
9163 width: 35px;
9164}
9165.ios .toggle-active-state input[type="checkbox"]:checked + .toggle-icon:after {
9166 width: 35px;
9167 -webkit-transform: translateX(13px);
9168 transform: translateX(13px);
9169}
9170.ios .theme-dark .toggle-icon {
9171 background-color: #fff;
9172}
9173.ios .theme-dark .toggle-icon:before {
9174 background-color: #1c1c1d;
9175}
9176.ios .toggle.color-red input[type="checkbox"]:checked + .toggle-icon {
9177 background-color: #ff3b30;
9178}
9179.ios .toggle.color-green input[type="checkbox"]:checked + .toggle-icon {
9180 background-color: #4cd964;
9181}
9182.ios .toggle.color-blue input[type="checkbox"]:checked + .toggle-icon {
9183 background-color: #007aff;
9184}
9185.ios .toggle.color-pink input[type="checkbox"]:checked + .toggle-icon {
9186 background-color: #ff2d55;
9187}
9188.ios .toggle.color-yellow input[type="checkbox"]:checked + .toggle-icon {
9189 background-color: #ffcc00;
9190}
9191.ios .toggle.color-orange input[type="checkbox"]:checked + .toggle-icon {
9192 background-color: #ff9500;
9193}
9194.ios .toggle.color-gray input[type="checkbox"]:checked + .toggle-icon {
9195 background-color: #8e8e93;
9196}
9197.ios .toggle.color-white input[type="checkbox"]:checked + .toggle-icon {
9198 background-color: #ffffff;
9199}
9200.ios .toggle.color-black input[type="checkbox"]:checked + .toggle-icon {
9201 background-color: #000000;
9202}
9203/* === Range Slider === */
9204.range-slider {
9205 display: block;
9206 width: 100%;
9207 position: relative;
9208 -webkit-align-self: center;
9209 -ms-flex-item-align: center;
9210 align-self: center;
9211 cursor: pointer;
9212 -webkit-user-select: none;
9213 -moz-user-select: none;
9214 -ms-user-select: none;
9215 user-select: none;
9216}
9217.range-slider input[type="range"] {
9218 display: none;
9219}
9220.range-bar {
9221 position: absolute;
9222 left: 0;
9223 top: 50%;
9224 width: 100%;
9225 overflow: hidden;
9226}
9227.range-bar-active {
9228 position: absolute;
9229 left: 0;
9230 top: 0;
9231 height: 100%;
9232}
9233.range-knob-wrap {
9234 z-index: 20;
9235 position: absolute;
9236 top: 50%;
9237 left: 0;
9238}
9239.range-knob {
9240 -webkit-box-sizing: border-box;
9241 box-sizing: border-box;
9242 border-radius: 50%;
9243 position: absolute;
9244 left: 0;
9245 top: 0;
9246 width: 100%;
9247 height: 100%;
9248 z-index: 1;
9249}
9250.range-knob:after {
9251 content: '';
9252 position: absolute;
9253 left: 50%;
9254 top: 50%;
9255 width: 44px;
9256 height: 44px;
9257 margin-left: -22px;
9258 margin-top: -22px;
9259}
9260.range-knob-label {
9261 position: absolute;
9262 left: 50%;
9263 bottom: 100%;
9264 text-align: center;
9265 -webkit-transition-duration: 120ms;
9266 transition-duration: 120ms;
9267 -webkit-transition-property: -webkit-transform;
9268 transition-property: -webkit-transform;
9269 transition-property: transform;
9270 transition-property: transform, -webkit-transform;
9271 -webkit-transform: translateY(100%) scale(0);
9272 transform: translateY(100%) scale(0);
9273}
9274.range-knob-active-state .range-knob-label {
9275 -webkit-transform: translateY(0%) scale(1);
9276 transform: translateY(0%) scale(1);
9277}
9278.ios .range-slider {
9279 height: 28px;
9280}
9281.ios .range-bar {
9282 background: #b7b8b7;
9283 border-radius: 2px;
9284 height: 1px;
9285}
9286.ios .range-bar-active {
9287 background: #007aff;
9288}
9289.ios .range-knob-wrap {
9290 height: 28px;
9291 width: 28px;
9292 margin-top: -14px;
9293 margin-left: -14px;
9294}
9295.ios .range-knob {
9296 background: #fff;
9297 -webkit-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
9298 box-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
9299}
9300.ios .range-knob-label {
9301 min-width: 20px;
9302 height: 20px;
9303 line-height: 20px;
9304 background: #fff;
9305 border-radius: 5px;
9306 color: #000;
9307 font-size: 12px;
9308 margin-bottom: 6px;
9309 -webkit-transform: translateX(-50%) translateY(100%) scale(0);
9310 transform: translateX(-50%) translateY(100%) scale(0);
9311}
9312.ios .range-knob-active-state .range-knob-label {
9313 -webkit-transform: translateX(-50%) translateY(0%) scale(1);
9314 transform: translateX(-50%) translateY(0%) scale(1);
9315}
9316.ios .color-theme-red .range-slider .range-bar-active {
9317 background-color: #ff3b30;
9318}
9319.ios .color-theme-green .range-slider .range-bar-active {
9320 background-color: #4cd964;
9321}
9322.ios .color-theme-blue .range-slider .range-bar-active {
9323 background-color: #007aff;
9324}
9325.ios .color-theme-pink .range-slider .range-bar-active {
9326 background-color: #ff2d55;
9327}
9328.ios .color-theme-yellow .range-slider .range-bar-active {
9329 background-color: #ffcc00;
9330}
9331.ios .color-theme-orange .range-slider .range-bar-active {
9332 background-color: #ff9500;
9333}
9334.ios .color-theme-gray .range-slider .range-bar-active {
9335 background-color: #8e8e93;
9336}
9337.ios .color-theme-white .range-slider .range-bar-active {
9338 background-color: #ffffff;
9339}
9340.ios .color-theme-black .range-slider .range-bar-active {
9341 background-color: #000000;
9342}
9343.ios .range-slider.color-red .range-bar-active {
9344 background-color: #ff3b30;
9345}
9346.ios .range-slider.color-green .range-bar-active {
9347 background-color: #4cd964;
9348}
9349.ios .range-slider.color-blue .range-bar-active {
9350 background-color: #007aff;
9351}
9352.ios .range-slider.color-pink .range-bar-active {
9353 background-color: #ff2d55;
9354}
9355.ios .range-slider.color-yellow .range-bar-active {
9356 background-color: #ffcc00;
9357}
9358.ios .range-slider.color-orange .range-bar-active {
9359 background-color: #ff9500;
9360}
9361.ios .range-slider.color-gray .range-bar-active {
9362 background-color: #8e8e93;
9363}
9364.ios .range-slider.color-white .range-bar-active {
9365 background-color: #ffffff;
9366}
9367.ios .range-slider.color-black .range-bar-active {
9368 background-color: #000000;
9369}
9370/* === Stepper === */
9371.stepper {
9372 display: -webkit-inline-box;
9373 display: -webkit-inline-flex;
9374 display: -ms-inline-flexbox;
9375 display: inline-flex;
9376 -webkit-box-align: stretch;
9377 -webkit-align-items: stretch;
9378 -ms-flex-align: stretch;
9379 align-items: stretch;
9380}
9381.stepper-button,
9382.stepper-button-minus,
9383.stepper-button-plus {
9384 text-align: center;
9385 display: -webkit-box;
9386 display: -webkit-flex;
9387 display: -ms-flexbox;
9388 display: flex;
9389 -webkit-box-pack: center;
9390 -webkit-justify-content: center;
9391 -ms-flex-pack: center;
9392 justify-content: center;
9393 -webkit-align-content: center;
9394 -ms-flex-line-pack: center;
9395 align-content: center;
9396 -webkit-box-align: center;
9397 -webkit-align-items: center;
9398 -ms-flex-align: center;
9399 align-items: center;
9400 -webkit-flex-shrink: 0;
9401 -ms-flex-negative: 0;
9402 flex-shrink: 0;
9403 -webkit-box-sizing: border-box;
9404 box-sizing: border-box;
9405 position: relative;
9406 cursor: pointer;
9407}
9408.stepper-button .icon,
9409.stepper-button-minus .icon,
9410.stepper-button-plus .icon {
9411 pointer-events: none;
9412}
9413.stepper-value {
9414 display: -webkit-box;
9415 display: -webkit-flex;
9416 display: -ms-flexbox;
9417 display: flex;
9418 -webkit-align-content: center;
9419 -ms-flex-line-pack: center;
9420 align-content: center;
9421 -webkit-box-align: center;
9422 -webkit-align-items: center;
9423 -ms-flex-align: center;
9424 align-items: center;
9425 -webkit-box-pack: center;
9426 -webkit-justify-content: center;
9427 -ms-flex-pack: center;
9428 justify-content: center;
9429}
9430.stepper-input-wrap,
9431.stepper-value {
9432 -webkit-flex-shrink: 1;
9433 -ms-flex-negative: 1;
9434 flex-shrink: 1;
9435 text-align: center;
9436}
9437.stepper-button-plus,
9438.stepper-button-minus {
9439 -webkit-user-select: none;
9440 -moz-user-select: none;
9441 -ms-user-select: none;
9442 user-select: none;
9443}
9444.stepper-button-plus:after,
9445.stepper-button-minus:after,
9446.stepper-button-plus:before,
9447.stepper-button-minus:before {
9448 content: '';
9449 position: absolute;
9450 left: 50%;
9451 top: 50%;
9452 -webkit-transform: translate(-50%, -50%);
9453 transform: translate(-50%, -50%);
9454}
9455.stepper-button-plus:after,
9456.stepper-button-minus:after {
9457 width: 15px;
9458 height: 2px;
9459}
9460.stepper-button-plus:before {
9461 height: 15px;
9462 width: 2px;
9463}
9464.stepper .stepper-input-wrap input,
9465.stepper .stepper-value {
9466 width: 45px;
9467}
9468.ios .stepper {
9469 height: 29px;
9470}
9471.ios .stepper-button,
9472.ios .stepper-button-minus,
9473.ios .stepper-button-plus {
9474 border: 1px solid #007aff;
9475 color: #007aff;
9476 border-radius: 5px;
9477 line-height: 27px;
9478 height: 29px;
9479 width: 40px;
9480}
9481.ios .stepper-button .f7-icons,
9482.ios .stepper-button-minus .f7-icons,
9483.ios .stepper-button-plus .f7-icons {
9484 font-size: 22px;
9485}
9486.ios .stepper-button:first-child,
9487.ios .stepper-button-minus:first-child,
9488.ios .stepper-button-plus:first-child {
9489 border-radius: 5px 0 0 5px;
9490}
9491.ios .stepper-button:last-child,
9492.ios .stepper-button-minus:last-child,
9493.ios .stepper-button-plus:last-child {
9494 border-radius: 0 5px 5px 0;
9495}
9496.ios .stepper-button.active-state,
9497.ios .stepper-button-minus.active-state,
9498.ios .stepper-button-plus.active-state {
9499 background: rgba(0, 122, 255, 0.15);
9500}
9501.ios .stepper-button + .stepper-button,
9502.ios .stepper-button-minus + .stepper-button,
9503.ios .stepper-button-plus + .stepper-button,
9504.ios .stepper-button + .stepper-button-minus,
9505.ios .stepper-button-minus + .stepper-button-minus,
9506.ios .stepper-button-plus + .stepper-button-minus,
9507.ios .stepper-button + .stepper-button-plus,
9508.ios .stepper-button-minus + .stepper-button-plus,
9509.ios .stepper-button-plus + .stepper-button-plus {
9510 border-left: none;
9511}
9512.ios .stepper-button-plus:after,
9513.ios .stepper-button-minus:after,
9514.ios .stepper-button-plus:before,
9515.ios .stepper-button-minus:before {
9516 background: #007aff;
9517}
9518.ios .stepper-input-wrap,
9519.ios .stepper-value {
9520 border-top: 1px solid #007aff;
9521 border-bottom: 1px solid #007aff;
9522}
9523.ios .stepper .stepper-value {
9524 color: #007aff;
9525 font-size: 17px;
9526}
9527.ios .stepper .stepper-input-wrap input {
9528 height: 100%;
9529 text-align: center;
9530 color: #007aff;
9531 font-size: 17px;
9532}
9533.ios .stepper-fill .stepper-button,
9534.ios .stepper-fill-ios .stepper-button,
9535.ios .stepper-fill .stepper-button-minus,
9536.ios .stepper-fill-ios .stepper-button-minus,
9537.ios .stepper-fill .stepper-button-plus,
9538.ios .stepper-fill-ios .stepper-button-plus {
9539 color: #fff;
9540 background: #007aff;
9541}
9542.ios .stepper-fill .stepper-button.active-state,
9543.ios .stepper-fill-ios .stepper-button.active-state,
9544.ios .stepper-fill .stepper-button-minus.active-state,
9545.ios .stepper-fill-ios .stepper-button-minus.active-state,
9546.ios .stepper-fill .stepper-button-plus.active-state,
9547.ios .stepper-fill-ios .stepper-button-plus.active-state {
9548 opacity: 0.8;
9549}
9550.ios .stepper-fill .stepper-button-plus:before,
9551.ios .stepper-fill-ios .stepper-button-plus:before,
9552.ios .stepper-fill .stepper-button-minus:before,
9553.ios .stepper-fill-ios .stepper-button-minus:before,
9554.ios .stepper-fill .stepper-button-plus:after,
9555.ios .stepper-fill-ios .stepper-button-plus:after,
9556.ios .stepper-fill .stepper-button-minus:after,
9557.ios .stepper-fill-ios .stepper-button-minus:after {
9558 background-color: #fff;
9559}
9560.ios .stepper-fill .stepper-button + .stepper-button,
9561.ios .stepper-fill-ios .stepper-button + .stepper-button,
9562.ios .stepper-fill .stepper-button-minus + .stepper-button-plus,
9563.ios .stepper-fill-ios .stepper-button-minus + .stepper-button-plus {
9564 border-left: 1px solid rgba(0, 0, 0, 0.1);
9565}
9566.ios .stepper-round .stepper-button:first-child,
9567.ios .stepper-round-ios .stepper-button:first-child,
9568.ios .stepper-round .stepper-button-minus:first-child,
9569.ios .stepper-round-ios .stepper-button-minus:first-child,
9570.ios .stepper-round .stepper-button-plus:first-child,
9571.ios .stepper-round-ios .stepper-button-plus:first-child {
9572 border-radius: 29px 0 0 29px;
9573}
9574.ios .stepper-round .stepper-button:last-child,
9575.ios .stepper-round-ios .stepper-button:last-child,
9576.ios .stepper-round .stepper-button-minus:last-child,
9577.ios .stepper-round-ios .stepper-button-minus:last-child,
9578.ios .stepper-round .stepper-button-plus:last-child,
9579.ios .stepper-round-ios .stepper-button-plus:last-child {
9580 border-radius: 0 29px 29px 0;
9581}
9582.ios .stepper-small,
9583.ios .stepper-small-ios {
9584 height: 26px;
9585}
9586.ios .stepper-small .stepper-input-wrap,
9587.ios .stepper-small-ios .stepper-input-wrap,
9588.ios .stepper-small .stepper-value,
9589.ios .stepper-small-ios .stepper-value {
9590 border-top-width: 2px;
9591 border-bottom-width: 2px;
9592}
9593.ios .stepper-small .stepper-button,
9594.ios .stepper-small-ios .stepper-button,
9595.ios .stepper-small .stepper-button-minus,
9596.ios .stepper-small-ios .stepper-button-minus,
9597.ios .stepper-small .stepper-button-plus,
9598.ios .stepper-small-ios .stepper-button-plus {
9599 height: 26px;
9600 -webkit-transition-duration: 200ms;
9601 transition-duration: 200ms;
9602 line-height: 22px;
9603 border-width: 2px;
9604}
9605.ios .stepper-small .stepper-button .f7-icons,
9606.ios .stepper-small-ios .stepper-button .f7-icons,
9607.ios .stepper-small .stepper-button-minus .f7-icons,
9608.ios .stepper-small-ios .stepper-button-minus .f7-icons,
9609.ios .stepper-small .stepper-button-plus .f7-icons,
9610.ios .stepper-small-ios .stepper-button-plus .f7-icons {
9611 font-size: 18px;
9612}
9613.ios .stepper-small.stepper-fill .stepper-button.active-state,
9614.ios .stepper-small-ios.stepper-fill .stepper-button.active-state,
9615.ios .stepper-small.stepper-fill-ios .stepper-button.active-state,
9616.ios .stepper-small-ios.stepper-fill-ios .stepper-button.active-state,
9617.ios .stepper-small.stepper-fill .stepper-button-minus.active-state,
9618.ios .stepper-small-ios.stepper-fill .stepper-button-minus.active-state,
9619.ios .stepper-small.stepper-fill-ios .stepper-button-minus.active-state,
9620.ios .stepper-small-ios.stepper-fill-ios .stepper-button-minus.active-state,
9621.ios .stepper-small.stepper-fill .stepper-button-plus.active-state,
9622.ios .stepper-small-ios.stepper-fill .stepper-button-plus.active-state,
9623.ios .stepper-small.stepper-fill-ios .stepper-button-plus.active-state,
9624.ios .stepper-small-ios.stepper-fill-ios .stepper-button-plus.active-state {
9625 color: #007aff;
9626 border-color: #007aff;
9627 background-color: transparent;
9628 opacity: 1;
9629}
9630.ios .stepper-small.stepper-fill .stepper-button-plus.active-state:before,
9631.ios .stepper-small-ios.stepper-fill .stepper-button-plus.active-state:before,
9632.ios .stepper-small.stepper-fill-ios .stepper-button-plus.active-state:before,
9633.ios .stepper-small-ios.stepper-fill-ios .stepper-button-plus.active-state:before,
9634.ios .stepper-small.stepper-fill .stepper-button-minus.active-state:before,
9635.ios .stepper-small-ios.stepper-fill .stepper-button-minus.active-state:before,
9636.ios .stepper-small.stepper-fill-ios .stepper-button-minus.active-state:before,
9637.ios .stepper-small-ios.stepper-fill-ios .stepper-button-minus.active-state:before,
9638.ios .stepper-small.stepper-fill .stepper-button-plus.active-state:after,
9639.ios .stepper-small-ios.stepper-fill .stepper-button-plus.active-state:after,
9640.ios .stepper-small.stepper-fill-ios .stepper-button-plus.active-state:after,
9641.ios .stepper-small-ios.stepper-fill-ios .stepper-button-plus.active-state:after,
9642.ios .stepper-small.stepper-fill .stepper-button-minus.active-state:after,
9643.ios .stepper-small-ios.stepper-fill .stepper-button-minus.active-state:after,
9644.ios .stepper-small.stepper-fill-ios .stepper-button-minus.active-state:after,
9645.ios .stepper-small-ios.stepper-fill-ios .stepper-button-minus.active-state:after {
9646 background-color: #007aff;
9647}
9648.ios .stepper-big,
9649.ios .stepper-big-ios {
9650 height: 44px;
9651}
9652.ios .stepper-big .stepper-button,
9653.ios .stepper-big-ios .stepper-button,
9654.ios .stepper-big .stepper-button-minus,
9655.ios .stepper-big-ios .stepper-button-minus,
9656.ios .stepper-big .stepper-button-plus,
9657.ios .stepper-big-ios .stepper-button-plus {
9658 height: 44px;
9659 line-height: 42px;
9660}
9661.ios .color-theme-red .stepper-button,
9662.ios .color-theme-red .stepper-button-minus,
9663.ios .color-theme-red .stepper-button-plus {
9664 border-color: #ff3b30;
9665 color: #ff3b30;
9666}
9667.ios .color-theme-red .stepper-button.active-state,
9668.ios .color-theme-red .stepper-button-minus.active-state,
9669.ios .color-theme-red .stepper-button-plus.active-state {
9670 background-color: rgba(255, 59, 48, 0.15);
9671}
9672.ios .color-theme-red .stepper-button-plus:after,
9673.ios .color-theme-red .stepper-button-minus:after,
9674.ios .color-theme-red .stepper-button-plus:before,
9675.ios .color-theme-red .stepper-button-minus:before {
9676 background-color: #ff3b30;
9677}
9678.ios .color-theme-red .stepper-value,
9679.ios .color-theme-red .stepper-input-wrap {
9680 border-top-color: #ff3b30;
9681 border-bottom-color: #ff3b30;
9682}
9683.ios .color-theme-red .stepper-value,
9684.ios .color-theme-red .stepper-input-wrap input {
9685 color: #ff3b30;
9686}
9687.ios .color-theme-red .stepper-fill .stepper-button,
9688.ios .color-theme-red .stepper-fill-ios .stepper-button,
9689.ios .color-theme-red .stepper-fill .stepper-button-minus,
9690.ios .color-theme-red .stepper-fill-ios .stepper-button-minus,
9691.ios .color-theme-red .stepper-fill .stepper-button-plus,
9692.ios .color-theme-red .stepper-fill-ios .stepper-button-plus {
9693 background-color: #ff3b30;
9694}
9695.ios .color-theme-red .stepper-fill .stepper-button-plus:before,
9696.ios .color-theme-red .stepper-fill-ios .stepper-button-plus:before,
9697.ios .color-theme-red .stepper-fill .stepper-button-minus:before,
9698.ios .color-theme-red .stepper-fill-ios .stepper-button-minus:before,
9699.ios .color-theme-red .stepper-fill .stepper-button-plus:after,
9700.ios .color-theme-red .stepper-fill-ios .stepper-button-plus:after,
9701.ios .color-theme-red .stepper-fill .stepper-button-minus:after,
9702.ios .color-theme-red .stepper-fill-ios .stepper-button-minus:after {
9703 background-color: #fff;
9704}
9705.ios .color-theme-red .stepper-small.stepper-fill .stepper-button.active-state,
9706.ios .color-theme-red .stepper-small-ios.stepper-fill .stepper-button.active-state,
9707.ios .color-theme-red .stepper-small.stepper-fill .stepper-button-minus.active-state,
9708.ios .color-theme-red .stepper-small-ios.stepper-fill .stepper-button-minus.active-state,
9709.ios .color-theme-red .stepper-small.stepper-fill .stepper-button-plus.active-state,
9710.ios .color-theme-red .stepper-small-ios.stepper-fill .stepper-button-plus.active-state {
9711 color: #ff3b30;
9712 border-color: #ff3b30;
9713 background-color: transparent;
9714}
9715.ios .color-theme-red .stepper-small.stepper-fill .stepper-button-plus.active-state:before,
9716.ios .color-theme-red .stepper-small-ios.stepper-fill .stepper-button-plus.active-state:before,
9717.ios .color-theme-red .stepper-small.stepper-fill .stepper-button-minus.active-state:before,
9718.ios .color-theme-red .stepper-small-ios.stepper-fill .stepper-button-minus.active-state:before,
9719.ios .color-theme-red .stepper-small.stepper-fill .stepper-button-plus.active-state:after,
9720.ios .color-theme-red .stepper-small-ios.stepper-fill .stepper-button-plus.active-state:after,
9721.ios .color-theme-red .stepper-small.stepper-fill .stepper-button-minus.active-state:after,
9722.ios .color-theme-red .stepper-small-ios.stepper-fill .stepper-button-minus.active-state:after {
9723 background-color: #ff3b30;
9724}
9725.ios .color-theme-green .stepper-button,
9726.ios .color-theme-green .stepper-button-minus,
9727.ios .color-theme-green .stepper-button-plus {
9728 border-color: #4cd964;
9729 color: #4cd964;
9730}
9731.ios .color-theme-green .stepper-button.active-state,
9732.ios .color-theme-green .stepper-button-minus.active-state,
9733.ios .color-theme-green .stepper-button-plus.active-state {
9734 background-color: rgba(76, 217, 100, 0.15);
9735}
9736.ios .color-theme-green .stepper-button-plus:after,
9737.ios .color-theme-green .stepper-button-minus:after,
9738.ios .color-theme-green .stepper-button-plus:before,
9739.ios .color-theme-green .stepper-button-minus:before {
9740 background-color: #4cd964;
9741}
9742.ios .color-theme-green .stepper-value,
9743.ios .color-theme-green .stepper-input-wrap {
9744 border-top-color: #4cd964;
9745 border-bottom-color: #4cd964;
9746}
9747.ios .color-theme-green .stepper-value,
9748.ios .color-theme-green .stepper-input-wrap input {
9749 color: #4cd964;
9750}
9751.ios .color-theme-green .stepper-fill .stepper-button,
9752.ios .color-theme-green .stepper-fill-ios .stepper-button,
9753.ios .color-theme-green .stepper-fill .stepper-button-minus,
9754.ios .color-theme-green .stepper-fill-ios .stepper-button-minus,
9755.ios .color-theme-green .stepper-fill .stepper-button-plus,
9756.ios .color-theme-green .stepper-fill-ios .stepper-button-plus {
9757 background-color: #4cd964;
9758}
9759.ios .color-theme-green .stepper-fill .stepper-button-plus:before,
9760.ios .color-theme-green .stepper-fill-ios .stepper-button-plus:before,
9761.ios .color-theme-green .stepper-fill .stepper-button-minus:before,
9762.ios .color-theme-green .stepper-fill-ios .stepper-button-minus:before,
9763.ios .color-theme-green .stepper-fill .stepper-button-plus:after,
9764.ios .color-theme-green .stepper-fill-ios .stepper-button-plus:after,
9765.ios .color-theme-green .stepper-fill .stepper-button-minus:after,
9766.ios .color-theme-green .stepper-fill-ios .stepper-button-minus:after {
9767 background-color: #fff;
9768}
9769.ios .color-theme-green .stepper-small.stepper-fill .stepper-button.active-state,
9770.ios .color-theme-green .stepper-small-ios.stepper-fill .stepper-button.active-state,
9771.ios .color-theme-green .stepper-small.stepper-fill .stepper-button-minus.active-state,
9772.ios .color-theme-green .stepper-small-ios.stepper-fill .stepper-button-minus.active-state,
9773.ios .color-theme-green .stepper-small.stepper-fill .stepper-button-plus.active-state,
9774.ios .color-theme-green .stepper-small-ios.stepper-fill .stepper-button-plus.active-state {
9775 color: #4cd964;
9776 border-color: #4cd964;
9777 background-color: transparent;
9778}
9779.ios .color-theme-green .stepper-small.stepper-fill .stepper-button-plus.active-state:before,
9780.ios .color-theme-green .stepper-small-ios.stepper-fill .stepper-button-plus.active-state:before,
9781.ios .color-theme-green .stepper-small.stepper-fill .stepper-button-minus.active-state:before,
9782.ios .color-theme-green .stepper-small-ios.stepper-fill .stepper-button-minus.active-state:before,
9783.ios .color-theme-green .stepper-small.stepper-fill .stepper-button-plus.active-state:after,
9784.ios .color-theme-green .stepper-small-ios.stepper-fill .stepper-button-plus.active-state:after,
9785.ios .color-theme-green .stepper-small.stepper-fill .stepper-button-minus.active-state:after,
9786.ios .color-theme-green .stepper-small-ios.stepper-fill .stepper-button-minus.active-state:after {
9787 background-color: #4cd964;
9788}
9789.ios .color-theme-blue .stepper-button,
9790.ios .color-theme-blue .stepper-button-minus,
9791.ios .color-theme-blue .stepper-button-plus {
9792 border-color: #007aff;
9793 color: #007aff;
9794}
9795.ios .color-theme-blue .stepper-button.active-state,
9796.ios .color-theme-blue .stepper-button-minus.active-state,
9797.ios .color-theme-blue .stepper-button-plus.active-state {
9798 background-color: rgba(0, 122, 255, 0.15);
9799}
9800.ios .color-theme-blue .stepper-button-plus:after,
9801.ios .color-theme-blue .stepper-button-minus:after,
9802.ios .color-theme-blue .stepper-button-plus:before,
9803.ios .color-theme-blue .stepper-button-minus:before {
9804 background-color: #007aff;
9805}
9806.ios .color-theme-blue .stepper-value,
9807.ios .color-theme-blue .stepper-input-wrap {
9808 border-top-color: #007aff;
9809 border-bottom-color: #007aff;
9810}
9811.ios .color-theme-blue .stepper-value,
9812.ios .color-theme-blue .stepper-input-wrap input {
9813 color: #007aff;
9814}
9815.ios .color-theme-blue .stepper-fill .stepper-button,
9816.ios .color-theme-blue .stepper-fill-ios .stepper-button,
9817.ios .color-theme-blue .stepper-fill .stepper-button-minus,
9818.ios .color-theme-blue .stepper-fill-ios .stepper-button-minus,
9819.ios .color-theme-blue .stepper-fill .stepper-button-plus,
9820.ios .color-theme-blue .stepper-fill-ios .stepper-button-plus {
9821 background-color: #007aff;
9822}
9823.ios .color-theme-blue .stepper-fill .stepper-button-plus:before,
9824.ios .color-theme-blue .stepper-fill-ios .stepper-button-plus:before,
9825.ios .color-theme-blue .stepper-fill .stepper-button-minus:before,
9826.ios .color-theme-blue .stepper-fill-ios .stepper-button-minus:before,
9827.ios .color-theme-blue .stepper-fill .stepper-button-plus:after,
9828.ios .color-theme-blue .stepper-fill-ios .stepper-button-plus:after,
9829.ios .color-theme-blue .stepper-fill .stepper-button-minus:after,
9830.ios .color-theme-blue .stepper-fill-ios .stepper-button-minus:after {
9831 background-color: #fff;
9832}
9833.ios .color-theme-blue .stepper-small.stepper-fill .stepper-button.active-state,
9834.ios .color-theme-blue .stepper-small-ios.stepper-fill .stepper-button.active-state,
9835.ios .color-theme-blue .stepper-small.stepper-fill .stepper-button-minus.active-state,
9836.ios .color-theme-blue .stepper-small-ios.stepper-fill .stepper-button-minus.active-state,
9837.ios .color-theme-blue .stepper-small.stepper-fill .stepper-button-plus.active-state,
9838.ios .color-theme-blue .stepper-small-ios.stepper-fill .stepper-button-plus.active-state {
9839 color: #007aff;
9840 border-color: #007aff;
9841 background-color: transparent;
9842}
9843.ios .color-theme-blue .stepper-small.stepper-fill .stepper-button-plus.active-state:before,
9844.ios .color-theme-blue .stepper-small-ios.stepper-fill .stepper-button-plus.active-state:before,
9845.ios .color-theme-blue .stepper-small.stepper-fill .stepper-button-minus.active-state:before,
9846.ios .color-theme-blue .stepper-small-ios.stepper-fill .stepper-button-minus.active-state:before,
9847.ios .color-theme-blue .stepper-small.stepper-fill .stepper-button-plus.active-state:after,
9848.ios .color-theme-blue .stepper-small-ios.stepper-fill .stepper-button-plus.active-state:after,
9849.ios .color-theme-blue .stepper-small.stepper-fill .stepper-button-minus.active-state:after,
9850.ios .color-theme-blue .stepper-small-ios.stepper-fill .stepper-button-minus.active-state:after {
9851 background-color: #007aff;
9852}
9853.ios .color-theme-pink .stepper-button,
9854.ios .color-theme-pink .stepper-button-minus,
9855.ios .color-theme-pink .stepper-button-plus {
9856 border-color: #ff2d55;
9857 color: #ff2d55;
9858}
9859.ios .color-theme-pink .stepper-button.active-state,
9860.ios .color-theme-pink .stepper-button-minus.active-state,
9861.ios .color-theme-pink .stepper-button-plus.active-state {
9862 background-color: rgba(255, 45, 85, 0.15);
9863}
9864.ios .color-theme-pink .stepper-button-plus:after,
9865.ios .color-theme-pink .stepper-button-minus:after,
9866.ios .color-theme-pink .stepper-button-plus:before,
9867.ios .color-theme-pink .stepper-button-minus:before {
9868 background-color: #ff2d55;
9869}
9870.ios .color-theme-pink .stepper-value,
9871.ios .color-theme-pink .stepper-input-wrap {
9872 border-top-color: #ff2d55;
9873 border-bottom-color: #ff2d55;
9874}
9875.ios .color-theme-pink .stepper-value,
9876.ios .color-theme-pink .stepper-input-wrap input {
9877 color: #ff2d55;
9878}
9879.ios .color-theme-pink .stepper-fill .stepper-button,
9880.ios .color-theme-pink .stepper-fill-ios .stepper-button,
9881.ios .color-theme-pink .stepper-fill .stepper-button-minus,
9882.ios .color-theme-pink .stepper-fill-ios .stepper-button-minus,
9883.ios .color-theme-pink .stepper-fill .stepper-button-plus,
9884.ios .color-theme-pink .stepper-fill-ios .stepper-button-plus {
9885 background-color: #ff2d55;
9886}
9887.ios .color-theme-pink .stepper-fill .stepper-button-plus:before,
9888.ios .color-theme-pink .stepper-fill-ios .stepper-button-plus:before,
9889.ios .color-theme-pink .stepper-fill .stepper-button-minus:before,
9890.ios .color-theme-pink .stepper-fill-ios .stepper-button-minus:before,
9891.ios .color-theme-pink .stepper-fill .stepper-button-plus:after,
9892.ios .color-theme-pink .stepper-fill-ios .stepper-button-plus:after,
9893.ios .color-theme-pink .stepper-fill .stepper-button-minus:after,
9894.ios .color-theme-pink .stepper-fill-ios .stepper-button-minus:after {
9895 background-color: #fff;
9896}
9897.ios .color-theme-pink .stepper-small.stepper-fill .stepper-button.active-state,
9898.ios .color-theme-pink .stepper-small-ios.stepper-fill .stepper-button.active-state,
9899.ios .color-theme-pink .stepper-small.stepper-fill .stepper-button-minus.active-state,
9900.ios .color-theme-pink .stepper-small-ios.stepper-fill .stepper-button-minus.active-state,
9901.ios .color-theme-pink .stepper-small.stepper-fill .stepper-button-plus.active-state,
9902.ios .color-theme-pink .stepper-small-ios.stepper-fill .stepper-button-plus.active-state {
9903 color: #ff2d55;
9904 border-color: #ff2d55;
9905 background-color: transparent;
9906}
9907.ios .color-theme-pink .stepper-small.stepper-fill .stepper-button-plus.active-state:before,
9908.ios .color-theme-pink .stepper-small-ios.stepper-fill .stepper-button-plus.active-state:before,
9909.ios .color-theme-pink .stepper-small.stepper-fill .stepper-button-minus.active-state:before,
9910.ios .color-theme-pink .stepper-small-ios.stepper-fill .stepper-button-minus.active-state:before,
9911.ios .color-theme-pink .stepper-small.stepper-fill .stepper-button-plus.active-state:after,
9912.ios .color-theme-pink .stepper-small-ios.stepper-fill .stepper-button-plus.active-state:after,
9913.ios .color-theme-pink .stepper-small.stepper-fill .stepper-button-minus.active-state:after,
9914.ios .color-theme-pink .stepper-small-ios.stepper-fill .stepper-button-minus.active-state:after {
9915 background-color: #ff2d55;
9916}
9917.ios .color-theme-yellow .stepper-button,
9918.ios .color-theme-yellow .stepper-button-minus,
9919.ios .color-theme-yellow .stepper-button-plus {
9920 border-color: #ffcc00;
9921 color: #ffcc00;
9922}
9923.ios .color-theme-yellow .stepper-button.active-state,
9924.ios .color-theme-yellow .stepper-button-minus.active-state,
9925.ios .color-theme-yellow .stepper-button-plus.active-state {
9926 background-color: rgba(255, 204, 0, 0.15);
9927}
9928.ios .color-theme-yellow .stepper-button-plus:after,
9929.ios .color-theme-yellow .stepper-button-minus:after,
9930.ios .color-theme-yellow .stepper-button-plus:before,
9931.ios .color-theme-yellow .stepper-button-minus:before {
9932 background-color: #ffcc00;
9933}
9934.ios .color-theme-yellow .stepper-value,
9935.ios .color-theme-yellow .stepper-input-wrap {
9936 border-top-color: #ffcc00;
9937 border-bottom-color: #ffcc00;
9938}
9939.ios .color-theme-yellow .stepper-value,
9940.ios .color-theme-yellow .stepper-input-wrap input {
9941 color: #ffcc00;
9942}
9943.ios .color-theme-yellow .stepper-fill .stepper-button,
9944.ios .color-theme-yellow .stepper-fill-ios .stepper-button,
9945.ios .color-theme-yellow .stepper-fill .stepper-button-minus,
9946.ios .color-theme-yellow .stepper-fill-ios .stepper-button-minus,
9947.ios .color-theme-yellow .stepper-fill .stepper-button-plus,
9948.ios .color-theme-yellow .stepper-fill-ios .stepper-button-plus {
9949 background-color: #ffcc00;
9950}
9951.ios .color-theme-yellow .stepper-fill .stepper-button-plus:before,
9952.ios .color-theme-yellow .stepper-fill-ios .stepper-button-plus:before,
9953.ios .color-theme-yellow .stepper-fill .stepper-button-minus:before,
9954.ios .color-theme-yellow .stepper-fill-ios .stepper-button-minus:before,
9955.ios .color-theme-yellow .stepper-fill .stepper-button-plus:after,
9956.ios .color-theme-yellow .stepper-fill-ios .stepper-button-plus:after,
9957.ios .color-theme-yellow .stepper-fill .stepper-button-minus:after,
9958.ios .color-theme-yellow .stepper-fill-ios .stepper-button-minus:after {
9959 background-color: #fff;
9960}
9961.ios .color-theme-yellow .stepper-small.stepper-fill .stepper-button.active-state,
9962.ios .color-theme-yellow .stepper-small-ios.stepper-fill .stepper-button.active-state,
9963.ios .color-theme-yellow .stepper-small.stepper-fill .stepper-button-minus.active-state,
9964.ios .color-theme-yellow .stepper-small-ios.stepper-fill .stepper-button-minus.active-state,
9965.ios .color-theme-yellow .stepper-small.stepper-fill .stepper-button-plus.active-state,
9966.ios .color-theme-yellow .stepper-small-ios.stepper-fill .stepper-button-plus.active-state {
9967 color: #ffcc00;
9968 border-color: #ffcc00;
9969 background-color: transparent;
9970}
9971.ios .color-theme-yellow .stepper-small.stepper-fill .stepper-button-plus.active-state:before,
9972.ios .color-theme-yellow .stepper-small-ios.stepper-fill .stepper-button-plus.active-state:before,
9973.ios .color-theme-yellow .stepper-small.stepper-fill .stepper-button-minus.active-state:before,
9974.ios .color-theme-yellow .stepper-small-ios.stepper-fill .stepper-button-minus.active-state:before,
9975.ios .color-theme-yellow .stepper-small.stepper-fill .stepper-button-plus.active-state:after,
9976.ios .color-theme-yellow .stepper-small-ios.stepper-fill .stepper-button-plus.active-state:after,
9977.ios .color-theme-yellow .stepper-small.stepper-fill .stepper-button-minus.active-state:after,
9978.ios .color-theme-yellow .stepper-small-ios.stepper-fill .stepper-button-minus.active-state:after {
9979 background-color: #ffcc00;
9980}
9981.ios .color-theme-orange .stepper-button,
9982.ios .color-theme-orange .stepper-button-minus,
9983.ios .color-theme-orange .stepper-button-plus {
9984 border-color: #ff9500;
9985 color: #ff9500;
9986}
9987.ios .color-theme-orange .stepper-button.active-state,
9988.ios .color-theme-orange .stepper-button-minus.active-state,
9989.ios .color-theme-orange .stepper-button-plus.active-state {
9990 background-color: rgba(255, 149, 0, 0.15);
9991}
9992.ios .color-theme-orange .stepper-button-plus:after,
9993.ios .color-theme-orange .stepper-button-minus:after,
9994.ios .color-theme-orange .stepper-button-plus:before,
9995.ios .color-theme-orange .stepper-button-minus:before {
9996 background-color: #ff9500;
9997}
9998.ios .color-theme-orange .stepper-value,
9999.ios .color-theme-orange .stepper-input-wrap {
10000 border-top-color: #ff9500;
10001 border-bottom-color: #ff9500;
10002}
10003.ios .color-theme-orange .stepper-value,
10004.ios .color-theme-orange .stepper-input-wrap input {
10005 color: #ff9500;
10006}
10007.ios .color-theme-orange .stepper-fill .stepper-button,
10008.ios .color-theme-orange .stepper-fill-ios .stepper-button,
10009.ios .color-theme-orange .stepper-fill .stepper-button-minus,
10010.ios .color-theme-orange .stepper-fill-ios .stepper-button-minus,
10011.ios .color-theme-orange .stepper-fill .stepper-button-plus,
10012.ios .color-theme-orange .stepper-fill-ios .stepper-button-plus {
10013 background-color: #ff9500;
10014}
10015.ios .color-theme-orange .stepper-fill .stepper-button-plus:before,
10016.ios .color-theme-orange .stepper-fill-ios .stepper-button-plus:before,
10017.ios .color-theme-orange .stepper-fill .stepper-button-minus:before,
10018.ios .color-theme-orange .stepper-fill-ios .stepper-button-minus:before,
10019.ios .color-theme-orange .stepper-fill .stepper-button-plus:after,
10020.ios .color-theme-orange .stepper-fill-ios .stepper-button-plus:after,
10021.ios .color-theme-orange .stepper-fill .stepper-button-minus:after,
10022.ios .color-theme-orange .stepper-fill-ios .stepper-button-minus:after {
10023 background-color: #fff;
10024}
10025.ios .color-theme-orange .stepper-small.stepper-fill .stepper-button.active-state,
10026.ios .color-theme-orange .stepper-small-ios.stepper-fill .stepper-button.active-state,
10027.ios .color-theme-orange .stepper-small.stepper-fill .stepper-button-minus.active-state,
10028.ios .color-theme-orange .stepper-small-ios.stepper-fill .stepper-button-minus.active-state,
10029.ios .color-theme-orange .stepper-small.stepper-fill .stepper-button-plus.active-state,
10030.ios .color-theme-orange .stepper-small-ios.stepper-fill .stepper-button-plus.active-state {
10031 color: #ff9500;
10032 border-color: #ff9500;
10033 background-color: transparent;
10034}
10035.ios .color-theme-orange .stepper-small.stepper-fill .stepper-button-plus.active-state:before,
10036.ios .color-theme-orange .stepper-small-ios.stepper-fill .stepper-button-plus.active-state:before,
10037.ios .color-theme-orange .stepper-small.stepper-fill .stepper-button-minus.active-state:before,
10038.ios .color-theme-orange .stepper-small-ios.stepper-fill .stepper-button-minus.active-state:before,
10039.ios .color-theme-orange .stepper-small.stepper-fill .stepper-button-plus.active-state:after,
10040.ios .color-theme-orange .stepper-small-ios.stepper-fill .stepper-button-plus.active-state:after,
10041.ios .color-theme-orange .stepper-small.stepper-fill .stepper-button-minus.active-state:after,
10042.ios .color-theme-orange .stepper-small-ios.stepper-fill .stepper-button-minus.active-state:after {
10043 background-color: #ff9500;
10044}
10045.ios .color-theme-gray .stepper-button,
10046.ios .color-theme-gray .stepper-button-minus,
10047.ios .color-theme-gray .stepper-button-plus {
10048 border-color: #8e8e93;
10049 color: #8e8e93;
10050}
10051.ios .color-theme-gray .stepper-button.active-state,
10052.ios .color-theme-gray .stepper-button-minus.active-state,
10053.ios .color-theme-gray .stepper-button-plus.active-state {
10054 background-color: rgba(142, 142, 147, 0.15);
10055}
10056.ios .color-theme-gray .stepper-button-plus:after,
10057.ios .color-theme-gray .stepper-button-minus:after,
10058.ios .color-theme-gray .stepper-button-plus:before,
10059.ios .color-theme-gray .stepper-button-minus:before {
10060 background-color: #8e8e93;
10061}
10062.ios .color-theme-gray .stepper-value,
10063.ios .color-theme-gray .stepper-input-wrap {
10064 border-top-color: #8e8e93;
10065 border-bottom-color: #8e8e93;
10066}
10067.ios .color-theme-gray .stepper-value,
10068.ios .color-theme-gray .stepper-input-wrap input {
10069 color: #8e8e93;
10070}
10071.ios .color-theme-gray .stepper-fill .stepper-button,
10072.ios .color-theme-gray .stepper-fill-ios .stepper-button,
10073.ios .color-theme-gray .stepper-fill .stepper-button-minus,
10074.ios .color-theme-gray .stepper-fill-ios .stepper-button-minus,
10075.ios .color-theme-gray .stepper-fill .stepper-button-plus,
10076.ios .color-theme-gray .stepper-fill-ios .stepper-button-plus {
10077 background-color: #8e8e93;
10078}
10079.ios .color-theme-gray .stepper-fill .stepper-button-plus:before,
10080.ios .color-theme-gray .stepper-fill-ios .stepper-button-plus:before,
10081.ios .color-theme-gray .stepper-fill .stepper-button-minus:before,
10082.ios .color-theme-gray .stepper-fill-ios .stepper-button-minus:before,
10083.ios .color-theme-gray .stepper-fill .stepper-button-plus:after,
10084.ios .color-theme-gray .stepper-fill-ios .stepper-button-plus:after,
10085.ios .color-theme-gray .stepper-fill .stepper-button-minus:after,
10086.ios .color-theme-gray .stepper-fill-ios .stepper-button-minus:after {
10087 background-color: #fff;
10088}
10089.ios .color-theme-gray .stepper-small.stepper-fill .stepper-button.active-state,
10090.ios .color-theme-gray .stepper-small-ios.stepper-fill .stepper-button.active-state,
10091.ios .color-theme-gray .stepper-small.stepper-fill .stepper-button-minus.active-state,
10092.ios .color-theme-gray .stepper-small-ios.stepper-fill .stepper-button-minus.active-state,
10093.ios .color-theme-gray .stepper-small.stepper-fill .stepper-button-plus.active-state,
10094.ios .color-theme-gray .stepper-small-ios.stepper-fill .stepper-button-plus.active-state {
10095 color: #8e8e93;
10096 border-color: #8e8e93;
10097 background-color: transparent;
10098}
10099.ios .color-theme-gray .stepper-small.stepper-fill .stepper-button-plus.active-state:before,
10100.ios .color-theme-gray .stepper-small-ios.stepper-fill .stepper-button-plus.active-state:before,
10101.ios .color-theme-gray .stepper-small.stepper-fill .stepper-button-minus.active-state:before,
10102.ios .color-theme-gray .stepper-small-ios.stepper-fill .stepper-button-minus.active-state:before,
10103.ios .color-theme-gray .stepper-small.stepper-fill .stepper-button-plus.active-state:after,
10104.ios .color-theme-gray .stepper-small-ios.stepper-fill .stepper-button-plus.active-state:after,
10105.ios .color-theme-gray .stepper-small.stepper-fill .stepper-button-minus.active-state:after,
10106.ios .color-theme-gray .stepper-small-ios.stepper-fill .stepper-button-minus.active-state:after {
10107 background-color: #8e8e93;
10108}
10109.ios .color-theme-white .stepper-button,
10110.ios .color-theme-white .stepper-button-minus,
10111.ios .color-theme-white .stepper-button-plus {
10112 border-color: #ffffff;
10113 color: #ffffff;
10114}
10115.ios .color-theme-white .stepper-button.active-state,
10116.ios .color-theme-white .stepper-button-minus.active-state,
10117.ios .color-theme-white .stepper-button-plus.active-state {
10118 background-color: rgba(255, 255, 255, 0.15);
10119}
10120.ios .color-theme-white .stepper-button-plus:after,
10121.ios .color-theme-white .stepper-button-minus:after,
10122.ios .color-theme-white .stepper-button-plus:before,
10123.ios .color-theme-white .stepper-button-minus:before {
10124 background-color: #ffffff;
10125}
10126.ios .color-theme-white .stepper-value,
10127.ios .color-theme-white .stepper-input-wrap {
10128 border-top-color: #ffffff;
10129 border-bottom-color: #ffffff;
10130}
10131.ios .color-theme-white .stepper-value,
10132.ios .color-theme-white .stepper-input-wrap input {
10133 color: #ffffff;
10134}
10135.ios .color-theme-white .stepper-fill .stepper-button,
10136.ios .color-theme-white .stepper-fill-ios .stepper-button,
10137.ios .color-theme-white .stepper-fill .stepper-button-minus,
10138.ios .color-theme-white .stepper-fill-ios .stepper-button-minus,
10139.ios .color-theme-white .stepper-fill .stepper-button-plus,
10140.ios .color-theme-white .stepper-fill-ios .stepper-button-plus {
10141 background-color: #ffffff;
10142}
10143.ios .color-theme-white .stepper-fill .stepper-button-plus:before,
10144.ios .color-theme-white .stepper-fill-ios .stepper-button-plus:before,
10145.ios .color-theme-white .stepper-fill .stepper-button-minus:before,
10146.ios .color-theme-white .stepper-fill-ios .stepper-button-minus:before,
10147.ios .color-theme-white .stepper-fill .stepper-button-plus:after,
10148.ios .color-theme-white .stepper-fill-ios .stepper-button-plus:after,
10149.ios .color-theme-white .stepper-fill .stepper-button-minus:after,
10150.ios .color-theme-white .stepper-fill-ios .stepper-button-minus:after {
10151 background-color: #fff;
10152}
10153.ios .color-theme-white .stepper-small.stepper-fill .stepper-button.active-state,
10154.ios .color-theme-white .stepper-small-ios.stepper-fill .stepper-button.active-state,
10155.ios .color-theme-white .stepper-small.stepper-fill .stepper-button-minus.active-state,
10156.ios .color-theme-white .stepper-small-ios.stepper-fill .stepper-button-minus.active-state,
10157.ios .color-theme-white .stepper-small.stepper-fill .stepper-button-plus.active-state,
10158.ios .color-theme-white .stepper-small-ios.stepper-fill .stepper-button-plus.active-state {
10159 color: #ffffff;
10160 border-color: #ffffff;
10161 background-color: transparent;
10162}
10163.ios .color-theme-white .stepper-small.stepper-fill .stepper-button-plus.active-state:before,
10164.ios .color-theme-white .stepper-small-ios.stepper-fill .stepper-button-plus.active-state:before,
10165.ios .color-theme-white .stepper-small.stepper-fill .stepper-button-minus.active-state:before,
10166.ios .color-theme-white .stepper-small-ios.stepper-fill .stepper-button-minus.active-state:before,
10167.ios .color-theme-white .stepper-small.stepper-fill .stepper-button-plus.active-state:after,
10168.ios .color-theme-white .stepper-small-ios.stepper-fill .stepper-button-plus.active-state:after,
10169.ios .color-theme-white .stepper-small.stepper-fill .stepper-button-minus.active-state:after,
10170.ios .color-theme-white .stepper-small-ios.stepper-fill .stepper-button-minus.active-state:after {
10171 background-color: #ffffff;
10172}
10173.ios .color-theme-black .stepper-button,
10174.ios .color-theme-black .stepper-button-minus,
10175.ios .color-theme-black .stepper-button-plus {
10176 border-color: #000000;
10177 color: #000000;
10178}
10179.ios .color-theme-black .stepper-button.active-state,
10180.ios .color-theme-black .stepper-button-minus.active-state,
10181.ios .color-theme-black .stepper-button-plus.active-state {
10182 background-color: rgba(0, 0, 0, 0.15);
10183}
10184.ios .color-theme-black .stepper-button-plus:after,
10185.ios .color-theme-black .stepper-button-minus:after,
10186.ios .color-theme-black .stepper-button-plus:before,
10187.ios .color-theme-black .stepper-button-minus:before {
10188 background-color: #000000;
10189}
10190.ios .color-theme-black .stepper-value,
10191.ios .color-theme-black .stepper-input-wrap {
10192 border-top-color: #000000;
10193 border-bottom-color: #000000;
10194}
10195.ios .color-theme-black .stepper-value,
10196.ios .color-theme-black .stepper-input-wrap input {
10197 color: #000000;
10198}
10199.ios .color-theme-black .stepper-fill .stepper-button,
10200.ios .color-theme-black .stepper-fill-ios .stepper-button,
10201.ios .color-theme-black .stepper-fill .stepper-button-minus,
10202.ios .color-theme-black .stepper-fill-ios .stepper-button-minus,
10203.ios .color-theme-black .stepper-fill .stepper-button-plus,
10204.ios .color-theme-black .stepper-fill-ios .stepper-button-plus {
10205 background-color: #000000;
10206}
10207.ios .color-theme-black .stepper-fill .stepper-button-plus:before,
10208.ios .color-theme-black .stepper-fill-ios .stepper-button-plus:before,
10209.ios .color-theme-black .stepper-fill .stepper-button-minus:before,
10210.ios .color-theme-black .stepper-fill-ios .stepper-button-minus:before,
10211.ios .color-theme-black .stepper-fill .stepper-button-plus:after,
10212.ios .color-theme-black .stepper-fill-ios .stepper-button-plus:after,
10213.ios .color-theme-black .stepper-fill .stepper-button-minus:after,
10214.ios .color-theme-black .stepper-fill-ios .stepper-button-minus:after {
10215 background-color: #fff;
10216}
10217.ios .color-theme-black .stepper-small.stepper-fill .stepper-button.active-state,
10218.ios .color-theme-black .stepper-small-ios.stepper-fill .stepper-button.active-state,
10219.ios .color-theme-black .stepper-small.stepper-fill .stepper-button-minus.active-state,
10220.ios .color-theme-black .stepper-small-ios.stepper-fill .stepper-button-minus.active-state,
10221.ios .color-theme-black .stepper-small.stepper-fill .stepper-button-plus.active-state,
10222.ios .color-theme-black .stepper-small-ios.stepper-fill .stepper-button-plus.active-state {
10223 color: #000000;
10224 border-color: #000000;
10225 background-color: transparent;
10226}
10227.ios .color-theme-black .stepper-small.stepper-fill .stepper-button-plus.active-state:before,
10228.ios .color-theme-black .stepper-small-ios.stepper-fill .stepper-button-plus.active-state:before,
10229.ios .color-theme-black .stepper-small.stepper-fill .stepper-button-minus.active-state:before,
10230.ios .color-theme-black .stepper-small-ios.stepper-fill .stepper-button-minus.active-state:before,
10231.ios .color-theme-black .stepper-small.stepper-fill .stepper-button-plus.active-state:after,
10232.ios .color-theme-black .stepper-small-ios.stepper-fill .stepper-button-plus.active-state:after,
10233.ios .color-theme-black .stepper-small.stepper-fill .stepper-button-minus.active-state:after,
10234.ios .color-theme-black .stepper-small-ios.stepper-fill .stepper-button-minus.active-state:after {
10235 background-color: #000000;
10236}
10237.ios .stepper.color-red .stepper-button,
10238.ios .stepper.color-red .stepper-button-minus,
10239.ios .stepper.color-red .stepper-button-plus {
10240 border-color: #ff3b30;
10241 color: #ff3b30;
10242}
10243.ios .stepper.color-red .stepper-button.active-state,
10244.ios .stepper.color-red .stepper-button-minus.active-state,
10245.ios .stepper.color-red .stepper-button-plus.active-state {
10246 background-color: rgba(255, 59, 48, 0.15);
10247}
10248.ios .stepper.color-red .stepper-button-plus:after,
10249.ios .stepper.color-red .stepper-button-minus:after,
10250.ios .stepper.color-red .stepper-button-plus:before,
10251.ios .stepper.color-red .stepper-button-minus:before {
10252 background-color: #ff3b30;
10253}
10254.ios .stepper.color-red .stepper-value,
10255.ios .stepper.color-red .stepper-input-wrap {
10256 border-top-color: #ff3b30;
10257 border-bottom-color: #ff3b30;
10258}
10259.ios .stepper.color-red .stepper-value,
10260.ios .stepper.color-red .stepper-input-wrap input {
10261 color: #ff3b30;
10262}
10263.ios .stepper-fill.color-red .stepper-button,
10264.ios .stepper-fill-ios.color-red .stepper-button,
10265.ios .stepper-fill.color-red .stepper-button-minus,
10266.ios .stepper-fill-ios.color-red .stepper-button-minus,
10267.ios .stepper-fill.color-red .stepper-button-plus,
10268.ios .stepper-fill-ios.color-red .stepper-button-plus {
10269 background-color: #ff3b30;
10270}
10271.ios .stepper-fill.color-red .stepper-button-plus:before,
10272.ios .stepper-fill-ios.color-red .stepper-button-plus:before,
10273.ios .stepper-fill.color-red .stepper-button-minus:before,
10274.ios .stepper-fill-ios.color-red .stepper-button-minus:before,
10275.ios .stepper-fill.color-red .stepper-button-plus:after,
10276.ios .stepper-fill-ios.color-red .stepper-button-plus:after,
10277.ios .stepper-fill.color-red .stepper-button-minus:after,
10278.ios .stepper-fill-ios.color-red .stepper-button-minus:after {
10279 background-color: #fff;
10280}
10281.ios .stepper-small.color-red.stepper-fill .stepper-button.active-state,
10282.ios .stepper-small-ios.color-red.stepper-fill .stepper-button.active-state,
10283.ios .stepper-small.color-red.stepper-fill .stepper-button-minus.active-state,
10284.ios .stepper-small-ios.color-red.stepper-fill .stepper-button-minus.active-state,
10285.ios .stepper-small.color-red.stepper-fill .stepper-button-plus.active-state,
10286.ios .stepper-small-ios.color-red.stepper-fill .stepper-button-plus.active-state {
10287 color: #ff3b30;
10288 border-color: #ff3b30;
10289 background-color: transparent;
10290}
10291.ios .stepper-small.color-red.stepper-fill .stepper-button-plus.active-state:before,
10292.ios .stepper-small-ios.color-red.stepper-fill .stepper-button-plus.active-state:before,
10293.ios .stepper-small.color-red.stepper-fill .stepper-button-minus.active-state:before,
10294.ios .stepper-small-ios.color-red.stepper-fill .stepper-button-minus.active-state:before,
10295.ios .stepper-small.color-red.stepper-fill .stepper-button-plus.active-state:after,
10296.ios .stepper-small-ios.color-red.stepper-fill .stepper-button-plus.active-state:after,
10297.ios .stepper-small.color-red.stepper-fill .stepper-button-minus.active-state:after,
10298.ios .stepper-small-ios.color-red.stepper-fill .stepper-button-minus.active-state:after {
10299 background-color: #ff3b30;
10300}
10301.ios .stepper.color-green .stepper-button,
10302.ios .stepper.color-green .stepper-button-minus,
10303.ios .stepper.color-green .stepper-button-plus {
10304 border-color: #4cd964;
10305 color: #4cd964;
10306}
10307.ios .stepper.color-green .stepper-button.active-state,
10308.ios .stepper.color-green .stepper-button-minus.active-state,
10309.ios .stepper.color-green .stepper-button-plus.active-state {
10310 background-color: rgba(76, 217, 100, 0.15);
10311}
10312.ios .stepper.color-green .stepper-button-plus:after,
10313.ios .stepper.color-green .stepper-button-minus:after,
10314.ios .stepper.color-green .stepper-button-plus:before,
10315.ios .stepper.color-green .stepper-button-minus:before {
10316 background-color: #4cd964;
10317}
10318.ios .stepper.color-green .stepper-value,
10319.ios .stepper.color-green .stepper-input-wrap {
10320 border-top-color: #4cd964;
10321 border-bottom-color: #4cd964;
10322}
10323.ios .stepper.color-green .stepper-value,
10324.ios .stepper.color-green .stepper-input-wrap input {
10325 color: #4cd964;
10326}
10327.ios .stepper-fill.color-green .stepper-button,
10328.ios .stepper-fill-ios.color-green .stepper-button,
10329.ios .stepper-fill.color-green .stepper-button-minus,
10330.ios .stepper-fill-ios.color-green .stepper-button-minus,
10331.ios .stepper-fill.color-green .stepper-button-plus,
10332.ios .stepper-fill-ios.color-green .stepper-button-plus {
10333 background-color: #4cd964;
10334}
10335.ios .stepper-fill.color-green .stepper-button-plus:before,
10336.ios .stepper-fill-ios.color-green .stepper-button-plus:before,
10337.ios .stepper-fill.color-green .stepper-button-minus:before,
10338.ios .stepper-fill-ios.color-green .stepper-button-minus:before,
10339.ios .stepper-fill.color-green .stepper-button-plus:after,
10340.ios .stepper-fill-ios.color-green .stepper-button-plus:after,
10341.ios .stepper-fill.color-green .stepper-button-minus:after,
10342.ios .stepper-fill-ios.color-green .stepper-button-minus:after {
10343 background-color: #fff;
10344}
10345.ios .stepper-small.color-green.stepper-fill .stepper-button.active-state,
10346.ios .stepper-small-ios.color-green.stepper-fill .stepper-button.active-state,
10347.ios .stepper-small.color-green.stepper-fill .stepper-button-minus.active-state,
10348.ios .stepper-small-ios.color-green.stepper-fill .stepper-button-minus.active-state,
10349.ios .stepper-small.color-green.stepper-fill .stepper-button-plus.active-state,
10350.ios .stepper-small-ios.color-green.stepper-fill .stepper-button-plus.active-state {
10351 color: #4cd964;
10352 border-color: #4cd964;
10353 background-color: transparent;
10354}
10355.ios .stepper-small.color-green.stepper-fill .stepper-button-plus.active-state:before,
10356.ios .stepper-small-ios.color-green.stepper-fill .stepper-button-plus.active-state:before,
10357.ios .stepper-small.color-green.stepper-fill .stepper-button-minus.active-state:before,
10358.ios .stepper-small-ios.color-green.stepper-fill .stepper-button-minus.active-state:before,
10359.ios .stepper-small.color-green.stepper-fill .stepper-button-plus.active-state:after,
10360.ios .stepper-small-ios.color-green.stepper-fill .stepper-button-plus.active-state:after,
10361.ios .stepper-small.color-green.stepper-fill .stepper-button-minus.active-state:after,
10362.ios .stepper-small-ios.color-green.stepper-fill .stepper-button-minus.active-state:after {
10363 background-color: #4cd964;
10364}
10365.ios .stepper.color-blue .stepper-button,
10366.ios .stepper.color-blue .stepper-button-minus,
10367.ios .stepper.color-blue .stepper-button-plus {
10368 border-color: #007aff;
10369 color: #007aff;
10370}
10371.ios .stepper.color-blue .stepper-button.active-state,
10372.ios .stepper.color-blue .stepper-button-minus.active-state,
10373.ios .stepper.color-blue .stepper-button-plus.active-state {
10374 background-color: rgba(0, 122, 255, 0.15);
10375}
10376.ios .stepper.color-blue .stepper-button-plus:after,
10377.ios .stepper.color-blue .stepper-button-minus:after,
10378.ios .stepper.color-blue .stepper-button-plus:before,
10379.ios .stepper.color-blue .stepper-button-minus:before {
10380 background-color: #007aff;
10381}
10382.ios .stepper.color-blue .stepper-value,
10383.ios .stepper.color-blue .stepper-input-wrap {
10384 border-top-color: #007aff;
10385 border-bottom-color: #007aff;
10386}
10387.ios .stepper.color-blue .stepper-value,
10388.ios .stepper.color-blue .stepper-input-wrap input {
10389 color: #007aff;
10390}
10391.ios .stepper-fill.color-blue .stepper-button,
10392.ios .stepper-fill-ios.color-blue .stepper-button,
10393.ios .stepper-fill.color-blue .stepper-button-minus,
10394.ios .stepper-fill-ios.color-blue .stepper-button-minus,
10395.ios .stepper-fill.color-blue .stepper-button-plus,
10396.ios .stepper-fill-ios.color-blue .stepper-button-plus {
10397 background-color: #007aff;
10398}
10399.ios .stepper-fill.color-blue .stepper-button-plus:before,
10400.ios .stepper-fill-ios.color-blue .stepper-button-plus:before,
10401.ios .stepper-fill.color-blue .stepper-button-minus:before,
10402.ios .stepper-fill-ios.color-blue .stepper-button-minus:before,
10403.ios .stepper-fill.color-blue .stepper-button-plus:after,
10404.ios .stepper-fill-ios.color-blue .stepper-button-plus:after,
10405.ios .stepper-fill.color-blue .stepper-button-minus:after,
10406.ios .stepper-fill-ios.color-blue .stepper-button-minus:after {
10407 background-color: #fff;
10408}
10409.ios .stepper-small.color-blue.stepper-fill .stepper-button.active-state,
10410.ios .stepper-small-ios.color-blue.stepper-fill .stepper-button.active-state,
10411.ios .stepper-small.color-blue.stepper-fill .stepper-button-minus.active-state,
10412.ios .stepper-small-ios.color-blue.stepper-fill .stepper-button-minus.active-state,
10413.ios .stepper-small.color-blue.stepper-fill .stepper-button-plus.active-state,
10414.ios .stepper-small-ios.color-blue.stepper-fill .stepper-button-plus.active-state {
10415 color: #007aff;
10416 border-color: #007aff;
10417 background-color: transparent;
10418}
10419.ios .stepper-small.color-blue.stepper-fill .stepper-button-plus.active-state:before,
10420.ios .stepper-small-ios.color-blue.stepper-fill .stepper-button-plus.active-state:before,
10421.ios .stepper-small.color-blue.stepper-fill .stepper-button-minus.active-state:before,
10422.ios .stepper-small-ios.color-blue.stepper-fill .stepper-button-minus.active-state:before,
10423.ios .stepper-small.color-blue.stepper-fill .stepper-button-plus.active-state:after,
10424.ios .stepper-small-ios.color-blue.stepper-fill .stepper-button-plus.active-state:after,
10425.ios .stepper-small.color-blue.stepper-fill .stepper-button-minus.active-state:after,
10426.ios .stepper-small-ios.color-blue.stepper-fill .stepper-button-minus.active-state:after {
10427 background-color: #007aff;
10428}
10429.ios .stepper.color-pink .stepper-button,
10430.ios .stepper.color-pink .stepper-button-minus,
10431.ios .stepper.color-pink .stepper-button-plus {
10432 border-color: #ff2d55;
10433 color: #ff2d55;
10434}
10435.ios .stepper.color-pink .stepper-button.active-state,
10436.ios .stepper.color-pink .stepper-button-minus.active-state,
10437.ios .stepper.color-pink .stepper-button-plus.active-state {
10438 background-color: rgba(255, 45, 85, 0.15);
10439}
10440.ios .stepper.color-pink .stepper-button-plus:after,
10441.ios .stepper.color-pink .stepper-button-minus:after,
10442.ios .stepper.color-pink .stepper-button-plus:before,
10443.ios .stepper.color-pink .stepper-button-minus:before {
10444 background-color: #ff2d55;
10445}
10446.ios .stepper.color-pink .stepper-value,
10447.ios .stepper.color-pink .stepper-input-wrap {
10448 border-top-color: #ff2d55;
10449 border-bottom-color: #ff2d55;
10450}
10451.ios .stepper.color-pink .stepper-value,
10452.ios .stepper.color-pink .stepper-input-wrap input {
10453 color: #ff2d55;
10454}
10455.ios .stepper-fill.color-pink .stepper-button,
10456.ios .stepper-fill-ios.color-pink .stepper-button,
10457.ios .stepper-fill.color-pink .stepper-button-minus,
10458.ios .stepper-fill-ios.color-pink .stepper-button-minus,
10459.ios .stepper-fill.color-pink .stepper-button-plus,
10460.ios .stepper-fill-ios.color-pink .stepper-button-plus {
10461 background-color: #ff2d55;
10462}
10463.ios .stepper-fill.color-pink .stepper-button-plus:before,
10464.ios .stepper-fill-ios.color-pink .stepper-button-plus:before,
10465.ios .stepper-fill.color-pink .stepper-button-minus:before,
10466.ios .stepper-fill-ios.color-pink .stepper-button-minus:before,
10467.ios .stepper-fill.color-pink .stepper-button-plus:after,
10468.ios .stepper-fill-ios.color-pink .stepper-button-plus:after,
10469.ios .stepper-fill.color-pink .stepper-button-minus:after,
10470.ios .stepper-fill-ios.color-pink .stepper-button-minus:after {
10471 background-color: #fff;
10472}
10473.ios .stepper-small.color-pink.stepper-fill .stepper-button.active-state,
10474.ios .stepper-small-ios.color-pink.stepper-fill .stepper-button.active-state,
10475.ios .stepper-small.color-pink.stepper-fill .stepper-button-minus.active-state,
10476.ios .stepper-small-ios.color-pink.stepper-fill .stepper-button-minus.active-state,
10477.ios .stepper-small.color-pink.stepper-fill .stepper-button-plus.active-state,
10478.ios .stepper-small-ios.color-pink.stepper-fill .stepper-button-plus.active-state {
10479 color: #ff2d55;
10480 border-color: #ff2d55;
10481 background-color: transparent;
10482}
10483.ios .stepper-small.color-pink.stepper-fill .stepper-button-plus.active-state:before,
10484.ios .stepper-small-ios.color-pink.stepper-fill .stepper-button-plus.active-state:before,
10485.ios .stepper-small.color-pink.stepper-fill .stepper-button-minus.active-state:before,
10486.ios .stepper-small-ios.color-pink.stepper-fill .stepper-button-minus.active-state:before,
10487.ios .stepper-small.color-pink.stepper-fill .stepper-button-plus.active-state:after,
10488.ios .stepper-small-ios.color-pink.stepper-fill .stepper-button-plus.active-state:after,
10489.ios .stepper-small.color-pink.stepper-fill .stepper-button-minus.active-state:after,
10490.ios .stepper-small-ios.color-pink.stepper-fill .stepper-button-minus.active-state:after {
10491 background-color: #ff2d55;
10492}
10493.ios .stepper.color-yellow .stepper-button,
10494.ios .stepper.color-yellow .stepper-button-minus,
10495.ios .stepper.color-yellow .stepper-button-plus {
10496 border-color: #ffcc00;
10497 color: #ffcc00;
10498}
10499.ios .stepper.color-yellow .stepper-button.active-state,
10500.ios .stepper.color-yellow .stepper-button-minus.active-state,
10501.ios .stepper.color-yellow .stepper-button-plus.active-state {
10502 background-color: rgba(255, 204, 0, 0.15);
10503}
10504.ios .stepper.color-yellow .stepper-button-plus:after,
10505.ios .stepper.color-yellow .stepper-button-minus:after,
10506.ios .stepper.color-yellow .stepper-button-plus:before,
10507.ios .stepper.color-yellow .stepper-button-minus:before {
10508 background-color: #ffcc00;
10509}
10510.ios .stepper.color-yellow .stepper-value,
10511.ios .stepper.color-yellow .stepper-input-wrap {
10512 border-top-color: #ffcc00;
10513 border-bottom-color: #ffcc00;
10514}
10515.ios .stepper.color-yellow .stepper-value,
10516.ios .stepper.color-yellow .stepper-input-wrap input {
10517 color: #ffcc00;
10518}
10519.ios .stepper-fill.color-yellow .stepper-button,
10520.ios .stepper-fill-ios.color-yellow .stepper-button,
10521.ios .stepper-fill.color-yellow .stepper-button-minus,
10522.ios .stepper-fill-ios.color-yellow .stepper-button-minus,
10523.ios .stepper-fill.color-yellow .stepper-button-plus,
10524.ios .stepper-fill-ios.color-yellow .stepper-button-plus {
10525 background-color: #ffcc00;
10526}
10527.ios .stepper-fill.color-yellow .stepper-button-plus:before,
10528.ios .stepper-fill-ios.color-yellow .stepper-button-plus:before,
10529.ios .stepper-fill.color-yellow .stepper-button-minus:before,
10530.ios .stepper-fill-ios.color-yellow .stepper-button-minus:before,
10531.ios .stepper-fill.color-yellow .stepper-button-plus:after,
10532.ios .stepper-fill-ios.color-yellow .stepper-button-plus:after,
10533.ios .stepper-fill.color-yellow .stepper-button-minus:after,
10534.ios .stepper-fill-ios.color-yellow .stepper-button-minus:after {
10535 background-color: #fff;
10536}
10537.ios .stepper-small.color-yellow.stepper-fill .stepper-button.active-state,
10538.ios .stepper-small-ios.color-yellow.stepper-fill .stepper-button.active-state,
10539.ios .stepper-small.color-yellow.stepper-fill .stepper-button-minus.active-state,
10540.ios .stepper-small-ios.color-yellow.stepper-fill .stepper-button-minus.active-state,
10541.ios .stepper-small.color-yellow.stepper-fill .stepper-button-plus.active-state,
10542.ios .stepper-small-ios.color-yellow.stepper-fill .stepper-button-plus.active-state {
10543 color: #ffcc00;
10544 border-color: #ffcc00;
10545 background-color: transparent;
10546}
10547.ios .stepper-small.color-yellow.stepper-fill .stepper-button-plus.active-state:before,
10548.ios .stepper-small-ios.color-yellow.stepper-fill .stepper-button-plus.active-state:before,
10549.ios .stepper-small.color-yellow.stepper-fill .stepper-button-minus.active-state:before,
10550.ios .stepper-small-ios.color-yellow.stepper-fill .stepper-button-minus.active-state:before,
10551.ios .stepper-small.color-yellow.stepper-fill .stepper-button-plus.active-state:after,
10552.ios .stepper-small-ios.color-yellow.stepper-fill .stepper-button-plus.active-state:after,
10553.ios .stepper-small.color-yellow.stepper-fill .stepper-button-minus.active-state:after,
10554.ios .stepper-small-ios.color-yellow.stepper-fill .stepper-button-minus.active-state:after {
10555 background-color: #ffcc00;
10556}
10557.ios .stepper.color-orange .stepper-button,
10558.ios .stepper.color-orange .stepper-button-minus,
10559.ios .stepper.color-orange .stepper-button-plus {
10560 border-color: #ff9500;
10561 color: #ff9500;
10562}
10563.ios .stepper.color-orange .stepper-button.active-state,
10564.ios .stepper.color-orange .stepper-button-minus.active-state,
10565.ios .stepper.color-orange .stepper-button-plus.active-state {
10566 background-color: rgba(255, 149, 0, 0.15);
10567}
10568.ios .stepper.color-orange .stepper-button-plus:after,
10569.ios .stepper.color-orange .stepper-button-minus:after,
10570.ios .stepper.color-orange .stepper-button-plus:before,
10571.ios .stepper.color-orange .stepper-button-minus:before {
10572 background-color: #ff9500;
10573}
10574.ios .stepper.color-orange .stepper-value,
10575.ios .stepper.color-orange .stepper-input-wrap {
10576 border-top-color: #ff9500;
10577 border-bottom-color: #ff9500;
10578}
10579.ios .stepper.color-orange .stepper-value,
10580.ios .stepper.color-orange .stepper-input-wrap input {
10581 color: #ff9500;
10582}
10583.ios .stepper-fill.color-orange .stepper-button,
10584.ios .stepper-fill-ios.color-orange .stepper-button,
10585.ios .stepper-fill.color-orange .stepper-button-minus,
10586.ios .stepper-fill-ios.color-orange .stepper-button-minus,
10587.ios .stepper-fill.color-orange .stepper-button-plus,
10588.ios .stepper-fill-ios.color-orange .stepper-button-plus {
10589 background-color: #ff9500;
10590}
10591.ios .stepper-fill.color-orange .stepper-button-plus:before,
10592.ios .stepper-fill-ios.color-orange .stepper-button-plus:before,
10593.ios .stepper-fill.color-orange .stepper-button-minus:before,
10594.ios .stepper-fill-ios.color-orange .stepper-button-minus:before,
10595.ios .stepper-fill.color-orange .stepper-button-plus:after,
10596.ios .stepper-fill-ios.color-orange .stepper-button-plus:after,
10597.ios .stepper-fill.color-orange .stepper-button-minus:after,
10598.ios .stepper-fill-ios.color-orange .stepper-button-minus:after {
10599 background-color: #fff;
10600}
10601.ios .stepper-small.color-orange.stepper-fill .stepper-button.active-state,
10602.ios .stepper-small-ios.color-orange.stepper-fill .stepper-button.active-state,
10603.ios .stepper-small.color-orange.stepper-fill .stepper-button-minus.active-state,
10604.ios .stepper-small-ios.color-orange.stepper-fill .stepper-button-minus.active-state,
10605.ios .stepper-small.color-orange.stepper-fill .stepper-button-plus.active-state,
10606.ios .stepper-small-ios.color-orange.stepper-fill .stepper-button-plus.active-state {
10607 color: #ff9500;
10608 border-color: #ff9500;
10609 background-color: transparent;
10610}
10611.ios .stepper-small.color-orange.stepper-fill .stepper-button-plus.active-state:before,
10612.ios .stepper-small-ios.color-orange.stepper-fill .stepper-button-plus.active-state:before,
10613.ios .stepper-small.color-orange.stepper-fill .stepper-button-minus.active-state:before,
10614.ios .stepper-small-ios.color-orange.stepper-fill .stepper-button-minus.active-state:before,
10615.ios .stepper-small.color-orange.stepper-fill .stepper-button-plus.active-state:after,
10616.ios .stepper-small-ios.color-orange.stepper-fill .stepper-button-plus.active-state:after,
10617.ios .stepper-small.color-orange.stepper-fill .stepper-button-minus.active-state:after,
10618.ios .stepper-small-ios.color-orange.stepper-fill .stepper-button-minus.active-state:after {
10619 background-color: #ff9500;
10620}
10621.ios .stepper.color-gray .stepper-button,
10622.ios .stepper.color-gray .stepper-button-minus,
10623.ios .stepper.color-gray .stepper-button-plus {
10624 border-color: #8e8e93;
10625 color: #8e8e93;
10626}
10627.ios .stepper.color-gray .stepper-button.active-state,
10628.ios .stepper.color-gray .stepper-button-minus.active-state,
10629.ios .stepper.color-gray .stepper-button-plus.active-state {
10630 background-color: rgba(142, 142, 147, 0.15);
10631}
10632.ios .stepper.color-gray .stepper-button-plus:after,
10633.ios .stepper.color-gray .stepper-button-minus:after,
10634.ios .stepper.color-gray .stepper-button-plus:before,
10635.ios .stepper.color-gray .stepper-button-minus:before {
10636 background-color: #8e8e93;
10637}
10638.ios .stepper.color-gray .stepper-value,
10639.ios .stepper.color-gray .stepper-input-wrap {
10640 border-top-color: #8e8e93;
10641 border-bottom-color: #8e8e93;
10642}
10643.ios .stepper.color-gray .stepper-value,
10644.ios .stepper.color-gray .stepper-input-wrap input {
10645 color: #8e8e93;
10646}
10647.ios .stepper-fill.color-gray .stepper-button,
10648.ios .stepper-fill-ios.color-gray .stepper-button,
10649.ios .stepper-fill.color-gray .stepper-button-minus,
10650.ios .stepper-fill-ios.color-gray .stepper-button-minus,
10651.ios .stepper-fill.color-gray .stepper-button-plus,
10652.ios .stepper-fill-ios.color-gray .stepper-button-plus {
10653 background-color: #8e8e93;
10654}
10655.ios .stepper-fill.color-gray .stepper-button-plus:before,
10656.ios .stepper-fill-ios.color-gray .stepper-button-plus:before,
10657.ios .stepper-fill.color-gray .stepper-button-minus:before,
10658.ios .stepper-fill-ios.color-gray .stepper-button-minus:before,
10659.ios .stepper-fill.color-gray .stepper-button-plus:after,
10660.ios .stepper-fill-ios.color-gray .stepper-button-plus:after,
10661.ios .stepper-fill.color-gray .stepper-button-minus:after,
10662.ios .stepper-fill-ios.color-gray .stepper-button-minus:after {
10663 background-color: #fff;
10664}
10665.ios .stepper-small.color-gray.stepper-fill .stepper-button.active-state,
10666.ios .stepper-small-ios.color-gray.stepper-fill .stepper-button.active-state,
10667.ios .stepper-small.color-gray.stepper-fill .stepper-button-minus.active-state,
10668.ios .stepper-small-ios.color-gray.stepper-fill .stepper-button-minus.active-state,
10669.ios .stepper-small.color-gray.stepper-fill .stepper-button-plus.active-state,
10670.ios .stepper-small-ios.color-gray.stepper-fill .stepper-button-plus.active-state {
10671 color: #8e8e93;
10672 border-color: #8e8e93;
10673 background-color: transparent;
10674}
10675.ios .stepper-small.color-gray.stepper-fill .stepper-button-plus.active-state:before,
10676.ios .stepper-small-ios.color-gray.stepper-fill .stepper-button-plus.active-state:before,
10677.ios .stepper-small.color-gray.stepper-fill .stepper-button-minus.active-state:before,
10678.ios .stepper-small-ios.color-gray.stepper-fill .stepper-button-minus.active-state:before,
10679.ios .stepper-small.color-gray.stepper-fill .stepper-button-plus.active-state:after,
10680.ios .stepper-small-ios.color-gray.stepper-fill .stepper-button-plus.active-state:after,
10681.ios .stepper-small.color-gray.stepper-fill .stepper-button-minus.active-state:after,
10682.ios .stepper-small-ios.color-gray.stepper-fill .stepper-button-minus.active-state:after {
10683 background-color: #8e8e93;
10684}
10685.ios .stepper.color-white .stepper-button,
10686.ios .stepper.color-white .stepper-button-minus,
10687.ios .stepper.color-white .stepper-button-plus {
10688 border-color: #ffffff;
10689 color: #ffffff;
10690}
10691.ios .stepper.color-white .stepper-button.active-state,
10692.ios .stepper.color-white .stepper-button-minus.active-state,
10693.ios .stepper.color-white .stepper-button-plus.active-state {
10694 background-color: rgba(255, 255, 255, 0.15);
10695}
10696.ios .stepper.color-white .stepper-button-plus:after,
10697.ios .stepper.color-white .stepper-button-minus:after,
10698.ios .stepper.color-white .stepper-button-plus:before,
10699.ios .stepper.color-white .stepper-button-minus:before {
10700 background-color: #ffffff;
10701}
10702.ios .stepper.color-white .stepper-value,
10703.ios .stepper.color-white .stepper-input-wrap {
10704 border-top-color: #ffffff;
10705 border-bottom-color: #ffffff;
10706}
10707.ios .stepper.color-white .stepper-value,
10708.ios .stepper.color-white .stepper-input-wrap input {
10709 color: #ffffff;
10710}
10711.ios .stepper-fill.color-white .stepper-button,
10712.ios .stepper-fill-ios.color-white .stepper-button,
10713.ios .stepper-fill.color-white .stepper-button-minus,
10714.ios .stepper-fill-ios.color-white .stepper-button-minus,
10715.ios .stepper-fill.color-white .stepper-button-plus,
10716.ios .stepper-fill-ios.color-white .stepper-button-plus {
10717 background-color: #ffffff;
10718}
10719.ios .stepper-fill.color-white .stepper-button-plus:before,
10720.ios .stepper-fill-ios.color-white .stepper-button-plus:before,
10721.ios .stepper-fill.color-white .stepper-button-minus:before,
10722.ios .stepper-fill-ios.color-white .stepper-button-minus:before,
10723.ios .stepper-fill.color-white .stepper-button-plus:after,
10724.ios .stepper-fill-ios.color-white .stepper-button-plus:after,
10725.ios .stepper-fill.color-white .stepper-button-minus:after,
10726.ios .stepper-fill-ios.color-white .stepper-button-minus:after {
10727 background-color: #fff;
10728}
10729.ios .stepper-small.color-white.stepper-fill .stepper-button.active-state,
10730.ios .stepper-small-ios.color-white.stepper-fill .stepper-button.active-state,
10731.ios .stepper-small.color-white.stepper-fill .stepper-button-minus.active-state,
10732.ios .stepper-small-ios.color-white.stepper-fill .stepper-button-minus.active-state,
10733.ios .stepper-small.color-white.stepper-fill .stepper-button-plus.active-state,
10734.ios .stepper-small-ios.color-white.stepper-fill .stepper-button-plus.active-state {
10735 color: #ffffff;
10736 border-color: #ffffff;
10737 background-color: transparent;
10738}
10739.ios .stepper-small.color-white.stepper-fill .stepper-button-plus.active-state:before,
10740.ios .stepper-small-ios.color-white.stepper-fill .stepper-button-plus.active-state:before,
10741.ios .stepper-small.color-white.stepper-fill .stepper-button-minus.active-state:before,
10742.ios .stepper-small-ios.color-white.stepper-fill .stepper-button-minus.active-state:before,
10743.ios .stepper-small.color-white.stepper-fill .stepper-button-plus.active-state:after,
10744.ios .stepper-small-ios.color-white.stepper-fill .stepper-button-plus.active-state:after,
10745.ios .stepper-small.color-white.stepper-fill .stepper-button-minus.active-state:after,
10746.ios .stepper-small-ios.color-white.stepper-fill .stepper-button-minus.active-state:after {
10747 background-color: #ffffff;
10748}
10749.ios .stepper.color-black .stepper-button,
10750.ios .stepper.color-black .stepper-button-minus,
10751.ios .stepper.color-black .stepper-button-plus {
10752 border-color: #000000;
10753 color: #000000;
10754}
10755.ios .stepper.color-black .stepper-button.active-state,
10756.ios .stepper.color-black .stepper-button-minus.active-state,
10757.ios .stepper.color-black .stepper-button-plus.active-state {
10758 background-color: rgba(0, 0, 0, 0.15);
10759}
10760.ios .stepper.color-black .stepper-button-plus:after,
10761.ios .stepper.color-black .stepper-button-minus:after,
10762.ios .stepper.color-black .stepper-button-plus:before,
10763.ios .stepper.color-black .stepper-button-minus:before {
10764 background-color: #000000;
10765}
10766.ios .stepper.color-black .stepper-value,
10767.ios .stepper.color-black .stepper-input-wrap {
10768 border-top-color: #000000;
10769 border-bottom-color: #000000;
10770}
10771.ios .stepper.color-black .stepper-value,
10772.ios .stepper.color-black .stepper-input-wrap input {
10773 color: #000000;
10774}
10775.ios .stepper-fill.color-black .stepper-button,
10776.ios .stepper-fill-ios.color-black .stepper-button,
10777.ios .stepper-fill.color-black .stepper-button-minus,
10778.ios .stepper-fill-ios.color-black .stepper-button-minus,
10779.ios .stepper-fill.color-black .stepper-button-plus,
10780.ios .stepper-fill-ios.color-black .stepper-button-plus {
10781 background-color: #000000;
10782}
10783.ios .stepper-fill.color-black .stepper-button-plus:before,
10784.ios .stepper-fill-ios.color-black .stepper-button-plus:before,
10785.ios .stepper-fill.color-black .stepper-button-minus:before,
10786.ios .stepper-fill-ios.color-black .stepper-button-minus:before,
10787.ios .stepper-fill.color-black .stepper-button-plus:after,
10788.ios .stepper-fill-ios.color-black .stepper-button-plus:after,
10789.ios .stepper-fill.color-black .stepper-button-minus:after,
10790.ios .stepper-fill-ios.color-black .stepper-button-minus:after {
10791 background-color: #fff;
10792}
10793.ios .stepper-small.color-black.stepper-fill .stepper-button.active-state,
10794.ios .stepper-small-ios.color-black.stepper-fill .stepper-button.active-state,
10795.ios .stepper-small.color-black.stepper-fill .stepper-button-minus.active-state,
10796.ios .stepper-small-ios.color-black.stepper-fill .stepper-button-minus.active-state,
10797.ios .stepper-small.color-black.stepper-fill .stepper-button-plus.active-state,
10798.ios .stepper-small-ios.color-black.stepper-fill .stepper-button-plus.active-state {
10799 color: #000000;
10800 border-color: #000000;
10801 background-color: transparent;
10802}
10803.ios .stepper-small.color-black.stepper-fill .stepper-button-plus.active-state:before,
10804.ios .stepper-small-ios.color-black.stepper-fill .stepper-button-plus.active-state:before,
10805.ios .stepper-small.color-black.stepper-fill .stepper-button-minus.active-state:before,
10806.ios .stepper-small-ios.color-black.stepper-fill .stepper-button-minus.active-state:before,
10807.ios .stepper-small.color-black.stepper-fill .stepper-button-plus.active-state:after,
10808.ios .stepper-small-ios.color-black.stepper-fill .stepper-button-plus.active-state:after,
10809.ios .stepper-small.color-black.stepper-fill .stepper-button-minus.active-state:after,
10810.ios .stepper-small-ios.color-black.stepper-fill .stepper-button-minus.active-state:after {
10811 background-color: #000000;
10812}
10813/* === Smart Select === */
10814.smart-select select {
10815 display: none;
10816}
10817.smart-select .item-after {
10818 max-width: 70%;
10819 overflow: hidden;
10820 text-overflow: ellipsis;
10821 position: relative;
10822 display: block;
10823}
10824.sheet-modal.smart-select-sheet .sheet-modal-inner {
10825 background: #fff;
10826}
10827.sheet-modal.smart-select-sheet .list {
10828 margin: 0;
10829}
10830.sheet-modal.smart-select-sheet .list ul:before {
10831 display: none !important;
10832}
10833.sheet-modal.smart-select-sheet .list ul:after {
10834 display: none !important;
10835}
10836.smart-select-popover .popover-inner {
10837 max-height: 40vh;
10838}
10839.ios .smart-select-sheet .page {
10840 background: #fff;
10841}
10842.ios .smart-select-sheet .toolbar:after {
10843 content: '';
10844 position: absolute;
10845 background-color: #c4c4c4;
10846 display: block;
10847 z-index: 15;
10848 top: auto;
10849 right: auto;
10850 bottom: 0;
10851 left: 0;
10852 height: 1px;
10853 width: 100%;
10854 -webkit-transform-origin: 50% 100%;
10855 transform-origin: 50% 100%;
10856}
10857.ios.device-pixel-ratio-2 .smart-select-sheet .toolbar:after {
10858 -webkit-transform: scaleY(0.5);
10859 transform: scaleY(0.5);
10860}
10861.ios.device-pixel-ratio-3 .smart-select-sheet .toolbar:after {
10862 -webkit-transform: scaleY(0.33);
10863 transform: scaleY(0.33);
10864}
10865.ios .theme-dark .smart-select-sheet .page,
10866.ios .theme-dark .smart-select-sheet .sheet-modal-inner {
10867 background-color: #1c1c1d;
10868}
10869.ios .theme-dark .smart-select-sheet .toolbar:after {
10870 background-color: #282829;
10871}
10872/* === Grid === */
10873.row {
10874 display: -webkit-box;
10875 display: -webkit-flex;
10876 display: -ms-flexbox;
10877 display: flex;
10878 -webkit-box-pack: justify;
10879 -webkit-justify-content: space-between;
10880 -ms-flex-pack: justify;
10881 justify-content: space-between;
10882 -webkit-flex-wrap: wrap;
10883 -ms-flex-wrap: wrap;
10884 flex-wrap: wrap;
10885 -webkit-box-align: start;
10886 -webkit-align-items: flex-start;
10887 -ms-flex-align: start;
10888 align-items: flex-start;
10889}
10890.row > [class*="col-"],
10891.row > .col {
10892 -webkit-box-sizing: border-box;
10893 box-sizing: border-box;
10894}
10895.row .col {
10896 width: 100%;
10897}
10898/* === Grid === */
10899.ios .row .col-100 {
10900 width: 100%;
10901 width: calc((100% - 15px*0) / 1);
10902}
10903.ios .row.no-gap .col-100 {
10904 width: 100%;
10905}
10906.ios .row .col-95 {
10907 width: 95%;
10908 width: calc((100% - 15px*0.05263157894736836) / 1.0526315789473684);
10909}
10910.ios .row.no-gap .col-95 {
10911 width: 95%;
10912}
10913.ios .row .col-90 {
10914 width: 90%;
10915 width: calc((100% - 15px*0.11111111111111116) / 1.1111111111111112);
10916}
10917.ios .row.no-gap .col-90 {
10918 width: 90%;
10919}
10920.ios .row .col-85 {
10921 width: 85%;
10922 width: calc((100% - 15px*0.17647058823529416) / 1.1764705882352942);
10923}
10924.ios .row.no-gap .col-85 {
10925 width: 85%;
10926}
10927.ios .row .col-80 {
10928 width: 80%;
10929 width: calc((100% - 15px*0.25) / 1.25);
10930}
10931.ios .row.no-gap .col-80 {
10932 width: 80%;
10933}
10934.ios .row .col-75 {
10935 width: 75%;
10936 width: calc((100% - 15px*0.33333333333333326) / 1.3333333333333333);
10937}
10938.ios .row.no-gap .col-75 {
10939 width: 75%;
10940}
10941.ios .row .col-70 {
10942 width: 70%;
10943 width: calc((100% - 15px*0.4285714285714286) / 1.4285714285714286);
10944}
10945.ios .row.no-gap .col-70 {
10946 width: 70%;
10947}
10948.ios .row .col-66 {
10949 width: 66.66666666666666%;
10950 width: calc((100% - 15px*0.5000000000000002) / 1.5000000000000002);
10951}
10952.ios .row.no-gap .col-66 {
10953 width: 66.66666666666666%;
10954}
10955.ios .row .col-65 {
10956 width: 65%;
10957 width: calc((100% - 15px*0.5384615384615385) / 1.5384615384615385);
10958}
10959.ios .row.no-gap .col-65 {
10960 width: 65%;
10961}
10962.ios .row .col-60 {
10963 width: 60%;
10964 width: calc((100% - 15px*0.6666666666666667) / 1.6666666666666667);
10965}
10966.ios .row.no-gap .col-60 {
10967 width: 60%;
10968}
10969.ios .row .col-55 {
10970 width: 55%;
10971 width: calc((100% - 15px*0.8181818181818181) / 1.8181818181818181);
10972}
10973.ios .row.no-gap .col-55 {
10974 width: 55%;
10975}
10976.ios .row .col-50 {
10977 width: 50%;
10978 width: calc((100% - 15px*1) / 2);
10979}
10980.ios .row.no-gap .col-50 {
10981 width: 50%;
10982}
10983.ios .row .col-45 {
10984 width: 45%;
10985 width: calc((100% - 15px*1.2222222222222223) / 2.2222222222222223);
10986}
10987.ios .row.no-gap .col-45 {
10988 width: 45%;
10989}
10990.ios .row .col-40 {
10991 width: 40%;
10992 width: calc((100% - 15px*1.5) / 2.5);
10993}
10994.ios .row.no-gap .col-40 {
10995 width: 40%;
10996}
10997.ios .row .col-35 {
10998 width: 35%;
10999 width: calc((100% - 15px*1.8571428571428572) / 2.857142857142857);
11000}
11001.ios .row.no-gap .col-35 {
11002 width: 35%;
11003}
11004.ios .row .col-33 {
11005 width: 33.333333333333336%;
11006 width: calc((100% - 15px*2) / 3);
11007}
11008.ios .row.no-gap .col-33 {
11009 width: 33.333333333333336%;
11010}
11011.ios .row .col-30 {
11012 width: 30%;
11013 width: calc((100% - 15px*2.3333333333333335) / 3.3333333333333335);
11014}
11015.ios .row.no-gap .col-30 {
11016 width: 30%;
11017}
11018.ios .row .col-25 {
11019 width: 25%;
11020 width: calc((100% - 15px*3) / 4);
11021}
11022.ios .row.no-gap .col-25 {
11023 width: 25%;
11024}
11025.ios .row .col-20 {
11026 width: 20%;
11027 width: calc((100% - 15px*4) / 5);
11028}
11029.ios .row.no-gap .col-20 {
11030 width: 20%;
11031}
11032.ios .row .col-15 {
11033 width: 15%;
11034 width: calc((100% - 15px*5.666666666666667) / 6.666666666666667);
11035}
11036.ios .row.no-gap .col-15 {
11037 width: 15%;
11038}
11039.ios .row .col-10 {
11040 width: 10%;
11041 width: calc((100% - 15px*9) / 10);
11042}
11043.ios .row.no-gap .col-10 {
11044 width: 10%;
11045}
11046.ios .row .col-5 {
11047 width: 5%;
11048 width: calc((100% - 15px*19) / 20);
11049}
11050.ios .row.no-gap .col-5 {
11051 width: 5%;
11052}
11053.ios .row .col:nth-last-child(1),
11054.ios .row .col:nth-last-child(1) ~ .col {
11055 width: 100%;
11056 width: calc((100% - 15px*0) / 1);
11057}
11058.ios .row.no-gap .col:nth-last-child(1),
11059.ios .row.no-gap .col:nth-last-child(1) ~ .col {
11060 width: 100%;
11061}
11062.ios .row .col:nth-last-child(2),
11063.ios .row .col:nth-last-child(2) ~ .col {
11064 width: 50%;
11065 width: calc((100% - 15px*1) / 2);
11066}
11067.ios .row.no-gap .col:nth-last-child(2),
11068.ios .row.no-gap .col:nth-last-child(2) ~ .col {
11069 width: 50%;
11070}
11071.ios .row .col:nth-last-child(3),
11072.ios .row .col:nth-last-child(3) ~ .col {
11073 width: 33.33333333%;
11074 width: calc((100% - 15px*2) / 3);
11075}
11076.ios .row.no-gap .col:nth-last-child(3),
11077.ios .row.no-gap .col:nth-last-child(3) ~ .col {
11078 width: 33.33333333%;
11079}
11080.ios .row .col:nth-last-child(4),
11081.ios .row .col:nth-last-child(4) ~ .col {
11082 width: 25%;
11083 width: calc((100% - 15px*3) / 4);
11084}
11085.ios .row.no-gap .col:nth-last-child(4),
11086.ios .row.no-gap .col:nth-last-child(4) ~ .col {
11087 width: 25%;
11088}
11089.ios .row .col:nth-last-child(5),
11090.ios .row .col:nth-last-child(5) ~ .col {
11091 width: 20%;
11092 width: calc((100% - 15px*4) / 5);
11093}
11094.ios .row.no-gap .col:nth-last-child(5),
11095.ios .row.no-gap .col:nth-last-child(5) ~ .col {
11096 width: 20%;
11097}
11098.ios .row .col:nth-last-child(6),
11099.ios .row .col:nth-last-child(6) ~ .col {
11100 width: 16.66666667%;
11101 width: calc((100% - 15px*5) / 6);
11102}
11103.ios .row.no-gap .col:nth-last-child(6),
11104.ios .row.no-gap .col:nth-last-child(6) ~ .col {
11105 width: 16.66666667%;
11106}
11107.ios .row .col:nth-last-child(7),
11108.ios .row .col:nth-last-child(7) ~ .col {
11109 width: 14.28571429%;
11110 width: calc((100% - 15px*6) / 7);
11111}
11112.ios .row.no-gap .col:nth-last-child(7),
11113.ios .row.no-gap .col:nth-last-child(7) ~ .col {
11114 width: 14.28571429%;
11115}
11116.ios .row .col:nth-last-child(8),
11117.ios .row .col:nth-last-child(8) ~ .col {
11118 width: 12.5%;
11119 width: calc((100% - 15px*7) / 8);
11120}
11121.ios .row.no-gap .col:nth-last-child(8),
11122.ios .row.no-gap .col:nth-last-child(8) ~ .col {
11123 width: 12.5%;
11124}
11125.ios .row .col:nth-last-child(9),
11126.ios .row .col:nth-last-child(9) ~ .col {
11127 width: 11.11111111%;
11128 width: calc((100% - 15px*8) / 9);
11129}
11130.ios .row.no-gap .col:nth-last-child(9),
11131.ios .row.no-gap .col:nth-last-child(9) ~ .col {
11132 width: 11.11111111%;
11133}
11134.ios .row .col:nth-last-child(10),
11135.ios .row .col:nth-last-child(10) ~ .col {
11136 width: 10%;
11137 width: calc((100% - 15px*9) / 10);
11138}
11139.ios .row.no-gap .col:nth-last-child(10),
11140.ios .row.no-gap .col:nth-last-child(10) ~ .col {
11141 width: 10%;
11142}
11143.ios .row .col:nth-last-child(11),
11144.ios .row .col:nth-last-child(11) ~ .col {
11145 width: 9.09090909%;
11146 width: calc((100% - 15px*10) / 11);
11147}
11148.ios .row.no-gap .col:nth-last-child(11),
11149.ios .row.no-gap .col:nth-last-child(11) ~ .col {
11150 width: 9.09090909%;
11151}
11152.ios .row .col:nth-last-child(12),
11153.ios .row .col:nth-last-child(12) ~ .col {
11154 width: 8.33333333%;
11155 width: calc((100% - 15px*11) / 12);
11156}
11157.ios .row.no-gap .col:nth-last-child(12),
11158.ios .row.no-gap .col:nth-last-child(12) ~ .col {
11159 width: 8.33333333%;
11160}
11161.ios .row .col:nth-last-child(13),
11162.ios .row .col:nth-last-child(13) ~ .col {
11163 width: 7.69230769%;
11164 width: calc((100% - 15px*12) / 13);
11165}
11166.ios .row.no-gap .col:nth-last-child(13),
11167.ios .row.no-gap .col:nth-last-child(13) ~ .col {
11168 width: 7.69230769%;
11169}
11170.ios .row .col:nth-last-child(14),
11171.ios .row .col:nth-last-child(14) ~ .col {
11172 width: 7.14285714%;
11173 width: calc((100% - 15px*13) / 14);
11174}
11175.ios .row.no-gap .col:nth-last-child(14),
11176.ios .row.no-gap .col:nth-last-child(14) ~ .col {
11177 width: 7.14285714%;
11178}
11179.ios .row .col:nth-last-child(15),
11180.ios .row .col:nth-last-child(15) ~ .col {
11181 width: 6.66666667%;
11182 width: calc((100% - 15px*14) / 15);
11183}
11184.ios .row.no-gap .col:nth-last-child(15),
11185.ios .row.no-gap .col:nth-last-child(15) ~ .col {
11186 width: 6.66666667%;
11187}
11188.ios .row .col:nth-last-child(16),
11189.ios .row .col:nth-last-child(16) ~ .col {
11190 width: 6.25%;
11191 width: calc((100% - 15px*15) / 16);
11192}
11193.ios .row.no-gap .col:nth-last-child(16),
11194.ios .row.no-gap .col:nth-last-child(16) ~ .col {
11195 width: 6.25%;
11196}
11197.ios .row .col:nth-last-child(17),
11198.ios .row .col:nth-last-child(17) ~ .col {
11199 width: 5.88235294%;
11200 width: calc((100% - 15px*16) / 17);
11201}
11202.ios .row.no-gap .col:nth-last-child(17),
11203.ios .row.no-gap .col:nth-last-child(17) ~ .col {
11204 width: 5.88235294%;
11205}
11206.ios .row .col:nth-last-child(18),
11207.ios .row .col:nth-last-child(18) ~ .col {
11208 width: 5.55555556%;
11209 width: calc((100% - 15px*17) / 18);
11210}
11211.ios .row.no-gap .col:nth-last-child(18),
11212.ios .row.no-gap .col:nth-last-child(18) ~ .col {
11213 width: 5.55555556%;
11214}
11215.ios .row .col:nth-last-child(19),
11216.ios .row .col:nth-last-child(19) ~ .col {
11217 width: 5.26315789%;
11218 width: calc((100% - 15px*18) / 19);
11219}
11220.ios .row.no-gap .col:nth-last-child(19),
11221.ios .row.no-gap .col:nth-last-child(19) ~ .col {
11222 width: 5.26315789%;
11223}
11224.ios .row .col:nth-last-child(20),
11225.ios .row .col:nth-last-child(20) ~ .col {
11226 width: 5%;
11227 width: calc((100% - 15px*19) / 20);
11228}
11229.ios .row.no-gap .col:nth-last-child(20),
11230.ios .row.no-gap .col:nth-last-child(20) ~ .col {
11231 width: 5%;
11232}
11233.ios .row .col:nth-last-child(21),
11234.ios .row .col:nth-last-child(21) ~ .col {
11235 width: 4.76190476%;
11236 width: calc((100% - 15px*20) / 21);
11237}
11238.ios .row.no-gap .col:nth-last-child(21),
11239.ios .row.no-gap .col:nth-last-child(21) ~ .col {
11240 width: 4.76190476%;
11241}
11242@media (min-width: 768px) {
11243 .ios .row .tablet-100 {
11244 width: 100%;
11245 width: calc((100% - 15px*0) / 1);
11246 }
11247 .ios .row.no-gap .tablet-100 {
11248 width: 100%;
11249 }
11250 .ios .row .tablet-95 {
11251 width: 95%;
11252 width: calc((100% - 15px*0.05263157894736836) / 1.0526315789473684);
11253 }
11254 .ios .row.no-gap .tablet-95 {
11255 width: 95%;
11256 }
11257 .ios .row .tablet-90 {
11258 width: 90%;
11259 width: calc((100% - 15px*0.11111111111111116) / 1.1111111111111112);
11260 }
11261 .ios .row.no-gap .tablet-90 {
11262 width: 90%;
11263 }
11264 .ios .row .tablet-85 {
11265 width: 85%;
11266 width: calc((100% - 15px*0.17647058823529416) / 1.1764705882352942);
11267 }
11268 .ios .row.no-gap .tablet-85 {
11269 width: 85%;
11270 }
11271 .ios .row .tablet-80 {
11272 width: 80%;
11273 width: calc((100% - 15px*0.25) / 1.25);
11274 }
11275 .ios .row.no-gap .tablet-80 {
11276 width: 80%;
11277 }
11278 .ios .row .tablet-75 {
11279 width: 75%;
11280 width: calc((100% - 15px*0.33333333333333326) / 1.3333333333333333);
11281 }
11282 .ios .row.no-gap .tablet-75 {
11283 width: 75%;
11284 }
11285 .ios .row .tablet-70 {
11286 width: 70%;
11287 width: calc((100% - 15px*0.4285714285714286) / 1.4285714285714286);
11288 }
11289 .ios .row.no-gap .tablet-70 {
11290 width: 70%;
11291 }
11292 .ios .row .tablet-66 {
11293 width: 66.66666666666666%;
11294 width: calc((100% - 15px*0.5000000000000002) / 1.5000000000000002);
11295 }
11296 .ios .row.no-gap .tablet-66 {
11297 width: 66.66666666666666%;
11298 }
11299 .ios .row .tablet-65 {
11300 width: 65%;
11301 width: calc((100% - 15px*0.5384615384615385) / 1.5384615384615385);
11302 }
11303 .ios .row.no-gap .tablet-65 {
11304 width: 65%;
11305 }
11306 .ios .row .tablet-60 {
11307 width: 60%;
11308 width: calc((100% - 15px*0.6666666666666667) / 1.6666666666666667);
11309 }
11310 .ios .row.no-gap .tablet-60 {
11311 width: 60%;
11312 }
11313 .ios .row .tablet-55 {
11314 width: 55%;
11315 width: calc((100% - 15px*0.8181818181818181) / 1.8181818181818181);
11316 }
11317 .ios .row.no-gap .tablet-55 {
11318 width: 55%;
11319 }
11320 .ios .row .tablet-50 {
11321 width: 50%;
11322 width: calc((100% - 15px*1) / 2);
11323 }
11324 .ios .row.no-gap .tablet-50 {
11325 width: 50%;
11326 }
11327 .ios .row .tablet-45 {
11328 width: 45%;
11329 width: calc((100% - 15px*1.2222222222222223) / 2.2222222222222223);
11330 }
11331 .ios .row.no-gap .tablet-45 {
11332 width: 45%;
11333 }
11334 .ios .row .tablet-40 {
11335 width: 40%;
11336 width: calc((100% - 15px*1.5) / 2.5);
11337 }
11338 .ios .row.no-gap .tablet-40 {
11339 width: 40%;
11340 }
11341 .ios .row .tablet-35 {
11342 width: 35%;
11343 width: calc((100% - 15px*1.8571428571428572) / 2.857142857142857);
11344 }
11345 .ios .row.no-gap .tablet-35 {
11346 width: 35%;
11347 }
11348 .ios .row .tablet-33 {
11349 width: 33.333333333333336%;
11350 width: calc((100% - 15px*2) / 3);
11351 }
11352 .ios .row.no-gap .tablet-33 {
11353 width: 33.333333333333336%;
11354 }
11355 .ios .row .tablet-30 {
11356 width: 30%;
11357 width: calc((100% - 15px*2.3333333333333335) / 3.3333333333333335);
11358 }
11359 .ios .row.no-gap .tablet-30 {
11360 width: 30%;
11361 }
11362 .ios .row .tablet-25 {
11363 width: 25%;
11364 width: calc((100% - 15px*3) / 4);
11365 }
11366 .ios .row.no-gap .tablet-25 {
11367 width: 25%;
11368 }
11369 .ios .row .tablet-20 {
11370 width: 20%;
11371 width: calc((100% - 15px*4) / 5);
11372 }
11373 .ios .row.no-gap .tablet-20 {
11374 width: 20%;
11375 }
11376 .ios .row .tablet-15 {
11377 width: 15%;
11378 width: calc((100% - 15px*5.666666666666667) / 6.666666666666667);
11379 }
11380 .ios .row.no-gap .tablet-15 {
11381 width: 15%;
11382 }
11383 .ios .row .tablet-10 {
11384 width: 10%;
11385 width: calc((100% - 15px*9) / 10);
11386 }
11387 .ios .row.no-gap .tablet-10 {
11388 width: 10%;
11389 }
11390 .ios .row .tablet-5 {
11391 width: 5%;
11392 width: calc((100% - 15px*19) / 20);
11393 }
11394 .ios .row.no-gap .tablet-5 {
11395 width: 5%;
11396 }
11397 .ios .row .tablet-auto:nth-last-child(1),
11398 .ios .row .tablet-auto:nth-last-child(1) ~ .tablet-auto {
11399 width: 100%;
11400 width: calc((100% - 15px*0) / 1);
11401 }
11402 .ios .row.no-gap .tablet-auto:nth-last-child(1),
11403 .ios .row.no-gap .tablet-auto:nth-last-child(1) ~ .tablet-auto {
11404 width: 100%;
11405 }
11406 .ios .row .tablet-auto:nth-last-child(2),
11407 .ios .row .tablet-auto:nth-last-child(2) ~ .tablet-auto {
11408 width: 50%;
11409 width: calc((100% - 15px*1) / 2);
11410 }
11411 .ios .row.no-gap .tablet-auto:nth-last-child(2),
11412 .ios .row.no-gap .tablet-auto:nth-last-child(2) ~ .tablet-auto {
11413 width: 50%;
11414 }
11415 .ios .row .tablet-auto:nth-last-child(3),
11416 .ios .row .tablet-auto:nth-last-child(3) ~ .tablet-auto {
11417 width: 33.33333333%;
11418 width: calc((100% - 15px*2) / 3);
11419 }
11420 .ios .row.no-gap .tablet-auto:nth-last-child(3),
11421 .ios .row.no-gap .tablet-auto:nth-last-child(3) ~ .tablet-auto {
11422 width: 33.33333333%;
11423 }
11424 .ios .row .tablet-auto:nth-last-child(4),
11425 .ios .row .tablet-auto:nth-last-child(4) ~ .tablet-auto {
11426 width: 25%;
11427 width: calc((100% - 15px*3) / 4);
11428 }
11429 .ios .row.no-gap .tablet-auto:nth-last-child(4),
11430 .ios .row.no-gap .tablet-auto:nth-last-child(4) ~ .tablet-auto {
11431 width: 25%;
11432 }
11433 .ios .row .tablet-auto:nth-last-child(5),
11434 .ios .row .tablet-auto:nth-last-child(5) ~ .tablet-auto {
11435 width: 20%;
11436 width: calc((100% - 15px*4) / 5);
11437 }
11438 .ios .row.no-gap .tablet-auto:nth-last-child(5),
11439 .ios .row.no-gap .tablet-auto:nth-last-child(5) ~ .tablet-auto {
11440 width: 20%;
11441 }
11442 .ios .row .tablet-auto:nth-last-child(6),
11443 .ios .row .tablet-auto:nth-last-child(6) ~ .tablet-auto {
11444 width: 16.66666667%;
11445 width: calc((100% - 15px*5) / 6);
11446 }
11447 .ios .row.no-gap .tablet-auto:nth-last-child(6),
11448 .ios .row.no-gap .tablet-auto:nth-last-child(6) ~ .tablet-auto {
11449 width: 16.66666667%;
11450 }
11451 .ios .row .tablet-auto:nth-last-child(7),
11452 .ios .row .tablet-auto:nth-last-child(7) ~ .tablet-auto {
11453 width: 14.28571429%;
11454 width: calc((100% - 15px*6) / 7);
11455 }
11456 .ios .row.no-gap .tablet-auto:nth-last-child(7),
11457 .ios .row.no-gap .tablet-auto:nth-last-child(7) ~ .tablet-auto {
11458 width: 14.28571429%;
11459 }
11460 .ios .row .tablet-auto:nth-last-child(8),
11461 .ios .row .tablet-auto:nth-last-child(8) ~ .tablet-auto {
11462 width: 12.5%;
11463 width: calc((100% - 15px*7) / 8);
11464 }
11465 .ios .row.no-gap .tablet-auto:nth-last-child(8),
11466 .ios .row.no-gap .tablet-auto:nth-last-child(8) ~ .tablet-auto {
11467 width: 12.5%;
11468 }
11469 .ios .row .tablet-auto:nth-last-child(9),
11470 .ios .row .tablet-auto:nth-last-child(9) ~ .tablet-auto {
11471 width: 11.11111111%;
11472 width: calc((100% - 15px*8) / 9);
11473 }
11474 .ios .row.no-gap .tablet-auto:nth-last-child(9),
11475 .ios .row.no-gap .tablet-auto:nth-last-child(9) ~ .tablet-auto {
11476 width: 11.11111111%;
11477 }
11478 .ios .row .tablet-auto:nth-last-child(10),
11479 .ios .row .tablet-auto:nth-last-child(10) ~ .tablet-auto {
11480 width: 10%;
11481 width: calc((100% - 15px*9) / 10);
11482 }
11483 .ios .row.no-gap .tablet-auto:nth-last-child(10),
11484 .ios .row.no-gap .tablet-auto:nth-last-child(10) ~ .tablet-auto {
11485 width: 10%;
11486 }
11487 .ios .row .tablet-auto:nth-last-child(11),
11488 .ios .row .tablet-auto:nth-last-child(11) ~ .tablet-auto {
11489 width: 9.09090909%;
11490 width: calc((100% - 15px*10) / 11);
11491 }
11492 .ios .row.no-gap .tablet-auto:nth-last-child(11),
11493 .ios .row.no-gap .tablet-auto:nth-last-child(11) ~ .tablet-auto {
11494 width: 9.09090909%;
11495 }
11496 .ios .row .tablet-auto:nth-last-child(12),
11497 .ios .row .tablet-auto:nth-last-child(12) ~ .tablet-auto {
11498 width: 8.33333333%;
11499 width: calc((100% - 15px*11) / 12);
11500 }
11501 .ios .row.no-gap .tablet-auto:nth-last-child(12),
11502 .ios .row.no-gap .tablet-auto:nth-last-child(12) ~ .tablet-auto {
11503 width: 8.33333333%;
11504 }
11505 .ios .row .tablet-auto:nth-last-child(13),
11506 .ios .row .tablet-auto:nth-last-child(13) ~ .tablet-auto {
11507 width: 7.69230769%;
11508 width: calc((100% - 15px*12) / 13);
11509 }
11510 .ios .row.no-gap .tablet-auto:nth-last-child(13),
11511 .ios .row.no-gap .tablet-auto:nth-last-child(13) ~ .tablet-auto {
11512 width: 7.69230769%;
11513 }
11514 .ios .row .tablet-auto:nth-last-child(14),
11515 .ios .row .tablet-auto:nth-last-child(14) ~ .tablet-auto {
11516 width: 7.14285714%;
11517 width: calc((100% - 15px*13) / 14);
11518 }
11519 .ios .row.no-gap .tablet-auto:nth-last-child(14),
11520 .ios .row.no-gap .tablet-auto:nth-last-child(14) ~ .tablet-auto {
11521 width: 7.14285714%;
11522 }
11523 .ios .row .tablet-auto:nth-last-child(15),
11524 .ios .row .tablet-auto:nth-last-child(15) ~ .tablet-auto {
11525 width: 6.66666667%;
11526 width: calc((100% - 15px*14) / 15);
11527 }
11528 .ios .row.no-gap .tablet-auto:nth-last-child(15),
11529 .ios .row.no-gap .tablet-auto:nth-last-child(15) ~ .tablet-auto {
11530 width: 6.66666667%;
11531 }
11532 .ios .row .tablet-auto:nth-last-child(16),
11533 .ios .row .tablet-auto:nth-last-child(16) ~ .tablet-auto {
11534 width: 6.25%;
11535 width: calc((100% - 15px*15) / 16);
11536 }
11537 .ios .row.no-gap .tablet-auto:nth-last-child(16),
11538 .ios .row.no-gap .tablet-auto:nth-last-child(16) ~ .tablet-auto {
11539 width: 6.25%;
11540 }
11541 .ios .row .tablet-auto:nth-last-child(17),
11542 .ios .row .tablet-auto:nth-last-child(17) ~ .tablet-auto {
11543 width: 5.88235294%;
11544 width: calc((100% - 15px*16) / 17);
11545 }
11546 .ios .row.no-gap .tablet-auto:nth-last-child(17),
11547 .ios .row.no-gap .tablet-auto:nth-last-child(17) ~ .tablet-auto {
11548 width: 5.88235294%;
11549 }
11550 .ios .row .tablet-auto:nth-last-child(18),
11551 .ios .row .tablet-auto:nth-last-child(18) ~ .tablet-auto {
11552 width: 5.55555556%;
11553 width: calc((100% - 15px*17) / 18);
11554 }
11555 .ios .row.no-gap .tablet-auto:nth-last-child(18),
11556 .ios .row.no-gap .tablet-auto:nth-last-child(18) ~ .tablet-auto {
11557 width: 5.55555556%;
11558 }
11559 .ios .row .tablet-auto:nth-last-child(19),
11560 .ios .row .tablet-auto:nth-last-child(19) ~ .tablet-auto {
11561 width: 5.26315789%;
11562 width: calc((100% - 15px*18) / 19);
11563 }
11564 .ios .row.no-gap .tablet-auto:nth-last-child(19),
11565 .ios .row.no-gap .tablet-auto:nth-last-child(19) ~ .tablet-auto {
11566 width: 5.26315789%;
11567 }
11568 .ios .row .tablet-auto:nth-last-child(20),
11569 .ios .row .tablet-auto:nth-last-child(20) ~ .tablet-auto {
11570 width: 5%;
11571 width: calc((100% - 15px*19) / 20);
11572 }
11573 .ios .row.no-gap .tablet-auto:nth-last-child(20),
11574 .ios .row.no-gap .tablet-auto:nth-last-child(20) ~ .tablet-auto {
11575 width: 5%;
11576 }
11577 .ios .row .tablet-auto:nth-last-child(21),
11578 .ios .row .tablet-auto:nth-last-child(21) ~ .tablet-auto {
11579 width: 4.76190476%;
11580 width: calc((100% - 15px*20) / 21);
11581 }
11582 .ios .row.no-gap .tablet-auto:nth-last-child(21),
11583 .ios .row.no-gap .tablet-auto:nth-last-child(21) ~ .tablet-auto {
11584 width: 4.76190476%;
11585 }
11586}
11587@media (min-width: 1025px) {
11588 .ios .row .desktop-100 {
11589 width: 100%;
11590 width: calc((100% - 15px*0) / 1);
11591 }
11592 .ios .row.no-gap .desktop-100 {
11593 width: 100%;
11594 }
11595 .ios .row .desktop-95 {
11596 width: 95%;
11597 width: calc((100% - 15px*0.05263157894736836) / 1.0526315789473684);
11598 }
11599 .ios .row.no-gap .desktop-95 {
11600 width: 95%;
11601 }
11602 .ios .row .desktop-90 {
11603 width: 90%;
11604 width: calc((100% - 15px*0.11111111111111116) / 1.1111111111111112);
11605 }
11606 .ios .row.no-gap .desktop-90 {
11607 width: 90%;
11608 }
11609 .ios .row .desktop-85 {
11610 width: 85%;
11611 width: calc((100% - 15px*0.17647058823529416) / 1.1764705882352942);
11612 }
11613 .ios .row.no-gap .desktop-85 {
11614 width: 85%;
11615 }
11616 .ios .row .desktop-80 {
11617 width: 80%;
11618 width: calc((100% - 15px*0.25) / 1.25);
11619 }
11620 .ios .row.no-gap .desktop-80 {
11621 width: 80%;
11622 }
11623 .ios .row .desktop-75 {
11624 width: 75%;
11625 width: calc((100% - 15px*0.33333333333333326) / 1.3333333333333333);
11626 }
11627 .ios .row.no-gap .desktop-75 {
11628 width: 75%;
11629 }
11630 .ios .row .desktop-70 {
11631 width: 70%;
11632 width: calc((100% - 15px*0.4285714285714286) / 1.4285714285714286);
11633 }
11634 .ios .row.no-gap .desktop-70 {
11635 width: 70%;
11636 }
11637 .ios .row .desktop-66 {
11638 width: 66.66666666666666%;
11639 width: calc((100% - 15px*0.5000000000000002) / 1.5000000000000002);
11640 }
11641 .ios .row.no-gap .desktop-66 {
11642 width: 66.66666666666666%;
11643 }
11644 .ios .row .desktop-65 {
11645 width: 65%;
11646 width: calc((100% - 15px*0.5384615384615385) / 1.5384615384615385);
11647 }
11648 .ios .row.no-gap .desktop-65 {
11649 width: 65%;
11650 }
11651 .ios .row .desktop-60 {
11652 width: 60%;
11653 width: calc((100% - 15px*0.6666666666666667) / 1.6666666666666667);
11654 }
11655 .ios .row.no-gap .desktop-60 {
11656 width: 60%;
11657 }
11658 .ios .row .desktop-55 {
11659 width: 55%;
11660 width: calc((100% - 15px*0.8181818181818181) / 1.8181818181818181);
11661 }
11662 .ios .row.no-gap .desktop-55 {
11663 width: 55%;
11664 }
11665 .ios .row .desktop-50 {
11666 width: 50%;
11667 width: calc((100% - 15px*1) / 2);
11668 }
11669 .ios .row.no-gap .desktop-50 {
11670 width: 50%;
11671 }
11672 .ios .row .desktop-45 {
11673 width: 45%;
11674 width: calc((100% - 15px*1.2222222222222223) / 2.2222222222222223);
11675 }
11676 .ios .row.no-gap .desktop-45 {
11677 width: 45%;
11678 }
11679 .ios .row .desktop-40 {
11680 width: 40%;
11681 width: calc((100% - 15px*1.5) / 2.5);
11682 }
11683 .ios .row.no-gap .desktop-40 {
11684 width: 40%;
11685 }
11686 .ios .row .desktop-35 {
11687 width: 35%;
11688 width: calc((100% - 15px*1.8571428571428572) / 2.857142857142857);
11689 }
11690 .ios .row.no-gap .desktop-35 {
11691 width: 35%;
11692 }
11693 .ios .row .desktop-33 {
11694 width: 33.333333333333336%;
11695 width: calc((100% - 15px*2) / 3);
11696 }
11697 .ios .row.no-gap .desktop-33 {
11698 width: 33.333333333333336%;
11699 }
11700 .ios .row .desktop-30 {
11701 width: 30%;
11702 width: calc((100% - 15px*2.3333333333333335) / 3.3333333333333335);
11703 }
11704 .ios .row.no-gap .desktop-30 {
11705 width: 30%;
11706 }
11707 .ios .row .desktop-25 {
11708 width: 25%;
11709 width: calc((100% - 15px*3) / 4);
11710 }
11711 .ios .row.no-gap .desktop-25 {
11712 width: 25%;
11713 }
11714 .ios .row .desktop-20 {
11715 width: 20%;
11716 width: calc((100% - 15px*4) / 5);
11717 }
11718 .ios .row.no-gap .desktop-20 {
11719 width: 20%;
11720 }
11721 .ios .row .desktop-15 {
11722 width: 15%;
11723 width: calc((100% - 15px*5.666666666666667) / 6.666666666666667);
11724 }
11725 .ios .row.no-gap .desktop-15 {
11726 width: 15%;
11727 }
11728 .ios .row .desktop-10 {
11729 width: 10%;
11730 width: calc((100% - 15px*9) / 10);
11731 }
11732 .ios .row.no-gap .desktop-10 {
11733 width: 10%;
11734 }
11735 .ios .row .desktop-5 {
11736 width: 5%;
11737 width: calc((100% - 15px*19) / 20);
11738 }
11739 .ios .row.no-gap .desktop-5 {
11740 width: 5%;
11741 }
11742 .ios .row .desktop-auto:nth-last-child(1),
11743 .ios .row .desktop-auto:nth-last-child(1) ~ .desktop-auto {
11744 width: 100%;
11745 width: calc((100% - 15px*0) / 1);
11746 }
11747 .ios .row.no-gap .desktop-auto:nth-last-child(1),
11748 .ios .row.no-gap .desktop-auto:nth-last-child(1) ~ .desktop-auto {
11749 width: 100%;
11750 }
11751 .ios .row .desktop-auto:nth-last-child(2),
11752 .ios .row .desktop-auto:nth-last-child(2) ~ .desktop-auto {
11753 width: 50%;
11754 width: calc((100% - 15px*1) / 2);
11755 }
11756 .ios .row.no-gap .desktop-auto:nth-last-child(2),
11757 .ios .row.no-gap .desktop-auto:nth-last-child(2) ~ .desktop-auto {
11758 width: 50%;
11759 }
11760 .ios .row .desktop-auto:nth-last-child(3),
11761 .ios .row .desktop-auto:nth-last-child(3) ~ .desktop-auto {
11762 width: 33.33333333%;
11763 width: calc((100% - 15px*2) / 3);
11764 }
11765 .ios .row.no-gap .desktop-auto:nth-last-child(3),
11766 .ios .row.no-gap .desktop-auto:nth-last-child(3) ~ .desktop-auto {
11767 width: 33.33333333%;
11768 }
11769 .ios .row .desktop-auto:nth-last-child(4),
11770 .ios .row .desktop-auto:nth-last-child(4) ~ .desktop-auto {
11771 width: 25%;
11772 width: calc((100% - 15px*3) / 4);
11773 }
11774 .ios .row.no-gap .desktop-auto:nth-last-child(4),
11775 .ios .row.no-gap .desktop-auto:nth-last-child(4) ~ .desktop-auto {
11776 width: 25%;
11777 }
11778 .ios .row .desktop-auto:nth-last-child(5),
11779 .ios .row .desktop-auto:nth-last-child(5) ~ .desktop-auto {
11780 width: 20%;
11781 width: calc((100% - 15px*4) / 5);
11782 }
11783 .ios .row.no-gap .desktop-auto:nth-last-child(5),
11784 .ios .row.no-gap .desktop-auto:nth-last-child(5) ~ .desktop-auto {
11785 width: 20%;
11786 }
11787 .ios .row .desktop-auto:nth-last-child(6),
11788 .ios .row .desktop-auto:nth-last-child(6) ~ .desktop-auto {
11789 width: 16.66666667%;
11790 width: calc((100% - 15px*5) / 6);
11791 }
11792 .ios .row.no-gap .desktop-auto:nth-last-child(6),
11793 .ios .row.no-gap .desktop-auto:nth-last-child(6) ~ .desktop-auto {
11794 width: 16.66666667%;
11795 }
11796 .ios .row .desktop-auto:nth-last-child(7),
11797 .ios .row .desktop-auto:nth-last-child(7) ~ .desktop-auto {
11798 width: 14.28571429%;
11799 width: calc((100% - 15px*6) / 7);
11800 }
11801 .ios .row.no-gap .desktop-auto:nth-last-child(7),
11802 .ios .row.no-gap .desktop-auto:nth-last-child(7) ~ .desktop-auto {
11803 width: 14.28571429%;
11804 }
11805 .ios .row .desktop-auto:nth-last-child(8),
11806 .ios .row .desktop-auto:nth-last-child(8) ~ .desktop-auto {
11807 width: 12.5%;
11808 width: calc((100% - 15px*7) / 8);
11809 }
11810 .ios .row.no-gap .desktop-auto:nth-last-child(8),
11811 .ios .row.no-gap .desktop-auto:nth-last-child(8) ~ .desktop-auto {
11812 width: 12.5%;
11813 }
11814 .ios .row .desktop-auto:nth-last-child(9),
11815 .ios .row .desktop-auto:nth-last-child(9) ~ .desktop-auto {
11816 width: 11.11111111%;
11817 width: calc((100% - 15px*8) / 9);
11818 }
11819 .ios .row.no-gap .desktop-auto:nth-last-child(9),
11820 .ios .row.no-gap .desktop-auto:nth-last-child(9) ~ .desktop-auto {
11821 width: 11.11111111%;
11822 }
11823 .ios .row .desktop-auto:nth-last-child(10),
11824 .ios .row .desktop-auto:nth-last-child(10) ~ .desktop-auto {
11825 width: 10%;
11826 width: calc((100% - 15px*9) / 10);
11827 }
11828 .ios .row.no-gap .desktop-auto:nth-last-child(10),
11829 .ios .row.no-gap .desktop-auto:nth-last-child(10) ~ .desktop-auto {
11830 width: 10%;
11831 }
11832 .ios .row .desktop-auto:nth-last-child(11),
11833 .ios .row .desktop-auto:nth-last-child(11) ~ .desktop-auto {
11834 width: 9.09090909%;
11835 width: calc((100% - 15px*10) / 11);
11836 }
11837 .ios .row.no-gap .desktop-auto:nth-last-child(11),
11838 .ios .row.no-gap .desktop-auto:nth-last-child(11) ~ .desktop-auto {
11839 width: 9.09090909%;
11840 }
11841 .ios .row .desktop-auto:nth-last-child(12),
11842 .ios .row .desktop-auto:nth-last-child(12) ~ .desktop-auto {
11843 width: 8.33333333%;
11844 width: calc((100% - 15px*11) / 12);
11845 }
11846 .ios .row.no-gap .desktop-auto:nth-last-child(12),
11847 .ios .row.no-gap .desktop-auto:nth-last-child(12) ~ .desktop-auto {
11848 width: 8.33333333%;
11849 }
11850 .ios .row .desktop-auto:nth-last-child(13),
11851 .ios .row .desktop-auto:nth-last-child(13) ~ .desktop-auto {
11852 width: 7.69230769%;
11853 width: calc((100% - 15px*12) / 13);
11854 }
11855 .ios .row.no-gap .desktop-auto:nth-last-child(13),
11856 .ios .row.no-gap .desktop-auto:nth-last-child(13) ~ .desktop-auto {
11857 width: 7.69230769%;
11858 }
11859 .ios .row .desktop-auto:nth-last-child(14),
11860 .ios .row .desktop-auto:nth-last-child(14) ~ .desktop-auto {
11861 width: 7.14285714%;
11862 width: calc((100% - 15px*13) / 14);
11863 }
11864 .ios .row.no-gap .desktop-auto:nth-last-child(14),
11865 .ios .row.no-gap .desktop-auto:nth-last-child(14) ~ .desktop-auto {
11866 width: 7.14285714%;
11867 }
11868 .ios .row .desktop-auto:nth-last-child(15),
11869 .ios .row .desktop-auto:nth-last-child(15) ~ .desktop-auto {
11870 width: 6.66666667%;
11871 width: calc((100% - 15px*14) / 15);
11872 }
11873 .ios .row.no-gap .desktop-auto:nth-last-child(15),
11874 .ios .row.no-gap .desktop-auto:nth-last-child(15) ~ .desktop-auto {
11875 width: 6.66666667%;
11876 }
11877 .ios .row .desktop-auto:nth-last-child(16),
11878 .ios .row .desktop-auto:nth-last-child(16) ~ .desktop-auto {
11879 width: 6.25%;
11880 width: calc((100% - 15px*15) / 16);
11881 }
11882 .ios .row.no-gap .desktop-auto:nth-last-child(16),
11883 .ios .row.no-gap .desktop-auto:nth-last-child(16) ~ .desktop-auto {
11884 width: 6.25%;
11885 }
11886 .ios .row .desktop-auto:nth-last-child(17),
11887 .ios .row .desktop-auto:nth-last-child(17) ~ .desktop-auto {
11888 width: 5.88235294%;
11889 width: calc((100% - 15px*16) / 17);
11890 }
11891 .ios .row.no-gap .desktop-auto:nth-last-child(17),
11892 .ios .row.no-gap .desktop-auto:nth-last-child(17) ~ .desktop-auto {
11893 width: 5.88235294%;
11894 }
11895 .ios .row .desktop-auto:nth-last-child(18),
11896 .ios .row .desktop-auto:nth-last-child(18) ~ .desktop-auto {
11897 width: 5.55555556%;
11898 width: calc((100% - 15px*17) / 18);
11899 }
11900 .ios .row.no-gap .desktop-auto:nth-last-child(18),
11901 .ios .row.no-gap .desktop-auto:nth-last-child(18) ~ .desktop-auto {
11902 width: 5.55555556%;
11903 }
11904 .ios .row .desktop-auto:nth-last-child(19),
11905 .ios .row .desktop-auto:nth-last-child(19) ~ .desktop-auto {
11906 width: 5.26315789%;
11907 width: calc((100% - 15px*18) / 19);
11908 }
11909 .ios .row.no-gap .desktop-auto:nth-last-child(19),
11910 .ios .row.no-gap .desktop-auto:nth-last-child(19) ~ .desktop-auto {
11911 width: 5.26315789%;
11912 }
11913 .ios .row .desktop-auto:nth-last-child(20),
11914 .ios .row .desktop-auto:nth-last-child(20) ~ .desktop-auto {
11915 width: 5%;
11916 width: calc((100% - 15px*19) / 20);
11917 }
11918 .ios .row.no-gap .desktop-auto:nth-last-child(20),
11919 .ios .row.no-gap .desktop-auto:nth-last-child(20) ~ .desktop-auto {
11920 width: 5%;
11921 }
11922 .ios .row .desktop-auto:nth-last-child(21),
11923 .ios .row .desktop-auto:nth-last-child(21) ~ .desktop-auto {
11924 width: 4.76190476%;
11925 width: calc((100% - 15px*20) / 21);
11926 }
11927 .ios .row.no-gap .desktop-auto:nth-last-child(21),
11928 .ios .row.no-gap .desktop-auto:nth-last-child(21) ~ .desktop-auto {
11929 width: 4.76190476%;
11930 }
11931}
11932/* === Calendar/Datepicker === */
11933.calendar {
11934 overflow: hidden;
11935 height: 320px;
11936 width: 100%;
11937 display: -webkit-box;
11938 display: -webkit-flex;
11939 display: -ms-flexbox;
11940 display: flex;
11941 -webkit-box-orient: vertical;
11942 -webkit-box-direction: normal;
11943 -webkit-flex-direction: column;
11944 -ms-flex-direction: column;
11945 flex-direction: column;
11946}
11947.calendar.modal-in {
11948 display: -webkit-box;
11949 display: -webkit-flex;
11950 display: -ms-flexbox;
11951 display: flex;
11952}
11953@media (orientation: landscape) and (max-height: 415px) {
11954 .calendar.calendar-sheet {
11955 height: 220px;
11956 }
11957 .calendar.calendar-modal {
11958 height: calc(100vh - 44px);
11959 }
11960}
11961.calendar.calendar-inline,
11962.calendar.calendar-popover .calendar {
11963 position: relative;
11964}
11965.calendar-modal {
11966 position: absolute;
11967 height: 420px;
11968 overflow: hidden;
11969 top: 50%;
11970 left: 50%;
11971 min-width: 300px;
11972 max-width: 380px;
11973 -webkit-transform: translate3d(-50%, 100%, 0);
11974 transform: translate3d(-50%, 100%, 0);
11975 -webkit-transition-property: -webkit-transform;
11976 transition-property: -webkit-transform;
11977 transition-property: transform;
11978 transition-property: transform, -webkit-transform;
11979 display: -webkit-box;
11980 display: -webkit-flex;
11981 display: -ms-flexbox;
11982 display: flex;
11983 z-index: 12000;
11984 background: #fff;
11985 width: 90%;
11986 border-radius: 4px;
11987 -webkit-box-shadow: 0 19px 38px rgba(0, 0, 0, 0.3), 0 15px 12px rgba(0, 0, 0, 0.22);
11988 box-shadow: 0 19px 38px rgba(0, 0, 0, 0.3), 0 15px 12px rgba(0, 0, 0, 0.22);
11989}
11990.calendar-modal.modal-in,
11991.calendar-modal.modal-out {
11992 -webkit-transition-duration: 400ms;
11993 transition-duration: 400ms;
11994}
11995.calendar-modal.modal-in {
11996 -webkit-transform: translate3d(-50%, -50%, 0);
11997 transform: translate3d(-50%, -50%, 0);
11998}
11999.calendar-modal.modal-out {
12000 -webkit-transform: translate3d(-50%, 100%, 0);
12001 transform: translate3d(-50%, 100%, 0);
12002}
12003.calendar-popover {
12004 width: 320px;
12005}
12006.calendar-popover .calendar {
12007 height: 320px;
12008}
12009.calendar-week-header {
12010 display: -webkit-box;
12011 display: -webkit-flex;
12012 display: -ms-flexbox;
12013 display: flex;
12014 -webkit-box-sizing: border-box;
12015 box-sizing: border-box;
12016 position: relative;
12017 font-size: 11px;
12018}
12019.calendar-week-header .calendar-week-day {
12020 -webkit-flex-shrink: 1;
12021 -ms-flex-negative: 1;
12022 flex-shrink: 1;
12023 width: 14.28571429%;
12024 width: calc(100% / 7);
12025 text-align: center;
12026}
12027.calendar-months {
12028 width: 100%;
12029 height: 100%;
12030 overflow: hidden;
12031 position: relative;
12032 -webkit-flex-shrink: 10;
12033 -ms-flex-negative: 10;
12034 flex-shrink: 10;
12035}
12036.calendar-months-wrapper {
12037 position: relative;
12038 width: 100%;
12039 height: 100%;
12040 -webkit-transition: 300ms;
12041 transition: 300ms;
12042}
12043.calendar-month {
12044 display: -webkit-box;
12045 display: -webkit-flex;
12046 display: -ms-flexbox;
12047 display: flex;
12048 -webkit-box-orient: vertical;
12049 -webkit-box-direction: normal;
12050 -webkit-flex-direction: column;
12051 -ms-flex-direction: column;
12052 flex-direction: column;
12053 width: 100%;
12054 height: 100%;
12055 position: absolute;
12056 left: 0;
12057 top: 0;
12058}
12059.calendar-row {
12060 height: 16.66666667%;
12061 height: calc(100% / 6);
12062 display: -webkit-box;
12063 display: -webkit-flex;
12064 display: -ms-flexbox;
12065 display: flex;
12066 -webkit-flex-shrink: 1;
12067 -ms-flex-negative: 1;
12068 flex-shrink: 1;
12069 width: 100%;
12070 position: relative;
12071 -webkit-box-sizing: border-box;
12072 box-sizing: border-box;
12073}
12074.calendar-day {
12075 -webkit-flex-shrink: 1;
12076 -ms-flex-negative: 1;
12077 flex-shrink: 1;
12078 display: -webkit-box;
12079 display: -webkit-flex;
12080 display: -ms-flexbox;
12081 display: flex;
12082 -webkit-box-pack: center;
12083 -webkit-justify-content: center;
12084 -ms-flex-pack: center;
12085 justify-content: center;
12086 -webkit-box-align: center;
12087 -webkit-align-items: center;
12088 -ms-flex-align: center;
12089 align-items: center;
12090 -webkit-box-sizing: border-box;
12091 box-sizing: border-box;
12092 width: 14.28571429%;
12093 width: calc(100% / 7);
12094 text-align: center;
12095 cursor: pointer;
12096 z-index: 20;
12097 color: #000;
12098 height: 100%;
12099}
12100.calendar-day.calendar-day-prev,
12101.calendar-day.calendar-day-next {
12102 color: #b8b8b8;
12103}
12104.calendar-day.calendar-day-disabled {
12105 color: #d4d4d4;
12106 cursor: auto;
12107}
12108.calendar-day.calendar-day-selected .calendar-day-number {
12109 color: #fff;
12110}
12111.calendar-day .calendar-day-number {
12112 display: inline-block;
12113 border-radius: 100%;
12114 position: relative;
12115}
12116.calendar-day .calendar-day-events {
12117 position: absolute;
12118 display: -webkit-box;
12119 display: -webkit-flex;
12120 display: -ms-flexbox;
12121 display: flex;
12122 left: 0;
12123 width: 100%;
12124 top: 100%;
12125 -webkit-box-align: center;
12126 -webkit-align-items: center;
12127 -ms-flex-align: center;
12128 align-items: center;
12129 -webkit-box-pack: center;
12130 -webkit-justify-content: center;
12131 -ms-flex-pack: center;
12132 justify-content: center;
12133 margin-top: 1px;
12134}
12135.calendar-day .calendar-day-event {
12136 width: 4px;
12137 height: 4px;
12138 border-radius: 50%;
12139}
12140.calendar-day .calendar-day-event + .calendar-day-event {
12141 margin-left: 2px;
12142}
12143.calendar-range .calendar-day.calendar-day-selected {
12144 -webkit-box-align: stretch;
12145 -webkit-align-items: stretch;
12146 -ms-flex-align: stretch;
12147 align-items: stretch;
12148 -webkit-align-content: stretch;
12149 -ms-flex-line-pack: stretch;
12150 align-content: stretch;
12151}
12152.calendar-range .calendar-day.calendar-day-selected .calendar-day-number {
12153 width: 100%;
12154 border-radius: 0;
12155 height: auto;
12156 text-align: center;
12157 display: -webkit-box;
12158 display: -webkit-flex;
12159 display: -ms-flexbox;
12160 display: flex;
12161 -webkit-box-align: center;
12162 -webkit-align-items: center;
12163 -ms-flex-align: center;
12164 align-items: center;
12165 -webkit-box-pack: center;
12166 -webkit-justify-content: center;
12167 -ms-flex-pack: center;
12168 justify-content: center;
12169}
12170.calendar-month-selector,
12171.calendar-year-selector {
12172 display: -webkit-box;
12173 display: -webkit-flex;
12174 display: -ms-flexbox;
12175 display: flex;
12176 -webkit-box-pack: justify;
12177 -webkit-justify-content: space-between;
12178 -ms-flex-pack: justify;
12179 justify-content: space-between;
12180 -webkit-box-align: center;
12181 -webkit-align-items: center;
12182 -ms-flex-align: center;
12183 align-items: center;
12184 width: 50%;
12185 max-width: 200px;
12186 -webkit-flex-shrink: 10;
12187 -ms-flex-negative: 10;
12188 flex-shrink: 10;
12189}
12190.calendar-month-selector .calendar-day-number,
12191.calendar-year-selector .calendar-day-number {
12192 -webkit-flex-shrink: 1;
12193 -ms-flex-negative: 1;
12194 flex-shrink: 1;
12195 position: relative;
12196 overflow: hidden;
12197 text-overflow: ellipsis;
12198}
12199.ios .calendar-header {
12200 height: 44px;
12201 background: #f7f7f8;
12202 font-size: 17px;
12203 line-height: 44px;
12204 font-weight: 600;
12205 padding: 0 8px;
12206 position: relative;
12207 overflow: hidden;
12208 white-space: nowrap;
12209 text-overflow: ellipsis;
12210 -webkit-box-sizing: border-box;
12211 box-sizing: border-box;
12212}
12213.ios .calendar-footer {
12214 position: relative;
12215 padding: 0 8px;
12216 width: 100%;
12217 height: 44px;
12218 background: #f7f7f8;
12219 display: -webkit-box;
12220 display: -webkit-flex;
12221 display: -ms-flexbox;
12222 display: flex;
12223 -webkit-box-pack: end;
12224 -webkit-justify-content: flex-end;
12225 -ms-flex-pack: end;
12226 justify-content: flex-end;
12227 -webkit-box-sizing: border-box;
12228 box-sizing: border-box;
12229 font-size: 17px;
12230}
12231.ios .calendar-footer:before {
12232 content: '';
12233 position: absolute;
12234 background-color: #c4c4c4;
12235 display: block;
12236 z-index: 15;
12237 top: 0;
12238 right: auto;
12239 bottom: auto;
12240 left: 0;
12241 height: 1px;
12242 width: 100%;
12243 -webkit-transform-origin: 50% 0%;
12244 transform-origin: 50% 0%;
12245}
12246.ios.device-pixel-ratio-2 .calendar-footer:before {
12247 -webkit-transform: scaleY(0.5);
12248 transform: scaleY(0.5);
12249}
12250.ios.device-pixel-ratio-3 .calendar-footer:before {
12251 -webkit-transform: scaleY(0.33);
12252 transform: scaleY(0.33);
12253}
12254.ios .calendar-week-header {
12255 background: #f7f7f8;
12256 height: 18px;
12257}
12258.ios .calendar-week-header .calendar-week-day {
12259 line-height: 18px;
12260}
12261.ios .calendar-row:before {
12262 content: '';
12263 position: absolute;
12264 background-color: #c4c4c4;
12265 display: block;
12266 z-index: 15;
12267 top: 0;
12268 right: auto;
12269 bottom: auto;
12270 left: 0;
12271 height: 1px;
12272 width: 100%;
12273 -webkit-transform-origin: 50% 0%;
12274 transform-origin: 50% 0%;
12275}
12276.ios.device-pixel-ratio-2 .calendar-row:before {
12277 -webkit-transform: scaleY(0.5);
12278 transform: scaleY(0.5);
12279}
12280.ios.device-pixel-ratio-3 .calendar-row:before {
12281 -webkit-transform: scaleY(0.33);
12282 transform: scaleY(0.33);
12283}
12284.ios .calendar-day {
12285 font-size: 15px;
12286}
12287.ios .calendar-day.calendar-day-today .calendar-day-number {
12288 background: #e3e3e3;
12289}
12290.ios .calendar-day.calendar-day-selected .calendar-day-number {
12291 background: #007aff;
12292}
12293.ios .calendar-day .calendar-day-number {
12294 width: 30px;
12295 height: 30px;
12296 line-height: 30px;
12297}
12298.ios .calendar-day .calendar-day-event {
12299 background: #007aff;
12300}
12301.ios .calendar-month-selector a.icon-only,
12302.ios .calendar-year-selector a.icon-only {
12303 min-width: 36px;
12304}
12305.ios .calendar-sheet:before {
12306 content: '';
12307 position: absolute;
12308 background-color: #929499;
12309 display: block;
12310 z-index: 15;
12311 top: 0;
12312 right: auto;
12313 bottom: auto;
12314 left: 0;
12315 height: 1px;
12316 width: 100%;
12317 -webkit-transform-origin: 50% 0%;
12318 transform-origin: 50% 0%;
12319}
12320.ios.device-pixel-ratio-2 .calendar-sheet:before {
12321 -webkit-transform: scaleY(0.5);
12322 transform: scaleY(0.5);
12323}
12324.ios.device-pixel-ratio-3 .calendar-sheet:before {
12325 -webkit-transform: scaleY(0.33);
12326 transform: scaleY(0.33);
12327}
12328.ios .calendar-sheet {
12329 background: #fff;
12330}
12331.ios .calendar-sheet:before {
12332 z-index: 600;
12333}
12334.ios .calendar-sheet .toolbar:before {
12335 display: none !important;
12336}
12337.ios .calendar-modal .toolbar:before,
12338.ios .calendar-popover .toolbar:before {
12339 display: none !important;
12340}
12341.ios .calendar-modal .calendar-months:first-child .calendar-row:first-child:before,
12342.ios .calendar-popover .calendar-months:first-child .calendar-row:first-child:before {
12343 display: none !important;
12344}
12345.ios .calendar-popover .toolbar {
12346 background: none;
12347}
12348.ios .calendar-popover .calendar-week-header,
12349.ios .calendar-popover .calendar-header,
12350.ios .calendar-popover .calendar-footer {
12351 background: none;
12352}
12353.ios.device-iphone-x .calendar-sheet .sheet-modal-inner {
12354 margin-bottom: constant(safe-area-inset-bottom);
12355 margin-bottom: env(safe-area-inset-bottom);
12356}
12357@media (orientation: landscape) {
12358 .ios.device-iphone-x .ios-left-edge.calendar .calendar-row,
12359 .ios.device-iphone-x .ios-edges.calendar .calendar-row,
12360 .ios.device-iphone-x .popup.calendar .calendar-row,
12361 .ios.device-iphone-x .sheet-modal.calendar .calendar-row,
12362 .ios.device-iphone-x .panel-left.calendar .calendar-row,
12363 .ios.device-iphone-x .ios-left-edge .calendar:not(.no-ios-edges):not(.no-ios-left-edge) .calendar-row,
12364 .ios.device-iphone-x .ios-edges .calendar:not(.no-ios-edges):not(.no-ios-left-edge) .calendar-row,
12365 .ios.device-iphone-x .popup .calendar:not(.no-ios-edges):not(.no-ios-left-edge) .calendar-row,
12366 .ios.device-iphone-x .sheet-modal .calendar:not(.no-ios-edges):not(.no-ios-left-edge) .calendar-row,
12367 .ios.device-iphone-x .panel-left .calendar:not(.no-ios-edges):not(.no-ios-left-edge) .calendar-row,
12368 .ios.device-iphone-x .ios-left-edge.calendar .calendar-week-header,
12369 .ios.device-iphone-x .ios-edges.calendar .calendar-week-header,
12370 .ios.device-iphone-x .popup.calendar .calendar-week-header,
12371 .ios.device-iphone-x .sheet-modal.calendar .calendar-week-header,
12372 .ios.device-iphone-x .panel-left.calendar .calendar-week-header,
12373 .ios.device-iphone-x .ios-left-edge .calendar:not(.no-ios-edges):not(.no-ios-left-edge) .calendar-week-header,
12374 .ios.device-iphone-x .ios-edges .calendar:not(.no-ios-edges):not(.no-ios-left-edge) .calendar-week-header,
12375 .ios.device-iphone-x .popup .calendar:not(.no-ios-edges):not(.no-ios-left-edge) .calendar-week-header,
12376 .ios.device-iphone-x .sheet-modal .calendar:not(.no-ios-edges):not(.no-ios-left-edge) .calendar-week-header,
12377 .ios.device-iphone-x .panel-left .calendar:not(.no-ios-edges):not(.no-ios-left-edge) .calendar-week-header {
12378 padding-left: constant(safe-area-inset-left);
12379 padding-left: env(safe-area-inset-left);
12380 }
12381 .ios.device-iphone-x .ios-right-edge.calendar .calendar-row,
12382 .ios.device-iphone-x .ios-edges.calendar .calendar-row,
12383 .ios.device-iphone-x .popup.calendar .calendar-row,
12384 .ios.device-iphone-x .sheet-modal.calendar .calendar-row,
12385 .ios.device-iphone-x .panel-right.calendar .calendar-row,
12386 .ios.device-iphone-x .ios-right-edge .calendar:not(.no-ios-edges):not(.no-ios-right-edge) .calendar-row,
12387 .ios.device-iphone-x .ios-edges .calendar:not(.no-ios-edges):not(.no-ios-right-edge) .calendar-row,
12388 .ios.device-iphone-x .popup .calendar:not(.no-ios-edges):not(.no-ios-right-edge) .calendar-row,
12389 .ios.device-iphone-x .sheet-modal .calendar:not(.no-ios-edges):not(.no-ios-right-edge) .calendar-row,
12390 .ios.device-iphone-x .panel-right .calendar:not(.no-ios-edges):not(.no-ios-right-edge) .calendar-row,
12391 .ios.device-iphone-x .ios-right-edge.calendar .calendar-week-header,
12392 .ios.device-iphone-x .ios-edges.calendar .calendar-week-header,
12393 .ios.device-iphone-x .popup.calendar .calendar-week-header,
12394 .ios.device-iphone-x .sheet-modal.calendar .calendar-week-header,
12395 .ios.device-iphone-x .panel-right.calendar .calendar-week-header,
12396 .ios.device-iphone-x .ios-right-edge .calendar:not(.no-ios-edges):not(.no-ios-right-edge) .calendar-week-header,
12397 .ios.device-iphone-x .ios-edges .calendar:not(.no-ios-edges):not(.no-ios-right-edge) .calendar-week-header,
12398 .ios.device-iphone-x .popup .calendar:not(.no-ios-edges):not(.no-ios-right-edge) .calendar-week-header,
12399 .ios.device-iphone-x .sheet-modal .calendar:not(.no-ios-edges):not(.no-ios-right-edge) .calendar-week-header,
12400 .ios.device-iphone-x .panel-right .calendar:not(.no-ios-edges):not(.no-ios-right-edge) .calendar-week-header {
12401 padding-right: constant(safe-area-inset-right);
12402 padding-right: env(safe-area-inset-right);
12403 }
12404}
12405.ios .theme-dark .calendar .calendar-header,
12406.calendar.ios .theme-dark .calendar-header,
12407.ios .theme-dark .calendar .calendar-week-header,
12408.calendar.ios .theme-dark .calendar-week-header,
12409.ios .theme-dark .calendar .calendar-footer,
12410.calendar.ios .theme-dark .calendar-footer {
12411 background-color: #1b1b1b;
12412}
12413.ios .theme-dark .calendar-popover .calendar-week-header {
12414 background-color: transparent;
12415}
12416.ios .theme-dark .calendar-footer:before,
12417.ios .theme-dark .calendar-row:before,
12418.ios .theme-dark .calendar-sheet:before {
12419 background-color: #282829;
12420}
12421.ios .theme-dark .calendar-day {
12422 color: #fff;
12423}
12424.ios .theme-dark .calendar-day.calendar-day-today:not(.calendar-day-selected) .calendar-day-number {
12425 background: #333;
12426}
12427.ios .theme-dark .calendar-day.calendar-day-disabled {
12428 color: #8E8E93;
12429}
12430.ios .theme-dark .calendar-day.calendar-day-prev,
12431.ios .theme-dark .calendar-day.calendar-day-next {
12432 color: #555;
12433}
12434.ios .theme-dark .calendar-modal,
12435.calendar-modal.ios .theme-dark,
12436.ios .theme-dark .calendar-sheet {
12437 background: #171717;
12438}
12439.ios .color-theme-red .calendar-day.calendar-day-selected .calendar-day-number,
12440.ios .color-red .calendar-day.calendar-day-selected .calendar-day-number {
12441 background: #ff3b30;
12442}
12443.ios .color-theme-red .calendar-day .calendar-day-event,
12444.ios .color-red .calendar-day .calendar-day-event {
12445 background: #ff3b30;
12446}
12447.ios .color-theme-green .calendar-day.calendar-day-selected .calendar-day-number,
12448.ios .color-green .calendar-day.calendar-day-selected .calendar-day-number {
12449 background: #4cd964;
12450}
12451.ios .color-theme-green .calendar-day .calendar-day-event,
12452.ios .color-green .calendar-day .calendar-day-event {
12453 background: #4cd964;
12454}
12455.ios .color-theme-blue .calendar-day.calendar-day-selected .calendar-day-number,
12456.ios .color-blue .calendar-day.calendar-day-selected .calendar-day-number {
12457 background: #007aff;
12458}
12459.ios .color-theme-blue .calendar-day .calendar-day-event,
12460.ios .color-blue .calendar-day .calendar-day-event {
12461 background: #007aff;
12462}
12463.ios .color-theme-pink .calendar-day.calendar-day-selected .calendar-day-number,
12464.ios .color-pink .calendar-day.calendar-day-selected .calendar-day-number {
12465 background: #ff2d55;
12466}
12467.ios .color-theme-pink .calendar-day .calendar-day-event,
12468.ios .color-pink .calendar-day .calendar-day-event {
12469 background: #ff2d55;
12470}
12471.ios .color-theme-yellow .calendar-day.calendar-day-selected .calendar-day-number,
12472.ios .color-yellow .calendar-day.calendar-day-selected .calendar-day-number {
12473 background: #ffcc00;
12474}
12475.ios .color-theme-yellow .calendar-day .calendar-day-event,
12476.ios .color-yellow .calendar-day .calendar-day-event {
12477 background: #ffcc00;
12478}
12479.ios .color-theme-orange .calendar-day.calendar-day-selected .calendar-day-number,
12480.ios .color-orange .calendar-day.calendar-day-selected .calendar-day-number {
12481 background: #ff9500;
12482}
12483.ios .color-theme-orange .calendar-day .calendar-day-event,
12484.ios .color-orange .calendar-day .calendar-day-event {
12485 background: #ff9500;
12486}
12487.ios .color-theme-gray .calendar-day.calendar-day-selected .calendar-day-number,
12488.ios .color-gray .calendar-day.calendar-day-selected .calendar-day-number {
12489 background: #8e8e93;
12490}
12491.ios .color-theme-gray .calendar-day .calendar-day-event,
12492.ios .color-gray .calendar-day .calendar-day-event {
12493 background: #8e8e93;
12494}
12495.ios .color-theme-white .calendar-day.calendar-day-selected .calendar-day-number,
12496.ios .color-white .calendar-day.calendar-day-selected .calendar-day-number {
12497 background: #ffffff;
12498}
12499.ios .color-theme-white .calendar-day .calendar-day-event,
12500.ios .color-white .calendar-day .calendar-day-event {
12501 background: #ffffff;
12502}
12503.ios .color-theme-black .calendar-day.calendar-day-selected .calendar-day-number,
12504.ios .color-black .calendar-day.calendar-day-selected .calendar-day-number {
12505 background: #000000;
12506}
12507.ios .color-theme-black .calendar-day .calendar-day-event,
12508.ios .color-black .calendar-day .calendar-day-event {
12509 background: #000000;
12510}
12511/* === Picker === */
12512.picker {
12513 width: 100%;
12514 height: 260px;
12515}
12516.picker.picker-inline,
12517.popover .picker {
12518 height: 200px;
12519}
12520@media (orientation: landscape) and (max-height: 415px) {
12521 .picker:not(.picker-inline) {
12522 height: 200px;
12523 }
12524}
12525.picker-popover {
12526 width: 280px;
12527}
12528.picker-columns {
12529 display: -webkit-box;
12530 display: -webkit-flex;
12531 display: -ms-flexbox;
12532 display: flex;
12533 overflow: hidden;
12534 -webkit-box-pack: center;
12535 -webkit-justify-content: center;
12536 -ms-flex-pack: center;
12537 justify-content: center;
12538 padding: 0;
12539 text-align: right;
12540 height: 100%;
12541 position: relative;
12542 -webkit-mask-box-image: linear-gradient(to top, transparent, transparent 5%, white 20%, white 80%, transparent 95%, transparent);
12543}
12544.picker-column {
12545 position: relative;
12546 max-height: 100%;
12547}
12548.picker-column.picker-column-first:before,
12549.picker-column.picker-column-last:after {
12550 height: 100%;
12551 width: 100vw;
12552 position: absolute;
12553 content: '';
12554 top: 0;
12555}
12556.picker-column.picker-column-first:before {
12557 right: 100%;
12558}
12559.picker-column.picker-column-last:after {
12560 left: 100%;
12561}
12562.picker-column.picker-column-left {
12563 text-align: left;
12564}
12565.picker-column.picker-column-center {
12566 text-align: center;
12567}
12568.picker-column.picker-column-right {
12569 text-align: right;
12570}
12571.picker-column.picker-column-divider {
12572 display: -webkit-box;
12573 display: -webkit-flex;
12574 display: -ms-flexbox;
12575 display: flex;
12576 -webkit-box-align: center;
12577 -webkit-align-items: center;
12578 -ms-flex-align: center;
12579 align-items: center;
12580}
12581.picker-items {
12582 -webkit-transition: 300ms;
12583 transition: 300ms;
12584 -webkit-transition-timing-function: ease-out;
12585 transition-timing-function: ease-out;
12586}
12587.picker-item {
12588 height: 36px;
12589 line-height: 36px;
12590 white-space: nowrap;
12591 position: relative;
12592 overflow: hidden;
12593 text-overflow: ellipsis;
12594 left: 0;
12595 top: 0;
12596 width: 100%;
12597 -webkit-box-sizing: border-box;
12598 box-sizing: border-box;
12599 -webkit-transition: 300ms;
12600 transition: 300ms;
12601}
12602.picker-item span {
12603 padding: 0 10px;
12604}
12605.picker-column-absolute .picker-item {
12606 position: absolute;
12607}
12608.picker-item.picker-item-far {
12609 pointer-events: none;
12610}
12611.picker-item.picker-item-selected {
12612 -webkit-transform: translate3d(0, 0, 0) rotateX(0deg);
12613 transform: translate3d(0, 0, 0) rotateX(0deg);
12614}
12615.picker-center-highlight {
12616 height: 36px;
12617 -webkit-box-sizing: border-box;
12618 box-sizing: border-box;
12619 position: absolute;
12620 left: 0;
12621 width: 100%;
12622 top: 50%;
12623 margin-top: -18px;
12624 pointer-events: none;
12625}
12626.picker-3d .picker-columns {
12627 overflow: hidden;
12628 -webkit-perspective: 1200px;
12629 perspective: 1200px;
12630}
12631.picker-3d .picker-column,
12632.picker-3d .picker-items,
12633.picker-3d .picker-item {
12634 -webkit-transform-style: preserve-3d;
12635 transform-style: preserve-3d;
12636}
12637.picker-3d .picker-column {
12638 overflow: visible;
12639}
12640.picker-3d .picker-item {
12641 -webkit-transform-origin: center center -110px;
12642 transform-origin: center center -110px;
12643 -webkit-backface-visibility: hidden;
12644 backface-visibility: hidden;
12645 -webkit-transition-timing-function: ease-out;
12646 transition-timing-function: ease-out;
12647}
12648.ios .picker-columns {
12649 font-size: 24px;
12650}
12651.ios .picker-column-divider {
12652 color: #000;
12653}
12654.ios .picker-item {
12655 color: #707274;
12656}
12657.ios .picker-item.picker-item-selected {
12658 color: #000;
12659}
12660.ios .picker-popover .toolbar {
12661 background: none;
12662}
12663.ios .picker-popover .toolbar:before {
12664 display: none !important;
12665}
12666.ios .picker-popover .picker > .toolbar + .picker-columns {
12667 height: calc(100% - 44px);
12668}
12669.ios .picker-popover .toolbar:after {
12670 content: '';
12671 position: absolute;
12672 background-color: #c4c4c4;
12673 display: block;
12674 z-index: 15;
12675 top: auto;
12676 right: auto;
12677 bottom: 0;
12678 left: 0;
12679 height: 1px;
12680 width: 100%;
12681 -webkit-transform-origin: 50% 100%;
12682 transform-origin: 50% 100%;
12683}
12684.ios.device-pixel-ratio-2 .picker-popover .toolbar:after {
12685 -webkit-transform: scaleY(0.5);
12686 transform: scaleY(0.5);
12687}
12688.ios.device-pixel-ratio-3 .picker-popover .toolbar:after {
12689 -webkit-transform: scaleY(0.33);
12690 transform: scaleY(0.33);
12691}
12692.ios .picker-center-highlight:before {
12693 content: '';
12694 position: absolute;
12695 background-color: #a8abb0;
12696 display: block;
12697 z-index: 15;
12698 top: 0;
12699 right: auto;
12700 bottom: auto;
12701 left: 0;
12702 height: 1px;
12703 width: 100%;
12704 -webkit-transform-origin: 50% 0%;
12705 transform-origin: 50% 0%;
12706}
12707.ios.device-pixel-ratio-2 .picker-center-highlight:before {
12708 -webkit-transform: scaleY(0.5);
12709 transform: scaleY(0.5);
12710}
12711.ios.device-pixel-ratio-3 .picker-center-highlight:before {
12712 -webkit-transform: scaleY(0.33);
12713 transform: scaleY(0.33);
12714}
12715.ios .picker-center-highlight:after {
12716 content: '';
12717 position: absolute;
12718 background-color: #a8abb0;
12719 display: block;
12720 z-index: 15;
12721 top: auto;
12722 right: auto;
12723 bottom: 0;
12724 left: 0;
12725 height: 1px;
12726 width: 100%;
12727 -webkit-transform-origin: 50% 100%;
12728 transform-origin: 50% 100%;
12729}
12730.ios.device-pixel-ratio-2 .picker-center-highlight:after {
12731 -webkit-transform: scaleY(0.5);
12732 transform: scaleY(0.5);
12733}
12734.ios.device-pixel-ratio-3 .picker-center-highlight:after {
12735 -webkit-transform: scaleY(0.33);
12736 transform: scaleY(0.33);
12737}
12738.ios .theme-dark .picker-item.picker-item-selected {
12739 color: #fff;
12740}
12741.ios .theme-dark .picker-popover .toolbar:after,
12742.picker-popover.ios .theme-dark .toolbar:after {
12743 background-color: #282829;
12744}
12745.ios .theme-dark .picker-center-highlight:before {
12746 background-color: #282829;
12747}
12748.ios .theme-dark .picker-center-highlight:after {
12749 background-color: #282829;
12750}
12751/* === Infinite === */
12752.infinite-scroll-preloader {
12753 margin-left: auto;
12754 margin-right: auto;
12755 text-align: center;
12756}
12757.infinite-scroll-preloader.preloader {
12758 display: block;
12759}
12760.ios .infinite-scroll-preloader {
12761 margin-top: 35px;
12762 margin-bottom: 35px;
12763}
12764.ios .infinite-scroll-preloader .preloader,
12765.ios .infinite-scroll-preloader.preloader {
12766 width: 27px;
12767 height: 27px;
12768}
12769/* === PTR === */
12770.ptr-preloader .preloader {
12771 position: absolute;
12772 left: 50%;
12773}
12774.ios .ptr-preloader {
12775 position: relative;
12776 height: 44px;
12777 margin-top: -44px;
12778 width: 100%;
12779 left: 0;
12780 top: 0;
12781}
12782.ios .ptr-preloader .preloader {
12783 width: 27px;
12784 height: 27px;
12785 margin-left: -13px;
12786 margin-top: -13px;
12787 visibility: hidden;
12788 top: 50%;
12789}
12790.ios .ptr-arrow {
12791 position: absolute;
12792 left: 50%;
12793 top: 50%;
12794 background: no-repeat center;
12795 z-index: 10;
12796 -webkit-transform: rotate(0deg) translate3d(0, 0, 0);
12797 transform: rotate(0deg) translate3d(0, 0, 0);
12798 -webkit-transition-duration: 300ms;
12799 transition-duration: 300ms;
12800 -webkit-transition-property: -webkit-transform;
12801 transition-property: -webkit-transform;
12802 transition-property: transform;
12803 transition-property: transform, -webkit-transform;
12804 width: 13px;
12805 height: 20px;
12806 margin-left: -6px;
12807 margin-top: -10px;
12808 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%2026%2040'%3E%3Cpolygon%20points%3D'9%2C22%209%2C0%2017%2C0%2017%2C22%2026%2C22%2013.5%2C40%200%2C22'%20fill%3D'%238c8c8c'%2F%3E%3C%2Fsvg%3E");
12809 background-size: 13px 20px;
12810 visibility: visible;
12811}
12812.ios .ptr-content:not(.ptr-refreshing) .ptr-preloader .preloader {
12813 -webkit-animation: none;
12814 animation: none;
12815}
12816.ios .ptr-transitioning,
12817.ios .ptr-refreshing {
12818 -webkit-transition-duration: 300ms;
12819 transition-duration: 300ms;
12820 -webkit-transition-property: -webkit-transform;
12821 transition-property: -webkit-transform;
12822 transition-property: transform;
12823 transition-property: transform, -webkit-transform;
12824}
12825.ios .ptr-refreshing {
12826 -webkit-transform: translate3d(0, 44px, 0);
12827 transform: translate3d(0, 44px, 0);
12828}
12829.ios .ptr-refreshing .ptr-arrow {
12830 visibility: hidden;
12831}
12832.ios .ptr-refreshing .ptr-preloader .preloader {
12833 visibility: visible;
12834}
12835.ios .ptr-pull-up .ptr-arrow {
12836 -webkit-transform: rotate(180deg) translate3d(0, 0, 0);
12837 transform: rotate(180deg) translate3d(0, 0, 0);
12838}
12839.ios .ptr-no-navbar {
12840 margin-top: -44px;
12841 height: calc(100% + 44px);
12842}
12843.ios .ptr-no-navbar .ptr-preloader {
12844 margin-top: 0;
12845}
12846/* === Images Lazy Loading === */
12847.lazy-loaded.lazy-fade-in {
12848 -webkit-animation: lazyFadeIn 600ms;
12849 animation: lazyFadeIn 600ms;
12850}
12851@-webkit-keyframes lazyFadeIn {
12852 from {
12853 opacity: 0;
12854 }
12855 to {
12856 opacity: 1;
12857 }
12858}
12859@keyframes lazyFadeIn {
12860 from {
12861 opacity: 0;
12862 }
12863 to {
12864 opacity: 1;
12865 }
12866}
12867/* === Data Table === */
12868.data-table {
12869 overflow-x: auto;
12870}
12871.data-table table {
12872 width: 100%;
12873 border: none;
12874 padding: 0;
12875 margin: 0;
12876 border-collapse: collapse;
12877 text-align: left;
12878}
12879.data-table thead {
12880 font-size: 12px;
12881}
12882.data-table thead th,
12883.data-table thead td {
12884 overflow: hidden;
12885 white-space: nowrap;
12886 text-overflow: ellipsis;
12887 line-height: 16px;
12888}
12889.data-table thead i.icon,
12890.data-table thead i.f7-icons,
12891.data-table thead i.material-icons {
12892 vertical-align: top;
12893}
12894.data-table th,
12895.data-table td {
12896 padding: 0;
12897 position: relative;
12898}
12899.data-table th.numeric-cell,
12900.data-table td.numeric-cell {
12901 text-align: right;
12902}
12903.data-table th.checkbox-cell,
12904.data-table td.checkbox-cell {
12905 overflow: visible;
12906}
12907.data-table th.checkbox-cell label + span,
12908.data-table td.checkbox-cell label + span {
12909 margin-left: 8px;
12910}
12911.data-table th.actions-cell,
12912.data-table td.actions-cell {
12913 text-align: right;
12914 white-space: nowrap;
12915}
12916.data-table th a.icon-only,
12917.data-table td a.icon-only,
12918.card .data-table th a.icon-only,
12919.card .data-table td a.icon-only,
12920.card.data-table th a.icon-only,
12921.card.data-table td a.icon-only {
12922 display: inline-block;
12923 vertical-align: middle;
12924 text-align: center;
12925 font-size: 0;
12926 min-width: 0;
12927}
12928.data-table th a.icon-only i,
12929.data-table td a.icon-only i,
12930.card .data-table th a.icon-only i,
12931.card .data-table td a.icon-only i,
12932.card.data-table th a.icon-only i,
12933.card.data-table td a.icon-only i {
12934 font-size: 18px;
12935 vertical-align: middle;
12936}
12937.data-table .sortable-cell:not(.input-cell) {
12938 cursor: pointer;
12939 position: relative;
12940}
12941.data-table .sortable-cell.input-cell .table-head-label {
12942 cursor: pointer;
12943 position: relative;
12944}
12945.data-table .sortable-cell:not(.numeric-cell):not(.input-cell):after,
12946.data-table .sortable-cell.numeric-cell:not(.input-cell):before,
12947.data-table .sortable-cell:not(.numeric-cell).input-cell > .table-head-label:after,
12948.data-table .sortable-cell.numeric-cell.input-cell > .table-head-label:before {
12949 content: '';
12950 display: inline-block;
12951 vertical-align: top;
12952 width: 16px;
12953 height: 16px;
12954 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");
12955 background-size: 100% auto;
12956 background-position: center;
12957 background-repeat: no-repeat;
12958 font-size: 0;
12959 -webkit-transition-duration: 300ms;
12960 transition-duration: 300ms;
12961 -webkit-transform: rotate(0);
12962 transform: rotate(0);
12963 opacity: 0;
12964}
12965html.device-desktop .data-table .sortable-cell:not(.sortable-cell-active):hover:after,
12966html.device-desktop .data-table .sortable-cell:not(.sortable-cell-active) .table-head-label:hover:after,
12967html.device-desktop .data-table .sortable-cell:not(.sortable-cell-active):hover:before,
12968html.device-desktop .data-table .sortable-cell:not(.sortable-cell-active) .table-head-label:hover:before {
12969 opacity: 0.54;
12970}
12971.data-table .sortable-cell.sortable-cell-active:after,
12972.data-table .sortable-cell.sortable-cell-active .table-head-label:after,
12973.data-table .sortable-cell.sortable-cell-active:before,
12974.data-table .sortable-cell.sortable-cell-active .table-head-label:before {
12975 opacity: 0.87 !important;
12976}
12977.data-table .sortable-cell.sortable-desc:after,
12978.data-table .sortable-cell.sortable-desc:after,
12979.data-table .table-head-label:after,
12980.data-table .sortable-cell.sortable-desc:before,
12981.data-table .sortable-cell.sortable-desc:before,
12982.data-table .table-head-label:before {
12983 -webkit-transform: rotate(180deg) !important;
12984 transform: rotate(180deg) !important;
12985}
12986.data-table.card .card-header,
12987.card .data-table .card-header {
12988 height: 64px;
12989}
12990.data-table.card .card-content,
12991.card .data-table .card-content {
12992 overflow-x: auto;
12993}
12994.data-table .data-table-links,
12995.data-table .data-table-actions {
12996 display: -webkit-box;
12997 display: -webkit-flex;
12998 display: -ms-flexbox;
12999 display: flex;
13000}
13001.data-table .data-table-actions {
13002 margin-left: auto;
13003 -webkit-box-align: center;
13004 -webkit-align-items: center;
13005 -ms-flex-align: center;
13006 align-items: center;
13007}
13008.data-table .data-table-actions a.link {
13009 min-width: 0;
13010}
13011.data-table .data-table-actions a.link.icon-only {
13012 line-height: 1;
13013 -webkit-box-pack: center;
13014 -webkit-justify-content: center;
13015 -ms-flex-pack: center;
13016 justify-content: center;
13017 padding: 0;
13018}
13019.data-table .data-table-header,
13020.data-table .data-table-header-selected {
13021 display: -webkit-box;
13022 display: -webkit-flex;
13023 display: -ms-flexbox;
13024 display: flex;
13025 -webkit-box-pack: justify;
13026 -webkit-justify-content: space-between;
13027 -ms-flex-pack: justify;
13028 justify-content: space-between;
13029 -webkit-box-align: center;
13030 -webkit-align-items: center;
13031 -ms-flex-align: center;
13032 align-items: center;
13033 width: 100%;
13034}
13035.data-table .data-table-header-selected {
13036 display: none;
13037}
13038.data-table.data-table-has-checked .data-table-header {
13039 display: none;
13040}
13041.data-table.data-table-has-checked .data-table-header-selected {
13042 display: -webkit-box;
13043 display: -webkit-flex;
13044 display: -ms-flexbox;
13045 display: flex;
13046}
13047.data-table .data-table-title-selected {
13048 font-size: 14px;
13049}
13050.data-table .data-table-footer {
13051 display: -webkit-box;
13052 display: -webkit-flex;
13053 display: -ms-flexbox;
13054 display: flex;
13055 -webkit-box-align: center;
13056 -webkit-align-items: center;
13057 -ms-flex-align: center;
13058 align-items: center;
13059 -webkit-box-sizing: border-box;
13060 box-sizing: border-box;
13061 position: relative;
13062 font-size: 12px;
13063 overflow: hidden;
13064 -webkit-box-pack: end;
13065 -webkit-justify-content: flex-end;
13066 -ms-flex-pack: end;
13067 justify-content: flex-end;
13068}
13069.data-table .data-table-rows-select,
13070.data-table .data-table-pagination {
13071 display: -webkit-box;
13072 display: -webkit-flex;
13073 display: -ms-flexbox;
13074 display: flex;
13075 -webkit-box-align: center;
13076 -webkit-align-items: center;
13077 -ms-flex-align: center;
13078 align-items: center;
13079}
13080@media (max-width: 480px) and (orientation: portrait) {
13081 .data-table.data-table-collapsible thead {
13082 display: none;
13083 }
13084 .data-table.data-table-collapsible tbody,
13085 .data-table.data-table-collapsible tr,
13086 .data-table.data-table-collapsible td {
13087 display: block;
13088 }
13089 .data-table.data-table-collapsible tr {
13090 position: relative;
13091 }
13092 .data-table.data-table-collapsible tr:hover {
13093 background-color: inherit;
13094 }
13095 .data-table.data-table-collapsible td {
13096 display: -webkit-box;
13097 display: -webkit-flex;
13098 display: -ms-flexbox;
13099 display: flex;
13100 -webkit-align-content: center;
13101 -ms-flex-line-pack: center;
13102 align-content: center;
13103 -webkit-box-align: center;
13104 -webkit-align-items: center;
13105 -ms-flex-align: center;
13106 align-items: center;
13107 -webkit-box-pack: start;
13108 -webkit-justify-content: flex-start;
13109 -ms-flex-pack: start;
13110 justify-content: flex-start;
13111 text-align: left;
13112 }
13113 .data-table.data-table-collapsible td:before {
13114 display: none !important;
13115 }
13116 .data-table.data-table-collapsible td:not(.checkbox-cell):before {
13117 width: 40%;
13118 display: block !important;
13119 content: attr(data-collapsible-title);
13120 position: relative;
13121 height: auto;
13122 background: none !important;
13123 -webkit-transform: none !important;
13124 transform: none !important;
13125 font-size: 12px;
13126 margin-right: 16px;
13127 -webkit-flex-shrink: 0;
13128 -ms-flex-negative: 0;
13129 flex-shrink: 0;
13130 }
13131 .data-table.data-table-collapsible td.checkbox-cell {
13132 position: absolute;
13133 top: 0;
13134 left: 0;
13135 }
13136 .data-table.data-table-collapsible td.checkbox-cell + td {
13137 padding-left: 16px;
13138 }
13139 .data-table.data-table-collapsible td.checkbox-cell ~ td {
13140 margin-left: 32px;
13141 }
13142}
13143.data-table .tablet-only,
13144.data-table .tablet-landscape-only {
13145 display: none;
13146}
13147@media (min-width: 768px) {
13148 .data-table .tablet-only {
13149 display: table-cell;
13150 }
13151}
13152@media (min-width: 768px) and (orientation: landscape) {
13153 .data-table .tablet-landscape-only {
13154 display: table-cell;
13155 }
13156}
13157.theme-dark .data-table .sortable-cell:not(.numeric-cell):not(.input-cell):after,
13158.theme-dark .data-table .sortable-cell.numeric-cell:not(.input-cell):before,
13159.theme-dark .data-table .sortable-cell:not(.numeric-cell).input-cell > .table-head-label:after,
13160.theme-dark .data-table .sortable-cell.numeric-cell.input-cell > .table-head-label:before {
13161 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");
13162}
13163.ios .data-table thead th,
13164.ios .data-table thead td {
13165 font-weight: 600;
13166}
13167.ios .data-table thead th:not(.sortable-cell-active),
13168.ios .data-table thead td:not(.sortable-cell-active) {
13169 color: #8e8e93;
13170}
13171.ios .data-table thead i.icon,
13172.ios .data-table thead i.f7-icons {
13173 font-size: 18px;
13174 width: 18px;
13175 height: 18px;
13176}
13177.ios .data-table tbody tr.data-table-row-selected {
13178 background: #f7f7f8;
13179}
13180.ios .data-table th,
13181.ios .data-table td {
13182 padding-left: 15px;
13183 padding-right: 15px;
13184 height: 44px;
13185}
13186.ios .data-table th.checkbox-cell,
13187.ios .data-table td.checkbox-cell {
13188 width: 22px;
13189 padding-right: 7px;
13190}
13191.ios .data-table th.checkbox-cell + td,
13192.ios .data-table td.checkbox-cell + td,
13193.ios .data-table th.checkbox-cell + th,
13194.ios .data-table td.checkbox-cell + th {
13195 padding-left: 8px;
13196}
13197.ios .data-table th.actions-cell a.link + a.link,
13198.ios .data-table td.actions-cell a.link + a.link {
13199 margin-left: 15px;
13200}
13201.ios .data-table th.actions-cell a.icon-only,
13202.ios .data-table td.actions-cell a.icon-only {
13203 width: 18px;
13204 height: 18px;
13205 line-height: 18px;
13206}
13207.ios .sortable-cell:not(.numeric-cell):after {
13208 margin-left: 5px;
13209}
13210.ios .sortable-cell.numeric-cell:before {
13211 margin-right: 5px;
13212}
13213.ios .data-table.card .card-header,
13214.ios .card .data-table .card-header,
13215.ios .data-table.card .card-footer,
13216.ios .card .data-table .card-footer {
13217 padding-left: 15px;
13218 padding-right: 8px;
13219}
13220.ios .data-table-title {
13221 font-size: 17px;
13222 font-weight: 600;
13223}
13224.ios .data-table-links a.link + a.link,
13225.ios .data-table-actions a.link + a.link {
13226 margin-left: 15px;
13227}
13228.ios .data-table-actions a.link.icon-only {
13229 width: 44px;
13230 height: 44px;
13231}
13232.ios .data-table-actions i.icon,
13233.ios .data-table-actions i.f7-icons {
13234 font-size: 22px;
13235}
13236.ios .data-table .card-header > .data-table-header,
13237.ios .data-table .card-header > .data-table-header-selected {
13238 padding-top: 10px;
13239 padding-bottom: 10px;
13240 height: 100%;
13241 padding-left: 15px;
13242 padding-right: 8px;
13243 margin-left: -15px;
13244 margin-right: -8px;
13245}
13246.ios .data-table-header-selected {
13247 background: rgba(0, 122, 255, 0.1);
13248}
13249.ios .data-table-title-selected {
13250 color: #007aff;
13251}
13252.ios .data-table tbody td:before {
13253 content: '';
13254 position: absolute;
13255 background-color: #c8c7cc;
13256 display: block;
13257 z-index: 15;
13258 top: 0;
13259 right: auto;
13260 bottom: auto;
13261 left: 0;
13262 height: 1px;
13263 width: 100%;
13264 -webkit-transform-origin: 50% 0%;
13265 transform-origin: 50% 0%;
13266}
13267.ios.device-pixel-ratio-2 .data-table tbody td:before {
13268 -webkit-transform: scaleY(0.5);
13269 transform: scaleY(0.5);
13270}
13271.ios.device-pixel-ratio-3 .data-table tbody td:before {
13272 -webkit-transform: scaleY(0.33);
13273 transform: scaleY(0.33);
13274}
13275.ios.device-desktop .data-table tbody tr:hover {
13276 background: #f7f7f8;
13277}
13278.ios .data-table-footer {
13279 height: 44px;
13280 color: #8e8e93;
13281}
13282.ios .data-table-rows-select a.link,
13283.ios .data-table-pagination a.link {
13284 width: 44px;
13285 height: 44px;
13286}
13287.ios .data-table-rows-select + .data-table-pagination {
13288 margin-left: 30px;
13289}
13290.ios .data-table-rows-select .input {
13291 margin-left: 20px;
13292}
13293.ios .data-table-pagination-label {
13294 margin-right: 15px;
13295}
13296.ios .data-table-footer:before {
13297 content: '';
13298 position: absolute;
13299 background-color: #c8c7cc;
13300 display: block;
13301 z-index: 15;
13302 top: 0;
13303 right: auto;
13304 bottom: auto;
13305 left: 0;
13306 height: 1px;
13307 width: 100%;
13308 -webkit-transform-origin: 50% 0%;
13309 transform-origin: 50% 0%;
13310}
13311.ios.device-pixel-ratio-2 .data-table-footer:before {
13312 -webkit-transform: scaleY(0.5);
13313 transform: scaleY(0.5);
13314}
13315.ios.device-pixel-ratio-3 .data-table-footer:before {
13316 -webkit-transform: scaleY(0.33);
13317 transform: scaleY(0.33);
13318}
13319.ios .input-cell {
13320 padding-top: 8px;
13321 padding-bottom: 8px;
13322 height: auto;
13323 vertical-align: top;
13324}
13325.ios .input-cell .table-head-label + .input {
13326 margin-top: 4px;
13327}
13328.ios .input-cell .input {
13329 height: 24px;
13330}
13331.ios .input-cell .input input,
13332.ios .input-cell .input textarea,
13333.ios .input-cell .input select {
13334 height: 24px;
13335 color: #000;
13336 font-size: 14px;
13337}
13338@media (max-width: 480px) and (orientation: portrait) {
13339 .ios .data-table.data-table-collapsible td:not(.checkbox-cell):before {
13340 color: #8e8e93;
13341 font-weight: 600;
13342 }
13343 .ios .data-table-collapsible tr:before {
13344 content: '';
13345 position: absolute;
13346 background-color: #c8c7cc;
13347 display: block;
13348 z-index: 15;
13349 top: 0;
13350 right: auto;
13351 bottom: auto;
13352 left: 0;
13353 height: 1px;
13354 width: 100%;
13355 -webkit-transform-origin: 50% 0%;
13356 transform-origin: 50% 0%;
13357 }
13358 .ios.device-pixel-ratio-2 .data-table-collapsible tr:before {
13359 -webkit-transform: scaleY(0.5);
13360 transform: scaleY(0.5);
13361 }
13362 .ios.device-pixel-ratio-3 .data-table-collapsible tr:before {
13363 -webkit-transform: scaleY(0.33);
13364 transform: scaleY(0.33);
13365 }
13366}
13367.ios .theme-dark .data-table tbody td:before,
13368.data-table.ios .theme-dark tbody td:before {
13369 background-color: #282829;
13370}
13371.ios .theme-dark .data-table.data-table-collapsible tr:before,
13372.data-table.ios .theme-dark.data-table-collapsible tr:before {
13373 background-color: #282829;
13374}
13375.ios .theme-dark .data-table tbody tr.data-table-row-selected,
13376.data-table.ios .theme-dark tbody tr.data-table-row-selected {
13377 background-color: #363636;
13378}
13379.ios.device-desktop .theme-dark .data-table tbody tr:hover,
13380.ios.device-desktop .theme-dark.data-table tbody tr:hover {
13381 background: #363636;
13382}
13383.ios .color-theme-red .data-table-header-selected,
13384.ios .data-table-header-selected.color-red {
13385 background: rgba(255, 59, 48, 0.1);
13386}
13387.ios .color-theme-red .data-table-title-selected,
13388.ios .color-red .data-table-title-selected {
13389 color: #ff3b30;
13390}
13391.ios .color-theme-green .data-table-header-selected,
13392.ios .data-table-header-selected.color-green {
13393 background: rgba(76, 217, 100, 0.1);
13394}
13395.ios .color-theme-green .data-table-title-selected,
13396.ios .color-green .data-table-title-selected {
13397 color: #4cd964;
13398}
13399.ios .color-theme-blue .data-table-header-selected,
13400.ios .data-table-header-selected.color-blue {
13401 background: rgba(0, 122, 255, 0.1);
13402}
13403.ios .color-theme-blue .data-table-title-selected,
13404.ios .color-blue .data-table-title-selected {
13405 color: #007aff;
13406}
13407.ios .color-theme-pink .data-table-header-selected,
13408.ios .data-table-header-selected.color-pink {
13409 background: rgba(255, 45, 85, 0.1);
13410}
13411.ios .color-theme-pink .data-table-title-selected,
13412.ios .color-pink .data-table-title-selected {
13413 color: #ff2d55;
13414}
13415.ios .color-theme-yellow .data-table-header-selected,
13416.ios .data-table-header-selected.color-yellow {
13417 background: rgba(255, 204, 0, 0.1);
13418}
13419.ios .color-theme-yellow .data-table-title-selected,
13420.ios .color-yellow .data-table-title-selected {
13421 color: #ffcc00;
13422}
13423.ios .color-theme-orange .data-table-header-selected,
13424.ios .data-table-header-selected.color-orange {
13425 background: rgba(255, 149, 0, 0.1);
13426}
13427.ios .color-theme-orange .data-table-title-selected,
13428.ios .color-orange .data-table-title-selected {
13429 color: #ff9500;
13430}
13431.ios .color-theme-gray .data-table-header-selected,
13432.ios .data-table-header-selected.color-gray {
13433 background: rgba(142, 142, 147, 0.1);
13434}
13435.ios .color-theme-gray .data-table-title-selected,
13436.ios .color-gray .data-table-title-selected {
13437 color: #8e8e93;
13438}
13439.ios .color-theme-white .data-table-header-selected,
13440.ios .data-table-header-selected.color-white {
13441 background: rgba(255, 255, 255, 0.1);
13442}
13443.ios .color-theme-white .data-table-title-selected,
13444.ios .color-white .data-table-title-selected {
13445 color: #ffffff;
13446}
13447.ios .color-theme-black .data-table-header-selected,
13448.ios .data-table-header-selected.color-black {
13449 background: rgba(0, 0, 0, 0.1);
13450}
13451.ios .color-theme-black .data-table-title-selected,
13452.ios .color-black .data-table-title-selected {
13453 color: #000000;
13454}
13455/* === FAB === */
13456.fab {
13457 position: absolute;
13458 z-index: 1500;
13459}
13460.fab > a,
13461.fab-buttons a {
13462 position: relative;
13463 -webkit-transition-duration: 300ms;
13464 transition-duration: 300ms;
13465 display: -webkit-box;
13466 display: -webkit-flex;
13467 display: -ms-flexbox;
13468 display: flex;
13469 -webkit-box-align: center;
13470 -webkit-align-items: center;
13471 -ms-flex-align: center;
13472 align-items: center;
13473 -webkit-box-pack: center;
13474 -webkit-justify-content: center;
13475 -ms-flex-pack: center;
13476 justify-content: center;
13477 overflow: hidden;
13478 z-index: 1;
13479}
13480.fab > a i {
13481 position: absolute;
13482 left: 50%;
13483 top: 50%;
13484 -webkit-transform: translate3d(-50%, -50%, 0) rotate(0deg) scale(1);
13485 transform: translate3d(-50%, -50%, 0) rotate(0deg) scale(1);
13486 -webkit-transition: 300ms;
13487 transition: 300ms;
13488}
13489.fab > a i + i {
13490 -webkit-transform: translate3d(-50%, -50%, 0) rotate(-90deg) scale(0.5);
13491 transform: translate3d(-50%, -50%, 0) rotate(-90deg) scale(0.5);
13492 opacity: 0;
13493}
13494.fab[class*="fab-center"] {
13495 left: 50%;
13496 -webkit-transform: translateX(-50%);
13497 transform: translateX(-50%);
13498}
13499.fab[class*="left-center"],
13500.fab[class*="right-center"] {
13501 top: 50%;
13502 -webkit-transform: translateY(-50%);
13503 transform: translateY(-50%);
13504}
13505.fab[class*="center-center"] {
13506 top: 50%;
13507 left: 50%;
13508 -webkit-transform: translateX(-50%) translateY(-50%);
13509 transform: translateX(-50%) translateY(-50%);
13510}
13511.fab div.fab-buttons a {
13512 width: 40px;
13513 height: 40px;
13514}
13515.fab-buttons {
13516 display: -webkit-box;
13517 display: -webkit-flex;
13518 display: -ms-flexbox;
13519 display: flex;
13520 visibility: hidden;
13521 pointer-events: none;
13522 position: absolute;
13523}
13524.fab-buttons a {
13525 opacity: 0;
13526}
13527.fab-opened:not(.fab-morph) > a i {
13528 -webkit-transform: translate3d(-50%, -50%, 0) rotate(90deg) scale(0.5);
13529 transform: translate3d(-50%, -50%, 0) rotate(90deg) scale(0.5);
13530 opacity: 0;
13531}
13532.fab-opened:not(.fab-morph) > a i + i {
13533 -webkit-transform: translate3d(-50%, -50%, 0) rotate(0deg) scale(1);
13534 transform: translate3d(-50%, -50%, 0) rotate(0deg) scale(1);
13535 opacity: 1;
13536}
13537.fab-opened .fab-buttons {
13538 visibility: visible;
13539 pointer-events: auto;
13540}
13541.fab-opened .fab-buttons a {
13542 opacity: 1;
13543 -webkit-transform: translate3d(0, 0px, 0) scale(1) !important;
13544 transform: translate3d(0, 0px, 0) scale(1) !important;
13545}
13546.fab-opened .fab-buttons a:nth-child(2) {
13547 -webkit-transition-delay: 50ms;
13548 transition-delay: 50ms;
13549}
13550.fab-opened .fab-buttons a:nth-child(3) {
13551 -webkit-transition-delay: 100ms;
13552 transition-delay: 100ms;
13553}
13554.fab-opened .fab-buttons a:nth-child(4) {
13555 -webkit-transition-delay: 150ms;
13556 transition-delay: 150ms;
13557}
13558.fab-opened .fab-buttons a:nth-child(5) {
13559 -webkit-transition-delay: 200ms;
13560 transition-delay: 200ms;
13561}
13562.fab-opened .fab-buttons a:nth-child(6) {
13563 -webkit-transition-delay: 250ms;
13564 transition-delay: 250ms;
13565}
13566.fab-buttons-top,
13567.fab-buttons-bottom {
13568 left: 50%;
13569 width: 40px;
13570 margin-left: -20px;
13571}
13572.fab-buttons-top {
13573 bottom: 100%;
13574 margin-bottom: 16px;
13575 -webkit-box-orient: vertical;
13576 -webkit-box-direction: reverse;
13577 -webkit-flex-direction: column-reverse;
13578 -ms-flex-direction: column-reverse;
13579 flex-direction: column-reverse;
13580}
13581.fab-buttons-top a {
13582 -webkit-transform: translate3d(0, 8px, 0) scale(0.3);
13583 transform: translate3d(0, 8px, 0) scale(0.3);
13584 -webkit-transform-origin: center bottom;
13585 transform-origin: center bottom;
13586}
13587.fab-buttons-top a + a {
13588 margin-bottom: 16px;
13589}
13590.fab-buttons-bottom {
13591 top: 100%;
13592 margin-top: 16px;
13593 -webkit-box-orient: vertical;
13594 -webkit-box-direction: normal;
13595 -webkit-flex-direction: column;
13596 -ms-flex-direction: column;
13597 flex-direction: column;
13598}
13599.fab-buttons-bottom a {
13600 -webkit-transform: translate3d(0, -8px, 0) scale(0.3);
13601 transform: translate3d(0, -8px, 0) scale(0.3);
13602 -webkit-transform-origin: center top;
13603 transform-origin: center top;
13604}
13605.fab-buttons-bottom a + a {
13606 margin-top: 16px;
13607}
13608.fab-buttons-left,
13609.fab-buttons-right {
13610 top: 50%;
13611 height: 40px;
13612 margin-top: -20px;
13613}
13614.fab-buttons-left {
13615 right: 100%;
13616 margin-right: 16px;
13617 -webkit-box-orient: horizontal;
13618 -webkit-box-direction: reverse;
13619 -webkit-flex-direction: row-reverse;
13620 -ms-flex-direction: row-reverse;
13621 flex-direction: row-reverse;
13622}
13623.fab-buttons-left a {
13624 -webkit-transform: translate3d(8px, 0px, 0) scale(0.3);
13625 transform: translate3d(8px, 0px, 0) scale(0.3);
13626 -webkit-transform-origin: right center;
13627 transform-origin: right center;
13628}
13629.fab-buttons-left a + a {
13630 margin-right: 16px;
13631}
13632.fab-buttons-right {
13633 left: 100%;
13634 margin-left: 16px;
13635}
13636.fab-buttons-right a {
13637 -webkit-transform: translate3d(-8px, 0, 0) scale(0.3);
13638 transform: translate3d(-8px, 0, 0) scale(0.3);
13639 -webkit-transform-origin: left center;
13640 transform-origin: left center;
13641}
13642.fab-buttons-right a + a {
13643 margin-left: 16px;
13644}
13645.fab-buttons-center {
13646 left: 0%;
13647 top: 0%;
13648 width: 100%;
13649 height: 100%;
13650}
13651.fab-buttons-center a {
13652 position: absolute;
13653}
13654.fab-buttons-center a:nth-child(1) {
13655 left: 50%;
13656 margin-left: -20px;
13657 bottom: 100%;
13658 margin-bottom: 16px;
13659 -webkit-transform: translateY(-8px) scale(0.3);
13660 transform: translateY(-8px) scale(0.3);
13661 -webkit-transform-origin: center bottom;
13662 transform-origin: center bottom;
13663}
13664.fab-buttons-center a:nth-child(2) {
13665 left: 100%;
13666 margin-top: -20px;
13667 top: 50%;
13668 margin-left: 16px;
13669 -webkit-transform: translateX(-8px) scale(0.3);
13670 transform: translateX(-8px) scale(0.3);
13671 -webkit-transform-origin: left center;
13672 transform-origin: left center;
13673}
13674.fab-buttons-center a:nth-child(3) {
13675 left: 50%;
13676 margin-left: -20px;
13677 top: 100%;
13678 margin-top: 16px;
13679 -webkit-transform: translateY(8px) scale(0.3);
13680 transform: translateY(8px) scale(0.3);
13681 -webkit-transform-origin: center top;
13682 transform-origin: center top;
13683}
13684.fab-buttons-center a:nth-child(4) {
13685 right: 100%;
13686 margin-top: -20px;
13687 top: 50%;
13688 margin-right: 16px;
13689 -webkit-transform: translateX(8px) scale(0.3);
13690 transform: translateX(8px) scale(0.3);
13691 -webkit-transform-origin: right center;
13692 transform-origin: right center;
13693}
13694.fab-opened.fab-morph > a i {
13695 opacity: 0;
13696}
13697.fab-morph,
13698.fab-morph > a,
13699.fab-morph-target {
13700 -webkit-transition-duration: 250ms;
13701 transition-duration: 250ms;
13702}
13703.fab-morph-target:not(.fab-morph-target-visible) {
13704 display: none;
13705}
13706.fab-extended {
13707 width: auto;
13708}
13709.fab-extended > a {
13710 width: 100% !important;
13711}
13712.fab-text {
13713 padding-left: 20px;
13714 padding-right: 20px;
13715 -webkit-box-sizing: border-box;
13716 box-sizing: border-box;
13717 font-size: 14px;
13718 text-transform: uppercase;
13719}
13720.fab-label-button {
13721 overflow: visible !important;
13722}
13723.fab-label {
13724 position: absolute;
13725 top: 50%;
13726 padding: 4px 12px;
13727 border-radius: 4px;
13728 background: #fff;
13729 color: #333;
13730 white-space: nowrap;
13731 -webkit-transform: translateY(-50%);
13732 transform: translateY(-50%);
13733 pointer-events: none;
13734}
13735.fab[class*="fab-right-"] .fab-label {
13736 right: 100%;
13737 margin-right: 8px;
13738}
13739.fab[class*="fab-left-"] .fab-label {
13740 left: 100%;
13741 margin-left: 8px;
13742}
13743.ios .fab > a,
13744.ios .fab-buttons a {
13745 background: #007aff;
13746 width: 50px;
13747 height: 50px;
13748 -webkit-box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.4);
13749 box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.4);
13750 border-radius: 25px;
13751 color: #fff;
13752}
13753.ios .fab > a.active-state,
13754.ios .fab-buttons a.active-state {
13755 -webkit-transition-duration: 0ms;
13756 transition-duration: 0ms;
13757 background: #0066d6;
13758}
13759.ios .fab > a i.icon,
13760.ios .fab-buttons a i.icon {
13761 font-size: 21px;
13762}
13763.ios .fab[class*="fab-left"] {
13764 left: 15px;
13765}
13766.ios .fab[class*="fab-right"] {
13767 right: 15px;
13768}
13769.ios .fab[class*="-top"] {
13770 top: 15px;
13771}
13772.ios .fab[class*="-bottom"] {
13773 bottom: 15px;
13774}
13775.ios .navbar ~ * .fab[class*="-top"],
13776.ios .navbar ~ .fab[class*="-top"] {
13777 margin-top: 44px;
13778}
13779.ios .toolbar ~ * .fab[class*="-bottom"],
13780.ios .toolbar ~ .fab[class*="-bottom"] {
13781 margin-bottom: 44px;
13782}
13783.ios .tabbar-labels ~ * .fab[class*="-bottom"],
13784.ios .tabbar-labels ~ .fab[class*="-bottom"] {
13785 margin-bottom: 50px;
13786}
13787@media (min-width: 768px) {
13788 .ios .tabbar-labels ~ * .fab[class*="-bottom"],
13789 .ios .tabbar-labels ~ .fab[class*="-bottom"] {
13790 margin-bottom: 56px;
13791 }
13792}
13793.ios .fab-morph {
13794 border-radius: 25px;
13795 background: #007aff;
13796 -webkit-box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.4);
13797 box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.4);
13798}
13799.ios .fab-morph > a {
13800 -webkit-box-shadow: none;
13801 box-shadow: none;
13802 background: none !important;
13803}
13804.ios .fab-extended {
13805 min-width: 50px;
13806}
13807.ios .fab-extended > a {
13808 width: 100%;
13809 height: 50px;
13810}
13811.ios .fab-extended > a i {
13812 left: 25px;
13813}
13814.ios .fab-extended i ~ .fab-text {
13815 padding-left: 50px;
13816}
13817.ios .fab-label {
13818 -webkit-box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.4);
13819 box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.4);
13820}
13821.ios .color-theme-red .fab > a,
13822.ios .color-theme-red .fab-buttons a,
13823.ios .color-theme-red.fab > a,
13824.ios .color-theme-red.fab-buttons a {
13825 background: #ff3b30;
13826}
13827.ios .color-theme-red .fab > a.active-state,
13828.ios .color-theme-red .fab-buttons a.active-state,
13829.ios .color-theme-red.fab > a.active-state,
13830.ios .color-theme-red.fab-buttons a.active-state {
13831 background: #ff1407;
13832}
13833.ios .color-theme-red .fab-morph,
13834.ios .color-theme-red.fab-morph {
13835 background: #ff3b30;
13836}
13837.ios .color-theme-green .fab > a,
13838.ios .color-theme-green .fab-buttons a,
13839.ios .color-theme-green.fab > a,
13840.ios .color-theme-green.fab-buttons a {
13841 background: #4cd964;
13842}
13843.ios .color-theme-green .fab > a.active-state,
13844.ios .color-theme-green .fab-buttons a.active-state,
13845.ios .color-theme-green.fab > a.active-state,
13846.ios .color-theme-green.fab-buttons a.active-state {
13847 background: #2cd048;
13848}
13849.ios .color-theme-green .fab-morph,
13850.ios .color-theme-green.fab-morph {
13851 background: #4cd964;
13852}
13853.ios .color-theme-blue .fab > a,
13854.ios .color-theme-blue .fab-buttons a,
13855.ios .color-theme-blue.fab > a,
13856.ios .color-theme-blue.fab-buttons a {
13857 background: #007aff;
13858}
13859.ios .color-theme-blue .fab > a.active-state,
13860.ios .color-theme-blue .fab-buttons a.active-state,
13861.ios .color-theme-blue.fab > a.active-state,
13862.ios .color-theme-blue.fab-buttons a.active-state {
13863 background: #0066d6;
13864}
13865.ios .color-theme-blue .fab-morph,
13866.ios .color-theme-blue.fab-morph {
13867 background: #007aff;
13868}
13869.ios .color-theme-pink .fab > a,
13870.ios .color-theme-pink .fab-buttons a,
13871.ios .color-theme-pink.fab > a,
13872.ios .color-theme-pink.fab-buttons a {
13873 background: #ff2d55;
13874}
13875.ios .color-theme-pink .fab > a.active-state,
13876.ios .color-theme-pink .fab-buttons a.active-state,
13877.ios .color-theme-pink.fab > a.active-state,
13878.ios .color-theme-pink.fab-buttons a.active-state {
13879 background: #ff0434;
13880}
13881.ios .color-theme-pink .fab-morph,
13882.ios .color-theme-pink.fab-morph {
13883 background: #ff2d55;
13884}
13885.ios .color-theme-yellow .fab > a,
13886.ios .color-theme-yellow .fab-buttons a,
13887.ios .color-theme-yellow.fab > a,
13888.ios .color-theme-yellow.fab-buttons a {
13889 background: #ffcc00;
13890}
13891.ios .color-theme-yellow .fab > a.active-state,
13892.ios .color-theme-yellow .fab-buttons a.active-state,
13893.ios .color-theme-yellow.fab > a.active-state,
13894.ios .color-theme-yellow.fab-buttons a.active-state {
13895 background: #d6ab00;
13896}
13897.ios .color-theme-yellow .fab-morph,
13898.ios .color-theme-yellow.fab-morph {
13899 background: #ffcc00;
13900}
13901.ios .color-theme-orange .fab > a,
13902.ios .color-theme-orange .fab-buttons a,
13903.ios .color-theme-orange.fab > a,
13904.ios .color-theme-orange.fab-buttons a {
13905 background: #ff9500;
13906}
13907.ios .color-theme-orange .fab > a.active-state,
13908.ios .color-theme-orange .fab-buttons a.active-state,
13909.ios .color-theme-orange.fab > a.active-state,
13910.ios .color-theme-orange.fab-buttons a.active-state {
13911 background: #d67d00;
13912}
13913.ios .color-theme-orange .fab-morph,
13914.ios .color-theme-orange.fab-morph {
13915 background: #ff9500;
13916}
13917.ios .color-theme-gray .fab > a,
13918.ios .color-theme-gray .fab-buttons a,
13919.ios .color-theme-gray.fab > a,
13920.ios .color-theme-gray.fab-buttons a {
13921 background: #8e8e93;
13922}
13923.ios .color-theme-gray .fab > a.active-state,
13924.ios .color-theme-gray .fab-buttons a.active-state,
13925.ios .color-theme-gray.fab > a.active-state,
13926.ios .color-theme-gray.fab-buttons a.active-state {
13927 background: #79797f;
13928}
13929.ios .color-theme-gray .fab-morph,
13930.ios .color-theme-gray.fab-morph {
13931 background: #8e8e93;
13932}
13933.ios .color-theme-white .fab > a,
13934.ios .color-theme-white .fab-buttons a,
13935.ios .color-theme-white.fab > a,
13936.ios .color-theme-white.fab-buttons a {
13937 background: #ffffff;
13938}
13939.ios .color-theme-white .fab > a.active-state,
13940.ios .color-theme-white .fab-buttons a.active-state,
13941.ios .color-theme-white.fab > a.active-state,
13942.ios .color-theme-white.fab-buttons a.active-state {
13943 background: #ebebeb;
13944}
13945.ios .color-theme-white .fab-morph,
13946.ios .color-theme-white.fab-morph {
13947 background: #ffffff;
13948}
13949.ios .color-theme-black .fab > a,
13950.ios .color-theme-black .fab-buttons a,
13951.ios .color-theme-black.fab > a,
13952.ios .color-theme-black.fab-buttons a {
13953 background: #000000;
13954}
13955.ios .color-theme-black .fab > a.active-state,
13956.ios .color-theme-black .fab-buttons a.active-state,
13957.ios .color-theme-black.fab > a.active-state,
13958.ios .color-theme-black.fab-buttons a.active-state {
13959 background: #000000;
13960}
13961.ios .color-theme-black .fab-morph,
13962.ios .color-theme-black.fab-morph {
13963 background: #000000;
13964}
13965.ios .fab.color-red > a,
13966.ios .fab.color-red .fab-buttons > a,
13967.ios .fab-buttons.color-red a,
13968.ios .fab > a.color-red,
13969.ios .fab .fab-buttons > a.color-red {
13970 background: #ff3b30;
13971}
13972.ios .fab.color-red > a.active-state,
13973.ios .fab.color-red .fab-buttons > a.active-state,
13974.ios .fab-buttons.color-red a.active-state,
13975.ios .fab > a.color-red.active-state,
13976.ios .fab .fab-buttons > a.color-red.active-state {
13977 background: #ff1407;
13978}
13979.ios .fab-morph.color-red {
13980 background: #ff3b30;
13981}
13982.ios .fab.color-green > a,
13983.ios .fab.color-green .fab-buttons > a,
13984.ios .fab-buttons.color-green a,
13985.ios .fab > a.color-green,
13986.ios .fab .fab-buttons > a.color-green {
13987 background: #4cd964;
13988}
13989.ios .fab.color-green > a.active-state,
13990.ios .fab.color-green .fab-buttons > a.active-state,
13991.ios .fab-buttons.color-green a.active-state,
13992.ios .fab > a.color-green.active-state,
13993.ios .fab .fab-buttons > a.color-green.active-state {
13994 background: #2cd048;
13995}
13996.ios .fab-morph.color-green {
13997 background: #4cd964;
13998}
13999.ios .fab.color-blue > a,
14000.ios .fab.color-blue .fab-buttons > a,
14001.ios .fab-buttons.color-blue a,
14002.ios .fab > a.color-blue,
14003.ios .fab .fab-buttons > a.color-blue {
14004 background: #007aff;
14005}
14006.ios .fab.color-blue > a.active-state,
14007.ios .fab.color-blue .fab-buttons > a.active-state,
14008.ios .fab-buttons.color-blue a.active-state,
14009.ios .fab > a.color-blue.active-state,
14010.ios .fab .fab-buttons > a.color-blue.active-state {
14011 background: #0066d6;
14012}
14013.ios .fab-morph.color-blue {
14014 background: #007aff;
14015}
14016.ios .fab.color-pink > a,
14017.ios .fab.color-pink .fab-buttons > a,
14018.ios .fab-buttons.color-pink a,
14019.ios .fab > a.color-pink,
14020.ios .fab .fab-buttons > a.color-pink {
14021 background: #ff2d55;
14022}
14023.ios .fab.color-pink > a.active-state,
14024.ios .fab.color-pink .fab-buttons > a.active-state,
14025.ios .fab-buttons.color-pink a.active-state,
14026.ios .fab > a.color-pink.active-state,
14027.ios .fab .fab-buttons > a.color-pink.active-state {
14028 background: #ff0434;
14029}
14030.ios .fab-morph.color-pink {
14031 background: #ff2d55;
14032}
14033.ios .fab.color-yellow > a,
14034.ios .fab.color-yellow .fab-buttons > a,
14035.ios .fab-buttons.color-yellow a,
14036.ios .fab > a.color-yellow,
14037.ios .fab .fab-buttons > a.color-yellow {
14038 background: #ffcc00;
14039}
14040.ios .fab.color-yellow > a.active-state,
14041.ios .fab.color-yellow .fab-buttons > a.active-state,
14042.ios .fab-buttons.color-yellow a.active-state,
14043.ios .fab > a.color-yellow.active-state,
14044.ios .fab .fab-buttons > a.color-yellow.active-state {
14045 background: #d6ab00;
14046}
14047.ios .fab-morph.color-yellow {
14048 background: #ffcc00;
14049}
14050.ios .fab.color-orange > a,
14051.ios .fab.color-orange .fab-buttons > a,
14052.ios .fab-buttons.color-orange a,
14053.ios .fab > a.color-orange,
14054.ios .fab .fab-buttons > a.color-orange {
14055 background: #ff9500;
14056}
14057.ios .fab.color-orange > a.active-state,
14058.ios .fab.color-orange .fab-buttons > a.active-state,
14059.ios .fab-buttons.color-orange a.active-state,
14060.ios .fab > a.color-orange.active-state,
14061.ios .fab .fab-buttons > a.color-orange.active-state {
14062 background: #d67d00;
14063}
14064.ios .fab-morph.color-orange {
14065 background: #ff9500;
14066}
14067.ios .fab.color-gray > a,
14068.ios .fab.color-gray .fab-buttons > a,
14069.ios .fab-buttons.color-gray a,
14070.ios .fab > a.color-gray,
14071.ios .fab .fab-buttons > a.color-gray {
14072 background: #8e8e93;
14073}
14074.ios .fab.color-gray > a.active-state,
14075.ios .fab.color-gray .fab-buttons > a.active-state,
14076.ios .fab-buttons.color-gray a.active-state,
14077.ios .fab > a.color-gray.active-state,
14078.ios .fab .fab-buttons > a.color-gray.active-state {
14079 background: #79797f;
14080}
14081.ios .fab-morph.color-gray {
14082 background: #8e8e93;
14083}
14084.ios .fab.color-white > a,
14085.ios .fab.color-white .fab-buttons > a,
14086.ios .fab-buttons.color-white a,
14087.ios .fab > a.color-white,
14088.ios .fab .fab-buttons > a.color-white {
14089 background: #ffffff;
14090}
14091.ios .fab.color-white > a.active-state,
14092.ios .fab.color-white .fab-buttons > a.active-state,
14093.ios .fab-buttons.color-white a.active-state,
14094.ios .fab > a.color-white.active-state,
14095.ios .fab .fab-buttons > a.color-white.active-state {
14096 background: #ebebeb;
14097}
14098.ios .fab-morph.color-white {
14099 background: #ffffff;
14100}
14101.ios .fab.color-black > a,
14102.ios .fab.color-black .fab-buttons > a,
14103.ios .fab-buttons.color-black a,
14104.ios .fab > a.color-black,
14105.ios .fab .fab-buttons > a.color-black {
14106 background: #000000;
14107}
14108.ios .fab.color-black > a.active-state,
14109.ios .fab.color-black .fab-buttons > a.active-state,
14110.ios .fab-buttons.color-black a.active-state,
14111.ios .fab > a.color-black.active-state,
14112.ios .fab .fab-buttons > a.color-black.active-state {
14113 background: #000000;
14114}
14115.ios .fab-morph.color-black {
14116 background: #000000;
14117}
14118.ios.device-iphone-x .fab[class*="-bottom"] {
14119 bottom: calc(15px + constant(safe-area-inset-bottom));
14120 bottom: calc(15px + env(safe-area-inset-bottom));
14121}
14122@media (orientation: landscape) {
14123 .ios.device-iphone-x .ios-left-edge .fab[class*="fab-left"],
14124 .ios.device-iphone-x .ios-edges .fab[class*="fab-left"],
14125 .ios.device-iphone-x .popup .fab[class*="fab-left"],
14126 .ios.device-iphone-x .sheet-modal .fab[class*="fab-left"],
14127 .ios.device-iphone-x .panel-left .fab[class*="fab-left"] {
14128 left: calc(15px + constant(safe-area-inset-left));
14129 left: calc(15px + env(safe-area-inset-left));
14130 }
14131 .ios.device-iphone-x .ios-right-edge .fab[class*="fab-right"],
14132 .ios.device-iphone-x .ios-edges .fab[class*="fab-right"],
14133 .ios.device-iphone-x .popup .fab[class*="fab-right"],
14134 .ios.device-iphone-x .sheet-modal .fab[class*="fab-right"],
14135 .ios.device-iphone-x .panel-right .fab[class*="fab-right"] {
14136 right: calc(15px + constant(safe-area-inset-right));
14137 right: calc(15px + env(safe-area-inset-right));
14138 }
14139}
14140/* === Searchbar === */
14141.searchbar {
14142 width: 100%;
14143 position: relative;
14144 z-index: 200;
14145}
14146.searchbar .searchbar-input-wrap {
14147 -webkit-flex-shrink: 1;
14148 -ms-flex-negative: 1;
14149 flex-shrink: 1;
14150 width: 100%;
14151 height: 100%;
14152 position: relative;
14153}
14154.searchbar .searchbar-input-wrap input[type="search"] {
14155 padding: 0;
14156}
14157.searchbar .searchbar-input-wrap input::-webkit-search-cancel-button {
14158 -webkit-appearance: none;
14159 appearance: none;
14160}
14161.page > .searchbar {
14162 position: absolute;
14163 left: 0;
14164 top: 0;
14165}
14166.searchbar-expandable {
14167 position: absolute;
14168 -webkit-transition-duration: 300ms;
14169 transition-duration: 300ms;
14170 pointer-events: none;
14171}
14172.searchbar-inner {
14173 position: absolute;
14174 left: 0;
14175 top: 0;
14176 width: 100%;
14177 height: 100%;
14178 display: -webkit-box;
14179 display: -webkit-flex;
14180 display: -ms-flexbox;
14181 display: flex;
14182 -webkit-box-align: center;
14183 -webkit-align-items: center;
14184 -ms-flex-align: center;
14185 align-items: center;
14186 -webkit-box-sizing: border-box;
14187 box-sizing: border-box;
14188}
14189.searchbar-disable-button {
14190 cursor: pointer;
14191 pointer-events: none;
14192 -webkit-appearance: none;
14193 -moz-appearance: none;
14194 appearance: none;
14195 background: none;
14196 border: none;
14197 outline: 0;
14198 padding: 0;
14199 margin: 0;
14200 width: auto;
14201 opacity: 0;
14202}
14203.searchbar-icon {
14204 pointer-events: none;
14205 background-position: center;
14206 background-repeat: no-repeat;
14207}
14208.searchbar-backdrop {
14209 position: absolute;
14210 left: 0;
14211 top: 0;
14212 width: 100%;
14213 height: 100%;
14214 z-index: 100;
14215 opacity: 0;
14216 pointer-events: none;
14217 -webkit-transition-duration: 300ms;
14218 transition-duration: 300ms;
14219 -webkit-transform: translate3d(0, 0, 0);
14220 transform: translate3d(0, 0, 0);
14221}
14222.searchbar-backdrop.searchbar-backdrop-in {
14223 opacity: 1;
14224 pointer-events: auto;
14225}
14226.page-content > .searchbar-backdrop {
14227 position: fixed;
14228}
14229.searchbar-not-found {
14230 display: none;
14231}
14232.hidden-by-searchbar,
14233.list .hidden-by-searchbar,
14234.list.li.hidden-by-searchbar,
14235.list li.hidden-by-searchbar {
14236 display: none !important;
14237}
14238.ios .searchbar {
14239 height: 44px;
14240 background: #f7f7f8;
14241}
14242.ios .searchbar.no-hairline:after {
14243 display: none !important;
14244}
14245.ios .searchbar input[type="search"],
14246.ios .searchbar input[type="text"] {
14247 padding: 0 28px;
14248 -webkit-box-sizing: border-box;
14249 box-sizing: border-box;
14250 width: 100%;
14251 height: 100%;
14252 display: block;
14253 border: none;
14254 -webkit-appearance: none;
14255 -moz-appearance: none;
14256 appearance: none;
14257 border-radius: 10px;
14258 border-radius: 8px;
14259 font-family: inherit;
14260 color: #000;
14261 font-size: 17px;
14262 font-weight: normal;
14263 z-index: 30;
14264 background-color: #e8e8ea;
14265 position: relative;
14266}
14267.ios .searchbar input[type="search"]::-webkit-input-placeholder,
14268.ios .searchbar input[type="text"]::-webkit-input-placeholder {
14269 color: #939398;
14270 opacity: 1;
14271}
14272.ios .searchbar input[type="search"]:-ms-input-placeholder,
14273.ios .searchbar input[type="text"]:-ms-input-placeholder {
14274 color: #939398;
14275 opacity: 1;
14276}
14277.ios .searchbar input[type="search"]::-ms-input-placeholder,
14278.ios .searchbar input[type="text"]::-ms-input-placeholder {
14279 color: #939398;
14280 opacity: 1;
14281}
14282.ios .searchbar input[type="search"]::placeholder,
14283.ios .searchbar input[type="text"]::placeholder {
14284 color: #939398;
14285 opacity: 1;
14286}
14287.ios .searchbar .input-clear-button {
14288 z-index: 40;
14289 right: 7px;
14290}
14291.ios .searchbar-inner {
14292 padding: 0 8px;
14293}
14294.ios .searchbar-icon {
14295 width: 13px;
14296 height: 13px;
14297 position: absolute;
14298 top: 50%;
14299 margin-top: -6px;
14300 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%2013%2013'%20enable-background%3D'new%200%200%2013%2013'%3E%3Cg%3E%3Cpath%20fill%3D'%23939398'%20d%3D'M5%2C1c2.2%2C0%2C4%2C1.8%2C4%2C4S7.2%2C9%2C5%2C9S1%2C7.2%2C1%2C5S2.8%2C1%2C5%2C1%20M5%2C0C2.2%2C0%2C0%2C2.2%2C0%2C5s2.2%2C5%2C5%2C5s5-2.2%2C5-5S7.8%2C0%2C5%2C0%20L5%2C0z'%2F%3E%3C%2Fg%3E%3Cline%20stroke%3D'%23939398'%20stroke-miterlimit%3D'10'%20stroke-width%3D'1.5'%20x1%3D'12.6'%20y1%3D'12.6'%20x2%3D'8.2'%20y2%3D'8.2'%2F%3E%3C%2Fsvg%3E");
14301 background-size: 13px 13px;
14302 z-index: 40;
14303 left: 8px;
14304}
14305.ios .searchbar-backdrop {
14306 background: rgba(0, 0, 0, 0.4);
14307}
14308.ios .searchbar-input-wrap {
14309 height: 32px;
14310}
14311.ios .searchbar:after {
14312 content: '';
14313 position: absolute;
14314 background-color: #c4c4c4;
14315 display: block;
14316 z-index: 15;
14317 top: auto;
14318 right: auto;
14319 bottom: 0;
14320 left: 0;
14321 height: 1px;
14322 width: 100%;
14323 -webkit-transform-origin: 50% 100%;
14324 transform-origin: 50% 100%;
14325}
14326.ios.device-pixel-ratio-2 .searchbar:after {
14327 -webkit-transform: scaleY(0.5);
14328 transform: scaleY(0.5);
14329}
14330.ios.device-pixel-ratio-3 .searchbar:after {
14331 -webkit-transform: scaleY(0.33);
14332 transform: scaleY(0.33);
14333}
14334.ios .searchbar-disable-button {
14335 font-size: 17px;
14336 -webkit-flex-shrink: 0;
14337 -ms-flex-negative: 0;
14338 flex-shrink: 0;
14339 -webkit-transform: translate3d(0, 0, 0);
14340 transform: translate3d(0, 0, 0);
14341 -webkit-transition-duration: 300ms;
14342 transition-duration: 300ms;
14343 color: #007aff;
14344 display: none;
14345}
14346.ios .searchbar-disable-button.active-state {
14347 -webkit-transition-duration: 0ms;
14348 transition-duration: 0ms;
14349 opacity: 0.3 !important;
14350}
14351.ios .searchbar-enabled .searchbar-disable-button {
14352 pointer-events: auto;
14353 opacity: 1;
14354 margin-left: 8px;
14355}
14356.ios .searchbar:not(.searchbar-enabled) .searchbar-disable-button {
14357 -webkit-transition-duration: 300ms !important;
14358 transition-duration: 300ms !important;
14359}
14360.ios .searchbar-expandable {
14361 left: 0;
14362 bottom: 0;
14363 opacity: 1;
14364 width: 100%;
14365 height: 0%;
14366 -webkit-transform: translate3d(0, 0, 0);
14367 transform: translate3d(0, 0, 0);
14368 overflow: hidden;
14369}
14370.ios .searchbar-expandable .searchbar-disable-button {
14371 margin-left: 8px;
14372 opacity: 1;
14373 display: block;
14374}
14375.ios .searchbar-expandable .searchbar-inner {
14376 height: 44px;
14377}
14378.ios .searchbar-expandable.searchbar-enabled {
14379 opacity: 1;
14380 height: 100%;
14381 pointer-events: auto;
14382}
14383.ios .page > .searchbar {
14384 z-index: 200;
14385}
14386.ios .navbar ~ .page:not(.no-navbar) > .searchbar,
14387.ios .page > .navbar ~ .searchbar {
14388 top: 44px;
14389}
14390.ios .navbar ~ .page:not(.no-navbar) > .searchbar ~ .page-content,
14391.ios .navbar ~ .page:not(.no-navbar) > .searchbar ~ * .page-content,
14392.ios .page > .navbar ~ .searchbar ~ .page-content,
14393.ios .page > .navbar ~ .searchbar ~ * .page-content {
14394 padding-top: 88px;
14395}
14396.ios .theme-dark .searchbar,
14397.searchbar.ios .theme-dark {
14398 background-color: #303030;
14399}
14400.ios .theme-dark .searchbar:after,
14401.searchbar.ios .theme-dark:after {
14402 background-color: #282829;
14403}
14404.ios .theme-dark .searchbar input[type="search"],
14405.searchbar.ios .theme-dark input[type="search"],
14406.ios .theme-dark .searchbar input[type="text"],
14407.searchbar.ios .theme-dark input[type="text"] {
14408 background-color: #171717;
14409 color: #fff;
14410}
14411.ios .color-theme-red .searchbar-disable-button {
14412 color: #ff3b30;
14413}
14414.ios .color-theme-green .searchbar-disable-button {
14415 color: #4cd964;
14416}
14417.ios .color-theme-blue .searchbar-disable-button {
14418 color: #007aff;
14419}
14420.ios .color-theme-pink .searchbar-disable-button {
14421 color: #ff2d55;
14422}
14423.ios .color-theme-yellow .searchbar-disable-button {
14424 color: #ffcc00;
14425}
14426.ios .color-theme-orange .searchbar-disable-button {
14427 color: #ff9500;
14428}
14429.ios .color-theme-gray .searchbar-disable-button {
14430 color: #8e8e93;
14431}
14432.ios .color-theme-white .searchbar-disable-button {
14433 color: #ffffff;
14434}
14435.ios .color-theme-black .searchbar-disable-button {
14436 color: #000000;
14437}
14438@media (orientation: landscape) {
14439 .ios.device-iphone-x .ios-left-edge .searchbar-inner,
14440 .ios.device-iphone-x .ios-edges .searchbar-inner,
14441 .ios.device-iphone-x .popup .searchbar-inner,
14442 .ios.device-iphone-x .sheet-modal .searchbar-inner,
14443 .ios.device-iphone-x .panel-left .searchbar-inner {
14444 padding-left: calc(8px + constant(safe-area-inset-left));
14445 padding-left: calc(8px + env(safe-area-inset-left));
14446 }
14447 .ios.device-iphone-x .ios-right-edge .searchbar-inner,
14448 .ios.device-iphone-x .ios-edges .searchbar-inner,
14449 .ios.device-iphone-x .popup .searchbar-inner,
14450 .ios.device-iphone-x .sheet-modal .searchbar-inner,
14451 .ios.device-iphone-x .panel-right .searchbar-inner {
14452 padding-right: calc(8px + constant(safe-area-inset-right));
14453 padding-right: calc(8px + env(safe-area-inset-right));
14454 }
14455}
14456/* === Messages === */
14457.messages {
14458 display: -webkit-box;
14459 display: -webkit-flex;
14460 display: -ms-flexbox;
14461 display: flex;
14462 -webkit-box-orient: vertical;
14463 -webkit-box-direction: normal;
14464 -webkit-flex-direction: column;
14465 -ms-flex-direction: column;
14466 flex-direction: column;
14467 min-height: 100%;
14468 position: relative;
14469 z-index: 1;
14470}
14471.messages-title {
14472 text-align: center;
14473 width: 100%;
14474 line-height: 1;
14475}
14476.message {
14477 max-width: 70%;
14478 -webkit-box-sizing: border-box;
14479 box-sizing: border-box;
14480 display: -webkit-box;
14481 display: -webkit-flex;
14482 display: -ms-flexbox;
14483 display: flex;
14484 -webkit-box-align: end;
14485 -webkit-align-items: flex-end;
14486 -ms-flex-align: end;
14487 align-items: flex-end;
14488 position: relative;
14489 z-index: 1;
14490 -webkit-transform: translate3d(0, 0, 0);
14491 transform: translate3d(0, 0, 0);
14492}
14493.message-avatar {
14494 border-radius: 50%;
14495 position: relative;
14496 background-size: cover;
14497 -webkit-align-self: flex-end;
14498 -ms-flex-item-align: end;
14499 align-self: flex-end;
14500 -webkit-flex-shrink: 0;
14501 -ms-flex-negative: 0;
14502 flex-shrink: 0;
14503}
14504.message-content {
14505 position: relative;
14506 display: -webkit-box;
14507 display: -webkit-flex;
14508 display: -ms-flexbox;
14509 display: flex;
14510 -webkit-box-orient: vertical;
14511 -webkit-box-direction: normal;
14512 -webkit-flex-direction: column;
14513 -ms-flex-direction: column;
14514 flex-direction: column;
14515}
14516.message-header,
14517.message-footer,
14518.message-name {
14519 line-height: 1;
14520 font-size: 12px;
14521}
14522.message-footer {
14523 font-size: 11px;
14524 margin-bottom: -1em;
14525}
14526.message-bubble {
14527 -webkit-box-sizing: border-box;
14528 box-sizing: border-box;
14529 word-break: break-word;
14530 display: -webkit-box;
14531 display: -webkit-flex;
14532 display: -ms-flexbox;
14533 display: flex;
14534 -webkit-box-orient: vertical;
14535 -webkit-box-direction: normal;
14536 -webkit-flex-direction: column;
14537 -ms-flex-direction: column;
14538 flex-direction: column;
14539 position: relative;
14540 line-height: 1.2;
14541}
14542.message-image img {
14543 display: block;
14544 max-width: 100%;
14545 height: auto;
14546 width: auto;
14547}
14548.message-text-header,
14549.message-text-footer {
14550 font-size: 12px;
14551 line-height: 1;
14552}
14553.message-text {
14554 text-align: left;
14555}
14556.message-sent {
14557 text-align: right;
14558 -webkit-box-orient: horizontal;
14559 -webkit-box-direction: reverse;
14560 -webkit-flex-direction: row-reverse;
14561 -ms-flex-direction: row-reverse;
14562 flex-direction: row-reverse;
14563 -webkit-align-self: flex-end;
14564 -ms-flex-item-align: end;
14565 align-self: flex-end;
14566}
14567.message-received {
14568 -webkit-box-orient: horizontal;
14569 -webkit-box-direction: normal;
14570 -webkit-flex-direction: row;
14571 -ms-flex-direction: row;
14572 flex-direction: row;
14573}
14574.message-received .message-content {
14575 -webkit-box-align: start;
14576 -webkit-align-items: flex-start;
14577 -ms-flex-align: start;
14578 align-items: flex-start;
14579}
14580.message-sent .message-content {
14581 -webkit-box-align: end;
14582 -webkit-align-items: flex-end;
14583 -ms-flex-align: end;
14584 align-items: flex-end;
14585}
14586.message:not(.message-last) .message-avatar {
14587 opacity: 0;
14588}
14589.message:not(.message-first) .message-name {
14590 display: none;
14591}
14592.message.message-same-name .message-name {
14593 display: none;
14594}
14595.message.message-same-header .message-header {
14596 display: none;
14597}
14598.message.message-same-footer .message-footer {
14599 display: none;
14600}
14601.message-appear-from-bottom {
14602 -webkit-animation: message-appear-from-bottom 300ms;
14603 animation: message-appear-from-bottom 300ms;
14604}
14605.message-appear-from-top {
14606 -webkit-animation: message-appear-from-top 300ms;
14607 animation: message-appear-from-top 300ms;
14608}
14609.message-typing-indicator {
14610 display: inline-block;
14611 font-size: 0;
14612 vertical-align: middle;
14613}
14614.message-typing-indicator > div {
14615 display: inline-block;
14616 position: relative;
14617 background: #000;
14618 vertical-align: middle;
14619 border-radius: 50%;
14620}
14621@-webkit-keyframes message-appear-from-bottom {
14622 from {
14623 -webkit-transform: translate3d(0, 100%, 0);
14624 transform: translate3d(0, 100%, 0);
14625 }
14626 to {
14627 -webkit-transform: translate3d(0, 0, 0);
14628 transform: translate3d(0, 0, 0);
14629 }
14630}
14631@keyframes message-appear-from-bottom {
14632 from {
14633 -webkit-transform: translate3d(0, 100%, 0);
14634 transform: translate3d(0, 100%, 0);
14635 }
14636 to {
14637 -webkit-transform: translate3d(0, 0, 0);
14638 transform: translate3d(0, 0, 0);
14639 }
14640}
14641@-webkit-keyframes message-appear-from-top {
14642 from {
14643 -webkit-transform: translate3d(0, -100%, 0);
14644 transform: translate3d(0, -100%, 0);
14645 }
14646 to {
14647 -webkit-transform: translate3d(0, 0, 0);
14648 transform: translate3d(0, 0, 0);
14649 }
14650}
14651@keyframes message-appear-from-top {
14652 from {
14653 -webkit-transform: translate3d(0, -100%, 0);
14654 transform: translate3d(0, -100%, 0);
14655 }
14656 to {
14657 -webkit-transform: translate3d(0, 0, 0);
14658 transform: translate3d(0, 0, 0);
14659 }
14660}
14661.ios .messages-content,
14662.ios .messages {
14663 background: #fff;
14664}
14665.ios .messages-title {
14666 font-size: 11px;
14667 color: #8e8e93;
14668 margin-top: 10px;
14669}
14670.ios .messages-title:last-child {
14671 margin-bottom: 10px;
14672}
14673.ios .messages-title b {
14674 font-weight: 600;
14675}
14676.ios .message {
14677 margin-top: 10px;
14678}
14679.ios .message:last-child {
14680 margin-bottom: 10px;
14681}
14682.ios .message-avatar {
14683 width: 29px;
14684 height: 29px;
14685}
14686.ios .message-header,
14687.ios .message-footer,
14688.ios .message-name {
14689 color: #8e8e93;
14690}
14691.ios .message-header b,
14692.ios .message-footer b,
14693.ios .message-name b {
14694 font-weight: 600;
14695}
14696.ios .message-header,
14697.ios .message-name {
14698 margin-bottom: 3px;
14699}
14700.ios .message-footer {
14701 margin-top: 3px;
14702}
14703.ios .message-bubble {
14704 font-size: 17px;
14705 line-height: 1.2;
14706 border-radius: 16px;
14707 padding: 6px 16px 9px;
14708 min-width: 48px;
14709 min-height: 35px;
14710}
14711.ios .message-image {
14712 margin: 6px -16px;
14713}
14714.ios .message-image:first-child {
14715 margin-top: -6px;
14716}
14717.ios .message-image:first-child img {
14718 border-top-left-radius: 16px;
14719 border-top-right-radius: 16px;
14720}
14721.ios .message-image:last-child {
14722 margin-bottom: -9px;
14723}
14724.ios .message-image:last-child img {
14725 border-bottom-left-radius: 16px;
14726 border-bottom-right-radius: 16px;
14727}
14728.ios .message-text-header {
14729 margin-bottom: 3px;
14730}
14731.ios .message-text-footer {
14732 margin-top: 3px;
14733}
14734.ios .message-received {
14735 margin-left: 10px;
14736}
14737.ios .message-received .message-header,
14738.ios .message-received .message-footer,
14739.ios .message-received .message-name {
14740 margin-left: 16px;
14741}
14742.ios .message-received .message-text-header,
14743.ios .message-received .message-text-footer {
14744 opacity: 0.5;
14745}
14746.ios .message-received .message-bubble {
14747 color: #000;
14748 background: #e5e5ea;
14749 padding-left: 22px;
14750 -webkit-mask-box-image: url("data:image/svg+xml;charset=utf-8,<svg height='35' viewBox='0 0 96 70' width='48' xmlns='http://www.w3.org/2000/svg'><path d='m96 35c1 7-5 37-42 35-37 2-43-28-42-35-1-7 5-37 42-35 37-2 43 28 42 35z'/></svg>") 50% 42% 46% 56%;
14751}
14752.ios .message-received .message-image {
14753 margin-left: -22px;
14754}
14755.ios .message-received.message-tail:not(.message-typing) .message-bubble {
14756 border-radius: 16px 16px 16px 0;
14757 -webkit-mask-box-image: url("data:image/svg+xml;charset=utf-8,<svg height='35' viewBox='0 0 96 70' width='48' xmlns='http://www.w3.org/2000/svg'><path d='m96 35c1 7-5 37-42 35-37 2-43-28-42-35-1-7 5-37 42-35 37-2 43 28 42 35z'/><path d='m0 70c6-2 12-10 12-19v-16l14 27s-8 8-26 8z'/></svg>") 50% 42% 46% 56%;
14758}
14759.ios .message-received.message-tail:not(.message-typing) .message-bubble .message-image:last-child img {
14760 border-bottom-left-radius: 0px;
14761}
14762.ios .message-sent {
14763 margin-right: 10px;
14764}
14765.ios .message-sent .message-header,
14766.ios .message-sent .message-footer,
14767.ios .message-sent .message-name {
14768 margin-right: 16px;
14769}
14770.ios .message-sent .message-text-header,
14771.ios .message-sent .message-text-footer {
14772 opacity: 0.8;
14773}
14774.ios .message-sent .message-bubble {
14775 background: #00d449;
14776 color: #fff;
14777 padding-right: 22px;
14778 -webkit-mask-box-image: url("data:image/svg+xml;charset=utf-8,<svg height='35' viewBox='0 0 96 70' width='48' xmlns='http://www.w3.org/2000/svg'><path d='m84 35c1 7-5 37-42 35-37 2-43-28-42-35-1-7 5-37 42-35 37-2 43 28 42 35z'/></svg>") 50% 56% 46% 42%;
14779}
14780.ios .message-sent .message-image {
14781 margin-right: -22px;
14782}
14783.ios .message-sent.message-tail .message-bubble {
14784 border-radius: 16px 16px 0 16px;
14785 -webkit-mask-box-image: url("data:image/svg+xml;charset=utf-8,<svg height='35' viewBox='0 0 96 70' width='48' xmlns='http://www.w3.org/2000/svg'><path d='m84 35c1 7-5 37-42 35-37 2-43-28-42-35-1-7 5-37 42-35 37-2 43 28 42 35z'/><path d='m96 70c-6-2-12-10-12-19v-16l-14 27s8 8 26 8z'/></svg>") 50% 56% 46% 42%;
14786}
14787.ios .message-sent.message-tail .message-bubble .message-image:last-child img {
14788 border-bottom-right-radius: 0px;
14789}
14790.ios .message + .message:not(.message-first) {
14791 margin-top: 1px;
14792}
14793.ios .message-received.message-typing .message-content:after,
14794.ios .message-received.message-typing .message-content:before {
14795 content: '';
14796 position: absolute;
14797 background: #e5e5ea;
14798 border-radius: 50%;
14799}
14800.ios .message-received.message-typing .message-content:after {
14801 width: 11px;
14802 height: 11px;
14803 left: 4px;
14804 bottom: 0px;
14805}
14806.ios .message-received.message-typing .message-content:before {
14807 width: 6px;
14808 height: 6px;
14809 left: -1px;
14810 bottom: -4px;
14811}
14812.ios .message-typing-indicator > div {
14813 width: 9px;
14814 height: 9px;
14815 opacity: 0.35;
14816}
14817.ios .message-typing-indicator > div + div {
14818 margin-left: 4px;
14819}
14820.ios .message-typing-indicator > div:nth-child(1) {
14821 -webkit-animation: ios-message-typing-indicator 900ms infinite;
14822 animation: ios-message-typing-indicator 900ms infinite;
14823}
14824.ios .message-typing-indicator > div:nth-child(2) {
14825 -webkit-animation: ios-message-typing-indicator 900ms 150ms infinite;
14826 animation: ios-message-typing-indicator 900ms 150ms infinite;
14827}
14828.ios .message-typing-indicator > div:nth-child(3) {
14829 -webkit-animation: ios-message-typing-indicator 900ms 300ms infinite;
14830 animation: ios-message-typing-indicator 900ms 300ms infinite;
14831}
14832.ios .theme-dark .messages-content,
14833.messages-content.ios .theme-dark,
14834.ios .theme-dark .messages,
14835.messages.ios .theme-dark {
14836 background-color: transparent;
14837}
14838.ios .theme-dark .message-received.message-typing .message-content:after,
14839.ios .theme-dark .message-received.message-typing .message-content:before {
14840 background: #333;
14841}
14842.ios .theme-dark .message-typing-indicator > div {
14843 background-color: #fff;
14844}
14845.ios .theme-dark .message-received .message-bubble {
14846 background-color: #333;
14847 color: #fff;
14848}
14849@media (orientation: landscape) {
14850 .ios.device-iphone-x .ios-left-edge .message-received,
14851 .ios.device-iphone-x .ios-edges .message-received,
14852 .ios.device-iphone-x .popup .message-received,
14853 .ios.device-iphone-x .sheet-modal .message-received,
14854 .ios.device-iphone-x .panel-left .message-received {
14855 margin-left: calc(10px + constant(safe-area-inset-left));
14856 margin-left: calc(10px + env(safe-area-inset-left));
14857 }
14858 .ios.device-iphone-x .ios-right-edge .message-sent,
14859 .ios.device-iphone-x .ios-edges .message-sent,
14860 .ios.device-iphone-x .popup .message-sent,
14861 .ios.device-iphone-x .sheet-modal .message-sent,
14862 .ios.device-iphone-x .panel-right .message-sent {
14863 margin-right: calc(10px + constant(safe-area-inset-right));
14864 margin-right: calc(10px + env(safe-area-inset-right));
14865 }
14866}
14867@-webkit-keyframes ios-message-typing-indicator {
14868 0% {
14869 opacity: 0.35;
14870 }
14871 25% {
14872 opacity: 0.2;
14873 }
14874 50% {
14875 opacity: 0.2;
14876 }
14877}
14878@keyframes ios-message-typing-indicator {
14879 0% {
14880 opacity: 0.35;
14881 }
14882 25% {
14883 opacity: 0.2;
14884 }
14885 50% {
14886 opacity: 0.2;
14887 }
14888}
14889/* === Messagebar === */
14890.toolbar.messagebar {
14891 -webkit-transform: translate3d(0, 0, 0);
14892 transform: translate3d(0, 0, 0);
14893 background: #fff;
14894 height: auto;
14895}
14896.toolbar.messagebar .toolbar-inner {
14897 position: relative;
14898}
14899.toolbar.messagebar .messagebar-area {
14900 width: 100%;
14901 -webkit-flex-shrink: 1;
14902 -ms-flex-negative: 1;
14903 flex-shrink: 1;
14904 overflow: hidden;
14905 position: relative;
14906}
14907.toolbar.messagebar textarea {
14908 width: 100%;
14909 -webkit-flex-shrink: 1;
14910 -ms-flex-negative: 1;
14911 flex-shrink: 1;
14912}
14913.toolbar.messagebar a.link {
14914 -webkit-align-self: flex-end;
14915 -ms-flex-item-align: end;
14916 align-self: flex-end;
14917 -webkit-flex-shrink: 0;
14918 -ms-flex-negative: 0;
14919 flex-shrink: 0;
14920}
14921.messagebar-attachments {
14922 width: 100%;
14923 overflow: auto;
14924 -webkit-overflow-scrolling: touch;
14925 font-size: 0;
14926 white-space: nowrap;
14927 -webkit-box-sizing: border-box;
14928 box-sizing: border-box;
14929 position: relative;
14930}
14931.messagebar:not(.messagebar-attachments-visible) .messagebar-attachments {
14932 display: none;
14933}
14934.messagebar-attachment {
14935 background-size: cover;
14936 background-position: center;
14937 background-repeat: no-repeat;
14938 display: inline-block;
14939 vertical-align: middle;
14940 white-space: normal;
14941 height: 155px;
14942 position: relative;
14943}
14944@media (orientation: landscape) {
14945 .messagebar-attachment {
14946 height: 120px;
14947 }
14948}
14949.messagebar-attachment img {
14950 display: block;
14951 width: auto;
14952 height: 100%;
14953}
14954.messagebar-attachment + .messagebar-attachment {
14955 margin-left: 8px;
14956}
14957.messagebar-sheet {
14958 overflow: auto;
14959 -webkit-overflow-scrolling: touch;
14960 display: -webkit-box;
14961 display: -webkit-flex;
14962 display: -ms-flexbox;
14963 display: flex;
14964 -webkit-flex-wrap: wrap;
14965 -ms-flex-wrap: wrap;
14966 flex-wrap: wrap;
14967 -webkit-box-orient: vertical;
14968 -webkit-box-direction: normal;
14969 -webkit-flex-direction: column;
14970 -ms-flex-direction: column;
14971 flex-direction: column;
14972 -webkit-align-content: flex-start;
14973 -ms-flex-line-pack: start;
14974 align-content: flex-start;
14975 height: 252px;
14976}
14977@media (orientation: landscape) {
14978 .messagebar-sheet {
14979 height: 192px;
14980 }
14981}
14982.messagebar-sheet-image,
14983.messagebar-sheet-item {
14984 -webkit-box-sizing: border-box;
14985 box-sizing: border-box;
14986 -webkit-flex-shrink: 0;
14987 -ms-flex-negative: 0;
14988 flex-shrink: 0;
14989 margin-top: 1px;
14990 position: relative;
14991 overflow: hidden;
14992 height: 125px;
14993 width: 125px;
14994 margin-left: 1px;
14995}
14996@media (orientation: landscape) {
14997 .messagebar-sheet-image,
14998 .messagebar-sheet-item {
14999 width: 95px;
15000 height: 95px;
15001 }
15002}
15003.messagebar-sheet-image .icon-checkbox,
15004.messagebar-sheet-item .icon-checkbox,
15005.messagebar-sheet-image .icon-radio,
15006.messagebar-sheet-item .icon-radio {
15007 position: absolute;
15008 right: 8px;
15009 bottom: 8px;
15010}
15011.messagebar-sheet-image {
15012 background-size: cover;
15013 background-position: center;
15014 background-repeat: no-repeat;
15015}
15016.messagebar-attachment-delete {
15017 display: block;
15018 position: absolute;
15019 border-radius: 50%;
15020 -webkit-box-sizing: border-box;
15021 box-sizing: border-box;
15022 cursor: pointer;
15023 -webkit-box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.2);
15024 box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.2);
15025}
15026.messagebar-attachment-delete:after,
15027.messagebar-attachment-delete:before {
15028 position: absolute;
15029 content: '';
15030 left: 50%;
15031 top: 50%;
15032}
15033.messagebar-attachment-delete:after {
15034 -webkit-transform: rotate(45deg);
15035 transform: rotate(45deg);
15036}
15037.messagebar-attachment-delete:before {
15038 -webkit-transform: rotate(-45deg);
15039 transform: rotate(-45deg);
15040}
15041.messagebar:not(.messagebar-sheet-visible) .messagebar-sheet {
15042 display: none;
15043}
15044.ios.device-iphone-x .messagebar:not(.messagebar-top),
15045.md.device-iphone-x .messagebar:not(.messagebar-top) {
15046 height: auto !important;
15047}
15048.ios.device-iphone-x .messagebar:not(.messagebar-top):not(.messagebar-sheet-visible),
15049.md.device-iphone-x .messagebar:not(.messagebar-top):not(.messagebar-sheet-visible) {
15050 padding-bottom: constant(safe-area-inset-bottom);
15051 padding-bottom: env(safe-area-inset-bottom);
15052}
15053.ios.device-iphone-x .messagebar-sheet,
15054.md.device-iphone-x .messagebar-sheet {
15055 padding-left: constant(safe-area-inset-left);
15056 padding-left: env(safe-area-inset-left);
15057 padding-right: constant(safe-area-inset-right);
15058 padding-right: env(safe-area-inset-right);
15059 padding-bottom: constant(safe-area-inset-bottom);
15060 padding-bottom: env(safe-area-inset-bottom);
15061}
15062.ios .messagebar {
15063 background: #fff;
15064 min-height: 44px;
15065}
15066.ios .messagebar:before {
15067 display: none !important;
15068}
15069.ios .messagebar textarea {
15070 background: #fff;
15071 border-radius: 17px;
15072 padding: 6px 15px;
15073 height: 34px;
15074 line-height: 20px;
15075 font-size: 17px;
15076 border: 1px solid #c8c8cd;
15077}
15078.ios .messagebar a.link.icon-only:first-child {
15079 margin-left: -8px;
15080}
15081.ios .messagebar a.link.icon-only:last-child {
15082 margin-right: -8px;
15083}
15084.ios .messagebar a.link:not(.icon-only) + .messagebar-area {
15085 margin-left: 8px;
15086}
15087.ios .messagebar .messagebar-area + a.link:not(.icon-only) {
15088 margin-left: 8px;
15089}
15090.ios .messagebar-area {
15091 margin-top: 5px;
15092 margin-bottom: 5px;
15093}
15094.ios .messagebar-attachments {
15095 padding: 5px;
15096 border-radius: 17px 17px 0 0;
15097 border: 1px solid #c8c8cd;
15098 border-bottom: none;
15099}
15100.ios .messagebar-attachments-visible .messagebar-attachments + textarea {
15101 border-radius: 0 0 17px 17px;
15102}
15103.ios .messagebar-attachment {
15104 border-radius: 12px;
15105 font-size: 14px;
15106}
15107.ios .messagebar-attachment img {
15108 border-radius: 12px;
15109}
15110.ios .messagebar-sheet {
15111 background: #d1d5da;
15112}
15113.ios .messagebar-attachment-delete {
15114 right: 5px;
15115 top: 5px;
15116 width: 20px;
15117 height: 20px;
15118 background: #7d7e80;
15119 border: 2px solid #fff;
15120 cursor: pointer;
15121}
15122.ios .messagebar-attachment-delete:after,
15123.ios .messagebar-attachment-delete:before {
15124 width: 10px;
15125 height: 2px;
15126 background: #fff;
15127 margin-left: -5px;
15128 margin-top: -1px;
15129}
15130.ios .theme-dark .messagebar textarea,
15131.messagebar.ios .theme-dark textarea {
15132 background-color: #000;
15133 border-color: #282829;
15134 color: #fff;
15135}
15136.ios .theme-dark .messagebar-attachments {
15137 border-color: #282829;
15138 background-color: #000;
15139}
15140/* === Swiper === */
15141.swiper-container {
15142 margin: 0 auto;
15143 position: relative;
15144 overflow: hidden;
15145 list-style: none;
15146 padding: 0;
15147 /* Fix of Webkit flickering */
15148 z-index: 1;
15149}
15150.swiper-container-no-flexbox .swiper-slide {
15151 float: left;
15152}
15153.swiper-container-vertical > .swiper-wrapper {
15154 -webkit-box-orient: vertical;
15155 -webkit-box-direction: normal;
15156 -webkit-flex-direction: column;
15157 -ms-flex-direction: column;
15158 flex-direction: column;
15159}
15160.swiper-wrapper {
15161 position: relative;
15162 width: 100%;
15163 height: 100%;
15164 z-index: 1;
15165 display: -webkit-box;
15166 display: -webkit-flex;
15167 display: -ms-flexbox;
15168 display: flex;
15169 -webkit-transition-property: -webkit-transform;
15170 transition-property: -webkit-transform;
15171 transition-property: transform;
15172 transition-property: transform, -webkit-transform;
15173 -webkit-box-sizing: content-box;
15174 box-sizing: content-box;
15175}
15176.swiper-container-android .swiper-slide,
15177.swiper-wrapper {
15178 -webkit-transform: translate3d(0px, 0, 0);
15179 transform: translate3d(0px, 0, 0);
15180}
15181.swiper-container-multirow > .swiper-wrapper {
15182 -webkit-flex-wrap: wrap;
15183 -ms-flex-wrap: wrap;
15184 flex-wrap: wrap;
15185}
15186.swiper-container-free-mode > .swiper-wrapper {
15187 -webkit-transition-timing-function: ease-out;
15188 transition-timing-function: ease-out;
15189 margin: 0 auto;
15190}
15191.swiper-slide {
15192 -webkit-flex-shrink: 0;
15193 -ms-flex-negative: 0;
15194 flex-shrink: 0;
15195 width: 100%;
15196 height: 100%;
15197 position: relative;
15198 -webkit-transition-property: -webkit-transform;
15199 transition-property: -webkit-transform;
15200 transition-property: transform;
15201 transition-property: transform, -webkit-transform;
15202}
15203.swiper-slide-invisible-blank {
15204 visibility: hidden;
15205}
15206/* Auto Height */
15207.swiper-container-autoheight,
15208.swiper-container-autoheight .swiper-slide {
15209 height: auto;
15210}
15211.swiper-container-autoheight .swiper-wrapper {
15212 -webkit-box-align: start;
15213 -webkit-align-items: flex-start;
15214 -ms-flex-align: start;
15215 align-items: flex-start;
15216 -webkit-transition-property: height, -webkit-transform;
15217 transition-property: height, -webkit-transform;
15218 transition-property: transform, height;
15219 transition-property: transform, height, -webkit-transform;
15220}
15221/* 3D Effects */
15222.swiper-container-3d {
15223 -webkit-perspective: 1200px;
15224 perspective: 1200px;
15225}
15226.swiper-container-3d .swiper-wrapper,
15227.swiper-container-3d .swiper-slide,
15228.swiper-container-3d .swiper-slide-shadow-left,
15229.swiper-container-3d .swiper-slide-shadow-right,
15230.swiper-container-3d .swiper-slide-shadow-top,
15231.swiper-container-3d .swiper-slide-shadow-bottom,
15232.swiper-container-3d .swiper-cube-shadow {
15233 -webkit-transform-style: preserve-3d;
15234 transform-style: preserve-3d;
15235}
15236.swiper-container-3d .swiper-slide-shadow-left,
15237.swiper-container-3d .swiper-slide-shadow-right,
15238.swiper-container-3d .swiper-slide-shadow-top,
15239.swiper-container-3d .swiper-slide-shadow-bottom {
15240 position: absolute;
15241 left: 0;
15242 top: 0;
15243 width: 100%;
15244 height: 100%;
15245 pointer-events: none;
15246 z-index: 10;
15247}
15248.swiper-container-3d .swiper-slide-shadow-left {
15249 background-image: -webkit-gradient(linear, right top, left top, from(rgba(0, 0, 0, 0.5)), to(rgba(0, 0, 0, 0)));
15250 background-image: -webkit-linear-gradient(right, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
15251 background-image: linear-gradient(to left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
15252}
15253.swiper-container-3d .swiper-slide-shadow-right {
15254 background-image: -webkit-gradient(linear, left top, right top, from(rgba(0, 0, 0, 0.5)), to(rgba(0, 0, 0, 0)));
15255 background-image: -webkit-linear-gradient(left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
15256 background-image: linear-gradient(to right, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
15257}
15258.swiper-container-3d .swiper-slide-shadow-top {
15259 background-image: -webkit-gradient(linear, left bottom, left top, from(rgba(0, 0, 0, 0.5)), to(rgba(0, 0, 0, 0)));
15260 background-image: -webkit-linear-gradient(bottom, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
15261 background-image: linear-gradient(to top, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
15262}
15263.swiper-container-3d .swiper-slide-shadow-bottom {
15264 background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0.5)), to(rgba(0, 0, 0, 0)));
15265 background-image: -webkit-linear-gradient(top, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
15266 background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
15267}
15268/* IE10 Windows Phone 8 Fixes */
15269.swiper-container-wp8-horizontal,
15270.swiper-container-wp8-horizontal > .swiper-wrapper {
15271 -ms-touch-action: pan-y;
15272 touch-action: pan-y;
15273}
15274.swiper-container-wp8-vertical,
15275.swiper-container-wp8-vertical > .swiper-wrapper {
15276 -ms-touch-action: pan-x;
15277 touch-action: pan-x;
15278}
15279/* a11y */
15280.swiper-container .swiper-notification {
15281 position: absolute;
15282 left: 0;
15283 top: 0;
15284 pointer-events: none;
15285 opacity: 0;
15286 z-index: -1000;
15287}
15288.swiper-container-coverflow .swiper-wrapper {
15289 /* Windows 8 IE 10 fix */
15290 -ms-perspective: 1200px;
15291}
15292.swiper-container-cube {
15293 overflow: visible;
15294}
15295.swiper-container-cube .swiper-slide {
15296 pointer-events: none;
15297 -webkit-backface-visibility: hidden;
15298 backface-visibility: hidden;
15299 z-index: 1;
15300 visibility: hidden;
15301 -webkit-transform-origin: 0 0;
15302 transform-origin: 0 0;
15303 width: 100%;
15304 height: 100%;
15305}
15306.swiper-container-cube .swiper-slide .swiper-slide {
15307 pointer-events: none;
15308}
15309.swiper-container-cube.swiper-container-rtl .swiper-slide {
15310 -webkit-transform-origin: 100% 0;
15311 transform-origin: 100% 0;
15312}
15313.swiper-container-cube .swiper-slide-active,
15314.swiper-container-cube .swiper-slide-active .swiper-slide-active {
15315 pointer-events: auto;
15316}
15317.swiper-container-cube .swiper-slide-active,
15318.swiper-container-cube .swiper-slide-next,
15319.swiper-container-cube .swiper-slide-prev,
15320.swiper-container-cube .swiper-slide-next + .swiper-slide {
15321 pointer-events: auto;
15322 visibility: visible;
15323}
15324.swiper-container-cube .swiper-slide-shadow-top,
15325.swiper-container-cube .swiper-slide-shadow-bottom,
15326.swiper-container-cube .swiper-slide-shadow-left,
15327.swiper-container-cube .swiper-slide-shadow-right {
15328 z-index: 0;
15329 -webkit-backface-visibility: hidden;
15330 backface-visibility: hidden;
15331}
15332.swiper-container-cube .swiper-cube-shadow {
15333 position: absolute;
15334 left: 0;
15335 bottom: 0px;
15336 width: 100%;
15337 height: 100%;
15338 background: #000;
15339 opacity: 0.6;
15340 -webkit-filter: blur(50px);
15341 filter: blur(50px);
15342 z-index: 0;
15343}
15344.swiper-container-fade.swiper-container-free-mode .swiper-slide {
15345 -webkit-transition-timing-function: ease-out;
15346 transition-timing-function: ease-out;
15347}
15348.swiper-container-fade .swiper-slide {
15349 pointer-events: none;
15350 -webkit-transition-property: opacity;
15351 transition-property: opacity;
15352}
15353.swiper-container-fade .swiper-slide .swiper-slide {
15354 pointer-events: none;
15355}
15356.swiper-container-fade .swiper-slide-active,
15357.swiper-container-fade .swiper-slide-active .swiper-slide-active {
15358 pointer-events: auto;
15359}
15360.swiper-container-flip {
15361 overflow: visible;
15362}
15363.swiper-container-flip .swiper-slide {
15364 pointer-events: none;
15365 -webkit-backface-visibility: hidden;
15366 backface-visibility: hidden;
15367 z-index: 1;
15368}
15369.swiper-container-flip .swiper-slide .swiper-slide {
15370 pointer-events: none;
15371}
15372.swiper-container-flip .swiper-slide-active,
15373.swiper-container-flip .swiper-slide-active .swiper-slide-active {
15374 pointer-events: auto;
15375}
15376.swiper-container-flip .swiper-slide-shadow-top,
15377.swiper-container-flip .swiper-slide-shadow-bottom,
15378.swiper-container-flip .swiper-slide-shadow-left,
15379.swiper-container-flip .swiper-slide-shadow-right {
15380 z-index: 0;
15381 -webkit-backface-visibility: hidden;
15382 backface-visibility: hidden;
15383}
15384/* Scrollbar */
15385.swiper-scrollbar {
15386 border-radius: 10px;
15387 position: relative;
15388 -ms-touch-action: none;
15389 background: rgba(0, 0, 0, 0.1);
15390}
15391.swiper-container-horizontal > .swiper-scrollbar {
15392 position: absolute;
15393 left: 1%;
15394 bottom: 3px;
15395 z-index: 50;
15396 height: 5px;
15397 width: 98%;
15398}
15399.swiper-container-vertical > .swiper-scrollbar {
15400 position: absolute;
15401 right: 3px;
15402 top: 1%;
15403 z-index: 50;
15404 width: 5px;
15405 height: 98%;
15406}
15407.swiper-scrollbar-drag {
15408 height: 100%;
15409 width: 100%;
15410 position: relative;
15411 background: rgba(0, 0, 0, 0.5);
15412 border-radius: 10px;
15413 left: 0;
15414 top: 0;
15415}
15416.swiper-scrollbar-cursor-drag {
15417 cursor: move;
15418}
15419.swiper-scrollbar-lock {
15420 display: none;
15421}
15422.swiper-zoom-container {
15423 width: 100%;
15424 height: 100%;
15425 display: -webkit-box;
15426 display: -webkit-flex;
15427 display: -ms-flexbox;
15428 display: flex;
15429 -webkit-box-pack: center;
15430 -webkit-justify-content: center;
15431 -ms-flex-pack: center;
15432 justify-content: center;
15433 -webkit-box-align: center;
15434 -webkit-align-items: center;
15435 -ms-flex-align: center;
15436 align-items: center;
15437 text-align: center;
15438}
15439.swiper-zoom-container > img,
15440.swiper-zoom-container > svg,
15441.swiper-zoom-container > canvas {
15442 max-width: 100%;
15443 max-height: 100%;
15444 -o-object-fit: contain;
15445 object-fit: contain;
15446}
15447.swiper-slide-zoomed {
15448 cursor: move;
15449}
15450.swiper-button-prev,
15451.swiper-button-next {
15452 position: absolute;
15453 top: 50%;
15454 width: 27px;
15455 height: 44px;
15456 margin-top: -22px;
15457 z-index: 10;
15458 cursor: pointer;
15459 background-size: 27px 44px;
15460 background-position: center;
15461 background-repeat: no-repeat;
15462}
15463.swiper-button-prev.swiper-button-disabled,
15464.swiper-button-next.swiper-button-disabled {
15465 opacity: 0.35;
15466 cursor: auto;
15467 pointer-events: none;
15468}
15469.swiper-button-prev,
15470.swiper-container-rtl .swiper-button-next {
15471 left: 10px;
15472 right: auto;
15473}
15474.swiper-button-next,
15475.swiper-container-rtl .swiper-button-prev {
15476 right: 10px;
15477 left: auto;
15478}
15479.swiper-pagination {
15480 position: absolute;
15481 text-align: center;
15482 -webkit-transition: 300ms opacity;
15483 transition: 300ms opacity;
15484 -webkit-transform: translate3d(0, 0, 0);
15485 transform: translate3d(0, 0, 0);
15486 z-index: 10;
15487}
15488.swiper-pagination.swiper-pagination-hidden {
15489 opacity: 0;
15490}
15491.swiper-pagination-fraction,
15492.swiper-pagination-custom,
15493.swiper-container-horizontal > .swiper-pagination-bullets {
15494 bottom: 10px;
15495 left: 0;
15496 width: 100%;
15497}
15498.swiper-pagination-bullets-dynamic {
15499 overflow: hidden;
15500 font-size: 0;
15501}
15502.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
15503 -webkit-transform: scale(0.33);
15504 transform: scale(0.33);
15505 position: relative;
15506}
15507.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active {
15508 -webkit-transform: scale(1);
15509 transform: scale(1);
15510}
15511.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev {
15512 -webkit-transform: scale(0.66);
15513 transform: scale(0.66);
15514}
15515.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev-prev {
15516 -webkit-transform: scale(0.33);
15517 transform: scale(0.33);
15518}
15519.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next {
15520 -webkit-transform: scale(0.66);
15521 transform: scale(0.66);
15522}
15523.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next-next {
15524 -webkit-transform: scale(0.33);
15525 transform: scale(0.33);
15526}
15527.swiper-pagination-bullet {
15528 width: 8px;
15529 height: 8px;
15530 display: inline-block;
15531 border-radius: 100%;
15532 background: #000;
15533 opacity: 0.2;
15534}
15535button.swiper-pagination-bullet {
15536 border: none;
15537 margin: 0;
15538 padding: 0;
15539 -webkit-box-shadow: none;
15540 box-shadow: none;
15541 -webkit-appearance: none;
15542 -moz-appearance: none;
15543 appearance: none;
15544}
15545.swiper-pagination-clickable .swiper-pagination-bullet {
15546 cursor: pointer;
15547}
15548.swiper-pagination-bullet-active {
15549 opacity: 1;
15550}
15551.swiper-container-vertical > .swiper-pagination-bullets {
15552 right: 10px;
15553 top: 50%;
15554 -webkit-transform: translate3d(0px, -50%, 0);
15555 transform: translate3d(0px, -50%, 0);
15556}
15557.swiper-container-vertical > .swiper-pagination-bullets .swiper-pagination-bullet {
15558 margin: 6px 0;
15559 display: block;
15560}
15561.swiper-container-vertical > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic {
15562 top: 50%;
15563 -webkit-transform: translateY(-50%);
15564 transform: translateY(-50%);
15565 width: 8px;
15566}
15567.swiper-container-vertical > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
15568 display: inline-block;
15569 -webkit-transition: 200ms top, 200ms -webkit-transform;
15570 transition: 200ms top, 200ms -webkit-transform;
15571 transition: 200ms transform, 200ms top;
15572 transition: 200ms transform, 200ms top, 200ms -webkit-transform;
15573}
15574.swiper-container-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet {
15575 margin: 0 4px;
15576}
15577.swiper-container-horizontal > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic {
15578 left: 50%;
15579 -webkit-transform: translateX(-50%);
15580 transform: translateX(-50%);
15581 white-space: nowrap;
15582}
15583.swiper-container-horizontal > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
15584 -webkit-transition: 200ms left, 200ms -webkit-transform;
15585 transition: 200ms left, 200ms -webkit-transform;
15586 transition: 200ms transform, 200ms left;
15587 transition: 200ms transform, 200ms left, 200ms -webkit-transform;
15588}
15589.swiper-pagination-progressbar {
15590 background: rgba(0, 0, 0, 0.25);
15591 position: absolute;
15592}
15593.swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
15594 position: absolute;
15595 left: 0;
15596 top: 0;
15597 width: 100%;
15598 height: 100%;
15599 -webkit-transform: scale(0);
15600 transform: scale(0);
15601 -webkit-transform-origin: left top;
15602 transform-origin: left top;
15603}
15604.swiper-container-rtl .swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
15605 -webkit-transform-origin: right top;
15606 transform-origin: right top;
15607}
15608.swiper-container-horizontal > .swiper-pagination-progressbar,
15609.swiper-container-vertical > .swiper-pagination-progressbar.swiper-pagination-progressbar-opposite {
15610 width: 100%;
15611 height: 4px;
15612 left: 0;
15613 top: 0;
15614}
15615.swiper-container-vertical > .swiper-pagination-progressbar,
15616.swiper-container-horizontal > .swiper-pagination-progressbar.swiper-pagination-progressbar-opposite {
15617 width: 4px;
15618 height: 100%;
15619 left: 0;
15620 top: 0;
15621}
15622.swiper-lazy-preloader {
15623 position: absolute;
15624 left: 50%;
15625 top: 50%;
15626 z-index: 10;
15627}
15628.ios .swiper-lazy-preloader {
15629 width: 32px;
15630 height: 32px;
15631 margin-left: -16px;
15632 margin-top: -16px;
15633}
15634.ios .swiper-button-prev,
15635.ios .swiper-container-rtl .swiper-button-next {
15636 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'%23007aff'%2F%3E%3C%2Fsvg%3E");
15637}
15638.ios .swiper-button-next,
15639.ios .swiper-container-rtl .swiper-button-prev {
15640 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'%23007aff'%2F%3E%3C%2Fsvg%3E");
15641}
15642.ios .swiper-pagination-bullet-active {
15643 background: #007aff;
15644}
15645.ios .swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
15646 background: #007aff;
15647}
15648.ios .swiper-button-prev.color-red,
15649.ios .swiper-container-rtl .swiper-button-next.color-red,
15650.ios .color-theme-red .swiper-button-prev,
15651.ios .color-theme-red .swiper-container-rtl .swiper-button-next {
15652 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'%23ff3b30'%2F%3E%3C%2Fsvg%3E");
15653}
15654.ios .swiper-button-next.color-red,
15655.ios .swiper-container-rtl .swiper-button-prev.color-red,
15656.ios .color-theme-red .swiper-button-next,
15657.ios .color-theme-red .swiper-container-rtl .swiper-button-prev {
15658 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'%23ff3b30'%2F%3E%3C%2Fsvg%3E");
15659}
15660.ios .color-red .swiper-pagination-bullet-active,
15661.ios .color-theme-red .swiper-pagination-bullet-active {
15662 background: #ff3b30;
15663}
15664.ios .color-red .swiper-pagination-progressbar,
15665.ios .color-theme-red .swiper-pagination-progressbar,
15666.ios .color-red.swiper-pagination-progressbar,
15667.ios .color-theme-red.swiper-pagination-progressbar {
15668 background: rgba(255, 59, 48, 0.25);
15669}
15670.ios .color-red .swiper-pagination-progressbar .swiper-pagination-progressbar-fill,
15671.ios .color-theme-red .swiper-pagination-progressbar .swiper-pagination-progressbar-fill,
15672.ios .color-red.swiper-pagination-progressbar .swiper-pagination-progressbar-fill,
15673.ios .color-theme-red.swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
15674 background: #ff3b30;
15675}
15676.ios .swiper-button-prev.color-green,
15677.ios .swiper-container-rtl .swiper-button-next.color-green,
15678.ios .color-theme-green .swiper-button-prev,
15679.ios .color-theme-green .swiper-container-rtl .swiper-button-next {
15680 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'%234cd964'%2F%3E%3C%2Fsvg%3E");
15681}
15682.ios .swiper-button-next.color-green,
15683.ios .swiper-container-rtl .swiper-button-prev.color-green,
15684.ios .color-theme-green .swiper-button-next,
15685.ios .color-theme-green .swiper-container-rtl .swiper-button-prev {
15686 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'%234cd964'%2F%3E%3C%2Fsvg%3E");
15687}
15688.ios .color-green .swiper-pagination-bullet-active,
15689.ios .color-theme-green .swiper-pagination-bullet-active {
15690 background: #4cd964;
15691}
15692.ios .color-green .swiper-pagination-progressbar,
15693.ios .color-theme-green .swiper-pagination-progressbar,
15694.ios .color-green.swiper-pagination-progressbar,
15695.ios .color-theme-green.swiper-pagination-progressbar {
15696 background: rgba(76, 217, 100, 0.25);
15697}
15698.ios .color-green .swiper-pagination-progressbar .swiper-pagination-progressbar-fill,
15699.ios .color-theme-green .swiper-pagination-progressbar .swiper-pagination-progressbar-fill,
15700.ios .color-green.swiper-pagination-progressbar .swiper-pagination-progressbar-fill,
15701.ios .color-theme-green.swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
15702 background: #4cd964;
15703}
15704.ios .swiper-button-prev.color-blue,
15705.ios .swiper-container-rtl .swiper-button-next.color-blue,
15706.ios .color-theme-blue .swiper-button-prev,
15707.ios .color-theme-blue .swiper-container-rtl .swiper-button-next {
15708 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'%23007aff'%2F%3E%3C%2Fsvg%3E");
15709}
15710.ios .swiper-button-next.color-blue,
15711.ios .swiper-container-rtl .swiper-button-prev.color-blue,
15712.ios .color-theme-blue .swiper-button-next,
15713.ios .color-theme-blue .swiper-container-rtl .swiper-button-prev {
15714 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'%23007aff'%2F%3E%3C%2Fsvg%3E");
15715}
15716.ios .color-blue .swiper-pagination-bullet-active,
15717.ios .color-theme-blue .swiper-pagination-bullet-active {
15718 background: #007aff;
15719}
15720.ios .color-blue .swiper-pagination-progressbar,
15721.ios .color-theme-blue .swiper-pagination-progressbar,
15722.ios .color-blue.swiper-pagination-progressbar,
15723.ios .color-theme-blue.swiper-pagination-progressbar {
15724 background: rgba(0, 122, 255, 0.25);
15725}
15726.ios .color-blue .swiper-pagination-progressbar .swiper-pagination-progressbar-fill,
15727.ios .color-theme-blue .swiper-pagination-progressbar .swiper-pagination-progressbar-fill,
15728.ios .color-blue.swiper-pagination-progressbar .swiper-pagination-progressbar-fill,
15729.ios .color-theme-blue.swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
15730 background: #007aff;
15731}
15732.ios .swiper-button-prev.color-pink,
15733.ios .swiper-container-rtl .swiper-button-next.color-pink,
15734.ios .color-theme-pink .swiper-button-prev,
15735.ios .color-theme-pink .swiper-container-rtl .swiper-button-next {
15736 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'%23ff2d55'%2F%3E%3C%2Fsvg%3E");
15737}
15738.ios .swiper-button-next.color-pink,
15739.ios .swiper-container-rtl .swiper-button-prev.color-pink,
15740.ios .color-theme-pink .swiper-button-next,
15741.ios .color-theme-pink .swiper-container-rtl .swiper-button-prev {
15742 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'%23ff2d55'%2F%3E%3C%2Fsvg%3E");
15743}
15744.ios .color-pink .swiper-pagination-bullet-active,
15745.ios .color-theme-pink .swiper-pagination-bullet-active {
15746 background: #ff2d55;
15747}
15748.ios .color-pink .swiper-pagination-progressbar,
15749.ios .color-theme-pink .swiper-pagination-progressbar,
15750.ios .color-pink.swiper-pagination-progressbar,
15751.ios .color-theme-pink.swiper-pagination-progressbar {
15752 background: rgba(255, 45, 85, 0.25);
15753}
15754.ios .color-pink .swiper-pagination-progressbar .swiper-pagination-progressbar-fill,
15755.ios .color-theme-pink .swiper-pagination-progressbar .swiper-pagination-progressbar-fill,
15756.ios .color-pink.swiper-pagination-progressbar .swiper-pagination-progressbar-fill,
15757.ios .color-theme-pink.swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
15758 background: #ff2d55;
15759}
15760.ios .swiper-button-prev.color-yellow,
15761.ios .swiper-container-rtl .swiper-button-next.color-yellow,
15762.ios .color-theme-yellow .swiper-button-prev,
15763.ios .color-theme-yellow .swiper-container-rtl .swiper-button-next {
15764 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'%23ffcc00'%2F%3E%3C%2Fsvg%3E");
15765}
15766.ios .swiper-button-next.color-yellow,
15767.ios .swiper-container-rtl .swiper-button-prev.color-yellow,
15768.ios .color-theme-yellow .swiper-button-next,
15769.ios .color-theme-yellow .swiper-container-rtl .swiper-button-prev {
15770 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'%23ffcc00'%2F%3E%3C%2Fsvg%3E");
15771}
15772.ios .color-yellow .swiper-pagination-bullet-active,
15773.ios .color-theme-yellow .swiper-pagination-bullet-active {
15774 background: #ffcc00;
15775}
15776.ios .color-yellow .swiper-pagination-progressbar,
15777.ios .color-theme-yellow .swiper-pagination-progressbar,
15778.ios .color-yellow.swiper-pagination-progressbar,
15779.ios .color-theme-yellow.swiper-pagination-progressbar {
15780 background: rgba(255, 204, 0, 0.25);
15781}
15782.ios .color-yellow .swiper-pagination-progressbar .swiper-pagination-progressbar-fill,
15783.ios .color-theme-yellow .swiper-pagination-progressbar .swiper-pagination-progressbar-fill,
15784.ios .color-yellow.swiper-pagination-progressbar .swiper-pagination-progressbar-fill,
15785.ios .color-theme-yellow.swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
15786 background: #ffcc00;
15787}
15788.ios .swiper-button-prev.color-orange,
15789.ios .swiper-container-rtl .swiper-button-next.color-orange,
15790.ios .color-theme-orange .swiper-button-prev,
15791.ios .color-theme-orange .swiper-container-rtl .swiper-button-next {
15792 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'%23ff9500'%2F%3E%3C%2Fsvg%3E");
15793}
15794.ios .swiper-button-next.color-orange,
15795.ios .swiper-container-rtl .swiper-button-prev.color-orange,
15796.ios .color-theme-orange .swiper-button-next,
15797.ios .color-theme-orange .swiper-container-rtl .swiper-button-prev {
15798 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'%23ff9500'%2F%3E%3C%2Fsvg%3E");
15799}
15800.ios .color-orange .swiper-pagination-bullet-active,
15801.ios .color-theme-orange .swiper-pagination-bullet-active {
15802 background: #ff9500;
15803}
15804.ios .color-orange .swiper-pagination-progressbar,
15805.ios .color-theme-orange .swiper-pagination-progressbar,
15806.ios .color-orange.swiper-pagination-progressbar,
15807.ios .color-theme-orange.swiper-pagination-progressbar {
15808 background: rgba(255, 149, 0, 0.25);
15809}
15810.ios .color-orange .swiper-pagination-progressbar .swiper-pagination-progressbar-fill,
15811.ios .color-theme-orange .swiper-pagination-progressbar .swiper-pagination-progressbar-fill,
15812.ios .color-orange.swiper-pagination-progressbar .swiper-pagination-progressbar-fill,
15813.ios .color-theme-orange.swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
15814 background: #ff9500;
15815}
15816.ios .swiper-button-prev.color-gray,
15817.ios .swiper-container-rtl .swiper-button-next.color-gray,
15818.ios .color-theme-gray .swiper-button-prev,
15819.ios .color-theme-gray .swiper-container-rtl .swiper-button-next {
15820 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'%238e8e93'%2F%3E%3C%2Fsvg%3E");
15821}
15822.ios .swiper-button-next.color-gray,
15823.ios .swiper-container-rtl .swiper-button-prev.color-gray,
15824.ios .color-theme-gray .swiper-button-next,
15825.ios .color-theme-gray .swiper-container-rtl .swiper-button-prev {
15826 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'%238e8e93'%2F%3E%3C%2Fsvg%3E");
15827}
15828.ios .color-gray .swiper-pagination-bullet-active,
15829.ios .color-theme-gray .swiper-pagination-bullet-active {
15830 background: #8e8e93;
15831}
15832.ios .color-gray .swiper-pagination-progressbar,
15833.ios .color-theme-gray .swiper-pagination-progressbar,
15834.ios .color-gray.swiper-pagination-progressbar,
15835.ios .color-theme-gray.swiper-pagination-progressbar {
15836 background: rgba(142, 142, 147, 0.25);
15837}
15838.ios .color-gray .swiper-pagination-progressbar .swiper-pagination-progressbar-fill,
15839.ios .color-theme-gray .swiper-pagination-progressbar .swiper-pagination-progressbar-fill,
15840.ios .color-gray.swiper-pagination-progressbar .swiper-pagination-progressbar-fill,
15841.ios .color-theme-gray.swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
15842 background: #8e8e93;
15843}
15844.ios .swiper-button-prev.color-white,
15845.ios .swiper-container-rtl .swiper-button-next.color-white,
15846.ios .color-theme-white .swiper-button-prev,
15847.ios .color-theme-white .swiper-container-rtl .swiper-button-next {
15848 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");
15849}
15850.ios .swiper-button-next.color-white,
15851.ios .swiper-container-rtl .swiper-button-prev.color-white,
15852.ios .color-theme-white .swiper-button-next,
15853.ios .color-theme-white .swiper-container-rtl .swiper-button-prev {
15854 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");
15855}
15856.ios .color-white .swiper-pagination-bullet-active,
15857.ios .color-theme-white .swiper-pagination-bullet-active {
15858 background: #ffffff;
15859}
15860.ios .color-white .swiper-pagination-progressbar,
15861.ios .color-theme-white .swiper-pagination-progressbar,
15862.ios .color-white.swiper-pagination-progressbar,
15863.ios .color-theme-white.swiper-pagination-progressbar {
15864 background: rgba(255, 255, 255, 0.25);
15865}
15866.ios .color-white .swiper-pagination-progressbar .swiper-pagination-progressbar-fill,
15867.ios .color-theme-white .swiper-pagination-progressbar .swiper-pagination-progressbar-fill,
15868.ios .color-white.swiper-pagination-progressbar .swiper-pagination-progressbar-fill,
15869.ios .color-theme-white.swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
15870 background: #ffffff;
15871}
15872.ios .swiper-button-prev.color-black,
15873.ios .swiper-container-rtl .swiper-button-next.color-black,
15874.ios .color-theme-black .swiper-button-prev,
15875.ios .color-theme-black .swiper-container-rtl .swiper-button-next {
15876 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");
15877}
15878.ios .swiper-button-next.color-black,
15879.ios .swiper-container-rtl .swiper-button-prev.color-black,
15880.ios .color-theme-black .swiper-button-next,
15881.ios .color-theme-black .swiper-container-rtl .swiper-button-prev {
15882 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");
15883}
15884.ios .color-black .swiper-pagination-bullet-active,
15885.ios .color-theme-black .swiper-pagination-bullet-active {
15886 background: #000000;
15887}
15888.ios .color-black .swiper-pagination-progressbar,
15889.ios .color-theme-black .swiper-pagination-progressbar,
15890.ios .color-black.swiper-pagination-progressbar,
15891.ios .color-theme-black.swiper-pagination-progressbar {
15892 background: rgba(0, 0, 0, 0.25);
15893}
15894.ios .color-black .swiper-pagination-progressbar .swiper-pagination-progressbar-fill,
15895.ios .color-theme-black .swiper-pagination-progressbar .swiper-pagination-progressbar-fill,
15896.ios .color-black.swiper-pagination-progressbar .swiper-pagination-progressbar-fill,
15897.ios .color-theme-black.swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
15898 background: #000000;
15899}
15900/* === Photo Browser === */
15901.photo-browser {
15902 position: absolute;
15903 left: 0;
15904 top: 0;
15905 width: 100%;
15906 height: 100%;
15907 z-index: 400;
15908}
15909.photo-browser-standalone.modal-in {
15910 -webkit-transition-duration: 0ms;
15911 transition-duration: 0ms;
15912 -webkit-animation: photo-browser-in 400ms;
15913 animation: photo-browser-in 400ms;
15914}
15915.photo-browser-standalone.modal-out {
15916 -webkit-transition-duration: 0ms;
15917 transition-duration: 0ms;
15918 -webkit-animation: photo-browser-out 400ms;
15919 animation: photo-browser-out 400ms;
15920}
15921.photo-browser-standalone.modal-out.swipe-close-to-bottom,
15922.photo-browser-standalone.modal-out.swipe-close-to-top {
15923 -webkit-animation: none;
15924 animation: none;
15925}
15926.photo-browser-popup.modal-out.swipe-close-to-bottom,
15927.photo-browser-popup.modal-out.swipe-close-to-top {
15928 -webkit-transition-duration: 300ms;
15929 transition-duration: 300ms;
15930}
15931.photo-browser-popup.modal-out.swipe-close-to-bottom {
15932 -webkit-transform: translate3d(0, 100%, 0);
15933 transform: translate3d(0, 100%, 0);
15934}
15935.photo-browser-popup.modal-out.swipe-close-to-top {
15936 -webkit-transform: translate3d(0, -100vh, 0);
15937 transform: translate3d(0, -100vh, 0);
15938}
15939.page.photo-browser-page {
15940 background: none;
15941}
15942.photo-browser-popup {
15943 background: none;
15944}
15945.photo-browser-exposed .navbar,
15946.photo-browser-exposed .toolbar {
15947 opacity: 0;
15948 visibility: hidden;
15949 pointer-events: none;
15950}
15951.photo-browser-exposed .photo-browser-swiper-container {
15952 background: #000;
15953}
15954.photo-browser-of {
15955 margin: 0 5px;
15956}
15957.photo-browser-captions {
15958 pointer-events: none;
15959 position: absolute;
15960 left: 0;
15961 width: 100%;
15962 bottom: 0;
15963 z-index: 10;
15964 opacity: 1;
15965 -webkit-transition: 400ms;
15966 transition: 400ms;
15967}
15968.photo-browser-captions.photo-browser-captions-exposed {
15969 opacity: 0;
15970}
15971.photo-browser-caption {
15972 -webkit-box-sizing: border-box;
15973 box-sizing: border-box;
15974 -webkit-transition: 300ms;
15975 transition: 300ms;
15976 position: absolute;
15977 bottom: 0;
15978 left: 0;
15979 opacity: 0;
15980 padding: 4px 5px;
15981 width: 100%;
15982 text-align: center;
15983 color: #fff;
15984 background: rgba(0, 0, 0, 0.8);
15985}
15986.photo-browser-caption:empty {
15987 display: none;
15988}
15989.photo-browser-caption.photo-browser-caption-active {
15990 opacity: 1;
15991}
15992.photo-browser-captions-light .photo-browser-caption {
15993 background: rgba(255, 255, 255, 0.8);
15994 color: #000;
15995}
15996.photo-browser-captions-dark .photo-browser-caption {
15997 color: #fff;
15998}
15999.photo-browser-exposed .photo-browser-caption {
16000 color: #fff;
16001 background: rgba(0, 0, 0, 0.8);
16002}
16003.photo-browser-swiper-container {
16004 position: absolute;
16005 left: 0;
16006 top: 0;
16007 width: 100%;
16008 height: 100%;
16009 overflow: hidden;
16010 background: #fff;
16011 -webkit-transition: 400ms;
16012 transition: 400ms;
16013 -webkit-transition-property: background-color;
16014 transition-property: background-color;
16015}
16016.photo-browser-prev.swiper-button-disabled,
16017.photo-browser-next.swiper-button-disabled {
16018 opacity: 0.3;
16019}
16020.photo-browser-slide {
16021 width: 100%;
16022 height: 100%;
16023 position: relative;
16024 overflow: hidden;
16025 display: -webkit-box;
16026 display: -webkit-flex;
16027 display: -ms-flexbox;
16028 display: flex;
16029 -webkit-box-pack: center;
16030 -webkit-justify-content: center;
16031 -ms-flex-pack: center;
16032 justify-content: center;
16033 -webkit-box-align: center;
16034 -webkit-align-items: center;
16035 -ms-flex-align: center;
16036 align-items: center;
16037 -webkit-flex-shrink: 0;
16038 -ms-flex-negative: 0;
16039 flex-shrink: 0;
16040 -webkit-box-sizing: border-box;
16041 box-sizing: border-box;
16042}
16043.photo-browser-slide.photo-browser-transitioning {
16044 -webkit-transition: 400ms;
16045 transition: 400ms;
16046 -webkit-transition-property: -webkit-transform;
16047 transition-property: -webkit-transform;
16048 transition-property: transform;
16049 transition-property: transform, -webkit-transform;
16050}
16051.photo-browser-slide span.swiper-zoom-container {
16052 display: none;
16053}
16054.photo-browser-slide img {
16055 width: auto;
16056 height: auto;
16057 max-width: 100%;
16058 max-height: 100%;
16059 display: none;
16060}
16061.photo-browser-slide.swiper-slide-active span.swiper-zoom-container,
16062.photo-browser-slide.swiper-slide-next span.swiper-zoom-container,
16063.photo-browser-slide.swiper-slide-prev span.swiper-zoom-container {
16064 display: -webkit-box;
16065 display: -webkit-flex;
16066 display: -ms-flexbox;
16067 display: flex;
16068}
16069.photo-browser-slide.swiper-slide-active img,
16070.photo-browser-slide.swiper-slide-next img,
16071.photo-browser-slide.swiper-slide-prev img {
16072 display: inline;
16073}
16074.photo-browser-slide.swiper-slide-active.photo-browser-slide-lazy .preloader,
16075.photo-browser-slide.swiper-slide-next.photo-browser-slide-lazy .preloader,
16076.photo-browser-slide.swiper-slide-prev.photo-browser-slide-lazy .preloader {
16077 display: block;
16078}
16079.photo-browser-slide iframe {
16080 width: 100%;
16081 height: 100%;
16082}
16083.photo-browser-slide .preloader {
16084 display: none;
16085 position: absolute;
16086 width: 42px;
16087 height: 42px;
16088 margin-left: -21px;
16089 margin-top: -21px;
16090 left: 50%;
16091 top: 50%;
16092}
16093.photo-browser-dark .photo-browser-swiper-container,
16094.photo-browser-page-dark .photo-browser-swiper-container {
16095 background: #000;
16096}
16097@-webkit-keyframes photo-browser-in {
16098 0% {
16099 -webkit-transform: translate3d(0, 0, 0) scale(0.5);
16100 transform: translate3d(0, 0, 0) scale(0.5);
16101 opacity: 0;
16102 }
16103 50% {
16104 -webkit-transform: translate3d(0, 0, 0) scale(1.05);
16105 transform: translate3d(0, 0, 0) scale(1.05);
16106 opacity: 1;
16107 }
16108 100% {
16109 -webkit-transform: translate3d(0, 0, 0) scale(1);
16110 transform: translate3d(0, 0, 0) scale(1);
16111 opacity: 1;
16112 }
16113}
16114@keyframes photo-browser-in {
16115 0% {
16116 -webkit-transform: translate3d(0, 0, 0) scale(0.5);
16117 transform: translate3d(0, 0, 0) scale(0.5);
16118 opacity: 0;
16119 }
16120 50% {
16121 -webkit-transform: translate3d(0, 0, 0) scale(1.05);
16122 transform: translate3d(0, 0, 0) scale(1.05);
16123 opacity: 1;
16124 }
16125 100% {
16126 -webkit-transform: translate3d(0, 0, 0) scale(1);
16127 transform: translate3d(0, 0, 0) scale(1);
16128 opacity: 1;
16129 }
16130}
16131@-webkit-keyframes photo-browser-out {
16132 0% {
16133 -webkit-transform: translate3d(0, 0, 0) scale(1);
16134 transform: translate3d(0, 0, 0) scale(1);
16135 opacity: 1;
16136 }
16137 50% {
16138 -webkit-transform: translate3d(0, 0, 0) scale(1.05);
16139 transform: translate3d(0, 0, 0) scale(1.05);
16140 opacity: 1;
16141 }
16142 100% {
16143 -webkit-transform: translate3d(0, 0, 0) scale(0.5);
16144 transform: translate3d(0, 0, 0) scale(0.5);
16145 opacity: 0;
16146 }
16147}
16148@keyframes photo-browser-out {
16149 0% {
16150 -webkit-transform: translate3d(0, 0, 0) scale(1);
16151 transform: translate3d(0, 0, 0) scale(1);
16152 opacity: 1;
16153 }
16154 50% {
16155 -webkit-transform: translate3d(0, 0, 0) scale(1.05);
16156 transform: translate3d(0, 0, 0) scale(1.05);
16157 opacity: 1;
16158 }
16159 100% {
16160 -webkit-transform: translate3d(0, 0, 0) scale(0.5);
16161 transform: translate3d(0, 0, 0) scale(0.5);
16162 opacity: 0;
16163 }
16164}
16165.ios .toolbar ~ .photo-browser-captions {
16166 bottom: 44px;
16167 -webkit-transform: translate3d(0, 0px, 0);
16168 transform: translate3d(0, 0px, 0);
16169}
16170.ios .toolbar ~ .photo-browser-captions.photo-browser-captions-exposed {
16171 -webkit-transform: translate3d(0, 0px, 0);
16172 transform: translate3d(0, 0px, 0);
16173}
16174.ios .photo-browser-exposed .toolbar ~ .photo-browser-captions {
16175 -webkit-transform: translate3d(0, 44px, 0);
16176 transform: translate3d(0, 44px, 0);
16177}
16178.ios .photo-browser-page .toolbar {
16179 -webkit-transform: none;
16180 transform: none;
16181}
16182.ios .view.with-photo-browser-page-exposed .navbar {
16183 opacity: 0;
16184}
16185.ios .photo-browser-page .navbar,
16186.ios .view.with-photo-browser-page .navbar,
16187.ios .photo-browser-page .toolbar,
16188.ios .view.with-photo-browser-page .toolbar {
16189 background: rgba(247, 247, 248, 0.95);
16190 -webkit-transition: 400ms;
16191 transition: 400ms;
16192}
16193.ios .photo-browser-dark .navbar,
16194.ios .photo-browser-page-dark .navbar,
16195.ios .view.with-photo-browser-page-dark .navbar,
16196.ios .photo-browser-dark .toolbar,
16197.ios .photo-browser-page-dark .toolbar,
16198.ios .view.with-photo-browser-page-dark .toolbar {
16199 background: rgba(30, 30, 30, 0.8);
16200 color: #fff;
16201}
16202.ios .photo-browser-dark .navbar:before,
16203.ios .photo-browser-page-dark .navbar:before,
16204.ios .view.with-photo-browser-page-dark .navbar:before,
16205.ios .photo-browser-dark .toolbar:before,
16206.ios .photo-browser-page-dark .toolbar:before,
16207.ios .view.with-photo-browser-page-dark .toolbar:before {
16208 display: none !important;
16209}
16210.ios .photo-browser-dark .navbar:after,
16211.ios .photo-browser-page-dark .navbar:after,
16212.ios .view.with-photo-browser-page-dark .navbar:after,
16213.ios .photo-browser-dark .toolbar:after,
16214.ios .photo-browser-page-dark .toolbar:after,
16215.ios .view.with-photo-browser-page-dark .toolbar:after {
16216 display: none !important;
16217}
16218.ios .photo-browser-dark .navbar a,
16219.ios .photo-browser-page-dark .navbar a,
16220.ios .view.with-photo-browser-page-dark .navbar a,
16221.ios .photo-browser-dark .toolbar a,
16222.ios .photo-browser-page-dark .toolbar a,
16223.ios .view.with-photo-browser-page-dark .toolbar a {
16224 color: #fff;
16225}
16226.ios.device-iphone-x .photo-browser-captions {
16227 bottom: constant(safe-area-inset-bottom);
16228 bottom: env(safe-area-inset-bottom);
16229}
16230.ios.device-iphone-x .toolbar ~ .photo-browser-captions {
16231 bottom: calc(44px + constant(safe-area-inset-bottom));
16232 bottom: calc(44px + env(safe-area-inset-bottom));
16233}
16234/* === Notifications === */
16235.notification {
16236 position: absolute;
16237 left: 0;
16238 top: 0;
16239 width: 100%;
16240 z-index: 20000;
16241 font-size: 14px;
16242 margin: 0;
16243 border: none;
16244 display: none;
16245 -webkit-box-sizing: border-box;
16246 box-sizing: border-box;
16247 -webkit-transition-property: -webkit-transform;
16248 transition-property: -webkit-transform;
16249 transition-property: transform;
16250 transition-property: transform, -webkit-transform;
16251 direction: ltr;
16252}
16253.notification-icon {
16254 font-size: 0;
16255}
16256.notification-header {
16257 display: -webkit-box;
16258 display: -webkit-flex;
16259 display: -ms-flexbox;
16260 display: flex;
16261 -webkit-box-pack: start;
16262 -webkit-justify-content: flex-start;
16263 -ms-flex-pack: start;
16264 justify-content: flex-start;
16265 -webkit-box-align: center;
16266 -webkit-align-items: center;
16267 -ms-flex-align: center;
16268 align-items: center;
16269}
16270.notification-close-button {
16271 margin-left: auto;
16272 cursor: pointer;
16273}
16274html.with-statusbar.device-ios .notification,
16275html.with-statusbar.ios:not(.device-ios):not(.device-android) .notification {
16276 margin-top: 20px;
16277}
16278html.with-statusbar.device-android .notification,
16279html.with-statusbar.md:not(.device-ios):not(.device-android) .notification {
16280 margin-top: 24px;
16281}
16282html.with-statusbar.device-iphone-x .notification {
16283 margin-top: constant(safe-area-inset-top);
16284 margin-top: env(safe-area-inset-top);
16285}
16286.ios .notification {
16287 left: 8px;
16288 top: 8px;
16289 width: calc(100% - 16px);
16290 background: rgba(250, 250, 250, 0.95);
16291 border-radius: 12px;
16292 -webkit-box-shadow: 0px 5px 25px -10px rgba(0, 0, 0, 0.7);
16293 box-shadow: 0px 5px 25px -10px rgba(0, 0, 0, 0.7);
16294 padding: 10px;
16295 color: #000;
16296 max-width: 568px;
16297 -webkit-transition-duration: 450ms;
16298 transition-duration: 450ms;
16299 -webkit-transform: translate3d(0%, -200%, 0);
16300 transform: translate3d(0%, -200%, 0);
16301}
16302@supports ((-webkit-backdrop-filter: blur(10px)) or (backdrop-filter: blur(10px))) {
16303 .ios .notification {
16304 background: rgba(255, 255, 255, 0.65);
16305 -webkit-backdrop-filter: blur(10px);
16306 backdrop-filter: blur(10px);
16307 }
16308}
16309@media (min-width: 584px) {
16310 .ios .notification {
16311 left: 50%;
16312 width: 568px;
16313 margin-left: -284px;
16314 }
16315}
16316.ios .notification.modal-in {
16317 -webkit-transform: translate3d(0%, 0%, 0);
16318 transform: translate3d(0%, 0%, 0);
16319 opacity: 1;
16320}
16321.ios .notification.modal-out {
16322 -webkit-transform: translate3d(0%, -200%, 0);
16323 transform: translate3d(0%, -200%, 0);
16324}
16325.ios .notification-icon {
16326 width: 20px;
16327 height: 20px;
16328 line-height: 20px;
16329 margin-right: 8px;
16330}
16331.ios .notification-icon i {
16332 width: 20px;
16333 height: 20px;
16334 font-size: 20px;
16335}
16336.ios .notification-title {
16337 font-size: 13px;
16338 text-transform: uppercase;
16339 letter-spacing: 0.02em;
16340}
16341.ios .notification-subtitle {
16342 font-size: 15px;
16343 font-weight: 600;
16344 line-height: 1.35;
16345}
16346.ios .notification-text {
16347 font-size: 15px;
16348 line-height: 1.2;
16349}
16350.ios .notification-header + .notification-content {
16351 margin-top: 10px;
16352}
16353.ios .notification-title-right-text {
16354 color: #444a51;
16355 font-size: 13px;
16356 margin-right: 6px;
16357 margin-left: auto;
16358}
16359.ios .notification-title-right-text + .notification-close-button {
16360 margin-left: 10px;
16361}
16362.ios .notification-close-button {
16363 background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20viewBox%3D'0%200%2044%2044'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%3Cg%20stroke%3D'none'%20stroke-width%3D'1'%20fill%3D'none'%20fill-rule%3D'evenodd'%3E%3Cpath%20d%3D'M22.5%2C20.3786797%20L14.7218254%2C12.6005051%20L12.6005051%2C14.7218254%20L20.3786797%2C22.5%20L12.6005051%2C30.2781746%20L14.7218254%2C32.3994949%20L22.5%2C24.6213203%20L30.2781746%2C32.3994949%20L32.3994949%2C30.2781746%20L24.6213203%2C22.5%20L32.3994949%2C14.7218254%20L30.2781746%2C12.6005051%20L22.5%2C20.3786797%20Z%20M22%2C44%20C34.1502645%2C44%2044%2C34.1502645%2044%2C22%20C44%2C9.8497355%2034.1502645%2C0%2022%2C0%20C9.8497355%2C0%200%2C9.8497355%200%2C22%20C0%2C34.1502645%209.8497355%2C44%2022%2C44%20Z'%20fill%3D'%23000000'%3E%3C%2Fpath%3E%3C%2Fg%3E%3C%2Fsvg%3E");
16364 width: 20px;
16365 height: 20px;
16366 background-position: center top;
16367 background-repeat: no-repeat;
16368 background-size: 100% auto;
16369 position: relative;
16370 opacity: 0.3;
16371 -webkit-transition-duration: 300ms;
16372 transition-duration: 300ms;
16373}
16374.ios .notification-close-button.active-state {
16375 -webkit-transition-duration: 0ms;
16376 transition-duration: 0ms;
16377 opacity: 0.1;
16378}
16379.ios .notification-close-button:after {
16380 content: '';
16381 position: absolute;
16382 left: 50%;
16383 top: 50%;
16384 width: 44px;
16385 height: 44px;
16386 margin-left: -22px;
16387 margin-top: -22px;
16388}
16389/* === Autocomplete === */
16390.autocomplete-page .autocomplete-found {
16391 display: block;
16392}
16393.autocomplete-page .autocomplete-not-found {
16394 display: none;
16395}
16396.autocomplete-page .autocomplete-values {
16397 display: block;
16398}
16399.autocomplete-page .list ul:empty {
16400 display: none;
16401}
16402.autocomplete-preloader:not(.autocomplete-preloader-visible) {
16403 visibility: hidden;
16404}
16405.autocomplete-preloader:not(.autocomplete-preloader-visible),
16406.autocomplete-preloader:not(.autocomplete-preloader-visible) * {
16407 -webkit-animation: none;
16408 animation: none;
16409}
16410.autocomplete-dropdown {
16411 background: #fff;
16412 -webkit-box-sizing: border-box;
16413 box-sizing: border-box;
16414 position: absolute;
16415 z-index: 500;
16416 width: 100%;
16417 left: 0;
16418}
16419.autocomplete-dropdown .autocomplete-dropdown-inner {
16420 position: relative;
16421 overflow: auto;
16422 -webkit-overflow-scrolling: touch;
16423 height: 100%;
16424 z-index: 1;
16425}
16426.autocomplete-dropdown .autocomplete-preloader {
16427 display: none;
16428 position: absolute;
16429 bottom: 100%;
16430 width: 20px;
16431 height: 20px;
16432}
16433.autocomplete-dropdown .autocomplete-preloader-visible {
16434 display: block;
16435}
16436.autocomplete-dropdown .autocomplete-dropdown-placeholder {
16437 color: #a9a9a9;
16438}
16439.autocomplete-dropdown .list {
16440 margin: 0;
16441}
16442.autocomplete-dropdown .list ul {
16443 background: none !important;
16444}
16445.autocomplete-dropdown .list ul:before {
16446 display: none !important;
16447}
16448.autocomplete-dropdown .list ul:after {
16449 display: none !important;
16450}
16451.list .item-content-dropdown-expanded .item-title.item-label {
16452 width: 0;
16453 -webkit-flex-shrink: 10;
16454 -ms-flex-negative: 10;
16455 flex-shrink: 10;
16456 overflow: hidden;
16457}
16458.list .item-content-dropdown-expanded .item-title.item-label + .item-input-wrap {
16459 margin-left: 0;
16460}
16461.list .item-content-dropdown-expanded .item-input-wrap {
16462 width: 100%;
16463}
16464.ios .autocomplete-dropdown {
16465 -webkit-box-shadow: 0px 3px 3px rgba(0, 0, 0, 0.2);
16466 box-shadow: 0px 3px 3px rgba(0, 0, 0, 0.2);
16467}
16468.ios .autocomplete-dropdown .autocomplete-preloader {
16469 right: 15px;
16470 margin-bottom: 12px;
16471}
16472.ios .autocomplete-dropdown .list b {
16473 font-weight: 600;
16474}
16475.ios .searchbar-input-wrap .autocomplete-dropdown {
16476 margin-top: -32px;
16477 top: 100%;
16478 background: #e8e8ea;
16479 z-index: 20;
16480 border-radius: 8px;
16481}
16482.ios .searchbar-input-wrap .autocomplete-dropdown .item-content {
16483 padding-left: 28px;
16484}
16485.ios .searchbar-input-wrap .autocomplete-dropdown li:last-child {
16486 border-radius: 0 0 8px 8px;
16487 position: relative;
16488 overflow: hidden;
16489}
16490.ios .searchbar-input-wrap .autocomplete-dropdown .autocomplete-dropdown-inner {
16491 padding-top: 32px;
16492}
16493.ios .searchbar-input-wrap .autocomplete-dropdown .autocomplete-dropdown-placeholder {
16494 color: #939398;
16495}
16496.ios .theme-dark .autocomplete-dropdown {
16497 background-color: #1c1c1d;
16498}
16499.ios .theme-dark .searchbar-input-wrap .autocomplete-dropdown {
16500 background-color: #171717;
16501}
16502/* === Tooltip === */
16503.tooltip {
16504 position: absolute;
16505 z-index: 20000;
16506 background: rgba(0, 0, 0, 0.87);
16507 border-radius: 4px;
16508 padding: 8px 16px;
16509 color: #fff;
16510 font-size: 14px;
16511 -webkit-box-sizing: border-box;
16512 box-sizing: border-box;
16513 line-height: 1.2;
16514 opacity: 0;
16515 -webkit-transform: scale(0.9);
16516 transform: scale(0.9);
16517 -webkit-transition-duration: 150ms;
16518 transition-duration: 150ms;
16519 -webkit-transition-property: opacity, -webkit-transform;
16520 transition-property: opacity, -webkit-transform;
16521 transition-property: opacity, transform;
16522 transition-property: opacity, transform, -webkit-transform;
16523 z-index: 99000;
16524 font-weight: 500;
16525}
16526.tooltip.tooltip-in {
16527 -webkit-transform: scale(1);
16528 transform: scale(1);
16529 opacity: 1;
16530}
16531.tooltip.tooltip-out {
16532 opacity: 0;
16533 -webkit-transform: scale(1);
16534 transform: scale(1);
16535}
16536.device-desktop .tooltip {
16537 font-size: 12px;
16538 padding: 6px 8px;
16539}
16540/* === Gauge === */
16541.gauge {
16542 position: relative;
16543 text-align: center;
16544 margin-left: auto;
16545 margin-right: auto;
16546 display: inline-block;
16547}
16548.gauge-svg,
16549.gauge svg {
16550 max-width: 100%;
16551 height: auto;
16552}
16553.gauge-svg circle,
16554.gauge svg circle,
16555.gauge-svg path,
16556.gauge svg path {
16557 -webkit-transition-duration: 400ms;
16558 transition-duration: 400ms;
16559}
16560iframe#viAd {
16561 z-index: 12900 !important;
16562 background: #000 !important;
16563}
16564.vi-overlay {
16565 background: rgba(0, 0, 0, 0.85);
16566 z-index: 13100;
16567 position: absolute;
16568 left: 0%;
16569 top: 0%;
16570 width: 100%;
16571 height: 100%;
16572 border-radius: 3px;
16573 display: -webkit-box;
16574 display: -webkit-flex;
16575 display: -ms-flexbox;
16576 display: flex;
16577 -webkit-box-pack: center;
16578 -webkit-justify-content: center;
16579 -ms-flex-pack: center;
16580 justify-content: center;
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 -webkit-box-align: center;
16587 -webkit-align-items: center;
16588 -ms-flex-align: center;
16589 align-items: center;
16590 -webkit-align-content: center;
16591 -ms-flex-line-pack: center;
16592 align-content: center;
16593 text-align: center;
16594 -webkit-user-select: none;
16595 -moz-user-select: none;
16596 -ms-user-select: none;
16597 user-select: none;
16598}
16599@supports ((-webkit-backdrop-filter: blur(10px)) or (backdrop-filter: blur(10px))) {
16600 .vi-overlay {
16601 background: rgba(0, 0, 0, 0.65);
16602 -webkit-backdrop-filter: blur(10px);
16603 backdrop-filter: blur(10px);
16604 }
16605}
16606.vi-overlay .vi-overlay-text {
16607 text-align: center;
16608 color: #fff;
16609 max-width: 80%;
16610}
16611.vi-overlay .vi-overlay-text + .vi-overlay-play-button {
16612 margin-top: 15px;
16613}
16614.vi-overlay .vi-overlay-play-button {
16615 width: 44px;
16616 height: 44px;
16617 border-radius: 50%;
16618 border: 2px solid #fff;
16619 position: relative;
16620}
16621.vi-overlay .vi-overlay-play-button.active-state {
16622 opacity: 0.55;
16623}
16624.vi-overlay .vi-overlay-play-button:before {
16625 content: '';
16626 width: 0;
16627 height: 0;
16628 border-top: 8px solid transparent;
16629 border-bottom: 8px solid transparent;
16630 border-left: 14px solid #fff;
16631 position: absolute;
16632 left: 50%;
16633 top: 50%;
16634 margin-left: 2px;
16635 -webkit-transform: translate(-50%, -50%);
16636 transform: translate(-50%, -50%);
16637}
16638/* === Elevation === */
16639.elevation-0 {
16640 -webkit-box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0) !important;
16641 box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0) !important;
16642}
16643.elevation-1 {
16644 -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;
16645 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;
16646}
16647.elevation-2 {
16648 -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;
16649 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;
16650}
16651.elevation-3 {
16652 -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;
16653 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;
16654}
16655.elevation-4 {
16656 -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;
16657 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;
16658}
16659.elevation-5 {
16660 -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;
16661 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;
16662}
16663.elevation-6 {
16664 -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;
16665 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;
16666}
16667.elevation-7 {
16668 -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;
16669 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;
16670}
16671.elevation-8 {
16672 -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;
16673 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;
16674}
16675.elevation-9 {
16676 -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;
16677 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;
16678}
16679.elevation-10 {
16680 -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;
16681 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;
16682}
16683.elevation-11 {
16684 -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;
16685 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;
16686}
16687.elevation-12 {
16688 -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;
16689 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;
16690}
16691.elevation-13 {
16692 -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;
16693 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;
16694}
16695.elevation-14 {
16696 -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;
16697 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;
16698}
16699.elevation-15 {
16700 -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;
16701 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;
16702}
16703.elevation-16 {
16704 -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;
16705 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;
16706}
16707.elevation-17 {
16708 -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;
16709 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;
16710}
16711.elevation-18 {
16712 -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;
16713 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;
16714}
16715.elevation-19 {
16716 -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;
16717 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;
16718}
16719.elevation-20 {
16720 -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;
16721 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;
16722}
16723.elevation-21 {
16724 -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;
16725 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;
16726}
16727.elevation-22 {
16728 -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;
16729 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;
16730}
16731.elevation-23 {
16732 -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;
16733 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;
16734}
16735.elevation-24 {
16736 -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;
16737 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;
16738}
16739.device-desktop .elevation-hover-0:hover {
16740 -webkit-box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0) !important;
16741 box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0) !important;
16742}
16743.device-desktop .elevation-hover-1:hover {
16744 -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;
16745 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;
16746}
16747.device-desktop .elevation-hover-2:hover {
16748 -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;
16749 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;
16750}
16751.device-desktop .elevation-hover-3:hover {
16752 -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;
16753 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;
16754}
16755.device-desktop .elevation-hover-4:hover {
16756 -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;
16757 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;
16758}
16759.device-desktop .elevation-hover-5:hover {
16760 -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;
16761 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;
16762}
16763.device-desktop .elevation-hover-6:hover {
16764 -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;
16765 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;
16766}
16767.device-desktop .elevation-hover-7:hover {
16768 -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;
16769 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;
16770}
16771.device-desktop .elevation-hover-8:hover {
16772 -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;
16773 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;
16774}
16775.device-desktop .elevation-hover-9:hover {
16776 -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;
16777 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;
16778}
16779.device-desktop .elevation-hover-10:hover {
16780 -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;
16781 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;
16782}
16783.device-desktop .elevation-hover-11:hover {
16784 -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;
16785 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;
16786}
16787.device-desktop .elevation-hover-12:hover {
16788 -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;
16789 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;
16790}
16791.device-desktop .elevation-hover-13:hover {
16792 -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;
16793 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;
16794}
16795.device-desktop .elevation-hover-14:hover {
16796 -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;
16797 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;
16798}
16799.device-desktop .elevation-hover-15:hover {
16800 -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;
16801 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;
16802}
16803.device-desktop .elevation-hover-16:hover {
16804 -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;
16805 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;
16806}
16807.device-desktop .elevation-hover-17:hover {
16808 -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;
16809 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;
16810}
16811.device-desktop .elevation-hover-18:hover {
16812 -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;
16813 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;
16814}
16815.device-desktop .elevation-hover-19:hover {
16816 -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;
16817 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;
16818}
16819.device-desktop .elevation-hover-20:hover {
16820 -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;
16821 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;
16822}
16823.device-desktop .elevation-hover-21:hover {
16824 -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;
16825 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;
16826}
16827.device-desktop .elevation-hover-22:hover {
16828 -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;
16829 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;
16830}
16831.device-desktop .elevation-hover-23:hover {
16832 -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;
16833 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;
16834}
16835.device-desktop .elevation-hover-24:hover {
16836 -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;
16837 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;
16838}
16839.active-state.elevation-pressed-0,
16840.device-desktop .active-state.elevation-pressed-0 {
16841 -webkit-box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0) !important;
16842 box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0) !important;
16843}
16844.active-state.elevation-pressed-1,
16845.device-desktop .active-state.elevation-pressed-1 {
16846 -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;
16847 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;
16848}
16849.active-state.elevation-pressed-2,
16850.device-desktop .active-state.elevation-pressed-2 {
16851 -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;
16852 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;
16853}
16854.active-state.elevation-pressed-3,
16855.device-desktop .active-state.elevation-pressed-3 {
16856 -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;
16857 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;
16858}
16859.active-state.elevation-pressed-4,
16860.device-desktop .active-state.elevation-pressed-4 {
16861 -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;
16862 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;
16863}
16864.active-state.elevation-pressed-5,
16865.device-desktop .active-state.elevation-pressed-5 {
16866 -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;
16867 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;
16868}
16869.active-state.elevation-pressed-6,
16870.device-desktop .active-state.elevation-pressed-6 {
16871 -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;
16872 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;
16873}
16874.active-state.elevation-pressed-7,
16875.device-desktop .active-state.elevation-pressed-7 {
16876 -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;
16877 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;
16878}
16879.active-state.elevation-pressed-8,
16880.device-desktop .active-state.elevation-pressed-8 {
16881 -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;
16882 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;
16883}
16884.active-state.elevation-pressed-9,
16885.device-desktop .active-state.elevation-pressed-9 {
16886 -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;
16887 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;
16888}
16889.active-state.elevation-pressed-10,
16890.device-desktop .active-state.elevation-pressed-10 {
16891 -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;
16892 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;
16893}
16894.active-state.elevation-pressed-11,
16895.device-desktop .active-state.elevation-pressed-11 {
16896 -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;
16897 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;
16898}
16899.active-state.elevation-pressed-12,
16900.device-desktop .active-state.elevation-pressed-12 {
16901 -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;
16902 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;
16903}
16904.active-state.elevation-pressed-13,
16905.device-desktop .active-state.elevation-pressed-13 {
16906 -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;
16907 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;
16908}
16909.active-state.elevation-pressed-14,
16910.device-desktop .active-state.elevation-pressed-14 {
16911 -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;
16912 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;
16913}
16914.active-state.elevation-pressed-15,
16915.device-desktop .active-state.elevation-pressed-15 {
16916 -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;
16917 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;
16918}
16919.active-state.elevation-pressed-16,
16920.device-desktop .active-state.elevation-pressed-16 {
16921 -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;
16922 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;
16923}
16924.active-state.elevation-pressed-17,
16925.device-desktop .active-state.elevation-pressed-17 {
16926 -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;
16927 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;
16928}
16929.active-state.elevation-pressed-18,
16930.device-desktop .active-state.elevation-pressed-18 {
16931 -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;
16932 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;
16933}
16934.active-state.elevation-pressed-19,
16935.device-desktop .active-state.elevation-pressed-19 {
16936 -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;
16937 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;
16938}
16939.active-state.elevation-pressed-20,
16940.device-desktop .active-state.elevation-pressed-20 {
16941 -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;
16942 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;
16943}
16944.active-state.elevation-pressed-21,
16945.device-desktop .active-state.elevation-pressed-21 {
16946 -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;
16947 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;
16948}
16949.active-state.elevation-pressed-22,
16950.device-desktop .active-state.elevation-pressed-22 {
16951 -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;
16952 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;
16953}
16954.active-state.elevation-pressed-23,
16955.device-desktop .active-state.elevation-pressed-23 {
16956 -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;
16957 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;
16958}
16959.active-state.elevation-pressed-24,
16960.device-desktop .active-state.elevation-pressed-24 {
16961 -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;
16962 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;
16963}
16964.elevation-transition-100 {
16965 -webkit-transition-duration: 100ms;
16966 transition-duration: 100ms;
16967 -webkit-transition-property: -webkit-box-shadow;
16968 transition-property: -webkit-box-shadow;
16969 transition-property: box-shadow;
16970 transition-property: box-shadow, -webkit-box-shadow;
16971}
16972.elevation-transition,
16973.elevation-transition-200 {
16974 -webkit-transition-duration: 200ms;
16975 transition-duration: 200ms;
16976 -webkit-transition-property: -webkit-box-shadow;
16977 transition-property: -webkit-box-shadow;
16978 transition-property: box-shadow;
16979 transition-property: box-shadow, -webkit-box-shadow;
16980}
16981.elevation-transition-300 {
16982 -webkit-transition-duration: 300ms;
16983 transition-duration: 300ms;
16984 -webkit-transition-property: -webkit-box-shadow;
16985 transition-property: -webkit-box-shadow;
16986 transition-property: box-shadow;
16987 transition-property: box-shadow, -webkit-box-shadow;
16988}
16989.elevation-transition-400 {
16990 -webkit-transition-duration: 400ms;
16991 transition-duration: 400ms;
16992 -webkit-transition-property: -webkit-box-shadow;
16993 transition-property: -webkit-box-shadow;
16994 transition-property: box-shadow;
16995 transition-property: box-shadow, -webkit-box-shadow;
16996}
16997.elevation-transition-500 {
16998 -webkit-transition-duration: 500ms;
16999 transition-duration: 500ms;
17000 -webkit-transition-property: -webkit-box-shadow;
17001 transition-property: -webkit-box-shadow;
17002 transition-property: box-shadow;
17003 transition-property: box-shadow, -webkit-box-shadow;
17004}
17005/* === Typography === */
17006.display-flex {
17007 display: -webkit-box !important;
17008 display: -webkit-flex !important;
17009 display: -ms-flexbox !important;
17010 display: flex !important;
17011}
17012.display-block {
17013 display: block !important;
17014}
17015.display-inline-flex {
17016 display: -webkit-inline-box !important;
17017 display: -webkit-inline-flex !important;
17018 display: -ms-inline-flexbox !important;
17019 display: inline-flex !important;
17020}
17021.display-inline-block {
17022 display: inline-block !important;
17023}
17024.display-inline {
17025 display: inline !important;
17026}
17027.display-none {
17028 display: none !important;
17029}
17030.flex-shrink-0 {
17031 -webkit-flex-shrink: 0 !important;
17032 -ms-flex-negative: 0 !important;
17033 flex-shrink: 0 !important;
17034}
17035.flex-shrink-1 {
17036 -webkit-flex-shrink: 1 !important;
17037 -ms-flex-negative: 1 !important;
17038 flex-shrink: 1 !important;
17039}
17040.flex-shrink-2 {
17041 -webkit-flex-shrink: 2 !important;
17042 -ms-flex-negative: 2 !important;
17043 flex-shrink: 2 !important;
17044}
17045.flex-shrink-3 {
17046 -webkit-flex-shrink: 3 !important;
17047 -ms-flex-negative: 3 !important;
17048 flex-shrink: 3 !important;
17049}
17050.flex-shrink-4 {
17051 -webkit-flex-shrink: 4 !important;
17052 -ms-flex-negative: 4 !important;
17053 flex-shrink: 4 !important;
17054}
17055.flex-shrink-5 {
17056 -webkit-flex-shrink: 5 !important;
17057 -ms-flex-negative: 5 !important;
17058 flex-shrink: 5 !important;
17059}
17060.flex-shrink-6 {
17061 -webkit-flex-shrink: 6 !important;
17062 -ms-flex-negative: 6 !important;
17063 flex-shrink: 6 !important;
17064}
17065.flex-shrink-7 {
17066 -webkit-flex-shrink: 7 !important;
17067 -ms-flex-negative: 7 !important;
17068 flex-shrink: 7 !important;
17069}
17070.flex-shrink-8 {
17071 -webkit-flex-shrink: 8 !important;
17072 -ms-flex-negative: 8 !important;
17073 flex-shrink: 8 !important;
17074}
17075.flex-shrink-9 {
17076 -webkit-flex-shrink: 9 !important;
17077 -ms-flex-negative: 9 !important;
17078 flex-shrink: 9 !important;
17079}
17080.flex-shrink-10 {
17081 -webkit-flex-shrink: 10 !important;
17082 -ms-flex-negative: 10 !important;
17083 flex-shrink: 10 !important;
17084}
17085.justify-content-flex-start {
17086 -webkit-box-pack: start !important;
17087 -webkit-justify-content: flex-start !important;
17088 -ms-flex-pack: start !important;
17089 justify-content: flex-start !important;
17090}
17091.justify-content-center {
17092 -webkit-box-pack: center !important;
17093 -webkit-justify-content: center !important;
17094 -ms-flex-pack: center !important;
17095 justify-content: center !important;
17096}
17097.justify-content-flex-end {
17098 -webkit-box-pack: end !important;
17099 -webkit-justify-content: flex-end !important;
17100 -ms-flex-pack: end !important;
17101 justify-content: flex-end !important;
17102}
17103.justify-content-space-between {
17104 -webkit-box-pack: justify !important;
17105 -webkit-justify-content: space-between !important;
17106 -ms-flex-pack: justify !important;
17107 justify-content: space-between !important;
17108}
17109.justify-content-space-around {
17110 -webkit-justify-content: space-around !important;
17111 -ms-flex-pack: distribute !important;
17112 justify-content: space-around !important;
17113}
17114.justify-content-space-evenly {
17115 -webkit-box-pack: space-evenly !important;
17116 -webkit-justify-content: space-evenly !important;
17117 -ms-flex-pack: space-evenly !important;
17118 justify-content: space-evenly !important;
17119}
17120.justify-content-stretch {
17121 -webkit-box-pack: stretch !important;
17122 -webkit-justify-content: stretch !important;
17123 -ms-flex-pack: stretch !important;
17124 justify-content: stretch !important;
17125}
17126.justify-content-start {
17127 -webkit-box-pack: start !important;
17128 -webkit-justify-content: start !important;
17129 -ms-flex-pack: start !important;
17130 justify-content: start !important;
17131}
17132.justify-content-end {
17133 -webkit-box-pack: end !important;
17134 -webkit-justify-content: end !important;
17135 -ms-flex-pack: end !important;
17136 justify-content: end !important;
17137}
17138.justify-content-left {
17139 -webkit-box-pack: left !important;
17140 -webkit-justify-content: left !important;
17141 -ms-flex-pack: left !important;
17142 justify-content: left !important;
17143}
17144.justify-content-right {
17145 -webkit-box-pack: right !important;
17146 -webkit-justify-content: right !important;
17147 -ms-flex-pack: right !important;
17148 justify-content: right !important;
17149}
17150.align-content-flex-start {
17151 -webkit-align-content: flex-start !important;
17152 -ms-flex-line-pack: start !important;
17153 align-content: flex-start !important;
17154}
17155.align-content-flex-end {
17156 -webkit-align-content: flex-end !important;
17157 -ms-flex-line-pack: end !important;
17158 align-content: flex-end !important;
17159}
17160.align-content-center {
17161 -webkit-align-content: center !important;
17162 -ms-flex-line-pack: center !important;
17163 align-content: center !important;
17164}
17165.align-content-space-between {
17166 -webkit-align-content: space-between !important;
17167 -ms-flex-line-pack: justify !important;
17168 align-content: space-between !important;
17169}
17170.align-content-space-around {
17171 -webkit-align-content: space-around !important;
17172 -ms-flex-line-pack: distribute !important;
17173 align-content: space-around !important;
17174}
17175.align-content-stretch {
17176 -webkit-align-content: stretch !important;
17177 -ms-flex-line-pack: stretch !important;
17178 align-content: stretch !important;
17179}
17180.align-items-flex-start {
17181 -webkit-box-align: start !important;
17182 -webkit-align-items: flex-start !important;
17183 -ms-flex-align: start !important;
17184 align-items: flex-start !important;
17185}
17186.align-items-flex-end {
17187 -webkit-box-align: end !important;
17188 -webkit-align-items: flex-end !important;
17189 -ms-flex-align: end !important;
17190 align-items: flex-end !important;
17191}
17192.align-items-center {
17193 -webkit-box-align: center !important;
17194 -webkit-align-items: center !important;
17195 -ms-flex-align: center !important;
17196 align-items: center !important;
17197}
17198.align-items-stretch {
17199 -webkit-box-align: stretch !important;
17200 -webkit-align-items: stretch !important;
17201 -ms-flex-align: stretch !important;
17202 align-items: stretch !important;
17203}
17204.align-self-flex-start {
17205 -webkit-align-self: flex-start !important;
17206 -ms-flex-item-align: start !important;
17207 align-self: flex-start !important;
17208}
17209.align-self-flex-end {
17210 -webkit-align-self: flex-end !important;
17211 -ms-flex-item-align: end !important;
17212 align-self: flex-end !important;
17213}
17214.align-self-center {
17215 -webkit-align-self: center !important;
17216 -ms-flex-item-align: center !important;
17217 align-self: center !important;
17218}
17219.align-self-stretch {
17220 -webkit-align-self: stretch !important;
17221 -ms-flex-item-align: stretch !important;
17222 align-self: stretch !important;
17223}
17224.text-align-left {
17225 text-align: left !important;
17226}
17227.text-align-center {
17228 text-align: center !important;
17229}
17230.text-align-right {
17231 text-align: right !important;
17232}
17233.text-align-justify {
17234 text-align: justify !important;
17235}
17236.float-left {
17237 float: left !important;
17238}
17239.float-right {
17240 float: right !important;
17241}
17242.float-none {
17243 float: none !important;
17244}
17245.vertical-align-bottom {
17246 vertical-align: bottom !important;
17247}
17248.vertical-align-middle {
17249 vertical-align: middle !important;
17250}
17251.vertical-align-top {
17252 vertical-align: top !important;
17253}
17254.no-padding {
17255 padding: 0 !important;
17256}
17257.no-padding-left {
17258 padding-left: 0 !important;
17259}
17260.no-padding-right {
17261 padding-right: 0 !important;
17262}
17263.no-padding-top {
17264 padding-top: 0 !important;
17265}
17266.no-padding-bottom {
17267 padding-bottom: 0 !important;
17268}
17269.no-margin {
17270 margin: 0 !important;
17271}
17272.no-margin-left {
17273 margin-left: 0 !important;
17274}
17275.no-margin-right {
17276 margin-right: 0 !important;
17277}
17278.no-margin-top {
17279 margin-top: 0 !important;
17280}
17281.no-margin-bottom {
17282 margin-bottom: 0 !important;
17283}
17284.width-auto {
17285 width: auto !important;
17286}
17287.width-100 {
17288 width: 100% !important;
17289}
17290.ios .padding {
17291 padding: 15px !important;
17292}
17293.ios .padding-top {
17294 padding-top: 15px !important;
17295}
17296.ios .padding-bottom {
17297 padding-bottom: 15px !important;
17298}
17299.ios .padding-left {
17300 padding-left: 15px !important;
17301}
17302.ios .padding-left-ios-edge {
17303 padding-left: constant(safe-area-inset-left);
17304 padding-left: env(safe-area-inset-left);
17305}
17306.ios .padding-right-ios-edge {
17307 padding-right: constant(safe-area-inset-right);
17308 padding-right: env(safe-area-inset-right);
17309}
17310.ios .padding-top-ios-edge {
17311 padding-top: constant(safe-area-inset-top);
17312 padding-top: env(safe-area-inset-top);
17313}
17314.ios .padding-bottom-ios-edge {
17315 padding-bottom: constant(safe-area-inset-bottom);
17316 padding-bottom: env(safe-area-inset-bottom);
17317}
17318.ios .padding-right {
17319 padding-right: 15px !important;
17320}
17321.ios .padding-vertical {
17322 padding-top: 15px !important;
17323 padding-bottom: 15px !important;
17324}
17325.ios .padding-horizontal {
17326 padding-left: 15px !important;
17327 padding-right: 15px !important;
17328}
17329.ios .margin {
17330 margin: 15px !important;
17331}
17332.ios .margin-top {
17333 margin-top: 15px !important;
17334}
17335.ios .margin-bottom {
17336 margin-bottom: 15px !important;
17337}
17338.ios .margin-left {
17339 margin-left: 15px !important;
17340}
17341.ios .margin-right {
17342 margin-right: 15px !important;
17343}
17344.ios .margin-vertical {
17345 margin-top: 15px !important;
17346 margin-bottom: 15px !important;
17347}
17348.ios .margin-horizontal {
17349 margin-left: 15px !important;
17350 margin-right: 15px !important;
17351}
17352.ios .text-color-red {
17353 color: #ff3b30 !important;
17354}
17355.ios .bg-color-red {
17356 background-color: #ff3b30 !important;
17357}
17358.ios .border-color-red {
17359 border-color: #ff3b30 !important;
17360}
17361.ios .text-color-green {
17362 color: #4cd964 !important;
17363}
17364.ios .bg-color-green {
17365 background-color: #4cd964 !important;
17366}
17367.ios .border-color-green {
17368 border-color: #4cd964 !important;
17369}
17370.ios .text-color-blue {
17371 color: #007aff !important;
17372}
17373.ios .bg-color-blue {
17374 background-color: #007aff !important;
17375}
17376.ios .border-color-blue {
17377 border-color: #007aff !important;
17378}
17379.ios .text-color-pink {
17380 color: #ff2d55 !important;
17381}
17382.ios .bg-color-pink {
17383 background-color: #ff2d55 !important;
17384}
17385.ios .border-color-pink {
17386 border-color: #ff2d55 !important;
17387}
17388.ios .text-color-yellow {
17389 color: #ffcc00 !important;
17390}
17391.ios .bg-color-yellow {
17392 background-color: #ffcc00 !important;
17393}
17394.ios .border-color-yellow {
17395 border-color: #ffcc00 !important;
17396}
17397.ios .text-color-orange {
17398 color: #ff9500 !important;
17399}
17400.ios .bg-color-orange {
17401 background-color: #ff9500 !important;
17402}
17403.ios .border-color-orange {
17404 border-color: #ff9500 !important;
17405}
17406.ios .text-color-gray {
17407 color: #8e8e93 !important;
17408}
17409.ios .bg-color-gray {
17410 background-color: #8e8e93 !important;
17411}
17412.ios .border-color-gray {
17413 border-color: #8e8e93 !important;
17414}
17415.ios .text-color-white {
17416 color: #ffffff !important;
17417}
17418.ios .bg-color-white {
17419 background-color: #ffffff !important;
17420}
17421.ios .border-color-white {
17422 border-color: #ffffff !important;
17423}
17424.ios .text-color-black {
17425 color: #000000 !important;
17426}
17427.ios .bg-color-black {
17428 background-color: #000000 !important;
17429}
17430.ios .border-color-black {
17431 border-color: #000000 !important;
17432}