UNPKG

35.2 kBCSSView Raw
1/**
2 * Applies styles for users in high contrast mode. Note that this only applies
3 * to Microsoft browsers. Chrome can be included by checking for the `html[hc]`
4 * attribute, however Chrome handles high contrast differently.
5 */
6/** The mixins below are shared between md-menu and md-select */
7/**
8 * This mixin adds the correct panel transform styles based
9 * on the direction that the menu panel opens.
10 */
11/**
12 * Applies styles for users in high contrast mode. Note that this only applies
13 * to Microsoft browsers. Chrome can be included by checking for the `html[hc]`
14 * attribute, however Chrome handles high contrast differently.
15 */
16/**
17 * This mixin contains shared option styles between the select and
18 * autocomplete components.
19 */
20.mat-elevation-z0 {
21 box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0.2), 0px 0px 0px 0px rgba(0, 0, 0, 0.14), 0px 0px 0px 0px rgba(0, 0, 0, 0.12); }
22
23.mat-elevation-z1 {
24 box-shadow: 0px 2px 1px -1px rgba(0, 0, 0, 0.2), 0px 1px 1px 0px rgba(0, 0, 0, 0.14), 0px 1px 3px 0px rgba(0, 0, 0, 0.12); }
25
26.mat-elevation-z2 {
27 box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, 0.12); }
28
29.mat-elevation-z3 {
30 box-shadow: 0px 3px 3px -2px rgba(0, 0, 0, 0.2), 0px 3px 4px 0px rgba(0, 0, 0, 0.14), 0px 1px 8px 0px rgba(0, 0, 0, 0.12); }
31
32.mat-elevation-z4 {
33 box-shadow: 0px 2px 4px -1px rgba(0, 0, 0, 0.2), 0px 4px 5px 0px rgba(0, 0, 0, 0.14), 0px 1px 10px 0px rgba(0, 0, 0, 0.12); }
34
35.mat-elevation-z5 {
36 box-shadow: 0px 3px 5px -1px rgba(0, 0, 0, 0.2), 0px 5px 8px 0px rgba(0, 0, 0, 0.14), 0px 1px 14px 0px rgba(0, 0, 0, 0.12); }
37
38.mat-elevation-z6 {
39 box-shadow: 0px 3px 5px -1px rgba(0, 0, 0, 0.2), 0px 6px 10px 0px rgba(0, 0, 0, 0.14), 0px 1px 18px 0px rgba(0, 0, 0, 0.12); }
40
41.mat-elevation-z7 {
42 box-shadow: 0px 4px 5px -2px rgba(0, 0, 0, 0.2), 0px 7px 10px 1px rgba(0, 0, 0, 0.14), 0px 2px 16px 1px rgba(0, 0, 0, 0.12); }
43
44.mat-elevation-z8 {
45 box-shadow: 0px 5px 5px -3px rgba(0, 0, 0, 0.2), 0px 8px 10px 1px rgba(0, 0, 0, 0.14), 0px 3px 14px 2px rgba(0, 0, 0, 0.12); }
46
47.mat-elevation-z9 {
48 box-shadow: 0px 5px 6px -3px rgba(0, 0, 0, 0.2), 0px 9px 12px 1px rgba(0, 0, 0, 0.14), 0px 3px 16px 2px rgba(0, 0, 0, 0.12); }
49
50.mat-elevation-z10 {
51 box-shadow: 0px 6px 6px -3px rgba(0, 0, 0, 0.2), 0px 10px 14px 1px rgba(0, 0, 0, 0.14), 0px 4px 18px 3px rgba(0, 0, 0, 0.12); }
52
53.mat-elevation-z11 {
54 box-shadow: 0px 6px 7px -4px rgba(0, 0, 0, 0.2), 0px 11px 15px 1px rgba(0, 0, 0, 0.14), 0px 4px 20px 3px rgba(0, 0, 0, 0.12); }
55
56.mat-elevation-z12 {
57 box-shadow: 0px 7px 8px -4px rgba(0, 0, 0, 0.2), 0px 12px 17px 2px rgba(0, 0, 0, 0.14), 0px 5px 22px 4px rgba(0, 0, 0, 0.12); }
58
59.mat-elevation-z13 {
60 box-shadow: 0px 7px 8px -4px rgba(0, 0, 0, 0.2), 0px 13px 19px 2px rgba(0, 0, 0, 0.14), 0px 5px 24px 4px rgba(0, 0, 0, 0.12); }
61
62.mat-elevation-z14 {
63 box-shadow: 0px 7px 9px -4px rgba(0, 0, 0, 0.2), 0px 14px 21px 2px rgba(0, 0, 0, 0.14), 0px 5px 26px 4px rgba(0, 0, 0, 0.12); }
64
65.mat-elevation-z15 {
66 box-shadow: 0px 8px 9px -5px rgba(0, 0, 0, 0.2), 0px 15px 22px 2px rgba(0, 0, 0, 0.14), 0px 6px 28px 5px rgba(0, 0, 0, 0.12); }
67
68.mat-elevation-z16 {
69 box-shadow: 0px 8px 10px -5px rgba(0, 0, 0, 0.2), 0px 16px 24px 2px rgba(0, 0, 0, 0.14), 0px 6px 30px 5px rgba(0, 0, 0, 0.12); }
70
71.mat-elevation-z17 {
72 box-shadow: 0px 8px 11px -5px rgba(0, 0, 0, 0.2), 0px 17px 26px 2px rgba(0, 0, 0, 0.14), 0px 6px 32px 5px rgba(0, 0, 0, 0.12); }
73
74.mat-elevation-z18 {
75 box-shadow: 0px 9px 11px -5px rgba(0, 0, 0, 0.2), 0px 18px 28px 2px rgba(0, 0, 0, 0.14), 0px 7px 34px 6px rgba(0, 0, 0, 0.12); }
76
77.mat-elevation-z19 {
78 box-shadow: 0px 9px 12px -6px rgba(0, 0, 0, 0.2), 0px 19px 29px 2px rgba(0, 0, 0, 0.14), 0px 7px 36px 6px rgba(0, 0, 0, 0.12); }
79
80.mat-elevation-z20 {
81 box-shadow: 0px 10px 13px -6px rgba(0, 0, 0, 0.2), 0px 20px 31px 3px rgba(0, 0, 0, 0.14), 0px 8px 38px 7px rgba(0, 0, 0, 0.12); }
82
83.mat-elevation-z21 {
84 box-shadow: 0px 10px 13px -6px rgba(0, 0, 0, 0.2), 0px 21px 33px 3px rgba(0, 0, 0, 0.14), 0px 8px 40px 7px rgba(0, 0, 0, 0.12); }
85
86.mat-elevation-z22 {
87 box-shadow: 0px 10px 14px -6px rgba(0, 0, 0, 0.2), 0px 22px 35px 3px rgba(0, 0, 0, 0.14), 0px 8px 42px 7px rgba(0, 0, 0, 0.12); }
88
89.mat-elevation-z23 {
90 box-shadow: 0px 11px 14px -7px rgba(0, 0, 0, 0.2), 0px 23px 36px 3px rgba(0, 0, 0, 0.14), 0px 9px 44px 8px rgba(0, 0, 0, 0.12); }
91
92.mat-elevation-z24 {
93 box-shadow: 0px 11px 15px -7px rgba(0, 0, 0, 0.2), 0px 24px 38px 3px rgba(0, 0, 0, 0.14), 0px 9px 46px 8px rgba(0, 0, 0, 0.12); }
94
95.mat-ripple {
96 overflow: hidden; }
97
98.mat-ripple.mat-ripple-unbounded {
99 overflow: visible; }
100
101.mat-ripple-element {
102 position: absolute;
103 border-radius: 50%;
104 pointer-events: none;
105 background-color: rgba(0, 0, 0, 0.1);
106 transition: opacity, transform 0ms cubic-bezier(0, 0, 0.2, 1);
107 transform: scale(0); }
108
109.mat-option {
110 white-space: nowrap;
111 overflow-x: hidden;
112 text-overflow: ellipsis;
113 display: block;
114 line-height: 48px;
115 height: 48px;
116 padding: 0 16px;
117 font-size: 16px;
118 font-family: Roboto, "Helvetica Neue", sans-serif;
119 text-align: start;
120 text-decoration: none;
121 position: relative;
122 cursor: pointer;
123 outline: none; }
124 .mat-option[disabled] {
125 cursor: default; }
126 .mat-option .mat-icon {
127 margin-right: 16px; }
128 [dir='rtl'] .mat-option .mat-icon {
129 margin-left: 16px; }
130 .mat-option[aria-disabled='true'] {
131 cursor: default;
132 user-select: none; }
133
134.mat-option-ripple {
135 position: absolute;
136 top: 0;
137 left: 0;
138 bottom: 0;
139 right: 0; }
140 @media screen and (-ms-high-contrast: active) {
141 .mat-option-ripple {
142 opacity: 0.5; } }
143
144.cdk-visually-hidden {
145 border: 0;
146 clip: rect(0 0 0 0);
147 height: 1px;
148 margin: -1px;
149 overflow: hidden;
150 padding: 0;
151 position: absolute;
152 text-transform: none;
153 width: 1px; }
154
155.cdk-overlay-container, .cdk-global-overlay-wrapper {
156 pointer-events: none;
157 top: 0;
158 left: 0;
159 height: 100%;
160 width: 100%; }
161
162.cdk-overlay-container {
163 position: fixed;
164 z-index: 1000; }
165
166.cdk-global-overlay-wrapper {
167 display: flex;
168 position: absolute;
169 z-index: 1000; }
170
171.cdk-overlay-pane {
172 position: absolute;
173 pointer-events: auto;
174 box-sizing: border-box;
175 z-index: 1000; }
176
177.cdk-overlay-backdrop {
178 position: absolute;
179 top: 0;
180 bottom: 0;
181 left: 0;
182 right: 0;
183 z-index: 1000;
184 pointer-events: auto;
185 transition: opacity 400ms cubic-bezier(0.25, 0.8, 0.25, 1);
186 opacity: 0; }
187 .cdk-overlay-backdrop.cdk-overlay-backdrop-showing {
188 opacity: 0.48; }
189
190.cdk-overlay-dark-backdrop {
191 background: rgba(0, 0, 0, 0.6); }
192
193.cdk-overlay-transparent-backdrop {
194 background: none; }
195
196.mat-option:hover:not(.mat-option-disabled), .mat-option:focus:not(.mat-option-disabled) {
197 background: rgba(0, 0, 0, 0.04); }
198
199.mat-option.mat-selected {
200 background: rgba(0, 0, 0, 0.04);
201 color: #673ab7; }
202
203.mat-option.mat-active {
204 background: rgba(0, 0, 0, 0.04);
205 color: rgba(0, 0, 0, 0.87); }
206
207.mat-option.mat-option-disabled {
208 color: rgba(0, 0, 0, 0.38); }
209
210.mat-pseudo-checkbox::after {
211 color: #fafafa; }
212
213.mat-pseudo-checkbox-checked, .mat-pseudo-checkbox-indeterminate {
214 border: none; }
215 .mat-pseudo-checkbox-checked.mat-primary, .mat-pseudo-checkbox-indeterminate.mat-primary {
216 background: #673ab7; }
217 .mat-pseudo-checkbox-checked.mat-accent, .mat-pseudo-checkbox-indeterminate.mat-accent {
218 background: #ffc107; }
219 .mat-pseudo-checkbox-checked.mat-warn, .mat-pseudo-checkbox-indeterminate.mat-warn {
220 background: #f44336; }
221 .mat-pseudo-checkbox-checked.mat-pseudo-checkbox-disabled, .mat-pseudo-checkbox-indeterminate.mat-pseudo-checkbox-disabled {
222 background: #b0b0b0; }
223
224.mat-app-background {
225 background-color: #fafafa; }
226
227.mat-autocomplete-panel {
228 background: white;
229 color: rgba(0, 0, 0, 0.87); }
230 .mat-autocomplete-panel .mat-option.mat-selected:not(.mat-active) {
231 background: white;
232 color: rgba(0, 0, 0, 0.87); }
233
234.mat-button.mat-button-focus.mat-primary .mat-button-focus-overlay, .mat-icon-button.mat-button-focus.mat-primary .mat-button-focus-overlay, .mat-raised-button.mat-button-focus.mat-primary .mat-button-focus-overlay, .mat-fab.mat-button-focus.mat-primary .mat-button-focus-overlay, .mat-mini-fab.mat-button-focus.mat-primary .mat-button-focus-overlay {
235 background-color: rgba(103, 58, 183, 0.12); }
236
237.mat-button.mat-button-focus.mat-accent .mat-button-focus-overlay, .mat-icon-button.mat-button-focus.mat-accent .mat-button-focus-overlay, .mat-raised-button.mat-button-focus.mat-accent .mat-button-focus-overlay, .mat-fab.mat-button-focus.mat-accent .mat-button-focus-overlay, .mat-mini-fab.mat-button-focus.mat-accent .mat-button-focus-overlay {
238 background-color: rgba(255, 215, 64, 0.12); }
239
240.mat-button.mat-button-focus.mat-warn .mat-button-focus-overlay, .mat-icon-button.mat-button-focus.mat-warn .mat-button-focus-overlay, .mat-raised-button.mat-button-focus.mat-warn .mat-button-focus-overlay, .mat-fab.mat-button-focus.mat-warn .mat-button-focus-overlay, .mat-mini-fab.mat-button-focus.mat-warn .mat-button-focus-overlay {
241 background-color: rgba(244, 67, 54, 0.12); }
242
243.mat-button, .mat-icon-button {
244 background: transparent; }
245 .mat-button.mat-primary, .mat-icon-button.mat-primary {
246 color: #673ab7; }
247 .mat-button.mat-accent, .mat-icon-button.mat-accent {
248 color: #ffd740; }
249 .mat-button.mat-warn, .mat-icon-button.mat-warn {
250 color: #f44336; }
251 .mat-button.mat-primary[disabled], .mat-button.mat-accent[disabled], .mat-button.mat-warn[disabled], .mat-button[disabled][disabled], .mat-icon-button.mat-primary[disabled], .mat-icon-button.mat-accent[disabled], .mat-icon-button.mat-warn[disabled], .mat-icon-button[disabled][disabled] {
252 color: rgba(0, 0, 0, 0.38); }
253 .mat-button:hover.mat-primary .mat-button-focus-overlay, .mat-icon-button:hover.mat-primary .mat-button-focus-overlay {
254 background-color: rgba(103, 58, 183, 0.12); }
255 .mat-button:hover.mat-accent .mat-button-focus-overlay, .mat-icon-button:hover.mat-accent .mat-button-focus-overlay {
256 background-color: rgba(255, 215, 64, 0.12); }
257 .mat-button:hover.mat-warn .mat-button-focus-overlay, .mat-icon-button:hover.mat-warn .mat-button-focus-overlay {
258 background-color: rgba(244, 67, 54, 0.12); }
259
260.mat-raised-button, .mat-fab, .mat-mini-fab {
261 color: rgba(0, 0, 0, 0.87);
262 background-color: white; }
263 .mat-raised-button.mat-primary, .mat-fab.mat-primary, .mat-mini-fab.mat-primary {
264 color: rgba(255, 255, 255, 0.87); }
265 .mat-raised-button.mat-accent, .mat-fab.mat-accent, .mat-mini-fab.mat-accent {
266 color: rgba(0, 0, 0, 0.87); }
267 .mat-raised-button.mat-warn, .mat-fab.mat-warn, .mat-mini-fab.mat-warn {
268 color: white; }
269 .mat-raised-button.mat-primary[disabled], .mat-raised-button.mat-accent[disabled], .mat-raised-button.mat-warn[disabled], .mat-raised-button[disabled][disabled], .mat-fab.mat-primary[disabled], .mat-fab.mat-accent[disabled], .mat-fab.mat-warn[disabled], .mat-fab[disabled][disabled], .mat-mini-fab.mat-primary[disabled], .mat-mini-fab.mat-accent[disabled], .mat-mini-fab.mat-warn[disabled], .mat-mini-fab[disabled][disabled] {
270 color: rgba(0, 0, 0, 0.38); }
271 .mat-raised-button.mat-primary, .mat-fab.mat-primary, .mat-mini-fab.mat-primary {
272 background-color: #673ab7; }
273 .mat-raised-button.mat-accent, .mat-fab.mat-accent, .mat-mini-fab.mat-accent {
274 background-color: #ffd740; }
275 .mat-raised-button.mat-warn, .mat-fab.mat-warn, .mat-mini-fab.mat-warn {
276 background-color: #f44336; }
277 .mat-raised-button.mat-primary[disabled], .mat-raised-button.mat-accent[disabled], .mat-raised-button.mat-warn[disabled], .mat-raised-button[disabled][disabled], .mat-fab.mat-primary[disabled], .mat-fab.mat-accent[disabled], .mat-fab.mat-warn[disabled], .mat-fab[disabled][disabled], .mat-mini-fab.mat-primary[disabled], .mat-mini-fab.mat-accent[disabled], .mat-mini-fab.mat-warn[disabled], .mat-mini-fab[disabled][disabled] {
278 background-color: rgba(0, 0, 0, 0.12); }
279
280.mat-fab, .mat-mini-fab {
281 background-color: #ffd740;
282 color: rgba(0, 0, 0, 0.87); }
283
284.mat-button-toggle {
285 color: rgba(0, 0, 0, 0.38); }
286
287.mat-button-toggle-checked {
288 background-color: #e0e0e0;
289 color: black; }
290
291.mat-button-toggle-disabled {
292 background-color: #eeeeee;
293 color: rgba(0, 0, 0, 0.38); }
294 .mat-button-toggle-disabled.mat-button-toggle-checked {
295 background-color: #bdbdbd; }
296
297.mat-card {
298 background: white;
299 color: black; }
300
301.mat-card-subtitle {
302 color: rgba(0, 0, 0, 0.54); }
303
304.mat-checkbox-frame {
305 border-color: rgba(0, 0, 0, 0.54); }
306
307.mat-checkbox-checkmark {
308 fill: #fafafa; }
309
310.mat-checkbox-checkmark-path {
311 stroke: #fafafa !important; }
312
313.mat-checkbox-mixedmark {
314 background-color: #fafafa; }
315
316.mat-checkbox-indeterminate.mat-primary .mat-checkbox-background, .mat-checkbox-checked.mat-primary .mat-checkbox-background {
317 background-color: #673ab7; }
318
319.mat-checkbox-indeterminate.mat-accent .mat-checkbox-background, .mat-checkbox-checked.mat-accent .mat-checkbox-background {
320 background-color: #ffc107; }
321
322.mat-checkbox-indeterminate.mat-warn .mat-checkbox-background, .mat-checkbox-checked.mat-warn .mat-checkbox-background {
323 background-color: #f44336; }
324
325.mat-checkbox-disabled.mat-checkbox-checked .mat-checkbox-background, .mat-checkbox-disabled.mat-checkbox-indeterminate .mat-checkbox-background {
326 background-color: #b0b0b0; }
327
328.mat-checkbox-disabled:not(.mat-checkbox-checked) .mat-checkbox-frame {
329 border-color: #b0b0b0; }
330
331.mat-checkbox:not(.mat-checkbox-disabled).mat-primary .mat-checkbox-ripple .mat-ripple-element {
332 background-color: rgba(103, 58, 183, 0.26); }
333
334.mat-checkbox:not(.mat-checkbox-disabled).mat-accent .mat-checkbox-ripple .mat-ripple-element {
335 background-color: rgba(255, 215, 64, 0.26); }
336
337.mat-checkbox:not(.mat-checkbox-disabled).mat-warn .mat-checkbox-ripple .mat-ripple-element {
338 background-color: rgba(244, 67, 54, 0.26); }
339
340.mat-chip:not(.mat-basic-chip) {
341 background-color: #e0e0e0;
342 color: rgba(0, 0, 0, 0.87); }
343
344.mat-chip.mat-chip-selected:not(.mat-basic-chip) {
345 background-color: #808080;
346 color: rgba(255, 255, 255, 0.87); }
347 .mat-chip.mat-chip-selected:not(.mat-basic-chip).mat-primary {
348 background-color: #673ab7;
349 color: rgba(255, 255, 255, 0.87); }
350 .mat-chip.mat-chip-selected:not(.mat-basic-chip).mat-accent {
351 background-color: #ffc107;
352 color: rgba(0, 0, 0, 0.87); }
353 .mat-chip.mat-chip-selected:not(.mat-basic-chip).mat-warn {
354 background-color: #f44336;
355 color: white; }
356
357.mat-dialog-container {
358 background: white; }
359
360.mat-icon.mat-primary {
361 color: #673ab7; }
362
363.mat-icon.mat-accent {
364 color: #ffd740; }
365
366.mat-icon.mat-warn {
367 color: #f44336; }
368
369.mat-input-placeholder {
370 color: rgba(0, 0, 0, 0.38); }
371 .mat-input-placeholder.mat-focused {
372 color: #673ab7; }
373 .mat-input-placeholder.mat-focused.mat-accent {
374 color: #ffd740; }
375 .mat-input-placeholder.mat-focused.mat-warn {
376 color: #f44336; }
377
378.mat-input-element:disabled {
379 color: rgba(0, 0, 0, 0.38); }
380
381input.mat-input-element:-webkit-autofill + .mat-input-placeholder .mat-placeholder-required,
382.mat-input-placeholder.mat-float.mat-focused .mat-placeholder-required {
383 color: #ffd740; }
384
385.mat-input-underline {
386 border-color: rgba(0, 0, 0, 0.12); }
387 .mat-input-underline .mat-input-ripple {
388 background-color: #673ab7; }
389 .mat-input-underline .mat-input-ripple.mat-accent {
390 background-color: #ffd740; }
391 .mat-input-underline .mat-input-ripple.mat-warn {
392 background-color: #f44336; }
393
394.mat-list .mat-list-item, .mat-nav-list .mat-list-item {
395 color: black; }
396
397.mat-list .mat-subheader, .mat-nav-list .mat-subheader {
398 color: rgba(0, 0, 0, 0.54); }
399
400.mat-divider {
401 border-top-color: rgba(0, 0, 0, 0.12); }
402
403.mat-nav-list .mat-list-item-content:hover, .mat-nav-list .mat-list-item-content.mat-list-item-focus {
404 background: rgba(0, 0, 0, 0.04); }
405
406.mat-menu-content {
407 background: white; }
408
409.mat-menu-item {
410 background: transparent;
411 color: rgba(0, 0, 0, 0.87); }
412 .mat-menu-item[disabled] {
413 color: rgba(0, 0, 0, 0.38); }
414 .mat-menu-item .mat-icon {
415 color: rgba(0, 0, 0, 0.54);
416 vertical-align: middle; }
417 .mat-menu-item:hover:not([disabled]), .mat-menu-item:focus:not([disabled]) {
418 background: rgba(0, 0, 0, 0.04); }
419
420.mat-progress-bar-background {
421 background: url("data:image/svg+xml;charset=UTF-8,%3Csvg%20version%3D%271.1%27%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20xmlns%3Axlink%3D%27http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%27%20x%3D%270px%27%20y%3D%270px%27%20enable-background%3D%27new%200%200%205%202%27%20xml%3Aspace%3D%27preserve%27%20viewBox%3D%270%200%205%202%27%20preserveAspectRatio%3D%27none%20slice%27%3E%3Ccircle%20cx%3D%271%27%20cy%3D%271%27%20r%3D%271%27%20fill%3D%27%23d1c4e9%27%2F%3E%3C%2Fsvg%3E"); }
422
423.mat-progress-bar-buffer {
424 background-color: #d1c4e9; }
425
426.mat-progress-bar-fill::after {
427 background-color: #5e35b1; }
428
429.mat-progress-bar.mat-accent .mat-progress-bar-background {
430 background: url("data:image/svg+xml;charset=UTF-8,%3Csvg%20version%3D%271.1%27%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20xmlns%3Axlink%3D%27http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%27%20x%3D%270px%27%20y%3D%270px%27%20enable-background%3D%27new%200%200%205%202%27%20xml%3Aspace%3D%27preserve%27%20viewBox%3D%270%200%205%202%27%20preserveAspectRatio%3D%27none%20slice%27%3E%3Ccircle%20cx%3D%271%27%20cy%3D%271%27%20r%3D%271%27%20fill%3D%27%23ffecb3%27%2F%3E%3C%2Fsvg%3E"); }
431
432.mat-progress-bar.mat-accent .mat-progress-bar-buffer {
433 background-color: #ffecb3; }
434
435.mat-progress-bar.mat-accent .mat-progress-bar-fill::after {
436 background-color: #ffb300; }
437
438.mat-progress-bar.mat-warn .mat-progress-bar-background {
439 background: url("data:image/svg+xml;charset=UTF-8,%3Csvg%20version%3D%271.1%27%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20xmlns%3Axlink%3D%27http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%27%20x%3D%270px%27%20y%3D%270px%27%20enable-background%3D%27new%200%200%205%202%27%20xml%3Aspace%3D%27preserve%27%20viewBox%3D%270%200%205%202%27%20preserveAspectRatio%3D%27none%20slice%27%3E%3Ccircle%20cx%3D%271%27%20cy%3D%271%27%20r%3D%271%27%20fill%3D%27%23ffcdd2%27%2F%3E%3C%2Fsvg%3E"); }
440
441.mat-progress-bar.mat-warn .mat-progress-bar-buffer {
442 background-color: #ffcdd2; }
443
444.mat-progress-bar.mat-warn .mat-progress-bar-fill::after {
445 background-color: #e53935; }
446
447.mat-progress-spinner path, .mat-progress-circle path, .mat-spinner path {
448 stroke: #5e35b1; }
449
450.mat-progress-spinner.mat-accent path, .mat-progress-circle.mat-accent path, .mat-spinner.mat-accent path {
451 stroke: #ffb300; }
452
453.mat-progress-spinner.mat-warn path, .mat-progress-circle.mat-warn path, .mat-spinner.mat-warn path {
454 stroke: #e53935; }
455
456.mat-radio-outer-circle {
457 border-color: rgba(0, 0, 0, 0.54); }
458 .mat-radio-checked .mat-radio-outer-circle {
459 border-color: #ffd740; }
460 .mat-radio-disabled .mat-radio-outer-circle {
461 border-color: rgba(0, 0, 0, 0.38); }
462
463.mat-radio-inner-circle {
464 background-color: #ffd740; }
465 .mat-radio-disabled .mat-radio-inner-circle {
466 background-color: rgba(0, 0, 0, 0.38); }
467
468.mat-radio-ripple .mat-ripple-element {
469 background-color: rgba(255, 215, 64, 0.26); }
470 .mat-radio-disabled .mat-radio-ripple .mat-ripple-element {
471 background-color: rgba(0, 0, 0, 0.38); }
472
473.mat-select-trigger {
474 color: rgba(0, 0, 0, 0.38); }
475 .mat-select:focus:not(.mat-select-disabled) .mat-select-trigger {
476 color: #673ab7; }
477 .mat-select.ng-invalid.ng-touched:not(.mat-select-disabled) .mat-select-trigger {
478 color: #f44336; }
479
480.mat-select-underline {
481 background-color: rgba(0, 0, 0, 0.12); }
482 .mat-select:focus:not(.mat-select-disabled) .mat-select-underline {
483 background-color: #673ab7; }
484 .mat-select.ng-invalid.ng-touched:not(.mat-select-disabled) .mat-select-underline {
485 background-color: #f44336; }
486
487.mat-select-arrow {
488 color: rgba(0, 0, 0, 0.38); }
489 .mat-select:focus:not(.mat-select-disabled) .mat-select-arrow {
490 color: #673ab7; }
491 .mat-select.ng-invalid.ng-touched:not(.mat-select-disabled) .mat-select-arrow {
492 color: #f44336; }
493
494.mat-select-content, .mat-select-panel-done-animating {
495 background: white; }
496
497.mat-select-value {
498 color: rgba(0, 0, 0, 0.87); }
499 .mat-select-disabled .mat-select-value {
500 color: rgba(0, 0, 0, 0.38); }
501
502.mat-sidenav-container {
503 background-color: #fafafa;
504 color: rgba(0, 0, 0, 0.87); }
505
506.mat-sidenav {
507 background-color: white;
508 color: rgba(0, 0, 0, 0.87); }
509 .mat-sidenav.mat-sidenav-push {
510 background-color: white; }
511
512.mat-sidenav-backdrop.mat-sidenav-shown {
513 background-color: rgba(0, 0, 0, 0.6); }
514
515.mat-slide-toggle.mat-checked:not(.mat-disabled) .mat-slide-toggle-thumb {
516 background-color: #ffc107; }
517
518.mat-slide-toggle.mat-checked:not(.mat-disabled) .mat-slide-toggle-bar {
519 background-color: rgba(255, 193, 7, 0.5); }
520
521.mat-slide-toggle.mat-slide-toggle-focused:not(.mat-checked) .mat-ink-ripple {
522 background-color: rgba(0, 0, 0, 0.12); }
523
524.mat-slide-toggle.mat-slide-toggle-focused .mat-ink-ripple {
525 background-color: rgba(255, 193, 7, 0.26); }
526
527.mat-slide-toggle.mat-primary.mat-checked:not(.mat-disabled) .mat-slide-toggle-thumb {
528 background-color: #673ab7; }
529
530.mat-slide-toggle.mat-primary.mat-checked:not(.mat-disabled) .mat-slide-toggle-bar {
531 background-color: rgba(103, 58, 183, 0.5); }
532
533.mat-slide-toggle.mat-primary.mat-slide-toggle-focused:not(.mat-checked) .mat-ink-ripple {
534 background-color: rgba(0, 0, 0, 0.12); }
535
536.mat-slide-toggle.mat-primary.mat-slide-toggle-focused .mat-ink-ripple {
537 background-color: rgba(103, 58, 183, 0.26); }
538
539.mat-slide-toggle.mat-warn.mat-checked:not(.mat-disabled) .mat-slide-toggle-thumb {
540 background-color: #f44336; }
541
542.mat-slide-toggle.mat-warn.mat-checked:not(.mat-disabled) .mat-slide-toggle-bar {
543 background-color: rgba(244, 67, 54, 0.5); }
544
545.mat-slide-toggle.mat-warn.mat-slide-toggle-focused:not(.mat-checked) .mat-ink-ripple {
546 background-color: rgba(0, 0, 0, 0.12); }
547
548.mat-slide-toggle.mat-warn.mat-slide-toggle-focused .mat-ink-ripple {
549 background-color: rgba(244, 67, 54, 0.26); }
550
551.mat-disabled .mat-slide-toggle-thumb {
552 background-color: #bdbdbd; }
553
554.mat-disabled .mat-slide-toggle-bar {
555 background-color: rgba(0, 0, 0, 0.1); }
556
557.mat-slide-toggle-thumb {
558 background-color: #fafafa; }
559
560.mat-slide-toggle-bar {
561 background-color: rgba(0, 0, 0, 0.38); }
562
563.mat-slider-track-background {
564 background-color: rgba(0, 0, 0, 0.26); }
565
566.mat-slider-track-fill {
567 background-color: #ffd740; }
568
569.mat-slider-thumb {
570 background-color: #ffd740; }
571
572.mat-slider-thumb-label {
573 background-color: #ffd740; }
574
575.mat-slider-thumb-label-text {
576 color: rgba(0, 0, 0, 0.87); }
577
578.mat-slider:hover .mat-slider-track-background,
579.mat-slider-active .mat-slider-track-background {
580 background-color: rgba(0, 0, 0, 0.38); }
581
582.mat-slider-disabled .mat-slider-track-background,
583.mat-slider-disabled .mat-slider-track-fill,
584.mat-slider-disabled .mat-slider-thumb {
585 background-color: rgba(0, 0, 0, 0.26); }
586
587.mat-slider-disabled:hover .mat-slider-track-background {
588 background-color: rgba(0, 0, 0, 0.26); }
589
590.mat-slider-min-value.mat-slider-thumb-label-showing .mat-slider-thumb,
591.mat-slider-min-value.mat-slider-thumb-label-showing .mat-slider-thumb-label {
592 background-color: black; }
593
594.mat-slider-min-value.mat-slider-thumb-label-showing.mat-slider-active .mat-slider-thumb,
595.mat-slider-min-value.mat-slider-thumb-label-showing.mat-slider-active .mat-slider-thumb-label {
596 background-color: rgba(0, 0, 0, 0.26); }
597
598.mat-slider-min-value:not(.mat-slider-thumb-label-showing) .mat-slider-thumb {
599 border-color: rgba(0, 0, 0, 0.26);
600 background-color: transparent; }
601
602.mat-slider-min-value:not(.mat-slider-thumb-label-showing):hover .mat-slider-thumb, .mat-slider-min-value:not(.mat-slider-thumb-label-showing).mat-slider-active .mat-slider-thumb {
603 border-color: rgba(0, 0, 0, 0.38); }
604
605.mat-slider-min-value:not(.mat-slider-thumb-label-showing):hover.mat-slider-disabled .mat-slider-thumb, .mat-slider-min-value:not(.mat-slider-thumb-label-showing).mat-slider-active.mat-slider-disabled .mat-slider-thumb {
606 border-color: rgba(0, 0, 0, 0.26); }
607
608.mat-tab-nav-bar,
609.mat-tab-header {
610 border-bottom: 1px solid #e0e0e0; }
611 .mat-tab-group-inverted-header .mat-tab-nav-bar, .mat-tab-group-inverted-header
612 .mat-tab-header {
613 border-top: 1px solid #e0e0e0;
614 border-bottom: none; }
615
616.mat-tab-label:focus {
617 background-color: rgba(209, 196, 233, 0.3); }
618
619.mat-ink-bar {
620 background-color: #673ab7; }
621
622.mat-toolbar {
623 background: whitesmoke;
624 color: rgba(0, 0, 0, 0.87); }
625 .mat-toolbar.mat-primary {
626 background: #673ab7;
627 color: rgba(255, 255, 255, 0.87); }
628 .mat-toolbar.mat-accent {
629 background: #ffd740;
630 color: rgba(0, 0, 0, 0.87); }
631 .mat-toolbar.mat-warn {
632 background: #f44336;
633 color: white; }
634
635.mat-tooltip {
636 background: rgba(97, 97, 97, 0.9); }
637
638/**
639 * Applies styles for users in high contrast mode. Note that this only applies
640 * to Microsoft browsers. Chrome can be included by checking for the `html[hc]`
641 * attribute, however Chrome handles high contrast differently.
642 */
643/** The mixins below are shared between md-menu and md-select */
644/**
645 * This mixin adds the correct panel transform styles based
646 * on the direction that the menu panel opens.
647 */
648/**
649 * Applies styles for users in high contrast mode. Note that this only applies
650 * to Microsoft browsers. Chrome can be included by checking for the `html[hc]`
651 * attribute, however Chrome handles high contrast differently.
652 */
653/**
654 * This mixin contains shared option styles between the select and
655 * autocomplete components.
656 */
657html, body {
658 height: 100%; }
659
660.login-container {
661 background-color: md-color((50: #ede7f6, 100: #d1c4e9, 200: #b39ddb, 300: #9575cd, 400: #7e57c2, 500: #673ab7, 600: #5e35b1, 700: #512da8, 800: #4527a0, 900: #311b92, A100: #b388ff, A200: #7c4dff, A400: #651fff, A700: #6200ea, contrast: (50: rgba(0, 0, 0, 0.87), 100: rgba(0, 0, 0, 0.87), 200: rgba(0, 0, 0, 0.87), 300: white, 400: white, 500: rgba(255, 255, 255, 0.87), 600: rgba(255, 255, 255, 0.87), 700: rgba(255, 255, 255, 0.87), 800: rgba(255, 255, 255, 0.87), 900: rgba(255, 255, 255, 0.87), A100: rgba(0, 0, 0, 0.87), A200: white, A400: rgba(255, 255, 255, 0.87), A700: rgba(255, 255, 255, 0.87)), default: #673ab7, lighter: #d1c4e9, darker: #512da8, default-contrast: rgba(255, 255, 255, 0.87), lighter-contrast: rgba(0, 0, 0, 0.87), darker-contrast: rgba(255, 255, 255, 0.87), "50-contrast": rgba(0, 0, 0, 0.87), "100-contrast": rgba(0, 0, 0, 0.87), "200-contrast": rgba(0, 0, 0, 0.87), "300-contrast": white, "400-contrast": white, "500-contrast": rgba(255, 255, 255, 0.87), "600-contrast": rgba(255, 255, 255, 0.87), "700-contrast": rgba(255, 255, 255, 0.87), "800-contrast": rgba(255, 255, 255, 0.87), "900-contrast": rgba(255, 255, 255, 0.87), "A100-contrast": rgba(0, 0, 0, 0.87), "A200-contrast": white, "A400-contrast": rgba(255, 255, 255, 0.87), "A700-contrast": rgba(255, 255, 255, 0.87), "contrast-contrast": null)); }
662
663.error-message {
664 margin-top: -10px;
665 color: md-color((50: #ffebee, 100: #ffcdd2, 200: #ef9a9a, 300: #e57373, 400: #ef5350, 500: #f44336, 600: #e53935, 700: #d32f2f, 800: #c62828, 900: #b71c1c, A100: #ff8a80, A200: #ff5252, A400: #ff1744, A700: #d50000, contrast: (50: rgba(0, 0, 0, 0.87), 100: rgba(0, 0, 0, 0.87), 200: rgba(0, 0, 0, 0.87), 300: rgba(0, 0, 0, 0.87), 400: rgba(0, 0, 0, 0.87), 500: white, 600: white, 700: white, 800: rgba(255, 255, 255, 0.87), 900: rgba(255, 255, 255, 0.87), A100: rgba(0, 0, 0, 0.87), A200: white, A400: white, A700: white), default: #f44336, lighter: #ffcdd2, darker: #d32f2f, default-contrast: white, lighter-contrast: rgba(0, 0, 0, 0.87), darker-contrast: white, "50-contrast": rgba(0, 0, 0, 0.87), "100-contrast": rgba(0, 0, 0, 0.87), "200-contrast": rgba(0, 0, 0, 0.87), "300-contrast": rgba(0, 0, 0, 0.87), "400-contrast": rgba(0, 0, 0, 0.87), "500-contrast": white, "600-contrast": white, "700-contrast": white, "800-contrast": rgba(255, 255, 255, 0.87), "900-contrast": rgba(255, 255, 255, 0.87), "A100-contrast": rgba(0, 0, 0, 0.87), "A200-contrast": white, "A400-contrast": white, "A700-contrast": white, "contrast-contrast": null)); }
666
667.sidenav-level-7 {
668 background-color: md-color((50: #ede7f6, 100: #d1c4e9, 200: #b39ddb, 300: #9575cd, 400: #7e57c2, 500: #673ab7, 600: #5e35b1, 700: #512da8, 800: #4527a0, 900: #311b92, A100: #b388ff, A200: #7c4dff, A400: #651fff, A700: #6200ea, contrast: (50: rgba(0, 0, 0, 0.87), 100: rgba(0, 0, 0, 0.87), 200: rgba(0, 0, 0, 0.87), 300: white, 400: white, 500: rgba(255, 255, 255, 0.87), 600: rgba(255, 255, 255, 0.87), 700: rgba(255, 255, 255, 0.87), 800: rgba(255, 255, 255, 0.87), 900: rgba(255, 255, 255, 0.87), A100: rgba(0, 0, 0, 0.87), A200: white, A400: rgba(255, 255, 255, 0.87), A700: rgba(255, 255, 255, 0.87)), default: #673ab7, lighter: #d1c4e9, darker: #512da8, default-contrast: rgba(255, 255, 255, 0.87), lighter-contrast: rgba(0, 0, 0, 0.87), darker-contrast: rgba(255, 255, 255, 0.87), "50-contrast": rgba(0, 0, 0, 0.87), "100-contrast": rgba(0, 0, 0, 0.87), "200-contrast": rgba(0, 0, 0, 0.87), "300-contrast": white, "400-contrast": white, "500-contrast": rgba(255, 255, 255, 0.87), "600-contrast": rgba(255, 255, 255, 0.87), "700-contrast": rgba(255, 255, 255, 0.87), "800-contrast": rgba(255, 255, 255, 0.87), "900-contrast": rgba(255, 255, 255, 0.87), "A100-contrast": rgba(0, 0, 0, 0.87), "A200-contrast": white, "A400-contrast": rgba(255, 255, 255, 0.87), "A700-contrast": rgba(255, 255, 255, 0.87), "contrast-contrast": null), 400);
669 color: white;
670 border-bottom: 1px solid white; }
671
672.sidenav-level-8 {
673 background-color: md-color((50: #ede7f6, 100: #d1c4e9, 200: #b39ddb, 300: #9575cd, 400: #7e57c2, 500: #673ab7, 600: #5e35b1, 700: #512da8, 800: #4527a0, 900: #311b92, A100: #b388ff, A200: #7c4dff, A400: #651fff, A700: #6200ea, contrast: (50: rgba(0, 0, 0, 0.87), 100: rgba(0, 0, 0, 0.87), 200: rgba(0, 0, 0, 0.87), 300: white, 400: white, 500: rgba(255, 255, 255, 0.87), 600: rgba(255, 255, 255, 0.87), 700: rgba(255, 255, 255, 0.87), 800: rgba(255, 255, 255, 0.87), 900: rgba(255, 255, 255, 0.87), A100: rgba(0, 0, 0, 0.87), A200: white, A400: rgba(255, 255, 255, 0.87), A700: rgba(255, 255, 255, 0.87)), default: #673ab7, lighter: #d1c4e9, darker: #512da8, default-contrast: rgba(255, 255, 255, 0.87), lighter-contrast: rgba(0, 0, 0, 0.87), darker-contrast: rgba(255, 255, 255, 0.87), "50-contrast": rgba(0, 0, 0, 0.87), "100-contrast": rgba(0, 0, 0, 0.87), "200-contrast": rgba(0, 0, 0, 0.87), "300-contrast": white, "400-contrast": white, "500-contrast": rgba(255, 255, 255, 0.87), "600-contrast": rgba(255, 255, 255, 0.87), "700-contrast": rgba(255, 255, 255, 0.87), "800-contrast": rgba(255, 255, 255, 0.87), "900-contrast": rgba(255, 255, 255, 0.87), "A100-contrast": rgba(0, 0, 0, 0.87), "A200-contrast": white, "A400-contrast": rgba(255, 255, 255, 0.87), "A700-contrast": rgba(255, 255, 255, 0.87), "contrast-contrast": null), 500);
674 color: white;
675 border-bottom: 1px solid white; }
676
677.sidenav-level-6 {
678 background-color: md-color((50: #ede7f6, 100: #d1c4e9, 200: #b39ddb, 300: #9575cd, 400: #7e57c2, 500: #673ab7, 600: #5e35b1, 700: #512da8, 800: #4527a0, 900: #311b92, A100: #b388ff, A200: #7c4dff, A400: #651fff, A700: #6200ea, contrast: (50: rgba(0, 0, 0, 0.87), 100: rgba(0, 0, 0, 0.87), 200: rgba(0, 0, 0, 0.87), 300: white, 400: white, 500: rgba(255, 255, 255, 0.87), 600: rgba(255, 255, 255, 0.87), 700: rgba(255, 255, 255, 0.87), 800: rgba(255, 255, 255, 0.87), 900: rgba(255, 255, 255, 0.87), A100: rgba(0, 0, 0, 0.87), A200: white, A400: rgba(255, 255, 255, 0.87), A700: rgba(255, 255, 255, 0.87)), default: #673ab7, lighter: #d1c4e9, darker: #512da8, default-contrast: rgba(255, 255, 255, 0.87), lighter-contrast: rgba(0, 0, 0, 0.87), darker-contrast: rgba(255, 255, 255, 0.87), "50-contrast": rgba(0, 0, 0, 0.87), "100-contrast": rgba(0, 0, 0, 0.87), "200-contrast": rgba(0, 0, 0, 0.87), "300-contrast": white, "400-contrast": white, "500-contrast": rgba(255, 255, 255, 0.87), "600-contrast": rgba(255, 255, 255, 0.87), "700-contrast": rgba(255, 255, 255, 0.87), "800-contrast": rgba(255, 255, 255, 0.87), "900-contrast": rgba(255, 255, 255, 0.87), "A100-contrast": rgba(0, 0, 0, 0.87), "A200-contrast": white, "A400-contrast": rgba(255, 255, 255, 0.87), "A700-contrast": rgba(255, 255, 255, 0.87), "contrast-contrast": null), 300);
679 color: white;
680 border-bottom: 1px solid white; }
681
682.sidenav-level-5 {
683 background-color: md-color((50: #ede7f6, 100: #d1c4e9, 200: #b39ddb, 300: #9575cd, 400: #7e57c2, 500: #673ab7, 600: #5e35b1, 700: #512da8, 800: #4527a0, 900: #311b92, A100: #b388ff, A200: #7c4dff, A400: #651fff, A700: #6200ea, contrast: (50: rgba(0, 0, 0, 0.87), 100: rgba(0, 0, 0, 0.87), 200: rgba(0, 0, 0, 0.87), 300: white, 400: white, 500: rgba(255, 255, 255, 0.87), 600: rgba(255, 255, 255, 0.87), 700: rgba(255, 255, 255, 0.87), 800: rgba(255, 255, 255, 0.87), 900: rgba(255, 255, 255, 0.87), A100: rgba(0, 0, 0, 0.87), A200: white, A400: rgba(255, 255, 255, 0.87), A700: rgba(255, 255, 255, 0.87)), default: #673ab7, lighter: #d1c4e9, darker: #512da8, default-contrast: rgba(255, 255, 255, 0.87), lighter-contrast: rgba(0, 0, 0, 0.87), darker-contrast: rgba(255, 255, 255, 0.87), "50-contrast": rgba(0, 0, 0, 0.87), "100-contrast": rgba(0, 0, 0, 0.87), "200-contrast": rgba(0, 0, 0, 0.87), "300-contrast": white, "400-contrast": white, "500-contrast": rgba(255, 255, 255, 0.87), "600-contrast": rgba(255, 255, 255, 0.87), "700-contrast": rgba(255, 255, 255, 0.87), "800-contrast": rgba(255, 255, 255, 0.87), "900-contrast": rgba(255, 255, 255, 0.87), "A100-contrast": rgba(0, 0, 0, 0.87), "A200-contrast": white, "A400-contrast": rgba(255, 255, 255, 0.87), "A700-contrast": rgba(255, 255, 255, 0.87), "contrast-contrast": null), 200);
684 color: white;
685 border-bottom: 1px solid white; }
686
687.sidenav-level-4 {
688 background-color: md-color((50: #ede7f6, 100: #d1c4e9, 200: #b39ddb, 300: #9575cd, 400: #7e57c2, 500: #673ab7, 600: #5e35b1, 700: #512da8, 800: #4527a0, 900: #311b92, A100: #b388ff, A200: #7c4dff, A400: #651fff, A700: #6200ea, contrast: (50: rgba(0, 0, 0, 0.87), 100: rgba(0, 0, 0, 0.87), 200: rgba(0, 0, 0, 0.87), 300: white, 400: white, 500: rgba(255, 255, 255, 0.87), 600: rgba(255, 255, 255, 0.87), 700: rgba(255, 255, 255, 0.87), 800: rgba(255, 255, 255, 0.87), 900: rgba(255, 255, 255, 0.87), A100: rgba(0, 0, 0, 0.87), A200: white, A400: rgba(255, 255, 255, 0.87), A700: rgba(255, 255, 255, 0.87)), default: #673ab7, lighter: #d1c4e9, darker: #512da8, default-contrast: rgba(255, 255, 255, 0.87), lighter-contrast: rgba(0, 0, 0, 0.87), darker-contrast: rgba(255, 255, 255, 0.87), "50-contrast": rgba(0, 0, 0, 0.87), "100-contrast": rgba(0, 0, 0, 0.87), "200-contrast": rgba(0, 0, 0, 0.87), "300-contrast": white, "400-contrast": white, "500-contrast": rgba(255, 255, 255, 0.87), "600-contrast": rgba(255, 255, 255, 0.87), "700-contrast": rgba(255, 255, 255, 0.87), "800-contrast": rgba(255, 255, 255, 0.87), "900-contrast": rgba(255, 255, 255, 0.87), "A100-contrast": rgba(0, 0, 0, 0.87), "A200-contrast": white, "A400-contrast": rgba(255, 255, 255, 0.87), "A700-contrast": rgba(255, 255, 255, 0.87), "contrast-contrast": null), 100);
689 color: white;
690 border-bottom: 1px solid white; }
691
692.main-container {
693 padding-top: 50px; }
694