]> git.proxmox.com Git - framework7.git/blob - framework7/css/framework7.ios.css
intial commit
[framework7.git] / framework7 / css / framework7.ios.css
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 */
12 html,
13 body,
14 .framework7-root {
15 position: relative;
16 height: 100%;
17 width: 100%;
18 overflow-x: hidden;
19 }
20 body {
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 /*
42 a, 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 }
65 a,
66 input,
67 textarea,
68 select {
69 outline: 0;
70 }
71 a {
72 cursor: pointer;
73 text-decoration: none;
74 }
75 p {
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 }
176 html.device-ios .statusbar,
177 html.ios:not(.device-ios):not(.device-android) .statusbar {
178 height: 20px;
179 }
180 html.device-android .statusbar,
181 html.md:not(.device-ios):not(.device-android) .statusbar {
182 height: 24px;
183 }
184 html.device-ios.device-iphone-x .statusbar {
185 height: constant(safe-area-inset-top);
186 height: env(safe-area-inset-top);
187 }
188 html.with-statusbar .statusbar {
189 display: block;
190 }
191 html.with-statusbar.device-ios .framework7-root,
192 html.with-statusbar.ios:not(.device-ios):not(.device-android) .framework7-root {
193 padding-top: 20px;
194 }
195 html.with-statusbar.device-android .framework7-root,
196 html.with-statusbar.md:not(.device-ios):not(.device-android) .framework7-root {
197 padding-top: 24px;
198 }
199 html.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,
2323 li.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,
2330 li.media-item .item-link .item-inner {
2331 background: none;
2332 }
2333 .media-list .item-media,
2334 li.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,
2340 li.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,
2346 li.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,
2350 li.media-item.chevron-center .item-link .item-inner,
2351 li.media-item .chevron-center .item-link .item-inner,
2352 li.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,
2365 li.media-item .no-chevron .item-title-row,
2366 li.media-item.no-chevron .item-title-row,
2367 .media-list.chevron-center .item-title-row,
2368 .media-list .chevron-center .item-title-row,
2369 li.media-item.chevron-center .item-title-row,
2370 li.media-item .chevron-center .item-title-row {
2371 background-image: none !important;
2372 }
2373 .media-list .item-link .item-inner,
2374 li.media-item .item-link .item-inner {
2375 background-image: none;
2376 }
2377 .media-list .item-link .item-title-row,
2378 li.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 }
2388 li.item-divider,
2389 .item-divider,
2390 li.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 }
2398 li.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 }
2407 li.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 }
2868 html.device-pixel-ratio-2 .ios li li:last-child .item-inner:after,
2869 html.device-pixel-ratio-2 .ios li:last-child li .item-inner:after {
2870 -webkit-transform: scaleY(0.5);
2871 transform: scaleY(0.5);
2872 }
2873 html.device-pixel-ratio-3 .ios li li:last-child .item-inner:after,
2874 html.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 }
3398 button {
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 }
3425 input[type="submit"].button,
3426 input[type="button"].button {
3427 width: 100%;
3428 }
3429 button {
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 === */
4088 i.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 }
4426 html.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 }
4768 html.with-modal-popup .framework7-root > .views .page-content,
4769 html.with-modal-popup .framework7-root > .view .page-content,
4770 html.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 }
4811 html.with-statusbar.device-ios .login-screen,
4812 html.with-statusbar.ios:not(.device-ios):not(.device-android) .login-screen {
4813 height: calc(100% - 20px);
4814 top: 20px;
4815 }
4816 html.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 }
4822 html.with-statusbar.device-android .login-screen,
4823 html.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 }
5635 html.with-statusbar.device-ios .toast-top,
5636 html.with-statusbar.ios:not(.device-ios):not(.device-android) .toast-top {
5637 margin-top: 20px;
5638 }
5639 html.with-statusbar.device-iphone-x .toast-top {
5640 margin-top: constant(safe-area-inset-top);
5641 margin-top: env(safe-area-inset-top);
5642 }
5643 html.with-statusbar.device-android .toast-top,
5644 html.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 }
5786 html.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 }
5865 body > .progressbar,
5866 .view > .progressbar,
5867 .views > .progressbar,
5868 .page > .progressbar,
5869 .panel > .progressbar,
5870 .popup > .progressbar,
5871 .framework7-root > .progressbar,
5872 body > .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 }
6541 html.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 }
7812 html.with-panel .framework7-root > .views .page-content,
7813 html.with-panel .framework7-root > .view .page-content {
7814 overflow: hidden;
7815 -webkit-overflow-scrolling: auto;
7816 }
7817 html.with-panel-left-cover .panel-backdrop,
7818 html.with-panel-right-cover .panel-backdrop {
7819 display: block;
7820 opacity: 1;
7821 }
7822 html.with-panel-left-reveal .panel-backdrop,
7823 html.with-panel-right-reveal .panel-backdrop,
7824 html.with-panel-transitioning .panel-backdrop {
7825 background: rgba(0, 0, 0, 0);
7826 display: block;
7827 opacity: 0;
7828 }
7829 html.with-panel-left-reveal .views,
7830 html.with-panel-left-reveal .framework7-root > .view,
7831 html.with-panel-left-reveal .panel-backdrop {
7832 -webkit-transform: translate3d(260px, 0, 0);
7833 transform: translate3d(260px, 0, 0);
7834 }
7835 html.with-panel-right-reveal .views,
7836 html.with-panel-right-reveal .framework7-root > .view,
7837 html.with-panel-right-reveal .panel-backdrop {
7838 -webkit-transform: translate3d(-260px, 0, 0);
7839 transform: translate3d(-260px, 0, 0);
7840 }
7841 html.with-panel-left-cover .panel-left {
7842 -webkit-transform: translate3d(0px, 0, 0);
7843 transform: translate3d(0px, 0, 0);
7844 }
7845 html.with-panel-right-cover .panel-right {
7846 -webkit-transform: translate3d(0px, 0, 0);
7847 transform: translate3d(0px, 0, 0);
7848 }
7849 html.with-statusbar.device-ios .panel,
7850 html.with-statusbar.ios:not(.device-ios):not(.device-android) .panel {
7851 top: 20px;
7852 height: calc(100% - 20px);
7853 }
7854 html.with-statusbar.device-android .panel,
7855 html.with-statusbar.md:not(.device-ios):not(.device-android) .panel {
7856 top: 24px;
7857 height: calc(100% - 24px);
7858 }
7859 html.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 }
7997 html.device-pixel-ratio-2 .card-header:after {
7998 -webkit-transform: scaleY(0.5);
7999 transform: scaleY(0.5);
8000 }
8001 html.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 }
8026 html.device-pixel-ratio-2 .card-footer:before {
8027 -webkit-transform: scaleY(0.5);
8028 transform: scaleY(0.5);
8029 }
8030 html.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 === */
8321 input[type="text"],
8322 input[type="password"],
8323 input[type="search"],
8324 input[type="email"],
8325 input[type="tel"],
8326 input[type="url"],
8327 input[type="date"],
8328 input[type="datetime-local"],
8329 input[type="time"],
8330 input[type="number"],
8331 select,
8332 textarea {
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 }
8654 label.item-checkbox,
8655 .checkbox {
8656 cursor: pointer;
8657 }
8658 label.item-checkbox input[type="checkbox"],
8659 .checkbox input[type="checkbox"],
8660 label.item-checkbox input[type="radio"],
8661 .checkbox input[type="radio"] {
8662 display: none;
8663 }
8664 label.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 }
8671 label.item-checkbox .icon-checkbox:after,
8672 .checkbox .icon-checkbox:after {
8673 content: '';
8674 position: absolute;
8675 }
8676 label.item-checkbox {
8677 -webkit-transition-duration: 300ms;
8678 transition-duration: 300ms;
8679 }
8680 label.item-checkbox.active-state:after {
8681 background-color: transparent;
8682 }
8683 label.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 }
8818 label.item-radio,
8819 .radio {
8820 cursor: pointer;
8821 }
8822 label.item-radio input[type="checkbox"],
8823 .radio input[type="checkbox"],
8824 label.item-radio input[type="radio"],
8825 .radio input[type="radio"] {
8826 display: none;
8827 }
8828 label.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 }
8835 label.item-radio .icon-radio:after,
8836 .radio .icon-radio:after {
8837 content: '';
8838 position: absolute;
8839 }
8840 label.item-radio {
8841 -webkit-transition-duration: 300ms;
8842 transition-duration: 300ms;
8843 }
8844 label.item-radio.active-state:after {
8845 background-color: transparent;
8846 }
8847 label.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 }
12965 html.device-desktop .data-table .sortable-cell:not(.sortable-cell-active):hover:after,
12966 html.device-desktop .data-table .sortable-cell:not(.sortable-cell-active) .table-head-label:hover:after,
12967 html.device-desktop .data-table .sortable-cell:not(.sortable-cell-active):hover:before,
12968 html.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 }
15535 button.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 }
16274 html.with-statusbar.device-ios .notification,
16275 html.with-statusbar.ios:not(.device-ios):not(.device-android) .notification {
16276 margin-top: 20px;
16277 }
16278 html.with-statusbar.device-android .notification,
16279 html.with-statusbar.md:not(.device-ios):not(.device-android) .notification {
16280 margin-top: 24px;
16281 }
16282 html.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 }
16560 iframe#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 }