tfabrica/ClientApp/main-styles.css

library for TFabrica - TechSol

/**
 * Applies styles for users in high contrast mode. Note that this only applies
 * to Microsoft browsers. Chrome can be included by checking for the `html[hc]`
 * attribute, however Chrome handles high contrast differently.
 */
/** The mixins below are shared between md-menu and md-select */
/**
 * This mixin adds the correct panel transform styles based
 * on the direction that the menu panel opens.
 */
/**
 * Applies styles for users in high contrast mode. Note that this only applies
 * to Microsoft browsers. Chrome can be included by checking for the `html[hc]`
 * attribute, however Chrome handles high contrast differently.
 */
/**
 * This mixin contains shared option styles between the select and
 * autocomplete components.
 */
.mat-elevation-z0 {
  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); }

.mat-elevation-z1 {
  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); }

.mat-elevation-z2 {
  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); }

.mat-elevation-z3 {
  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); }

.mat-elevation-z4 {
  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); }

.mat-elevation-z5 {
  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); }

.mat-elevation-z6 {
  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); }

.mat-elevation-z7 {
  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); }

.mat-elevation-z8 {
  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); }

.mat-elevation-z9 {
  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); }

.mat-elevation-z10 {
  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); }

.mat-elevation-z11 {
  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); }

.mat-elevation-z12 {
  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); }

.mat-elevation-z13 {
  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); }

.mat-elevation-z14 {
  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); }

.mat-elevation-z15 {
  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); }

.mat-elevation-z16 {
  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); }

.mat-elevation-z17 {
  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); }

.mat-elevation-z18 {
  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); }

.mat-elevation-z19 {
  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); }

.mat-elevation-z20 {
  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); }

.mat-elevation-z21 {
  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); }

.mat-elevation-z22 {
  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); }

.mat-elevation-z23 {
  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); }

.mat-elevation-z24 {
  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); }

.mat-ripple {
  overflow: hidden; }

.mat-ripple.mat-ripple-unbounded {
  overflow: visible; }

.mat-ripple-element {
  position: absolute;
  border-radius: 50%;
  pointer-events: none;
  background-color: rgba(0, 0, 0, 0.1);
  transition: opacity, transform 0ms cubic-bezier(0, 0, 0.2, 1);
  transform: scale(0); }

.mat-option {
  white-space: nowrap;
  overflow-x: hidden;
  text-overflow: ellipsis;
  display: block;
  line-height: 48px;
  height: 48px;
  padding: 0 16px;
  font-size: 16px;
  font-family: Roboto, "Helvetica Neue", sans-serif;
  text-align: start;
  text-decoration: none;
  position: relative;
  cursor: pointer;
  outline: none; }
  .mat-option[disabled] {
    cursor: default; }
  .mat-option .mat-icon {
    margin-right: 16px; }
    [dir='rtl'] .mat-option .mat-icon {
      margin-left: 16px; }
  .mat-option[aria-disabled='true'] {
    cursor: default;
    user-select: none; }

.mat-option-ripple {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0; }
  @media screen and (-ms-high-contrast: active) {
    .mat-option-ripple {
      opacity: 0.5; } }

.cdk-visually-hidden {
  border: 0;
  clip: rect(0 0 0 0);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  text-transform: none;
  width: 1px; }

.cdk-overlay-container, .cdk-global-overlay-wrapper {
  pointer-events: none;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%; }

.cdk-overlay-container {
  position: fixed;
  z-index: 1000; }

.cdk-global-overlay-wrapper {
  display: flex;
  position: absolute;
  z-index: 1000; }

.cdk-overlay-pane {
  position: absolute;
  pointer-events: auto;
  box-sizing: border-box;
  z-index: 1000; }

.cdk-overlay-backdrop {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 1000;
  pointer-events: auto;
  transition: opacity 400ms cubic-bezier(0.25, 0.8, 0.25, 1);
  opacity: 0; }
  .cdk-overlay-backdrop.cdk-overlay-backdrop-showing {
    opacity: 0.48; }

.cdk-overlay-dark-backdrop {
  background: rgba(0, 0, 0, 0.6); }

.cdk-overlay-transparent-backdrop {
  background: none; }

.mat-option:hover:not(.mat-option-disabled), .mat-option:focus:not(.mat-option-disabled) {
  background: rgba(0, 0, 0, 0.04); }

.mat-option.mat-selected {
  background: rgba(0, 0, 0, 0.04);
  color: #673ab7; }

.mat-option.mat-active {
  background: rgba(0, 0, 0, 0.04);
  color: rgba(0, 0, 0, 0.87); }

.mat-option.mat-option-disabled {
  color: rgba(0, 0, 0, 0.38); }

.mat-pseudo-checkbox::after {
  color: #fafafa; }

.mat-pseudo-checkbox-checked, .mat-pseudo-checkbox-indeterminate {
  border: none; }
  .mat-pseudo-checkbox-checked.mat-primary, .mat-pseudo-checkbox-indeterminate.mat-primary {
    background: #673ab7; }
  .mat-pseudo-checkbox-checked.mat-accent, .mat-pseudo-checkbox-indeterminate.mat-accent {
    background: #ffc107; }
  .mat-pseudo-checkbox-checked.mat-warn, .mat-pseudo-checkbox-indeterminate.mat-warn {
    background: #f44336; }
  .mat-pseudo-checkbox-checked.mat-pseudo-checkbox-disabled, .mat-pseudo-checkbox-indeterminate.mat-pseudo-checkbox-disabled {
    background: #b0b0b0; }

.mat-app-background {
  background-color: #fafafa; }

.mat-autocomplete-panel {
  background: white;
  color: rgba(0, 0, 0, 0.87); }
  .mat-autocomplete-panel .mat-option.mat-selected:not(.mat-active) {
    background: white;
    color: rgba(0, 0, 0, 0.87); }

.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 {
  background-color: rgba(103, 58, 183, 0.12); }

.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 {
  background-color: rgba(255, 215, 64, 0.12); }

.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 {
  background-color: rgba(244, 67, 54, 0.12); }

.mat-button, .mat-icon-button {
  background: transparent; }
  .mat-button.mat-primary, .mat-icon-button.mat-primary {
    color: #673ab7; }
  .mat-button.mat-accent, .mat-icon-button.mat-accent {
    color: #ffd740; }
  .mat-button.mat-warn, .mat-icon-button.mat-warn {
    color: #f44336; }
  .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] {
    color: rgba(0, 0, 0, 0.38); }
  .mat-button:hover.mat-primary .mat-button-focus-overlay, .mat-icon-button:hover.mat-primary .mat-button-focus-overlay {
    background-color: rgba(103, 58, 183, 0.12); }
  .mat-button:hover.mat-accent .mat-button-focus-overlay, .mat-icon-button:hover.mat-accent .mat-button-focus-overlay {
    background-color: rgba(255, 215, 64, 0.12); }
  .mat-button:hover.mat-warn .mat-button-focus-overlay, .mat-icon-button:hover.mat-warn .mat-button-focus-overlay {
    background-color: rgba(244, 67, 54, 0.12); }

.mat-raised-button, .mat-fab, .mat-mini-fab {
  color: rgba(0, 0, 0, 0.87);
  background-color: white; }
  .mat-raised-button.mat-primary, .mat-fab.mat-primary, .mat-mini-fab.mat-primary {
    color: rgba(255, 255, 255, 0.87); }
  .mat-raised-button.mat-accent, .mat-fab.mat-accent, .mat-mini-fab.mat-accent {
    color: rgba(0, 0, 0, 0.87); }
  .mat-raised-button.mat-warn, .mat-fab.mat-warn, .mat-mini-fab.mat-warn {
    color: white; }
  .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] {
    color: rgba(0, 0, 0, 0.38); }
  .mat-raised-button.mat-primary, .mat-fab.mat-primary, .mat-mini-fab.mat-primary {
    background-color: #673ab7; }
  .mat-raised-button.mat-accent, .mat-fab.mat-accent, .mat-mini-fab.mat-accent {
    background-color: #ffd740; }
  .mat-raised-button.mat-warn, .mat-fab.mat-warn, .mat-mini-fab.mat-warn {
    background-color: #f44336; }
  .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] {
    background-color: rgba(0, 0, 0, 0.12); }

.mat-fab, .mat-mini-fab {
  background-color: #ffd740;
  color: rgba(0, 0, 0, 0.87); }

.mat-button-toggle {
  color: rgba(0, 0, 0, 0.38); }

.mat-button-toggle-checked {
  background-color: #e0e0e0;
  color: black; }

.mat-button-toggle-disabled {
  background-color: #eeeeee;
  color: rgba(0, 0, 0, 0.38); }
  .mat-button-toggle-disabled.mat-button-toggle-checked {
    background-color: #bdbdbd; }

.mat-card {
  background: white;
  color: black; }

.mat-card-subtitle {
  color: rgba(0, 0, 0, 0.54); }

.mat-checkbox-frame {
  border-color: rgba(0, 0, 0, 0.54); }

.mat-checkbox-checkmark {
  fill: #fafafa; }

.mat-checkbox-checkmark-path {
  stroke: #fafafa !important; }

.mat-checkbox-mixedmark {
  background-color: #fafafa; }

.mat-checkbox-indeterminate.mat-primary .mat-checkbox-background, .mat-checkbox-checked.mat-primary .mat-checkbox-background {
  background-color: #673ab7; }

.mat-checkbox-indeterminate.mat-accent .mat-checkbox-background, .mat-checkbox-checked.mat-accent .mat-checkbox-background {
  background-color: #ffc107; }

.mat-checkbox-indeterminate.mat-warn .mat-checkbox-background, .mat-checkbox-checked.mat-warn .mat-checkbox-background {
  background-color: #f44336; }

.mat-checkbox-disabled.mat-checkbox-checked .mat-checkbox-background, .mat-checkbox-disabled.mat-checkbox-indeterminate .mat-checkbox-background {
  background-color: #b0b0b0; }

.mat-checkbox-disabled:not(.mat-checkbox-checked) .mat-checkbox-frame {
  border-color: #b0b0b0; }

.mat-checkbox:not(.mat-checkbox-disabled).mat-primary .mat-checkbox-ripple .mat-ripple-element {
  background-color: rgba(103, 58, 183, 0.26); }

.mat-checkbox:not(.mat-checkbox-disabled).mat-accent .mat-checkbox-ripple .mat-ripple-element {
  background-color: rgba(255, 215, 64, 0.26); }

.mat-checkbox:not(.mat-checkbox-disabled).mat-warn .mat-checkbox-ripple .mat-ripple-element {
  background-color: rgba(244, 67, 54, 0.26); }

.mat-chip:not(.mat-basic-chip) {
  background-color: #e0e0e0;
  color: rgba(0, 0, 0, 0.87); }

.mat-chip.mat-chip-selected:not(.mat-basic-chip) {
  background-color: #808080;
  color: rgba(255, 255, 255, 0.87); }
  .mat-chip.mat-chip-selected:not(.mat-basic-chip).mat-primary {
    background-color: #673ab7;
    color: rgba(255, 255, 255, 0.87); }
  .mat-chip.mat-chip-selected:not(.mat-basic-chip).mat-accent {
    background-color: #ffc107;
    color: rgba(0, 0, 0, 0.87); }
  .mat-chip.mat-chip-selected:not(.mat-basic-chip).mat-warn {
    background-color: #f44336;
    color: white; }

.mat-dialog-container {
  background: white; }

.mat-icon.mat-primary {
  color: #673ab7; }

.mat-icon.mat-accent {
  color: #ffd740; }

.mat-icon.mat-warn {
  color: #f44336; }

.mat-input-placeholder {
  color: rgba(0, 0, 0, 0.38); }
  .mat-input-placeholder.mat-focused {
    color: #673ab7; }
    .mat-input-placeholder.mat-focused.mat-accent {
      color: #ffd740; }
    .mat-input-placeholder.mat-focused.mat-warn {
      color: #f44336; }

.mat-input-element:disabled {
  color: rgba(0, 0, 0, 0.38); }

input.mat-input-element:-webkit-autofill + .mat-input-placeholder .mat-placeholder-required,
.mat-input-placeholder.mat-float.mat-focused .mat-placeholder-required {
  color: #ffd740; }

.mat-input-underline {
  border-color: rgba(0, 0, 0, 0.12); }
  .mat-input-underline .mat-input-ripple {
    background-color: #673ab7; }
    .mat-input-underline .mat-input-ripple.mat-accent {
      background-color: #ffd740; }
    .mat-input-underline .mat-input-ripple.mat-warn {
      background-color: #f44336; }

.mat-list .mat-list-item, .mat-nav-list .mat-list-item {
  color: black; }

.mat-list .mat-subheader, .mat-nav-list .mat-subheader {
  color: rgba(0, 0, 0, 0.54); }

.mat-divider {
  border-top-color: rgba(0, 0, 0, 0.12); }

.mat-nav-list .mat-list-item-content:hover, .mat-nav-list .mat-list-item-content.mat-list-item-focus {
  background: rgba(0, 0, 0, 0.04); }

.mat-menu-content {
  background: white; }

.mat-menu-item {
  background: transparent;
  color: rgba(0, 0, 0, 0.87); }
  .mat-menu-item[disabled] {
    color: rgba(0, 0, 0, 0.38); }
  .mat-menu-item .mat-icon {
    color: rgba(0, 0, 0, 0.54);
    vertical-align: middle; }
  .mat-menu-item:hover:not([disabled]), .mat-menu-item:focus:not([disabled]) {
    background: rgba(0, 0, 0, 0.04); }

.mat-progress-bar-background {
  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"); }

.mat-progress-bar-buffer {
  background-color: #d1c4e9; }

.mat-progress-bar-fill::after {
  background-color: #5e35b1; }

.mat-progress-bar.mat-accent .mat-progress-bar-background {
  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"); }

.mat-progress-bar.mat-accent .mat-progress-bar-buffer {
  background-color: #ffecb3; }

.mat-progress-bar.mat-accent .mat-progress-bar-fill::after {
  background-color: #ffb300; }

.mat-progress-bar.mat-warn .mat-progress-bar-background {
  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"); }

.mat-progress-bar.mat-warn .mat-progress-bar-buffer {
  background-color: #ffcdd2; }

.mat-progress-bar.mat-warn .mat-progress-bar-fill::after {
  background-color: #e53935; }

.mat-progress-spinner path, .mat-progress-circle path, .mat-spinner path {
  stroke: #5e35b1; }

.mat-progress-spinner.mat-accent path, .mat-progress-circle.mat-accent path, .mat-spinner.mat-accent path {
  stroke: #ffb300; }

.mat-progress-spinner.mat-warn path, .mat-progress-circle.mat-warn path, .mat-spinner.mat-warn path {
  stroke: #e53935; }

.mat-radio-outer-circle {
  border-color: rgba(0, 0, 0, 0.54); }
  .mat-radio-checked .mat-radio-outer-circle {
    border-color: #ffd740; }
  .mat-radio-disabled .mat-radio-outer-circle {
    border-color: rgba(0, 0, 0, 0.38); }

.mat-radio-inner-circle {
  background-color: #ffd740; }
  .mat-radio-disabled .mat-radio-inner-circle {
    background-color: rgba(0, 0, 0, 0.38); }

.mat-radio-ripple .mat-ripple-element {
  background-color: rgba(255, 215, 64, 0.26); }
  .mat-radio-disabled .mat-radio-ripple .mat-ripple-element {
    background-color: rgba(0, 0, 0, 0.38); }

.mat-select-trigger {
  color: rgba(0, 0, 0, 0.38); }
  .mat-select:focus:not(.mat-select-disabled) .mat-select-trigger {
    color: #673ab7; }
  .mat-select.ng-invalid.ng-touched:not(.mat-select-disabled) .mat-select-trigger {
    color: #f44336; }

.mat-select-underline {
  background-color: rgba(0, 0, 0, 0.12); }
  .mat-select:focus:not(.mat-select-disabled) .mat-select-underline {
    background-color: #673ab7; }
  .mat-select.ng-invalid.ng-touched:not(.mat-select-disabled) .mat-select-underline {
    background-color: #f44336; }

.mat-select-arrow {
  color: rgba(0, 0, 0, 0.38); }
  .mat-select:focus:not(.mat-select-disabled) .mat-select-arrow {
    color: #673ab7; }
  .mat-select.ng-invalid.ng-touched:not(.mat-select-disabled) .mat-select-arrow {
    color: #f44336; }

.mat-select-content, .mat-select-panel-done-animating {
  background: white; }

.mat-select-value {
  color: rgba(0, 0, 0, 0.87); }
  .mat-select-disabled .mat-select-value {
    color: rgba(0, 0, 0, 0.38); }

.mat-sidenav-container {
  background-color: #fafafa;
  color: rgba(0, 0, 0, 0.87); }

.mat-sidenav {
  background-color: white;
  color: rgba(0, 0, 0, 0.87); }
  .mat-sidenav.mat-sidenav-push {
    background-color: white; }

.mat-sidenav-backdrop.mat-sidenav-shown {
  background-color: rgba(0, 0, 0, 0.6); }

.mat-slide-toggle.mat-checked:not(.mat-disabled) .mat-slide-toggle-thumb {
  background-color: #ffc107; }

.mat-slide-toggle.mat-checked:not(.mat-disabled) .mat-slide-toggle-bar {
  background-color: rgba(255, 193, 7, 0.5); }

.mat-slide-toggle.mat-slide-toggle-focused:not(.mat-checked) .mat-ink-ripple {
  background-color: rgba(0, 0, 0, 0.12); }

.mat-slide-toggle.mat-slide-toggle-focused .mat-ink-ripple {
  background-color: rgba(255, 193, 7, 0.26); }

.mat-slide-toggle.mat-primary.mat-checked:not(.mat-disabled) .mat-slide-toggle-thumb {
  background-color: #673ab7; }

.mat-slide-toggle.mat-primary.mat-checked:not(.mat-disabled) .mat-slide-toggle-bar {
  background-color: rgba(103, 58, 183, 0.5); }

.mat-slide-toggle.mat-primary.mat-slide-toggle-focused:not(.mat-checked) .mat-ink-ripple {
  background-color: rgba(0, 0, 0, 0.12); }

.mat-slide-toggle.mat-primary.mat-slide-toggle-focused .mat-ink-ripple {
  background-color: rgba(103, 58, 183, 0.26); }

.mat-slide-toggle.mat-warn.mat-checked:not(.mat-disabled) .mat-slide-toggle-thumb {
  background-color: #f44336; }

.mat-slide-toggle.mat-warn.mat-checked:not(.mat-disabled) .mat-slide-toggle-bar {
  background-color: rgba(244, 67, 54, 0.5); }

.mat-slide-toggle.mat-warn.mat-slide-toggle-focused:not(.mat-checked) .mat-ink-ripple {
  background-color: rgba(0, 0, 0, 0.12); }

.mat-slide-toggle.mat-warn.mat-slide-toggle-focused .mat-ink-ripple {
  background-color: rgba(244, 67, 54, 0.26); }

.mat-disabled .mat-slide-toggle-thumb {
  background-color: #bdbdbd; }

.mat-disabled .mat-slide-toggle-bar {
  background-color: rgba(0, 0, 0, 0.1); }

.mat-slide-toggle-thumb {
  background-color: #fafafa; }

.mat-slide-toggle-bar {
  background-color: rgba(0, 0, 0, 0.38); }

.mat-slider-track-background {
  background-color: rgba(0, 0, 0, 0.26); }

.mat-slider-track-fill {
  background-color: #ffd740; }

.mat-slider-thumb {
  background-color: #ffd740; }

.mat-slider-thumb-label {
  background-color: #ffd740; }

.mat-slider-thumb-label-text {
  color: rgba(0, 0, 0, 0.87); }

.mat-slider:hover .mat-slider-track-background,
.mat-slider-active .mat-slider-track-background {
  background-color: rgba(0, 0, 0, 0.38); }

.mat-slider-disabled .mat-slider-track-background,
.mat-slider-disabled .mat-slider-track-fill,
.mat-slider-disabled .mat-slider-thumb {
  background-color: rgba(0, 0, 0, 0.26); }

.mat-slider-disabled:hover .mat-slider-track-background {
  background-color: rgba(0, 0, 0, 0.26); }

.mat-slider-min-value.mat-slider-thumb-label-showing .mat-slider-thumb,
.mat-slider-min-value.mat-slider-thumb-label-showing .mat-slider-thumb-label {
  background-color: black; }

.mat-slider-min-value.mat-slider-thumb-label-showing.mat-slider-active .mat-slider-thumb,
.mat-slider-min-value.mat-slider-thumb-label-showing.mat-slider-active .mat-slider-thumb-label {
  background-color: rgba(0, 0, 0, 0.26); }

.mat-slider-min-value:not(.mat-slider-thumb-label-showing) .mat-slider-thumb {
  border-color: rgba(0, 0, 0, 0.26);
  background-color: transparent; }

.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 {
  border-color: rgba(0, 0, 0, 0.38); }

.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 {
  border-color: rgba(0, 0, 0, 0.26); }

.mat-tab-nav-bar,
.mat-tab-header {
  border-bottom: 1px solid #e0e0e0; }
  .mat-tab-group-inverted-header .mat-tab-nav-bar, .mat-tab-group-inverted-header
  .mat-tab-header {
    border-top: 1px solid #e0e0e0;
    border-bottom: none; }

.mat-tab-label:focus {
  background-color: rgba(209, 196, 233, 0.3); }

.mat-ink-bar {
  background-color: #673ab7; }

.mat-toolbar {
  background: whitesmoke;
  color: rgba(0, 0, 0, 0.87); }
  .mat-toolbar.mat-primary {
    background: #673ab7;
    color: rgba(255, 255, 255, 0.87); }
  .mat-toolbar.mat-accent {
    background: #ffd740;
    color: rgba(0, 0, 0, 0.87); }
  .mat-toolbar.mat-warn {
    background: #f44336;
    color: white; }

.mat-tooltip {
  background: rgba(97, 97, 97, 0.9); }

/**
 * Applies styles for users in high contrast mode. Note that this only applies
 * to Microsoft browsers. Chrome can be included by checking for the `html[hc]`
 * attribute, however Chrome handles high contrast differently.
 */
/** The mixins below are shared between md-menu and md-select */
/**
 * This mixin adds the correct panel transform styles based
 * on the direction that the menu panel opens.
 */
/**
 * Applies styles for users in high contrast mode. Note that this only applies
 * to Microsoft browsers. Chrome can be included by checking for the `html[hc]`
 * attribute, however Chrome handles high contrast differently.
 */
/**
 * This mixin contains shared option styles between the select and
 * autocomplete components.
 */
html, body {
  height: 100%; }

.login-container {
  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)); }

.error-message {
  margin-top: -10px;
  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)); }

.sidenav-level-7 {
  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);
  color: white;
  border-bottom: 1px solid white; }

.sidenav-level-8 {
  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);
  color: white;
  border-bottom: 1px solid white; }

.sidenav-level-6 {
  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);
  color: white;
  border-bottom: 1px solid white; }

.sidenav-level-5 {
  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);
  color: white;
  border-bottom: 1px solid white; }

.sidenav-level-4 {
  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);
  color: white;
  border-bottom: 1px solid white; }

.main-container {
  padding-top: 50px; }