
// Do not edit directly
// Generated on Tue, 05 May 2020 11:31:19 GMT

$color-blue-10: #011432;
$color-blue-15: #021e4b;
$color-blue-20: #032863;
$color-blue-25: #03327c;
$color-blue-30: #043c95;
$color-blue-35: #0446ae;
$color-blue-40: #054fc7;
$color-blue-45: #0659e0;
$color-blue-50: #0663f9;
$color-blue-55: #1f73f9;
$color-blue-60: #3882fa;
$color-blue-65: #5192fb;
$color-blue-70: #6aa2fb;
$color-blue-75: #83b1fc;
$color-blue-80: #9cc1fc;
$color-blue-85: #b4d0fd;
$color-blue-90: #cde0fe;
$color-blue-95: #e6effe;
$color-green-10: #12280b;
$color-green-15: #1b3c10;
$color-green-20: #235016;
$color-green-25: #2c641b;
$color-green-30: #357821;
$color-green-35: #3e8c26;
$color-green-40: #47a02c;
$color-green-45: #50b431;
$color-green-50: #59c837;
$color-green-55: #69ce4b;
$color-green-60: #7ad35f;
$color-green-65: #8bd973;
$color-green-70: #9bde87;
$color-green-75: #ace49b;
$color-green-80: #bce9af;
$color-green-85: #cdefc3;
$color-green-90: #def4d7;
$color-green-95: #eefaeb;
$color-grey-0: #ffffff;
$color-grey-10: #161a1d;
$color-grey-15: #21272c;
$color-grey-20: #2b343b;
$color-grey-25: #364049;
$color-grey-30: #414d58;
$color-grey-35: #4c5a67;
$color-grey-40: #576775;
$color-grey-45: #627484;
$color-grey-50: #6c8193;
$color-grey-55: #7b8e9d;
$color-grey-60: #8a9aa8;
$color-grey-65: #98a7b3;
$color-grey-70: #a7b3be;
$color-grey-75: #b6c0c9;
$color-grey-80: #c4cdd4;
$color-grey-85: #d3d9de;
$color-grey-90: #e2e6e9;
$color-grey-95: #f0f2f4;
$color-red-10: #320301;
$color-red-15: #4b0402;
$color-red-20: #630603;
$color-red-25: #7c0703;
$color-red-30: #950904;
$color-red-35: #ae0a04;
$color-red-40: #c70c05;
$color-red-45: #e00d06;
$color-red-50: #f90e06;
$color-red-55: #f9271f;
$color-red-60: #fa3f38;
$color-red-65: #fb5751;
$color-red-70: #fb6f6a;
$color-red-75: #fc8783;
$color-red-80: #fc9f9c;
$color-red-85: #fdb7b4;
$color-red-90: #fecfcd;
$color-red-95: #fee7e6;
$color-yellow-10: #322801;
$color-yellow-15: #4b3c02;
$color-yellow-20: #645002;
$color-yellow-25: #7d6403;
$color-yellow-30: #957804;
$color-yellow-35: #ae8c04;
$color-yellow-40: #c7a005;
$color-yellow-45: #e0b405;
$color-yellow-50: #f9c806;
$color-yellow-55: #facd1f;
$color-yellow-60: #fad338;
$color-yellow-65: #fbd951;
$color-yellow-70: #fbde6a;
$color-yellow-75: #fce383;
$color-yellow-80: #fde99b;
$color-yellow-85: #fdeeb4;
$color-yellow-90: #fef4cd;
$color-yellow-95: #fefae6;
$color-background-accordion-normal: #ffffff; // Background color of the accordion
$color-background-accordion-hover: #f0f2f4; // Background color of the accordion in hover state
$color-background-avatar: #3882fa; // Background color of the avatar
$color-background-banner-info: #e6effe; // Background color of the info banner
$color-background-banner-warning: #fefae6; // Background color of the warning banner
$color-background-banner-error: #fee7e6; // Background color of the error banner
$color-background-banner-success: #eefaeb; // Background color of the success banner
$color-background-banner-emoji-info: #ffffff; // Background color of the info banner
$color-background-banner-emoji-warning: #ffffff; // Background color of the warning banner
$color-background-banner-emoji-error: #ffffff; // Background color of the error banner
$color-background-banner-emoji-success: #ffffff; // Background color of the success banner
$color-background-card: #ffffff; // Background color of the card
$color-background-progress-bar-container: #ffffff; // Background color of the progress bar
$color-background-progress-bar-buffer: #3882fa; // Background color of the buffer of the progress bar
$color-background-snack-bar-info: #e6effe; // Background color of the info snack-bar
$color-background-snack-bar-warning: #fefae6; // Background color of the warning snack-bar
$color-background-snack-bar-error: #fee7e6; // Background color of the error snack-bar
$color-background-snack-bar-success: #eefaeb; // Background color of the success snack-bar
$color-background-snack-bar-emoji-info: #ffffff; // Background color of the info snack-bar
$color-background-snack-bar-emoji-warning: #ffffff; // Background color of the warning snack-bar
$color-background-snack-bar-emoji-error: #ffffff; // Background color of the error snack-bar
$color-background-snack-bar-emoji-success: #ffffff; // Background color of the success banner
$color-background-toggle-container: #ffffff; // Background color of the toggle
$color-background-toggle-selector-normal: #000000; // Background color of the toggle selector
$color-background-toggle-selector-hover: #f9c806; // Background color of the toggle selector on hover
$color-background-toggle-selector-inactive: #3882fa; // Background color of the toggle selector inactive
$color-border-accordion: #f0f2f4; // Border color of the accordion
$color-border-banner-info: #9cc1fc; // Border color of the info banner
$color-border-banner-warning: #fde99b; // Border color of the warning banner
$color-border-banner-error: #fc9f9c; // Border color of the error banner
$color-border-banner-success: #bce9af; // Border color of the success banner
$color-border-chip-success: #bbebb4; // Border color of the success chip
$color-border-chip-error: #fecfcd; // Border color of the error chip
$color-border-chip-info: #cde0fe; // Border color of the info chip
$color-border-chip-message: #e2e6e9; // Border color of the message chip
$color-border-list-header: #f0f2f4; // Border color of the list header
$color-border-snack-bar-info: #9cc1fc; // Border color of the info snack-bar
$color-border-snack-bar-warning: #fde99b; // Border color of the warning snack-bar
$color-border-snack-bar-error: #fc9f9c; // Border color of the error snack-bar
$color-border-snack-bar-success: #bce9af; // Border color of the success snack-bar
$color-text-banner-info: #3882fa; // Text color of the info banner
$color-text-banner-warning: #fad338; // Text color of the warning banner
$color-text-banner-error: #fa3f38; // Text color of the error banner
$color-text-banner-success: #7ad35f; // Text color of the success banner
$color-text-chip-success: #4fd53a; // Text color of the success chip
$color-text-chip-error: #e00d06; // Text color of the error chip
$color-text-chip-info: #0659e0; // Text color of the info chip
$color-text-chip-message: #627484; // Text color of the message chip
$color-text-list-header: #8a9aa8; // Text color of the list header
$color-text-snack-bar-info: #3882fa; // Text color of the info snack-bar
$color-text-snack-bar-warning: #fad338; // Text color of the warning snack-bar
$color-text-snack-bar-error: #fa3f38; // Text color of the error snack-bar
$color-text-snack-bar-success: #7ad35f; // Text color of the success snack-bar
$color-close-icon-info: #0659e0; // Icon color of the close button
$color-close-icon-warning: #e0b405; // Icon color of the warning close button
$color-close-icon-error: #e00d06; // Icon color of the error close button
$color-close-icon-success: #50b431; // Icon color of the success close button
$color-close-background-info: #e6effe; // Hover background color of the info close button
$color-close-background-warning: #fefae6; // Hover background color of the warning close buttonr
$color-close-background-error: #fee7e6; // Hover background color of the error close button
$color-close-background-success: #eefaeb; // Hover background color of the success close button
$color-close-ripple-info: #cde0fe; // Hover background color of the info close button
$color-close-ripple-warning: #fef4cd; // Hover background color of the warning close buttonr
$color-close-ripple-error: #fecfcd; // Hover background color of the error close button
$color-close-ripple-success: #def4d7; // Hover background color of the success close button
$elevation-box-s: 0 2px 4px 0 rgba(0,0,0,0.15);
$elevation-box-m: 0 2px 8px 0 rgba(0,0,0,0.15);
$elevation-box-l: 0 2px 16px 0 rgba(0,0,0,0.15);
$elevation-box-xl: 0 2px 32px 0 rgba(0,0,0,0.15);
$elevation-text-s: 0 1px 1px rgba(0,0,0,0.15);
$height-line-12: 12px;
$height-line-16: 16px;
$height-line-20: 20px;
$height-line-24: 24px;
$height-line-26: 26px;
$height-line-28: 28px;
$height-line-30: 30px;
$height-line-32: 32px;
$height-line-36: 36px;
$height-line-40: 40px;
$height-line-44: 44px;
$height-line-48: 48px;
$height-line-52: 52px;
$height-line-64: 64px;
$height-line-68: 68px;
$height-line-72: 72px;
$size-border-s: 0.0625rem;
$size-border-m: 0.125rem;
$size-border-l: 0.1875rem;
$size-border-xl: 0.25rem;
$size-border-accordion: 0.0625rem; // Size of the border of the accordion
$size-border-banner: 0.0625rem; // Border size of the banner
$size-border-chip: 0.1875rem; // Size of the border of the chip
$size-border-list-header: 0.0625rem; // Size of the border of the list header
$size-border-snack-bar: 0.0625rem; // Border size of the snack-bar
$size-font-12: 0.75rem;
$size-font-14: 0.875rem;
$size-font-16: 1rem;
$size-font-18: 1.125rem;
$size-font-20: 1.25rem;
$size-font-24: 1.5rem;
$size-font-28: 1.75rem;
$size-font-32: 2rem;
$size-font-36: 2.25rem;
$size-font-40: 2.5rem;
$size-font-52: 3.25rem;
$size-font-60: 3.75rem;
$size-font-base: 1rem;
$size-font-normal-xs: 0.75rem;
$size-font-normal-s: 0.875rem;
$size-font-normal-m: 1rem;
$size-font-normal-l: 1.125rem;
$size-font-large-xs: 1.25rem;
$size-font-large-s: 1.5rem;
$size-font-large-m: 1.75rem;
$size-font-large-l: 2rem;
$size-font-extra-large-xs: 2.25rem;
$size-font-extra-large-s: 2.5rem;
$size-font-extra-large-m: 3.25rem;
$size-font-extra-large-l: 3.75rem;
$size-break-point-s-min: 20rem;
$size-break-point-s-max: 39.9375rem;
$size-break-point-m-min: 40rem;
$size-break-point-m-max: 59.9375rem;
$size-break-point-l-min: 60rem;
$size-break-point-l-max: 9999rem;
$size-radius-100: 100rem;
$size-radius-avatar: 100rem; // Radius of the avatar
$size-spacing-none: 0rem;
$size-spacing-xs: 0.25rem;
$size-spacing-s: 0.5rem;
$size-spacing-m: 1rem;
$size-spacing-l: 1.5rem;
$size-spacing-xl: 2rem;
$size-spacing-xxl: 2.5rem;
$size-spacing-xxxl: 3rem;
$size-padding-accordion: 1.5rem; // Padding of the accordion container
$size-padding-vertical-banner: 1.5rem; // Top and bottom padding of the banner container
$size-padding-vertical-snack-bar: 1.5rem; // Top and bottom padding of the snack-bar container
$size-padding-horizontal-banner: 1.5rem; // Left and right padding of the banner container
$size-padding-horizontal-snack-bar: 1.5rem; // Left and right padding of the snack-bar container
$size-padding-chip-horizontal: 0.5rem; // Horizontal padding of the text of the chip
$size-padding-list-header-horizontal: 0rem; // Horizontal padding of the list header
$size-padding-list-header-vertical: 0.25rem; // Horizontal padding of the list header
$size-margin-accordion-active-inset: 1rem; // Margin left and right of the accordion container when inset
$size-margin-accordion-active-vertical: 1rem; // Margin top and bottom of the accordion container when expand
$size-height-chip: 1.5rem; // Height of the chip
$size-height-progress-bar-s: 0.125rem; // Height of the progress bar
$space-letter-null: 0rem;
$space-letter-s: 0.01rem;
$space-letter-m: 0.2rem;
$transition-duration-s: 0.1s;
$transition-duration-m: 0.2s;
$transition-duration-l: 0.5s;
$transition-duration-xl: 1s;
$transition-duration-xxl: 2s;
$transition-function-ease: ease; // Transition effect with a slow start, then fast, then end slowly
$transition-function-ease-in: ease-in; // Transition effect with a slow start
$transition-function-ease-out: ease-out; // Transition effect with a slow end
$transition-function-ease-in-out: ease-in-out; // Transition effect with a slow start and end
$transition-function-linear: linear; // Transition effect with the same speed from start to end
$transition-transform-rotate-90: rotate(90deg);
$transition-transform-rotate-180: rotate(180deg);
$transition-transform-rotate-270: rotate(270deg);
$transition-transform-rotate-360: rotate(360deg);
$transition-transform-accordion-icon: rotate(180deg); // Transform of the icon when the accordion expands and collapse
$transition-transform-avatar-icon: rotate(180deg); // Transform of the icon when the avatar is active
$transition-types-fade: opacity 0.2s ease;
$transition-types-transform: transform 0.2s ease;
$transition-types-width: width 0.2s ease;
$transition-expand-accordion-icon: transform 0.2s ease-in; // Transition of the icon when the accordion expands and collapse
$transition-expand-accordion-duration: 0.2;
$transition-avatar-icon: transform 0.2s ease-in; // Transition of the icon when the avatar is active
$weight-font-light: 300;
$weight-font-regular: 400;
$weight-font-book: 500;
$weight-font-medium: 600;
$weight-font-bold: 700;
$shadow-box-accordion-normal: 0 2px 4px 0 rgba(0,0,0,0.15); // Box shadow of the accordion in normal state
$shadow-box-banner: 0 2px 4px 0 rgba(0,0,0,0.15); // Box shadow of the banner
$shadow-box-card: 0 2px 4px 0 rgba(0,0,0,0.15); // Box shadow of the card
$shadow-box-snack-bar: 0 2px 4px 0 rgba(0,0,0,0.15); // Box shadow of the snack-bar