upgrade and bump version to 4.4.7
[framework7.git] / framework7 / css / framework7.bundle.css
1 /**
2  * Framework7 4.4.7
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: July 19, 2019
11  */
12
13 /*====================
14   Core
15   ==================== */
16 :root {
17   --f7-theme-color: #007aff;
18   --f7-theme-color-rgb: 0, 122, 255;
19   --f7-theme-color-shade: #0066d6;
20   --f7-theme-color-tint: #298fff;
21   --f7-safe-area-left: 0px;
22   --f7-safe-area-right: 0px;
23   --f7-safe-area-top: 0px;
24   --f7-safe-area-bottom: 0px;
25   --f7-safe-area-outer-left: 0px;
26   --f7-safe-area-outer-right: 0px;
27   --f7-device-pixel-ratio: 1;
28 }
29 @supports (left: env(safe-area-inset-left)) {
30   :root {
31     --f7-safe-area-top: env(safe-area-inset-top);
32     --f7-safe-area-bottom: env(safe-area-inset-bottom);
33   }
34   :root .ios-left-edge,
35   :root .ios-edges,
36   :root .safe-area-left,
37   :root .safe-areas,
38   :root .popup,
39   :root .sheet-modal,
40   :root .panel-left {
41     --f7-safe-area-left: env(safe-area-inset-left);
42     --f7-safe-area-outer-left: env(safe-area-inset-left);
43   }
44   :root .ios-right-edge,
45   :root .ios-edges,
46   :root .safe-area-right,
47   :root .safe-areas,
48   :root .popup,
49   :root .sheet-modal,
50   :root .panel-right {
51     --f7-safe-area-right: env(safe-area-inset-right);
52     --f7-safe-area-outer-right: env(safe-area-inset-right);
53   }
54   :root .no-safe-areas,
55   :root .no-safe-area-left,
56   :root .no-ios-edges,
57   :root .no-ios-left-edge {
58     --f7-safe-area-left: 0px;
59     --f7-safe-area-outer-left: 0px;
60   }
61   :root .no-safe-areas,
62   :root .no-safe-area-right,
63   :root .no-ios-edges,
64   :root .no-ios-right-edge {
65     --f7-safe-area-right: 0px;
66     --f7-safe-area-outer-right: 0px;
67   }
68 }
69 @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 2dppx) {
70   :root {
71     --f7-device-pixel-ratio: 2;
72   }
73 }
74 @media (-webkit-min-device-pixel-ratio: 3), (min-resolution: 3dppx) {
75   :root {
76     --f7-device-pixel-ratio: 3;
77   }
78 }
79 /*====================
80   Fonts
81   ==================== */
82 :root {
83   --f7-font-size: 14px;
84 }
85 .ios {
86   --f7-font-family: -apple-system, SF Pro Text, SF UI Text, system-ui, Helvetica Neue, Helvetica, Arial, sans-serif;
87   --f7-text-color: #000;
88   --f7-line-height: 1.4;
89 }
90 .ios .theme-dark,
91 .ios.theme-dark {
92   --f7-text-color: #fff;
93 }
94 .md {
95   --f7-font-family: Roboto, system-ui, Noto, Helvetica, Arial, sans-serif;
96   --f7-text-color: #212121;
97   --f7-line-height: 1.5;
98 }
99 .md .theme-dark,
100 .md.theme-dark {
101   --f7-text-color: rgba(255, 255, 255, 0.87);
102 }
103 .aurora {
104   --f7-font-family: -apple-system, system-ui, Helvetica, Arial, sans-serif;
105   --f7-text-color: #000;
106   --f7-line-height: 1.5;
107 }
108 .aurora .theme-dark,
109 .aurora.theme-dark {
110   --f7-text-color: #fff;
111 }
112 /*====================
113   Bars
114   ==================== */
115 :root {
116   /*
117   --f7-bars-link-color: var(--f7-theme-color);
118   */
119   --f7-bars-bg-image: none;
120   --f7-bars-bg-color: #f7f7f8;
121   --f7-bars-bg-color-rgb: 247, 247, 248;
122   --f7-bars-text-color: #000;
123   --f7-bars-shadow-bottom-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.25) 0%, rgba(0, 0, 0, 0.08) 40%, rgba(0, 0, 0, 0.04) 50%, rgba(0, 0, 0, 0) 90%, rgba(0, 0, 0, 0) 100%);
124   --f7-bars-shadow-top-image: linear-gradient(to top, rgba(0, 0, 0, 0.25) 0%, rgba(0, 0, 0, 0.08) 40%, rgba(0, 0, 0, 0.04) 50%, rgba(0, 0, 0, 0) 90%, rgba(0, 0, 0, 0) 100%);
125 }
126 .theme-dark {
127   --f7-bars-bg-color: #1b1b1b;
128   --f7-bars-text-color: #fff;
129 }
130 .ios {
131   --f7-bars-border-color: #c4c4c4;
132 }
133 .ios .theme-dark,
134 .ios.theme-dark {
135   --f7-bars-border-color: #282829;
136 }
137 .md {
138   --f7-bars-border-color: transparent;
139 }
140 .aurora {
141   --f7-bars-border-color: rgba(0, 0, 0, 0.2);
142 }
143 .aurora .theme-dark,
144 .aurora.theme-dark {
145   --f7-bars-border-color: #282829;
146 }
147 /*====================
148   Color Themes
149   ==================== */
150 .text-color-primary {
151   --f7-theme-color-text-color: var(--f7-theme-color);
152 }
153 .bg-color-primary {
154   --f7-theme-color-bg-color: var(--f7-theme-color);
155 }
156 .border-color-primary {
157   --f7-theme-color-border-color: var(--f7-theme-color);
158 }
159 .ripple-color-primary {
160   --f7-theme-color-ripple-color: rgba(var(--f7-theme-color-rgb), 0.3);
161 }
162 :root {
163   --f7-color-red: #ff3b30;
164   --f7-color-red-rgb: 255, 59, 48;
165   --f7-color-red-shade: #ff1407;
166   --f7-color-red-tint: #ff6259;
167   --f7-color-green: #4cd964;
168   --f7-color-green-rgb: 76, 217, 100;
169   --f7-color-green-shade: #2cd048;
170   --f7-color-green-tint: #6ee081;
171   --f7-color-blue: #2196f3;
172   --f7-color-blue-rgb: 33, 150, 243;
173   --f7-color-blue-shade: #0c82df;
174   --f7-color-blue-tint: #48a8f5;
175   --f7-color-pink: #ff2d55;
176   --f7-color-pink-rgb: 255, 45, 85;
177   --f7-color-pink-shade: #ff0434;
178   --f7-color-pink-tint: #ff5676;
179   --f7-color-yellow: #ffcc00;
180   --f7-color-yellow-rgb: 255, 204, 0;
181   --f7-color-yellow-shade: #d6ab00;
182   --f7-color-yellow-tint: #ffd429;
183   --f7-color-orange: #ff9500;
184   --f7-color-orange-rgb: 255, 149, 0;
185   --f7-color-orange-shade: #d67d00;
186   --f7-color-orange-tint: #ffa629;
187   --f7-color-purple: #9c27b0;
188   --f7-color-purple-rgb: 156, 39, 176;
189   --f7-color-purple-shade: #7e208f;
190   --f7-color-purple-tint: #b92fd1;
191   --f7-color-deeppurple: #673ab7;
192   --f7-color-deeppurple-rgb: 103, 58, 183;
193   --f7-color-deeppurple-shade: #563098;
194   --f7-color-deeppurple-tint: #7c52c8;
195   --f7-color-lightblue: #5ac8fa;
196   --f7-color-lightblue-rgb: 90, 200, 250;
197   --f7-color-lightblue-shade: #32bbf9;
198   --f7-color-lightblue-tint: #82d5fb;
199   --f7-color-teal: #009688;
200   --f7-color-teal-rgb: 0, 150, 136;
201   --f7-color-teal-shade: #006d63;
202   --f7-color-teal-tint: #00bfad;
203   --f7-color-lime: #cddc39;
204   --f7-color-lime-rgb: 205, 220, 57;
205   --f7-color-lime-shade: #bac923;
206   --f7-color-lime-tint: #d6e25c;
207   --f7-color-deeporange: #ff6b22;
208   --f7-color-deeporange-rgb: 255, 107, 34;
209   --f7-color-deeporange-shade: #f85200;
210   --f7-color-deeporange-tint: #ff864b;
211   --f7-color-gray: #8e8e93;
212   --f7-color-gray-rgb: 142, 142, 147;
213   --f7-color-gray-shade: #79797f;
214   --f7-color-gray-tint: #a3a3a7;
215   --f7-color-white: #ffffff;
216   --f7-color-white-rgb: 255, 255, 255;
217   --f7-color-white-shade: #ebebeb;
218   --f7-color-white-tint: #ffffff;
219   --f7-color-black: #000000;
220   --f7-color-black-rgb: 0, 0, 0;
221   --f7-color-black-shade: #000000;
222   --f7-color-black-tint: #141414;
223 }
224 .color-theme-red {
225   --f7-theme-color: #ff3b30;
226   --f7-theme-color-rgb: 255, 59, 48;
227   --f7-theme-color-shade: #ff1407;
228   --f7-theme-color-tint: #ff6259;
229 }
230 .color-theme-green {
231   --f7-theme-color: #4cd964;
232   --f7-theme-color-rgb: 76, 217, 100;
233   --f7-theme-color-shade: #2cd048;
234   --f7-theme-color-tint: #6ee081;
235 }
236 .color-theme-blue {
237   --f7-theme-color: #2196f3;
238   --f7-theme-color-rgb: 33, 150, 243;
239   --f7-theme-color-shade: #0c82df;
240   --f7-theme-color-tint: #48a8f5;
241 }
242 .color-theme-pink {
243   --f7-theme-color: #ff2d55;
244   --f7-theme-color-rgb: 255, 45, 85;
245   --f7-theme-color-shade: #ff0434;
246   --f7-theme-color-tint: #ff5676;
247 }
248 .color-theme-yellow {
249   --f7-theme-color: #ffcc00;
250   --f7-theme-color-rgb: 255, 204, 0;
251   --f7-theme-color-shade: #d6ab00;
252   --f7-theme-color-tint: #ffd429;
253 }
254 .color-theme-orange {
255   --f7-theme-color: #ff9500;
256   --f7-theme-color-rgb: 255, 149, 0;
257   --f7-theme-color-shade: #d67d00;
258   --f7-theme-color-tint: #ffa629;
259 }
260 .color-theme-purple {
261   --f7-theme-color: #9c27b0;
262   --f7-theme-color-rgb: 156, 39, 176;
263   --f7-theme-color-shade: #7e208f;
264   --f7-theme-color-tint: #b92fd1;
265 }
266 .color-theme-deeppurple {
267   --f7-theme-color: #673ab7;
268   --f7-theme-color-rgb: 103, 58, 183;
269   --f7-theme-color-shade: #563098;
270   --f7-theme-color-tint: #7c52c8;
271 }
272 .color-theme-lightblue {
273   --f7-theme-color: #5ac8fa;
274   --f7-theme-color-rgb: 90, 200, 250;
275   --f7-theme-color-shade: #32bbf9;
276   --f7-theme-color-tint: #82d5fb;
277 }
278 .color-theme-teal {
279   --f7-theme-color: #009688;
280   --f7-theme-color-rgb: 0, 150, 136;
281   --f7-theme-color-shade: #006d63;
282   --f7-theme-color-tint: #00bfad;
283 }
284 .color-theme-lime {
285   --f7-theme-color: #cddc39;
286   --f7-theme-color-rgb: 205, 220, 57;
287   --f7-theme-color-shade: #bac923;
288   --f7-theme-color-tint: #d6e25c;
289 }
290 .color-theme-deeporange {
291   --f7-theme-color: #ff6b22;
292   --f7-theme-color-rgb: 255, 107, 34;
293   --f7-theme-color-shade: #f85200;
294   --f7-theme-color-tint: #ff864b;
295 }
296 .color-theme-gray {
297   --f7-theme-color: #8e8e93;
298   --f7-theme-color-rgb: 142, 142, 147;
299   --f7-theme-color-shade: #79797f;
300   --f7-theme-color-tint: #a3a3a7;
301 }
302 .color-theme-white {
303   --f7-theme-color: #ffffff;
304   --f7-theme-color-rgb: 255, 255, 255;
305   --f7-theme-color-shade: #ebebeb;
306   --f7-theme-color-tint: #ffffff;
307 }
308 .color-theme-black {
309   --f7-theme-color: #000000;
310   --f7-theme-color-rgb: 0, 0, 0;
311   --f7-theme-color-shade: #000000;
312   --f7-theme-color-tint: #141414;
313 }
314 .color-red {
315   --f7-theme-color: #ff3b30;
316   --f7-theme-color-rgb: 255, 59, 48;
317   --f7-theme-color-shade: #ff1407;
318   --f7-theme-color-tint: #ff6259;
319 }
320 .text-color-red {
321   --f7-theme-color-text-color: #ff3b30;
322 }
323 .bg-color-red {
324   --f7-theme-color-bg-color: #ff3b30;
325 }
326 .border-color-red {
327   --f7-theme-color-border-color: #ff3b30;
328 }
329 .ripple-color-red,
330 .ripple-red {
331   --f7-theme-color-ripple-color: rgba(255, 59, 48, 0.3);
332 }
333 .color-green {
334   --f7-theme-color: #4cd964;
335   --f7-theme-color-rgb: 76, 217, 100;
336   --f7-theme-color-shade: #2cd048;
337   --f7-theme-color-tint: #6ee081;
338 }
339 .text-color-green {
340   --f7-theme-color-text-color: #4cd964;
341 }
342 .bg-color-green {
343   --f7-theme-color-bg-color: #4cd964;
344 }
345 .border-color-green {
346   --f7-theme-color-border-color: #4cd964;
347 }
348 .ripple-color-green,
349 .ripple-green {
350   --f7-theme-color-ripple-color: rgba(76, 217, 100, 0.3);
351 }
352 .color-blue {
353   --f7-theme-color: #2196f3;
354   --f7-theme-color-rgb: 33, 150, 243;
355   --f7-theme-color-shade: #0c82df;
356   --f7-theme-color-tint: #48a8f5;
357 }
358 .text-color-blue {
359   --f7-theme-color-text-color: #2196f3;
360 }
361 .bg-color-blue {
362   --f7-theme-color-bg-color: #2196f3;
363 }
364 .border-color-blue {
365   --f7-theme-color-border-color: #2196f3;
366 }
367 .ripple-color-blue,
368 .ripple-blue {
369   --f7-theme-color-ripple-color: rgba(33, 150, 243, 0.3);
370 }
371 .color-pink {
372   --f7-theme-color: #ff2d55;
373   --f7-theme-color-rgb: 255, 45, 85;
374   --f7-theme-color-shade: #ff0434;
375   --f7-theme-color-tint: #ff5676;
376 }
377 .text-color-pink {
378   --f7-theme-color-text-color: #ff2d55;
379 }
380 .bg-color-pink {
381   --f7-theme-color-bg-color: #ff2d55;
382 }
383 .border-color-pink {
384   --f7-theme-color-border-color: #ff2d55;
385 }
386 .ripple-color-pink,
387 .ripple-pink {
388   --f7-theme-color-ripple-color: rgba(255, 45, 85, 0.3);
389 }
390 .color-yellow {
391   --f7-theme-color: #ffcc00;
392   --f7-theme-color-rgb: 255, 204, 0;
393   --f7-theme-color-shade: #d6ab00;
394   --f7-theme-color-tint: #ffd429;
395 }
396 .text-color-yellow {
397   --f7-theme-color-text-color: #ffcc00;
398 }
399 .bg-color-yellow {
400   --f7-theme-color-bg-color: #ffcc00;
401 }
402 .border-color-yellow {
403   --f7-theme-color-border-color: #ffcc00;
404 }
405 .ripple-color-yellow,
406 .ripple-yellow {
407   --f7-theme-color-ripple-color: rgba(255, 204, 0, 0.3);
408 }
409 .color-orange {
410   --f7-theme-color: #ff9500;
411   --f7-theme-color-rgb: 255, 149, 0;
412   --f7-theme-color-shade: #d67d00;
413   --f7-theme-color-tint: #ffa629;
414 }
415 .text-color-orange {
416   --f7-theme-color-text-color: #ff9500;
417 }
418 .bg-color-orange {
419   --f7-theme-color-bg-color: #ff9500;
420 }
421 .border-color-orange {
422   --f7-theme-color-border-color: #ff9500;
423 }
424 .ripple-color-orange,
425 .ripple-orange {
426   --f7-theme-color-ripple-color: rgba(255, 149, 0, 0.3);
427 }
428 .color-purple {
429   --f7-theme-color: #9c27b0;
430   --f7-theme-color-rgb: 156, 39, 176;
431   --f7-theme-color-shade: #7e208f;
432   --f7-theme-color-tint: #b92fd1;
433 }
434 .text-color-purple {
435   --f7-theme-color-text-color: #9c27b0;
436 }
437 .bg-color-purple {
438   --f7-theme-color-bg-color: #9c27b0;
439 }
440 .border-color-purple {
441   --f7-theme-color-border-color: #9c27b0;
442 }
443 .ripple-color-purple,
444 .ripple-purple {
445   --f7-theme-color-ripple-color: rgba(156, 39, 176, 0.3);
446 }
447 .color-deeppurple {
448   --f7-theme-color: #673ab7;
449   --f7-theme-color-rgb: 103, 58, 183;
450   --f7-theme-color-shade: #563098;
451   --f7-theme-color-tint: #7c52c8;
452 }
453 .text-color-deeppurple {
454   --f7-theme-color-text-color: #673ab7;
455 }
456 .bg-color-deeppurple {
457   --f7-theme-color-bg-color: #673ab7;
458 }
459 .border-color-deeppurple {
460   --f7-theme-color-border-color: #673ab7;
461 }
462 .ripple-color-deeppurple,
463 .ripple-deeppurple {
464   --f7-theme-color-ripple-color: rgba(103, 58, 183, 0.3);
465 }
466 .color-lightblue {
467   --f7-theme-color: #5ac8fa;
468   --f7-theme-color-rgb: 90, 200, 250;
469   --f7-theme-color-shade: #32bbf9;
470   --f7-theme-color-tint: #82d5fb;
471 }
472 .text-color-lightblue {
473   --f7-theme-color-text-color: #5ac8fa;
474 }
475 .bg-color-lightblue {
476   --f7-theme-color-bg-color: #5ac8fa;
477 }
478 .border-color-lightblue {
479   --f7-theme-color-border-color: #5ac8fa;
480 }
481 .ripple-color-lightblue,
482 .ripple-lightblue {
483   --f7-theme-color-ripple-color: rgba(90, 200, 250, 0.3);
484 }
485 .color-teal {
486   --f7-theme-color: #009688;
487   --f7-theme-color-rgb: 0, 150, 136;
488   --f7-theme-color-shade: #006d63;
489   --f7-theme-color-tint: #00bfad;
490 }
491 .text-color-teal {
492   --f7-theme-color-text-color: #009688;
493 }
494 .bg-color-teal {
495   --f7-theme-color-bg-color: #009688;
496 }
497 .border-color-teal {
498   --f7-theme-color-border-color: #009688;
499 }
500 .ripple-color-teal,
501 .ripple-teal {
502   --f7-theme-color-ripple-color: rgba(0, 150, 136, 0.3);
503 }
504 .color-lime {
505   --f7-theme-color: #cddc39;
506   --f7-theme-color-rgb: 205, 220, 57;
507   --f7-theme-color-shade: #bac923;
508   --f7-theme-color-tint: #d6e25c;
509 }
510 .text-color-lime {
511   --f7-theme-color-text-color: #cddc39;
512 }
513 .bg-color-lime {
514   --f7-theme-color-bg-color: #cddc39;
515 }
516 .border-color-lime {
517   --f7-theme-color-border-color: #cddc39;
518 }
519 .ripple-color-lime,
520 .ripple-lime {
521   --f7-theme-color-ripple-color: rgba(205, 220, 57, 0.3);
522 }
523 .color-deeporange {
524   --f7-theme-color: #ff6b22;
525   --f7-theme-color-rgb: 255, 107, 34;
526   --f7-theme-color-shade: #f85200;
527   --f7-theme-color-tint: #ff864b;
528 }
529 .text-color-deeporange {
530   --f7-theme-color-text-color: #ff6b22;
531 }
532 .bg-color-deeporange {
533   --f7-theme-color-bg-color: #ff6b22;
534 }
535 .border-color-deeporange {
536   --f7-theme-color-border-color: #ff6b22;
537 }
538 .ripple-color-deeporange,
539 .ripple-deeporange {
540   --f7-theme-color-ripple-color: rgba(255, 107, 34, 0.3);
541 }
542 .color-gray {
543   --f7-theme-color: #8e8e93;
544   --f7-theme-color-rgb: 142, 142, 147;
545   --f7-theme-color-shade: #79797f;
546   --f7-theme-color-tint: #a3a3a7;
547 }
548 .text-color-gray {
549   --f7-theme-color-text-color: #8e8e93;
550 }
551 .bg-color-gray {
552   --f7-theme-color-bg-color: #8e8e93;
553 }
554 .border-color-gray {
555   --f7-theme-color-border-color: #8e8e93;
556 }
557 .ripple-color-gray,
558 .ripple-gray {
559   --f7-theme-color-ripple-color: rgba(142, 142, 147, 0.3);
560 }
561 .color-white {
562   --f7-theme-color: #ffffff;
563   --f7-theme-color-rgb: 255, 255, 255;
564   --f7-theme-color-shade: #ebebeb;
565   --f7-theme-color-tint: #ffffff;
566 }
567 .text-color-white {
568   --f7-theme-color-text-color: #ffffff;
569 }
570 .bg-color-white {
571   --f7-theme-color-bg-color: #ffffff;
572 }
573 .border-color-white {
574   --f7-theme-color-border-color: #ffffff;
575 }
576 .ripple-color-white,
577 .ripple-white {
578   --f7-theme-color-ripple-color: rgba(255, 255, 255, 0.3);
579 }
580 .color-black {
581   --f7-theme-color: #000000;
582   --f7-theme-color-rgb: 0, 0, 0;
583   --f7-theme-color-shade: #000000;
584   --f7-theme-color-tint: #141414;
585 }
586 .text-color-black {
587   --f7-theme-color-text-color: #000000;
588 }
589 .bg-color-black {
590   --f7-theme-color-bg-color: #000000;
591 }
592 .border-color-black {
593   --f7-theme-color-border-color: #000000;
594 }
595 .ripple-color-black,
596 .ripple-black {
597   --f7-theme-color-ripple-color: rgba(0, 0, 0, 0.3);
598 }
599 @font-face {
600   font-family: 'framework7-core-icons';
601   src: url("data:application/font-woff;charset=utf-8;base64, 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") format("woff");
602   font-weight: 400;
603   font-style: normal;
604 }
605 @font-face {
606   font-family: 'framework7-skeleton';
607   src: url("data:application/font-woff;charset=utf-8;base64, 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") format("woff");
608   font-weight: 300, 400, 500, 600, 700;
609   font-style: normal, italic;
610 }
611 html,
612 body,
613 .framework7-root {
614   position: relative;
615   height: 100%;
616   width: 100%;
617   overflow-x: hidden;
618 }
619 body {
620   margin: 0;
621   padding: 0;
622   width: 100%;
623   background: #fff;
624   overflow: hidden;
625   -webkit-text-size-adjust: 100%;
626   -webkit-font-smoothing: antialiased;
627   font-family: var(--f7-font-family);
628   font-size: var(--f7-font-size);
629   line-height: var(--f7-line-height);
630   color: var(--f7-text-color);
631 }
632 .theme-dark {
633   color: var(--f7-text-color);
634 }
635 .framework7-root {
636   overflow: hidden;
637   box-sizing: border-box;
638 }
639 .framework7-initializing *,
640 .framework7-initializing *:before,
641 .framework7-initializing *:after {
642   transition-duration: 0ms !important;
643 }
644 .device-ios,
645 .device-android {
646   cursor: pointer;
647 }
648 .device-ios {
649   touch-action: manipulation;
650 }
651 @media (width: 1024px) and (height: 691px) and (orientation: landscape) {
652   html,
653   body,
654   .framework7-root {
655     height: 671px;
656   }
657 }
658 @media (width: 1024px) and (height: 692px) and (orientation: landscape) {
659   html,
660   body,
661   .framework7-root {
662     height: 672px;
663   }
664 }
665 * {
666   -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
667   -webkit-touch-callout: none;
668 }
669 a,
670 input,
671 textarea,
672 select {
673   outline: 0;
674 }
675 a {
676   cursor: pointer;
677   text-decoration: none;
678   color: var(--f7-theme-color);
679 }
680 .link,
681 .item-link {
682   cursor: pointer;
683 }
684 p {
685   margin: 1em 0;
686 }
687 .disabled {
688   opacity: 0.55 !important;
689   pointer-events: none !important;
690 }
691 html.device-full-viewport,
692 html.device-full-viewport body {
693   height: 100vh;
694 }
695 .ios .md-only,
696 .ios .if-md,
697 .ios .aurora-only,
698 .ios .if-aurora,
699 .ios .if-not-ios,
700 .ios .not-ios {
701   display: none !important;
702 }
703 @media (width: 1024px) and (height: 691px) and (orientation: landscape) {
704   .ios,
705   .ios body,
706   .ios .framework7-root {
707     height: 671px;
708   }
709 }
710 @media (width: 1024px) and (height: 692px) and (orientation: landscape) {
711   .ios,
712   .ios body,
713   .ios .framework7-root {
714     height: 672px;
715   }
716 }
717 .md .ios-only,
718 .md .if-ios,
719 .md .aurora-only,
720 .md .if-aurora,
721 .md .if-not-md,
722 .md .not-md {
723   display: none !important;
724 }
725 .aurora .ios-only,
726 .aurora .if-ios,
727 .aurora .md-only,
728 .aurora .if-md,
729 .aurora .if-not-aurora,
730 .aurora .not-aurora {
731   display: none !important;
732 }
733 /* === Statusbar === */
734 :root {
735   --f7-statusbar-height: 0px;
736   --f7-statusbar-bg-color: var(--f7-bars-bg-color);
737 }
738 .device-ios {
739   --f7-statusbar-height: var(--f7-safe-area-top, 20px);
740 }
741 .device-android {
742   --f7-statusbar-height: var(--f7-safe-area-top, 24px);
743 }
744 .with-statusbar.ios:not(.device-ios):not(.device-android) {
745   --f7-statusbar-height: 20px;
746 }
747 .with-statusbar.md:not(.device-ios):not(.device-android) {
748   --f7-statusbar-height: 24px;
749 }
750 @supports not (top: env(safe-area-inset-top)) {
751   .with-statusbar.device-ios {
752     --f7-statusbar-height: 20px;
753   }
754 }
755 @supports not (top: env(safe-area-inset-top)) {
756   .with-statusbar.device-android {
757     --f7-statusbar-height: 24px;
758   }
759 }
760 .statusbar {
761   position: absolute;
762   left: 0;
763   top: 0;
764   width: 100%;
765   z-index: 10000;
766   box-sizing: border-box;
767   display: block;
768   height: var(--f7-statusbar-height);
769   background: var(--f7-statusbar-bg-color, var(--f7-bars-bg-color));
770 }
771 .framework7-root {
772   padding-top: var(--f7-statusbar-height);
773 }
774 /* === Views === */
775 .views,
776 .view {
777   position: relative;
778   height: 100%;
779   z-index: 5000;
780   overflow: hidden;
781   box-sizing: border-box;
782 }
783 .framework7-root > .view,
784 .framework7-root > .views {
785   height: calc(100% - var(--f7-appbar-app-offset, 0px));
786 }
787 /* === Pages === */
788 :root {
789   --f7-page-master-width: 320px;
790   --f7-page-master-border-color: rgba(0, 0, 0, 0.1);
791   --f7-page-master-border-width: 1px;
792   --f7-page-swipeback-transition-duration: 400ms;
793   /*
794   --f7-page-content-extra-padding-top: 0px;
795   --f7-page-content-extra-padding-bottom: 0px;
796   */
797 }
798 .ios {
799   --f7-page-bg-color: #efeff4;
800   --f7-page-transition-duration: 400ms;
801 }
802 .md {
803   --f7-page-bg-color: #fff;
804   --f7-page-transition-duration: 250ms;
805 }
806 .aurora {
807   --f7-page-bg-color: #f3f3f3;
808   --f7-page-transition-duration: 400ms;
809 }
810 .theme-dark {
811   --f7-page-bg-color: #171717;
812   --f7-page-master-border-color: rgba(255, 255, 255, 0.1);
813 }
814 .pages {
815   position: relative;
816   width: 100%;
817   height: 100%;
818   overflow: hidden;
819 }
820 .page {
821   box-sizing: border-box;
822   position: absolute;
823   left: 0;
824   top: 0;
825   width: 100%;
826   height: 100%;
827   transform: none;
828   background-color: var(--f7-page-bg-color);
829   z-index: 1;
830 }
831 .page.stacked {
832   display: none;
833 }
834 .page-with-navbar-large-collapsed {
835   --f7-navbar-large-collapse-progress: 1;
836 }
837 .page-previous {
838   pointer-events: none;
839 }
840 .page-content {
841   will-change: scroll-position;
842   overflow: auto;
843   -webkit-overflow-scrolling: touch;
844   box-sizing: border-box;
845   height: 100%;
846   position: relative;
847   z-index: 1;
848   padding-top: calc(var(--f7-page-navbar-offset, 0px) + var(--f7-page-toolbar-top-offset, 0px) + var(--f7-page-subnavbar-offset, 0px) + var(--f7-page-searchbar-offset, 0px) + var(--f7-page-content-extra-padding-top, 0px));
849   padding-bottom: calc(var(--f7-page-toolbar-bottom-offset, 0px) + var(--f7-safe-area-bottom) + var(--f7-page-content-extra-padding-bottom, 0px));
850 }
851 .page-transitioning,
852 .page-transitioning .page-shadow-effect,
853 .page-transitioning .page-opacity-effect {
854   transition-duration: var(--f7-page-transition-duration);
855 }
856 .page-transitioning-swipeback,
857 .page-transitioning-swipeback .page-shadow-effect,
858 .page-transitioning-swipeback .page-opacity-effect {
859   transition-duration: var(--f7-page-swipeback-transition-duration);
860 }
861 .router-transition-forward .page-next,
862 .router-transition-backward .page-next,
863 .router-transition-forward .page-current,
864 .router-transition-backward .page-current,
865 .router-transition-forward .page-previous:not(.stacked),
866 .router-transition-backward .page-previous:not(.stacked) {
867   pointer-events: none;
868 }
869 .page-shadow-effect {
870   position: absolute;
871   top: 0;
872   width: 16px;
873   bottom: 0;
874   z-index: -1;
875   content: '';
876   opacity: 0;
877   right: 100%;
878   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%);
879 }
880 .page-opacity-effect {
881   position: absolute;
882   left: 0;
883   top: 0;
884   background: rgba(0, 0, 0, 0.1);
885   width: 100%;
886   bottom: 0;
887   content: '';
888   opacity: 0;
889   z-index: 10000;
890 }
891 .ios .page-previous {
892   transform: translate3d(-20%, 0, 0);
893 }
894 .ios .page-next {
895   transform: translate3d(100%, 0, 0);
896 }
897 .ios .page-previous .page-opacity-effect {
898   opacity: 1;
899 }
900 .ios .page-previous:after {
901   opacity: 1;
902 }
903 .ios .page-current .page-shadow-effect {
904   opacity: 1;
905 }
906 .ios .router-transition-forward .page-next,
907 .ios .router-transition-forward .page-current {
908   will-change: transform;
909 }
910 .ios .router-transition-forward .page-next {
911   animation: ios-page-next-to-current var(--f7-page-transition-duration) forwards;
912 }
913 .ios .router-transition-forward .page-next:before {
914   position: absolute;
915   top: 0;
916   width: 16px;
917   bottom: 0;
918   z-index: -1;
919   content: '';
920   opacity: 0;
921   right: 100%;
922   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%);
923   animation: ios-page-element-fade-in var(--f7-page-transition-duration) forwards;
924 }
925 .ios .router-transition-forward .page-current {
926   animation: ios-page-current-to-previous var(--f7-page-transition-duration) forwards;
927 }
928 .ios .router-transition-forward .page-current:after {
929   position: absolute;
930   left: 0;
931   top: 0;
932   background: rgba(0, 0, 0, 0.1);
933   width: 100%;
934   bottom: 0;
935   content: '';
936   opacity: 0;
937   z-index: 10000;
938   animation: ios-page-element-fade-in var(--f7-page-transition-duration) forwards;
939 }
940 .ios .router-transition-backward .page-previous,
941 .ios .router-transition-backward .page-current {
942   will-change: transform;
943 }
944 .ios .router-transition-backward .page-previous {
945   animation: ios-page-previous-to-current var(--f7-page-transition-duration) forwards;
946 }
947 .ios .router-transition-backward .page-previous:after {
948   position: absolute;
949   left: 0;
950   top: 0;
951   background: rgba(0, 0, 0, 0.1);
952   width: 100%;
953   bottom: 0;
954   content: '';
955   opacity: 0;
956   z-index: 10000;
957   animation: ios-page-element-fade-out var(--f7-page-transition-duration) forwards;
958 }
959 .ios .router-transition-backward .page-current {
960   animation: ios-page-current-to-next var(--f7-page-transition-duration) forwards;
961 }
962 .ios .router-transition-backward .page-current:before {
963   position: absolute;
964   top: 0;
965   width: 16px;
966   bottom: 0;
967   z-index: -1;
968   content: '';
969   opacity: 0;
970   right: 100%;
971   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%);
972   animation: ios-page-element-fade-out var(--f7-page-transition-duration) forwards;
973 }
974 .ios .router-dynamic-navbar-inside .page-shadow-effect,
975 .ios .router-dynamic-navbar-inside .page-opacity-effect {
976   top: var(--f7-navbar-height);
977 }
978 .ios .router-dynamic-navbar-inside .page-next:before,
979 .ios .router-dynamic-navbar-inside .page-current:after,
980 .ios .router-dynamic-navbar-inside .page-current:before,
981 .ios .router-dynamic-navbar-inside .page-previous:after {
982   top: var(--f7-navbar-height);
983 }
984 @keyframes ios-page-next-to-current {
985   from {
986     transform: translate3d(100%, 0, 0);
987   }
988   to {
989     transform: translate3d(0%, 0, 0);
990   }
991 }
992 @keyframes ios-page-previous-to-current {
993   from {
994     transform: translate3d(-20%, 0, 0);
995   }
996   to {
997     transform: translate3d(0%, 0, 0);
998   }
999 }
1000 @keyframes ios-page-current-to-previous {
1001   from {
1002     transform: translate3d(0, 0, 0);
1003   }
1004   to {
1005     transform: translate3d(-20%, 0, 0);
1006   }
1007 }
1008 @keyframes ios-page-current-to-next {
1009   from {
1010     transform: translate3d(0, 0, 0);
1011   }
1012   to {
1013     transform: translate3d(100%, 0, 0);
1014   }
1015 }
1016 @keyframes ios-page-element-fade-in {
1017   from {
1018     opacity: 0;
1019   }
1020   to {
1021     opacity: 1;
1022   }
1023 }
1024 @keyframes ios-page-element-fade-out {
1025   from {
1026     opacity: 1;
1027   }
1028   to {
1029     opacity: 0;
1030   }
1031 }
1032 .md .page-next {
1033   transform: translate3d(0, 56px, 0);
1034   opacity: 0;
1035   pointer-events: none;
1036 }
1037 .md .page-next.page-next-on-right {
1038   transform: translate3d(100%, 0, 0);
1039 }
1040 .md .router-transition-forward .page-next {
1041   will-change: transform, opacity;
1042   animation: md-page-next-to-current var(--f7-page-transition-duration) forwards;
1043 }
1044 .md .router-transition-forward .page-current {
1045   animation: none;
1046 }
1047 .md .router-transition-backward .page-current {
1048   will-change: transform, opacity;
1049   animation: md-page-current-to-next var(--f7-page-transition-duration) forwards;
1050 }
1051 .md .router-transition-backward .page-previous {
1052   animation: none;
1053 }
1054 @keyframes md-page-next-to-current {
1055   from {
1056     transform: translate3d(0, 56px, 0);
1057     opacity: 0;
1058   }
1059   to {
1060     transform: translate3d(0, 0px, 0);
1061     opacity: 1;
1062   }
1063 }
1064 @keyframes md-page-current-to-next {
1065   from {
1066     transform: translate3d(0, 0, 0);
1067     opacity: 1;
1068   }
1069   to {
1070     transform: translate3d(0, 56px, 0);
1071     opacity: 0;
1072   }
1073 }
1074 .aurora .page-next {
1075   pointer-events: none;
1076   transform: translate3d(100%, 0px, 0);
1077 }
1078 .aurora .page-next.page-next-on-right {
1079   transform: translate3d(100%, 0, 0);
1080 }
1081 .aurora .page-previous .page-opacity-effect {
1082   opacity: 1;
1083 }
1084 .aurora .page-previous:after {
1085   opacity: 1;
1086 }
1087 .aurora .router-transition-forward .page-next {
1088   will-change: transform;
1089   animation: aurora-page-next-to-current var(--f7-page-transition-duration) forwards;
1090 }
1091 .aurora .router-transition-forward .page-current {
1092   animation: none;
1093 }
1094 .aurora .router-transition-forward .page-current:after {
1095   position: absolute;
1096   left: 0;
1097   top: 0;
1098   background: rgba(0, 0, 0, 0.1);
1099   width: 100%;
1100   bottom: 0;
1101   content: '';
1102   opacity: 0;
1103   z-index: 10000;
1104   animation: aurora-page-element-fade-in var(--f7-page-transition-duration) forwards;
1105 }
1106 .aurora .router-transition-backward .page-current {
1107   will-change: transform, opacity;
1108   animation: aurora-page-current-to-next var(--f7-page-transition-duration) forwards;
1109 }
1110 .aurora .router-transition-backward .page-previous {
1111   animation: none;
1112 }
1113 .aurora .router-transition-backward .page-previous:after {
1114   position: absolute;
1115   left: 0;
1116   top: 0;
1117   background: rgba(0, 0, 0, 0.1);
1118   width: 100%;
1119   bottom: 0;
1120   content: '';
1121   opacity: 0;
1122   z-index: 10000;
1123   animation: aurora-page-element-fade-out var(--f7-page-transition-duration) forwards;
1124 }
1125 @keyframes aurora-page-next-to-current {
1126   from {
1127     transform: translate3d(100%, 0, 0);
1128   }
1129   to {
1130     transform: translate3d(0, 0px, 0);
1131   }
1132 }
1133 @keyframes aurora-page-current-to-next {
1134   from {
1135     transform: translate3d(0, 0, 0);
1136   }
1137   to {
1138     transform: translate3d(100%, 0, 0);
1139   }
1140 }
1141 @keyframes aurora-page-element-fade-in {
1142   from {
1143     opacity: 0;
1144   }
1145   to {
1146     opacity: 1;
1147   }
1148 }
1149 @keyframes aurora-page-element-fade-out {
1150   from {
1151     opacity: 1;
1152   }
1153   to {
1154     opacity: 0;
1155   }
1156 }
1157 .view:not(.view-master-detail) .page-master-stacked {
1158   display: none;
1159 }
1160 .view:not(.view-master-detail) .navbar-master-stacked {
1161   display: none;
1162 }
1163 .view-master-detail .page-master,
1164 .view-master-detail .navbar-master {
1165   width: var(--f7-page-master-width);
1166   --f7-safe-area-right: 0px;
1167   --f7-safe-area-outer-right: 0px;
1168   border-right: var(--f7-page-master-border-width) solid var(--f7-page-master-border-color);
1169 }
1170 .view-master-detail .page-master-detail,
1171 .view-master-detail .navbar-master-detail {
1172   width: calc(100% - var(--f7-page-master-width));
1173   --f7-safe-area-left: 0px;
1174   --f7-safe-area-outer-left: 0px;
1175   left: var(--f7-page-master-width);
1176 }
1177 .view-master-detail .page-master {
1178   z-index: 2;
1179   transform: none;
1180   pointer-events: auto;
1181 }
1182 .view-master-detail .page-master:before,
1183 .view-master-detail .page-master:after {
1184   display: none;
1185 }
1186 .view-master-detail.router-transition .page-master {
1187   animation: none;
1188 }
1189 /* === Link === */
1190 :root {
1191   --f7-link-highlight-black: rgba(0, 0, 0, 0.1);
1192   --f7-link-highlight-white: rgba(255, 255, 255, 0.15);
1193   --f7-link-highlight-color: var(--f7-link-highlight-black);
1194 }
1195 .theme-dark {
1196   --f7-link-highlight-color: var(--f7-link-highlight-white);
1197 }
1198 .link,
1199 .tab-link {
1200   display: inline-flex;
1201   align-items: center;
1202   align-content: center;
1203   justify-content: center;
1204   position: relative;
1205   box-sizing: border-box;
1206   transform: translate3d(0, 0, 0);
1207   z-index: 1;
1208 }
1209 .link i + span,
1210 .link i + i,
1211 .link span + i,
1212 .link span + span {
1213   margin-left: 4px;
1214 }
1215 .ios .link {
1216   transition: opacity 300ms;
1217 }
1218 .ios .link.active-state {
1219   opacity: 0.3;
1220   transition-duration: 0ms;
1221 }
1222 .aurora .link {
1223   transition: opacity 300ms;
1224 }
1225 .aurora .link.active-state {
1226   opacity: 0.3;
1227   transition-duration: 0ms;
1228 }
1229 /* === Navbar === */
1230 :root {
1231   /*
1232   --f7-navbar-bg-color: var(--f7-bars-bg-color);
1233   --f7-navbar-bg-image: var(--f7-bars-bg-image);
1234   --f7-navbar-border-color: var(--f7-bars-border-color);
1235   --f7-navbar-link-color: var(--f7-bars-link-color);
1236   --f7-navbar-text-color: var(--f7-bars-text-color);
1237   */
1238   --f7-navbar-hide-show-transition-duration: 400ms;
1239   --f7-navbar-title-line-height: 1.2;
1240   --f7-navbar-title-font-size: inherit;
1241   --f7-navbar-subtitle-text-align: inherit;
1242   --f7-navbar-large-title-line-height: 1.2;
1243   --f7-navbar-large-title-text-color: inherit;
1244 }
1245 .ios {
1246   --f7-navbar-height: 44px;
1247   --f7-navbar-tablet-height: 44px;
1248   --f7-navbar-font-size: 17px;
1249   --f7-navbar-inner-padding-left: 8px;
1250   --f7-navbar-inner-padding-right: 8px;
1251   --f7-navbar-title-font-weight: 600;
1252   --f7-navbar-title-margin-left: 0;
1253   --f7-navbar-title-margin-right: 0;
1254   --f7-navbar-title-text-align: center;
1255   --f7-navbar-subtitle-text-color: #6d6d72;
1256   --f7-navbar-subtitle-font-size: 10px;
1257   --f7-navbar-subtitle-line-height: 1;
1258   --f7-navbar-shadow-image: none;
1259   --f7-navbar-large-title-height: 52px;
1260   --f7-navbar-large-title-font-size: 34px;
1261   --f7-navbar-large-title-font-weight: 700;
1262   --f7-navbar-large-title-letter-spacing: -0.03em;
1263   --f7-navbar-large-title-padding-left: 15px;
1264   --f7-navbar-large-title-padding-right: 15px;
1265   /*
1266   --f7-navbar-link-height: var(--f7-navbar-height);
1267   --f7-navbar-link-line-height: var(--f7-navbar-height);
1268   */
1269 }
1270 .ios .theme-dark,
1271 .ios.theme-dark {
1272   --f7-navbar-subtitle-text-color: #8e8e93;
1273 }
1274 .md {
1275   --f7-navbar-height: 56px;
1276   --f7-navbar-tablet-height: 64px;
1277   --f7-navbar-font-size: 20px;
1278   --f7-navbar-inner-padding-left: 0px;
1279   --f7-navbar-inner-padding-right: 0px;
1280   --f7-navbar-title-font-weight: 500;
1281   --f7-navbar-title-margin-left: 16px;
1282   --f7-navbar-title-margin-right: 16px;
1283   --f7-navbar-title-text-align: left;
1284   --f7-navbar-subtitle-text-color: rgba(0, 0, 0, 0.85);
1285   --f7-navbar-subtitle-font-size: 14px;
1286   --f7-navbar-subtitle-line-height: 1.2;
1287   --f7-navbar-shadow-image: var(--f7-bars-shadow-bottom-image);
1288   --f7-navbar-large-title-font-size: 34px;
1289   --f7-navbar-large-title-height: 56px;
1290   --f7-navbar-large-title-font-weight: 500;
1291   --f7-navbar-large-title-letter-spacing: 0;
1292   --f7-navbar-large-title-padding-left: 16px;
1293   --f7-navbar-large-title-padding-right: 16px;
1294   /*
1295   --f7-navbar-link-height: var(--f7-navbar-height);
1296   --f7-navbar-link-line-height: var(--f7-navbar-height);
1297   */
1298 }
1299 .md .theme-dark,
1300 .md.theme-dark {
1301   --f7-navbar-subtitle-text-color: rgba(255, 255, 255, 0.85);
1302 }
1303 .aurora {
1304   --f7-navbar-height: 38px;
1305   --f7-navbar-tablet-height: 38px;
1306   --f7-navbar-font-size: 14px;
1307   --f7-navbar-inner-padding-left: 15px;
1308   --f7-navbar-inner-padding-right: 15px;
1309   --f7-navbar-title-font-weight: 600;
1310   --f7-navbar-title-margin-left: 0;
1311   --f7-navbar-title-margin-right: 0;
1312   --f7-navbar-title-text-align: center;
1313   --f7-navbar-subtitle-text-color: rgba(0, 0, 0, 0.6);
1314   --f7-navbar-subtitle-font-size: 12px;
1315   --f7-navbar-subtitle-line-height: 1;
1316   --f7-navbar-shadow-image: none;
1317   --f7-navbar-large-title-height: 38px;
1318   --f7-navbar-large-title-font-size: 26px;
1319   --f7-navbar-large-title-font-weight: bold;
1320   --f7-navbar-large-title-letter-spacing: -0.03em;
1321   --f7-navbar-large-title-padding-left: 15px;
1322   --f7-navbar-large-title-padding-right: 15px;
1323   --f7-navbar-link-height: auto;
1324   --f7-navbar-link-line-height: inherit;
1325 }
1326 .aurora .theme-dark,
1327 .aurora.theme-dark {
1328   --f7-navbar-subtitle-text-color: rgba(255, 255, 255, 0.5);
1329 }
1330 .navbar {
1331   --f7-navbar-large-collapse-progress: 0;
1332   position: relative;
1333   left: 0;
1334   top: 0;
1335   width: 100%;
1336   z-index: 500;
1337   -webkit-backface-visibility: hidden;
1338           backface-visibility: hidden;
1339   box-sizing: border-box;
1340   margin: 0;
1341   transform: translate3d(0, 0, 0);
1342   height: var(--f7-navbar-height);
1343   background-image: var(--f7-navbar-bg-image, var(--f7-bars-bg-image));
1344   background-color: var(--f7-navbar-bg-color, var(--f7-bars-bg-color, var(--f7-theme-color)));
1345   color: var(--f7-navbar-text-color, var(--f7-bars-text-color));
1346   font-size: var(--f7-navbar-font-size);
1347 }
1348 .navbar b {
1349   font-weight: 500;
1350 }
1351 .navbar a {
1352   color: var(--f7-navbar-link-color, var(--f7-bars-link-color, var(--f7-theme-color)));
1353 }
1354 .navbar a.link {
1355   display: flex;
1356   justify-content: flex-start;
1357   line-height: var(--f7-navbar-link-line-height, var(--f7-navbar-height));
1358   height: var(--f7-navbar-link-height, var(--f7-navbar-height));
1359 }
1360 .navbar .title,
1361 .navbar .left,
1362 .navbar .right {
1363   position: relative;
1364   z-index: 10;
1365 }
1366 .navbar .title {
1367   position: relative;
1368   overflow: hidden;
1369   text-overflow: ellipsis;
1370   white-space: nowrap;
1371   flex-shrink: 10;
1372   font-weight: var(--f7-navbar-title-font-weight);
1373   display: inline-block;
1374   line-height: var(--f7-navbar-title-line-height);
1375   text-align: var(--f7-navbar-title-text-align);
1376   font-size: var(--f7-navbar-title-font-size);
1377   margin-left: var(--f7-navbar-title-margin-left);
1378   margin-right: var(--f7-navbar-title-margin-left);
1379 }
1380 .navbar .subtitle {
1381   display: block;
1382   color: var(--f7-navbar-subtitle-text-color);
1383   font-weight: normal;
1384   font-size: var(--f7-navbar-subtitle-font-size);
1385   line-height: var(--f7-navbar-subtitle-line-height);
1386   text-align: var(--f7-navbar-subtitle-text-align);
1387 }
1388 .navbar .left,
1389 .navbar .right {
1390   flex-shrink: 0;
1391   display: flex;
1392   justify-content: flex-start;
1393   align-items: center;
1394   transform: translate3d(0, 0, 0);
1395 }
1396 .navbar .right:first-child {
1397   position: absolute;
1398   height: 100%;
1399 }
1400 .navbar.no-hairline:after,
1401 .navbar.no-border:after {
1402   display: none !important;
1403 }
1404 .navbar.no-hairline .title-large:after,
1405 .navbar.no-border .title-large:after {
1406   display: none !important;
1407 }
1408 .navbar.no-shadow:before {
1409   display: none !important;
1410 }
1411 .navbar.navbar-hidden:before {
1412   opacity: 0 !important;
1413 }
1414 .navbar:after,
1415 .navbar:before {
1416   -webkit-backface-visibility: hidden;
1417           backface-visibility: hidden;
1418 }
1419 .navbar:after {
1420   content: '';
1421   position: absolute;
1422   background-color: var(--f7-navbar-border-color, var(--f7-bars-border-color));
1423   display: block;
1424   z-index: 15;
1425   top: auto;
1426   right: auto;
1427   bottom: 0;
1428   left: 0;
1429   height: 1px;
1430   width: 100%;
1431   transform-origin: 50% 100%;
1432   transform: scaleY(calc(1 / var(--f7-device-pixel-ratio)));
1433 }
1434 .navbar:before {
1435   content: '';
1436   position: absolute;
1437   right: 0;
1438   width: 100%;
1439   top: 100%;
1440   bottom: auto;
1441   height: 8px;
1442   pointer-events: none;
1443   background: var(--f7-navbar-shadow-image);
1444 }
1445 .navbar:after {
1446   z-index: 1;
1447 }
1448 @media (min-width: 768px) {
1449   :root {
1450     --f7-navbar-height: var(--f7-navbar-tablet-height);
1451   }
1452 }
1453 .navbar-transitioning,
1454 .navbar-transitioning:before,
1455 .navbar-transitioning .title,
1456 .navbar-transitioning .title-large,
1457 .navbar-transitioning .title-large-inner,
1458 .navbar-transitioning .title-large-text,
1459 .navbar-transitioning .subnavbar {
1460   transition-duration: var(--f7-navbar-hide-show-transition-duration);
1461 }
1462 .navbar-page-transitioning {
1463   transition-duration: var(--f7-page-swipeback-transition-duration) !important;
1464 }
1465 .navbar-page-transitioning .title-large-text,
1466 .navbar-page-transitioning .title-large-inner {
1467   transition-duration: var(--f7-page-swipeback-transition-duration) !important;
1468 }
1469 .navbar-hidden {
1470   transform: translate3d(0, -100%, 0);
1471 }
1472 .navbar-large-hidden {
1473   --f7-navbar-large-collapse-progress: 1;
1474 }
1475 .navbar-inner {
1476   position: absolute;
1477   left: 0;
1478   top: 0;
1479   width: 100%;
1480   height: var(--f7-navbar-height);
1481   display: flex;
1482   align-items: center;
1483   box-sizing: border-box;
1484   padding: 0 calc(var(--f7-navbar-inner-padding-right) + var(--f7-safe-area-right)) 0 calc(var(--f7-navbar-inner-padding-left) + var(--f7-safe-area-left));
1485 }
1486 .navbar-inner.stacked {
1487   display: none;
1488 }
1489 .views > .navbar,
1490 .view > .navbar,
1491 .page > .navbar {
1492   position: absolute;
1493 }
1494 .navbar-large:before {
1495   transform: translateY(calc((1 - var(--f7-navbar-large-collapse-progress)) * var(--f7-navbar-large-title-height)));
1496 }
1497 .navbar-inner-large > .title {
1498   opacity: calc(-1 + 2 * var(--f7-navbar-large-collapse-progress));
1499 }
1500 .navbar-large-collapsed,
1501 .navbar-inner-large-collapsed {
1502   --f7-navbar-large-collapse-progress: 1;
1503 }
1504 .navbar .title-large {
1505   box-sizing: border-box;
1506   position: absolute;
1507   left: 0;
1508   right: 0;
1509   top: 100%;
1510   display: flex;
1511   align-items: center;
1512   white-space: nowrap;
1513   transform: translate3d(0px, calc(-1 * var(--f7-navbar-large-collapse-progress) * var(--f7-navbar-large-title-height)), 0);
1514   will-change: transform, opacity;
1515   transition-property: transform;
1516   overflow: hidden;
1517   background-image: var(--f7-navbar-bg-image, var(--f7-bars-bg-image));
1518   background-color: var(--f7-navbar-bg-color, var(--f7-bars-bg-color, var(--f7-theme-color)));
1519   height: calc(var(--f7-navbar-large-title-height) + 1px);
1520   z-index: 5;
1521   margin-top: -1px;
1522   transform-origin: calc(var(--f7-navbar-large-title-padding-left) + var(--f7-safe-area-left)) center;
1523 }
1524 .navbar .title-large:after {
1525   content: '';
1526   position: absolute;
1527   background-color: var(--f7-navbar-border-color, var(--f7-bars-border-color));
1528   display: block;
1529   z-index: 15;
1530   top: auto;
1531   right: auto;
1532   bottom: 0;
1533   left: 0;
1534   height: 1px;
1535   width: 100%;
1536   transform-origin: 50% 100%;
1537   transform: scaleY(calc(1 / var(--f7-device-pixel-ratio)));
1538 }
1539 .title-large-text,
1540 .title-large-inner .title {
1541   text-overflow: ellipsis;
1542   white-space: nowrap;
1543   color: var(--f7-navbar-large-title-text-color);
1544   letter-spacing: var(--f7-navbar-large-title-letter-spacing);
1545   font-size: var(--f7-navbar-large-title-font-size);
1546   font-weight: var(--f7-navbar-large-title-font-weight);
1547   line-height: var(--f7-navbar-large-title-line-height);
1548   padding-left: calc(var(--f7-navbar-large-title-padding-left) + var(--f7-safe-area-left));
1549   padding-right: calc(var(--f7-navbar-large-title-padding-right) + var(--f7-safe-area-right));
1550   transform-origin: calc(var(--f7-navbar-large-title-padding-left) + var(--f7-safe-area-left)) center;
1551 }
1552 .title-large-text,
1553 .title-large-inner {
1554   box-sizing: border-box;
1555   overflow: hidden;
1556   transform: translate3d(0, calc(var(--f7-navbar-large-collapse-progress) * var(--f7-navbar-large-title-height)), 0);
1557   transition-property: transform, opacity;
1558   width: 100%;
1559 }
1560 .navbar-no-title-large-transition .title-large,
1561 .navbar-no-title-large-transition .title-large-text,
1562 .navbar-no-title-large-transition .title-large-inner {
1563   transition-duration: 0ms;
1564 }
1565 .navbar ~ * {
1566   --f7-page-navbar-offset: var(--f7-navbar-height);
1567 }
1568 .navbar ~ * .page-with-navbar-large,
1569 .navbar ~ .page-with-navbar-large,
1570 .page-with-navbar-large .navbar ~ * {
1571   --f7-page-navbar-offset: calc(var(--f7-navbar-height) + var(--f7-navbar-large-title-height));
1572 }
1573 .page.no-navbar,
1574 .page.no-navbar .navbar ~ * {
1575   --f7-page-navbar-offset: 0px;
1576 }
1577 .ios {
1578   --f7-navbarLeftTextOffset: calc(4px + 12px + var(--f7-navbar-inner-padding-left));
1579   --f7-navbarTitleLargeOffset: var(--f7-navbar-large-title-padding-left);
1580 }
1581 .ios .navbar .material-icons {
1582   width: 24px;
1583 }
1584 .ios .navbar .f7-icons {
1585   width: 28px;
1586 }
1587 .ios .navbar a.icon-only {
1588   width: 44px;
1589   margin: 0;
1590   justify-content: center;
1591 }
1592 .ios .navbar .left a + a,
1593 .ios .navbar .right a + a {
1594   margin-left: 15px;
1595 }
1596 .ios .navbar b {
1597   font-weight: 600;
1598 }
1599 .ios .navbar .left {
1600   margin-right: 10px;
1601 }
1602 .ios .navbar .right {
1603   margin-left: 10px;
1604 }
1605 .ios .navbar .right:first-child {
1606   right: calc(8px + var(--f7-safe-area-right));
1607 }
1608 .ios .navbar-inner {
1609   justify-content: space-between;
1610 }
1611 .ios .navbar-inner-left-title {
1612   justify-content: flex-start;
1613 }
1614 .ios .navbar-inner-left-title .right {
1615   margin-left: auto;
1616 }
1617 .ios .navbar-inner-left-title .title {
1618   text-align: left;
1619   margin-right: 10px;
1620 }
1621 .ios .view-master-detail .navbar-previous:not(.navbar-master),
1622 .ios .view:not(.view-master-detail) .navbar-previous {
1623   pointer-events: none;
1624 }
1625 .ios .view-master-detail .navbar-previous:not(.navbar-master) .title-large,
1626 .ios .view:not(.view-master-detail) .navbar-previous .title-large {
1627   transform: translateY(-100%);
1628   opacity: 0;
1629   transition: 0ms;
1630 }
1631 .ios .view-master-detail .navbar-previous:not(.navbar-master) .title-large .title-large-text,
1632 .ios .view:not(.view-master-detail) .navbar-previous .title-large .title-large-text {
1633   transform: scale(0.5);
1634   transition: 0ms;
1635 }
1636 .ios .view-master-detail .navbar-previous:not(.navbar-master) .title-large .title-large-inner,
1637 .ios .view:not(.view-master-detail) .navbar-previous .title-large .title-large-inner {
1638   transform: translateX(-100%);
1639   opacity: 0;
1640   transition: 0ms;
1641 }
1642 .ios .view-master-detail .navbar-previous:not(.navbar-master) .left,
1643 .ios .view:not(.view-master-detail) .navbar-previous .left,
1644 .ios .view-master-detail .navbar-previous:not(.navbar-master) .right,
1645 .ios .view:not(.view-master-detail) .navbar-previous .right,
1646 .ios .view-master-detail .navbar-previous:not(.navbar-master) > .title,
1647 .ios .view:not(.view-master-detail) .navbar-previous > .title,
1648 .ios .view-master-detail .navbar-previous:not(.navbar-master) .subnavbar,
1649 .ios .view:not(.view-master-detail) .navbar-previous .subnavbar,
1650 .ios .view-master-detail .navbar-previous:not(.navbar-master) .fading,
1651 .ios .view:not(.view-master-detail) .navbar-previous .fading {
1652   opacity: 0;
1653 }
1654 .ios .view-master-detail .navbar-previous:not(.navbar-master) .sliding,
1655 .ios .view:not(.view-master-detail) .navbar-previous .sliding {
1656   opacity: 0;
1657 }
1658 .ios .view-master-detail .navbar-previous:not(.navbar-master) .subnavbar.sliding,
1659 .ios .view:not(.view-master-detail) .navbar-previous .subnavbar.sliding,
1660 .ios .view-master-detail .navbar-previous:not(.navbar-master).sliding .subnavbar,
1661 .ios .view:not(.view-master-detail) .navbar-previous.sliding .subnavbar {
1662   opacity: 1;
1663   transform: translate3d(-100%, 0, 0);
1664 }
1665 .ios .navbar-next {
1666   pointer-events: none;
1667 }
1668 .ios .navbar-next .title-large {
1669   transform: translateX(100%);
1670   transition: 0ms;
1671 }
1672 .ios .navbar-next .title-large .title-large-text,
1673 .ios .navbar-next .title-large .title-large-inner {
1674   transition: 0ms;
1675 }
1676 .ios .navbar-next .left,
1677 .ios .navbar-next .right,
1678 .ios .navbar-next > .title,
1679 .ios .navbar-next .subnavbar,
1680 .ios .navbar-next .fading {
1681   opacity: 0;
1682 }
1683 .ios .navbar-next .sliding {
1684   opacity: 0;
1685 }
1686 .ios .navbar-next.sliding .left,
1687 .ios .navbar-next.sliding .right,
1688 .ios .navbar-next.sliding > .title,
1689 .ios .navbar-next.sliding .subnavbar {
1690   opacity: 0;
1691 }
1692 .ios .navbar-next .subnavbar.sliding,
1693 .ios .navbar-next.sliding .subnavbar {
1694   opacity: 1;
1695   transform: translate3d(100%, 0, 0);
1696 }
1697 .ios .router-dynamic-navbar-inside .navbar-next .title-large,
1698 .ios .router-dynamic-navbar-inside .navbar-next .title-large-text,
1699 .ios .router-dynamic-navbar-inside .navbar-next .title-large-inner {
1700   transform: none;
1701 }
1702 .ios .router-dynamic-navbar-inside .navbar-previous .title-large {
1703   opacity: 1;
1704   transform: translate3d(0px, calc(-1 * var(--f7-navbar-large-collapse-progress) * var(--f7-navbar-large-title-height)), 0);
1705 }
1706 .ios .router-dynamic-navbar-inside .navbar-previous .title-large-text,
1707 .ios .router-dynamic-navbar-inside .navbar-previous .title-large-inner {
1708   transform: translate3d(0, calc(var(--f7-navbar-large-collapse-progress) * var(--f7-navbar-large-title-height)), 0);
1709 }
1710 .ios .router-transition .navbar {
1711   transition-duration: var(--f7-page-transition-duration);
1712 }
1713 .ios .router-transition .title-large {
1714   transition: 0ms;
1715 }
1716 .ios .router-transition .navbar-current .left,
1717 .ios .router-transition .navbar-current > .title,
1718 .ios .router-transition .navbar-current .right,
1719 .ios .router-transition .navbar-current .subnavbar {
1720   animation: ios-navbar-element-fade-out var(--f7-page-transition-duration) forwards;
1721 }
1722 .ios .router-transition .navbar-current .sliding,
1723 .ios .router-transition .navbar-current .left.sliding .icon + span,
1724 .ios .router-transition .navbar-current.sliding .left,
1725 .ios .router-transition .navbar-current.sliding .left .icon + span,
1726 .ios .router-transition .navbar-current.sliding > .title,
1727 .ios .router-transition .navbar-current.sliding .right {
1728   transition-duration: var(--f7-page-transition-duration);
1729   opacity: 0 !important;
1730   animation: none;
1731 }
1732 .ios .router-transition .navbar-current.sliding .subnavbar,
1733 .ios .router-transition .navbar-current .sliding.subnavbar {
1734   transition-duration: var(--f7-page-transition-duration);
1735   animation: none;
1736   opacity: 1;
1737 }
1738 .ios .router-transition-forward .navbar-next .left,
1739 .ios .router-transition-backward .navbar-previous .left,
1740 .ios .router-transition-forward .navbar-next > .title,
1741 .ios .router-transition-backward .navbar-previous > .title,
1742 .ios .router-transition-forward .navbar-next .right,
1743 .ios .router-transition-backward .navbar-previous .right,
1744 .ios .router-transition-forward .navbar-next .subnavbar,
1745 .ios .router-transition-backward .navbar-previous .subnavbar {
1746   animation: ios-navbar-element-fade-in var(--f7-page-transition-duration) forwards;
1747 }
1748 .ios .router-transition-forward .navbar-next .sliding,
1749 .ios .router-transition-backward .navbar-previous .sliding,
1750 .ios .router-transition-forward .navbar-next .left.sliding .icon + span,
1751 .ios .router-transition-backward .navbar-previous .left.sliding .icon + span,
1752 .ios .router-transition-forward .navbar-next.sliding .left,
1753 .ios .router-transition-backward .navbar-previous.sliding .left,
1754 .ios .router-transition-forward .navbar-next.sliding .left .icon + span,
1755 .ios .router-transition-backward .navbar-previous.sliding .left .icon + span,
1756 .ios .router-transition-forward .navbar-next.sliding > .title,
1757 .ios .router-transition-backward .navbar-previous.sliding > .title,
1758 .ios .router-transition-forward .navbar-next.sliding .right,
1759 .ios .router-transition-backward .navbar-previous.sliding .right,
1760 .ios .router-transition-forward .navbar-next.sliding .subnavbar,
1761 .ios .router-transition-backward .navbar-previous.sliding .subnavbar {
1762   transition-duration: var(--f7-page-transition-duration);
1763   animation: none;
1764   transform: translate3d(0, 0, 0) !important;
1765   opacity: 1 !important;
1766 }
1767 .ios .router-transition-forward .navbar-current.router-navbar-transition-from-large.router-navbar-transition-to-large .title-large {
1768   overflow: visible;
1769 }
1770 .ios .router-transition-forward .navbar-current.router-navbar-transition-from-large.router-navbar-transition-to-large .title-large .title-large-text {
1771   animation: ios-navbar-title-large-text-slide-up var(--f7-page-transition-duration) forwards, ios-navbar-title-large-text-fade-out var(--f7-page-transition-duration) forwards;
1772 }
1773 .ios .router-transition-forward .navbar-current.router-navbar-transition-from-large:not(.router-navbar-transition-to-large) .title-large {
1774   animation: ios-navbar-title-large-slide-up var(--f7-page-transition-duration) forwards;
1775 }
1776 .ios .router-transition-forward .navbar-current.router-navbar-transition-from-large:not(.router-navbar-transition-to-large) .title-large .title-large-text {
1777   animation: ios-navbar-title-large-text-fade-out var(--f7-page-transition-duration) forwards, ios-navbar-title-large-text-scale-out var(--f7-page-transition-duration) forwards;
1778 }
1779 .ios .router-transition-forward .navbar-current.router-navbar-transition-from-large .title-large-inner {
1780   animation: ios-navbar-title-large-inner-current-to-previous var(--f7-page-transition-duration) forwards;
1781 }
1782 .ios .router-transition-forward:not(.router-dynamic-navbar-inside) .navbar-next.router-navbar-transition-from-large .left .back span {
1783   animation: ios-navbar-back-text-next-to-current var(--f7-page-transition-duration) forwards;
1784   transition: none;
1785   transform-origin: left center;
1786 }
1787 .ios .router-transition-forward .navbar-next.router-navbar-transition-from-large.router-navbar-transition-to-large .title-large {
1788   overflow: visible;
1789 }
1790 .ios .router-transition-forward .navbar-next.router-navbar-transition-from-large.router-navbar-transition-to-large .title-large .title-large-text,
1791 .ios .router-transition-forward .navbar-next.router-navbar-transition-from-large.router-navbar-transition-to-large .title-large .title-large-inner {
1792   animation: ios-navbar-title-large-text-slide-left var(--f7-page-transition-duration) forwards;
1793 }
1794 .ios .router-transition-forward .navbar-next.router-navbar-transition-to-large:not(.router-navbar-transition-from-large) .title-large {
1795   animation: ios-navbar-title-large-slide-down var(--f7-page-transition-duration) forwards;
1796 }
1797 .ios .router-transition-forward .navbar-next.router-navbar-transition-to-large:not(.router-navbar-transition-from-large) .title-large .title-large-text,
1798 .ios .router-transition-forward .navbar-next.router-navbar-transition-to-large:not(.router-navbar-transition-from-large) .title-large .title-large-inner {
1799   animation: ios-navbar-title-large-text-slide-left-top var(--f7-page-transition-duration) forwards;
1800 }
1801 .ios .router-transition-forward .navbar-next.navbar-inner-large:not(.navbar-inner-large-collapsed) > .title,
1802 .ios .router-transition-forward .navbar-current.navbar-inner-large:not(.navbar-inner-large-collapsed) > .title {
1803   animation: none;
1804   opacity: 0 !important;
1805   transition-duration: 0;
1806 }
1807 .ios .router-transition-forward.router-dynamic-navbar-inside .navbar-next .title-large,
1808 .ios .router-transition-forward.router-dynamic-navbar-inside .navbar-current .title-large,
1809 .ios .router-transition-forward.router-dynamic-navbar-inside .navbar-next .title-large-text,
1810 .ios .router-transition-forward.router-dynamic-navbar-inside .navbar-current .title-large-text,
1811 .ios .router-transition-forward.router-dynamic-navbar-inside .navbar-next .title-large-inner,
1812 .ios .router-transition-forward.router-dynamic-navbar-inside .navbar-current .title-large-inner {
1813   animation: none !important;
1814 }
1815 .ios .router-transition-backward:not(.router-dynamic-navbar-inside) .navbar-current.router-navbar-transition-to-large .left .back span {
1816   animation: ios-navbar-back-text-current-to-previous var(--f7-page-transition-duration) forwards;
1817   transition: none;
1818   transform-origin: left center;
1819 }
1820 .ios .router-transition-backward .navbar-current.router-navbar-transition-from-large.router-navbar-transition-to-large .title-large {
1821   overflow: visible;
1822   transform: translateX(100%);
1823 }
1824 .ios .router-transition-backward .navbar-current.router-navbar-transition-from-large.router-navbar-transition-to-large .title-large .title-large-text,
1825 .ios .router-transition-backward .navbar-current.router-navbar-transition-from-large.router-navbar-transition-to-large .title-large .title-large-inner {
1826   animation: ios-navbar-title-large-text-slide-right var(--f7-page-transition-duration) forwards;
1827 }
1828 .ios .router-transition-backward .navbar-current.router-navbar-transition-from-large:not(.router-navbar-transition-to-large) .title-large {
1829   animation: ios-navbar-title-large-slide-up var(--f7-page-transition-duration) forwards;
1830 }
1831 .ios .router-transition-backward .navbar-current.router-navbar-transition-from-large:not(.router-navbar-transition-to-large) .title-large .title-large-text,
1832 .ios .router-transition-backward .navbar-current.router-navbar-transition-from-large:not(.router-navbar-transition-to-large) .title-large .title-large-inner {
1833   animation: ios-navbar-title-large-text-slide-right-bottom var(--f7-page-transition-duration) forwards;
1834 }
1835 .ios .router-transition-backward .navbar-current.router-navbar-transition-to-large:not(.router-navbar-transition-from-large) .title-large {
1836   opacity: 0;
1837 }
1838 .ios .router-transition-backward .navbar-previous.router-navbar-transition-from-large.router-navbar-transition-to-large .title-large {
1839   overflow: visible;
1840   opacity: 1;
1841   transform: translateY(0);
1842 }
1843 .ios .router-transition-backward .navbar-previous.router-navbar-transition-from-large.router-navbar-transition-to-large .title-large .title-large-text {
1844   animation: ios-navbar-title-large-text-slide-down var(--f7-page-transition-duration) forwards, ios-navbar-title-large-text-fade-in var(--f7-page-transition-duration) forwards;
1845 }
1846 .ios .router-transition-backward .navbar-previous.router-navbar-transition-to-large:not(.router-navbar-transition-from-large) .title-large {
1847   opacity: 1;
1848   animation: ios-navbar-title-large-slide-down var(--f7-page-transition-duration) forwards;
1849 }
1850 .ios .router-transition-backward .navbar-previous.router-navbar-transition-to-large:not(.router-navbar-transition-from-large) .title-large .title-large-text {
1851   animation: ios-navbar-title-large-text-scale-in var(--f7-page-transition-duration) forwards, ios-navbar-title-large-text-fade-in var(--f7-page-transition-duration) forwards;
1852 }
1853 .ios .router-transition-backward .navbar-previous.router-navbar-transition-to-large .title-large-inner {
1854   animation: ios-navbar-title-large-inner-previous-to-current var(--f7-page-transition-duration) forwards;
1855 }
1856 .ios .router-transition-backward .navbar-current.navbar-inner-large:not(.navbar-inner-large-collapsed) > .title,
1857 .ios .router-transition-backward .navbar-previous.navbar-inner-large:not(.navbar-inner-large-collapsed) > .title {
1858   animation: none;
1859   opacity: 0 !important;
1860   transition-duration: 0;
1861 }
1862 .ios .router-transition-backward.router-dynamic-navbar-inside .navbar-previous .title-large,
1863 .ios .router-transition-backward.router-dynamic-navbar-inside .navbar-current .title-large,
1864 .ios .router-transition-backward.router-dynamic-navbar-inside .navbar-previous .title-large-text,
1865 .ios .router-transition-backward.router-dynamic-navbar-inside .navbar-current .title-large-text,
1866 .ios .router-transition-backward.router-dynamic-navbar-inside .navbar-previous .title-large-inner,
1867 .ios .router-transition-backward.router-dynamic-navbar-inside .navbar-current .title-large-inner {
1868   animation: none !important;
1869 }
1870 .view-master-detail .navbar-master.navbar-previous {
1871   pointer-events: auto;
1872 }
1873 .view-master-detail .navbar-master.navbar-previous .left,
1874 .view-master-detail .navbar-master.navbar-previous:not(.navbar-inner-large) .title,
1875 .view-master-detail .navbar-master.navbar-previous .right,
1876 .view-master-detail .navbar-master.navbar-previous .subnavbar {
1877   opacity: 1;
1878 }
1879 .ios .view-master-detail.router-transition .navbar-master .left,
1880 .ios .view-master-detail.router-transition .navbar-master .left .icon + span,
1881 .ios .view-master-detail.router-transition .navbar-master:not(.navbar-inner-large) .title,
1882 .ios .view-master-detail.router-transition .navbar-master .right,
1883 .ios .view-master-detail.router-transition .navbar-master .subnavbar,
1884 .ios .view-master-detail.router-transition .navbar-master .sliding,
1885 .ios .view-master-detail.router-transition .navbar-master .fading {
1886   opacity: 1 !important;
1887   transition-duration: 0ms;
1888   transform: none !important;
1889   animation: none !important;
1890 }
1891 .ios .view-master-detail.router-transition .navbar-master.navbar-inner-large .title {
1892   opacity: calc(-1 + 2 * var(--f7-navbar-large-collapse-progress)) !important;
1893   transition-duration: 0ms;
1894   transform: none !important;
1895   animation: none !important;
1896 }
1897 .ios .view-master-detail.router-transition .navbar-master.navbar-inner-large .title-large,
1898 .ios .view-master-detail.router-transition .navbar-master.navbar-inner-large .title-large-text,
1899 .ios .view-master-detail.router-transition .navbar-master.navbar-inner-large .title-large-inner {
1900   transition-duration: 0ms;
1901   animation: none !important;
1902 }
1903 @keyframes ios-navbar-element-fade-in {
1904   from {
1905     opacity: 0;
1906   }
1907   to {
1908     opacity: 1;
1909   }
1910 }
1911 @keyframes ios-navbar-element-fade-out {
1912   from {
1913     opacity: 1;
1914   }
1915   to {
1916     opacity: 0;
1917   }
1918 }
1919 @keyframes ios-navbar-title-large-slide-up {
1920   0% {
1921     transform: translateY(0%);
1922   }
1923   100% {
1924     transform: translateY(calc(-1 * var(--f7-navbar-large-title-height)));
1925   }
1926 }
1927 @keyframes ios-navbar-title-large-slide-down {
1928   0% {
1929     transform: translateY(calc(-1 * var(--f7-navbar-large-title-height)));
1930   }
1931   100% {
1932     transform: translateY(0%);
1933   }
1934 }
1935 @keyframes ios-navbar-title-large-text-slide-up {
1936   0% {
1937     transform: translateX(0px) translateY(0%) scale(1);
1938   }
1939   100% {
1940     transform: translateX(calc(var(--f7-navbarLeftTextOffset) - var(--f7-navbarTitleLargeOffset))) translateY(calc(-1 * (var(--f7-navbar-height) + var(--f7-navbar-large-title-height)) / 2)) scale(0.5);
1941   }
1942 }
1943 @keyframes ios-navbar-title-large-text-slide-down {
1944   0% {
1945     transform: translateX(calc(var(--f7-navbarLeftTextOffset) - var(--f7-navbarTitleLargeOffset))) translateY(calc(-1 * (var(--f7-navbar-height) + var(--f7-navbar-large-title-height)) / 2)) scale(0.5);
1946   }
1947   100% {
1948     transform: translateX(0px) translateY(0%) scale(1);
1949   }
1950 }
1951 @keyframes ios-navbar-title-large-text-slide-left {
1952   0% {
1953     transform: translateX(0%) scale(1);
1954   }
1955   100% {
1956     transform: translateX(-100%) scale(1);
1957   }
1958 }
1959 @keyframes ios-navbar-title-large-text-slide-right {
1960   0% {
1961     transform: translateX(-100%) scale(1);
1962   }
1963   100% {
1964     transform: translateX(0%) scale(1);
1965   }
1966 }
1967 @keyframes ios-navbar-title-large-text-slide-left-top {
1968   0% {
1969     transform: translateX(100%) translateY(var(--f7-navbar-large-title-height)) scale(1);
1970   }
1971   100% {
1972     transform: translateX(0%) translateY(0%) scale(1);
1973   }
1974 }
1975 @keyframes ios-navbar-title-large-text-slide-right-bottom {
1976   0% {
1977     transform: translateX(0%) translateY(0%) scale(1);
1978   }
1979   100% {
1980     transform: translateX(100%) translateY(var(--f7-navbar-large-title-height)) scale(1);
1981   }
1982 }
1983 @keyframes ios-navbar-title-large-text-fade-out {
1984   0% {
1985     opacity: 1;
1986   }
1987   80% {
1988     opacity: 0;
1989   }
1990   100% {
1991     opacity: 0;
1992   }
1993 }
1994 @keyframes ios-navbar-title-large-text-fade-in {
1995   0% {
1996     opacity: 0;
1997   }
1998   20% {
1999     opacity: 0;
2000   }
2001   100% {
2002     opacity: 1;
2003   }
2004 }
2005 @keyframes ios-navbar-title-large-text-scale-out {
2006   0% {
2007     transform: translateY(0%) scale(1);
2008   }
2009   100% {
2010     transform: translateY(0%) scale(0.5);
2011   }
2012 }
2013 @keyframes ios-navbar-title-large-text-scale-in {
2014   0% {
2015     transform: translateY(0%) scale(0.5);
2016   }
2017   100% {
2018     transform: translateY(0%) scale(1);
2019   }
2020 }
2021 @keyframes ios-navbar-back-text-current-to-previous {
2022   0% {
2023     opacity: 1;
2024     transform: translateY(0px) translateX(0px) scale(1);
2025   }
2026   80% {
2027     opacity: 0;
2028   }
2029   100% {
2030     opacity: 0;
2031     transform: translateX(calc(var(--f7-navbarTitleLargeOffset) - var(--f7-navbarLeftTextOffset))) translateY(calc((var(--f7-navbar-height) + var(--f7-navbar-large-title-height)) / 2)) scale(2);
2032   }
2033 }
2034 @keyframes ios-navbar-back-text-next-to-current {
2035   0% {
2036     opacity: 0;
2037     transform: translateX(calc(var(--f7-navbarTitleLargeOffset) - var(--f7-navbarLeftTextOffset))) translateY(calc((var(--f7-navbar-height) + var(--f7-navbar-large-title-height)) / 2)) scale(2);
2038   }
2039   20% {
2040     opacity: 0;
2041   }
2042   100% {
2043     opacity: 1;
2044     transform: translateX(0px) translateY(0px) scale(1);
2045   }
2046 }
2047 @keyframes ios-navbar-title-large-inner-current-to-previous {
2048   0% {
2049     transform: translateX(0%);
2050     opacity: 1;
2051   }
2052   100% {
2053     transform: translateX(-100%);
2054     opacity: 0;
2055   }
2056 }
2057 @keyframes ios-navbar-title-large-inner-previous-to-current {
2058   0% {
2059     transform: translateX(-100%);
2060     opacity: 0;
2061   }
2062   100% {
2063     transform: translateX(0%);
2064     opacity: 1;
2065   }
2066 }
2067 .md .navbar .material-icons {
2068   width: 24px;
2069 }
2070 .md .navbar .f7-icons {
2071   width: 28px;
2072 }
2073 .md .navbar a.link {
2074   padding: 0 16px;
2075   min-width: 48px;
2076 }
2077 .md .navbar a.link:before {
2078   content: '';
2079   width: 152%;
2080   height: 152%;
2081   position: absolute;
2082   left: -26%;
2083   top: -26%;
2084   background-image: radial-gradient(circle at center, var(--f7-link-highlight-color) 66%, rgba(255, 255, 255, 0) 66%);
2085   background-repeat: no-repeat;
2086   background-position: center;
2087   background-size: 100% 100%;
2088   opacity: 0;
2089   pointer-events: none;
2090   transition-duration: 600ms;
2091 }
2092 .md .navbar a.link.active-state:before {
2093   opacity: 1;
2094   transition-duration: 150ms;
2095 }
2096 .md .navbar a.icon-only {
2097   min-width: 0;
2098   flex-shrink: 0;
2099   width: 56px;
2100 }
2101 .md .navbar .right {
2102   margin-left: auto;
2103 }
2104 .md .navbar .right:first-child {
2105   right: var(--f7-safe-area-right);
2106 }
2107 .md .navbar-inner {
2108   justify-content: flex-start;
2109   overflow: hidden;
2110 }
2111 .md .navbar-inner-large:not(.navbar-inner-large-collapsed) {
2112   overflow: visible;
2113 }
2114 .md .page.page-with-subnavbar .navbar-inner {
2115   overflow: visible;
2116 }
2117 .md .navbar-inner-centered-title {
2118   justify-content: space-between;
2119 }
2120 .md .navbar-inner-centered-title .right {
2121   margin-left: 0;
2122 }
2123 .md .navbar-inner-centered-title .title {
2124   text-align: center;
2125 }
2126 .aurora .navbar a.icon-only {
2127   margin: 0;
2128   justify-content: center;
2129 }
2130 .aurora .navbar .left a + a,
2131 .aurora .navbar .right a + a {
2132   margin-left: 10px;
2133 }
2134 .aurora .navbar b {
2135   font-weight: bold;
2136 }
2137 .aurora .navbar .left {
2138   margin-right: 10px;
2139 }
2140 .aurora .navbar .right {
2141   margin-left: 10px;
2142 }
2143 .aurora .navbar .right:first-child {
2144   right: calc(15px + var(--f7-safe-area-right));
2145 }
2146 .aurora .navbar-inner {
2147   justify-content: space-between;
2148 }
2149 .aurora .navbar-inner-left-title {
2150   justify-content: flex-start;
2151 }
2152 .aurora .navbar-inner-left-title .right {
2153   margin-left: auto;
2154 }
2155 .aurora .navbar-inner-left-title .title {
2156   text-align: left;
2157   margin-right: 10px;
2158 }
2159 /* === Toolbar === */
2160 :root {
2161   /*
2162   --f7-toolbar-bg-color: var(--f7-bars-bg-color);
2163   --f7-toolbar-bg-image: var(--f7-bars-bg-image);
2164   --f7-toolbar-border-color: var(--f7-bars-border-color);
2165   --f7-toolbar-link-color: var(--f7-bars-link-color);
2166   --f7-toolbar-text-color: var(--f7-bars-text-color);
2167   --f7-tabbar-link-active-color: var(--f7-theme-color);
2168   */
2169   --f7-tabbar-link-active-bg-color: transparent;
2170   --f7-tabbar-label-text-transform: none;
2171   --f7-toolbar-hide-show-transition-duration: 400ms;
2172 }
2173 .ios {
2174   --f7-toolbar-height: 44px;
2175   --f7-toolbar-font-size: 17px;
2176   --f7-toolbar-inner-padding-left: 8px;
2177   --f7-toolbar-inner-padding-right: 8px;
2178   /*
2179   --f7-toolbar-link-height: var(--f7-toolbar-height);
2180   --f7-toolbar-link-line-height: var(--f7-toolbar-height);
2181   */
2182   --f7-tabbar-labels-height: 50px;
2183   --f7-tabbar-labels-tablet-height: 56px;
2184   --f7-tabbar-link-inactive-color: #929292;
2185   --f7-toolbar-top-shadow-image: none;
2186   --f7-toolbar-bottom-shadow-image: none;
2187   --f7-tabbar-icon-size: 28px;
2188   --f7-tabbar-link-text-transform: none;
2189   --f7-tabbar-link-font-weight: 400;
2190   --f7-tabbar-link-letter-spacing: 0;
2191   --f7-tabbar-label-font-size: 10px;
2192   --f7-tabbar-label-tablet-font-size: 14px;
2193   --f7-tabbar-label-font-weight: 400;
2194   --f7-tabbar-label-letter-spacing: 0.01;
2195 }
2196 .md {
2197   --f7-toolbar-height: 48px;
2198   --f7-toolbar-font-size: 14px;
2199   --f7-toolbar-inner-padding-left: 0px;
2200   --f7-toolbar-inner-padding-right: 0px;
2201   /*
2202   --f7-toolbar-link-height: var(--f7-toolbar-height);
2203   --f7-toolbar-link-line-height: var(--f7-toolbar-height);
2204   */
2205   --f7-tabbar-labels-height: 56px;
2206   --f7-tabbar-labels-tablet-height: 56px;
2207   --f7-tabbar-link-inactive-color: rgba(0, 0, 0, 0.54);
2208   /*
2209   --f7-tabbar-link-active-border-color: var(--f7-theme-color);
2210   */
2211   --f7-toolbar-top-shadow-image: var(--f7-bars-shadow-bottom-image);
2212   --f7-toolbar-bottom-shadow-image: var(--f7-bars-shadow-top-image);
2213   --f7-tabbar-icon-size: 24px;
2214   --f7-tabbar-link-text-transform: uppercase;
2215   --f7-tabbar-link-font-weight: 500;
2216   --f7-tabbar-link-letter-spacing: 0.03em;
2217   --f7-tabbar-label-font-size: 14px;
2218   --f7-tabbar-label-tablet-font-size: 14px;
2219   --f7-tabbar-label-font-weight: 400;
2220   --f7-tabbar-label-letter-spacing: 0;
2221 }
2222 .md .theme-dark,
2223 .md.theme-dark {
2224   --f7-tabbar-link-inactive-color: rgba(255, 255, 255, 0.54);
2225 }
2226 .aurora {
2227   --f7-toolbar-height: 38px;
2228   --f7-toolbar-font-size: 14px;
2229   --f7-toolbar-inner-padding-left: 15px;
2230   --f7-toolbar-inner-padding-right: 15px;
2231   --f7-toolbar-link-height: auto;
2232   --f7-toolbar-link-line-height: inherit;
2233   --f7-tabbar-labels-height: 44px;
2234   --f7-tabbar-labels-tablet-height: 44px;
2235   --f7-tabbar-link-inactive-color: rgba(0, 0, 0, 0.5);
2236   --f7-tabbar-link-inactive-bg-color: rgba(0, 0, 0, 0.2);
2237   --f7-toolbar-top-shadow-image: none;
2238   --f7-toolbar-bottom-shadow-image: none;
2239   --f7-tabbar-icon-size: 18px;
2240   --f7-tabbar-link-text-transform: none;
2241   --f7-tabbar-link-font-weight: 400;
2242   --f7-tabbar-link-letter-spacing: 0;
2243   --f7-tabbar-label-font-size: 12px;
2244   --f7-tabbar-label-tablet-font-size: 12px;
2245   --f7-tabbar-label-font-weight: 500;
2246   --f7-tabbar-label-letter-spacing: 0.01;
2247 }
2248 .aurora .theme-dark,
2249 .aurora.theme-dark {
2250   --f7-tabbar-link-inactive-color: rgba(255, 255, 255, 0.5);
2251 }
2252 .toolbar {
2253   width: 100%;
2254   position: relative;
2255   margin: 0;
2256   transform: translate3d(0, 0, 0);
2257   -webkit-backface-visibility: hidden;
2258           backface-visibility: hidden;
2259   z-index: 500;
2260   box-sizing: border-box;
2261   left: 0;
2262   height: var(--f7-toolbar-height);
2263   background-image: var(--f7-toolbar-bg-image, var(--f7-bars-bg-image));
2264   background-color: var(--f7-toolbar-bg-color, var(--f7-bars-bg-color, var(--f7-theme-color)));
2265   color: var(--f7-toolbar-text-color, var(--f7-bars-text-color));
2266   font-size: var(--f7-toolbar-font-size);
2267 }
2268 .toolbar b {
2269   font-weight: 600;
2270 }
2271 .toolbar a {
2272   color: var(--f7-toolbar-link-color, var(--f7-bars-link-color, var(--f7-theme-color)));
2273   box-sizing: border-box;
2274   flex-shrink: 1;
2275   position: relative;
2276   white-space: nowrap;
2277   text-overflow: ellipsis;
2278 }
2279 .toolbar a.link {
2280   display: flex;
2281   line-height: var(--f7-toolbar-link-line-height, var(--f7-toolbar-height));
2282   height: var(--f7-toolbar-link-height, var(--f7-toolbar-height));
2283 }
2284 .toolbar i.icon {
2285   display: block;
2286 }
2287 .toolbar:after,
2288 .toolbar:before {
2289   -webkit-backface-visibility: hidden;
2290           backface-visibility: hidden;
2291 }
2292 .views > .toolbar,
2293 .view > .toolbar,
2294 .page > .toolbar {
2295   position: absolute;
2296 }
2297 .toolbar-top,
2298 .ios .toolbar-top-ios,
2299 .md .toolbar-top-md,
2300 .aurora .toolbar-top-aurora {
2301   top: 0;
2302 }
2303 .toolbar-top .tab-link-highlight,
2304 .ios .toolbar-top-ios .tab-link-highlight,
2305 .md .toolbar-top-md .tab-link-highlight,
2306 .aurora .toolbar-top-aurora .tab-link-highlight {
2307   bottom: 0;
2308 }
2309 .toolbar-top.no-hairline:after,
2310 .ios .toolbar-top-ios.no-hairline:after,
2311 .md .toolbar-top-md.no-hairline:after,
2312 .aurora .toolbar-top-aurora.no-hairline:after,
2313 .toolbar-top.no-border:after,
2314 .ios .toolbar-top-ios.no-border:after,
2315 .md .toolbar-top-md.no-border:after,
2316 .aurora .toolbar-top-aurora.no-border:after {
2317   display: none !important;
2318 }
2319 .toolbar-top.no-shadow:before,
2320 .ios .toolbar-top-ios.no-shadow:before,
2321 .md .toolbar-top-md.no-shadow:before,
2322 .aurora .toolbar-top-aurora.no-shadow:before,
2323 .toolbar-top.toolbar-hidden:before,
2324 .ios .toolbar-top-ios.toolbar-hidden:before,
2325 .md .toolbar-top-md.toolbar-hidden:before,
2326 .aurora .toolbar-top-aurora.toolbar-hidden:before {
2327   display: none !important;
2328 }
2329 .toolbar-top:after,
2330 .ios .toolbar-top-ios:after,
2331 .md .toolbar-top-md:after,
2332 .aurora .toolbar-top-aurora:after,
2333 .toolbar-top:before,
2334 .ios .toolbar-top-ios:before,
2335 .md .toolbar-top-md:before,
2336 .aurora .toolbar-top-aurora:before {
2337   -webkit-backface-visibility: hidden;
2338           backface-visibility: hidden;
2339 }
2340 .toolbar-top:after,
2341 .ios .toolbar-top-ios:after,
2342 .md .toolbar-top-md:after,
2343 .aurora .toolbar-top-aurora:after {
2344   content: '';
2345   position: absolute;
2346   background-color: var(--f7-toolbar-border-color, var(--f7-bars-border-color));
2347   display: block;
2348   z-index: 15;
2349   top: auto;
2350   right: auto;
2351   bottom: 0;
2352   left: 0;
2353   height: 1px;
2354   width: 100%;
2355   transform-origin: 50% 100%;
2356   transform: scaleY(calc(1 / var(--f7-device-pixel-ratio)));
2357 }
2358 .toolbar-top:before,
2359 .ios .toolbar-top-ios:before,
2360 .md .toolbar-top-md:before,
2361 .aurora .toolbar-top-aurora:before {
2362   content: '';
2363   position: absolute;
2364   right: 0;
2365   width: 100%;
2366   top: 100%;
2367   bottom: auto;
2368   height: 8px;
2369   pointer-events: none;
2370   background: var(--f7-toolbar-top-shadow-image);
2371 }
2372 .toolbar-bottom,
2373 .ios .toolbar-bottom-ios,
2374 .md .toolbar-bottom-md,
2375 .aurora .toolbar-bottom-aurora {
2376   bottom: 0;
2377   height: calc(var(--f7-toolbar-height) + var(--f7-safe-area-bottom));
2378 }
2379 .toolbar-bottom .tab-link-highlight,
2380 .ios .toolbar-bottom-ios .tab-link-highlight,
2381 .md .toolbar-bottom-md .tab-link-highlight,
2382 .aurora .toolbar-bottom-aurora .tab-link-highlight {
2383   top: 0;
2384 }
2385 .toolbar-bottom .toolbar-inner,
2386 .ios .toolbar-bottom-ios .toolbar-inner,
2387 .md .toolbar-bottom-md .toolbar-inner,
2388 .aurora .toolbar-bottom-aurora .toolbar-inner {
2389   height: auto;
2390   top: 0;
2391   bottom: var(--f7-safe-area-bottom);
2392 }
2393 .toolbar-bottom.no-hairline:before,
2394 .ios .toolbar-bottom-ios.no-hairline:before,
2395 .md .toolbar-bottom-md.no-hairline:before,
2396 .aurora .toolbar-bottom-aurora.no-hairline:before,
2397 .toolbar-bottom.no-border:before,
2398 .ios .toolbar-bottom-ios.no-border:before,
2399 .md .toolbar-bottom-md.no-border:before,
2400 .aurora .toolbar-bottom-aurora.no-border:before {
2401   display: none !important;
2402 }
2403 .toolbar-bottom.no-shadow:after,
2404 .ios .toolbar-bottom-ios.no-shadow:after,
2405 .md .toolbar-bottom-md.no-shadow:after,
2406 .aurora .toolbar-bottom-aurora.no-shadow:after,
2407 .toolbar-bottom.toolbar-hidden:after,
2408 .ios .toolbar-bottom-ios.toolbar-hidden:after,
2409 .md .toolbar-bottom-md.toolbar-hidden:after,
2410 .aurora .toolbar-bottom-aurora.toolbar-hidden:after {
2411   display: none !important;
2412 }
2413 .toolbar-bottom:before,
2414 .ios .toolbar-bottom-ios:before,
2415 .md .toolbar-bottom-md:before,
2416 .aurora .toolbar-bottom-aurora:before {
2417   content: '';
2418   position: absolute;
2419   background-color: var(--f7-toolbar-border-color, var(--f7-bars-border-color));
2420   display: block;
2421   z-index: 15;
2422   top: 0;
2423   right: auto;
2424   bottom: auto;
2425   left: 0;
2426   height: 1px;
2427   width: 100%;
2428   transform-origin: 50% 0%;
2429   transform: scaleY(calc(1 / var(--f7-device-pixel-ratio)));
2430 }
2431 .toolbar-bottom:after,
2432 .ios .toolbar-bottom-ios:after,
2433 .md .toolbar-bottom-md:after,
2434 .aurora .toolbar-bottom-aurora:after {
2435   content: '';
2436   position: absolute;
2437   right: 0;
2438   width: 100%;
2439   bottom: 100%;
2440   height: 8px;
2441   top: auto;
2442   pointer-events: none;
2443   background: var(--f7-toolbar-bottom-shadow-image);
2444 }
2445 .toolbar-inner {
2446   position: absolute;
2447   left: 0;
2448   top: 0;
2449   width: 100%;
2450   height: 100%;
2451   display: flex;
2452   justify-content: space-between;
2453   box-sizing: border-box;
2454   align-items: center;
2455   align-content: center;
2456   overflow: hidden;
2457   padding: 0 calc(var(--f7-toolbar-inner-padding-right) + var(--f7-safe-area-right)) 0 calc(var(--f7-toolbar-inner-padding-left) + var(--f7-safe-area-left));
2458 }
2459 .views > .tabbar,
2460 .views > .tabbar-labels {
2461   z-index: 5001;
2462 }
2463 .tabbar a,
2464 .tabbar-labels a {
2465   color: var(--f7-tabbar-link-inactive-color);
2466 }
2467 .tabbar a.tab-link:not(.tab-link-active),
2468 .tabbar-labels a.tab-link:not(.tab-link-active) {
2469   background-color: var(--f7-tabbar-link-inactive-bg-color, transparent);
2470 }
2471 .tabbar a.link,
2472 .tabbar-labels a.link {
2473   line-height: 1.4;
2474 }
2475 .tabbar a.tab-link,
2476 .tabbar-labels a.tab-link,
2477 .tabbar a.link,
2478 .tabbar-labels a.link {
2479   height: 100%;
2480   width: 100%;
2481   box-sizing: border-box;
2482   display: flex;
2483   justify-content: center;
2484   align-items: center;
2485   flex-direction: column;
2486   text-transform: var(--f7-tabbar-link-text-transform);
2487   font-weight: var(--f7-tabbar-link-font-weight);
2488   letter-spacing: var(--f7-tabbar-link-letter-spacing);
2489   overflow: hidden;
2490 }
2491 .tabbar .tab-link-active,
2492 .tabbar-labels .tab-link-active {
2493   color: var(--f7-tabbar-link-active-color, var(--f7-theme-color));
2494   background-color: var(--f7-tabbar-link-active-bg-color, transparent);
2495 }
2496 .tabbar i.icon,
2497 .tabbar-labels i.icon {
2498   font-size: var(--f7-tabbar-icon-size);
2499   height: var(--f7-tabbar-icon-size);
2500   line-height: var(--f7-tabbar-icon-size);
2501 }
2502 .tabbar-labels {
2503   --f7-toolbar-height: var(--f7-tabbar-labels-height);
2504 }
2505 .tabbar-labels a.tab-link,
2506 .tabbar-labels a.link {
2507   height: 100%;
2508   justify-content: space-between;
2509   align-items: center;
2510 }
2511 .tabbar-labels .tabbar-label {
2512   display: block;
2513   line-height: 1;
2514   margin: 0;
2515   position: relative;
2516   text-overflow: ellipsis;
2517   white-space: nowrap;
2518   font-size: var(--f7-tabbar-label-font-size);
2519   text-transform: var(--f7-tabbar-label-text-transform);
2520   font-weight: var(--f7-tabbar-label-font-weight);
2521   letter-spacing: var(--f7-tabbar-label-letter-spacing);
2522 }
2523 @media (min-width: 768px) {
2524   :root {
2525     --f7-tabbar-labels-height: var(--f7-tabbar-labels-tablet-height);
2526     --f7-tabbar-label-font-size: var(--f7-tabbar-label-tablet-font-size);
2527   }
2528 }
2529 .tabbar-scrollable .toolbar-inner {
2530   justify-content: flex-start;
2531   will-change: scroll-position;
2532   overflow: auto;
2533   -webkit-overflow-scrolling: touch;
2534 }
2535 .tabbar-scrollable .toolbar-inner::-webkit-scrollbar {
2536   display: none !important;
2537   width: 0 !important;
2538   height: 0 !important;
2539   -webkit-appearance: none;
2540   opacity: 0 !important;
2541 }
2542 .tabbar-scrollable a.tab-link,
2543 .tabbar-scrollable a.link {
2544   width: auto;
2545   flex-shrink: 0;
2546 }
2547 .toolbar-transitioning,
2548 .navbar-transitioning + .toolbar,
2549 .navbar-transitioning ~ * .toolbar {
2550   transition-duration: var(--f7-toolbar-hide-show-transition-duration);
2551 }
2552 .toolbar-bottom ~ *,
2553 .ios .toolbar-bottom-ios ~ *,
2554 .md .toolbar-bottom-md ~ *,
2555 .aurora .toolbar-bottom-aurora ~ * {
2556   --f7-page-toolbar-bottom-offset: var(--f7-toolbar-height);
2557 }
2558 .toolbar-bottom.tabbar-labels ~ *,
2559 .ios .toolbar-bottom-ios.tabbar-labels ~ *,
2560 .md .toolbar-bottom-md.tabbar-labels ~ *,
2561 .aurora .toolbar-bottom-aurora.tabbar-labels ~ * {
2562   --f7-page-toolbar-bottom-offset: var(--f7-tabbar-labels-height);
2563 }
2564 .toolbar-bottom.toolbar-hidden,
2565 .ios .toolbar-bottom-ios.toolbar-hidden,
2566 .md .toolbar-bottom-md.toolbar-hidden,
2567 .aurora .toolbar-bottom-aurora.toolbar-hidden {
2568   transform: translate3d(0, 100%, 0);
2569 }
2570 .toolbar-top ~ *,
2571 .ios .toolbar-top-ios ~ *,
2572 .md .toolbar-top-md ~ *,
2573 .aurora .toolbar-top-aurora ~ * {
2574   --f7-page-toolbar-top-offset: var(--f7-toolbar-height);
2575 }
2576 .toolbar-top.tabbar-labels ~ *,
2577 .ios .toolbar-top-ios.tabbar-labels ~ *,
2578 .md .toolbar-top-md.tabbar-labels ~ *,
2579 .aurora .toolbar-top-aurora.tabbar-labels ~ * {
2580   --f7-page-toolbar-top-offset: var(--f7-tabbar-labels-height);
2581 }
2582 .toolbar-top.toolbar-hidden,
2583 .ios .toolbar-top-ios.toolbar-hidden,
2584 .md .toolbar-top-md.toolbar-hidden,
2585 .aurora .toolbar-top-aurora.toolbar-hidden {
2586   transform: translate3d(0, -100%, 0);
2587 }
2588 .navbar ~ .toolbar-top,
2589 .ios .navbar ~ .toolbar-top-ios,
2590 .md .navbar ~ .toolbar-top-md,
2591 .aurora .navbar ~ .toolbar-top-aurora,
2592 .navbar ~ * .toolbar-top,
2593 .ios .navbar ~ * .toolbar-top-ios,
2594 .md .navbar ~ * .toolbar-top-md,
2595 .aurora .navbar ~ * .toolbar-top-aurora,
2596 .navbar ~ .page:not(.no-navbar) .toolbar-top,
2597 .ios .navbar ~ .page:not(.no-navbar) .toolbar-top-ios,
2598 .md .navbar ~ .page:not(.no-navbar) .toolbar-top-md,
2599 .aurora .navbar ~ .page:not(.no-navbar) .toolbar-top-aurora {
2600   top: var(--f7-navbar-height);
2601 }
2602 .navbar ~ .toolbar-top.toolbar-hidden,
2603 .ios .navbar ~ .toolbar-top-ios.toolbar-hidden,
2604 .md .navbar ~ .toolbar-top-md.toolbar-hidden,
2605 .aurora .navbar ~ .toolbar-top-aurora.toolbar-hidden,
2606 .navbar ~ * .toolbar-top.toolbar-hidden,
2607 .ios .navbar ~ * .toolbar-top-ios.toolbar-hidden,
2608 .md .navbar ~ * .toolbar-top-md.toolbar-hidden,
2609 .aurora .navbar ~ * .toolbar-top-aurora.toolbar-hidden,
2610 .navbar ~ .page:not(.no-navbar) .toolbar-top.toolbar-hidden,
2611 .ios .navbar ~ .page:not(.no-navbar) .toolbar-top-ios.toolbar-hidden,
2612 .md .navbar ~ .page:not(.no-navbar) .toolbar-top-md.toolbar-hidden,
2613 .aurora .navbar ~ .page:not(.no-navbar) .toolbar-top-aurora.toolbar-hidden {
2614   transform: translate3d(0, calc(-1 * (var(--f7-navbar-height) + var(--f7-toolbar-height))), 0);
2615 }
2616 .navbar ~ .toolbar-top.toolbar-hidden.tabbar-labels,
2617 .ios .navbar ~ .toolbar-top-ios.toolbar-hidden.tabbar-labels,
2618 .md .navbar ~ .toolbar-top-md.toolbar-hidden.tabbar-labels,
2619 .aurora .navbar ~ .toolbar-top-aurora.toolbar-hidden.tabbar-labels,
2620 .navbar ~ * .toolbar-top.toolbar-hidden.tabbar-labels,
2621 .ios .navbar ~ * .toolbar-top-ios.toolbar-hidden.tabbar-labels,
2622 .md .navbar ~ * .toolbar-top-md.toolbar-hidden.tabbar-labels,
2623 .aurora .navbar ~ * .toolbar-top-aurora.toolbar-hidden.tabbar-labels,
2624 .navbar ~ .page:not(.no-navbar) .toolbar-top.toolbar-hidden.tabbar-labels,
2625 .ios .navbar ~ .page:not(.no-navbar) .toolbar-top-ios.toolbar-hidden.tabbar-labels,
2626 .md .navbar ~ .page:not(.no-navbar) .toolbar-top-md.toolbar-hidden.tabbar-labels,
2627 .aurora .navbar ~ .page:not(.no-navbar) .toolbar-top-aurora.toolbar-hidden.tabbar-labels {
2628   transform: translate3d(0, calc(-1 * (var(--f7-navbar-height) + var(--f7-tabbar-labels-height))), 0);
2629 }
2630 .navbar-hidden + .toolbar-top:not(.toolbar-hidden),
2631 .ios .navbar-hidden + .toolbar-top-ios:not(.toolbar-hidden),
2632 .md .navbar-hidden + .toolbar-top-md:not(.toolbar-hidden),
2633 .aurora .navbar-hidden + .toolbar-top-aurora:not(.toolbar-hidden),
2634 .navbar-hidden ~ * .toolbar-top:not(.toolbar-hidden),
2635 .ios .navbar-hidden ~ * .toolbar-top-ios:not(.toolbar-hidden),
2636 .md .navbar-hidden ~ * .toolbar-top-md:not(.toolbar-hidden),
2637 .aurora .navbar-hidden ~ * .toolbar-top-aurora:not(.toolbar-hidden) {
2638   transform: translate3d(0, calc(-1 * var(--f7-navbar-height)), 0);
2639 }
2640 .navbar-large-hidden + .toolbar-top:not(.toolbar-hidden),
2641 .ios .navbar-large-hidden + .toolbar-top-ios:not(.toolbar-hidden),
2642 .md .navbar-large-hidden + .toolbar-top-md:not(.toolbar-hidden),
2643 .navbar-large-hidden ~ * .toolbar-top:not(.toolbar-hidden),
2644 .ios .navbar-large-hidden ~ * .toolbar-top-ios:not(.toolbar-hidden),
2645 .md .navbar-large-hidden ~ * .toolbar-top-md:not(.toolbar-hidden),
2646 .aurora .navbar-large-hidden ~ * .toolbar-top-aurora:not(.toolbar-hidden) {
2647   transform: translate3d(0, calc(-1 * (var(--f7-navbar-height) + var(--f7-navbar-large-title-height))), 0);
2648 }
2649 .ios .toolbar a.icon-only {
2650   min-height: var(--f7-toolbar-height);
2651   display: flex;
2652   justify-content: center;
2653   align-items: center;
2654   margin: 0;
2655   min-width: 44px;
2656 }
2657 .ios .tabbar-labels a.tab-link,
2658 .ios .tabbar-labels a.link {
2659   padding-top: 4px;
2660   padding-bottom: 4px;
2661 }
2662 .ios .tabbar-labels a.tab-link i + span,
2663 .ios .tabbar-labels a.link i + span {
2664   margin: 0;
2665 }
2666 @media (min-width: 768px) {
2667   .ios .tabbar .toolbar-inner,
2668   .ios .tabbar-labels .toolbar-inner {
2669     justify-content: center;
2670   }
2671   .ios .tabbar a.tab-link,
2672   .ios .tabbar-labels a.tab-link,
2673   .ios .tabbar a.link,
2674   .ios .tabbar-labels a.link {
2675     width: auto;
2676     min-width: 105px;
2677   }
2678 }
2679 .ios .tabbar-scrollable .toolbar-inner {
2680   justify-content: flex-start;
2681 }
2682 .ios .tabbar-scrollable a.tab-link,
2683 .ios .tabbar-scrollable a.link {
2684   padding: 0 8px;
2685 }
2686 .md .toolbar a.link {
2687   justify-content: center;
2688   padding: 0 16px;
2689   min-width: 48px;
2690 }
2691 .md .toolbar a.link:before {
2692   content: '';
2693   width: 152%;
2694   height: 152%;
2695   position: absolute;
2696   left: -26%;
2697   top: -26%;
2698   background-image: radial-gradient(circle at center, var(--f7-link-highlight-color) 66%, rgba(255, 255, 255, 0) 66%);
2699   background-repeat: no-repeat;
2700   background-position: center;
2701   background-size: 100% 100%;
2702   opacity: 0;
2703   pointer-events: none;
2704   transition-duration: 600ms;
2705 }
2706 .md .toolbar a.link.active-state:before {
2707   opacity: 1;
2708   transition-duration: 150ms;
2709 }
2710 .md .toolbar a.icon-only {
2711   min-width: 0;
2712   flex-shrink: 0;
2713 }
2714 .md .tabbar a.tab-link,
2715 .md .tabbar-labels a.tab-link,
2716 .md .tabbar a.link,
2717 .md .tabbar-labels a.link {
2718   padding-left: 0;
2719   padding-right: 0;
2720 }
2721 .md .tabbar a.icon-only,
2722 .md .tabbar-labels a.icon-only {
2723   flex-shrink: initial;
2724 }
2725 .md .tabbar a.tab-link,
2726 .md .tabbar-labels a.tab-link {
2727   transition-duration: 300ms;
2728   overflow: hidden;
2729   position: relative;
2730 }
2731 .md .tabbar .tab-link-highlight,
2732 .md .tabbar-labels .tab-link-highlight {
2733   position: absolute;
2734   height: 2px;
2735   background: var(--f7-tabbar-link-active-border-color, var(--f7-theme-color));
2736   transition-duration: 300ms;
2737   left: 0;
2738 }
2739 .md .tabbar-labels a.tab-link,
2740 .md .tabbar-labels a.link {
2741   padding-top: 7px;
2742   padding-bottom: 7px;
2743 }
2744 .md .tabbar-label {
2745   max-width: 100%;
2746   overflow: hidden;
2747   line-height: 1.2;
2748 }
2749 .md .tabbar-scrollable .toolbar-inner {
2750   overflow: auto;
2751 }
2752 .md .tabbar-scrollable a.tab-link,
2753 .md .tabbar-scrollable a.link {
2754   padding: 0 16px;
2755 }
2756 .aurora .toolbar a.icon-only {
2757   min-height: var(--f7-toolbar-height);
2758   display: flex;
2759   justify-content: center;
2760   align-items: center;
2761   margin: 0;
2762 }
2763 .aurora .tabbar .toolbar-inner,
2764 .aurora .tabbar-labels .toolbar-inner {
2765   padding-left: 0;
2766   padding-right: 0;
2767 }
2768 .aurora .tabbar a.tab-link,
2769 .aurora .tabbar-labels a.tab-link,
2770 .aurora .tabbar a.link,
2771 .aurora .tabbar-labels a.link {
2772   transition-duration: 200ms;
2773 }
2774 .aurora .tabbar-labels a.tab-link,
2775 .aurora .tabbar-labels a.link {
2776   padding-top: 5px;
2777   padding-bottom: 5px;
2778 }
2779 .aurora .tabbar-labels a.tab-link i + span,
2780 .aurora .tabbar-labels a.link i + span {
2781   margin: 0;
2782 }
2783 .aurora .tabbar-scrollable .toolbar-inner {
2784   justify-content: flex-start;
2785 }
2786 .aurora .tabbar-scrollable a.tab-link,
2787 .aurora .tabbar-scrollable a.link {
2788   padding: 0 15px;
2789 }
2790 /* === Subnavbar === */
2791 :root {
2792   /*
2793   --f7-subnavbar-bg-image: var(--f7-bars-bg-image);
2794   --f7-subnavbar-bg-color: var(--f7-bars-bg-color);
2795   --f7-subnavbar-border-color: var(--f7-bars-border-color);
2796   --f7-subnavbar-link-color: var(--f7-bars-link-color);
2797   --f7-subnavbar-text-color: var(--f7-bars-text-color);
2798   */
2799   --f7-subnavbar-title-line-height: 1.2;
2800 }
2801 .ios {
2802   --f7-subnavbar-height: 44px;
2803   --f7-subnavbar-inner-padding-left: 8px;
2804   --f7-subnavbar-inner-padding-right: 8px;
2805   --f7-subnavbar-title-font-size: 34px;
2806   --f7-subnavbar-title-font-weight: 700;
2807   --f7-subnavbar-title-letter-spacing: -0.03em;
2808   --f7-subnavbar-title-margin-left: 7px;
2809   --f7-subnavbar-shadow-image: none;
2810   /*
2811   --f7-subnavbar-link-height: var(--f7-subnavbar-height);
2812   --f7-subnavbar-link-line-height: var(--f7-subnavbar-height);
2813   */
2814 }
2815 .md {
2816   --f7-subnavbar-height: 48px;
2817   --f7-subnavbar-inner-padding-left: 16px;
2818   --f7-subnavbar-inner-padding-right: 16px;
2819   --f7-subnavbar-title-font-size: 20px;
2820   --f7-subnavbar-title-font-weight: 500;
2821   --f7-subnavbar-title-letter-spacing: 0;
2822   --f7-subnavbar-title-margin-left: 0px;
2823   --f7-subnavbar-shadow-image: var(--f7-bars-shadow-bottom-image);
2824   /*
2825   --f7-subnavbar-link-height: var(--f7-subnavbar-height);
2826   --f7-subnavbar-link-line-height: var(--f7-subnavbar-height);
2827   */
2828 }
2829 .aurora {
2830   --f7-subnavbar-height: 38px;
2831   --f7-subnavbar-inner-padding-left: 15px;
2832   --f7-subnavbar-inner-padding-right: 15px;
2833   --f7-subnavbar-title-font-size: 26px;
2834   --f7-subnavbar-title-font-weight: bold;
2835   --f7-subnavbar-title-letter-spacing: -0.03em;
2836   --f7-subnavbar-title-margin-left: 0px;
2837   --f7-subnavbar-shadow-image: none;
2838   --f7-subnavbar-link-height: auto;
2839   --f7-subnavbar-link-line-height: inherit;
2840 }
2841 .subnavbar {
2842   width: 100%;
2843   position: absolute;
2844   left: 0;
2845   top: 0;
2846   z-index: 500;
2847   box-sizing: border-box;
2848   display: flex;
2849   justify-content: space-between;
2850   align-items: center;
2851   background-image: var(--f7-subnavbar-bg-image, var(--f7-bars-bg-image));
2852   background-color: var(--f7-subnavbar-bg-color, var(--f7-bars-bg-color, var(--f7-theme-color)));
2853   color: var(--f7-subnavbar-text-color, var(--f7-bars-text-color));
2854 }
2855 .subnavbar .title {
2856   position: relative;
2857   overflow: hidden;
2858   text-overflow: ellpsis;
2859   white-space: nowrap;
2860   font-size: var(--f7-subnavbar-title-font-size);
2861   font-weight: var(--f7-subnavbar-title-font-weight);
2862   text-align: left;
2863   display: inline-block;
2864   line-height: var(--f7-subnavbar-title-line-height);
2865   letter-spacing: var(--f7-subnavbar-title-letter-spacing);
2866   margin-left: var(--f7-subnavbar-title-margin-left);
2867 }
2868 .subnavbar .left,
2869 .subnavbar .right {
2870   flex-shrink: 0;
2871   display: flex;
2872   justify-content: flex-start;
2873   align-items: center;
2874 }
2875 .subnavbar .right:first-child {
2876   position: absolute;
2877   height: 100%;
2878 }
2879 .subnavbar a {
2880   color: var(--f7-subnavbar-link-color, var(--f7-bars-link-color, var(--f7-theme-color)));
2881 }
2882 .subnavbar a.link {
2883   line-height: var(--f7-subnavbar-link-line-height, var(--f7-subnavbar-height));
2884   height: var(--f7-subnavbar-link-height, var(--f7-subnavbar-height));
2885 }
2886 .subnavbar a.icon-only {
2887   min-width: var(--f7-subnavbar-height);
2888 }
2889 .subnavbar.no-hairline:after,
2890 .subnavbar.no-border:after {
2891   display: none !important;
2892 }
2893 .subnavbar.no-shadow:before,
2894 .subnavbar.navbar-hidden:before {
2895   display: none !important;
2896 }
2897 .subnavbar:after,
2898 .subnavbar:before {
2899   -webkit-backface-visibility: hidden;
2900           backface-visibility: hidden;
2901 }
2902 .subnavbar:after {
2903   content: '';
2904   position: absolute;
2905   background-color: var(--f7-subnavbar-border-color, var(--f7-bars-border-color));
2906   display: block;
2907   z-index: 15;
2908   top: auto;
2909   right: auto;
2910   bottom: 0;
2911   left: 0;
2912   height: 1px;
2913   width: 100%;
2914   transform-origin: 50% 100%;
2915   transform: scaleY(calc(1 / var(--f7-device-pixel-ratio)));
2916 }
2917 .subnavbar:before {
2918   content: '';
2919   position: absolute;
2920   right: 0;
2921   width: 100%;
2922   top: 100%;
2923   bottom: auto;
2924   height: 8px;
2925   pointer-events: none;
2926   background: var(--f7-subnavbar-shadow-image);
2927 }
2928 .subnavbar-inner {
2929   width: 100%;
2930   height: 100%;
2931   display: flex;
2932   align-items: center;
2933   box-sizing: border-box;
2934   justify-content: space-between;
2935   overflow: hidden;
2936   padding: 0 calc(var(--f7-subnavbar-inner-padding-left) + var(--f7-safe-area-right)) 0 calc(var(--f7-subnavbar-inner-padding-right) + var(--f7-safe-area-left));
2937 }
2938 .subnavbar-inner.stacked {
2939   display: none;
2940 }
2941 .navbar .subnavbar {
2942   top: 100%;
2943 }
2944 .views > .subnavbar,
2945 .view > .subnavbar,
2946 .page > .subnavbar {
2947   position: absolute;
2948 }
2949 .navbar ~ * .subnavbar,
2950 .page-with-subnavbar .navbar ~ .subnavbar,
2951 .page-with-subnavbar .navbar ~ * .subnavbar,
2952 .navbar ~ .page-with-subnavbar:not(.no-navbar) .subnavbar,
2953 .navbar ~ .subnavbar {
2954   top: var(--f7-navbar-height);
2955 }
2956 .navbar ~ .page-with-navbar-large:not(.no-navbar) .subnavbar,
2957 .page-with-subnavbar.page-with-navbar-large .navbar ~ .subnavbar,
2958 .page-with-subnavbar.page-with-navbar-large .navbar ~ * .subnavbar {
2959   top: calc(var(--f7-navbar-height) + var(--f7-navbar-large-title-height));
2960   transform: translate3d(0, calc(-1 * var(--f7-navbar-large-collapse-progress) * var(--f7-navbar-large-title-height)), 0);
2961 }
2962 .navbar .title-large ~ .subnavbar {
2963   top: calc(var(--f7-navbar-height) + var(--f7-navbar-large-title-height));
2964   transform: translate3d(0, calc(-1 * var(--f7-navbar-large-collapse-progress) * var(--f7-navbar-large-title-height)), 0);
2965 }
2966 .page-with-subnavbar,
2967 .subnavbar ~ * {
2968   --f7-page-subnavbar-offset: var(--f7-subnavbar-height);
2969 }
2970 .ios .subnavbar {
2971   height: calc(var(--f7-subnavbar-height) + 1px);
2972   margin-top: -1px;
2973   padding-top: 1px;
2974 }
2975 .ios .subnavbar .title {
2976   align-self: flex-start;
2977   flex-shrink: 10;
2978 }
2979 .ios .subnavbar .left a + a,
2980 .ios .subnavbar .right a + a {
2981   margin-left: 15px;
2982 }
2983 .ios .subnavbar .left {
2984   margin-right: 10px;
2985 }
2986 .ios .subnavbar .right {
2987   margin-left: 10px;
2988 }
2989 .ios .subnavbar .right:first-child {
2990   right: 8px;
2991 }
2992 .ios .subnavbar a.link {
2993   justify-content: flex-start;
2994 }
2995 .ios .subnavbar a.icon-only {
2996   justify-content: center;
2997   margin: 0;
2998 }
2999 .md .subnavbar {
3000   height: var(--f7-subnavbar-height);
3001 }
3002 .md .subnavbar .right {
3003   margin-left: auto;
3004 }
3005 .md .subnavbar .right:first-child {
3006   right: 16px;
3007 }
3008 .md .subnavbar a.link {
3009   justify-content: center;
3010   padding: 0 16px;
3011 }
3012 .md .subnavbar a.link:before {
3013   content: '';
3014   width: 152%;
3015   height: 152%;
3016   position: absolute;
3017   left: -26%;
3018   top: -26%;
3019   background-image: radial-gradient(circle at center, var(--f7-link-highlight-color) 66%, rgba(255, 255, 255, 0) 66%);
3020   background-repeat: no-repeat;
3021   background-position: center;
3022   background-size: 100% 100%;
3023   opacity: 0;
3024   pointer-events: none;
3025   transition-duration: 600ms;
3026 }
3027 .md .subnavbar a.link.active-state:before {
3028   opacity: 1;
3029   transition-duration: 150ms;
3030 }
3031 .md .subnavbar a.icon-only {
3032   flex-shrink: 0;
3033 }
3034 .md .subnavbar-inner > a.link:first-child {
3035   margin-left: calc(-1 * var(--f7-subnavbar-inner-padding-left));
3036 }
3037 .md .subnavbar-inner > a.link:last-child {
3038   margin-right: calc(-1 * var(--f7-subnavbar-inner-padding-right));
3039 }
3040 .aurora .subnavbar {
3041   height: calc(var(--f7-subnavbar-height) + 1px);
3042   margin-top: -1px;
3043   padding-top: 1px;
3044 }
3045 .aurora .subnavbar .title {
3046   align-self: flex-start;
3047   flex-shrink: 10;
3048 }
3049 .aurora .subnavbar .left a + a,
3050 .aurora .subnavbar .right a + a {
3051   margin-left: 10px;
3052 }
3053 .aurora .subnavbar .left {
3054   margin-right: 10px;
3055 }
3056 .aurora .subnavbar .right {
3057   margin-left: 10px;
3058 }
3059 .aurora .subnavbar .right:first-child {
3060   right: 15px;
3061 }
3062 .aurora .subnavbar a.link {
3063   justify-content: flex-start;
3064 }
3065 .aurora .subnavbar a.icon-only {
3066   justify-content: center;
3067   margin: 0;
3068 }
3069 /* === Content Block === */
3070 :root {
3071   --f7-block-font-size: inherit;
3072   --f7-block-strong-bg-color: #fff;
3073   --f7-block-title-font-size: inherit;
3074   --f7-block-header-margin: 10px;
3075   --f7-block-footer-margin: 10px;
3076   --f7-block-header-font-size: 14px;
3077   --f7-block-footer-font-size: 14px;
3078   --f7-block-title-white-space: nowrap;
3079   --f7-block-title-medium-text-color: #000;
3080   --f7-block-title-medium-text-transform: none;
3081   --f7-block-title-large-text-color: #000;
3082   --f7-block-title-large-text-transform: none;
3083 }
3084 :root .theme-dark,
3085 :root.theme-dark {
3086   --f7-block-strong-border-color: #282829;
3087   --f7-block-title-medium-text-color: #fff;
3088   --f7-block-title-large-text-color: #fff;
3089   --f7-block-strong-bg-color: #1c1c1d;
3090 }
3091 .ios {
3092   --f7-block-text-color: #6d6d72;
3093   --f7-block-padding-horizontal: 15px;
3094   --f7-block-padding-vertical: 15px;
3095   --f7-block-margin-vertical: 35px;
3096   --f7-block-strong-text-color: #000;
3097   --f7-block-strong-border-color: #c8c7cc;
3098   --f7-block-title-text-transform: uppercase;
3099   --f7-block-title-text-color: #6d6d72;
3100   --f7-block-title-font-weight: 400;
3101   --f7-block-title-line-height: 17px;
3102   --f7-block-title-margin-bottom: 10px;
3103   --f7-block-title-medium-font-size: 22px;
3104   --f7-block-title-medium-font-weight: bold;
3105   --f7-block-title-medium-line-height: 1.4;
3106   --f7-block-title-large-font-size: 29px;
3107   --f7-block-title-large-font-weight: bold;
3108   --f7-block-title-large-line-height: 1.3;
3109   --f7-block-inset-side-margin: 15px;
3110   --f7-block-inset-border-radius: 7px;
3111   --f7-block-header-text-color: #8f8f94;
3112   --f7-block-footer-text-color: #8f8f94;
3113 }
3114 .ios .theme-dark,
3115 .ios.theme-dark {
3116   --f7-block-title-text-color: #8E8E93;
3117   --f7-block-header-text-color: #8E8E93;
3118   --f7-block-footer-text-color: #8E8E93;
3119   --f7-block-strong-text-color: #fff;
3120 }
3121 .md {
3122   --f7-block-text-color: inherit;
3123   --f7-block-padding-horizontal: 16px;
3124   --f7-block-padding-vertical: 16px;
3125   --f7-block-margin-vertical: 32px;
3126   --f7-block-strong-text-color: inherit;
3127   --f7-block-strong-border-color: rgba(0, 0, 0, 0.12);
3128   --f7-block-title-text-transform: none;
3129   --f7-block-title-text-color: rgba(0, 0, 0, 0.54);
3130   --f7-block-title-font-weight: 500;
3131   --f7-block-title-line-height: 16px;
3132   --f7-block-title-margin-bottom: 16px;
3133   --f7-block-title-medium-font-size: 24px;
3134   --f7-block-title-medium-font-weight: 500;
3135   --f7-block-title-medium-line-height: 1.3;
3136   --f7-block-title-large-font-size: 34px;
3137   --f7-block-title-large-font-weight: 500;
3138   --f7-block-title-large-line-height: 1.2;
3139   --f7-block-inset-side-margin: 16px;
3140   --f7-block-inset-border-radius: 4px;
3141   --f7-block-header-text-color: rgba(0, 0, 0, 0.54);
3142   --f7-block-footer-text-color: rgba(0, 0, 0, 0.54);
3143 }
3144 .md .theme-dark,
3145 .md.theme-dark {
3146   --f7-block-title-text-color: #fff;
3147   --f7-block-header-text-color: rgba(255, 255, 255, 0.54);
3148   --f7-block-footer-text-color: rgba(255, 255, 255, 0.54);
3149 }
3150 .aurora {
3151   --f7-block-text-color: inherit;
3152   --f7-block-padding-horizontal: 15px;
3153   --f7-block-padding-vertical: 15px;
3154   --f7-block-margin-vertical: 15px;
3155   --f7-block-strong-text-color: inherit;
3156   --f7-block-strong-border-color: rgba(0, 0, 0, 0.12);
3157   --f7-block-title-text-transform: none;
3158   --f7-block-title-text-color: rgba(0, 0, 0, 0.7);
3159   --f7-block-title-font-weight: 600;
3160   --f7-block-title-line-height: 1.5;
3161   --f7-block-title-margin-bottom: 5px;
3162   --f7-block-title-medium-font-size: 20px;
3163   --f7-block-title-medium-font-weight: 600;
3164   --f7-block-title-medium-line-height: 1.4;
3165   --f7-block-title-large-font-size: 28px;
3166   --f7-block-title-large-font-weight: bold;
3167   --f7-block-title-large-line-height: 1.3;
3168   --f7-block-inset-side-margin: 15px;
3169   --f7-block-inset-border-radius: 4px;
3170   --f7-block-header-text-color: rgba(0, 0, 0, 0.6);
3171   --f7-block-footer-text-color: rgba(0, 0, 0, 0.6);
3172 }
3173 .aurora .theme-dark,
3174 .aurora.theme-dark {
3175   --f7-block-title-text-color: #fff;
3176   --f7-block-header-text-color: rgba(255, 255, 255, 0.52);
3177   --f7-block-footer-text-color: rgba(255, 255, 255, 0.52);
3178   --f7-block-strong-text-color: #fff;
3179 }
3180 .block {
3181   box-sizing: border-box;
3182   position: relative;
3183   z-index: 1;
3184   color: var(--f7-block-text-color);
3185   margin: var(--f7-block-margin-vertical) 0;
3186   padding-top: 0;
3187   padding-bottom: 0;
3188   padding-left: calc(var(--f7-block-padding-horizontal) + var(--f7-safe-area-left));
3189   padding-right: calc(var(--f7-block-padding-horizontal) + var(--f7-safe-area-right));
3190   font-size: var(--f7-block-font-size);
3191 }
3192 .block.no-hairlines:before,
3193 .block.no-hairlines ul:before,
3194 .md .block.no-hairlines-md:before,
3195 .md .block.no-hairlines-md ul:before,
3196 .ios .block.no-hairlines-ios:before,
3197 .ios .block.no-hairlines-ios ul:before,
3198 .aurora .block.no-hairlines-aurora:before,
3199 .aurora .block.no-hairlines-aurora ul:before {
3200   display: none !important;
3201 }
3202 .block.no-hairlines:after,
3203 .block.no-hairlines ul:after,
3204 .md .block.no-hairlines-md:after,
3205 .md .block.no-hairlines-md ul:after,
3206 .ios .block.no-hairlines-ios:after,
3207 .ios .block.no-hairlines-ios ul:after,
3208 .aurora .block.no-hairlines-aurora:after,
3209 .aurora .block.no-hairlines-aurora ul:after {
3210   display: none !important;
3211 }
3212 .block.no-hairline-top:before,
3213 .block.no-hairline-top ul:before,
3214 .md .block.no-hairline-top-md:before,
3215 .md .block.no-hairline-top-md ul:before,
3216 .ios .block.no-hairline-top-ios:before,
3217 .ios .block.no-hairline-top-ios ul:before,
3218 .aurora .block.no-hairline-top-aurora:before,
3219 .aurora .block.no-hairline-top-aurora ul:before {
3220   display: none !important;
3221 }
3222 .block.no-hairline-bottom:after,
3223 .block.no-hairline-bottom ul:after,
3224 .md .block.no-hairline-bottom-md:after,
3225 .md .block.no-hairline-bottom-md ul:after,
3226 .ios .block.no-hairline-bottom-ios:after,
3227 .ios .block.no-hairline-bottom-ios ul:after,
3228 .aurora .block.no-hairline-bottom-aurora:after,
3229 .aurora .block.no-hairline-bottom-aurora ul:after {
3230   display: none !important;
3231 }
3232 .block > h1:first-child,
3233 .block > h2:first-child,
3234 .block > h3:first-child,
3235 .block > h4:first-child,
3236 .block > p:first-child {
3237   margin-top: 0;
3238 }
3239 .block > h1:last-child,
3240 .block > h2:last-child,
3241 .block > h3:last-child,
3242 .block > h4:last-child,
3243 .block > p:last-child {
3244   margin-bottom: 0;
3245 }
3246 .block-strong {
3247   color: var(--f7-block-strong-text-color);
3248   padding-top: var(--f7-block-padding-vertical);
3249   padding-bottom: var(--f7-block-padding-vertical);
3250   background-color: var(--f7-block-strong-bg-color);
3251 }
3252 .block-strong:before {
3253   content: '';
3254   position: absolute;
3255   background-color: var(--f7-block-strong-border-color);
3256   display: block;
3257   z-index: 15;
3258   top: 0;
3259   right: auto;
3260   bottom: auto;
3261   left: 0;
3262   height: 1px;
3263   width: 100%;
3264   transform-origin: 50% 0%;
3265   transform: scaleY(calc(1 / var(--f7-device-pixel-ratio)));
3266 }
3267 .block-strong:after {
3268   content: '';
3269   position: absolute;
3270   background-color: var(--f7-block-strong-border-color);
3271   display: block;
3272   z-index: 15;
3273   top: auto;
3274   right: auto;
3275   bottom: 0;
3276   left: 0;
3277   height: 1px;
3278   width: 100%;
3279   transform-origin: 50% 100%;
3280   transform: scaleY(calc(1 / var(--f7-device-pixel-ratio)));
3281 }
3282 .block-title {
3283   position: relative;
3284   overflow: hidden;
3285   margin: 0;
3286   white-space: var(--f7-block-title-white-space);
3287   text-overflow: ellipsis;
3288   text-transform: var(--f7-block-title-text-transform);
3289   color: var(--f7-block-title-text-color);
3290   font-size: var(--f7-block-title-font-size, inherit);
3291   font-weight: var(--f7-block-title-font-weight);
3292   line-height: var(--f7-block-title-line-height);
3293   margin-top: var(--f7-block-margin-vertical);
3294   margin-bottom: var(--f7-block-title-margin-bottom);
3295   margin-left: calc(var(--f7-block-padding-horizontal) + var(--f7-safe-area-left));
3296   margin-right: calc(var(--f7-block-padding-horizontal) + var(--f7-safe-area-right));
3297 }
3298 .block-title + .list,
3299 .block-title + .block,
3300 .block-title + .card,
3301 .block-title + .timeline,
3302 .block-title + .block-header {
3303   margin-top: 0px;
3304 }
3305 .block-title-medium {
3306   font-size: var(--f7-block-title-medium-font-size);
3307   text-transform: var(--f7-block-title-medium-text-transform);
3308   color: var(--f7-block-title-medium-text-color);
3309   font-weight: var(--f7-block-title-medium-font-weight);
3310   line-height: var(--f7-block-title-medium-line-height);
3311 }
3312 .block-title-large {
3313   font-size: var(--f7-block-title-large-font-size);
3314   text-transform: var(--f7-block-title-large-text-transform);
3315   color: var(--f7-block-title-large-text-color);
3316   font-weight: var(--f7-block-title-large-font-weight);
3317   line-height: var(--f7-block-title-large-line-height);
3318 }
3319 .block > .block-title:first-child,
3320 .list > .block-title:first-child {
3321   margin-top: 0;
3322   margin-left: 0;
3323   margin-right: 0;
3324 }
3325 .block-header {
3326   color: var(--f7-block-header-text-color);
3327   font-size: var(--f7-block-header-font-size);
3328   margin-bottom: var(--f7-block-header-margin);
3329   margin-top: var(--f7-block-margin-vertical);
3330 }
3331 .block-header + .list,
3332 .block-header + .block,
3333 .block-header + .card,
3334 .block-header + .timeline {
3335   margin-top: var(--f7-block-header-margin);
3336 }
3337 .block-footer {
3338   color: var(--f7-block-footer-text-color);
3339   font-size: var(--f7-block-footer-font-size);
3340   margin-top: var(--f7-block-footer-margin);
3341   margin-bottom: var(--f7-block-margin-vertical);
3342 }
3343 .block-footer,
3344 .block-header {
3345   padding-top: 0;
3346   padding-bottom: 0;
3347   padding-left: calc(var(--f7-block-padding-horizontal) + var(--f7-safe-area-left));
3348   padding-right: calc(var(--f7-block-padding-horizontal) + var(--f7-safe-area-right));
3349 }
3350 .block-footer ul:first-child,
3351 .block-header ul:first-child,
3352 .block-footer p:first-child,
3353 .block-header p:first-child,
3354 .block-footer h1:first-child,
3355 .block-header h1:first-child,
3356 .block-footer h2:first-child,
3357 .block-header h2:first-child,
3358 .block-footer h3:first-child,
3359 .block-header h3:first-child,
3360 .block-footer h4:first-child,
3361 .block-header h4:first-child {
3362   margin-top: 0;
3363 }
3364 .block-footer ul:last-child,
3365 .block-header ul:last-child,
3366 .block-footer p:last-child,
3367 .block-header p:last-child,
3368 .block-footer h1:last-child,
3369 .block-header h1:last-child,
3370 .block-footer h2:last-child,
3371 .block-header h2:last-child,
3372 .block-footer h3:last-child,
3373 .block-header h3:last-child,
3374 .block-footer h4:last-child,
3375 .block-header h4:last-child {
3376   margin-bottom: 0;
3377 }
3378 .block-footer ul:first-child:last-child,
3379 .block-header ul:first-child:last-child,
3380 .block-footer p:first-child:last-child,
3381 .block-header p:first-child:last-child,
3382 .block-footer h1:first-child:last-child,
3383 .block-header h1:first-child:last-child,
3384 .block-footer h2:first-child:last-child,
3385 .block-header h2:first-child:last-child,
3386 .block-footer h3:first-child:last-child,
3387 .block-header h3:first-child:last-child,
3388 .block-footer h4:first-child:last-child,
3389 .block-header h4:first-child:last-child {
3390   margin-top: 0;
3391   margin-bottom: 0;
3392 }
3393 .list .block-header,
3394 .block .block-header,
3395 .card .block-header,
3396 .timeline .block-header {
3397   margin-top: 0;
3398 }
3399 .list .block-footer,
3400 .block .block-footer,
3401 .card .block-footer,
3402 .timeline .block-footer {
3403   margin-bottom: 0;
3404 }
3405 .list + .block-footer,
3406 .block + .block-footer,
3407 .card + .block-footer,
3408 .timeline + .block-footer {
3409   margin-top: calc(-1 * (var(--f7-block-margin-vertical) - var(--f7-block-footer-margin)));
3410 }
3411 .block + .block-footer {
3412   margin-top: calc(-1 * (var(--f7-block-margin-vertical) - var(--f7-block-footer-margin)));
3413   margin-bottom: var(--f7-block-margin-vertical);
3414 }
3415 .block .block-header,
3416 .block .block-footer {
3417   padding: 0;
3418 }
3419 .block.inset {
3420   border-radius: var(--f7-block-inset-border-radius);
3421   margin-left: calc(var(--f7-block-inset-side-margin) + var(--f7-safe-area-outer-left));
3422   margin-right: calc(var(--f7-block-inset-side-margin) + var(--f7-safe-area-outer-right));
3423   --f7-safe-area-left: 0px;
3424   --f7-safe-area-right: 0px;
3425 }
3426 .block-strong.inset:before {
3427   display: none !important;
3428 }
3429 .block-strong.inset:after {
3430   display: none !important;
3431 }
3432 @media (min-width: 768px) {
3433   .block.tablet-inset {
3434     border-radius: var(--f7-block-inset-border-radius);
3435     margin-left: calc(var(--f7-block-inset-side-margin) + var(--f7-safe-area-outer-left));
3436     margin-right: calc(var(--f7-block-inset-side-margin) + var(--f7-safe-area-outer-right));
3437     --f7-safe-area-left: 0px;
3438     --f7-safe-area-right: 0px;
3439   }
3440   .block-strong.tablet-inset:before {
3441     display: none !important;
3442   }
3443   .block-strong.tablet-inset:after {
3444     display: none !important;
3445   }
3446 }
3447 /* === List View === */
3448 :root {
3449   --f7-list-bg-color: #fff;
3450   --f7-list-item-text-max-lines: 2;
3451   --f7-list-chevron-icon-color: #c7c7cc;
3452   --f7-list-chevron-icon-font-size: 20px;
3453   --f7-list-item-title-font-size: inherit;
3454   --f7-list-item-title-font-weight: 400;
3455   --f7-list-item-title-text-color: inherit;
3456   --f7-list-item-title-line-height: inherit;
3457   --f7-list-item-title-white-space: nowrap;
3458   --f7-list-item-subtitle-font-weight: 400;
3459   --f7-list-item-subtitle-text-color: inherit;
3460   --f7-list-item-subtitle-line-height: inherit;
3461   --f7-list-item-text-font-weight: 400;
3462   --f7-list-item-after-font-weight: 400;
3463   --f7-list-item-header-text-color: inherit;
3464   --f7-list-item-header-font-size: 12px;
3465   --f7-list-item-header-font-weight: 400;
3466   --f7-list-item-header-line-height: 1.2;
3467   --f7-list-item-footer-font-size: 12px;
3468   --f7-list-item-footer-font-weight: 400;
3469   --f7-list-item-footer-line-height: 1.2;
3470   --f7-list-button-font-size: inherit;
3471   --f7-list-button-font-weight: 400;
3472   --f7-list-item-divider-line-height: inherit;
3473   --f7-list-group-title-line-height: inherit;
3474 }
3475 :root .theme-dark,
3476 :root.theme-dark {
3477   --f7-list-bg-color: #1c1c1d;
3478   --f7-list-border-color: #282829;
3479   --f7-list-item-border-color: #282829;
3480   --f7-list-item-divider-border-color: #282829;
3481   --f7-list-item-divider-bg-color: #232323;
3482   --f7-list-group-title-bg-color: #232323;
3483   --f7-list-chevron-icon-color: #434345;
3484 }
3485 .ios {
3486   --f7-list-in-list-padding-left: 30px;
3487   --f7-list-inset-side-margin: 15px;
3488   --f7-list-inset-border-radius: 7px;
3489   --f7-list-margin-vertical: 35px;
3490   --f7-list-font-size: 17px;
3491   --f7-list-chevron-icon-area: 20px;
3492   --f7-list-border-color: #c8c7cc;
3493   --f7-list-item-border-color: #c8c7cc;
3494   --f7-list-link-pressed-bg-color: #d9d9d9;
3495   --f7-list-item-subtitle-font-size: 15px;
3496   --f7-list-item-text-font-size: 15px;
3497   --f7-list-item-text-text-color: #8e8e93;
3498   --f7-list-item-text-line-height: 21px;
3499   --f7-list-item-after-font-size: inherit;
3500   --f7-list-item-after-text-color: #8e8e93;
3501   --f7-list-item-after-line-height: inherit;
3502   --f7-list-item-after-padding: 5px;
3503   --f7-list-item-footer-text-color: #8e8e93;
3504   --f7-list-item-min-height: 44px;
3505   --f7-list-item-media-margin: 15px;
3506   --f7-list-item-media-icons-margin: 5px;
3507   --f7-list-item-cell-margin: 15px;
3508   --f7-list-item-padding-vertical: 8px;
3509   --f7-list-item-padding-horizontal: 15px;
3510   --f7-list-media-item-padding-vertical: 10px;
3511   --f7-list-media-item-padding-horizontal: 15px;
3512   --f7-list-media-item-title-font-weight: 600;
3513   /*
3514   --f7-list-button-text-color: var(--f7-theme-color);
3515   */
3516   --f7-list-button-text-align: center;
3517   --f7-list-button-border-color: #c8c7cc;
3518   --f7-list-button-pressed-bg-color: #d9d9d9;
3519   --f7-list-item-divider-height: 31px;
3520   --f7-list-item-divider-text-color: #8e8e93;
3521   --f7-list-item-divider-font-size: inherit;
3522   --f7-list-item-divider-font-weight: 400;
3523   --f7-list-item-divider-bg-color: #f7f7f7;
3524   --f7-list-item-divider-border-color: #c8c7cc;
3525   --f7-list-group-title-height: 31px;
3526   --f7-list-group-title-text-color: #8e8e93;
3527   --f7-list-group-title-font-size: inherit;
3528   --f7-list-group-title-font-weight: 400;
3529   --f7-list-group-title-bg-color: #f7f7f7;
3530 }
3531 .ios .theme-dark,
3532 .ios.theme-dark {
3533   --f7-list-button-border-color: #282829;
3534   --f7-list-link-pressed-bg-color: #363636;
3535   --f7-list-button-pressed-bg-color: #363636;
3536 }
3537 .md {
3538   --f7-list-in-list-padding-left: 40px;
3539   --f7-list-inset-side-margin: 16px;
3540   --f7-list-inset-border-radius: 4px;
3541   --f7-list-margin-vertical: 32px;
3542   --f7-list-font-size: 16px;
3543   --f7-list-chevron-icon-area: 26px;
3544   --f7-list-border-color: rgba(0, 0, 0, 0.12);
3545   --f7-list-item-border-color: rgba(0, 0, 0, 0.12);
3546   --f7-list-link-pressed-bg-color: rgba(0, 0, 0, 0.1);
3547   --f7-list-item-subtitle-font-size: 14px;
3548   --f7-list-item-text-font-size: 14px;
3549   --f7-list-item-text-text-color: #757575;
3550   --f7-list-item-text-line-height: 20px;
3551   --f7-list-item-after-font-size: 14px;
3552   --f7-list-item-after-text-color: #757575;
3553   --f7-list-item-after-line-height: inherit;
3554   --f7-list-item-after-padding: 8px;
3555   --f7-list-item-footer-text-color: rgba(0, 0, 0, 0.5);
3556   --f7-list-item-min-height: 48px;
3557   --f7-list-item-media-margin: 16px;
3558   --f7-list-item-media-icons-margin: 8px;
3559   --f7-list-item-cell-margin: 16px;
3560   --f7-list-item-padding-vertical: 8px;
3561   --f7-list-item-padding-horizontal: 16px;
3562   --f7-list-media-item-padding-vertical: 14px;
3563   --f7-list-media-item-padding-horizontal: 16px;
3564   /*
3565   --f7-list-media-item-title-font-weight: var(--f7-list-item-title-font-weight);
3566   */
3567   --f7-list-button-text-color: #212121;
3568   --f7-list-button-text-align: left;
3569   --f7-list-button-border-color: transparent;
3570   --f7-list-button-pressed-bg-color: rgba(0, 0, 0, 0.1);
3571   --f7-list-item-divider-height: 48px;
3572   --f7-list-item-divider-text-color: rgba(0, 0, 0, 0.54);
3573   --f7-list-item-divider-font-size: 14px;
3574   --f7-list-item-divider-font-weight: 400;
3575   --f7-list-item-divider-bg-color: #f4f4f4;
3576   --f7-list-item-divider-border-color: transparent;
3577   --f7-list-group-title-height: 48px;
3578   --f7-list-group-title-text-color: rgba(0, 0, 0, 0.54);
3579   --f7-list-group-title-font-size: 14px;
3580   --f7-list-group-title-font-weight: 400;
3581   --f7-list-group-title-bg-color: #f4f4f4;
3582 }
3583 .md .theme-dark,
3584 .md.theme-dark {
3585   --f7-list-button-text-color: #fff;
3586   --f7-list-item-divider-text-color: #fff;
3587   --f7-list-group-title-text-color: #fff;
3588   --f7-list-link-pressed-bg-color: rgba(255, 255, 255, 0.05);
3589   --f7-list-button-pressed-bg-color: rgba(255, 255, 255, 0.05);
3590   --f7-list-item-text-text-color: rgba(255, 255, 255, 0.54);
3591   --f7-list-item-after-text-color: rgba(255, 255, 255, 0.54);
3592   --f7-list-item-footer-text-color: rgba(255, 255, 255, 0.54);
3593 }
3594 .aurora {
3595   --f7-list-in-list-padding-left: 15px;
3596   --f7-list-inset-side-margin: 15px;
3597   --f7-list-inset-border-radius: 4px;
3598   --f7-list-margin-vertical: 15px;
3599   --f7-list-font-size: 14px;
3600   --f7-list-chevron-icon-area: 15px;
3601   --f7-list-chevron-icon-font-size: 16px;
3602   --f7-list-border-color: rgba(0, 0, 0, 0.12);
3603   --f7-list-item-border-color: rgba(0, 0, 0, 0.12);
3604   --f7-list-link-pressed-bg-color: rgba(0, 0, 0, 0.1);
3605   --f7-list-link-hover-bg-color: rgba(0, 0, 0, 0.03);
3606   --f7-list-item-title-line-height: 1.3;
3607   --f7-list-item-subtitle-font-size: 14px;
3608   --f7-list-item-subtitle-line-height: 1.3;
3609   --f7-list-item-text-font-size: 12px;
3610   --f7-list-item-text-text-color: rgba(0, 0, 0, 0.6);
3611   --f7-list-item-text-line-height: 16px;
3612   --f7-list-item-after-font-size: 13px;
3613   --f7-list-item-after-text-color: rgba(0, 0, 0, 0.5);
3614   --f7-list-item-after-line-height: 1.2;
3615   --f7-list-item-after-padding: 5px;
3616   --f7-list-item-footer-text-color: rgba(0, 0, 0, 0.6);
3617   --f7-list-item-min-height: 32px;
3618   --f7-list-item-media-margin: 10px;
3619   --f7-list-item-media-icons-margin: 5px;
3620   --f7-list-item-cell-margin: 15px;
3621   --f7-list-item-padding-vertical: 5px;
3622   --f7-list-item-padding-horizontal: 15px;
3623   --f7-list-media-item-padding-vertical: 5px;
3624   --f7-list-media-item-padding-horizontal: 15px;
3625   --f7-list-media-item-title-font-weight: 600;
3626   /*
3627   --f7-list-button-text-color: var(--f7-theme-color);
3628   */
3629   --f7-list-button-text-align: center;
3630   --f7-list-button-border-color: rgba(0, 0, 0, 0.12);
3631   --f7-list-button-pressed-bg-color: rgba(0, 0, 0, 0.1);
3632   --f7-list-button-hover-bg-color: rgba(0, 0, 0, 0.03);
3633   --f7-list-item-divider-height: 19px;
3634   --f7-list-item-divider-text-color: rgba(0, 0, 0, 0.6);
3635   --f7-list-item-divider-font-size: inherit;
3636   --f7-list-item-divider-font-weight: 500;
3637   --f7-list-item-divider-bg-color: #f7f7f7;
3638   --f7-list-item-divider-border-color: transparent;
3639   --f7-list-group-title-height: 19px;
3640   --f7-list-group-title-text-color: rgba(0, 0, 0, 0.6);
3641   --f7-list-group-title-font-size: inherit;
3642   --f7-list-group-title-font-weight: 500;
3643   --f7-list-group-title-bg-color: #f7f7f7;
3644 }
3645 .aurora .theme-dark,
3646 .aurora.theme-dark {
3647   --f7-list-button-border-color: #282829;
3648   --f7-list-item-text-text-color: rgba(255, 255, 255, 0.52);
3649   --f7-list-item-after-text-color: rgba(255, 255, 255, 0.52);
3650   --f7-list-item-footer-text-color: rgba(255, 255, 255, 0.52);
3651   --f7-list-item-divider-text-color: rgba(255, 255, 255, 0.6);
3652   --f7-list-group-title-text-color: rgba(255, 255, 255, 0.6);
3653   --f7-list-link-pressed-bg-color: rgba(255, 255, 255, 0.05);
3654   --f7-list-link-hover-bg-color: rgba(255, 255, 255, 0.03);
3655   --f7-list-button-pressed-bg-color: rgba(255, 255, 255, 0.05);
3656   --f7-list-button-hover-bg-color: rgba(255, 255, 255, 0.03);
3657 }
3658 .list {
3659   position: relative;
3660   z-index: 1;
3661   font-size: var(--f7-list-font-size);
3662   margin: var(--f7-list-margin-vertical) 0;
3663 }
3664 .list ul {
3665   list-style: none;
3666   margin: 0;
3667   padding: 0;
3668   position: relative;
3669   background: var(--f7-list-bg-color);
3670 }
3671 .list ul:before {
3672   content: '';
3673   position: absolute;
3674   background-color: var(--f7-list-border-color);
3675   display: block;
3676   z-index: 15;
3677   top: 0;
3678   right: auto;
3679   bottom: auto;
3680   left: 0;
3681   height: 1px;
3682   width: 100%;
3683   transform-origin: 50% 0%;
3684   transform: scaleY(calc(1 / var(--f7-device-pixel-ratio)));
3685 }
3686 .list ul:after {
3687   content: '';
3688   position: absolute;
3689   background-color: var(--f7-list-border-color);
3690   display: block;
3691   z-index: 15;
3692   top: auto;
3693   right: auto;
3694   bottom: 0;
3695   left: 0;
3696   height: 1px;
3697   width: 100%;
3698   transform-origin: 50% 100%;
3699   transform: scaleY(calc(1 / var(--f7-device-pixel-ratio)));
3700 }
3701 .list ul ul {
3702   padding-left: calc(var(--f7-list-item-padding-horizontal) + var(--f7-list-in-list-padding-left));
3703 }
3704 .list ul ul:before {
3705   display: none !important;
3706 }
3707 .list ul ul:after {
3708   display: none !important;
3709 }
3710 .list li {
3711   position: relative;
3712   box-sizing: border-box;
3713 }
3714 .list .item-media {
3715   display: flex;
3716   flex-shrink: 0;
3717   flex-wrap: nowrap;
3718   align-items: center;
3719   box-sizing: border-box;
3720   padding-bottom: var(--f7-list-item-padding-vertical);
3721   padding-top: var(--f7-list-item-padding-vertical);
3722 }
3723 .list .item-media + .item-inner {
3724   margin-left: var(--f7-list-item-media-margin);
3725 }
3726 .list .item-media i + i,
3727 .list .item-media i + img {
3728   margin-left: var(--f7-list-item-media-icons-margin);
3729 }
3730 .list .item-after {
3731   padding-left: var(--f7-list-item-after-padding);
3732 }
3733 .list .item-inner {
3734   position: relative;
3735   width: 100%;
3736   min-width: 0;
3737   display: flex;
3738   justify-content: space-between;
3739   box-sizing: border-box;
3740   align-items: center;
3741   align-self: stretch;
3742   padding-top: var(--f7-list-item-padding-vertical);
3743   padding-bottom: var(--f7-list-item-padding-vertical);
3744   min-height: var(--f7-list-item-min-height);
3745   padding-right: calc(var(--f7-list-item-padding-horizontal) + var(--f7-safe-area-right));
3746 }
3747 .list .item-title {
3748   min-width: 0;
3749   flex-shrink: 1;
3750   white-space: var(--f7-list-item-title-white-space);
3751   position: relative;
3752   overflow: hidden;
3753   text-overflow: ellipsis;
3754   max-width: 100%;
3755   font-size: var(--f7-list-item-title-font-size);
3756   font-weight: var(--f7-list-item-title-font-weight);
3757   color: var(--f7-list-item-title-text-color);
3758   line-height: var(--f7-list-item-title-line-height);
3759 }
3760 .list .item-after {
3761   white-space: nowrap;
3762   flex-shrink: 0;
3763   display: flex;
3764   font-size: var(--f7-list-item-after-font-size);
3765   font-weight: var(--f7-list-item-after-font-weight);
3766   color: var(--f7-list-item-after-text-color);
3767   line-height: var(--f7-list-item-after-line-height);
3768   margin-left: auto;
3769 }
3770 .list .item-header,
3771 .list .item-footer {
3772   white-space: normal;
3773 }
3774 .list .item-header {
3775   color: var(--f7-list-item-header-text-color);
3776   font-size: var(--f7-list-item-header-font-size);
3777   font-weight: var(--f7-list-item-header-font-weight);
3778   line-height: var(--f7-list-item-header-line-height);
3779 }
3780 .list .item-footer {
3781   color: var(--f7-list-item-footer-text-color);
3782   font-size: var(--f7-list-item-footer-font-size);
3783   font-weight: var(--f7-list-item-footer-font-weight);
3784   line-height: var(--f7-list-item-footer-line-height);
3785 }
3786 .list .item-link,
3787 .list .list-button {
3788   transition-duration: 300ms;
3789   transition-property: background-color;
3790   display: block;
3791   position: relative;
3792   overflow: hidden;
3793   z-index: 0;
3794 }
3795 .list .item-link {
3796   color: inherit;
3797 }
3798 .list .item-link.active-state {
3799   background-color: var(--f7-list-link-pressed-bg-color);
3800 }
3801 .list .item-link .item-inner {
3802   padding-right: calc(var(--f7-list-chevron-icon-area) + var(--f7-list-item-padding-horizontal) + var(--f7-safe-area-right));
3803 }
3804 .list .item-content {
3805   display: flex;
3806   justify-content: space-between;
3807   box-sizing: border-box;
3808   align-items: center;
3809   min-height: var(--f7-list-item-min-height);
3810   padding-left: calc(var(--f7-list-item-padding-horizontal) + var(--f7-safe-area-left));
3811 }
3812 .list .item-subtitle {
3813   position: relative;
3814   overflow: hidden;
3815   white-space: nowrap;
3816   max-width: 100%;
3817   text-overflow: ellipsis;
3818   font-size: var(--f7-list-item-subtitle-font-size);
3819   font-weight: var(--f7-list-item-subtitle-font-weight);
3820   color: var(--f7-list-item-subtitle-text-color);
3821   line-height: var(--f7-list-item-subtitle-line-height);
3822 }
3823 .list .item-text {
3824   position: relative;
3825   overflow: hidden;
3826   text-overflow: hidden;
3827   -webkit-line-clamp: var(--f7-list-item-text-max-lines);
3828   display: -webkit-box;
3829   font-size: var(--f7-list-item-text-font-size);
3830   font-weight: var(--f7-list-item-text-font-weight);
3831   color: var(--f7-list-item-text-text-color);
3832   line-height: var(--f7-list-item-text-line-height);
3833   max-height: calc(var(--f7-list-item-text-line-height) * var(--f7-list-item-text-max-lines));
3834 }
3835 .list .item-title-row {
3836   position: relative;
3837   display: flex;
3838   justify-content: space-between;
3839   box-sizing: border-box;
3840 }
3841 .list .item-title-row .item-after {
3842   align-self: center;
3843 }
3844 .list .item-row {
3845   display: flex;
3846   justify-content: space-between;
3847   box-sizing: border-box;
3848 }
3849 .list .item-cell {
3850   display: block;
3851   align-self: center;
3852   box-sizing: border-box;
3853   width: 100%;
3854   min-width: 0;
3855   margin-left: var(--f7-list-item-cell-margin);
3856   flex-shrink: 1;
3857 }
3858 .list .item-cell:first-child {
3859   margin-left: 0;
3860 }
3861 .list .ripple-wave + .item-cell {
3862   margin-left: 0;
3863 }
3864 .list li:last-child .list-button:after {
3865   display: none !important;
3866 }
3867 .list li:last-child > .item-inner:after,
3868 .list li:last-child li:last-child > .item-inner:after,
3869 .list li:last-child > .item-content > .item-inner:after,
3870 .list li:last-child li:last-child > .item-content > .item-inner:after,
3871 .list li:last-child > .swipeout-content > .item-content > .item-inner:after,
3872 .list li:last-child li:last-child > .swipeout-content > .item-content > .item-inner:after,
3873 .list li:last-child > .item-link > .item-content > .item-inner:after,
3874 .list li:last-child li:last-child > .item-link > .item-content > .item-inner:after {
3875   display: none !important;
3876 }
3877 .list li li:last-child .item-inner:after,
3878 .list li:last-child li .item-inner:after {
3879   content: '';
3880   position: absolute;
3881   background-color: var(--f7-list-item-border-color);
3882   display: block;
3883   z-index: 15;
3884   top: auto;
3885   right: auto;
3886   bottom: 0;
3887   left: 0;
3888   height: 1px;
3889   width: 100%;
3890   transform-origin: 50% 100%;
3891   transform: scaleY(calc(1 / var(--f7-device-pixel-ratio)));
3892 }
3893 .list.no-hairlines:before,
3894 .list.no-hairlines ul:before,
3895 .md .list.no-hairlines-md:before,
3896 .md .list.no-hairlines-md ul:before,
3897 .ios .list.no-hairlines-ios:before,
3898 .ios .list.no-hairlines-ios ul:before,
3899 .aurora .list.no-hairlines-aurora:before,
3900 .aurora .list.no-hairlines-aurora ul:before {
3901   display: none !important;
3902 }
3903 .list.no-hairlines:after,
3904 .list.no-hairlines ul:after,
3905 .md .list.no-hairlines-md:after,
3906 .md .list.no-hairlines-md ul:after,
3907 .ios .list.no-hairlines-ios:after,
3908 .ios .list.no-hairlines-ios ul:after,
3909 .aurora .list.no-hairlines-aurora:after,
3910 .aurora .list.no-hairlines-aurora ul:after {
3911   display: none !important;
3912 }
3913 .list.no-hairline-top:before,
3914 .list.no-hairline-top ul:before,
3915 .md .list.no-hairline-top-md:before,
3916 .md .list.no-hairline-top-md ul:before,
3917 .ios .list.no-hairline-top-ios:before,
3918 .ios .list.no-hairline-top-ios ul:before,
3919 .aurora .list.no-hairline-top-aurora:before,
3920 .aurora .list.no-hairline-top-aurora ul:before {
3921   display: none !important;
3922 }
3923 .list.no-hairline-bottom:after,
3924 .list.no-hairline-bottom ul:after,
3925 .md .list.no-hairline-bottom-md:after,
3926 .md .list.no-hairline-bottom-md ul:after,
3927 .ios .list.no-hairline-bottom-ios:after,
3928 .ios .list.no-hairline-bottom-ios ul:after,
3929 .aurora .list.no-hairline-bottom-aurora:after,
3930 .aurora .list.no-hairline-bottom-aurora ul:after {
3931   display: none !important;
3932 }
3933 .list.no-hairlines-between .item-inner:after,
3934 .md .list.no-hairlines-between-md .item-inner:after,
3935 .ios .list.no-hairlines-between-ios .item-inner:after,
3936 .aurora .list.no-hairlines-between-aurora .item-inner:after,
3937 .list.no-hairlines-between .list-button:after,
3938 .md .list.no-hairlines-between-md .list-button:after,
3939 .ios .list.no-hairlines-between-ios .list-button:after,
3940 .aurora .list.no-hairlines-between-aurora .list-button:after,
3941 .list.no-hairlines-between .item-divider:after,
3942 .md .list.no-hairlines-between-md .item-divider:after,
3943 .ios .list.no-hairlines-between-ios .item-divider:after,
3944 .aurora .list.no-hairlines-between-aurora .item-divider:after,
3945 .list.no-hairlines-between .list-group-title:after,
3946 .md .list.no-hairlines-between-md .list-group-title:after,
3947 .ios .list.no-hairlines-between-ios .list-group-title:after,
3948 .aurora .list.no-hairlines-between-aurora .list-group-title:after,
3949 .list.no-hairlines-between .list-group-title:after,
3950 .md .list.no-hairlines-between-md .list-group-title:after,
3951 .ios .list.no-hairlines-between-ios .list-group-title:after,
3952 .aurora .list.no-hairlines-between-aurora .list-group-title:after {
3953   display: none !important;
3954 }
3955 .list.no-hairlines-between.simple-list li:after,
3956 .md .list.no-hairlines-between-md.simple-list li:after,
3957 .ios .list.no-hairlines-between-ios.simple-list li:after,
3958 .aurora .list.no-hairlines-between-aurora.simple-list li:after {
3959   display: none !important;
3960 }
3961 .list.no-hairlines-between.links-list a:after,
3962 .md .list.no-hairlines-between-md.links-list a:after,
3963 .ios .list.no-hairlines-between-ios.links-list a:after,
3964 .aurora .list.no-hairlines-between-aurora.links-list a:after {
3965   display: none !important;
3966 }
3967 .list-button {
3968   padding: 0 var(--f7-list-item-padding-horizontal);
3969   line-height: var(--f7-list-item-min-height);
3970   color: var(--f7-list-button-text-color, var(--f7-theme-color));
3971   font-size: var(--f7-list-button-font-size);
3972   font-weight: var(--f7-list-button-font-weight);
3973   text-align: var(--f7-list-button-text-align);
3974 }
3975 .list-button:after {
3976   content: '';
3977   position: absolute;
3978   background-color: var(--f7-list-button-border-color);
3979   display: block;
3980   z-index: 15;
3981   top: auto;
3982   right: auto;
3983   bottom: 0;
3984   left: 0;
3985   height: 1px;
3986   width: 100%;
3987   transform-origin: 50% 100%;
3988   transform: scaleY(calc(1 / var(--f7-device-pixel-ratio)));
3989 }
3990 .list-button.active-state {
3991   background-color: var(--f7-list-button-pressed-bg-color);
3992 }
3993 .list-button[class*="color-"] {
3994   --f7-list-button-text-color: var(--f7-theme-color);
3995 }
3996 .simple-list li {
3997   position: relative;
3998   white-space: nowrap;
3999   text-overflow: ellipsis;
4000   max-width: 100%;
4001   box-sizing: border-box;
4002   display: flex;
4003   justify-content: space-between;
4004   align-items: center;
4005   align-content: center;
4006   line-height: var(--f7-list-item-min-height);
4007   height: var(--f7-list-item-min-height);
4008   padding-left: calc(var(--f7-list-item-padding-horizontal) + var(--f7-safe-area-left));
4009   padding-right: calc(var(--f7-list-item-padding-horizontal) + var(--f7-safe-area-right));
4010 }
4011 .simple-list li:after {
4012   left: var(--f7-list-item-padding-horizontal);
4013   width: auto;
4014   left: calc(var(--f7-list-item-padding-horizontal) + var(--f7-safe-area-left));
4015   right: 0;
4016 }
4017 .simple-list li:last-child:after {
4018   display: none !important;
4019 }
4020 .links-list li {
4021   z-index: 1;
4022 }
4023 .links-list a {
4024   transition-duration: 300ms;
4025   transition-property: background-color;
4026   display: block;
4027   position: relative;
4028   overflow: hidden;
4029   display: flex;
4030   align-items: center;
4031   align-content: center;
4032   justify-content: space-between;
4033   box-sizing: border-box;
4034   white-space: nowrap;
4035   text-overflow: ellipsis;
4036   max-width: 100%;
4037   height: var(--f7-list-item-min-height);
4038   color: inherit;
4039 }
4040 .links-list a .ripple-wave {
4041   z-index: 0;
4042 }
4043 .links-list a:after {
4044   width: auto;
4045 }
4046 .links-list a.active-state {
4047   background-color: var(--f7-list-link-pressed-bg-color);
4048 }
4049 .links-list a {
4050   padding-left: calc(var(--f7-list-item-padding-horizontal) + var(--f7-safe-area-left));
4051   padding-right: calc(var(--f7-list-chevron-icon-area) + var(--f7-list-item-padding-horizontal) + var(--f7-safe-area-right));
4052 }
4053 .links-list a:after {
4054   left: calc(var(--f7-list-item-padding-horizontal) + var(--f7-safe-area-left));
4055   right: 0;
4056 }
4057 .links-list li:last-child a:after {
4058   display: none !important;
4059 }
4060 .simple-list li:after,
4061 .links-list a:after,
4062 .list .item-inner:after {
4063   content: '';
4064   position: absolute;
4065   background-color: var(--f7-list-item-border-color);
4066   display: block;
4067   z-index: 15;
4068   top: auto;
4069   right: auto;
4070   bottom: 0;
4071   left: 0;
4072   height: 1px;
4073   width: 100%;
4074   transform-origin: 50% 100%;
4075   transform: scaleY(calc(1 / var(--f7-device-pixel-ratio)));
4076 }
4077 .media-list,
4078 li.media-item {
4079   --f7-list-item-padding-vertical: var(--f7-list-media-item-padding-vertical);
4080   --f7-list-item-padding-horizontal: var(--f7-list-media-item-padding-horizontal);
4081 }
4082 .media-list .item-title,
4083 li.media-item .item-title {
4084   font-weight: var(--f7-list-media-item-title-font-weight, var(--f7-list-item-title-font-weight, inherit));
4085 }
4086 .media-list .item-inner,
4087 li.media-item .item-inner {
4088   display: block;
4089   align-self: stretch;
4090 }
4091 .media-list .item-media,
4092 li.media-item .item-media {
4093   align-self: flex-start;
4094 }
4095 .media-list .item-media img,
4096 li.media-item .item-media img {
4097   display: block;
4098 }
4099 .media-list .item-link .item-inner,
4100 li.media-item .item-link .item-inner {
4101   padding-right: calc(var(--f7-list-item-padding-horizontal) + var(--f7-safe-area-right));
4102 }
4103 .media-list .item-link .item-title-row,
4104 li.media-item .item-link .item-title-row {
4105   padding-right: calc(var(--f7-list-chevron-icon-area));
4106 }
4107 .media-list.chevron-center .item-link .item-inner,
4108 .media-list .chevron-center .item-link .item-inner,
4109 .media-list .item-link.chevron-center .item-inner,
4110 li.media-item.chevron-center .item-link .item-inner,
4111 li.media-item .item-link.chevron-center .item-inner,
4112 li.media-item .chevron-center .item-link .item-inner {
4113   padding-right: calc(var(--f7-list-chevron-icon-area) + var(--f7-list-item-padding-horizontal) + var(--f7-safe-area-right));
4114 }
4115 .media-list.chevron-center .item-title-row,
4116 .media-list .chevron-center .item-title-row,
4117 li.media-item.chevron-center .item-title-row,
4118 li.media-item .chevron-center .item-title-row {
4119   padding-right: 0;
4120 }
4121 .list .item-link .item-inner:before,
4122 .links-list a:before,
4123 .media-list .item-link .item-title-row:before,
4124 li.media-item .item-link .item-title-row:before,
4125 .media-list.chevron-center .item-link .item-inner:before,
4126 .media-list .chevron-center .item-link .item-inner:before,
4127 .media-list .item-link.chevron-center .item-inner:before,
4128 li.media-item.chevron-center .item-link .item-inner:before,
4129 li.media-item .chevron-center .item-link .item-inner:before,
4130 li.media-item .item-link.chevron-center .item-inner:before {
4131   font-family: 'framework7-core-icons';
4132   font-weight: normal;
4133   font-style: normal;
4134   line-height: 1;
4135   letter-spacing: normal;
4136   text-transform: none;
4137   white-space: nowrap;
4138   word-wrap: normal;
4139   direction: ltr;
4140   -webkit-font-smoothing: antialiased;
4141   text-rendering: optimizeLegibility;
4142   -moz-osx-font-smoothing: grayscale;
4143   -moz-font-feature-settings: "liga";
4144        font-feature-settings: "liga";
4145   text-align: center;
4146   display: block;
4147   width: 100%;
4148   height: 100%;
4149   font-size: 20px;
4150   position: absolute;
4151   top: 50%;
4152   width: 8px;
4153   height: 14px;
4154   margin-top: -7px;
4155   font-size: var(--f7-list-chevron-icon-font-size);
4156   line-height: 14px;
4157   color: var(--f7-list-chevron-icon-color);
4158   pointer-events: none;
4159   right: calc(var(--f7-list-item-padding-horizontal) + var(--f7-safe-area-right));
4160   content: 'chevron_right';
4161 }
4162 .media-list.chevron-center .item-title-row:before,
4163 .media-list .chevron-center .item-title-row:before,
4164 li.media-item.chevron-center .item-title-row:before,
4165 li.media-item .chevron-center .item-title-row:before {
4166   display: none;
4167 }
4168 .media-list .item-link .item-inner:before,
4169 li.media-item .item-link .item-inner:before {
4170   display: none;
4171 }
4172 .media-list .item-link .item-title-row:before,
4173 li.media-item .item-link .item-title-row:before {
4174   right: 0;
4175 }
4176 .list-group ul:after,
4177 .list-group ul:before {
4178   z-index: 25 !important;
4179 }
4180 .list-group + .list-group ul:before {
4181   display: none !important;
4182 }
4183 li.item-divider,
4184 .item-divider,
4185 li.list-group-title {
4186   white-space: nowrap;
4187   position: relative;
4188   max-width: 100%;
4189   text-overflow: ellipsis;
4190   overflow: hidden;
4191   z-index: 15;
4192   padding-top: 0;
4193   padding-bottom: 0;
4194   padding-left: calc(var(--f7-list-item-padding-horizontal) + var(--f7-safe-area-left));
4195   padding-right: calc(var(--f7-list-item-padding-horizontal) + var(--f7-safe-area-right));
4196   box-sizing: border-box;
4197   display: flex;
4198   align-items: center;
4199   align-content: center;
4200 }
4201 li.item-divider:after,
4202 .item-divider:after,
4203 li.list-group-title:after {
4204   display: none !important;
4205 }
4206 li.item-divider,
4207 .item-divider {
4208   margin-top: -1px;
4209   height: var(--f7-list-item-divider-height);
4210   color: var(--f7-list-item-divider-text-color);
4211   font-size: var(--f7-list-item-divider-font-size);
4212   font-weight: var(--f7-list-item-divider-font-weight);
4213   background-color: var(--f7-list-item-divider-bg-color);
4214   line-height: var(--f7-list-item-divider-line-height);
4215 }
4216 li.item-divider:before,
4217 .item-divider:before {
4218   content: '';
4219   position: absolute;
4220   background-color: var(--f7-list-item-divider-border-color);
4221   display: block;
4222   z-index: 15;
4223   top: 0;
4224   right: auto;
4225   bottom: auto;
4226   left: 0;
4227   height: 1px;
4228   width: 100%;
4229   transform-origin: 50% 0%;
4230   transform: scaleY(calc(1 / var(--f7-device-pixel-ratio)));
4231 }
4232 li.list-group-title,
4233 .list li.list-group-title {
4234   position: relative;
4235   position: -webkit-sticky;
4236   position: sticky;
4237   top: 0;
4238   margin-top: 0;
4239   z-index: 20;
4240   height: var(--f7-list-group-title-height);
4241   color: var(--f7-list-group-title-text-color);
4242   font-size: var(--f7-list-group-title-font-size);
4243   font-weight: var(--f7-list-group-title-font-weight);
4244   background-color: var(--f7-list-group-title-bg-color);
4245   line-height: var(--f7-list-group-title-line-height);
4246 }
4247 .page-with-navbar-large li.list-group-title,
4248 .page-with-navbar-large .list li.list-group-title {
4249   top: calc(-1 * var(--f7-navbar-large-title-height));
4250 }
4251 .list.inset {
4252   margin-left: calc(var(--f7-list-inset-side-margin) + var(--f7-safe-area-outer-left));
4253   margin-right: calc(var(--f7-list-inset-side-margin) + var(--f7-safe-area-outer-right));
4254   border-radius: var(--f7-list-inset-border-radius);
4255   --f7-safe-area-left: 0px;
4256   --f7-safe-area-right: 0px;
4257 }
4258 .list.inset .block-title {
4259   margin-left: 0;
4260   margin-right: 0;
4261 }
4262 .list.inset ul {
4263   border-radius: var(--f7-list-inset-border-radius);
4264 }
4265 .list.inset ul:before {
4266   display: none !important;
4267 }
4268 .list.inset ul:after {
4269   display: none !important;
4270 }
4271 .list.inset li.swipeout:first-child,
4272 .list.inset li:first-child > a {
4273   border-radius: var(--f7-list-inset-border-radius) var(--f7-list-inset-border-radius) 0 0;
4274 }
4275 .list.inset li.swipeout:last-child,
4276 .list.inset li:last-child > a {
4277   border-radius: 0 0 var(--f7-list-inset-border-radius) var(--f7-list-inset-border-radius);
4278 }
4279 .list.inset li.swipeout:first-child:last-child,
4280 .list.inset li:first-child:last-child > a {
4281   border-radius: var(--f7-list-inset-border-radius);
4282 }
4283 @media (min-width: 768px) {
4284   .list.tablet-inset {
4285     margin-left: calc(var(--f7-list-inset-side-margin) + var(--f7-safe-area-outer-left));
4286     margin-right: calc(var(--f7-list-inset-side-margin) + var(--f7-safe-area-outer-right));
4287     border-radius: var(--f7-list-inset-border-radius);
4288     --f7-safe-area-left: 0px;
4289     --f7-safe-area-right: 0px;
4290   }
4291   .list.tablet-inset .block-title {
4292     margin-left: 0;
4293     margin-right: 0;
4294   }
4295   .list.tablet-inset ul {
4296     border-radius: var(--f7-list-inset-border-radius);
4297   }
4298   .list.tablet-inset ul:before {
4299     display: none !important;
4300   }
4301   .list.tablet-inset ul:after {
4302     display: none !important;
4303   }
4304   .list.tablet-inset li:first-child > a {
4305     border-radius: var(--f7-list-inset-border-radius) var(--f7-list-inset-border-radius) 0 0;
4306   }
4307   .list.tablet-inset li:last-child > a {
4308     border-radius: 0 0 var(--f7-list-inset-border-radius) var(--f7-list-inset-border-radius);
4309   }
4310   .list.tablet-inset li:first-child:last-child > a {
4311     border-radius: var(--f7-list-inset-border-radius);
4312   }
4313 }
4314 .list.no-chevron,
4315 .list .no-chevron {
4316   --f7-list-chevron-icon-color: transparent;
4317   --f7-list-chevron-icon-area: 0px;
4318 }
4319 .ios .item-link.active-state .item-inner:after,
4320 .ios .list-button.active-state:after,
4321 .ios .links-list a.active-state:after {
4322   background-color: transparent;
4323 }
4324 .ios .links-list a.active-state,
4325 .ios .list .item-link.active-state,
4326 .ios .list .list-button.active-state {
4327   transition-duration: 0ms;
4328 }
4329 .md .list .item-media {
4330   min-width: 40px;
4331 }
4332 .aurora .list .item-media {
4333   min-width: 18px;
4334 }
4335 .aurora .list .item-link .item-inner:before,
4336 .aurora .links-list a:before,
4337 .aurora .media-list .item-link .item-title-row:before,
4338 .aurora li.media-item .item-link .item-title-row:before,
4339 .aurora .media-list.chevron-center .item-link .item-inner:before,
4340 .aurora .media-list .chevron-center .item-link .item-inner:before,
4341 .aurora .media-list .item-link.chevron-center .item-inner:before,
4342 .aurora li.media-item.chevron-center .item-link .item-inner:before,
4343 .aurora li.media-item .chevron-center .item-link .item-inner:before,
4344 .aurora li.media-item .item-link.chevron-center .item-inner:before {
4345   content: 'chevron_right_aurora';
4346 }
4347 .aurora .links-list a,
4348 .aurora .list .item-link,
4349 .aurora .list .list-button {
4350   transition-duration: 0ms;
4351 }
4352 .aurora.device-desktop .links-list a:hover:not(.active-state):not(.no-hover),
4353 .aurora.device-desktop .list .item-link:hover:not(.active-state):not(.no-hover) {
4354   background: var(--f7-list-link-hover-bg-color);
4355 }
4356 .aurora.device-desktop .list .list-button:hover:not(.active-state):not(.no-hover) {
4357   background: var(--f7-list-button-hover-bg-color);
4358 }
4359 /* === Badge === */
4360 :root {
4361   --f7-badge-text-color: #fff;
4362   --f7-badge-bg-color: #8e8e93;
4363   --f7-badge-padding: 0 4px;
4364   --f7-badge-in-icon-size: 16px;
4365   --f7-badge-in-icon-font-size: 10px;
4366   --f7-badge-font-weight: normal;
4367   --f7-badge-font-size: 12px;
4368 }
4369 .ios {
4370   --f7-badge-size: 20px;
4371 }
4372 .md {
4373   --f7-badge-size: 18px;
4374 }
4375 .aurora {
4376   --f7-badge-size: 18px;
4377   --f7-badge-font-weight: 600;
4378   --f7-badge-in-icon-size: 15px;
4379 }
4380 .badge {
4381   display: inline-flex;
4382   align-items: center;
4383   align-content: center;
4384   justify-content: center;
4385   color: var(--f7-badge-text-color);
4386   background: var(--f7-badge-bg-color);
4387   position: relative;
4388   box-sizing: border-box;
4389   text-align: center;
4390   vertical-align: middle;
4391   font-weight: var(--f7-badge-font-weight);
4392   font-size: var(--f7-badge-font-size);
4393   border-radius: var(--f7-badge-size);
4394   padding: var(--f7-badge-padding);
4395   height: var(--f7-badge-size);
4396   min-width: var(--f7-badge-size);
4397 }
4398 .icon .badge,
4399 .f7-icons .badge,
4400 .framework7-icons .badge,
4401 .material-icons .badge {
4402   position: absolute;
4403   left: 100%;
4404   margin-left: -10px;
4405   top: -2px;
4406   font-family: var(--f7-font-family);
4407   --f7-badge-font-size: var(--f7-badge-in-icon-font-size);
4408   --f7-badge-size: var(--f7-badge-in-icon-size);
4409 }
4410 .badge[class*="color-"] {
4411   --f7-badge-bg-color: var(--f7-theme-color);
4412 }
4413 :root {
4414   --f7-button-font-size: 14px;
4415   --f7-button-min-width: 32px;
4416   --f7-button-bg-color: transparent;
4417   --f7-button-border-width: 0px;
4418   /*
4419   --f7-button-text-color: var(--f7-theme-color);
4420   --f7-button-pressed-text-color: var(--f7-button-text-color, var(--f7-theme-color));
4421   --f7-button-border-color: var(--f7-theme-color);
4422   --f7-button-fill-text-color: #fff;
4423   --f7-button-fill-bg-color: var(--f7-theme-color);
4424   --f7-button-outline-border-color: var(--f7-theme-color);
4425   */
4426   --f7-button-raised-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0,0,0,0.24);
4427   --f7-button-raised-pressed-box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0,0,0,0.23);
4428   --f7-segmented-raised-divider-color: rgba(0, 0, 0, 0.1);
4429 }
4430 .ios {
4431   --f7-button-height: 29px;
4432   --f7-button-padding-horizontal: 10px;
4433   --f7-button-border-radius: 5px;
4434   --f7-button-font-weight: 400;
4435   --f7-button-letter-spacing: 0;
4436   --f7-button-text-transform: none;
4437   /*
4438   --f7-button-pressed-bg-color: rgba(var(--f7-theme-color-rgb), .15);
4439   --f7-button-fill-pressed-bg-color: var(--f7-theme-color-tint);
4440   */
4441   --f7-button-outline-border-width: 1px;
4442   --f7-button-large-height: 44px;
4443   --f7-button-large-font-size: 17px;
4444   --f7-button-large-font-weight: 400;
4445   --f7-button-small-height: 26px;
4446   --f7-button-small-font-size: 13px;
4447   --f7-button-small-font-weight: 600;
4448   --f7-button-small-text-transform: uppercase;
4449   --f7-button-small-outline-border-width: 2px;
4450 }
4451 .md {
4452   --f7-button-height: 36px;
4453   --f7-button-padding-horizontal: 8px;
4454   --f7-button-border-radius: 4px;
4455   --f7-button-font-weight: 500;
4456   --f7-button-letter-spacing: 0.03em;
4457   --f7-button-text-transform: uppercase;
4458   --f7-button-pressed-bg-color: rgba(0, 0, 0, 0.1);
4459   /*
4460   --f7-button-fill-pressed-bg-color: var(-