$primary-color: #563d7c !default; $accent-color: #ffab40 !default; $danger-color: #ef5350 !default; $default-theme-dark: false !default; $default-uwp-style: false !default; $font-thin: 100; $font-light: 300; $font-regular: 400; $font-medium: 500; $font-bold: 700; $font-black: 900; $white: #fff !default; $gray-100: #f5f5f5 !default; $gray-200: #eee !default; $gray-300: #e0e0e0 !default; $gray-400: #bdbdbd !default; $gray-500: #9e9e9e !default; $gray-600: #757575 !default; $gray-700: #616161 !default; $gray-800: #424242 !default; $gray-900: #212121 !default; $black: #000 !default; $blue: #2196f3 !default; $indigo: #3f51b5 !default; $purple: #9c27b0 !default; $pink: #e91e63 !default; $red: #f44336 !default; $orange: #ff9800 !default; $yellow: #ffeb3b !default; $green: #4caf50 !default; $teal: #009688 !default; $cyan: #00bcd4 !default; $theme-colors: ( primary: $primary-color, //Octopus material changes accent: $accent-color, danger: $danger-color ) !default; $color-high-contrast-light-theme: rgba(0, 0, 0, .87) !default; $color-high-contrast-dark-theme: $white !default; $color-lower-contrast-light-theme: rgba(0, 0, 0, .42) !default; $color-low-contrast-light-theme: rgba(0, 0, 0, .42) !default; $color-low-contrast-dark-theme: rgba(255, 255, 255, .7) !default; //// This variable affects the `.h-*` and `.w-*` classes. //$sizes: ( // 25: 25%, // 50: 50%, // 75: 75%, // 100: 100% //) !default; // Body // // Settings for the `` element. $body-bg: $gray-100 !default; //Octopus material changes $body-color: $gray-900 !default; $bg-light: $gray-100 !default; //Octopus material changes $bg-dark: #2d2d2d !default; //Octopus material changes $body-color-light-theme: $gray-900 !default; //Octopus material changes $body-color-dark-theme: $white !default; //Octopus material changes // Links // // Style anchor elements. $link-color: $primary-color !default; //Margin and guttters $margin-gutter-8dp: .5rem !default; $margin-gutter-16dp: 1rem !default; $margin-gutter-24dp: 1.5rem !default; $margin-gutter-40dp: 2.5rem !default; $margin-gutter-default: $margin-gutter-16dp !default; $margins-and-gutters: ( default: $margin-gutter-default, none: 0, 8: $margin-gutter-8dp, 16: $margin-gutter-16dp, 24: $margin-gutter-24dp, 40: $margin-gutter-40dp); // Grid columns // // Set the number of columns and specify the width of the gutters. $grid-gutter-width: $margin-gutter-default !default; // Components // // Define common padding and border radius sizes and more. $uwp-border-width: .125rem; // Fonts // // Font, line-height, and color for body text, headings, and more. $font-family-base: Roboto, -apple-system, BlinkMacSystemFont, "Segoe UI", "Helvetica Neue", Arial, sans-serif !default; //Octopus material custom code $font-size-base: .875rem !default; $display4-size: $font-size-base * 8 !default; //Octopus custom code $display3-size: $font-size-base * 4 !default; //Octopus custom code $display2-size: $font-size-base * 3.21 !default; //Octopus custom code $display1-size: $font-size-base * 2.42 !default; //Octopus custom code $headline-size: $font-size-base * 1.7 !default; $title-size: $font-size-base * 1.4 !default; $subheading-size: $font-size-base * 1.1 !default; $body-2-size: $font-size-base !default; $body-1-size: $font-size-base !default; $caption-size: $font-size-base * 0.85 !default; $font-size-button: $font-size-base !default; $display4-weight: $font-light !default; $display3-weight: $font-regular !default; $display2-weight: $font-regular !default; $display1-weight: $font-regular !default; $headline-weight: $font-regular !default; $title-weight: $font-medium !default; $subheading-weight: $font-regular !default; $body-2-weight: $font-medium !default; $body-1-weight: $font-regular !default; $caption-weight: $font-regular !default; $headline-line-height: 1.15rem; $title-line-height: 1.15rem; $subheading-line-height: 1.15rem; $lead-font-size: 1.25rem !default; $base-icon-size: 1.5rem; $base-dense-icon-size: 1.3125rem; $text-high-contrast-light-theme: $body-color !default; $text-high-contrast-dark-theme: $white !default; $text-low-contrast-light-theme: rgba(0, 0, 0, 0.54) !default; $text-low-contrast-dark-theme: rgba(255, 255, 255, .7) !default; $text-lower-contrast: rgba(0, 0, 0, 0.42) !default; $text-lower-contrast-dark-theme: rgba(255, 255, 255, .5) !default; // Buttons // // For each of Bootstrap's buttons, define text, background and border color. //$danger-color: #d50000 !default; // $awesome-cubic-bezier: cubic-bezier(0.19, 1, 0.22, 1); // //$bg-body: #fafafa !default; // $row-horizontal-padding: 1rem !default; // $base-semi-transparent-color: rgba(0, 0, 0, .12) !default; $base-hover-background-color: $base-semi-transparent-color !default; $base-active-background-color: rgba(0, 0, 0, .2) !default; $hover-background-light-theme: rgba(0, 0, 0, .12) !default; $hover-background-dark-theme: rgba(204, 204, 204,.1) !default; $focus-background-light-theme: rgba(0, 0, 0, .2) !default; $focus-background-dark-theme: rgba(204, 204, 204,.25) !default; //$base-dense-color: rgba(0, 0, 0, 0.87) !default; // //$enable-hover-media-query: false !default; // //Avatar $avatar-size: 2.5rem !default; //Selection controls $selection-control-label-margin: .5rem; $selection-control-checked-color: $primary-color !default; $selection-control-hover-size: 2.5rem !default; $selection-control-hover-color: rgba($selection-control-checked-color, 0.2) !default; $checkbox-radio-border-light-theme: .125rem solid rgba(0,0,0,.54) !default; $checkbox-radio-border-dark-theme: .125rem solid rgba(255,255,255,.7) !default; $checkbox-radio-disabled-color-light-theme: rgba(0,0,0,.26) !default; $checkbox-radio-disabled-color-dark-theme: rgba(255,255,255,.3) !default; $checkbox-size: 1.125rem !default; $checkbox-border-radius: .125rem !default; $checkbox-mark-width: .75rem !default; $checkbox-mark-height: .375rem !default; $checkbox-mark-top: .1875rem !default; $checkbox-mark-left: .0625rem !default; $checkbox-mark-border-width: .125rem !default; $checkbox-mark-color-light-theme: $bg-light; $radio-size: 1.25rem !default; $radio-check-mark-size: $radio-size / 2 !default; $switch-width: 2.25rem !default; $switch-height: .875rem !default; $switch-border-radius: .5rem !default; $switch-background-color-light-theme: rgba(0,0,0,.38) !default; $switch-background-color-dark-theme: rgba(255,255,255,.3) !default; $switch-disabled-background-color-light-theme: rgba(0,0,0,.12) !default; $switch-disabled-background-color-dark-theme: rgba(255,255,255,.1) !default; $switch-checked-background-color: rgba($selection-control-checked-color, .5) !default; $switch-toggle-size: 1.25rem !default; $switch-toggle-background-color-light-theme: #fafafa !default; $switch-toggle-background-color-dark-theme: #bdbdbd !default; $switch-toggle-disabled-background-color-light-theme: #bdbdbd !default; $switch-toggle-disabled-background-color-dark-theme: #424242 !default; $switch-toggle-box-shadow: 0 1px 3px 0 rgba(0,0,0,0.2), 0 1px 1px 0 rgba(0,0,0,0.14), 0 2px 1px -1px rgba(0,0,0,0.12); //Badges $badge-size: 1.125rem !default; $badge-position: -.625rem !default; $badge-font-size: .75rem !default; $badge-font-weight: $font-medium !default; //Card $card-small-title-font-size: $font-size-base !default; $card-large-title-font-size: 1.5rem !default; $card-subtitle-color-light-theme: $text-low-contrast-light-theme !default; $card-subtitle-color-dark-theme: $white !default; $card-subtitle-font-size: $font-size-base !default; $card-subtitle-font-weight: $font-medium !default; $card-subtitle-margin: 0.75rem !default; $card-side-padding: 1rem !default; $card-base-small-vertical-padding: 1rem !default; $card-base-large-vertical-padding: 1.5rem !default; $card-base-small-vertical-padding: 1rem !default; $card-base-bottom-padding: 1.5rem !default; $card-body-top-padding: $card-base-small-vertical-padding !default; $card-body-bottom-padding: $card-base-bottom-padding !default; $card-border-radius: .125rem !default; $card-shadow: 0 3px 1px -2px rgba(0,0,0,.2), 0 2px 2px 0 rgba(0,0,0,.14), 0 1px 5px 0 rgba(0,0,0,.12) !default; $card-actions-padding: .5rem !default; $card-bg-light-theme: #fff !default; $card-bg-dark-theme: #424242 !default; //Expansion panel $expansion-panel-divider-width: .0625rem !default; $expansion-panel-border-radius: $card-border-radius !default; $expansion-panel-label-height: 3rem !default; $expansion-panel-label-font-size: .9375rem !default; $expansion-panel-horizontal-padding: 1.5rem !default; $expansion-panel-content-margin: 1rem !default; $expansion-panel-switch-size: 1.5rem !default; //Dialog $dialog-backdrop-bg: $black !default; $dialog-backdrop-opacity: .5 !default; $dialog-border-radius: 2px !default; $dialog-padding: 24px !default; $dialog-title-body-distance: 20px !default; $dialog-actions-padding: 8px !default; $dialog-background-light-theme: #fff !default; $dialog-background-dark-theme: #424242 !default; $uwp-dialog-border-width: .0625rem !default; //Dropdown $dropdown-menu-border-radius: .125rem !default; $dropdown-menu-padding: .5rem !default; $dropdown-menu-bg-light-theme: #fff !default; $dropdown-menu-bg-dark-theme: #424242 !default; $dropdown-item-height: 3rem; $dropdown-item-padding: 1rem; $dropdown-item-font-size: 1rem; $dropdown-item-color-light-theme: $body-color-light-theme; $dropdown-item-color-dark-theme: $body-color-dark-theme; $dropdown-in-data-table-bg-light-theme: #fafafa !default; $dropdown-in-data-table-bg-dark-theme: $gray-700 !default; $dropdown-in-data-table-toggle-icon-size: 22px !default; $dropdown-icon-size: .3rem !default; $dropdown-icon-color-light-theme: $color-low-contrast-light-theme !default; $dropdown-icon-color-dark-theme: $color-low-contrast-dark-theme !default; $uwp-dropdown-border-width: .0625rem; $uwp-dropdown-border-color-light-theme: $base-semi-transparent-color !default; $uwp-dropdown-border-color-dark-theme: rgba(204,204,204,.54) !default; //Dropdown dense $dropdown-item-dense-height: 2rem; $dropdown-item-dense-padding: 1.5rem; $dropdown-item-dense-font-size: .9375rem; //Floating content $floating-content-padding: 1.25rem !default; //Chip $chip-height: 2rem !default; $chip-margin: .5rem !default; $chip-margin-vertical: .25rem !default; $chip-background-color-light-theme: #e0e0e0 !default; $chip-background-color-dark-theme: #424242 !default; $chip-remove-color-light-theme: $chip-background-color-dark-theme !default; $chip-remove-color-dark-theme: $chip-background-color-light-theme !default; $chip-remove-color: rgba(0, 0, 0, 0.54) !default; $chip-remove-hover-color: #f44336 !default; $chip-remove-size: 1.5rem !default; $chip-remove-margin: .25rem !default; $chip-avatar-size: $chip-height !default; $chip-avatar-font-size: 1rem !default; $chip-avatar-margin: .5rem !default; $chip-font-size: 0.8125rem !default; $chip-font-weight: $font-regular !default; $chip-label-margin: 0.75rem !default; //Data table $data-table-divider-color: $base-semi-transparent-color !default; $data-table-divider-width: .0625rem !default; $data-table-border: $data-table-divider-width solid $data-table-divider-color !default; $data-table-horizontal-padding: $row-horizontal-padding !default; $data-table-column-vertical-padding: .8125rem !default; $data-table-column-header-vertical-padding: 1.25rem !default; $data-table-column-header-font-size: .8125rem !default; $data-table-column-header-font-weight: $font-medium !default; $data-table-column-header-line-height: 1rem !default; $data-table-column-header-color-light-theme: $text-low-contrast-light-theme; $data-table-column-header-color-dark-theme: $text-low-contrast-dark-theme; $data-table-row-hover-background-color-light-theme: #eee !default; $data-table-row-hover-background-color-dark-theme: #626262 !default; $data-table-row-selected-bg-light-theme: #f5f5f5 !default; $data-table-row-selected-bg-dark-theme: #525252 !default; $data-table-card-footer-height: 4rem !default; $data-table-card-footer-font-color: $text-low-contrast-light-theme !default; $data-table-card-footer-font-size: .75rem !default; $data-table-card-footer-font-weight: $font-regular !default; $data-table-content-font-size: .875rem !default; $data-table-content-font-weight: $font-medium !default; //Divider $divider-height: .0625rem !default; $divider-color: $base-semi-transparent-color !default; //Buttons $btn-disabled-background-light-theme: rgba(0, 0, 0, .12) !default; $btn-disabled-background-dark-theme: rgba(255, 255, 255, .12) !default; $btn-disabled-color-light-theme: rgba(0, 0, 0, .26) !default; $btn-disabled-color-dark-theme: rgba(255, 255, 255, .3) !default; $btn-side-padding: 1rem !default; $btn-height: 2.25rem !default; $btn-border-radius: .125rem !default; $btn-font-size: $font-size-base !default; $btn-font-weight: $font-medium !default; $btn-default-background-light: $white !default; $btn-default-background-dark: $gray-800 !default; $floating-button-size: 3.5rem !default; $floating-button-small-size: 2.5rem !default; $floating-button-icon-size: $base-icon-size !default; $btn-borderless-color-light-theme: $text-low-contrast-light-theme !default; $btn-borderless-color-dark-theme: $white !default; $btn-borderless-font-size: $base-icon-size !default; $btn-borderless-margin: 1.5rem !default; $btn-borderless-hover-size: 2.5rem !default; $btn-outline-border-width: .0625rem !default; $btn-outline-gray-border-color-light-theme: rgba(0, 0, 0, .12) !default; $btn-outline-gray-border-color-dark-theme: rgba(255, 255, 255, .12) !default; $btn-icon-size: 1.125rem !default; //UWP Buttons $uwp-btn-border-radius: 0 !default; $uwp-btn-hover-border-width: $uwp-border-width !default; $uwp-btn-active-background-color-light-theme: $color-low-contrast-light-theme !default; $uwp-btn-active-background-color-dark-theme: rgba(204,204,204,.54) !default; $uwp-btn-flat-active-background-color-light-theme: $hover-background-light-theme !default; $uwp-btn-flat-active-background-color-dark-theme: $uwp-btn-active-background-color-dark-theme !default; //Buttons dense $btn-dense-font-size: .8125rem !default; $btn-dense-height: 2rem !default; $btn-icon-dense-size: 1rem !default; //List $list-vertical-padding: .5rem !default; $list-icon-size: $base-icon-size !default; $list-icon-color-light-theme: $text-low-contrast-light-theme !default; $list-icon-color-dark-theme: $text-low-contrast-dark-theme !default; $list-avatar-size: $avatar-size !default; $list-icon-avatar-text-left-distance: 4.5rem !default; $list-item-font-size: 1rem !default; $list-item-padding: $list-item-font-size !default; $list-item-min-height: 3rem !default; $list-item-with-icon-height: 3.5rem !default; $list-item-two-lines-height: 4.5rem !default; $list-item-three-lines-height: 5.5rem !default; $list-item-hover-color: $base-semi-transparent-color; $list-avatar-padding-top: .5rem !default; $list-index-width: 3.5rem !default; $list-index-font-size: 1.25rem !default; $list-index-color-light-theme: $text-low-contrast-light-theme !default; $list-index-color-dark-theme: $text-low-contrast-dark-theme !default; $list-divider-height: $divider-height !default; $list-item-multi-line-line-height: 1.25rem !default; //List dense $list-dense-vertical-padding: .25rem !default; $list-item-dense-font-size: .8125rem !default; $list-item-dense-padding: $list-item-dense-font-size !default; $list-item-dense-min-height: 2.5rem !default; $list-item-color-light-theme: $text-high-contrast-light-theme; $list-item-color-dark-theme: $white; $list-dense-icon-size: $base-dense-icon-size; $list-index-dense-font-size: 1rem !default; //Progress $progress-height: .3125rem !default; $progress-border-radius: .0625rem !default; $progress-border-width: .0625rem !default; $progress-indeterminate-animation-duration: 2100ms !default; //Spinner $spinner-color: $primary-color; $spinner-height: 3rem !default; $spinner-height-small: $spinner-height * .75 !default; $spinner-height-x-small: $spinner-height * .5 !default; $spinner-height-big: $spinner-height / 3 * 4 !default; //Sidebar $sidebar-width: 20rem !default; $sidebar-background-color-light-theme: #fff !default; $sidebar-background-color-dark-theme: #424242 !default; $sidebar-backdrop-bg: $black !default; $sidebar-backdrop-opacity: .5 !default; //Text fields $text-field-helper-text-font-size: .75rem !default; $text-field-helper-text-margin: .5rem !default; $text-field-helper-text-color-light-theme: $text-low-contrast-light-theme !default; $text-field-helper-text-color-dark-theme: $text-low-contrast-dark-theme !default; $text-field-divider-width: .0625rem !default; $text-field-divider-focus-hover-width: .125rem !default; $text-field-divider-color-light-theme: $color-low-contrast-light-theme !default; $text-field-divider-color-hover-light-theme: $color-high-contrast-light-theme !default; $text-field-divider-color-disabled-light-theme: $text-field-divider-color-light-theme !default; $text-field-divider-color-dark-theme: $color-low-contrast-dark-theme !default; $text-field-divider-color-hover-dark-theme: $color-high-contrast-dark-theme !default; $text-field-divider-color-disabled-dark-theme: $text-field-divider-color-dark-theme !default; $text-field-item-height: 1rem !default; $text-field-item-margin: .5rem !default; $text-field-label-color-light-theme: $text-low-contrast-light-theme !default; $text-field-label-color-dark-theme: $text-low-contrast-dark-theme !default; $text-field-label-font-size: .75rem !default; $text-field-label-font-weight: $font-regular !default; $text-field-elevated-height: 3rem !default; $text-field-label-padding-top: $text-field-item-margin !default; $text-field-box-border-radius: .25rem !default; $text-field-box-padding: 1rem !default; $text-field-box-border-width: .125rem !default; $text-field-box-label-transform: 1.25rem - $text-field-item-margin !default; $text-field-box-label-font-weight: $font-medium !default; $text-field-box-label-line-height: .9375rem !default; $text-area-border-radius: .25rem !default; $text-area-border-width: .0625rem !default; $text-area-dense-border-width: .125rem !default; $text-area-top-base-padding: $text-field-box-label-line-height + $text-field-label-padding-top + $text-field-item-margin !default; $text-area-top-padding: $text-area-top-base-padding - $text-area-border-width !default; $text-area-hover-focus-top-padding: $text-area-top-base-padding - $text-area-dense-border-width !default; $text-area-bottom-base-padding: $text-field-item-margin !default; $text-area-bottom-padding: $text-area-bottom-base-padding - $text-area-border-width !default; $text-area-hover-focus-bottom-padding: $text-area-bottom-base-padding - $text-area-dense-border-width !default; $text-area-horizontal-base-padding: $text-field-box-padding !default; $text-area-horizontal-padding: $text-field-box-padding - $text-area-border-width !default; $text-area-hover-focus-horizontal-padding: $text-field-box-padding - $text-area-dense-border-width !default; $text-input-color-light-theme: $text-high-contrast-light-theme; $text-input-color-dark-theme: $text-high-contrast-dark-theme; $text-input-line-height: 1.15 !default; $text-input-height: $text-field-item-height !default; $text-input-font-size: 1rem !default; $text-input-font-weight: $font-regular !default; $text-input-padding-bottom: $text-field-item-margin - $text-field-divider-width !default; $text-input-dense-padding-bottom: $text-field-item-margin - $text-field-divider-focus-hover-width !default; $text-input-placeholder-color-light-theme: $text-lower-contrast !default; $text-input-placeholder-color-dark-theme: $text-lower-contrast-dark-theme !default; $text-input-disabled-color-light-theme: $text-lower-contrast !default; $text-input-disabled-color-dark-theme: $text-lower-contrast-dark-theme !default; $text-input-icon-color-light-theme: $text-low-contrast-light-theme !default; $text-input-icon-color-dark-theme: $text-low-contrast-dark-theme !default; $text-input-affix-color-light-theme: $text-lower-contrast; $text-input-affix-color-dark-theme: $text-lower-contrast-dark-theme; $text-input-box-bg-light-theme: rgba(0, 0, 0, .06) !default; $text-input-box-bg-dark-theme: rgba(255, 255, 255, .1) !default; $uwp-text-field-border-width: .0625rem !default; $uwp-text-input-horizontal-padding: .75rem !default; $uwp-text-input-vertical-padding: $text-field-item-margin !default; $uwp-text-area-top-padding: $text-area-top-base-padding !default; //Toolbar $toolbar-height: 3.5rem !default; $toolbar-horizontal-padding: $row-horizontal-padding !default; $toolbar-icon-width: 4.5rem - $toolbar-horizontal-padding !default; $toolbar-action-distance: 1.5rem !default; $toolbar-action-padding: $toolbar-action-distance / 2 !default; $toolbar-title-font-size: 1.25rem !default; $toolbar-action-icon-size: $base-icon-size !default; $toolbar-icon-color-light-theme: $text-low-contrast-light-theme !default; $toolbar-icon-color-dark-theme: $white !default; $bg-appbar: $primary-color !default; //Toolbar dense $toolbar-dense-height: 3rem !default; //Tabs $tab-height: 3rem !default; $tab-indicator-height: .125rem !default; $tab-font-size: $font-size-base !default; $tab-font-weight: $font-medium !default; $tab-horizontal-padding-sm: .75rem !default; $tab-horizontal-padding-lg: 1.5rem !default; $tab-text-color-light-theme: $text-low-contrast-light-theme !default; $tab-text-color-dark-theme: $text-low-contrast-dark-theme !default; $tab-text-color-active-dark-theme: $body-color-dark-theme !default; //Steppers $stepper-padding: 1.5rem !default; $step-number-font-size: .75rem !default; $step-circle-size: $base-icon-size !default; $step-circle-default-background: rgba(0, 0, 0, 0.38) !default; $step-circle-default-text-color: #fff !default; $step-circle-active-background: $primary-color !default; $step-circle-active-text-color: get-text-color-by-background-color($step-circle-active-background, $text-low-contrast-light-theme) !default; $step-label-margin: 1rem !default; $step-label-disabled-color: $text-low-contrast-light-theme !default; $step-line-margin: .5rem !default; $step-content-margin: .75rem !default; $step-actions-height: 3rem !default; $step-actions-buttons-margin: .5rem !default; $step-actions-margin: 1rem !default; $active-step-weight: $font-medium !default; $vertical-step-space: 3rem !default; //Snackbar $snackbar-height: 3rem !default; $snackbar-horizontal-padding: 1.5rem !default; $snackbar-background-color-light-theme: #323232 !default; $snackbar-background-color-dark-theme: #fafafa !default; $snackbar-text-vertical-margin: .75rem !default; $snackbar-text-color-light-theme: #fff !default; $snackbar-text-color-dark-theme: $body-color-light-theme !default; $snackbar-font-size: $font-size-base !default; $snackbar-font-weight: $font-medium !default; $snackbar-tablet-min-width: 18rem !default; $snackbar-tablet-max-width: 35.5rem !default; $snackbar-button-horizontal-padding: 1.5rem !default; $snackbar-button-tablet-left-margin: $snackbar-horizontal-padding !default; $snackbar-tablet-border-radius: .125rem !default; $uwp-snackbar-button-right-margin: .5rem; $uwp-snackbar-border-width: $uwp-border-width; $uwp-snackbar-border-color-light-theme: rgba(204,204,204,.54) !default; $uwp-snackbar-border-color-dark-theme: $color-low-contrast-light-theme !default; $text-muted: $text-low-contrast-light-theme !default; //Shadows $shadows: ( "2dp": (0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 1px 5px 0 rgba(0, 0, 0, 0.12), 0 3px 1px -2px rgba(0, 0, 0, 0.2)), "3dp": (0 3px 4px 0 rgba(0, 0, 0, 0.14), 0 1px 8px 0 rgba(0, 0, 0, 0.12), 0 3px 3px -2px rgba(0, 0, 0, 0.4)), "4dp": (0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12), 0 2px 4px -1px rgba(0, 0, 0, 0.4)), "6dp": (0 6px 10px 0 rgba(0, 0, 0, 0.14), 0 1px 18px 0 rgba(0, 0, 0, 0.12), 0 3px 5px -1px rgba(0, 0, 0, 0.4)), "8dp": (0 8px 10px 1px rgba(0, 0, 0, 0.14), 0 3px 14px 2px rgba(0, 0, 0, 0.12), 0 5px 5px -3px rgba(0, 0, 0, 0.4)), "12dp": (0 12px 16px 1px rgba(0, 0, 0, 0.14), 0 4px 22px 3px rgba(0, 0, 0, 0.12), 0 6px 7px -4px rgba(0, 0, 0, 0.4)), "16dp": (0 16px 24px 2px rgba(0, 0, 0, 0.14), 0 6px 30px 5px rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(0, 0, 0, 0.4)) ); //Z-index $zindex-dropdown: 1000 !default; $zindex-fixed: 1030 !default; $zindex-sticky: 1030 !default; $zindex-toolbar-fixed: 1030 !default; $zindex-sidebar: 1040 !default; $zindex-dialog-background: 1050 !default; $zindex-dialog: 1060 !default; $zindex-snackbar: 1070 !default;