Merge pull request #10592 from iNavFlight/MrD_Update-parameter-description
[inav.git] / lib / main / STM32H7 / Drivers / CMSIS / Device / ST / STM32H7xx / _htmresc / mini-st.css
blob71fbc14fc2078319f34b960d11fa05560bbcb71e
1 @charset "UTF-8";
2 /*
3 Flavor name: Default (mini-default)
4 Author: Angelos Chalaris (chalarangelo@gmail.com)
5 Maintainers: Angelos Chalaris
6 mini.css version: v3.0.0-alpha.3
7 */
8 /*
9 Browsers resets and base typography.
11 /* Core module CSS variable definitions */
12 :root {
13 --fore-color: #111;
14 --secondary-fore-color: #444;
15 --back-color: #f8f8f8;
16 --secondary-back-color: #f0f0f0;
17 --blockquote-color: #f57c00;
18 --pre-color: #1565c0;
19 --border-color: #aaa;
20 --secondary-border-color: #ddd;
21 --heading-ratio: 1.19;
22 --universal-margin: 0.5rem;
23 --universal-padding: 0.125rem;
24 --universal-border-radius: 0.125rem;
25 --a-link-color: #0277bd;
26 --a-visited-color: #01579b; }
28 html {
29 font-size: 14px; }
31 a, b, del, em, i, ins, q, span, strong, u {
32 font-size: 1em; }
34 html, * {
35 font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Ubuntu, "Helvetica Neue", Helvetica, sans-serif;
36 line-height: 1.4;
37 -webkit-text-size-adjust: 100%; }
39 * {
40 font-size: 1rem; }
42 body {
43 margin: 0;
44 color: var(--fore-color);
45 background: var(--back-color); }
47 details {
48 display: block; }
50 summary {
51 display: list-item; }
53 abbr[title] {
54 border-bottom: none;
55 text-decoration: underline dotted; }
57 input {
58 overflow: visible; }
60 img {
61 max-width: 100%;
62 height: auto; }
64 h1, h2, h3, h4, h5, h6 {
65 line-height: 1.2;
66 margin: calc(1.5 * var(--universal-margin)) var(--universal-margin);
67 font-weight: 500; }
68 h1 small, h2 small, h3 small, h4 small, h5 small, h6 small {
69 color: var(--secondary-fore-color);
70 display: block;
71 margin-top: -0.25rem; }
73 h1 {
74 font-size: calc(1rem * var(--heading-ratio) * var(--heading-ratio) * var(--heading-ratio)); }
76 h2 {
77 font-size: calc(1rem * var(--heading-ratio) * var(--heading-ratio); );
78 background: var(--mark-back-color);
79 font-weight: 600;
80 padding: 0.1em 0.5em 0.2em 0.5em;
81 color: var(--mark-fore-color); }
83 h3 {
84 font-size: calc(1rem * var(--heading-ratio));
85 padding-left: calc(2 * var(--universal-margin));
86 /* background: var(--border-color); */
89 h4 {
90 font-size: 1rem;);
91 padding-left: calc(4 * var(--universal-margin)); }
93 h5 {
94 font-size: 1rem; }
96 h6 {
97 font-size: calc(1rem / var(--heading-ratio)); }
99 p {
100 margin: var(--universal-margin); }
102 ol, ul {
103 margin: var(--universal-margin);
104 padding-left: calc(6 * var(--universal-margin)); }
106 b, strong {
107 font-weight: 700; }
109 hr {
110 box-sizing: content-box;
111 border: 0;
112 line-height: 1.25em;
113 margin: var(--universal-margin);
114 height: 0.0625rem;
115 background: linear-gradient(to right, transparent, var(--border-color) 20%, var(--border-color) 80%, transparent); }
117 blockquote {
118 display: block;
119 position: relative;
120 font-style: italic;
121 color: var(--secondary-fore-color);
122 margin: var(--universal-margin);
123 padding: calc(3 * var(--universal-padding));
124 border: 0.0625rem solid var(--secondary-border-color);
125 border-left: 0.375rem solid var(--blockquote-color);
126 border-radius: 0 var(--universal-border-radius) var(--universal-border-radius) 0; }
127 blockquote:before {
128 position: absolute;
129 top: calc(0rem - var(--universal-padding));
130 left: 0;
131 font-family: sans-serif;
132 font-size: 3rem;
133 font-weight: 700;
134 content: "\201c";
135 color: var(--blockquote-color); }
136 blockquote[cite]:after {
137 font-style: normal;
138 font-size: 0.75em;
139 font-weight: 700;
140 content: "\a— " attr(cite);
141 white-space: pre; }
143 code, kbd, pre, samp {
144 font-family: Menlo, Consolas, monospace;
145 font-size: 0.85em; }
147 code {
148 background: var(--secondary-back-color);
149 border-radius: var(--universal-border-radius);
150 padding: calc(var(--universal-padding) / 4) calc(var(--universal-padding) / 2); }
152 kbd {
153 background: var(--fore-color);
154 color: var(--back-color);
155 border-radius: var(--universal-border-radius);
156 padding: calc(var(--universal-padding) / 4) calc(var(--universal-padding) / 2); }
158 pre {
159 overflow: auto;
160 background: var(--secondary-back-color);
161 padding: calc(1.5 * var(--universal-padding));
162 margin: var(--universal-margin);
163 border: 0.0625rem solid var(--secondary-border-color);
164 border-left: 0.25rem solid var(--pre-color);
165 border-radius: 0 var(--universal-border-radius) var(--universal-border-radius) 0; }
167 sup, sub, code, kbd {
168 line-height: 0;
169 position: relative;
170 vertical-align: baseline; }
172 small, sup, sub, figcaption {
173 font-size: 0.75em; }
175 sup {
176 top: -0.5em; }
178 sub {
179 bottom: -0.25em; }
181 figure {
182 margin: var(--universal-margin); }
184 figcaption {
185 color: var(--secondary-fore-color); }
188 text-decoration: none; }
189 a:link {
190 color: var(--a-link-color); }
191 a:visited {
192 color: var(--a-visited-color); }
193 a:hover, a:focus {
194 text-decoration: underline; }
197 Definitions for the grid system, cards and containers.
199 .container {
200 margin: 0 auto;
201 padding: 0 calc(1.5 * var(--universal-padding)); }
203 .row {
204 box-sizing: border-box;
205 display: flex;
206 flex: 0 1 auto;
207 flex-flow: row wrap; }
209 .col-sm,
210 [class^='col-sm-'],
211 [class^='col-sm-offset-'],
212 .row[class*='cols-sm-'] > * {
213 box-sizing: border-box;
214 flex: 0 0 auto;
215 padding: 0 calc(var(--universal-padding) / 2); }
217 .col-sm,
218 .row.cols-sm > * {
219 max-width: 100%;
220 flex-grow: 1;
221 flex-basis: 0; }
223 .col-sm-1,
224 .row.cols-sm-1 > * {
225 max-width: 8.3333333333%;
226 flex-basis: 8.3333333333%; }
228 .col-sm-offset-0 {
229 margin-left: 0; }
231 .col-sm-2,
232 .row.cols-sm-2 > * {
233 max-width: 16.6666666667%;
234 flex-basis: 16.6666666667%; }
236 .col-sm-offset-1 {
237 margin-left: 8.3333333333%; }
239 .col-sm-3,
240 .row.cols-sm-3 > * {
241 max-width: 25%;
242 flex-basis: 25%; }
244 .col-sm-offset-2 {
245 margin-left: 16.6666666667%; }
247 .col-sm-4,
248 .row.cols-sm-4 > * {
249 max-width: 33.3333333333%;
250 flex-basis: 33.3333333333%; }
252 .col-sm-offset-3 {
253 margin-left: 25%; }
255 .col-sm-5,
256 .row.cols-sm-5 > * {
257 max-width: 41.6666666667%;
258 flex-basis: 41.6666666667%; }
260 .col-sm-offset-4 {
261 margin-left: 33.3333333333%; }
263 .col-sm-6,
264 .row.cols-sm-6 > * {
265 max-width: 50%;
266 flex-basis: 50%; }
268 .col-sm-offset-5 {
269 margin-left: 41.6666666667%; }
271 .col-sm-7,
272 .row.cols-sm-7 > * {
273 max-width: 58.3333333333%;
274 flex-basis: 58.3333333333%; }
276 .col-sm-offset-6 {
277 margin-left: 50%; }
279 .col-sm-8,
280 .row.cols-sm-8 > * {
281 max-width: 66.6666666667%;
282 flex-basis: 66.6666666667%; }
284 .col-sm-offset-7 {
285 margin-left: 58.3333333333%; }
287 .col-sm-9,
288 .row.cols-sm-9 > * {
289 max-width: 75%;
290 flex-basis: 75%; }
292 .col-sm-offset-8 {
293 margin-left: 66.6666666667%; }
295 .col-sm-10,
296 .row.cols-sm-10 > * {
297 max-width: 83.3333333333%;
298 flex-basis: 83.3333333333%; }
300 .col-sm-offset-9 {
301 margin-left: 75%; }
303 .col-sm-11,
304 .row.cols-sm-11 > * {
305 max-width: 91.6666666667%;
306 flex-basis: 91.6666666667%; }
308 .col-sm-offset-10 {
309 margin-left: 83.3333333333%; }
311 .col-sm-12,
312 .row.cols-sm-12 > * {
313 max-width: 100%;
314 flex-basis: 100%; }
316 .col-sm-offset-11 {
317 margin-left: 91.6666666667%; }
319 .col-sm-normal {
320 order: initial; }
322 .col-sm-first {
323 order: -999; }
325 .col-sm-last {
326 order: 999; }
328 @media screen and (min-width: 500px) {
329 .col-md,
330 [class^='col-md-'],
331 [class^='col-md-offset-'],
332 .row[class*='cols-md-'] > * {
333 box-sizing: border-box;
334 flex: 0 0 auto;
335 padding: 0 calc(var(--universal-padding) / 2); }
337 .col-md,
338 .row.cols-md > * {
339 max-width: 100%;
340 flex-grow: 1;
341 flex-basis: 0; }
343 .col-md-1,
344 .row.cols-md-1 > * {
345 max-width: 8.3333333333%;
346 flex-basis: 8.3333333333%; }
348 .col-md-offset-0 {
349 margin-left: 0; }
351 .col-md-2,
352 .row.cols-md-2 > * {
353 max-width: 16.6666666667%;
354 flex-basis: 16.6666666667%; }
356 .col-md-offset-1 {
357 margin-left: 8.3333333333%; }
359 .col-md-3,
360 .row.cols-md-3 > * {
361 max-width: 25%;
362 flex-basis: 25%; }
364 .col-md-offset-2 {
365 margin-left: 16.6666666667%; }
367 .col-md-4,
368 .row.cols-md-4 > * {
369 max-width: 33.3333333333%;
370 flex-basis: 33.3333333333%; }
372 .col-md-offset-3 {
373 margin-left: 25%; }
375 .col-md-5,
376 .row.cols-md-5 > * {
377 max-width: 41.6666666667%;
378 flex-basis: 41.6666666667%; }
380 .col-md-offset-4 {
381 margin-left: 33.3333333333%; }
383 .col-md-6,
384 .row.cols-md-6 > * {
385 max-width: 50%;
386 flex-basis: 50%; }
388 .col-md-offset-5 {
389 margin-left: 41.6666666667%; }
391 .col-md-7,
392 .row.cols-md-7 > * {
393 max-width: 58.3333333333%;
394 flex-basis: 58.3333333333%; }
396 .col-md-offset-6 {
397 margin-left: 50%; }
399 .col-md-8,
400 .row.cols-md-8 > * {
401 max-width: 66.6666666667%;
402 flex-basis: 66.6666666667%; }
404 .col-md-offset-7 {
405 margin-left: 58.3333333333%; }
407 .col-md-9,
408 .row.cols-md-9 > * {
409 max-width: 75%;
410 flex-basis: 75%; }
412 .col-md-offset-8 {
413 margin-left: 66.6666666667%; }
415 .col-md-10,
416 .row.cols-md-10 > * {
417 max-width: 83.3333333333%;
418 flex-basis: 83.3333333333%; }
420 .col-md-offset-9 {
421 margin-left: 75%; }
423 .col-md-11,
424 .row.cols-md-11 > * {
425 max-width: 91.6666666667%;
426 flex-basis: 91.6666666667%; }
428 .col-md-offset-10 {
429 margin-left: 83.3333333333%; }
431 .col-md-12,
432 .row.cols-md-12 > * {
433 max-width: 100%;
434 flex-basis: 100%; }
436 .col-md-offset-11 {
437 margin-left: 91.6666666667%; }
439 .col-md-normal {
440 order: initial; }
442 .col-md-first {
443 order: -999; }
445 .col-md-last {
446 order: 999; } }
447 @media screen and (min-width: 1280px) {
448 .col-lg,
449 [class^='col-lg-'],
450 [class^='col-lg-offset-'],
451 .row[class*='cols-lg-'] > * {
452 box-sizing: border-box;
453 flex: 0 0 auto;
454 padding: 0 calc(var(--universal-padding) / 2); }
456 .col-lg,
457 .row.cols-lg > * {
458 max-width: 100%;
459 flex-grow: 1;
460 flex-basis: 0; }
462 .col-lg-1,
463 .row.cols-lg-1 > * {
464 max-width: 8.3333333333%;
465 flex-basis: 8.3333333333%; }
467 .col-lg-offset-0 {
468 margin-left: 0; }
470 .col-lg-2,
471 .row.cols-lg-2 > * {
472 max-width: 16.6666666667%;
473 flex-basis: 16.6666666667%; }
475 .col-lg-offset-1 {
476 margin-left: 8.3333333333%; }
478 .col-lg-3,
479 .row.cols-lg-3 > * {
480 max-width: 25%;
481 flex-basis: 25%; }
483 .col-lg-offset-2 {
484 margin-left: 16.6666666667%; }
486 .col-lg-4,
487 .row.cols-lg-4 > * {
488 max-width: 33.3333333333%;
489 flex-basis: 33.3333333333%; }
491 .col-lg-offset-3 {
492 margin-left: 25%; }
494 .col-lg-5,
495 .row.cols-lg-5 > * {
496 max-width: 41.6666666667%;
497 flex-basis: 41.6666666667%; }
499 .col-lg-offset-4 {
500 margin-left: 33.3333333333%; }
502 .col-lg-6,
503 .row.cols-lg-6 > * {
504 max-width: 50%;
505 flex-basis: 50%; }
507 .col-lg-offset-5 {
508 margin-left: 41.6666666667%; }
510 .col-lg-7,
511 .row.cols-lg-7 > * {
512 max-width: 58.3333333333%;
513 flex-basis: 58.3333333333%; }
515 .col-lg-offset-6 {
516 margin-left: 50%; }
518 .col-lg-8,
519 .row.cols-lg-8 > * {
520 max-width: 66.6666666667%;
521 flex-basis: 66.6666666667%; }
523 .col-lg-offset-7 {
524 margin-left: 58.3333333333%; }
526 .col-lg-9,
527 .row.cols-lg-9 > * {
528 max-width: 75%;
529 flex-basis: 75%; }
531 .col-lg-offset-8 {
532 margin-left: 66.6666666667%; }
534 .col-lg-10,
535 .row.cols-lg-10 > * {
536 max-width: 83.3333333333%;
537 flex-basis: 83.3333333333%; }
539 .col-lg-offset-9 {
540 margin-left: 75%; }
542 .col-lg-11,
543 .row.cols-lg-11 > * {
544 max-width: 91.6666666667%;
545 flex-basis: 91.6666666667%; }
547 .col-lg-offset-10 {
548 margin-left: 83.3333333333%; }
550 .col-lg-12,
551 .row.cols-lg-12 > * {
552 max-width: 100%;
553 flex-basis: 100%; }
555 .col-lg-offset-11 {
556 margin-left: 91.6666666667%; }
558 .col-lg-normal {
559 order: initial; }
561 .col-lg-first {
562 order: -999; }
564 .col-lg-last {
565 order: 999; } }
566 /* Card component CSS variable definitions */
567 :root {
568 --card-back-color: #f8f8f8;
569 --card-fore-color: #111;
570 --card-border-color: #ddd; }
572 .card {
573 display: flex;
574 flex-direction: column;
575 justify-content: space-between;
576 align-self: center;
577 position: relative;
578 width: 100%;
579 background: var(--card-back-color);
580 color: var(--card-fore-color);
581 border: 0.0625rem solid var(--card-border-color);
582 border-radius: var(--universal-border-radius);
583 margin: var(--universal-margin);
584 overflow: hidden; }
585 @media screen and (min-width: 320px) {
586 .card {
587 max-width: 320px; } }
588 .card > .sectione {
589 background: var(--card-back-color);
590 color: var(--card-fore-color);
591 box-sizing: border-box;
592 margin: 0;
593 border: 0;
594 border-radius: 0;
595 border-bottom: 0.0625rem solid var(--card-border-color);
596 padding: var(--universal-padding);
597 width: 100%; }
598 .card > .sectione.media {
599 height: 200px;
600 padding: 0;
601 -o-object-fit: cover;
602 object-fit: cover; }
603 .card > .sectione:last-child {
604 border-bottom: 0; }
607 Custom elements for card elements.
609 @media screen and (min-width: 240px) {
610 .card.small {
611 max-width: 240px; } }
612 @media screen and (min-width: 480px) {
613 .card.large {
614 max-width: 480px; } }
615 .card.fluid {
616 max-width: 100%;
617 width: auto; }
619 .card.warning {
620 /* --card-back-color: #ffca28; */
621 --card-back-color: #e5b8b7;
622 --card-border-color: #e8b825; }
624 .card.error {
625 --card-back-color: #b71c1c;
626 --card-fore-color: #f8f8f8;
627 --card-border-color: #a71a1a; }
629 .card > .sectione.dark {
630 --card-back-color: #e0e0e0; }
632 .card > .sectione.double-padded {
633 padding: calc(1.5 * var(--universal-padding)); }
636 Definitions for forms and input elements.
638 /* Input_control module CSS variable definitions */
639 :root {
640 --form-back-color: #f0f0f0;
641 --form-fore-color: #111;
642 --form-border-color: #ddd;
643 --input-back-color: #f8f8f8;
644 --input-fore-color: #111;
645 --input-border-color: #ddd;
646 --input-focus-color: #0288d1;
647 --input-invalid-color: #d32f2f;
648 --button-back-color: #e2e2e2;
649 --button-hover-back-color: #dcdcdc;
650 --button-fore-color: #212121;
651 --button-border-color: transparent;
652 --button-hover-border-color: transparent;
653 --button-group-border-color: rgba(124, 124, 124, 0.54); }
655 form {
656 background: var(--form-back-color);
657 color: var(--form-fore-color);
658 border: 0.0625rem solid var(--form-border-color);
659 border-radius: var(--universal-border-radius);
660 margin: var(--universal-margin);
661 padding: calc(2 * var(--universal-padding)) var(--universal-padding); }
663 fieldset {
664 border: 0.0625rem solid var(--form-border-color);
665 border-radius: var(--universal-border-radius);
666 margin: calc(var(--universal-margin) / 4);
667 padding: var(--universal-padding); }
669 legend {
670 box-sizing: border-box;
671 display: table;
672 max-width: 100%;
673 white-space: normal;
674 font-weight: 700;
675 padding: calc(var(--universal-padding) / 2); }
677 label {
678 padding: calc(var(--universal-padding) / 2) var(--universal-padding); }
680 .input-group {
681 display: inline-block; }
682 .input-group.fluid {
683 display: flex;
684 align-items: center;
685 justify-content: center; }
686 .input-group.fluid > input {
687 max-width: 100%;
688 flex-grow: 1;
689 flex-basis: 0px; }
690 @media screen and (max-width: 499px) {
691 .input-group.fluid {
692 align-items: stretch;
693 flex-direction: column; } }
694 .input-group.vertical {
695 display: flex;
696 align-items: stretch;
697 flex-direction: column; }
698 .input-group.vertical > input {
699 max-width: 100%;
700 flex-grow: 1;
701 flex-basis: 0px; }
703 [type="number"]::-webkit-inner-spin-button, [type="number"]::-webkit-outer-spin-button {
704 height: auto; }
706 [type="search"] {
707 -webkit-appearance: textfield;
708 outline-offset: -2px; }
710 [type="search"]::-webkit-search-cancel-button,
711 [type="search"]::-webkit-search-decoration {
712 -webkit-appearance: none; }
714 input:not([type]), [type="text"], [type="email"], [type="number"], [type="search"],
715 [type="password"], [type="url"], [type="tel"], [type="checkbox"], [type="radio"], textarea, select {
716 box-sizing: border-box;
717 background: var(--input-back-color);
718 color: var(--input-fore-color);
719 border: 0.0625rem solid var(--input-border-color);
720 border-radius: var(--universal-border-radius);
721 margin: calc(var(--universal-margin) / 2);
722 padding: var(--universal-padding) calc(1.5 * var(--universal-padding)); }
724 input:not([type="button"]):not([type="submit"]):not([type="reset"]):hover, input:not([type="button"]):not([type="submit"]):not([type="reset"]):focus, textarea:hover, textarea:focus, select:hover, select:focus {
725 border-color: var(--input-focus-color);
726 box-shadow: none; }
727 input:not([type="button"]):not([type="submit"]):not([type="reset"]):invalid, input:not([type="button"]):not([type="submit"]):not([type="reset"]):focus:invalid, textarea:invalid, textarea:focus:invalid, select:invalid, select:focus:invalid {
728 border-color: var(--input-invalid-color);
729 box-shadow: none; }
730 input:not([type="button"]):not([type="submit"]):not([type="reset"])[readonly], textarea[readonly], select[readonly] {
731 background: var(--secondary-back-color); }
733 select {
734 max-width: 100%; }
736 option {
737 overflow: hidden;
738 text-overflow: ellipsis; }
740 [type="checkbox"], [type="radio"] {
741 -webkit-appearance: none;
742 -moz-appearance: none;
743 appearance: none;
744 position: relative;
745 height: calc(1rem + var(--universal-padding) / 2);
746 width: calc(1rem + var(--universal-padding) / 2);
747 vertical-align: text-bottom;
748 padding: 0;
749 flex-basis: calc(1rem + var(--universal-padding) / 2) !important;
750 flex-grow: 0 !important; }
751 [type="checkbox"]:checked:before, [type="radio"]:checked:before {
752 position: absolute; }
754 [type="checkbox"]:checked:before {
755 content: '\2713';
756 font-family: sans-serif;
757 font-size: calc(1rem + var(--universal-padding) / 2);
758 top: calc(0rem - var(--universal-padding));
759 left: calc(var(--universal-padding) / 4); }
761 [type="radio"] {
762 border-radius: 100%; }
763 [type="radio"]:checked:before {
764 border-radius: 100%;
765 content: '';
766 top: calc(0.0625rem + var(--universal-padding) / 2);
767 left: calc(0.0625rem + var(--universal-padding) / 2);
768 background: var(--input-fore-color);
769 width: 0.5rem;
770 height: 0.5rem; }
772 :placeholder-shown {
773 color: var(--input-fore-color); }
775 ::-ms-placeholder {
776 color: var(--input-fore-color);
777 opacity: 0.54; }
779 button::-moz-focus-inner, [type="button"]::-moz-focus-inner, [type="reset"]::-moz-focus-inner, [type="submit"]::-moz-focus-inner {
780 border-style: none;
781 padding: 0; }
783 button, html [type="button"], [type="reset"], [type="submit"] {
784 -webkit-appearance: button; }
786 button {
787 overflow: visible;
788 text-transform: none; }
790 button, [type="button"], [type="submit"], [type="reset"],
791 a.button, label.button, .button,
792 a[role="button"], label[role="button"], [role="button"] {
793 display: inline-block;
794 background: var(--button-back-color);
795 color: var(--button-fore-color);
796 border: 0.0625rem solid var(--button-border-color);
797 border-radius: var(--universal-border-radius);
798 padding: var(--universal-padding) calc(1.5 * var(--universal-padding));
799 margin: var(--universal-margin);
800 text-decoration: none;
801 cursor: pointer;
802 transition: background 0.3s; }
803 button:hover, button:focus, [type="button"]:hover, [type="button"]:focus, [type="submit"]:hover, [type="submit"]:focus, [type="reset"]:hover, [type="reset"]:focus,
804 a.button:hover,
805 a.button:focus, label.button:hover, label.button:focus, .button:hover, .button:focus,
806 a[role="button"]:hover,
807 a[role="button"]:focus, label[role="button"]:hover, label[role="button"]:focus, [role="button"]:hover, [role="button"]:focus {
808 background: var(--button-hover-back-color);
809 border-color: var(--button-hover-border-color); }
811 input:disabled, input[disabled], textarea:disabled, textarea[disabled], select:disabled, select[disabled], button:disabled, button[disabled], .button:disabled, .button[disabled], [role="button"]:disabled, [role="button"][disabled] {
812 cursor: not-allowed;
813 opacity: 0.75; }
815 .button-group {
816 display: flex;
817 border: 0.0625rem solid var(--button-group-border-color);
818 border-radius: var(--universal-border-radius);
819 margin: var(--universal-margin); }
820 .button-group > button, .button-group [type="button"], .button-group > [type="submit"], .button-group > [type="reset"], .button-group > .button, .button-group > [role="button"] {
821 margin: 0;
822 max-width: 100%;
823 flex: 1 1 auto;
824 text-align: center;
825 border: 0;
826 border-radius: 0;
827 box-shadow: none; }
828 .button-group > :not(:first-child) {
829 border-left: 0.0625rem solid var(--button-group-border-color); }
830 @media screen and (max-width: 499px) {
831 .button-group {
832 flex-direction: column; }
833 .button-group > :not(:first-child) {
834 border: 0;
835 border-top: 0.0625rem solid var(--button-group-border-color); } }
838 Custom elements for forms and input elements.
840 button.primary, [type="button"].primary, [type="submit"].primary, [type="reset"].primary, .button.primary, [role="button"].primary {
841 --button-back-color: #1976d2;
842 --button-fore-color: #f8f8f8; }
843 button.primary:hover, button.primary:focus, [type="button"].primary:hover, [type="button"].primary:focus, [type="submit"].primary:hover, [type="submit"].primary:focus, [type="reset"].primary:hover, [type="reset"].primary:focus, .button.primary:hover, .button.primary:focus, [role="button"].primary:hover, [role="button"].primary:focus {
844 --button-hover-back-color: #1565c0; }
846 button.secondary, [type="button"].secondary, [type="submit"].secondary, [type="reset"].secondary, .button.secondary, [role="button"].secondary {
847 --button-back-color: #d32f2f;
848 --button-fore-color: #f8f8f8; }
849 button.secondary:hover, button.secondary:focus, [type="button"].secondary:hover, [type="button"].secondary:focus, [type="submit"].secondary:hover, [type="submit"].secondary:focus, [type="reset"].secondary:hover, [type="reset"].secondary:focus, .button.secondary:hover, .button.secondary:focus, [role="button"].secondary:hover, [role="button"].secondary:focus {
850 --button-hover-back-color: #c62828; }
852 button.tertiary, [type="button"].tertiary, [type="submit"].tertiary, [type="reset"].tertiary, .button.tertiary, [role="button"].tertiary {
853 --button-back-color: #308732;
854 --button-fore-color: #f8f8f8; }
855 button.tertiary:hover, button.tertiary:focus, [type="button"].tertiary:hover, [type="button"].tertiary:focus, [type="submit"].tertiary:hover, [type="submit"].tertiary:focus, [type="reset"].tertiary:hover, [type="reset"].tertiary:focus, .button.tertiary:hover, .button.tertiary:focus, [role="button"].tertiary:hover, [role="button"].tertiary:focus {
856 --button-hover-back-color: #277529; }
858 button.inverse, [type="button"].inverse, [type="submit"].inverse, [type="reset"].inverse, .button.inverse, [role="button"].inverse {
859 --button-back-color: #212121;
860 --button-fore-color: #f8f8f8; }
861 button.inverse:hover, button.inverse:focus, [type="button"].inverse:hover, [type="button"].inverse:focus, [type="submit"].inverse:hover, [type="submit"].inverse:focus, [type="reset"].inverse:hover, [type="reset"].inverse:focus, .button.inverse:hover, .button.inverse:focus, [role="button"].inverse:hover, [role="button"].inverse:focus {
862 --button-hover-back-color: #111; }
864 button.small, [type="button"].small, [type="submit"].small, [type="reset"].small, .button.small, [role="button"].small {
865 padding: calc(0.5 * var(--universal-padding)) calc(0.75 * var(--universal-padding));
866 margin: var(--universal-margin); }
868 button.large, [type="button"].large, [type="submit"].large, [type="reset"].large, .button.large, [role="button"].large {
869 padding: calc(1.5 * var(--universal-padding)) calc(2 * var(--universal-padding));
870 margin: var(--universal-margin); }
873 Definitions for navigation elements.
875 /* Navigation module CSS variable definitions */
876 :root {
877 --header-back-color: #f8f8f8;
878 --header-hover-back-color: #f0f0f0;
879 --header-fore-color: #444;
880 --header-border-color: #ddd;
881 --nav-back-color: #f8f8f8;
882 --nav-hover-back-color: #f0f0f0;
883 --nav-fore-color: #444;
884 --nav-border-color: #ddd;
885 --nav-link-color: #0277bd;
886 --footer-fore-color: #444;
887 --footer-back-color: #f8f8f8;
888 --footer-border-color: #ddd;
889 --footer-link-color: #0277bd;
890 --drawer-back-color: #f8f8f8;
891 --drawer-hover-back-color: #f0f0f0;
892 --drawer-border-color: #ddd;
893 --drawer-close-color: #444; }
895 header {
896 height: 3.1875rem;
897 background: var(--header-back-color);
898 color: var(--header-fore-color);
899 border-bottom: 0.0625rem solid var(--header-border-color);
900 padding: calc(var(--universal-padding) / 4) 0;
901 white-space: nowrap;
902 overflow-x: auto;
903 overflow-y: hidden; }
904 header.row {
905 box-sizing: content-box; }
906 header .logo {
907 color: var(--header-fore-color);
908 font-size: 1.75rem;
909 padding: var(--universal-padding) calc(2 * var(--universal-padding));
910 text-decoration: none; }
911 header button, header [type="button"], header .button, header [role="button"] {
912 box-sizing: border-box;
913 position: relative;
914 top: calc(0rem - var(--universal-padding) / 4);
915 height: calc(3.1875rem + var(--universal-padding) / 2);
916 background: var(--header-back-color);
917 line-height: calc(3.1875rem - var(--universal-padding) * 1.5);
918 text-align: center;
919 color: var(--header-fore-color);
920 border: 0;
921 border-radius: 0;
922 margin: 0;
923 text-transform: uppercase; }
924 header button:hover, header button:focus, header [type="button"]:hover, header [type="button"]:focus, header .button:hover, header .button:focus, header [role="button"]:hover, header [role="button"]:focus {
925 background: var(--header-hover-back-color); }
927 nav {
928 background: var(--nav-back-color);
929 color: var(--nav-fore-color);
930 border: 0.0625rem solid var(--nav-border-color);
931 border-radius: var(--universal-border-radius);
932 margin: var(--universal-margin); }
933 nav * {
934 padding: var(--universal-padding) calc(1.5 * var(--universal-padding)); }
935 nav a, nav a:visited {
936 display: block;
937 color: var(--nav-link-color);
938 border-radius: var(--universal-border-radius);
939 transition: background 0.3s; }
940 nav a:hover, nav a:focus, nav a:visited:hover, nav a:visited:focus {
941 text-decoration: none;
942 background: var(--nav-hover-back-color); }
943 nav .sublink-1 {
944 position: relative;
945 margin-left: calc(2 * var(--universal-padding)); }
946 nav .sublink-1:before {
947 position: absolute;
948 left: calc(var(--universal-padding) - 1 * var(--universal-padding));
949 top: -0.0625rem;
950 content: '';
951 height: 100%;
952 border: 0.0625rem solid var(--nav-border-color);
953 border-left: 0; }
954 nav .sublink-2 {
955 position: relative;
956 margin-left: calc(4 * var(--universal-padding)); }
957 nav .sublink-2:before {
958 position: absolute;
959 left: calc(var(--universal-padding) - 3 * var(--universal-padding));
960 top: -0.0625rem;
961 content: '';
962 height: 100%;
963 border: 0.0625rem solid var(--nav-border-color);
964 border-left: 0; }
966 footer {
967 background: var(--footer-back-color);
968 color: var(--footer-fore-color);
969 border-top: 0.0625rem solid var(--footer-border-color);
970 padding: calc(2 * var(--universal-padding)) var(--universal-padding);
971 font-size: 0.875rem; }
972 footer a, footer a:visited {
973 color: var(--footer-link-color); }
975 header.sticky {
976 position: -webkit-sticky;
977 position: sticky;
978 z-index: 1101;
979 top: 0; }
981 footer.sticky {
982 position: -webkit-sticky;
983 position: sticky;
984 z-index: 1101;
985 bottom: 0; }
987 .drawer-toggle:before {
988 display: inline-block;
989 position: relative;
990 vertical-align: bottom;
991 content: '\00a0\2261\00a0';
992 font-family: sans-serif;
993 font-size: 1.5em; }
994 @media screen and (min-width: 500px) {
995 .drawer-toggle:not(.persistent) {
996 display: none; } }
998 [type="checkbox"].drawer {
999 height: 1px;
1000 width: 1px;
1001 margin: -1px;
1002 overflow: hidden;
1003 position: absolute;
1004 clip: rect(0 0 0 0);
1005 -webkit-clip-path: inset(100%);
1006 clip-path: inset(100%); }
1007 [type="checkbox"].drawer + * {
1008 display: block;
1009 box-sizing: border-box;
1010 position: fixed;
1011 top: 0;
1012 width: 320px;
1013 height: 100vh;
1014 overflow-y: auto;
1015 background: var(--drawer-back-color);
1016 border: 0.0625rem solid var(--drawer-border-color);
1017 border-radius: 0;
1018 margin: 0;
1019 z-index: 1110;
1020 right: -320px;
1021 transition: right 0.3s; }
1022 [type="checkbox"].drawer + * .drawer-close {
1023 position: absolute;
1024 top: var(--universal-margin);
1025 right: var(--universal-margin);
1026 z-index: 1111;
1027 width: 2rem;
1028 height: 2rem;
1029 border-radius: var(--universal-border-radius);
1030 padding: var(--universal-padding);
1031 margin: 0;
1032 cursor: pointer;
1033 transition: background 0.3s; }
1034 [type="checkbox"].drawer + * .drawer-close:before {
1035 display: block;
1036 content: '\00D7';
1037 color: var(--drawer-close-color);
1038 position: relative;
1039 font-family: sans-serif;
1040 font-size: 2rem;
1041 line-height: 1;
1042 text-align: center; }
1043 [type="checkbox"].drawer + * .drawer-close:hover, [type="checkbox"].drawer + * .drawer-close:focus {
1044 background: var(--drawer-hover-back-color); }
1045 @media screen and (max-width: 320px) {
1046 [type="checkbox"].drawer + * {
1047 width: 100%; } }
1048 [type="checkbox"].drawer:checked + * {
1049 right: 0; }
1050 @media screen and (min-width: 500px) {
1051 [type="checkbox"].drawer:not(.persistent) + * {
1052 position: static;
1053 height: 100%;
1054 z-index: 1100; }
1055 [type="checkbox"].drawer:not(.persistent) + * .drawer-close {
1056 display: none; } }
1059 Definitions for the responsive table component.
1061 /* Table module CSS variable definitions. */
1062 :root {
1063 --table-border-color: #aaa;
1064 --table-border-separator-color: #666;
1065 --table-head-back-color: #e6e6e6;
1066 --table-head-fore-color: #111;
1067 --table-body-back-color: #f8f8f8;
1068 --table-body-fore-color: #111;
1069 --table-body-alt-back-color: #eee; }
1071 table {
1072 border-collapse: separate;
1073 border-spacing: 0;
1074 : margin: calc(1.5 * var(--universal-margin)) var(--universal-margin);
1075 display: flex;
1076 flex: 0 1 auto;
1077 flex-flow: row wrap;
1078 padding: var(--universal-padding);
1079 padding-top: 0;
1080 margin: calc(1.5 * var(--universal-margin)) var(--universal-margin); }
1081 table caption {
1082 font-size: 1.25 * rem;
1083 margin: calc(2 * var(--universal-margin)) 0;
1084 max-width: 100%;
1085 flex: 0 0 100%;
1086 text-align: left;}
1087 table thead, table tbody {
1088 display: flex;
1089 flex-flow: row wrap;
1090 border: 0.0625rem solid var(--table-border-color); }
1091 table thead {
1092 z-index: 999;
1093 border-radius: var(--universal-border-radius) var(--universal-border-radius) 0 0;
1094 border-bottom: 0.0625rem solid var(--table-border-separator-color); }
1095 table tbody {
1096 border-top: 0;
1097 margin-top: calc(0 - var(--universal-margin));
1098 border-radius: 0 0 var(--universal-border-radius) var(--universal-border-radius); }
1099 table tr {
1100 display: flex;
1101 padding: 0; }
1102 table th, table td {
1103 padding: calc(0.5 * var(--universal-padding));
1104 font-size: 0.9rem; }
1105 table th {
1106 text-align: left;
1107 background: var(--table-head-back-color);
1108 color: var(--table-head-fore-color); }
1109 table td {
1110 background: var(--table-body-back-color);
1111 color: var(--table-body-fore-color);
1112 border-top: 0.0625rem solid var(--table-border-color); }
1114 table:not(.horizontal) {
1115 overflow: auto;
1116 max-height: 850px; }
1117 table:not(.horizontal) thead, table:not(.horizontal) tbody {
1118 max-width: 100%;
1119 flex: 0 0 100%; }
1120 table:not(.horizontal) tr {
1121 flex-flow: row wrap;
1122 flex: 0 0 100%; }
1123 table:not(.horizontal) th, table:not(.horizontal) td {
1124 flex: 1 0 0%;
1125 overflow: hidden;
1126 text-overflow: ellipsis; }
1127 table:not(.horizontal) thead {
1128 position: sticky;
1129 top: 0; }
1130 table:not(.horizontal) tbody tr:first-child td {
1131 border-top: 0; }
1133 table.horizontal {
1134 border: 0; }
1135 table.horizontal thead, table.horizontal tbody {
1136 border: 0;
1137 flex-flow: row nowrap; }
1138 table.horizontal tbody {
1139 overflow: auto;
1140 justify-content: space-between;
1141 flex: 1 0 0;
1142 margin-left: calc( 4 * var(--universal-margin));
1143 padding-bottom: calc(var(--universal-padding) / 4); }
1144 table.horizontal tr {
1145 flex-direction: column;
1146 flex: 1 0 auto; }
1147 table.horizontal th, table.horizontal td {
1148 width: 100%;
1149 border: 0;
1150 border-bottom: 0.0625rem solid var(--table-border-color); }
1151 table.horizontal th:not(:first-child), table.horizontal td:not(:first-child) {
1152 border-top: 0; }
1153 table.horizontal th {
1154 text-align: right;
1155 border-left: 0.0625rem solid var(--table-border-color);
1156 border-right: 0.0625rem solid var(--table-border-separator-color); }
1157 table.horizontal thead tr:first-child {
1158 padding-left: 0; }
1159 table.horizontal th:first-child, table.horizontal td:first-child {
1160 border-top: 0.0625rem solid var(--table-border-color); }
1161 table.horizontal tbody tr:last-child td {
1162 border-right: 0.0625rem solid var(--table-border-color); }
1163 table.horizontal tbody tr:last-child td:first-child {
1164 border-top-right-radius: 0.25rem; }
1165 table.horizontal tbody tr:last-child td:last-child {
1166 border-bottom-right-radius: 0.25rem; }
1167 table.horizontal thead tr:first-child th:first-child {
1168 border-top-left-radius: 0.25rem; }
1169 table.horizontal thead tr:first-child th:last-child {
1170 border-bottom-left-radius: 0.25rem; }
1172 @media screen and (max-width: 499px) {
1173 table, table.horizontal {
1174 border-collapse: collapse;
1175 border: 0;
1176 width: 100%;
1177 display: table; }
1178 table thead, table th, table.horizontal thead, table.horizontal th {
1179 border: 0;
1180 height: 1px;
1181 width: 1px;
1182 margin: -1px;
1183 overflow: hidden;
1184 padding: 0;
1185 position: absolute;
1186 clip: rect(0 0 0 0);
1187 -webkit-clip-path: inset(100%);
1188 clip-path: inset(100%); }
1189 table tbody, table.horizontal tbody {
1190 border: 0;
1191 display: table-row-group; }
1192 table tr, table.horizontal tr {
1193 display: block;
1194 border: 0.0625rem solid var(--table-border-color);
1195 border-radius: var(--universal-border-radius);
1196 background: #fafafa;
1197 padding: var(--universal-padding);
1198 margin: var(--universal-margin);
1199 margin-bottom: calc(2 * var(--universal-margin)); }
1200 table th, table td, table.horizontal th, table.horizontal td {
1201 width: auto; }
1202 table td, table.horizontal td {
1203 display: block;
1204 border: 0;
1205 text-align: right; }
1206 table td:before, table.horizontal td:before {
1207 content: attr(data-label);
1208 float: left;
1209 font-weight: 600; }
1210 table th:first-child, table td:first-child, table.horizontal th:first-child, table.horizontal td:first-child {
1211 border-top: 0; }
1212 table tbody tr:last-child td, table.horizontal tbody tr:last-child td {
1213 border-right: 0; } }
1214 :root {
1215 --table-body-alt-back-color: #eee; }
1217 table tr:nth-of-type(2n) > td {
1218 background: var(--table-body-alt-back-color); }
1220 @media screen and (max-width: 500px) {
1221 table tr:nth-of-type(2n) {
1222 background: var(--table-body-alt-back-color); } }
1223 :root {
1224 --table-body-hover-back-color: #90caf9; }
1226 table.hoverable tr:hover, table.hoverable tr:hover > td, table.hoverable tr:focus, table.hoverable tr:focus > td {
1227 background: var(--table-body-hover-back-color); }
1229 @media screen and (max-width: 500px) {
1230 table.hoverable tr:hover, table.hoverable tr:hover > td, table.hoverable tr:focus, table.hoverable tr:focus > td {
1231 background: var(--table-body-hover-back-color); } }
1233 Definitions for contextual background elements, toasts and tooltips.
1235 /* Contextual module CSS variable definitions */
1236 :root {
1237 --mark-back-color: #0277bd;
1238 --mark-fore-color: #fafafa; }
1240 mark {
1241 background: var(--mark-back-color);
1242 color: var(--mark-fore-color);
1243 font-size: 0.95em;
1244 line-height: 1em;
1245 border-radius: var(--universal-border-radius);
1246 padding: calc(var(--universal-padding) / 4) calc(var(--universal-padding) / 2); }
1247 mark.inline-block {
1248 display: inline-block;
1249 font-size: 1em;
1250 line-height: 1.5;
1251 padding: calc(var(--universal-padding) / 2) var(--universal-padding); }
1253 :root {
1254 --toast-back-color: #424242;
1255 --toast-fore-color: #fafafa; }
1257 .toast {
1258 position: fixed;
1259 bottom: calc(var(--universal-margin) * 3);
1260 left: 50%;
1261 transform: translate(-50%, -50%);
1262 z-index: 1111;
1263 color: var(--toast-fore-color);
1264 background: var(--toast-back-color);
1265 border-radius: calc(var(--universal-border-radius) * 16);
1266 padding: var(--universal-padding) calc(var(--universal-padding) * 3); }
1268 :root {
1269 --tooltip-back-color: #212121;
1270 --tooltip-fore-color: #fafafa; }
1272 .tooltip {
1273 position: relative;
1274 display: inline-block; }
1275 .tooltip:before, .tooltip:after {
1276 position: absolute;
1277 opacity: 0;
1278 clip: rect(0 0 0 0);
1279 -webkit-clip-path: inset(100%);
1280 clip-path: inset(100%);
1281 transition: all 0.3s;
1282 z-index: 1010;
1283 left: 50%; }
1284 .tooltip:not(.bottom):before, .tooltip:not(.bottom):after {
1285 bottom: 75%; }
1286 .tooltip.bottom:before, .tooltip.bottom:after {
1287 top: 75%; }
1288 .tooltip:hover:before, .tooltip:hover:after, .tooltip:focus:before, .tooltip:focus:after {
1289 opacity: 1;
1290 clip: auto;
1291 -webkit-clip-path: inset(0%);
1292 clip-path: inset(0%); }
1293 .tooltip:before {
1294 content: '';
1295 background: transparent;
1296 border: var(--universal-margin) solid transparent;
1297 left: calc(50% - var(--universal-margin)); }
1298 .tooltip:not(.bottom):before {
1299 border-top-color: #212121; }
1300 .tooltip.bottom:before {
1301 border-bottom-color: #212121; }
1302 .tooltip:after {
1303 content: attr(aria-label);
1304 color: var(--tooltip-fore-color);
1305 background: var(--tooltip-back-color);
1306 border-radius: var(--universal-border-radius);
1307 padding: var(--universal-padding);
1308 white-space: nowrap;
1309 transform: translateX(-50%); }
1310 .tooltip:not(.bottom):after {
1311 margin-bottom: calc(2 * var(--universal-margin)); }
1312 .tooltip.bottom:after {
1313 margin-top: calc(2 * var(--universal-margin)); }
1315 :root {
1316 --modal-overlay-color: rgba(0, 0, 0, 0.45);
1317 --modal-close-color: #444;
1318 --modal-close-hover-color: #f0f0f0; }
1320 [type="checkbox"].modal {
1321 height: 1px;
1322 width: 1px;
1323 margin: -1px;
1324 overflow: hidden;
1325 position: absolute;
1326 clip: rect(0 0 0 0);
1327 -webkit-clip-path: inset(100%);
1328 clip-path: inset(100%); }
1329 [type="checkbox"].modal + div {
1330 position: fixed;
1331 top: 0;
1332 left: 0;
1333 display: none;
1334 width: 100vw;
1335 height: 100vh;
1336 background: var(--modal-overlay-color); }
1337 [type="checkbox"].modal + div .card {
1338 margin: 0 auto;
1339 max-height: 50vh;
1340 overflow: auto; }
1341 [type="checkbox"].modal + div .card .modal-close {
1342 position: absolute;
1343 top: 0;
1344 right: 0;
1345 width: 1.75rem;
1346 height: 1.75rem;
1347 border-radius: var(--universal-border-radius);
1348 padding: var(--universal-padding);
1349 margin: 0;
1350 cursor: pointer;
1351 transition: background 0.3s; }
1352 [type="checkbox"].modal + div .card .modal-close:before {
1353 display: block;
1354 content: '\00D7';
1355 color: var(--modal-close-color);
1356 position: relative;
1357 font-family: sans-serif;
1358 font-size: 1.75rem;
1359 line-height: 1;
1360 text-align: center; }
1361 [type="checkbox"].modal + div .card .modal-close:hover, [type="checkbox"].modal + div .card .modal-close:focus {
1362 background: var(--modal-close-hover-color); }
1363 [type="checkbox"].modal:checked + div {
1364 display: flex;
1365 flex: 0 1 auto;
1366 z-index: 1200; }
1367 [type="checkbox"].modal:checked + div .card .modal-close {
1368 z-index: 1211; }
1370 :root {
1371 --collapse-label-back-color: #e8e8e8;
1372 --collapse-label-fore-color: #212121;
1373 --collapse-label-hover-back-color: #f0f0f0;
1374 --collapse-selected-label-back-color: #ececec;
1375 --collapse-border-color: #ddd;
1376 --collapse-content-back-color: #fafafa;
1377 --collapse-selected-label-border-color: #0277bd; }
1379 .collapse {
1380 width: calc(100% - 2 * var(--universal-margin));
1381 opacity: 1;
1382 display: flex;
1383 flex-direction: column;
1384 margin: var(--universal-margin);
1385 border-radius: var(--universal-border-radius); }
1386 .collapse > [type="radio"], .collapse > [type="checkbox"] {
1387 height: 1px;
1388 width: 1px;
1389 margin: -1px;
1390 overflow: hidden;
1391 position: absolute;
1392 clip: rect(0 0 0 0);
1393 -webkit-clip-path: inset(100%);
1394 clip-path: inset(100%); }
1395 .collapse > label {
1396 flex-grow: 1;
1397 display: inline-block;
1398 height: 1.5rem;
1399 cursor: pointer;
1400 transition: background 0.3s;
1401 color: var(--collapse-label-fore-color);
1402 background: var(--collapse-label-back-color);
1403 border: 0.0625rem solid var(--collapse-border-color);
1404 padding: calc(1.5 * var(--universal-padding)); }
1405 .collapse > label:hover, .collapse > label:focus {
1406 background: var(--collapse-label-hover-back-color); }
1407 .collapse > label + div {
1408 flex-basis: auto;
1409 height: 1px;
1410 width: 1px;
1411 margin: -1px;
1412 overflow: hidden;
1413 position: absolute;
1414 clip: rect(0 0 0 0);
1415 -webkit-clip-path: inset(100%);
1416 clip-path: inset(100%);
1417 transition: max-height 0.3s;
1418 max-height: 1px; }
1419 .collapse > :checked + label {
1420 background: var(--collapse-selected-label-back-color);
1421 border-bottom-color: var(--collapse-selected-label-border-color); }
1422 .collapse > :checked + label + div {
1423 box-sizing: border-box;
1424 position: relative;
1425 width: 100%;
1426 height: auto;
1427 overflow: auto;
1428 margin: 0;
1429 background: var(--collapse-content-back-color);
1430 border: 0.0625rem solid var(--collapse-border-color);
1431 border-top: 0;
1432 padding: var(--universal-padding);
1433 clip: auto;
1434 -webkit-clip-path: inset(0%);
1435 clip-path: inset(0%);
1436 max-height: 850px; }
1437 .collapse > label:not(:first-of-type) {
1438 border-top: 0; }
1439 .collapse > label:first-of-type {
1440 border-radius: var(--universal-border-radius) var(--universal-border-radius) 0 0; }
1441 .collapse > label:last-of-type:not(:first-of-type) {
1442 border-radius: 0 0 var(--universal-border-radius) var(--universal-border-radius); }
1443 .collapse > label:last-of-type:first-of-type {
1444 border-radius: var(--universal-border-radius); }
1445 .collapse > :checked:last-of-type:not(:first-of-type) + label {
1446 border-radius: 0; }
1447 .collapse > :checked:last-of-type + label + div {
1448 border-radius: 0 0 var(--universal-border-radius) var(--universal-border-radius); }
1451 Custom elements for contextual background elements, toasts and tooltips.
1453 mark.secondary {
1454 --mark-back-color: #d32f2f; }
1456 mark.tertiary {
1457 --mark-back-color: #308732; }
1459 mark.tag {
1460 padding: calc(var(--universal-padding)/2) var(--universal-padding);
1461 border-radius: 1em; }
1464 Definitions for progress elements and spinners.
1466 /* Progess module CSS variable definitions */
1467 :root {
1468 --progress-back-color: #ddd;
1469 --progress-fore-color: #555; }
1471 progress {
1472 display: block;
1473 vertical-align: baseline;
1474 -webkit-appearance: none;
1475 -moz-appearance: none;
1476 appearance: none;
1477 height: 0.75rem;
1478 width: calc(100% - 2 * var(--universal-margin));
1479 margin: var(--universal-margin);
1480 border: 0;
1481 border-radius: calc(2 * var(--universal-border-radius));
1482 background: var(--progress-back-color);
1483 color: var(--progress-fore-color); }
1484 progress::-webkit-progress-value {
1485 background: var(--progress-fore-color);
1486 border-top-left-radius: calc(2 * var(--universal-border-radius));
1487 border-bottom-left-radius: calc(2 * var(--universal-border-radius)); }
1488 progress::-webkit-progress-bar {
1489 background: var(--progress-back-color); }
1490 progress::-moz-progress-bar {
1491 background: var(--progress-fore-color);
1492 border-top-left-radius: calc(2 * var(--universal-border-radius));
1493 border-bottom-left-radius: calc(2 * var(--universal-border-radius)); }
1494 progress[value="1000"]::-webkit-progress-value {
1495 border-radius: calc(2 * var(--universal-border-radius)); }
1496 progress[value="1000"]::-moz-progress-bar {
1497 border-radius: calc(2 * var(--universal-border-radius)); }
1498 progress.inline {
1499 display: inline-block;
1500 vertical-align: middle;
1501 width: 60%; }
1503 :root {
1504 --spinner-back-color: #ddd;
1505 --spinner-fore-color: #555; }
1507 @keyframes spinner-donut-anim {
1508 0% {
1509 transform: rotate(0deg); }
1510 100% {
1511 transform: rotate(360deg); } }
1512 .spinner {
1513 display: inline-block;
1514 margin: var(--universal-margin);
1515 border: 0.25rem solid var(--spinner-back-color);
1516 border-left: 0.25rem solid var(--spinner-fore-color);
1517 border-radius: 50%;
1518 width: 1.25rem;
1519 height: 1.25rem;
1520 animation: spinner-donut-anim 1.2s linear infinite; }
1523 Custom elements for progress bars and spinners.
1525 progress.primary {
1526 --progress-fore-color: #1976d2; }
1528 progress.secondary {
1529 --progress-fore-color: #d32f2f; }
1531 progress.tertiary {
1532 --progress-fore-color: #308732; }
1534 .spinner.primary {
1535 --spinner-fore-color: #1976d2; }
1537 .spinner.secondary {
1538 --spinner-fore-color: #d32f2f; }
1540 .spinner.tertiary {
1541 --spinner-fore-color: #308732; }
1544 Definitions for icons - powered by Feather (https://feathericons.com/).
1546 span[class^='icon-'] {
1547 display: inline-block;
1548 height: 1em;
1549 width: 1em;
1550 vertical-align: -0.125em;
1551 background-size: contain;
1552 margin: 0 calc(var(--universal-margin) / 4); }
1553 span[class^='icon-'].secondary {
1554 -webkit-filter: invert(25%);
1555 filter: invert(25%); }
1556 span[class^='icon-'].inverse {
1557 -webkit-filter: invert(100%);
1558 filter: invert(100%); }
1560 span.icon-alert {
1561 background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23111' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'%3E%3C/circle%3E%3Cline x1='12' y1='8' x2='12' y2='12'%3E%3C/line%3E%3Cline x1='12' y1='16' x2='12' y2='16'%3E%3C/line%3E%3C/svg%3E"); }
1562 span.icon-bookmark {
1563 background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23111' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M19 21l-7-5-7 5V5a2 2 0 0 1 2-2h10a2 2 0 0 1 2 2z'%3E%3C/path%3E%3C/svg%3E"); }
1564 span.icon-calendar {
1565 background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23111' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='18' rx='2' ry='2'%3E%3C/rect%3E%3Cline x1='16' y1='2' x2='16' y2='6'%3E%3C/line%3E%3Cline x1='8' y1='2' x2='8' y2='6'%3E%3C/line%3E%3Cline x1='3' y1='10' x2='21' y2='10'%3E%3C/line%3E%3C/svg%3E"); }
1566 span.icon-credit {
1567 background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23111' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='1' y='4' width='22' height='16' rx='2' ry='2'%3E%3C/rect%3E%3Cline x1='1' y1='10' x2='23' y2='10'%3E%3C/line%3E%3C/svg%3E"); }
1568 span.icon-edit {
1569 background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23111' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 14.66V20a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2V6a2 2 0 0 1 2-2h5.34'%3E%3C/path%3E%3Cpolygon points='18 2 22 6 12 16 8 16 8 12 18 2'%3E%3C/polygon%3E%3C/svg%3E"); }
1570 span.icon-link {
1571 background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23111' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6'%3E%3C/path%3E%3Cpolyline points='15 3 21 3 21 9'%3E%3C/polyline%3E%3Cline x1='10' y1='14' x2='21' y2='3'%3E%3C/line%3E%3C/svg%3E"); }
1572 span.icon-help {
1573 background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23111' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3'%3E%3C/path%3E%3Ccircle cx='12' cy='12' r='10'%3E%3C/circle%3E%3Cline x1='12' y1='17' x2='12' y2='17'%3E%3C/line%3E%3C/svg%3E"); }
1574 span.icon-home {
1575 background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23111' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 9l9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z'%3E%3C/path%3E%3Cpolyline points='9 22 9 12 15 12 15 22'%3E%3C/polyline%3E%3C/svg%3E"); }
1576 span.icon-info {
1577 background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23111' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'%3E%3C/circle%3E%3Cline x1='12' y1='16' x2='12' y2='12'%3E%3C/line%3E%3Cline x1='12' y1='8' x2='12' y2='8'%3E%3C/line%3E%3C/svg%3E"); }
1578 span.icon-lock {
1579 background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23111' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='11' width='18' height='11' rx='2' ry='2'%3E%3C/rect%3E%3Cpath d='M7 11V7a5 5 0 0 1 10 0v4'%3E%3C/path%3E%3C/svg%3E"); }
1580 span.icon-mail {
1581 background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23111' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 4h16c1.1 0 2 .9 2 2v12c0 1.1-.9 2-2 2H4c-1.1 0-2-.9-2-2V6c0-1.1.9-2 2-2z'%3E%3C/path%3E%3Cpolyline points='22,6 12,13 2,6'%3E%3C/polyline%3E%3C/svg%3E"); }
1582 span.icon-location {
1583 background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23111' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 10c0 7-9 13-9 13s-9-6-9-13a9 9 0 0 1 18 0z'%3E%3C/path%3E%3Ccircle cx='12' cy='10' r='3'%3E%3C/circle%3E%3C/svg%3E"); }
1584 span.icon-phone {
1585 background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23111' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6 19.79 19.79 0 0 1-3.07-8.67A2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72 12.84 12.84 0 0 0 .7 2.81 2 2 0 0 1-.45 2.11L8.09 9.91a16 16 0 0 0 6 6l1.27-1.27a2 2 0 0 1 2.11-.45 12.84 12.84 0 0 0 2.81.7A2 2 0 0 1 22 16.92z'%3E%3C/path%3E%3C/svg%3E"); }
1586 span.icon-rss {
1587 background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23111' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 11a9 9 0 0 1 9 9'%3E%3C/path%3E%3Cpath d='M4 4a16 16 0 0 1 16 16'%3E%3C/path%3E%3Ccircle cx='5' cy='19' r='1'%3E%3C/circle%3E%3C/svg%3E"); }
1588 span.icon-search {
1589 background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23111' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'%3E%3C/circle%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'%3E%3C/line%3E%3C/svg%3E"); }
1590 span.icon-settings {
1591 background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23111' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='3'%3E%3C/circle%3E%3Cpath d='M19.4 15a1.65 1.65 0 0 0 .33 1.82l.06.06a2 2 0 0 1 0 2.83 2 2 0 0 1-2.83 0l-.06-.06a1.65 1.65 0 0 0-1.82-.33 1.65 1.65 0 0 0-1 1.51V21a2 2 0 0 1-2 2 2 2 0 0 1-2-2v-.09A1.65 1.65 0 0 0 9 19.4a1.65 1.65 0 0 0-1.82.33l-.06.06a2 2 0 0 1-2.83 0 2 2 0 0 1 0-2.83l.06-.06a1.65 1.65 0 0 0 .33-1.82 1.65 1.65 0 0 0-1.51-1H3a2 2 0 0 1-2-2 2 2 0 0 1 2-2h.09A1.65 1.65 0 0 0 4.6 9a1.65 1.65 0 0 0-.33-1.82l-.06-.06a2 2 0 0 1 0-2.83 2 2 0 0 1 2.83 0l.06.06a1.65 1.65 0 0 0 1.82.33H9a1.65 1.65 0 0 0 1-1.51V3a2 2 0 0 1 2-2 2 2 0 0 1 2 2v.09a1.65 1.65 0 0 0 1 1.51 1.65 1.65 0 0 0 1.82-.33l.06-.06a2 2 0 0 1 2.83 0 2 2 0 0 1 0 2.83l-.06.06a1.65 1.65 0 0 0-.33 1.82V9a1.65 1.65 0 0 0 1.51 1H21a2 2 0 0 1 2 2 2 2 0 0 1-2 2h-.09a1.65 1.65 0 0 0-1.51 1z'%3E%3C/path%3E%3C/svg%3E"); }
1592 span.icon-share {
1593 background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23111' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='18' cy='5' r='3'%3E%3C/circle%3E%3Ccircle cx='6' cy='12' r='3'%3E%3C/circle%3E%3Ccircle cx='18' cy='19' r='3'%3E%3C/circle%3E%3Cline x1='8.59' y1='13.51' x2='15.42' y2='17.49'%3E%3C/line%3E%3Cline x1='15.41' y1='6.51' x2='8.59' y2='10.49'%3E%3C/line%3E%3C/svg%3E"); }
1594 span.icon-cart {
1595 background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23111' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='9' cy='21' r='1'%3E%3C/circle%3E%3Ccircle cx='20' cy='21' r='1'%3E%3C/circle%3E%3Cpath d='M1 1h4l2.68 13.39a2 2 0 0 0 2 1.61h9.72a2 2 0 0 0 2-1.61L23 6H6'%3E%3C/path%3E%3C/svg%3E"); }
1596 span.icon-upload {
1597 background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23111' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4'%3E%3C/path%3E%3Cpolyline points='17 8 12 3 7 8'%3E%3C/polyline%3E%3Cline x1='12' y1='3' x2='12' y2='15'%3E%3C/line%3E%3C/svg%3E"); }
1598 span.icon-user {
1599 background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23111' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2'%3E%3C/path%3E%3Ccircle cx='12' cy='7' r='4'%3E%3C/circle%3E%3C/svg%3E"); }
1602 Definitions for utilities and helper classes.
1604 /* Utility module CSS variable definitions */
1605 :root {
1606 --generic-border-color: rgba(0, 0, 0, 0.3);
1607 --generic-box-shadow: 0 0.25rem 0.25rem 0 rgba(0, 0, 0, 0.125), 0 0.125rem 0.125rem -0.125rem rgba(0, 0, 0, 0.25); }
1609 .hidden {
1610 display: none !important; }
1612 .visually-hidden {
1613 position: absolute !important;
1614 width: 1px !important;
1615 height: 1px !important;
1616 margin: -1px !important;
1617 border: 0 !important;
1618 padding: 0 !important;
1619 clip: rect(0 0 0 0) !important;
1620 -webkit-clip-path: inset(100%) !important;
1621 clip-path: inset(100%) !important;
1622 overflow: hidden !important; }
1624 .bordered {
1625 border: 0.0625rem solid var(--generic-border-color) !important; }
1627 .rounded {
1628 border-radius: var(--universal-border-radius) !important; }
1630 .circular {
1631 border-radius: 50% !important; }
1633 .shadowed {
1634 box-shadow: var(--generic-box-shadow) !important; }
1636 .responsive-margin {
1637 margin: calc(var(--universal-margin) / 4) !important; }
1638 @media screen and (min-width: 500px) {
1639 .responsive-margin {
1640 margin: calc(var(--universal-margin) / 2) !important; } }
1641 @media screen and (min-width: 1280px) {
1642 .responsive-margin {
1643 margin: var(--universal-margin) !important; } }
1645 .responsive-padding {
1646 padding: calc(var(--universal-padding) / 4) !important; }
1647 @media screen and (min-width: 500px) {
1648 .responsive-padding {
1649 padding: calc(var(--universal-padding) / 2) !important; } }
1650 @media screen and (min-width: 1280px) {
1651 .responsive-padding {
1652 padding: var(--universal-padding) !important; } }
1654 @media screen and (max-width: 499px) {
1655 .hidden-sm {
1656 display: none !important; } }
1657 @media screen and (min-width: 500px) and (max-width: 1279px) {
1658 .hidden-md {
1659 display: none !important; } }
1660 @media screen and (min-width: 1280px) {
1661 .hidden-lg {
1662 display: none !important; } }
1663 @media screen and (max-width: 499px) {
1664 .visually-hidden-sm {
1665 position: absolute !important;
1666 width: 1px !important;
1667 height: 1px !important;
1668 margin: -1px !important;
1669 border: 0 !important;
1670 padding: 0 !important;
1671 clip: rect(0 0 0 0) !important;
1672 -webkit-clip-path: inset(100%) !important;
1673 clip-path: inset(100%) !important;
1674 overflow: hidden !important; } }
1675 @media screen and (min-width: 500px) and (max-width: 1279px) {
1676 .visually-hidden-md {
1677 position: absolute !important;
1678 width: 1px !important;
1679 height: 1px !important;
1680 margin: -1px !important;
1681 border: 0 !important;
1682 padding: 0 !important;
1683 clip: rect(0 0 0 0) !important;
1684 -webkit-clip-path: inset(100%) !important;
1685 clip-path: inset(100%) !important;
1686 overflow: hidden !important; } }
1687 @media screen and (min-width: 1280px) {
1688 .visually-hidden-lg {
1689 position: absolute !important;
1690 width: 1px !important;
1691 height: 1px !important;
1692 margin: -1px !important;
1693 border: 0 !important;
1694 padding: 0 !important;
1695 clip: rect(0 0 0 0) !important;
1696 -webkit-clip-path: inset(100%) !important;
1697 clip-path: inset(100%) !important;
1698 overflow: hidden !important; } }
1700 /*# sourceMappingURL=mini-default.css.map */