blob: 8816ead93b830ef03e0bbd4552b615b5e9de9cce [file] [log] [blame]
{"version":3,"sources":["common/styles/core/_button.scss","common/styles/_layout.scss","common/material-icons.css","common/styles/font/_font.scss"],"names":[],"mappings":"AAwBA,iGAAiG;ACxBjG;;;;;;;;;;;EAWE;AAaF;ECVE;IDYE,UAAS;IACT,YAAW;IACX,iBAAgB;IAChB,aAAY,EACb,EAAA;;AE3BD;EACE,8BAA6B;EAC7B,mBAAkB;EAClB,iBAAgB;EAChB,kDAAqD;EAAE,eAAe;EACtE,oRAIqE,EAAA;;AAEvE;EACE,8BAA6B;EAC7B,oBAAmB;EACnB,mBAAkB;EAClB,gBAAe;EAAG,yBAAyB;EAC3C,sBAAqB;EACrB,WAAU;EACV,YAAW;EACX,eAAc;EACd,qBAAoB;EACpB,uBAAsB;EACtB,kBAAiB;EACjB,oBAAmB;EACnB,eAAc;EAEd,sCAAsC;EACtC,oCAAmC;EACnC,oCAAoC;EACpC,mCAAkC;EAElC,0BAA0B;EAC1B,mCAAkC;EAElC,qBAAqB;EACrB,sCAA6B;UAA7B,8BAA6B,EAC9B;;AAGD;EAEI,WAAU;EACV,YAAW,EACZ;;AAIH;EACE,gBAAe;EACf,aAAW;EACX,YAAW,EACZ;;AACD;EACE,gBAAe;EACf,aAAW;EACX,YAAW,EACZ;;AACD;EACE,gBAAe;EACf,aAAW;EACX,YAAW,EACZ;;AACD;EACE,gBAAe;EACf,aAAW;EACX,YAAW,EACZ;;AAGD;EAAoD,2BAA0B,EAAI;;AAClF;EAA6E,2BAA0B,EAAI;;AAG3G;EAAsD,aAA6B,EAAI;;AACvF;EAA+E,gCAA+B,EAAI","file":"common/material-icons.css","sourcesContent":["@import '../theme-functions';\n@import '../rtl';\n\n// Standard button sizing.\n$mat-button-padding: 0 rem(0.6) !default;\n$mat-button-min-width: rem(8.8) !default;\n$mat-button-margin: rem(0.6) rem(0.8) !default;\n$mat-button-line-height: rem(3.6) !default;\n$mat-button-border-radius: 3px !default;\n\n// FAB sizing.\n$mat-fab-border-radius: 50%;\n$mat-fab-size: rem(5.6) !default;\n$mat-fab-line-height: rem(5.6) !default;\n$mat-fab-padding: rem(1.6) !default;\n$mat-fab-mini-size: rem(4) !default;\n$mat-fab-mini-line-height: rem(4) !default;\n\n// Icon button sizing.\n$mat-icon-button-height: rem(4) !default;\n$mat-icon-button-width: rem(4) !default;\n$mat-icon-button-margin: rem(0.6) !default;\n$mat-icon-border-radius: $mat-fab-border-radius;\n\n/** Mixin to create distinct classes for fab positions, e.g. \".mat-fab-position-bottom-right\". */\n@mixin mat-fab-position($spot, $top: auto, $right: auto, $bottom: auto, $left: auto) {\n [mat-fab].mat-fab-position-#{$spot},\n .mat-fab.mat-fab-position-#{$spot},\n [mat-fab].mat-fab-#{$spot},\n .mat-fab.mat-fab-#{$spot} {\n top: $top;\n @include rtl(right, $right,$left);\n @include rtl(left, $left,$right);\n bottom: $bottom;\n position: absolute;\n &.fixed {\n position: fixed;\n }\n }\n}\n\n@mixin td-button-utilities() {\n $mat-fab-pos-offset: ($mat-fab-size - $mat-fab-padding) / 2;\n @include mat-fab-position(bottom-right, auto, $mat-fab-pos-offset, $mat-fab-pos-offset, auto);\n @include mat-fab-position(bottom-left, auto, auto, $mat-fab-pos-offset, $mat-fab-pos-offset);\n @include mat-fab-position(top-right, $mat-fab-pos-offset, $mat-fab-pos-offset, auto, auto);\n @include mat-fab-position(top-left, $mat-fab-pos-offset, auto, auto, $mat-fab-pos-offset);\n\n button {\n &[mat-icon-button] {\n &.mat-icon-button-mini {\n height: 24px;\n line-height: 24px;\n width: 24px;\n }\n }\n }\n}\n","/*\n*\n* Responsive attributes\n*\n* References:\n* 1) https://scotch.io/tutorials/a-visual-guide-to-css3-flexbox-properties#flex\n* 2) https://css-tricks.com/almanac/properties/f/flex/\n* 3) https://css-tricks.com/snippets/css/a-guide-to-flexbox/\n* 4) https://github.com/philipwalton/flexbugs#3-min-height-on-a-flex-container-wont-apply-to-its-flex-items\n* 5) http://godban.com.ua/projects/flexgrid\n*\n*/\n\n// Layout\n// ------------------------------\n\n$baseline-grid: 8px !default;\n$layout-gutter-width: ($baseline-grid * 2) !default;\n\n$layout-breakpoint-xs: 600px !default;\n$layout-breakpoint-sm: 960px !default;\n$layout-breakpoint-md: 1280px !default;\n$layout-breakpoint-lg: 1920px !default;\n\n@-moz-document url-prefix() {\n [layout-fill] {\n margin: 0;\n width: 100%;\n min-height: 100%;\n height: 100%;\n }\n}\n\n@mixin flex-order-for-name($sizes:null) {\n @if $sizes == null {\n $sizes: '';\n\n [flex-order] {\n order: 0;\n }\n }\n\n @for $i from -20 through 20 {\n $order: '';\n $suffix: '';\n\n @each $s in $sizes {\n @if $s != '' {\n $suffix: '-#{$s}=\"#{$i}\"';\n } @else {\n $suffix: '=\"#{$i}\"';\n }\n\n $order: '[flex-order#{$suffix}]';\n }\n\n #{$order} {\n order: #{$i};\n }\n }\n}\n\n@mixin offset-for-name($sizes:null) {\n @if $sizes == null {\n $sizes: '';\n }\n\n @for $i from 0 through 19 {\n $offsets: '';\n $suffix: '';\n\n @each $s in $sizes {\n @if $s != '' {\n $suffix: '-#{$s}=\"#{$i * 5}\"';\n } @else {\n $suffix: '=\"#{$i * 5}\"';\n }\n\n $offsets: $offsets + '[flex-offset#{$suffix}], ';\n }\n\n #{$offsets} {\n margin-left: #{$i * 5 + '%'};\n }\n }\n\n @each $i in 33 {\n $offsets: '';\n $suffix: '';\n\n @each $s in $sizes {\n @if $s != '' {\n $suffix: '-#{$s}=\"#{$i}\"';\n } @else {\n $suffix: '=\"#{$i}\"';\n }\n\n $offsets: '[flex-offset#{$suffix}], ';\n }\n\n #{$offsets} {\n margin-left: calc(100% / 3);\n }\n }\n\n @each $i in 66 {\n $offsets: '';\n $suffix: '';\n\n @each $s in $sizes {\n @if $s != '' {\n $suffix: '-#{$s}=\"#{$i}\"';\n } @else {\n $suffix: '=\"#{$i}\"';\n }\n\n $offsets: '[flex-offset#{$suffix}]';\n }\n\n #{$offsets} {\n margin-left: calc(200% / 3);\n }\n }\n}\n\n@mixin layout-for-name($name: null) {\n @if $name == null {\n $name: '';\n }\n @if $name != '' {\n $name: '-#{$name}';\n }\n\n [layout#{$name}], [layout#{$name}=\"column\"], [layout#{$name}=\"row\"] {\n box-sizing: border-box;\n display: -webkit-box;\n display: -webkit-flex;\n display: -moz-box;\n display: -ms-flexbox;\n display: flex;\n }\n [layout#{$name}=\"column\"] {\n flex-direction: column;\n }\n [layout#{$name}=\"row\"] {\n flex-direction: row;\n }\n}\n\n@mixin flex-properties-for-name($name: null) {\n $flexName: 'flex';\n @if $name != null {\n $flexName: 'flex-#{$name}';\n $name: '-#{$name}';\n } @else {\n $name: '';\n }\n\n [#{$flexName}] {\n flex: 1;\n box-sizing: border-box;\n }\n // === flex: 1 1 0%;\n\n // IE mediaQuery hack for 8,9,10 to set the flex-basis properly for 'flex' values\n // Details:\n // Do not use unitless flex-basis values in the flex shorthand because IE 10-11 will error.\n // Also use 0% instead of 0px since minifiers will often convert 0px to 0 (which is unitless and will have the same problem).\n // Safari, however, fails with flex-basis : 0% and requires flex-basis : 0px\n @media screen\\0\n {\n [#{$flexName}] {\n flex: 1 1 0%;\n }\n }\n\n [#{$flexName}=\"grow\"],\n [#{$flexName}-grow] {\n flex: 1 1 100%;\n box-sizing: border-box;\n }\n [#{$flexName}=\"initial\"],\n [#{$flexName}-initial] {\n flex: 0 1 auto;\n box-sizing: border-box;\n }\n [#{$flexName}=\"auto\"],\n [#{$flexName}-auto] {\n flex: 1 1 auto;\n box-sizing: border-box;\n }\n [#{$flexName}=\"none\"],\n [#{$flexName}-none] {\n flex: 0 0 auto;\n box-sizing: border-box;\n }\n [#{$flexName}=\"noshrink\"],\n [#{$flexName}-noshrink] {\n flex: 1 0 auto;\n box-sizing: border-box;\n }\n [#{$flexName}=\"nogrow\"],\n [#{$flexName}-nogrow] {\n flex: 0 1 auto;\n box-sizing: border-box;\n }\n\n // (1-20) * 5 = 0-100%\n @for $i from 0 through 20 {\n $value: #{$i * 5 + '%'};\n\n [#{$flexName}=\"#{$i * 5}\"] {\n flex: 1 1 #{$value};\n max-width: #{$value};\n max-height: 100%;\n box-sizing: border-box;\n }\n\n [layout=\"row\"] > [#{$flexName}=\"#{$i * 5}\"],\n [layout#{$name}=\"row\"] > [#{$flexName}=\"#{$i * 5}\"] {\n flex: 1 1 #{$value};\n max-width: #{$value};\n max-height: 100%;\n box-sizing: border-box;\n }\n\n [layout=\"column\"] > [#{$flexName}=\"#{$i * 5}\"],\n [layout#{$name}=\"column\"] > [#{$flexName}=\"#{$i * 5}\"] {\n flex: 1 1 #{$value};\n max-width: 100%;\n max-height: #{$value};\n box-sizing: border-box;\n }\n }\n\n [layout=\"row\"], [layout#{$name}=\"row\"] {\n > [#{$flexName}=\"33\"], > [#{$flexName}=\"33\"] {\n flex: 1 1 33%;\n max-width: calc(100% / 3);\n max-height: 100%;\n box-sizing: border-box;\n }\n > [#{$flexName}=\"34\"], > [#{$flexName}=\"34\"] {\n flex: 1 1 34%;\n max-width: 34%;\n max-height: 100%;\n box-sizing: border-box;\n }\n > [#{$flexName}=\"66\"], > [#{$flexName}=\"66\"] {\n flex: 1 1 66%;\n max-width: calc(200% / 3);\n max-height: 100%;\n box-sizing: border-box;\n }\n > [#{$flexName}=\"67\"], > [#{$flexName}=\"67\"] {\n flex: 1 1 67%;\n max-width: 67%;\n max-height: 100%;\n box-sizing: border-box;\n }\n }\n [layout=\"column\"], [layout#{$name}=\"column\"] {\n > [#{$flexName}=\"33\"], > [#{$flexName}=\"33\"] {\n flex: 1 1 33%;\n max-width: 100%;\n max-height: calc(100% / 3);\n box-sizing: border-box;\n }\n > [#{$flexName}=\"34\"], > [#{$flexName}=\"34\"] {\n flex: 1 1 34%;\n max-width: 100%;\n max-height: 34%;\n box-sizing: border-box;\n }\n > [#{$flexName}=\"66\"], > [#{$flexName}=\"66\"] {\n flex: 1 1 66%;\n max-width: 100%;\n max-height: calc(200% / 3);\n box-sizing: border-box;\n }\n > [#{$flexName}=\"67\"], > [#{$flexName}=\"67\"] {\n flex: 1 1 67%;\n max-width: 100%;\n max-height: 67%;\n box-sizing: border-box;\n }\n }\n\n}\n\n@mixin layout-align-for-name($suffix: null) {\n\n // Alignment attributes for layout containers' children\n // Arrange on the Main Axis\n // center, start, end, space-between, space-around\n // flex-start is the default for justify-content\n // ------------------------------\n\n $name: 'layout-align';\n @if $suffix != null {\n $name: 'layout-align-#{$suffix}';\n }\n\n [#{$name}],\n [#{$name}=\"start stretch\"] // defaults\n {\n justify-content: flex-start;\n align-content: stretch;\n align-items: stretch;\n }\n // Main Axis Center\n [#{$name}=\"start\"],\n [#{$name}=\"start start\"],\n [#{$name}=\"start center\"],\n [#{$name}=\"start end\"],\n [#{$name}=\"start stretch\"] {\n justify-content: flex-start;\n }\n\n // Main Axis Center\n [#{$name}=\"center\"],\n [#{$name}=\"center start\"],\n [#{$name}=\"center center\"],\n [#{$name}=\"center end\"],\n [#{$name}=\"center stretch\"] {\n justify-content: center;\n }\n\n // Main Axis End\n [#{$name}=\"end\"], //stretch\n [#{$name}=\"end center\"],\n [#{$name}=\"end start\"],\n [#{$name}=\"end end\"],\n [#{$name}=\"end stretch\"] {\n justify-content: flex-end;\n }\n\n // Main Axis Space Around\n [#{$name}=\"space-around\"], //stretch\n [#{$name}=\"space-around center\"],\n [#{$name}=\"space-around start\"],\n [#{$name}=\"space-around end\"],\n [#{$name}=\"space-around stretch\"] {\n justify-content: space-around;\n }\n\n // Main Axis Space Between\n [#{$name}=\"space-between\"], //stretch\n [#{$name}=\"space-between center\"],\n [#{$name}=\"space-between start\"],\n [#{$name}=\"space-between end\"],\n [#{$name}=\"space-between stretch\"] {\n justify-content: space-between;\n }\n\n // Arrange on the Cross Axis\n // center, start, end\n // stretch is the default for align-items\n // ------------------------------\n\n // Cross Axis Start\n [#{$name}=\"start start\"],\n [#{$name}=\"center start\"],\n [#{$name}=\"end start\"],\n [#{$name}=\"space-between start\"],\n [#{$name}=\"space-around start\"] {\n align-items: flex-start;\n align-content: flex-start;\n }\n\n // Cross Axis Center\n [#{$name}=\"start center\"],\n [#{$name}=\"center center\"],\n [#{$name}=\"end center\"],\n [#{$name}=\"space-between center\"],\n [#{$name}=\"space-around center\"] {\n align-items: center;\n align-content: center;\n max-width: 100%;\n\n // IE11 overflow https://github.com/philipwalton/flexbugs#2-column-flex-items-set-to-align-itemscenter-overflow-their-container\n & > * {\n max-width: 100%;\n box-sizing: border-box;\n }\n }\n\n // Cross Axis Center IE overflow fix\n [#{$name}=\"start center\"] > *,\n [#{$name}=\"center center\"] > *,\n [#{$name}=\"end center\"] > *,\n [#{$name}=\"space-between center\"] > *,\n [#{$name}=\"space-around center\"] > * {\n max-width: 100%;\n box-sizing: border-box;\n }\n\n // Cross Axis End\n [#{$name}=\"start end\"],\n [#{$name}=\"center end\"],\n [#{$name}=\"end end\"],\n [#{$name}=\"space-between end\"],\n [#{$name}=\"space-around end\"] {\n align-items: flex-end;\n align-content: flex-end;\n }\n\n // Cross Axis stretch\n [#{$name}=\"start stretch\"],\n [#{$name}=\"center stretch\"],\n [#{$name}=\"end stretch\"],\n [#{$name}=\"space-between stretch\"],\n [#{$name}=\"space-around stretch\"] {\n align-items: stretch;\n align-content: stretch;\n }\n}\n\n@mixin layout-padding-margin() {\n\n [layout-padding] > [flex-sm], [layout-padding] > [flex-lt-md] {\n padding: $layout-gutter-width / 4;\n }\n [layout-padding],\n [layout-padding] > [flex],\n [layout-padding] > [flex-gt-sm],\n [layout-padding] > [flex-md],\n [layout-padding] > [flex-lt-lg] {\n padding: $layout-gutter-width / 2;\n }\n [layout-padding] > [flex-gt-md],\n [layout-padding] > [flex-lg] {\n padding: $layout-gutter-width / 1;\n }\n\n [layout-margin] > [flex-sm],\n [layout-margin] > [flex-lt-md] {\n margin: $layout-gutter-width / 4;\n }\n\n [layout-margin],\n [layout-margin] > [flex],\n [layout-margin] > [flex-gt-sm],\n [layout-margin] > [flex-md],\n [layout-margin] > [flex-lt-lg] {\n margin: $layout-gutter-width / 2;\n }\n\n [layout-margin] > [flex-gt-md],\n [layout-margin] > [flex-lg] {\n margin: $layout-gutter-width / 1;\n }\n\n [layout-wrap] {\n flex-wrap: wrap;\n }\n\n [layout-nowrap] {\n flex-wrap: nowrap;\n }\n\n [layout-fill] {\n margin: 0;\n width: 100%;\n min-height: 100%;\n height: 100%;\n }\n}\n\n@mixin layouts_for_breakpoint($name:null) {\n @include flex-order-for-name($name);\n @include offset-for-name($name);\n @include layout-align-for-name($name);\n\n @include flex-properties-for-name($name);\n @include layout-for-name($name);\n}\n\n@mixin covalent-layout() {\n /*\n * Apply Mixins to create Layout/Flexbox styles\n *\n */\n\n @include layouts_for_breakpoint();\n @include layout-padding-margin();\n\n /**\n * `hide-gt-sm show-gt-lg` should hide from 600px to 1200px\n * `show-md hide-gt-sm` should show from 0px to 960px and hide at >960px\n * `hide-gt-md show-gt-sm` should show everywhere (show overrides hide)`\n *\n * hide means hide everywhere\n * Sizes:\n * $layout-breakpoint-xs: 600px !default;\n * $layout-breakpoint-sm: 960px !default;\n * $layout-breakpoint-md: 1280px !default;\n * $layout-breakpoint-lg: 1920px !default;\n */\n\n @media (max-width: $layout-breakpoint-xs - 1) {\n // Xtra-SMALL SCREEN\n [hide-xs], [hide] {\n &:not([show-xs]):not([show]) {\n display: none;\n }\n }\n @include layouts_for_breakpoint(xs);\n }\n\n @media (min-width: $layout-breakpoint-xs) {\n // BIGGER THAN Xtra-SMALL SCREEN\n @include layouts_for_breakpoint(gt-xs);\n\n }\n\n @media (min-width: $layout-breakpoint-xs) and (max-width: $layout-breakpoint-sm - 1) {\n // SMALL SCREEN\n [hide-sm], [hide-gt-xs] {\n &:not([show-gt-xs]):not([show-sm]):not([show]) {\n display: none;\n }\n }\n [hide-sm]:not([show-sm]):not([show]) {\n display: none;\n }\n @include layouts_for_breakpoint(sm);\n }\n\n @media (min-width: $layout-breakpoint-sm) {\n // BIGGER THAN SMALL SCREEN\n @include layouts_for_breakpoint(gt-sm);\n\n }\n\n @media (min-width: $layout-breakpoint-sm) and (max-width: $layout-breakpoint-md - 1) {\n // MEDIUM SCREEN\n [hide], [hide-gt-xs], [hide-gt-sm] {\n &:not([show-gt-xs]):not([show-gt-sm]):not([show-md]):not([show]) {\n display: none;\n }\n }\n [hide-md]:not([show-md]):not([show]) {\n display: none;\n }\n @include layouts_for_breakpoint(md);\n }\n\n @media (min-width: $layout-breakpoint-md) {\n // BIGGER THAN MEDIUM SCREEN\n @include layouts_for_breakpoint(gt-md);\n }\n\n @media (min-width: $layout-breakpoint-md) and (max-width: $layout-breakpoint-lg - 1) {\n // LARGE SCREEN\n [hide], [hide-gt-xs], [hide-gt-sm], [hide-gt-md] {\n &:not([show-gt-xs]):not([show-gt-sm]):not([show-gt-md]):not([show-lg]):not([show]) {\n display: none;\n }\n }\n [hide-lg]:not([show-lg]):not([show]) {\n display: none;\n }\n\n @include layouts_for_breakpoint(lg);\n }\n\n @media (min-width: $layout-breakpoint-lg) {\n // BIGGER THAN LARGE SCREEN\n @include layouts_for_breakpoint(gt-lg);\n @include layouts_for_breakpoint(xl);\n\n // BIGGER THAN LARGE SCREEN\n [hide], [hide-gt-xs], [hide-gt-sm], [hide-gt-md], [hide-gt-lg] {\n &:not([show-gt-xs]):not([show-gt-sm]):not([show-gt-md]):not([show-gt-lg]):not([show-xl]):not([show]) {\n display: none;\n }\n }\n [hide-xl]:not([show-xl]):not([show-gt-lg]):not([show]) {\n display: none;\n }\n }\n}","/** Mixin to create distinct classes for fab positions, e.g. \".mat-fab-position-bottom-right\". */\n/*\n*\n* Responsive attributes\n*\n* References:\n* 1) https://scotch.io/tutorials/a-visual-guide-to-css3-flexbox-properties#flex\n* 2) https://css-tricks.com/almanac/properties/f/flex/\n* 3) https://css-tricks.com/snippets/css/a-guide-to-flexbox/\n* 4) https://github.com/philipwalton/flexbugs#3-min-height-on-a-flex-container-wont-apply-to-its-flex-items\n* 5) http://godban.com.ua/projects/flexgrid\n*\n*/\n@-moz-document url-prefix() {\n [layout-fill] {\n margin: 0;\n width: 100%;\n min-height: 100%;\n height: 100%; } }\n\n@font-face {\n font-family: 'Material Icons';\n font-style: normal;\n font-weight: 400;\n src: url(\"styles/font/MaterialIcons-Regular.eot\");\n /* For IE6-8 */\n src: local(\"styles/font/Material Icons\"), local(\"styles/font/MaterialIcons-Regular\"), url(\"styles/font/MaterialIcons-Regular.woff2\") format(\"woff2\"), url(\"styles/font/MaterialIcons-Regular.woff\") format(\"woff\"), url(\"styles/font/MaterialIcons-Regular.ttf\") format(\"truetype\"); }\n\n.material-icons {\n font-family: 'Material Icons';\n font-weight: normal;\n font-style: normal;\n font-size: 24px;\n /* Preferred icon size */\n display: inline-block;\n width: 1em;\n height: 1em;\n line-height: 1;\n text-transform: none;\n letter-spacing: normal;\n word-wrap: normal;\n white-space: nowrap;\n direction: ltr;\n /* Support for all WebKit browsers. */\n -webkit-font-smoothing: antialiased;\n /* Support for Safari and Chrome. */\n text-rendering: optimizeLegibility;\n /* Support for Firefox. */\n -moz-osx-font-smoothing: grayscale;\n /* Support for IE. */\n font-feature-settings: 'liga'; }\n\nmat-icon.material-icons, mat-icon.material-icons.mat-icon {\n width: 1em;\n height: 1em; }\n\n.material-icons.md-18, .material-icons.mat-18 {\n font-size: 18px;\n height: 18px;\n width: 18px; }\n\n.material-icons.md-24, .material-icons.mat-24 {\n font-size: 24px;\n height: 24px;\n width: 24px; }\n\n.material-icons.md-36, .material-icons.mat-36 {\n font-size: 36px;\n height: 36px;\n width: 36px; }\n\n.material-icons.md-48, .material-icons.mat-48 {\n font-size: 48px;\n height: 48px;\n width: 48px; }\n\n.material-icons.md-dark, .material-icons.mat-dark {\n color: rgba(0, 0, 0, 0.54); }\n\n.material-icons.md-dark.md-inactive, .material-icons.mat-dark.mat-inactive {\n color: rgba(0, 0, 0, 0.26); }\n\n.material-icons.md-light, .material-icons.mat-light {\n color: white; }\n\n.material-icons.md-light.md-inactive, .material-icons.mat-light.mat-inactive {\n color: rgba(255, 255, 255, 0.3); }\n","$mat-font-url: 'styles/font/' !default;\n\n@mixin covalent-material-icons() {\n @font-face {\n font-family: 'Material Icons';\n font-style: normal;\n font-weight: 400;\n src: url($mat-font-url + 'MaterialIcons-Regular.eot'); /* For IE6-8 */\n src: local($mat-font-url + 'Material Icons'),\n local($mat-font-url + 'MaterialIcons-Regular'),\n url($mat-font-url + 'MaterialIcons-Regular.woff2') format('woff2'),\n url($mat-font-url + 'MaterialIcons-Regular.woff') format('woff'),\n url($mat-font-url + 'MaterialIcons-Regular.ttf') format('truetype');\n }\n .material-icons {\n font-family: 'Material Icons';\n font-weight: normal;\n font-style: normal;\n font-size: 24px; /* Preferred icon size */\n display: inline-block;\n width: 1em;\n height: 1em;\n line-height: 1;\n text-transform: none;\n letter-spacing: normal;\n word-wrap: normal;\n white-space: nowrap;\n direction: ltr;\n\n /* Support for all WebKit browsers. */\n -webkit-font-smoothing: antialiased;\n /* Support for Safari and Chrome. */\n text-rendering: optimizeLegibility;\n\n /* Support for Firefox. */\n -moz-osx-font-smoothing: grayscale;\n\n /* Support for IE. */\n font-feature-settings: 'liga';\n }\n\n // Ensure our size prevails over material\n mat-icon.material-icons {\n &,&.mat-icon {\n width: 1em;\n height: 1em;\n }\n }\n\n // Rules for sizing the icon.\n .material-icons.md-18, .material-icons.mat-18 {\n font-size: 18px;\n height:18px;\n width: 18px;\n }\n .material-icons.md-24, .material-icons.mat-24 {\n font-size: 24px;\n height:24px;\n width: 24px;\n }\n .material-icons.md-36, .material-icons.mat-36 {\n font-size: 36px;\n height:36px;\n width: 36px;\n }\n .material-icons.md-48, .material-icons.mat-48 {\n font-size: 48px;\n height:48px;\n width: 48px;\n }\n\n // Rules for using icons as black on a light background.\n .material-icons.md-dark, .material-icons.mat-dark { color: rgba(0, 0, 0, 0.54); }\n .material-icons.md-dark.md-inactive, .material-icons.mat-dark.mat-inactive { color: rgba(0, 0, 0, 0.26); }\n\n // Rules for using icons as white on a dark background.\n .material-icons.md-light, .material-icons.mat-light { color: rgba(255, 255, 255, 1); }\n .material-icons.md-light.md-inactive, .material-icons.mat-light.mat-inactive { color: rgba(255, 255, 255, 0.3); }\n}\n"],"sourceRoot":"/source/"}