diff --git a/node_modules/mdl-ext/lib/mdl-ext-eqjs.min.css.map b/node_modules/mdl-ext/lib/mdl-ext-eqjs.min.css.map
new file mode 100644
index 0000000..ecfade4
--- /dev/null
+++ b/node_modules/mdl-ext/lib/mdl-ext-eqjs.min.css.map
@@ -0,0 +1 @@
+{"version":3,"sources":["webpack:///webpack:///src/aria-expanded-toggle/_aria-expanded-toggle.scss","webpack:///webpack:///src/_mixins.scss","webpack:///webpack:///src/mdl-ext-eqjs-build.scss","webpack:///webpack:///src/sticky-header/_sticky-header.scss","webpack:///webpack:///src/dialog/dialog.scss","webpack:///webpack:///src/grid/_grid-eqjs.scss","webpack:///webpack:///~/eq.js/sass/_eq.scss","webpack:///webpack:///src/lightboard/_lightboard.scss","webpack:///webpack:///~/material-design-lite/src/_mixins.scss","webpack:///webpack:///src/lightboard/_lightboard-eqjs.scss","webpack:///webpack:///src/lightbox/_lightbox.scss","webpack:///webpack:///src/carousel/_carousel.scss","webpack:///webpack:///src/selectfield/_selectfield.scss","webpack:///webpack:///src/menu-button/_menu-button.scss","webpack:///webpack:///src/bordered-fields/_bordered-fields.scss","webpack:///webpack:///src/collapsible/_collapsible.scss","webpack:///webpack:///src/accordion/_accordion.scss","webpack:///webpack:///src/color-themes/_light-color-theme.scss","webpack:///webpack:///src/color-themes/_dark-color-theme.scss"],"names":[],"mappings":"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HgBJ,YACE,aACA,0CIjGN,iBACE,qFACA,eACA,kBACA,WACA,eACA,cACA,SACA,gBACA,sBAEA,UACA,cAZF,yHAUE,sBAVF,0CAwBI,kBACA,MACA,OACA,iCACA,4CA5BJ,0EA+BM,kCACA,cACA,gBACA,cACA,sBACA,wBACA,4BAMD,wBAID,SACA,UACA,kBAjDJ,4BAoDM,WACA,eACA,YACA,SACA,UACD,mCF5DD,8CAgIF,eACA,gBACA,cACA,iBEnEI,cACA,kBACA,SACA,OACA,QACA,eACA,YACA,eACA,cACA,YACA,qCACA,wBACA,oBACA,2BA1EN,oEA6EQ,oBA7ER,4CAiFU,gBAjFV,wFAqFU,wBACD,iCAKL,WACA,UA5FJ,wBA+FI,iCACA,oDACA,yCACA,qCAEA,mDACE,kBACA,gBACA,UACA,YACA,WAEF,4BACE,iCA5GN,uDAiHI,eACA,SACA,OChHJ,mBACE,gBAGF,iBAIE,gBAEA,WACA,cACA,mBACA,YACA,6BAGF,yCAZE,sBACA,SACA,UAEA,YAQF,wBAEE,qBACA,kBACA,UAIA,iCAuFD,yGA9EK,qBACA,qCAIJ,+FAEE,WACA,WACA,cACA,YACA,SACA,OACA,kBACA,mBACA,4EACA,yCAIF,0BACE,qBAGF,+BACE,sBACA,kBACA,YACA,SACA,UAEA,mCACE,sBACA,gBACD,0CAGC,oEHmDJ,eACA,gBACA,cACA,iBGnDI,cACA,kBACA,SACA,OACA,mBACA,gBACA,eACA,WACA,kBACA,uBACA,cAGA,gDAIE,qBACA,qCA3ER,kEAiFI,qBACA,cACA,gBACA,kBACA,MACA,OACA,QACA,SACA,UAzFJ,8EA4FM,mBACD,oBCtGH,sBACA,kBACA,eACA,qBACA,YACA,eACA,SACA,eAGE,gCACA,YACA,kBAbJ,0BXnBE,8BACA,sBACA,uBACA,yBAKE,oCACA,qCW8BA,kBACA,WACA,QACA,2BACA,oBAIJ,gEXpDE,WACA,QACA,SACA,kBACA,oBWgDF,sCAEI,4DXhDF,sBACA,uBACA,iCAKE,oCACA,qCW8CJ,iCACE,iBAIF,gCACE,WACD,gCAIC,gBACA,eACA,WACD,4BAMC,sBACA,SACA,gBACA,wBACA,qBACA,oBACA,gBACA,kBACA,iBACA,aACA,gBAGA,eACA,uCACA,oCACA,WACA,wCACA,cACA,SACA,gBACA,gBACA,cAuCD,2CAnCG,kBACA,uBACD,6CAIC,yBACA,cApCJ,wCAwCI,aAG6B,2DAC7B,aACD,2DAGC,qBACA,gBAGqC,+HAErC,yCACA,sBACA,6BAGF,mCACE,sBACA,sBACA,yBAKJ,2BACE,sBACA,sBACA,eACA,SACA,SACA,OACA,QACA,oBACA,kBACA,cACA,WACA,gBACA,mBACA,gBAEA,uHAEE,kBAIF,+DJ+GA,wBACA,mDI5GoD,+EAClD,gBACD,yIAIC,sBAG6C,0OAG7C,cACA,eACA,QACA,mBAGF,sVAGE,UACD,0EAGC,cACA,eAIF,iCACE,yBACA,YACA,WACA,WACA,SACA,0CJwEF,mDIrEE,kBACA,WAGF,gEACE,OACA,mBACA,WACD,gEAGC,yBAKJ,2BACE,cACA,eACA,kBACA,eACA,kBACA,cAKD,0DAFG,mBACD,uCAKD,qBACA,kBACA,yCJoCA,mDI5BA,eAEA,0IAME,gBAEF,wEACE,SC7OJ,oBACE,oELuJA,eACA,gBACA,cACA,iBKxJA,oBACA,kBACA,YACA,eACA,iCACA,yCACA,+CATF,sBAYI,SACA,kBACD,iCAGC,eAGA,kFACA,iBACD,6BAKD,mBACA,gBACA,uBACA,gBAGF,gCAEE,sBACA,SACA,UACA,gBACA,iCACD,aAGC,kBACA,gBACA,aACA,gBACA,mHAEA,+CACA,gDACA,UACA,gBACA,gBAXF,mBAcI,oBACA,kBAGF,qBZ1DA,SACA,mBACA,WACA,YACA,gBACA,UACA,kBACA,UYqDE,oBACD,mBLwCD,eACA,gBACA,iBACA,iBKvCE,sBACA,sBACA,kBACA,sBACA,yCACA,0EACA,qBACA,eACA,mBACA,qFACA,gBACA,gBAbF,uCAgBI,yBAIF,8CACE,gBACA,kBACA,gBACA,SACA,QACA,2BACA,oBAGF,yCACE,sBA/BJ,yBAmCI,oBACA,kBACA,sBACA,sBACD,qCAGC,SACD,6BAGC,cACA,6BACA,YACA,oBAjDJ,+BAoDM,cAIJ,4BACE,mBACA,gBACA,uBA3DJ,qBA+DI,SACA,kBAGA,gCACA,eApEJ,iFAwEI,iBAIJ,6BACE,SACA,UACA,wCCjJF,kDACE,sBACD,mFAKC,UACA,gBA8DD,0QA1DG,YACA,oCACA,iCACA,kBACA,qBACA,eACA,gBACA,cAtBN,8SAyBQ,sBACA,oCACA,6BACD,kSASC,mCACA,qBASJ,2IACE,8BAhDN,sTA8DQ,cACA,qBACA,qCAJF,8UAQI,qBACA,qCAMR,kDACE,SACA,WACD,mIAIC,iCbrGF,QACA,SACA,kBACA,oBACA,sCACA,sBACA,uBACA,iCAKE,oCACA,qCaMJ,2KAyFI,sBACA,oCACA,6BACD,onBAWK,kBAGJ,wQAEE,sBACA,eACA,gBACA,iBACA,SACA,WAPF,gSAWI,uCACA,4BAUF,4vFAEE,cACA,eACA,gBACA,SACA,YACA,mBACD,o9BAOC,sBAMF,o8BAEE,cACD,oKAMH,sBACD,wpBASK,kBACA,WAEE,wTACF,WACD,0XAKC,SAlLR,41BAwLQ,kBAMM,w1BAEN,UACD,qMAIC,mBArMR,0XAyMQ,UACA,UAOH,ggBAOC,sBACA,oBACD,oBC/NH,eAGF,yEAJE,sBAIF,qEdQE,SACA,mBACA,WACA,YACA,gBACA,UACA,kBACA,UcTE,oBACD,+BduCD,oBACA,oBACA,mBACA,gBACA,qBACA,UACA,WACA,cACA,oBACA,sBACA,iBACA,mBACA,cACA,sBAGA,mCACA,qCAGA,kCAGA,kCAGA,6BCwiED,qCDriEG,YACA,cCyiEH,0DDpiEK,YACA,cenFN,mCf+CE,2BACA,oBACA,mBACA,gBACA,qBACA,UACA,WACA,cACA,oBACA,sBACA,iBACA,mBACA,cACA,sBAGA,mCACA,qCAGA,kCAGA,kCAGA,6BevED,yCf0EG,sBACA,iBCykEH,8DDpkEK,sBACA,iBe/EN,kBAEE,SACA,UACA,gBACA,iCALF,sCACE,sBAUA,yBAKE,sCAGF,gDAPE,sBACA,kBACA,gBACA,iCAIF,uBR7BE,8CAgEF,eACA,gBACA,cACA,qBQnCE,gBACA,gBAGA,SACA,UACA,eACA,gBAEA,yCACA,+CACA,qFACA,WACA,mCACA,eAiED,6BA7DG,oBACA,qBACA,kBACD,2CAGC,mCA3BJ,2CA+BI,mCACD,iCAGC,oCACA,sBACA,oBAKD,mCAFG,sBAxCN,6CA6CI,mCACD,yBAGC,SACA,UAGF,gCACE,iBACA,kBACA,mBACA,gBACA,uBACD,oCAGC,eAIA,0DACE,WACA,kBACA,QACA,SACA,8BACA,UACA,mBACA,mCACA,yBAEF,6EAEE,yFACD,4BAKH,sBACA,SACA,cACA,cACA,6BACA,cACA,cACA,gCAEA,oCf5GF,SACA,mBACA,WACA,YACA,gBACA,UACA,kBACA,Ue8GA,4BACE,gDACA,sCA6DD,qDA1DG,gBACA,gDANJ,mDAUI,YACA,uCACA,iBACA,kBAbJ,6EAgBM,kBACA,SACA,OACA,WACA,WACA,cACA,YACA,mCACA,4EACA,yCACD,qDAGC,iBAGA,gEACA,eAjCN,qHAqCM,iBArCN,sFA0CQ,SACA,WACD,wDAMH,uCAlDJ,mEAqDM,oBACA,2DALJ,2EAQM,oBACA,wDACA,oBAYN,uDACE,eACA,WACD,8FAGC,WARJ,qDAYI,gEACA,WACA,mBACA,wCAfJ,+EAkBM,kBACA,MACA,QACA,YACA,UACA,cACA,YACA,mCAzBN,uDAkCM,yCACD,uHAIC,mBACA,uCAxCN,8DA4CM,yCACA,mBAlCJ,wFAuCM,UACA,UAnDR,0DAyDI,wCADF,qEAII,oBACA,2DAMD,6EAHG,oBACA,wDACD,4DAUL,6BACA,8BAIA,mFACE,gCAQJ,8BACE,oBAFJ,mDAKI,oCACA,sBANJ,qDASM,sBATN,wDAaI,WACA,gCACD,uCAKD,GACE,mBACA,UAEF,IACE,oBACA,UAEF,GACE,UACA,oBdqoED,CcrnEH,4CACE,GAAK,oBACL,IAAM,uBACN,IAAM,sBACN,GAAO,oBdmoEN,CchoEH,4CACE,GAAK,oBACL,IAAM,sBACN,IAAM,uBACN,GAAO,oBd8oEN,Cc/nEH,4CACE,GAAK,oBACL,IAAM,uBACN,IAAM,sBACN,GAAO,oBd6oEN,Cc1oEH,4CACE,GAAK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","file":"mdl-ext-eqjs.min.css","sourcesContent":["@charset \"UTF-8\";\n\n/**\n * @license\n * Copyright 2016-2017 Leif Olsen. All Rights Reserved.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *      http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n *\n * This code is built with Google Material Design Lite,\n * which is Licensed under the Apache License, Version 2.0\n */\n\n@import \"../mixins\";\n\n.mdlext-aria-expanded-plus-minus {\n  @include mdlext-aria-expanded-toggle($font-family: inherit);\n}\n\n.mdlext-aria-expanded-more-less {\n  @include mdlext-aria-expanded-toggle($icon: 'expand_more', $icon-expanded: 'expand_less');\n}\n\n\n\n// WEBPACK FOOTER //\n// webpack:///src/aria-expanded-toggle/_aria-expanded-toggle.scss","@import \"functions\";\n\n/// Triangle helper mixin\n/// Modified from: http://blustemy.io/drawing-pure-css-arrows-with-mixins/\n///                https://css-tricks.com/snippets/sass/css-triangle-mixin/\n/// @param {Direction} $direction - Triangle direction, either `top`, `right`, `bottom` or `left`\n/// @param {Color} $color [currentcolor] - Triangle color\n/// @param {Length} $size [1em] - Triangle size\n@mixin mdlext-arrow($direction: bottom, $base-width: 15px, $length: 10px, $color: inherit, $font-size: inherit) {\n  content: '';\n  width: 0;\n  height: 0;\n  font-size: $font-size;\n  line-height: $font-size;\n  border-#{mdlext-opposite-direction($direction)}: $length solid $color;\n  border-#{mdlext-opposite-direction($direction)}-width: $length;\n  border-#{mdlext-opposite-direction($direction)}-style: solid;\n  border-#{mdlext-opposite-direction($direction)}-color: $color;\n\n  $perpendicular-borders: ($base-width / 2) solid transparent;\n\n  @if $direction == top or $direction == bottom {\n    border-left: $perpendicular-borders;\n    border-right: $perpendicular-borders;\n  }\n  @else if $direction == right or $direction == left {\n    border-bottom: $perpendicular-borders;\n    border-top: $perpendicular-borders;\n  }\n}\n\n/// Hide element while making it readable for screen readers\n/// Copied from HTML5Boilerplate:\n/// https://github.com/h5bp/html5-boilerplate/blob/master/src/css/main.css#L119-L133\n@mixin mdlext-visually-hidden() {\n  border: 0;\n  clip: rect(0 0 0 0);\n  height: 1px;\n  margin: -1px;\n  overflow: hidden;\n  padding: 0;\n  position: absolute;\n  width: 1px;\n}\n\n\n/// Toggle for aria-expanded attribute\n///\n/// @author Leif Olsen\n/// @param {Font} $font-family ['Material Icons'] - Font family\n/// @param {Length} $font-size [24px] - Font size\n/// @param {string} $icon ['+'] - icon to display when 'aria-expanded=\"false\"'\n/// @param {string} $icon-expanded ['-'] - icon to display when 'aria-expanded=\"true\"'\n/// @link https://github.com/google/material-design-icons Modified from '.material-icons' class\n/// @param {Length} $icon-offset [0] - Icon offset\n///\n/// @example - +/- toggle\n///   .plus-minus {\n///     @include mdlext-aria-expanded-toggle($font-family: inherit, $font-size: inherit);\n///   }\n///   <div aria-expanded=\"false\">\n///     <i class=\"plus-minus\"></i>\n///   </div>\n///\n/// @example - Material Icons, expand-more/expand_less\n///   .more-less {\n///     @include mdlext-aria-expanded-toggle($content: 'expand_more', $content-expanded: 'expand_less');\n///   }\n///   <div aria-expanded=\"true\">\n///     <i class=\"more-less\"></i>\n///   </div>\n\n@mixin mdlext-aria-expanded-toggle($font-family: 'Material Icons', $font-size: 24px, $icon: '+', $icon-expanded: '-', $icon-offset: 0) {\n  font-family: $font-family;\n  font-weight: inherit;\n  font-style: inherit;\n  font-size: $font-size;  // 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  vertical-align: middle;\n\n  // Support for all WebKit browsers.\n  -webkit-font-smoothing: antialiased;\n  -webkit-font-feature-settings: 'liga';\n\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  &::after {\n    content: $icon;\n    margin-left: $icon-offset;\n  }\n\n  [aria-expanded='true'] > & {\n    &::after {\n      content: $icon-expanded;\n      margin-left: $icon-offset;\n    }\n  }\n}\n\n\n/// Keyframe mixin\n/// Modified from: http://sassbreak.com/nested-keyframe-rules-sass/\n/// Modified from: http://sassbreak.com/sass-tools-and-snippets/\n///\n/// @example\n///\n/// .some-element {\n///   animation: 10s linear infinite;\n///\n///   @include mdlext-animation-keyframes {\n///     from {\n///       background-position: 0% 0%;\n///     }\n///     to {\n///       background-position: 114.2857% 0%;\n///     }\n///   }\n/// }\n\n@mixin mdlext-animation-keyframes {\n  $animation-name: unique-id();\n  animation-name: $animation-name;\n\n  @keyframes #{$animation-name} {\n    @content;\n  }\n}\n\n\n/// Flexible title mixin\n/// A flexible title consists of three regions, left, middle and right.\n/// The left and right regions are optional and will typically contain state icons\n/// or act as a toolbar. The middle region should contain the title text.\n///\n/// @author Leif Olsen\n/// @param {String} $class - class name\n/// @gutter {Length} [8px] - horizontal spacing between title elements\n///\n/// @example\n///\n/// @include mdlext-flexible-title(my-title) {\n///   overflow: hidden;\n///   background-color: yellow;\n///   &__text {\n///     font-size: 20px;\n///     letter-spacing: 0.02em;\n///     font-weight: 400;\n///     line-height: 1.1;\n///   }\n/// }\n///\n/// <header class=\"my-title\">\n///   <i class=\"material-icons\" role=\"presentation\" style=\"font-size: 28px;\">info</i>\n///   <h2 class=\"my-title__text\">A title</h2>\n///   <span class=\"my-title__spacer\"></span>\n///   <i class=\"mdlext-aria-expanded-more-less\" role=\"presentation\" style=\"font-size: 28px;\"></i>\n/// </header>\n\n@mixin mdlext-flexible-title($class, $gutter: 8px) {\n  .#{$class} {\n    box-sizing: border-box;\n    position: relative;\n    width: 100%;\n    display: flex;\n    align-self: stretch;\n    align-items: center;\n    margin: 0;\n    padding: 0 $gutter;\n\n    &__text,\n    &__text > * {\n      white-space: nowrap;\n      overflow: hidden;\n      text-overflow: ellipsis;\n    }\n\n    > * {\n      box-sizing: border-box;\n      margin: 0;\n      padding: 0 $gutter 0 0;\n    }\n\n    > *:last-child {\n      padding-right: 0;\n    }\n\n    // Used to align elements inside a header or drawer, by growing to fill\n    // remaining space. Commonly used for aligning elements to the right.\n    &__spacer {\n      flex: 1;\n    }\n\n    @content;\n  }\n}\n\n\n\n\n// WEBPACK FOOTER //\n// webpack:///src/_mixins.scss","@charset \"UTF-8\";\n\n// Material Design Lite\n@import '~material-design-lite/src/variables';\n@import '~material-design-lite/src/mixins';\n\n// mdl-ext\n@import 'mdl-ext-eqjs';\n\n\n\n// WEBPACK FOOTER //\n// webpack:///src/mdl-ext-eqjs-build.scss","/**\n * Copyright 2016 Leif Olsen. All Rights Reserved.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *      http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\n// Use of this module requires the user to include variables from material-design-lite\n//@import \"../../node_modules/material-design-lite/src/variables\";\n//@import \"../../node_modules/material-design-lite/src/mixins\";\n@import \"../variables\";\n\n.mdlext-layout__sticky-header {\n  position: absolute;\n  overflow: visible;\n  background: $mdlext-sticky-header-background;\n  transition: 0.1s ease-in-out;\n\n  &.mdlext-is-scroll {\n    background: $mdlext-sticky-header-background-scroll;\n  }\n}\n\n*:not(.is-small-screen) .mdlext-layout__sticky-header {\n  .mdl-layout__drawer-button {\n    visibility: hidden;\n  }\n  .mdl-layout__header-row {\n    padding-left: $padding;\n  }\n}\n\n*:not(.mdl-layout--fixed-drawer).has-drawer .mdlext-layout__sticky-header,\n.is-small-screen.has-drawer .mdlext-layout__sticky-header {\n  display: flex;\n\n  .mdl-layout__drawer-button {\n    visibility: visible;\n  }\n  .mdl-layout__header-row {\n    padding-left: $padding + $layout-drawer-button-desktop-size;\n  }\n}\n\n\n\n// WEBPACK FOOTER //\n// webpack:///src/sticky-header/_sticky-header.scss","/**\n * Copyright 2015 Google Inc. All Rights Reserved.\n * Copyright 2016 Leif Olsen. All Rights Reserved.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *      http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n *\n * SASS based on css from Google Chrome Dialog polyfill, https://github.com/GoogleChrome/dialog-polyfill\n * @include 'node_modules/dialog-polyfill/dialog-polyfill.css' before using this\n */\n\n@import \"../variables\";\n\ndialog.mdlext-dialog {\n  position: absolute;\n  border: 0;\n  opacity: 0;\n  padding: $mdlext-dialog-padding;\n  background-color: $mdlext-dialog-background-color;\n\n  &[open] {\n    animation: mdlext-open-dialog $mdlext-dialog-open-animation;\n  }\n  &[open]::backdrop {\n    animation: mdlext-darken-backdrop $mdlext-dialog-backdrop-animation;\n  }\n  &[open] + .backdrop {\n    animation: mdlext-darken-backdrop $mdlext-dialog-backdrop-animation;\n  }\n}\n\n@keyframes mdlext-darken-backdrop {\n  to { background: $mdlext-dialog-backdrop-color; }\n}\n@keyframes mdlext-open-dialog {\n  to { opacity: 1; }\n}\n\n\n\n// WEBPACK FOOTER //\n// webpack:///src/dialog/dialog.scss","@charset \"UTF-8\";\n\n/**\n * This code is modified from Material Design Lite _grid.sass,\n * which is Licensed under the Apache License, Version 2.0\n * Copyright 2015 Google Inc. All Rights Reserved.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *      http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n *\n */\n\n//////////////////////////////////////////////////////////////////////////////////\n//\n// Element queries for _grid.scss, based on: https://github.com/Snugug/eq.js\n//\n//////////////////////////////////////////////////////////////////////////////////\n\n// Use of this module requires the user to include variables from material-design-lite in hers/his main SASS module\n//@import \"../../node_modules/material-design-lite/src/variables\";\n.mdlext-grid {\n  display: flex;\n  flex-flow: row wrap;\n  margin: 0 auto;\n  align-items: stretch;\n\n  &.mdlext-grid--no-spacing {\n    padding: 0;\n  }\n\n  & > .mdlext-cell {\n    box-sizing: border-box;\n  }\n\n  & > .mdlext-cell--top {\n    align-self: flex-start;\n  }\n\n  & > .mdlext-cell--middle {\n    align-self: center;\n  }\n\n  & > .mdlext-cell--bottom {\n    align-self: flex-end;\n  }\n\n  & > .mdlext-cell--stretch {\n    align-self: stretch;\n  }\n\n  .mdlext-grid--no-spacing > .mdlext-cell {\n    margin: 0;\n  }\n\n  // Define order override classes.\n  @for $i from 1 through $grid-max-columns {\n    & > .mdlext-cell--order-#{$i} {\n      order: $i;\n    }\n  }\n}\n\n// Mixins for width calculation.\n@mixin _partial-size($size, $columns, $gutter) {\n  width: calc(#{(($size / $columns) * 100) + \"%\"} - #{$gutter});\n}\n@mixin _full-size($gutter) {\n  @include _partial-size(1, 1, $gutter);\n}\n@mixin _offset-size($size, $columns, $gutter) {\n  margin-left: calc(#{(($size / $columns) * 100) + \"%\"} + #{$gutter / 2});\n}\n\n@mixin _partial-size-no-spacing($size, $columns) {\n  width: #{(($size / $columns) * 100) + \"%\"};\n}\n@mixin _full-size-no-spacing() {\n  @include _partial-size-no-spacing(1, 1);\n}\n@mixin _offset-size-no-spacing($size, $columns) {\n  margin-left: #{(($size / $columns) * 100) + \"%\"};\n}\n\n\n.mdlext-grid {\n\n  @include eq-pts((\n    grid_phone: 0,\n    grid_tablet: strip-unit($grid-tablet-breakpoint),\n    grid_desktop: strip-unit($grid-desktop-breakpoint)\n  ));\n\n  ////////// Phone //////////\n  @include eq('grid_phone') {\n    padding: $grid-phone-margin - ($grid-phone-gutter / 2);\n\n    & > .mdlext-cell {\n      margin: $grid-phone-gutter / 2;\n      @include _partial-size($grid-cell-default-columns, $grid-phone-columns, $grid-phone-gutter);\n    }\n\n    & > .mdlext-cell--hide-phone {\n      display: none !important;\n    }\n\n    // Define order override classes.\n    @for $i from 1 through $grid-max-columns {\n      & > .mdlext-cell--order-#{$i}-phone.mdlext-cell--order-#{$i}-phone {\n        order: $i;\n      }\n    }\n\n    // Define partial sizes for columnNumber < totalColumns.\n    @for $i from 1 through ($grid-phone-columns - 1) {\n      & > .mdlext-cell--#{$i}-col,\n      & > .mdlext-cell--#{$i}-col-phone.mdlext-cell--#{$i}-col-phone {\n        @include _partial-size($i, $grid-phone-columns, $grid-phone-gutter);\n      }\n    }\n\n    // Define 100% for everything else.\n    @for $i from $grid-phone-columns through $grid-desktop-columns {\n      & > .mdlext-cell--#{$i}-col,\n      & > .mdlext-cell--#{$i}-col-phone.mdlext-cell--#{$i}-col-phone {\n        @include _full-size($grid-phone-gutter);\n      }\n    }\n\n    // Define valid phone offsets.\n    @for $i from 1 through ($grid-phone-columns - 1) {\n      & > .mdlext-cell--#{$i}-offset,\n      & > .mdlext-cell--#{$i}-offset-phone.mdlext-cell--#{$i}-offset-phone {\n        @include _offset-size($i, $grid-phone-columns, $grid-phone-gutter);\n      }\n    }\n\n    &.mdlext-grid--no-spacing {\n      padding: 0;\n\n      & > .mdlext-cell {\n        margin: 0;\n        @include _partial-size-no-spacing($grid-cell-default-columns, $grid-phone-columns);\n      }\n\n      // Define partial sizes for columnNumber < totalColumns.\n      @for $i from 1 through ($grid-phone-columns - 1) {\n        & > .mdlext-cell--#{$i}-col,\n        & > .mdlext-cell--#{$i}-col-phone.mdlext-cell--#{$i}-col-phone {\n          @include _partial-size-no-spacing($i, $grid-phone-columns);\n        }\n      }\n\n      // Define 100% for everything else.\n      @for $i from $grid-phone-columns through $grid-desktop-columns {\n        & > .mdlext-cell--#{$i}-col,\n        & > .mdlext-cell--#{$i}-col-phone.mdlext-cell--#{$i}-col-phone {\n          @include _full-size-no-spacing();\n        }\n      }\n\n      // Define valid phone offsets.\n      @for $i from 1 through ($grid-phone-columns - 1) {\n        & > .mdlext-cell--#{$i}-offset,\n        & > .mdlext-cell--#{$i}-offset-phone.mdlext-cell--#{$i}-offset-phone {\n          @include _offset-size-no-spacing($i, $grid-phone-columns);\n        }\n      }\n    }\n  }\n\n  ////////// Tablet //////////\n  @include eq('grid_tablet') {\n    padding: $grid-tablet-margin - ($grid-tablet-gutter / 2);\n\n    & > .mdlext-cell {\n      margin: $grid-tablet-gutter / 2;\n      @include _partial-size($grid-cell-default-columns, $grid-tablet-columns, $grid-tablet-gutter);\n    }\n\n    & > .mdlext-cell--hide-tablet {\n      display: none !important;\n    }\n\n    // Define order override classes.\n    @for $i from 1 through $grid-max-columns {\n      & > .mdlext-cell--order-#{$i}-tablet.mdlext-cell--order-#{$i}-tablet {\n        order: $i;\n      }\n    }\n\n    // Define partial sizes for columnNumber < totalColumns.\n    @for $i from 1 through ($grid-tablet-columns - 1) {\n      & > .mdlext-cell--#{$i}-col,\n      & > .mdlext-cell--#{$i}-col-tablet.mdlext-cell--#{$i}-col-tablet {\n        @include _partial-size($i, $grid-tablet-columns, $grid-tablet-gutter);\n      }\n    }\n\n    // Define 100% for everything else.\n    @for $i from $grid-tablet-columns through $grid-desktop-columns {\n      & > .mdlext-cell--#{$i}-col,\n      & > .mdlext-cell--#{$i}-col-tablet.mdlext-cell--#{$i}-col-tablet {\n        @include _full-size($grid-tablet-gutter);\n      }\n    }\n\n    // Define valid tablet offsets.\n    @for $i from 1 through ($grid-tablet-columns - 1) {\n      & > .mdlext-cell--#{$i}-offset,\n      & > .mdlext-cell--#{$i}-offset-tablet.mdlext-cell--#{$i}-offset-tablet {\n        @include _offset-size($i, $grid-tablet-columns, $grid-tablet-gutter);\n      }\n    }\n\n    &.mdlext-grid--no-spacing {\n      padding: 0;\n\n      & > .mdlext-cell {\n        margin: 0;\n        @include _partial-size-no-spacing($grid-cell-default-columns, $grid-tablet-columns);\n      }\n\n      // Define partial sizes for columnNumber < totalColumns.\n      @for $i from 1 through ($grid-tablet-columns - 1) {\n        & > .mdlext-cell--#{$i}-col,\n        & > .mdlext-cell--#{$i}-col-tablet.mdlext-cell--#{$i}-col-tablet {\n          @include _partial-size-no-spacing($i, $grid-tablet-columns);\n        }\n      }\n\n      // Define 100% for everything else.\n      @for $i from $grid-tablet-columns through $grid-desktop-columns {\n        & > .mdlext-cell--#{$i}-col,\n        & > .mdlext-cell--#{$i}-col-tablet.mdlext-cell--#{$i}-col-tablet {\n          @include _full-size-no-spacing();\n        }\n      }\n\n      // Define valid tablet offsets.\n      @for $i from 1 through ($grid-tablet-columns - 1) {\n        & > .mdlext-cell--#{$i}-offset,\n        & > .mdlext-cell--#{$i}-offset-tablet.mdlext-cell--#{$i}-offset-tablet {\n          @include _offset-size-no-spacing($i, $grid-tablet-columns);\n        }\n      }\n    }\n  }\n\n  ////////// Desktop //////////\n  @include eq('grid_desktop') {\n    padding: $grid-desktop-margin - ($grid-desktop-gutter / 2);\n\n    & > .mdlext-cell {\n      margin: $grid-desktop-gutter / 2;\n      @include _partial-size($grid-cell-default-columns, $grid-desktop-columns, $grid-desktop-gutter);\n    }\n\n    & > .mdlext-cell--hide-desktop {\n      display: none !important;\n    }\n\n    // Define order override classes.\n    @for $i from 1 through $grid-max-columns {\n      & > .mdlext-cell--order-#{$i}-desktop.mdlext-cell--order-#{$i}-desktop {\n        order: $i;\n      }\n    }\n\n    // Define partial sizes for all numbers of columns.\n    @for $i from 1 through $grid-desktop-columns {\n      & > .mdlext-cell--#{$i}-col,\n      & > .mdlext-cell--#{$i}-col-desktop.mdlext-cell--#{$i}-col-desktop {\n        @include _partial-size($i, $grid-desktop-columns, $grid-desktop-gutter);\n      }\n    }\n\n    // Define valid desktop offsets.\n    @for $i from 1 through ($grid-desktop-columns - 1) {\n      & > .mdlext-cell--#{$i}-offset,\n      & > .mdlext-cell--#{$i}-offset-desktop.mdlext-cell--#{$i}-offset-desktop {\n        @include _offset-size($i, $grid-desktop-columns, $grid-desktop-gutter);\n      }\n    }\n\n    &.mdlext-grid--no-spacing {\n      padding: 0;\n\n      & > .mdlext-cell {\n        margin: 0;\n        @include _partial-size-no-spacing($grid-cell-default-columns, $grid-desktop-columns);\n      }\n\n      // Define partial sizes for all numbers of columns.\n      @for $i from 1 through $grid-desktop-columns {\n        & > .mdlext-cell--#{$i}-col,\n        & > .mdlext-cell--#{$i}-col-desktop.mdlext-cell--#{$i}-col-desktop {\n          @include _partial-size-no-spacing($i, $grid-desktop-columns);\n        }\n      }\n\n      // Define valid desktop offsets.\n      @for $i from 1 through ($grid-desktop-columns - 1) {\n        & > .mdlext-cell--#{$i}-offset,\n        & > .mdlext-cell--#{$i}-offset-desktop.mdlext-cell--#{$i}-offset-desktop {\n          @include _offset-size-no-spacing($i, $grid-desktop-columns);\n        }\n      }\n    }\n  }\n}\n\n@include eq-selectors;\n\n\n\n// WEBPACK FOOTER //\n// webpack:///src/grid/_grid-eqjs.scss","//////////////////////////////\n// Variables\n//////////////////////////////\n// Selectors that were called for CSS element queries\n$EQ-Selectors: ();\n\n//////////////////////////////\n// Error Mixin\n//////////////////////////////\n@mixin EQSTATECHECK($states, $name) {\n  $EQ-Error: 'You need to include a state for the `#{$name}` mixin!';\n  @if (length($states) == 0) {\n    @if feature-exists(at-error) {\n      @error $EQ-Error;\n    }\n    @else {\n      @warn $EQ-Error;\n    }\n  }\n  @else {\n    @content;\n  }\n}\n\n//////////////////////////////\n// Element Queries!\n//\n// $states - List of states to apply styling to; @include eq(small, medium, large)\n//////////////////////////////\n@mixin eq($states...) {\n  @include EQSTATECHECK('eq', $states) {\n    //////////////////////////////\n    // Markup based Element Queries\n    //////////////////////////////\n    $extend: unique-id();\n    @at-root {\n      %#{$extend} {\n        @content;\n      }\n    }\n    @each $state in $states {\n      &[data-eq-state$=\"#{$state}\"] {\n        @extend %#{$extend};\n      }\n    }\n  }\n}\n\n//////////////////////////////\n// Element Query Stack!\n//\n// Contains one of the query states!\n// $states - List of states to apply styling to; @include eq-contains(small, medium, large)\n//  * Space separated list will be treated like an `and` media query; all of the states must be active\n//  * Comma separated list will be treated like an `or` media query: at least one of the states must be active\n//////////////////////////////\n@mixin eq-contains($states...) {\n  // Space separator API, so going to do stupid magic\n  @if length($states) == 1 {\n    $states: nth($states, 1);\n  }\n\n  @include EQSTATECHECK('eq', $states) {\n    //////////////////////////////\n    // Markup based Element Queries\n    //////////////////////////////\n    $extend: unique-id();\n    @at-root {\n      %#{$extend} {\n        @content;\n      }\n    }\n    @if list-separator($states) == 'space' {\n      $stateApply: '';\n\n      @each $state in $states {\n        $stateApply: $stateApply + '[data-eq-state~=\"#{$state}\"]';\n      }\n\n      &#{$stateApply} {\n        @extend %#{$extend};\n      }\n    }\n    @else {\n      @each $state in $states {\n        &[data-eq-state~=\"#{$state}\"] {\n          @extend %#{$extend};\n        }\n      }\n    }\n  }\n}\n\n//////////////////////////////\n// Element Query Points\n//\n// Prints element query points to element's `:before`\n//\n// $states - Map of `name: size`; @include eq-pts((small: 400, medium: 600, large: 900))\n//////////////////////////////\n@mixin eq-pts($states) {\n  &:before {\n    display: none;\n    content: '#{str-slice(inspect($states), 2, -2)}';\n  }\n\n  @if not index($EQ-Selectors, '#{&}') {\n    $EQ-Selectors: append($EQ-Selectors, '#{&}', 'comma') !global;\n  }\n}\n\n//////////////////////////////\n// Element Query Selectors\n//\n// Prints list of selectors that were called for CSS element queries to HTML's `:before`\n//////////////////////////////\n@mixin eq-selectors {\n  @at-root {\n    html:before {\n      display: none;\n      content: '#{$EQ-Selectors}';\n    }\n  }\n}\n\n\n\n// WEBPACK FOOTER //\n// webpack:///~/eq.js/sass/_eq.scss","@charset \"UTF-8\";\n\n/**\n * Copyright 2016 Leif Olsen. All Rights Reserved.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *      http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\n/*\n * A lightboard is a translucent surface illuminated from behind, used for situations\n * where a shape laid upon the surface needs to be seen with high contrast. In the \"old days\" of photography\n * photograpers used a lightboard to get a quick view of their slides. The goal is to create a responsive lightbox\n * design, based on flex layout, similar to what is used in Adobe LightRoom to browse images.\n */\n\n// Use of this module requires the user to include variables from material-design-lite\n//@import \"../../node_modules/material-design-lite/src/variables\";\n//@import \"../../node_modules/material-design-lite/src/mixins\";\n@import \"../variables\";\n\nul.mdlext-lightboard {\n  list-style: none;\n}\n\n.mdlext-lightboard {\n  box-sizing: border-box;\n  margin: 0 auto;\n  padding: 0;\n  display: flex;\n  flex-flow:row wrap;\n  align-items: stretch;\n\n  *,\n  *::before,\n  *::after,\n  input[type=\"search\"] {\n    box-sizing: border-box;\n  }\n\n  .mdlext-lightboard__slide {\n    background-color: $mdlext-lightboard-slide-background-color;\n    border: 1px solid $mdlext-lightboard-slide-border-color;\n    border-radius: $mdlext-lightboard-slide-border-radius;\n    box-shadow: $mdlext-lightboard-slide-box-shadow;\n    position: relative;\n    display: block;\n    max-width: $mdlext-lightboard-slide-max-size;\n\n    &::before {\n      // 1:1 ratio\n      // TODO: Use a class for ratio so the grid can display slides with different ratios (16:9, 16:10, 4:3 ...)\n      content: '';\n      display: block;\n      padding-top: 100%;\n    }\n    &:hover,\n    &:active,\n    &:focus {\n      border-color: $mdlext-lightboard-slide-border-color-hover;\n      background-color: $mdlext-lightboard-slide-background-color-hover;\n      box-shadow: $mdlext-lightboard-slide-box-shadow-hover;\n\n      figcaption {\n        color: rgba(0, 0, 0, 1) !important;\n        background-color: rgba(255, 255, 255, 0.2);\n      }\n    }\n    &:focus {\n      outline-offset: -2px;\n      outline-color: $mdlext-lightboard-focus-outline-color;\n    }\n    &[aria-selected='true'] {\n      background-color: $mdlext-lightboard-slide-active-bacground-color;\n\n      figcaption {\n        color: rgba(0, 0, 0, 1) !important;\n        background-color: rgba(255, 255, 255, 0.2);\n      }\n    }\n    &__frame,\n    &__ripple-container {\n      text-decoration: none;\n      display: block;\n      overflow: hidden;\n      position: absolute;\n      top: 0;\n      left: 0;\n      right: 0;\n      bottom: 0;\n\n      &:focus {\n        outline-offset: -2px;\n        outline-color: $mdlext-lightboard-focus-outline-color;\n      }\n      & .mdl-ripple {\n        background: $mdlext-lightboard-ripple-color;\n      }\n      figure {\n        display: block;\n        position: absolute;\n        top: 0;\n        left: 0;\n        right: 0;\n        bottom: 0;\n\n        img {\n          position: absolute;\n          top: 0;\n          left: 0;\n          right: 0;\n          bottom: 0;\n          margin: auto;\n          max-width: 100%;\n          max-height: 100%;\n          border-width: 0;\n          border-radius: $mdlext-lightboard-slide-inner-border-radius;\n        }\n        figcaption {\n          @include typo-caption($colorContrast: false, $usePreferred: true);\n\n          color: $mdlext-lightboard-figcaption-text-color;\n          position: absolute;\n          bottom: -2px;\n          white-space: nowrap;\n          overflow: hidden;\n          max-width: 100%;\n          width: 100%;\n          text-align: center;\n          text-overflow: ellipsis;\n          padding: 4px 0;\n        }\n      }\n      &:hover {\n        figcaption {\n          // As far as I can see there is no way to darken/lighten a text color\n          // defined by MDL, due to the \"unqote\" functions.\n          // So this is a hack\n          color: rgba(0, 0, 0, 1) !important;\n          background-color: rgba(255, 255, 255, 0.2);\n        }\n      }\n    }\n  }\n}\n\n////// Media / Element queries default, Small //////\n.mdlext-lightboard {\n  padding: calc((#{$mdlext-lightboard-small-margin} - #{$mdlext-lightboard-small-gutter}) / 2);\n\n  .mdlext-lightboard__slide {\n    margin: calc(#{$mdlext-lightboard-small-gutter} / 2);\n    width: calc(1 / #{$mdlext-lightboard-small-columns} * 100% - #{$mdlext-lightboard-small-gutter});\n\n    .mdlext-lightboard__slide__frame figure {\n      margin: $mdlext-lightboard-small-frame-width;\n    }\n  }\n  &.mdlext-lightboard--no-spacing {\n    padding: 0;\n\n    .mdlext-lightboard__slide {\n      margin: 0;\n      width: calc(1 / #{$mdlext-lightboard-small-columns} * 100%);\n    }\n  }\n}\n\n// Import one of _lightboard-media-queries.scss or _lightboard-eq-js.scss to complete SASS\n\n\n\n// WEBPACK FOOTER //\n// webpack:///src/lightboard/_lightboard.scss","/**\n * Copyright 2015 Google Inc. All Rights Reserved.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *      http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\n/* Typography */\n\n@mixin typo-preferred-font($usePreferred: true) {\n  @if $usePreferred {\n    font-family: $preferred_font;\n  }\n}\n\n@mixin typo-display-4($colorContrast: false, $usePreferred: true) {\n  @include typo-preferred-font($usePreferred);\n  font-size: 112px;\n  font-weight: 300;\n  line-height: 1;\n  letter-spacing: -0.04em;\n\n  @if $colorContrast {\n    opacity: 0.54;\n  }\n}\n\n@mixin typo-display-3($colorContrast: false, $usePreferred: true) {\n  @include typo-preferred-font($usePreferred);\n  font-size: 56px;\n  font-weight: 400;\n  line-height: 1.35;\n  letter-spacing: -0.02em;\n\n  @if $colorContrast {\n    opacity: 0.54;\n  }\n}\n\n@mixin typo-display-2($colorContrast: false, $usePreferred: true) {\n  @include typo-preferred-font($usePreferred);\n  font-size: 45px;\n  font-weight: 400;\n  line-height: 48px;\n\n  @if $colorContrast {\n    opacity: 0.54;\n  }\n}\n\n@mixin typo-display-1($colorContrast: false, $usePreferred: true) {\n  @include typo-preferred-font($usePreferred);\n  font-size: 34px;\n  font-weight: 400;\n  line-height: 40px;\n\n  @if $colorContrast {\n    opacity: 0.54;\n  }\n}\n\n@mixin typo-headline($colorContrast: false, $usePreferred: true) {\n  @include typo-preferred-font($usePreferred);\n  font-size: 24px;\n  font-weight: 400;\n  line-height: 32px;\n  -moz-osx-font-smoothing: grayscale;\n\n  @if $colorContrast {\n    opacity: 0.87;\n  }\n}\n\n@mixin typo-title($colorContrast: false, $usePreferred: true) {\n  @include typo-preferred-font($usePreferred);\n  font-size: 20px;\n  font-weight: 500;\n  line-height: 1;\n  letter-spacing: 0.02em;\n\n  @if $colorContrast {\n    opacity: 0.87;\n  }\n}\n\n@mixin typo-subhead($colorContrast: false, $usePreferred: true) {\n  @include typo-preferred-font($usePreferred);\n  font-size: 16px;\n  font-weight: 400;\n  line-height: 24px;\n  letter-spacing: 0.04em;\n\n  @if $colorContrast {\n    opacity: 0.87;\n  }\n}\n\n@mixin typo-subhead-2($colorContrast: false, $usePreferred: true) {\n  @include typo-preferred-font($usePreferred);\n  font-size: 16px;\n  font-weight: 400;\n  line-height: 28px;\n  letter-spacing: 0.04em;\n\n  @if $colorContrast {\n    opacity: 0.87;\n  }\n}\n\n@mixin typo-body-2($colorContrast: false, $usePreferred: false) {\n  @include typo-preferred-font($usePreferred);\n  font-size: 14px;\n  @if $usePreferred {\n    font-weight: 500;\n  } @else {\n    font-weight: bold;\n  }\n  line-height: 24px;\n  letter-spacing: 0;\n\n  @if $colorContrast {\n    opacity: 0.87;\n  }\n}\n\n@mixin typo-body-1($colorContrast: false, $usePreferred: false) {\n  @include typo-preferred-font($usePreferred);\n  font-size: 14px;\n  font-weight: 400;\n  line-height: 24px;\n  letter-spacing: 0;\n\n  @if $colorContrast {\n    opacity: 0.87;\n  }\n}\n\n@mixin typo-caption($colorContrast: false, $usePreferred: false) {\n  @include typo-preferred-font($usePreferred);\n  font-size: 12px;\n  font-weight: 400;\n  line-height: 1;\n  letter-spacing: 0;\n\n  @if $colorContrast {\n    opacity: 0.54;\n  }\n}\n\n@mixin typo-blockquote($colorContrast: false, $usePreferred: true) {\n  @include typo-preferred-font($usePreferred);\n  position: relative;\n  font-size: 24px;\n  font-weight: 300;\n  font-style: italic;\n  line-height: 1.35;\n  letter-spacing: 0.08em;\n\n  &:before {\n    position: absolute;\n    left: -0.5em;\n    content: 'â';\n  }\n\n  &:after {\n    content: 'â';\n    margin-left: -0.05em;\n  }\n\n  @if $colorContrast {\n    opacity: 0.54;\n  }\n}\n\n@mixin typo-menu($colorContrast: false, $usePreferred: true) {\n  @include typo-preferred-font($usePreferred);\n  font-size: 14px;\n  font-weight: 500;\n  line-height: 1;\n  letter-spacing: 0;\n\n  @if $colorContrast {\n    opacity: 0.87;\n  }\n}\n\n@mixin typo-button($colorContrast: false, $usePreferred: true) {\n  @include typo-preferred-font($usePreferred);\n  font-size: 14px;\n  font-weight: 500;\n  text-transform: uppercase;\n  line-height: 1;\n  letter-spacing: 0;\n\n  @if $colorContrast {\n    opacity: 0.87;\n  }\n}\n\n@mixin typo-icon() {\n  font-family: 'Material Icons';\n  font-weight: normal;\n  font-style: normal;\n  font-size: 24px;\n  line-height: 1;\n  letter-spacing: normal;\n  text-transform: none;\n  display: inline-block;\n  word-wrap: normal;\n  font-feature-settings: 'liga';\n  -webkit-font-feature-settings: 'liga';\n  -webkit-font-smoothing: antialiased;\n}\n\n/* Shadows */\n\n// Focus shadow mixin.\n@mixin focus-shadow() {\n  box-shadow: 0 0 8px rgba(0,0,0,.18),0 8px 16px rgba(0,0,0,.36);\n}\n\n@mixin shadow-2dp() {\n  box-shadow: 0 2px 2px 0 rgba(0, 0, 0, $shadow-key-penumbra-opacity),\n              0 3px 1px -2px rgba(0, 0, 0, $shadow-key-umbra-opacity),\n              0 1px 5px 0 rgba(0, 0, 0, $shadow-ambient-shadow-opacity);\n}\n@mixin shadow-3dp() {\n  box-shadow: 0 3px 4px 0 rgba(0, 0, 0, $shadow-key-penumbra-opacity),\n              0 3px 3px -2px rgba(0, 0, 0, $shadow-key-umbra-opacity),\n              0 1px 8px 0 rgba(0, 0, 0, $shadow-ambient-shadow-opacity);\n}\n@mixin shadow-4dp() {\n  box-shadow: 0 4px 5px 0 rgba(0, 0, 0, $shadow-key-penumbra-opacity),\n              0 1px 10px 0 rgba(0, 0, 0, $shadow-ambient-shadow-opacity),\n              0 2px 4px -1px rgba(0, 0, 0, $shadow-key-umbra-opacity);\n}\n@mixin shadow-6dp() {\n  box-shadow: 0 6px 10px 0 rgba(0, 0, 0, $shadow-key-penumbra-opacity),\n              0 1px 18px 0 rgba(0, 0, 0, $shadow-ambient-shadow-opacity),\n              0 3px 5px -1px rgba(0, 0, 0, $shadow-key-umbra-opacity);\n}\n@mixin shadow-8dp() {\n  box-shadow: 0 8px 10px 1px rgba(0, 0, 0, $shadow-key-penumbra-opacity),\n              0 3px 14px 2px rgba(0, 0, 0, $shadow-ambient-shadow-opacity),\n              0 5px 5px -3px rgba(0, 0, 0, $shadow-key-umbra-opacity);\n}\n\n@mixin shadow-16dp() {\n  box-shadow: 0 16px 24px 2px rgba(0, 0, 0, $shadow-key-penumbra-opacity),\n              0  6px 30px 5px rgba(0, 0, 0, $shadow-ambient-shadow-opacity),\n              0  8px 10px -5px rgba(0, 0, 0, $shadow-key-umbra-opacity);\n}\n\n@mixin shadow-24dp() {\n  box-shadow: 0  9px 46px  8px rgba(0, 0, 0, $shadow-key-penumbra-opacity),\n              0 11px 15px -7px rgba(0, 0, 0, $shadow-ambient-shadow-opacity),\n              0 24px 38px  3px rgba(0, 0, 0, $shadow-key-umbra-opacity);\n}\n\n/* Animations */\n\n@mixin material-animation-fast-out-slow-in($duration:0.2s) {\n  transition-duration: $duration;\n  transition-timing-function: $animation-curve-fast-out-slow-in;\n}\n\n@mixin material-animation-linear-out-slow-in($duration:0.2s) {\n  transition-duration: $duration;\n  transition-timing-function: $animation-curve-linear-out-slow-in;\n}\n\n@mixin material-animation-fast-out-linear-in($duration:0.2s) {\n  transition-duration: $duration;\n  transition-timing-function: $animation-curve-fast-out-linear-in;\n}\n\n@mixin material-animation-default($duration:0.2s) {\n  transition-duration: $duration;\n  transition-timing-function: $animation-curve-default;\n}\n\n/* Dialog */\n\n@mixin dialog-width($units:5) {\n  @if(type_of($units) != 'number') {\n    @error \"The unit given to dialog-width should be a number.\";\n  }\n  // 56dp is the base unit width for Dialogs.\n  // With 5 units being the number of units for a mobile device.\n  // https://goo.gl/sK2O5o\n  width: $units * 56px;\n}\n\n\n\n// WEBPACK FOOTER //\n// webpack:///~/material-design-lite/src/_mixins.scss","@charset \"UTF-8\";\n//////////////////////////////////////////////////////////////////////////////////\n//\n// Element queries for _lightbox.scss, based on: https://github.com/Snugug/eq.js\n//\n//////////////////////////////////////////////////////////////////////////////////\n\n@import \"../variables\";\n@import \"../functions\";\n\n.mdlext-lightboard {\n\n  @include eq-pts((\n    lightboard_medium_small: strip-unit($mdlext-lightboard-medium-small-breakpoint),\n    lightboard_medium: strip-unit($mdlext-lightboard-medium-breakpoint),\n    lightboard_medium_large: strip-unit($mdlext-lightboard-medium-large-breakpoint),\n    lightboard_large: strip-unit($mdlext-lightboard-large-breakpoint)\n  ));\n\n  ////// small - meduim-small //////\n  @include eq('lightboard_medium_small') {\n    padding: calc((#{$mdlext-lightboard-medium-small-margin} - #{$mdlext-lightboard-medium-small-gutter}) / 2);\n\n    .mdlext-lightboard__slide {\n      margin: calc(#{$mdlext-lightboard-medium-small-gutter} / 2);\n      width: calc(1 / #{$mdlext-lightboard-medium-small-columns} * 100% - #{$mdlext-lightboard-medium-small-gutter});\n\n      .mdlext-lightboard__slide__frame figure {\n        margin: $mdlext-lightboard-medium-small-frame-width;\n      }\n    }\n    &.mdlext-lightboard--no-spacing {\n      padding: 0;\n\n      .mdlext-lightboard__slide {\n        margin: 0;\n        width: calc(1 / #{$mdlext-lightboard-medium-small-columns} * 100%);\n      }\n    }\n  }\n\n  ////// meduim-small - medium //////\n  @include eq('lightboard_medium') {\n    padding: calc((#{$mdlext-lightboard-medium-margin} - #{$mdlext-lightboard-medium-gutter}) / 2);\n\n    .mdlext-lightboard__slide {\n      margin: calc(#{$mdlext-lightboard-medium-gutter} / 2);\n      width: calc(1 / #{$mdlext-lightboard-medium-columns} * 100% - #{$mdlext-lightboard-medium-gutter});\n\n      .mdlext-lightboard__slide__frame figure {\n        margin: $mdlext-lightboard-medium-frame-width;\n      }\n    }\n    &.mdlext-lightboard--no-spacing {\n      padding: 0;\n\n      .mdlext-lightboard__slide {\n        margin: 0;\n        width: calc(1 / #{$mdlext-lightboard-medium-columns} * 100%);\n      }\n    }\n  }\n\n  ////// meduim - medium-large //////\n  @include eq('lightboard_medium_large') {\n    padding: calc((#{$mdlext-lightboard-medium-large-margin} - #{$mdlext-lightboard-medium-large-gutter}) / 2);\n\n    .mdlext-lightboard__slide {\n      margin: calc(#{$mdlext-lightboard-medium-large-gutter} / 2);\n      width: calc(1 / #{$mdlext-lightboard-medium-large-columns} * 100% - #{$mdlext-lightboard-medium-large-gutter});\n\n      .mdlext-lightboard__slide__frame figure {\n        margin: $mdlext-lightboard-medium-large-frame-width;\n      }\n    }\n    &.mdlext-lightboard--no-spacing {\n      padding: 0;\n\n      .mdlext-lightboard__slide {\n        margin: 0;\n        width: calc(1 / #{$mdlext-lightboard-medium-large-columns} * 100%);\n      }\n    }\n  }\n\n  ////// meduim-large - large //////\n  @include eq('lightboard_large') {\n    padding: calc((#{$mdlext-lightboard-large-margin} - #{$mdlext-lightboard-large-gutter}) / 2);\n\n    .mdlext-lightboard__slide {\n      margin: calc(#{$mdlext-lightboard-large-gutter} / 2);\n      width: calc(1 / #{$mdlext-lightboard-large-columns} * 100% - #{$mdlext-lightboard-large-gutter});\n\n      .mdlext-lightboard__slide__frame figure {\n        margin: $mdlext-lightboard-large-frame-width;\n      }\n    }\n    &.mdlext-lightboard--no-spacing {\n      padding: 0;\n\n      .mdlext-lightboard__slide {\n        margin: 0;\n        width: calc(1 / #{$mdlext-lightboard-large-columns} * 100%);\n      }\n    }\n  }\n}\n\n@include eq-selectors;\n\n\n\n\n// WEBPACK FOOTER //\n// webpack:///src/lightboard/_lightboard-eqjs.scss","@charset \"UTF-8\";\n\n/**\n * Copyright 2016 Leif Olsen. All Rights Reserved.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *      http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\n// Use of this module requires the user to include variables from material-design-lite\n//@import \"../../node_modules/material-design-lite/src/variables\";\n//@import \"../../node_modules/material-design-lite/src/mixins\";\n@import \"../variables\";\n\n.mdlext-lightbox {\n  user-select: none;\n  cursor: default;\n  position: relative;\n  width: auto;\n  max-width: 100%;\n  margin: 0 auto;\n  border: $mdlext-lightbox-border;\n  border-radius: $mdlext-lightbox-border-radius;\n  background-color: $mdlext-lightbox-background-color;\n  box-sizing: border-box;\n  outline: 0;\n  display: block; // display: flex and IE11 has issues with reposition. Set display:block for now.\n\n  *,\n  *::before,\n  *::after,\n  input[type=\"search\"] {\n    box-sizing: border-box;\n  }\n\n  .mdlext-lightbox__slider {\n    // Displays prevvious, current and next image while dragging\n    // Elements are created by lightbox component when dragging starts\n    position: absolute;\n    top: 0;\n    left: 0;\n    display: flex;\n    justify-content: center;\n\n    .mdlext-lightbox__slider__slide {\n      flex-shrink: 0;\n      display: block;\n      text-align: left;\n      color: #7f7f7f;\n      background-size: cover;\n      background-position: center;\n      background-repeat: no-repeat;\n\n      //&:nth-child(1),\n      //&:nth-child(3) {\n      //  filter: blur(1px);\n      //}\n    }\n  }\n\n  figure {\n    margin: $mdlext-lightbox-figure-margin;\n    padding: $mdlext-lightbox-figure-padding;\n    position: relative;\n\n    img {\n      width: 100%;\n      max-width: 100%;\n      height: auto;\n      border: 0;\n      outline: 0;\n    }\n    figcaption {\n      @include typo-caption($colorContrast: false, $usePreferred: true);\n\n      display: block;\n      position: absolute;\n      bottom: 0;\n      left: 0;\n      right: 0;\n      max-width: 100%;\n      height: auto;\n      max-height: 50%;\n      overflow: auto;\n      padding: 8px;\n      background-color: $mdlext-lightbox-figcaption-background-color;\n      transform-origin: bottom;\n      transform: scaleY(0);\n      transition: 0.2s ease-in-out;\n\n      &.mdlext-lightbox__show-figcaption {\n        transform: scaleY(1);\n      }\n      tbody {\n        th {\n          text-align: left;\n        }\n        th,\n        td {\n          vertical-align: text-top;\n        }\n      }\n    }\n  }\n  .mdl-card__menu {\n    color: #ffffff;\n    z-index: 1;\n  }\n  footer {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    background-color: $mdlext-lightbox-footer-background-color;\n\n    .mdl-card__supporting-text {\n      flex: 1;\n      overflow: hidden;\n      padding: 0;\n      height: $card-supporting-text-line-height;\n      width: 100%;\n    }\n    nav {\n      display: flex;\n    }\n  }\n\n  &.mdlext-lightbox--sticky-footer footer {\n    position: fixed;\n    bottom: 0;\n    left: 0;\n  }\n}\n\n\n\n// WEBPACK FOOTER //\n// webpack:///src/lightbox/_lightbox.scss","@charset \"UTF-8\";\n\n/**\n * Copyright 2016 Leif Olsen. All Rights Reserved.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *      http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\n/*\n * A carousel ...\n */\n\n// Use of this module requires the user to include variables from material-design-lite\n//@import \"../../node_modules/material-design-lite/src/variables\";\n//@import \"../../node_modules/material-design-lite/src/mixins\";\n\nul.mdlext-carousel {\n  list-style: none;\n}\n\n.mdlext-carousel {\n  box-sizing: border-box;\n  margin: 0;\n  padding: 0;\n  overflow: hidden;\n  height: 100%;  // Use a container to constrain height and width\n  width: 100%;\n  display: block;\n  white-space: nowrap;\n  font-size: 0;\n  background-color: transparent;\n}\n\n.mdlext-carousel__slide {\n  box-sizing: border-box;\n  display: inline-block;\n  position: relative;\n  outline: 0;\n  margin: 0 $mdlext-carousel-slide-margin-horizontal;\n  padding:0;\n  height: 100%;\n  border-top: $mdlext-carousel-slide-border-top-width solid transparent; // Makes room for the animated select/focus line\n\n  //&:focus,\n  &[aria-selected],\n  &[aria-selected='true'] {\n    figcaption {\n      // As far as I can see there is no way to darken/lighten a text color\n      // defined by MDL, due to the \"unqote\" functions.\n      // So this is a hack\n      color: rgba(0, 0, 0, 1) !important;\n      background-color: rgba(255, 255, 255, 0.25);\n    }\n  }\n\n  &[aria-selected]::after,\n  &[aria-selected='true']::after {\n    height: $mdlext-carousel-slide-border-top-width;\n    width: 100%;\n    display: block;\n    content: ' ';\n    top: (-$mdlext-carousel-slide-border-top-width);\n    left: 0;\n    position: absolute;\n    background: $mdlext-carousel-slide-border-top-color;\n    animation: border-expand 0.2s cubic-bezier(0.4, 0.0, 0.4, 1) 0.01s alternate forwards;\n    transition: all 1s cubic-bezier(0.4, 0.0, 1, 1);\n  }\n\n\n  a {\n    text-decoration: none;\n  }\n\n  figure {\n    box-sizing: border-box;\n    position: relative;\n    height: 100%;\n    margin: 0;\n    padding: 0;\n\n    img {\n      box-sizing: border-box;\n      max-height: 100%;\n    }\n\n    figcaption {\n      box-sizing: border-box;\n      @include typo-caption($colorContrast: false, $usePreferred: true);\n\n      color: $mdlext-carousel-slide-figcaption-color;\n      position: absolute;\n      bottom: 0;\n      left: 0;\n      white-space: nowrap;\n      overflow: hidden;\n      max-width: 100%;\n      width: 100%;\n      text-align: center;\n      text-overflow: ellipsis;\n      padding: 4px 0;\n    }\n    &:hover {\n      figcaption {\n        // As far as I can see there is no way to darken/lighten a text color\n        // defined by MDL, due to the \"unqote\" functions.\n        // So this is a hack\n        color: rgba(0, 0, 0, 1) !important;\n        background-color: rgba(255, 255, 255, 0.25);\n      }\n    }\n  }\n\n  .mdlext-carousel__slide__ripple-container {\n    text-decoration: none;\n    display: block;\n    overflow: hidden;\n    position: absolute;\n    top: 0;\n    left: 0;\n    right: 0;\n    bottom: 0;\n    outline: 0;\n\n    & .mdl-ripple {\n      background: $mdlext-carousel-slide-ripple-color;\n    }\n  }\n}\n\n\n\n\n\n// WEBPACK FOOTER //\n// webpack:///src/carousel/_carousel.scss","/**\n * Copyright 2016 Leif Olsen. All Rights Reserved.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *      http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\n/*\n * Copied/Modified/Inspired from/by:\n *   https://github.com/google/material-design-lite/tree/master/src/textfield\n *   http://red-team-design.com/making-html-dropdowns-not-suck/\n *   http://codepen.io/etcpe9/pen/PqyOye,\n *   http://codepen.io/pudgereyem/pen/PqBxQx\n *   https://github.com/MEYVN-digital/mdl-selectfield\n *   https://github.com/mebibou/mdl-selectfield\n */\n\n// Use of this module requires the user to include variables from material-design-lite\n//@import \"../../node_modules/material-design-lite/src/variables\";\n//@import \"../../node_modules/material-design-lite/src/mixins\";\n\n@import \"../mixins\";\n\n// The container for the selectfield.\n.mdlext-selectfield {\n  box-sizing: border-box;\n  position: relative;\n  font-size: $input-text-font-size;\n  display: inline-block;\n  width: 300px;\n  max-width: 100%;\n  margin: 0;\n  padding: $input-text-vertical-spacing 0;\n\n  // Align buttons, if used.\n  & .mdl-button {\n    bottom: $input-text-vertical-spacing;\n    position: absolute;\n  }\n\n  // Styling the down arrow\n  &::after {\n    @include mdlext-arrow(bottom, $mdlext-selectfield-arrow-width, $mdlext-selectfield-arrow-length);\n\n    position: absolute;\n    right: 0.5em;\n    top: 50%;\n    transform: translateY(-50%);\n    pointer-events: none;\n  }\n}\n\n.mdlext-selectfield.is-disabled {\n  &::after {\n    color: $input-text-disabled-color;\n    @include mdlext-arrow(bottom, $mdlext-selectfield-arrow-width, $mdlext-selectfield-arrow-length, $input-text-disabled-color);\n  }\n}\n\n// Optional class to align right.\n.mdlext-selectfield--align-right {\n  text-align: right;\n}\n\n// Optional class to display at full width.\n.mdlext-selectfield--full-width {\n  width: 100%;\n}\n\n// Optional class to make the select field expandable.\n.mdlext-selectfield--expandable {\n  min-height: $input-text-button-size;\n  min-width: $input-text-button-size;\n  width: auto;\n}\n\n// Styling for the select element.\n.mdlext-selectfield__select {\n\n  // Reset select\n  box-sizing: border-box;\n  border: 0;\n  border-radius: 0;\n  -webkit-appearance: none;\n  -moz-appearance: none;\n  -ms-appearance: none;\n  appearance: none;\n  text-indent: 0.01px; // Removes default arrow from firefox\n  text-overflow: '';   // Removes default arrow from firefox\n  outline: none;\n  box-shadow: none;\n  // End Reset select\n\n  font-size: $input-text-font-size;\n  font-family: $performance_font;\n  padding: $input-text-padding calc(1.2em + #{$input-text-padding}) $input-text-padding 0;\n  width: $input-text-width;\n  border-bottom: 1px solid $input-text-bottom-border-color;\n  display: block;\n  margin: 0;\n  background: none;\n  text-align: left;\n  color: inherit;\n\n  // Mozilla, remove focusring\n  &:-moz-focusring {\n    color: transparent;\n    text-shadow: 0 0 0 #000000;\n  }\n\n  // MS, remove selected option background color\n  &:focus::-ms-value {\n    background-color: inherit;\n    color: inherit;\n  }\n\n  &::-ms-expand {\n    display: none;\n  }\n\n  .mdlext-selectfield.is-focused & {\n    outline: none;\n  }\n\n  .mdlext-selectfield.is-invalid & {\n    border-color: $input-text-error-color;\n    box-shadow: none;\n  }\n\n  fieldset[disabled] .mdlext-selectfield &,\n  .mdlext-selectfield.is-disabled & {\n    border-bottom: 1px dotted $input-text-disabled-color;\n    color: $input-text-disabled-text-color;\n    background-color: transparent;\n  }\n\n  option {\n    color: $text-color-primary;\n    box-sizing: border-box;\n    background-color: inherit;\n  }\n}\n\n// Styling for the label / floating label.\n.mdlext-selectfield__label {\n  box-sizing: border-box;\n  color: $input-text-label-color;\n  font-size: $input-text-font-size;\n  top: ($input-text-padding + $input-text-vertical-spacing);\n  bottom: 0;\n  left: 0;\n  right: 0;\n  pointer-events: none;\n  position: absolute;\n  display: block;\n  width: 100%;\n  overflow: hidden;\n  white-space: nowrap;\n  text-align: left;\n\n  .mdlext-selectfield.is-dirty &,\n  .mdlext-selectfield.has-placeholder & {\n    visibility: hidden;\n  }\n\n  // Floating Label\n  .mdlext-selectfield--floating-label & {\n    @include material-animation-default();\n  }\n\n  .mdlext-selectfield--floating-label.has-placeholder & {\n    transition: none;\n  }\n\n  fieldset[disabled] .mdlext-selectfield &,\n  .mdlext-selectfield.is-disabled.is-disabled & {\n    color: $input-text-disabled-text-color;\n  }\n\n  .mdlext-selectfield--floating-label.is-focused &,\n  .mdlext-selectfield--floating-label.is-dirty.is-dirty &,\n  .mdlext-selectfield--floating-label.has-placeholder & {\n    color: $input-text-highlight-color;\n    font-size: $input-text-floating-label-fontsize;\n    top: $input-text-vertical-spacing - ($input-text-floating-label-fontsize + $input-text-padding);\n    visibility: visible;\n  }\n\n  .mdlext-selectfield--floating-label.is-focused .mdlext-selectfield__expandable-holder &,\n  .mdlext-selectfield--floating-label.is-dirty .mdlext-selectfield__expandable-holder &,\n  .mdlext-selectfield--floating-label.has-placeholder .mdlext-selectfield__expandable-holder & {\n    top: -($input-text-floating-label-fontsize + $input-text-padding);\n  }\n\n  .mdlext-selectfield--floating-label.is-invalid & {\n    color: $input-text-error-color;\n    font-size: $input-text-floating-label-fontsize;\n  }\n\n  // The after label is the colored underline for the Selectfield.\n  &::after {\n    background-color: $input-text-highlight-color;\n    bottom: $input-text-vertical-spacing;\n    content: '';\n    height: 2px;\n    left: 45%;\n    position: absolute;\n    @include material-animation-default();\n\n    visibility: hidden;\n    width: 10px;\n  }\n\n  .mdlext-selectfield.is-focused &::after {\n    left: 0;\n    visibility: visible;\n    width: 100%;\n  }\n\n  .mdlext-selectfield.is-invalid &::after {\n    background-color: $input-text-error-color;\n  }\n}\n\n// SelectField Error.\n.mdlext-selectfield__error {\n  color: $input-text-error-color;\n  font-size: $input-text-floating-label-fontsize;\n  position: absolute;\n  margin-top: 3px;\n  visibility: hidden;\n  display: block;\n\n  .mdlext-selectfield.is-invalid & {\n    visibility: visible;\n  }\n}\n\n// Expandable Holder.\n.mdlext-selectfield__expandable-holder {\n  display: inline-block;\n  position: relative;\n  margin-left: $input-text-button-size;\n\n  @include material-animation-default();\n\n  // Safari (possibly others) need to be convinced that this field is actually\n  // visible, otherwise it cannot be tabbed to nor focused via a <label>.\n  // TODO: In some cases (Retina displays), this is big enough to render the\n  // inner element :(\n  max-width: 0.1px;\n\n  .mdlext-selectfield.is-focused &,\n  .mdlext-selectfield.is-dirty & {\n    // This is an unfortunate hack. Animating between widths in percent (%)\n    // in many browsers (Chrome, Firefox) only animates the inner visual style\n    // of the input - the outer bounding box still 'jumps'.\n    // Thus assume a sensible maximum, and animate to/from that value.\n    max-width: 600px;\n  }\n  .mdlext-selectfield__label::after {\n    bottom: 0;\n  }\n}\n\n\n\n// WEBPACK FOOTER //\n// webpack:///src/selectfield/_selectfield.scss","@charset \"UTF-8\";\n\n/**\n * @license\n * Copyright 2016 Leif Olsen. All Rights Reserved.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *      http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n *\n * This code is built with Google Material Design Lite,\n * which is Licensed under the Apache License, Version 2.0\n */\n\n/* Moved to aria-expanded-toggle.scss\n\n.mdlext-aria-expanded-plus-minus {\n  @include mdlext-aria-expanded-toggle($font-family: inherit);\n}\n\n.mdlext-aria-expanded-more-less {\n  @include mdlext-aria-expanded-toggle($icon: 'expand_more', $icon-expanded: 'expand_less');\n}\n*/\n\n.mdlext-menu-button {\n  box-sizing: border-box;\n  @include typo-menu();\n  text-transform: none;\n  position: relative;\n  height: $button-height;\n  padding: 0 $button-padding;\n  display: flex;\n  align-items: center;\n  align-self: stretch;\n\n  > * {\n    margin: 0;\n    padding: 0 0 0 8px;\n  }\n\n  > *:first-child {\n    padding-left: 0;\n  }\n\n  > *:last-child:not(:only-child):not(.mdlext-menu__item__caption) {\n    margin-left: auto; // If more than one element, push last element to the right\n  }\n\n}\n\n.mdlext-menu-button__caption {\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  line-height: 1.2;\n}\n\n.mdlext-menu,\n.mdlext-menu__item {\n  box-sizing: border-box;\n  margin: 0;\n  padding: 0;\n  list-style: none;\n  display: flex;\n}\n\n.mdlext-menu {\n  position: absolute; //fixed;\n  background: $default-dropdown-bg-color;\n  z-index: 1000;\n  min-width: 124px;\n  border-radius: 2px;\n  @include shadow-3dp();\n  display: inline-flex;\n  flex-direction: column;\n  padding: 0;\n  overflow: hidden;\n  overflow-y: auto;\n\n  &:focus {\n    outline-offset: -1px;\n    outline-width: 1px;\n  }\n\n  &[hidden] {\n    @include mdlext-visually-hidden;\n    pointer-events: none;\n  }\n\n  &__item {\n    @include typo-body-1();\n    color: $default-item-text-color;\n    background-color: $default-dropdown-bg-color;\n    position: relative;\n    padding: 0 16px 0 24px;\n    align-items: center;\n    align-self: stretch;\n    text-decoration: none;\n    cursor: pointer;\n    white-space: nowrap;\n    user-select: none;\n    min-height: 40px;\n    overflow: hidden;\n\n    &[aria-selected='true'] {\n      background-color: $default-item-active-bg-color;\n    }\n\n    // checkmark\n    &[aria-selected='true']::before {\n      content:'\\2713';\n      position: absolute;\n      font-size: 1.4em;\n      left: 4px;\n      top: 50%;\n      transform: translateY(-50%);\n      pointer-events: none;\n    }\n\n    &:hover:not([disabled]) {\n      background-color: $default-item-hover-bg-color;\n    }\n\n    &:focus {\n      outline-offset: -2px;\n      outline-width: 1px;\n      outline-color: $default-item-outline-color;\n      background-color: $default-item-focus-bg-color;\n    }\n\n    &::-moz-focus-inner {\n      border: 0;\n    }\n\n    &[disabled] {\n      color: $disabled-item-text-color;\n      background-color: transparent;\n      cursor: auto;\n      pointer-events: none;\n\n      > * {\n        color: $disabled-item-text-color;\n      }\n    }\n\n    &__caption {\n      white-space: nowrap;\n      overflow: hidden;\n      text-overflow: ellipsis;\n    }\n\n    > * {\n      margin: 0;\n      padding: 0 0 0 8px;\n    }\n\n    > *:first-child {\n      padding-left: 0;\n    }\n\n    > *:last-child:not(:only-child):not(.mdlext-menu__item__caption) {\n      margin-left: auto; // If more than one element, push last element to the right\n    }\n\n  }\n  &__item-separator {\n    margin: 0;\n    padding: 0;\n    border-bottom: 1px solid $default-item-divider-color;\n  }\n\n}\n\n\n\n// WEBPACK FOOTER //\n// webpack:///src/menu-button/_menu-button.scss","/**\n * Copyright 2016 Leif Olsen. All Rights Reserved.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *      http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\n/*\n * The bordered fields are based on / inspired by this CodePen: http://codepen.io/prajwal078/pen/LVJZXz?editors=010\n */\n\n// Use of this module requires the user to include variables from material-design-lite\n//@import \"../../node_modules/material-design-lite/src/variables\";\n//@import \"../../node_modules/material-design-lite/src/mixins\";\n\n@import \"../variables\";\n@import \"../functions\";\n\n\n// \"Theme\" for this styling\n.mdlext-bordered-fields {\n  box-sizing: border-box;\n\n  * {\n    box-sizing: border-box;\n  }\n\n  // Styling for textfield and selectfield.\n  .mdl-textfield,\n  .mdlext-selectfield {\n    padding: 0;\n    margin: $mdlext-bordered-field-vertical-spacing-top 0 $mdlext-bordered-field-vertical-spacing-bottom 0;\n\n    .mdl-textfield__input,\n    .mdlext-selectfield__select {\n      height: $mdlext-bordered-field-height;\n      background-color: $mdlext-bordered-field-background-color;\n      border: $mdlext-bordered-field-border-width solid $mdlext-bordered-field-border-color;\n      border-radius: $mdlext-bordered-field-border-radius;\n      padding: $mdlext-bordered-field-padding-top $mdlext-bordered-field-padding $mdlext-bordered-field-padding-bottom $mdlext-bordered-field-padding;\n      font-size: $mdlext-bordered-field-input-text-font-size;\n      font-weight: $mdlext-bordered-field-font-weight;\n      color: $mdlext-bordered-field-input-text-color;\n\n      &:disabled {\n        color: $mdlext-bordered-field-input-text-disabled-text-color;\n        background-color: $mdlext-bordered-field-disabled-background-color;\n        border-color: $mdlext-bordered-field-disabled-border-color;\n      }\n\n      // MDL can not handle required attribute properly. Planned for MDL-v2\n      //&:required {\n      //  background-color: $mdlext-bordered-field-required-background-color;\n      //  border-color: $mdlext-bordered-field-required-border-color;\n      //}\n\n      &:focus {\n        background-color: $mdlext-bordered-field-focus-background-color;\n        border-color: $mdlext-bordered-field-focus-border-color;\n      }\n\n      // MDL can not handle required. Planned for MDL-v2\n      //&:required:focus {\n      //  background-color: $mdlext-bordered-field-required-focus-background-color;\n      //  border-color: $mdlext-bordered-field-required-focus-border-color;\n      //}\n    }\n    .mdlext-selectfield__select {\n      padding-right: calc(1em + #{$mdlext-bordered-field-padding});  // space for down arrow\n    }\n\n    /*\n    &.is-dirty {\n      .mdl-textfield__input,\n      .mdlext-selectfield__select {\n      }\n    }\n    */\n\n    &.is-invalid {\n      .mdl-textfield__input,\n      .mdlext-selectfield__select {\n        color: $mdlext-bordered-field-input-text-error-color;\n        border-color: $mdlext-bordered-field-error-border-color;\n        background-color: $mdlext-bordered-field-error-background-color;\n\n        &:focus {\n          //&:required:focus {\n          border-color: $mdlext-bordered-field-error-focus-border-color;\n          background-color: $mdlext-bordered-field-error-focus-background-color;\n        }\n      }\n    }\n  }\n\n  .mdlext-selectfield::after {\n    top: auto;\n    bottom: $mdlext-bordered-field-padding-bottom;  // Position of down arrow\n  }\n\n  fieldset[disabled] .mdlext-selectfield::after,\n  .mdlext-selectfield.is-disabled::after {\n    color: $mdlext-bordered-field-input-text-disabled-text-color;\n    @include mdlext-arrow(bottom, $mdlext-selectfield-arrow-width, $mdlext-selectfield-arrow-length, $mdlext-bordered-field-input-text-disabled-text-color);\n  }\n\n\n  fieldset[disabled] .mdl-textfield .mdl-textfield__input,\n  fieldset[disabled] .mdlext-selectfield .mdlext-selectfield__select {\n    color: $mdlext-bordered-field-input-text-disabled-text-color;\n    background-color: $mdlext-bordered-field-disabled-background-color;\n    border-color: $mdlext-bordered-field-disabled-border-color;\n  }\n\n\n  // Styling for the label / floating label.\n  .mdl-textfield,\n  .mdlext-selectfield {\n\n    &.is-dirty,\n    &.has-placeholder {\n      .mdl-textfield__label,\n      .mdlext-selectfield__label {\n        visibility: hidden;\n      }\n    }\n    .mdl-textfield__label,\n    .mdlext-selectfield__label {\n      color: $mdlext-bordered-field-input-text-label-color;\n      font-size: $mdlext-bordered-field-label-font-size;\n      font-weight: $mdlext-bordered-field-font-weight;\n      padding-left: $mdlext-bordered-field-padding;\n      top: auto;\n      bottom: $mdlext-bordered-field-padding-bottom;\n\n      // Hides the colored underline for the textField/selectfield.\n      &::after {\n        background-color: transparent !important;\n        visibility: hidden !important;\n      }\n    }\n    &.mdl-textfield--floating-label.is-focused.is-focused,\n    &.mdl-textfield--floating-label.is-dirty.is-dirty,\n    &.mdl-textfield--floating-label.has-placeholder,\n    &.mdlext-selectfield--floating-label.is-focused.is-focused,\n    &.mdlext-selectfield--floating-label.is-dirty.is-dirty,\n    &.mdlext-selectfield--floating-label.has-placeholder {\n\n      .mdl-textfield__label,\n      .mdlext-selectfield__label {\n        color: $mdlext-bordered-field-input-text-label-focus-color;\n        font-size: $mdlext-bordered-field-floating-label-font-size;\n        font-weight: $mdlext-bordered-field-floating-label-font-weight;\n        top: auto;\n        bottom: $mdlext-bordered-field-floating-label-focus-bottom;\n        visibility: visible;\n      }\n    }\n    &.mdl-textfield--floating-label.is-disabled.is-disabled,\n    &.mdlext-selectfield--floating-label.is-disabled.is-disabled {\n\n      .mdl-textfield__label,\n      .mdlext-selectfield__label {\n        color: $mdlext-bordered-field-input-text-label-disabled-color;\n      }\n    }\n    &.mdl-textfield--floating-label.is-invalid.is-invalid,\n    &.mdlext-selectfield--floating-label.is-invalid.is-invalid {\n\n      .mdl-textfield__label,\n      .mdlext-selectfield__label {\n        color: $mdlext-bordered-field-input-text-label-error-color;\n      }\n    }\n  }\n\n  fieldset[disabled] .mdl-textfield .mdl-textfield__label,\n  fieldset[disabled] .mdl-selectfield .mdl-selectfield__label {\n    color: $mdlext-bordered-field-input-text-label-disabled-color;\n  }\n\n  // Icon(s) and/or button(s) inside textfield\n  .mdl-textfield,\n  .mdlext-selectfield {\n    &.mdlext-bordered-fields__icon-left,\n    &.mdlext-bordered-fields__icon-right {\n      & > i,\n      & > .mdl-button {\n        position: absolute;\n        bottom: $mdlext-bordered-field-padding-bottom - 2px;\n      }\n      & > i {\n        bottom: $mdlext-bordered-field-padding-bottom + 2px;\n      }\n    }\n    &.mdlext-bordered-fields__icon-left {\n      & > i:first-child,\n      & > .mdl-button:first-child {\n        left: $mdlext-bordered-field-padding/2;\n      }\n      & > i ~ .mdl-textfield__input,\n      & > .mdl-button ~ .mdl-textfield__input,\n      & > i ~ .mdlext-selectfield__select,\n      & > .mdl-button ~ .mdlext-selectfield__select {\n        padding-left: $input-text-button-size;\n      }\n      & > i ~ .mdl-textfield__label,\n      & > .mdl-button ~ .mdl-textfield__label {\n        left: $input-text-button-size - $mdlext-bordered-field-padding;\n      }\n      & > i ~ .mdlext-selectfield__label,\n      & > .mdl-button ~ .mdlext-selectfield__label {\n        left: $input-text-button-size - $mdlext-bordered-field-padding;\n      }\n    }\n    &.mdlext-bordered-fields__icon-right {\n      & > .mdl-textfield__input {\n        padding-right: $input-text-button-size;\n      }\n      & > i:last-child,\n      & > .mdl-button:last-child {\n        left: auto;\n        right: $mdlext-bordered-field-padding/2;\n      }\n    }\n    &.is-disabled i,\n    &.is-disabled .mdl-button {\n      color: $mdlext-bordered-field-disabled-border-color;\n      pointer-events: none;\n    }\n  }\n\n  fieldset[disabled] .mdl-textfield,\n  fieldset[disabled] .mdlext-selectfield {\n    i,\n    .mdl-button {\n      color: $mdlext-bordered-field-disabled-border-color;\n      pointer-events: none;\n    }\n  }\n}\n\n\n\n\n// WEBPACK FOOTER //\n// webpack:///src/bordered-fields/_bordered-fields.scss","@charset \"UTF-8\";\n\n/**\n * @license\n * Copyright 2016-2017 Leif Olsen. All Rights Reserved.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *      http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n *\n * This code is built with Google Material Design Lite,\n * which is Licensed under the Apache License, Version 2.0\n */\n\n.mdlext-collapsible {\n  box-sizing: border-box;\n  cursor: pointer;\n}\n\n.mdlext-collapsible-group,\n.mdlext-collapsible-region {\n  box-sizing: border-box;\n\n  &[hidden] {\n    @include mdlext-visually-hidden;\n    pointer-events: none;\n  }\n}\n\n\n\n// WEBPACK FOOTER //\n// webpack:///src/collapsible/_collapsible.scss","@charset \"UTF-8\";\n\n/**\n * @license\n * Copyright 2016 Leif Olsen. All Rights Reserved.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *      http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n *\n * This code is built with Google Material Design Lite,\n * which is Licensed under the Apache License, Version 2.0\n */\n\n.mdlext-aria-toggle-plus-minus {\n  @include mdlext-aria-expanded-toggle($font-family: inherit, $font-size: 1.4em);\n}\n\n.mdlext-aria-toggle-material-icons {\n  @include mdlext-aria-expanded-toggle($font-size: 1.3em, $icon: 'expand_more', $icon-expanded: 'expand_less', $icon-offset: -$mdlext-accordion-header-padding);\n}\n\n.mdlext-accordion {\n  box-sizing: border-box;\n  margin: 0;\n  padding: 0;\n  list-style: none;\n  display: flex;\n\n  * {\n    box-sizing: border-box;\n  }\n\n  &__panel {\n    box-sizing: border-box;\n    position: relative;\n    overflow: hidden;\n    display: flex;\n    flex-wrap: nowrap;\n  }\n\n  &__tab {\n    @include typo-title();\n\n    font-weight: 400;\n    line-height: 1.1;\n    box-sizing: border-box;\n    position: relative;\n    margin: 0;\n    padding: 0; // $mdlext-accordion-header-padding;\n    min-width: $mdlext-accordion-header-height;\n    min-height: $mdlext-accordion-header-height;\n    display: flex;\n    align-items: center;\n    align-self: stretch;\n    user-select: none;\n    color: $mdlext-accordion-header-secondary-color;\n    background-color: $mdlext-accordion-header-background-color;\n    cursor: pointer;\n    overflow: hidden;\n\n    &:focus {\n      outline-offset: -2px;\n      outline-color: $mdlext-accordion-header-focus-outline-color;\n      outline-width: 2px;\n    }\n\n    &[aria-expanded='true'] {\n      background-color: $mdlext-accordion-header-background-open-color;\n    }\n\n    &[aria-selected='true'] {\n      background-color: $mdlext-accordion-header-background-active-color;\n    }\n\n    &[disabled] {\n      background-color: $mdlext-accordion-header-disabled-color;\n      color: $mdlext-accordion-header-secondary-color-disabled;\n      pointer-events: none;\n\n      > * {\n        color: $mdlext-accordion-header-secondary-color-disabled;\n      }\n    }\n\n    &:hover:not([disabled]) {\n      background-color: $mdlext-accordion-header-background-hover-color;\n    }\n\n    > * {\n      margin: 0;\n      padding: 0;\n    }\n\n    &__caption {\n      padding-left: $mdlext-accordion-header-padding;\n      padding-right: $mdlext-accordion-header-padding;\n      white-space: nowrap;\n      overflow: hidden;\n      text-overflow: ellipsis;\n    }\n\n    > *:first-child {\n      padding-left: 0;\n    }\n\n    &--ripple {\n      &[aria-selected='true']::before {\n        content: '';\n        position: absolute;\n        top: 50%;\n        left: 50%;\n        background: $mdlext-accordion-ripple-color;\n        opacity: 0;\n        border-radius: 100%;\n        transform: scale(1, 1) translate(-50%);\n        transform-origin: 50% 50%;\n      }\n      &[aria-selected='true']:focus:not(:active)::before {\n        // http://easings.net/\n        animation: mdlext-accordion-tab-ripple 1s cubic-bezier(0.4, 0.0, 0.4, 1) 0.01s alternate forwards; // cubic-bezier(0.4, 0.0, 1, 1); //cubic-bezier(0.4, 0.0, 0.4, 1) 0.01s alternate forwards; //ease-out;\n      }\n    }\n  }\n\n  &__tabpanel {\n    box-sizing: border-box;\n    margin: 0;\n    padding: 0 $mdlext-accordion-content-padding;\n    color: $mdlext-accordion-content-color;\n    background-color: $mdlext-accordion-content-background-color;\n    display: block;\n    overflow: auto;\n    flex-grow: 1;\n\n    &[hidden] {\n      @include mdlext-visually-hidden;\n    }\n  }\n}\n\n// Vertical layout\n.mdlext-accordion {\n\n  &--vertical {\n    flex-direction: column;\n    flex-wrap: nowrap;\n\n    .mdlext-accordion__panel {\n      min-height: $mdlext-accordion-header-height;\n      flex-direction: column;\n    }\n\n    .mdlext-accordion__tab {\n      height: $mdlext-accordion-header-height;\n      border-top: 1px solid $mdlext-accordion-header-border-color;\n      padding-left: $mdlext-accordion-header-padding;\n      padding-right: $mdlext-accordion-header-padding;\n\n      &[aria-selected='true']::after {\n        position: absolute;\n        bottom: 0;\n        left: 0;\n        height: 1px;\n        width: 100%;\n        display: block;\n        content: \" \";\n        background-color: $mdlext-accordion-header-highlight-color;\n        animation: border-expand 0.2s cubic-bezier(0.4, 0.0, 0.4, 1) 0.01s alternate forwards;\n        transition: all 1s cubic-bezier(0.4, 0.0, 1, 1);\n      }\n\n      > * {\n        padding-left: $mdlext-accordion-header-padding;\n      }\n\n      > *:first-child {\n        padding-left: 0;\n      }\n\n      > *:last-child:not(:only-child):not(.mdlext-accordion__tab__caption) {\n        margin-left: auto; // If more than one element, push last element to the right\n      }\n\n      &--ripple {\n        &[aria-selected='true']::before {\n          width: 5%;\n          height: 10%;\n        }\n      }\n\n    }\n\n    .mdlext-accordion__tabpanel {\n      border-top: 1px solid $mdlext-accordion-header-border-color;\n\n      &--animation {\n        transform: scaleY(1);\n        animation: mdlext-accordion-show-tabpanel-y 0.2s ease-in-out;\n\n        &[hidden] {\n          transform: scaleY(0);\n          animation: mdlext-accordion-hide-tabpanel-y 0.2s ease-out;\n          animation-delay: 0.1s;\n        }\n      }\n    }\n  }\n}\n\n// Horizontal layout\n.mdlext-accordion {\n\n  &--horizontal {\n\n    .mdlext-accordion__panel {\n      min-width: $mdlext-accordion-header-height;\n      width: $mdlext-accordion-header-height;\n    }\n\n    &[aria-multiselectable='true'] .mdlext-accordion__panel.is-expanded {\n      width: 100%;\n    }\n\n    .mdlext-accordion__tab {\n      flex-direction: column-reverse;\n      width: $mdlext-accordion-header-height;\n      white-space: nowrap;\n      border-left: 1px solid $mdlext-accordion-header-border-color;\n\n      &[aria-selected='true']::after {\n        position: absolute;\n        top: 0;\n        right: 0;\n        height: 100%;\n        width: 1px;\n        display: block;\n        content: \" \";\n        background-color: $mdlext-accordion-header-highlight-color;\n\n        // Figure out how to animate a vertical line\n        //animation: border-expand 0.2s cubic-bezier(0.4, 0.0, 0.4, 1) 0.01s alternate forwards;\n        //transition: all 1s cubic-bezier(0.4, 0.0, 1, 1);\n      }\n\n      > * {\n        //transform: rotate(-90deg) translateX(50%);\n        transform: rotate(-90deg) translateX($mdlext-accordion-header-padding);\n      }\n\n      > *:last-child:not(:only-child):not(.mdlext-accordion__tab__caption) {\n        // If more than one element, push last element to top\n        margin-bottom: auto;\n        transform: rotate(-90deg) translateX(0);\n      }\n\n      &__caption {\n        transform: rotate(-90deg) translateX(50%);\n        padding-right: $mdlext-accordion-header-padding + 8px;\n      }\n\n      &--ripple {\n        &[aria-selected='true']::before {\n          width: 10%;\n          height: 5%;\n        }\n      }\n    }\n\n    .mdlext-accordion__tabpanel {\n      border-left: 1px solid $mdlext-accordion-header-border-color;\n\n      &--animation {\n        transform: scaleX(1);\n        animation: mdlext-accordion-show-tabpanel-x 0.2s ease-in-out;\n\n        &[hidden] {\n          transform: scaleX(0);\n          animation: mdlext-accordion-hide-tabpanel-x 0.2s ease-out;\n        }\n      }\n    }\n  }\n}\n\n.mdlext-accordion {\n\n  &__panel:first-child > &__tab {\n    // Use container to set outer borders\n    border-top-color: transparent;\n    border-left-color: transparent;\n  }\n\n  &[aria-multiselectable=\"false\"] {\n    .mdlext-accordion__panel.is-expanded {\n      flex-grow: 1;\n    }\n  }\n}\n\n// Making accordion appear disabled.\n// Note: does not prevent tabbing into a disabled accordion\n.mdlext-accordion[disabled] {\n  * {\n    pointer-events: none;\n  }\n  .mdlext-accordion__tab {\n    background-color: $mdlext-accordion-header-disabled-color;\n    color: $mdlext-accordion-header-secondary-color-disabled;\n\n    > * {\n      color: $mdlext-accordion-header-secondary-color-disabled;\n    }\n  }\n  .mdlext-accordion__tabpanel {\n    opacity: 0.8;\n    filter: blur(1px) grayscale(80%);\n  }\n}\n\n\n@keyframes mdlext-accordion-tab-ripple {\n  0% {\n    transform: scale(0, 0);\n    opacity: 1;\n  }\n  20% {\n    transform: scale(25, 25);\n    opacity: 1;\n  }\n  100% {\n    opacity: 0;\n    transform: scale(40, 40);\n  }\n}\n\n/*\n@keyframes mdlext-accordion-show-tabpanel-y {\n  0% { transform: scaleY(0.1); }\n  40% { transform: scaleY(1.03); }\n  60% { transform: scaleY(0.98); }\n  80% { transform: scaleY(1.03); }\n  100% { transform: scaleY(0.98); }\n  80% { transform: scaleY(1.01); }\n  100% { transform: scaleY(1); }\n}\n*/\n\n@keyframes mdlext-accordion-show-tabpanel-y {\n  0% { transform: scaleY(0); }\n  60% { transform: scaleY(1.01); }\n  80% { transform: scaleY(0.98); }\n  100% { transform: scaleY(1); }\n}\n\n@keyframes mdlext-accordion-hide-tabpanel-y {\n  0% { transform: scaleY(1); }\n  60% { transform: scaleY(0.98); }\n  80% { transform: scaleY(1.01); }\n  100% { transform: scaleY(0); }\n}\n\n/*\n@keyframes mdlext-accordion-show-tabpanel-x {\n  0% { transform: scaleX(0.1); }\n  40% { transform: scaleX(1.03); }\n  60% { transform: scaleX(0.98); }\n  80% { transform: scaleX(1.03); }\n  100% { transform: scaleX(0.98); }\n  80% { transform: scaleX(1.01); }\n  100% { transform: scaleX(1); }\n}\n*/\n\n@keyframes mdlext-accordion-show-tabpanel-x {\n  0% { transform: scaleX(0); }\n  60% { transform: scaleX(1.01); }\n  80% { transform: scaleX(0.98); }\n  100% { transform: scaleX(1); }\n}\n\n@keyframes mdlext-accordion-hide-tabpanel-x {\n  0% { transform: scaleX(1); }\n  60% { transform: scaleX(0.98); }\n  80% { transform: scaleX(1.01); }\n  100% { transform: scaleX(0); }\n}\n\n\n\n// WEBPACK FOOTER //\n// webpack:///src/accordion/_accordion.scss","@import \"color-themes\";\n\n.mdlext-light-color-theme {\n  background-color: $mdlext-light-content-background-color;\n  color: $mdlext-light-text-color-primary;\n\n  a {\n    outline-color: inherit;\n  }\n}\n\n// mdl/src/palette/_palette.scss\n// -----------------------------\n.mdlext-light-color-theme {\n\n  .mdl-color--primary {\n    background-color: $mdlext-light-color-primary !important;\n  }\n\n  .mdl-color--primary-contrast {\n    background-color: $mdlext-light-color-primary-contrast !important;\n  }\n\n  .mdl-color--primary-dark {\n    background-color: $mdlext-light-color-primary-dark !important;\n  }\n\n  .mdl-color--accent {\n    background-color: $mdlext-light-color-accent !important;\n  }\n\n  .mdl-color--accent-contrast {\n    background-color: $mdlext-light-color-accent-contrast !important;\n  }\n\n  .mdl-color-text--primary {\n    color: $mdlext-light-color-primary !important;\n  }\n\n  .mdl-color-text--primary-contrast {\n    color: $mdlext-light-color-primary-contrast !important;\n  }\n\n  .mdl-color-text--primary-dark {\n    color: $mdlext-light-color-primary-dark !important;\n  }\n\n  .mdl-color-text--accent {\n    color: $mdlext-light-color-accent !important;\n  }\n\n  .mdl-color-text--accent-contrast {\n    color: $mdlext-light-color-accent-contrast !important;\n  }\n\n}\n\n// mdl/src/typography/_typography.scss\n// -----------------------------------\n.mdlext-light-color-theme {\n  a {\n    color: $mdlext-light-text-link-color;\n  }\n}\n\n\n// mdl/src/badge/_badge.scss\n// ---------------------------\n.mdlext-light-color-theme {\n  .mdl-badge {\n\n    &[data-badge]::after {\n      background: $mdlext-light-badge-background;\n      color: $mdlext-light-badge-color;\n    }\n\n    &.mdl-badge--no-background {\n      &[data-badge]::after {\n        color: $mdlext-light-badge-color-inverse;\n        background: $mdlext-light-badge-background-inverse;\n      }\n    }\n  }\n}\n\n\n// mdl/src/button/_button.scss\n// ---------------------------\n.mdlext-light-color-theme {\n\n  .mdl-button {\n    background: transparent;\n    color: $mdlext-light-button-secondary-color;\n\n    &:hover {\n      background-color: $mdlext-light-button-hover-color;\n    }\n\n    &:focus:not(:active) {\n      background-color: $mdlext-light-button-focus-color;\n    }\n\n    &:active {\n      background-color: $mdlext-light-button-active-color;\n    }\n\n    &.mdl-button--colored {\n      color: $mdlext-light-button-primary-color-alt;\n\n      &:focus:not(:active) {\n        background-color: $mdlext-light-button-focus-color-alt;\n      }\n    }\n  }\n\n  // Raised buttons\n  .mdl-button--raised {\n    background: $mdlext-light-button-primary-color;\n\n    &:active {\n      background-color: $mdlext-light-button-active-color;\n    }\n\n    &:focus:not(:active) {\n      background-color: $mdlext-light-button-active-color;\n    }\n\n    &.mdl-button--colored {\n      background: $mdlext-light-button-primary-color-alt;\n      color: $mdlext-light-button-secondary-color-alt;\n\n      &:hover {\n        background-color: $mdlext-light-button-hover-color-alt;\n      }\n\n      &:active {\n        background-color: $mdlext-light-button-active-color-alt;\n      }\n\n      &:focus:not(:active) {\n        background-color: $mdlext-light-button-active-color-alt;\n      }\n\n      & .mdl-ripple {\n        background: $mdlext-light-button-ripple-color-alt;\n      }\n    }\n  }\n\n\n  // FABs\n  .mdl-button--fab {\n    background: $mdlext-light-button-primary-color;\n\n    &:active {\n      background-color: $mdlext-light-button-active-color;\n    }\n\n    &:focus:not(:active) {\n      background-color: $mdlext-light-button-active-color;\n    }\n\n    &.mdl-button--colored {\n      background: $mdlext-light-button-fab-color-alt;\n      color: $mdlext-light-button-fab-text-color-alt;\n\n      &:hover {\n        background-color: $mdlext-light-button-fab-hover-color-alt;\n      }\n\n      &:focus:not(:active) {\n        background-color: $mdlext-light-button-fab-active-color-alt;\n      }\n\n      &:active {\n        background-color: $mdlext-light-button-fab-active-color-alt;\n      }\n\n      & .mdl-ripple {\n        background: $mdlext-light-button-fab-ripple-color-alt;\n      }\n    }\n  }\n\n\n  // Icon buttons\n  .mdl-button--icon {\n    color: inherit;\n  }\n\n  // Colorized buttons\n\n  .mdl-button--primary.mdl-button--primary {\n    color: $mdlext-light-button-primary-color-alt;\n\n    & .mdl-ripple {\n      background: $mdlext-light-button-secondary-color-alt;\n    }\n    &.mdl-button--raised,\n    &.mdl-button--fab {\n      color: $mdlext-light-button-secondary-color-alt;\n      background-color: $mdlext-light-button-primary-color-alt;\n    }\n  }\n\n  .mdl-button--accent.mdl-button--accent {\n    color: $mdlext-light-button-fab-color-alt;\n\n    & .mdl-ripple {\n      background: $mdlext-light-button-fab-text-color-alt;\n    }\n    &.mdl-button--raised,\n    &.mdl-button--fab {\n      color: $mdlext-light-button-fab-text-color-alt;\n      background-color: $mdlext-light-button-fab-color-alt;\n    }\n  }\n\n  // Disabled buttons\n\n  .mdl-button {\n    // Bump up specificity by using [disabled] twice.\n    &[disabled][disabled],\n    &.mdl-button--disabled.mdl-button--disabled {\n      color: $mdlext-light-button-secondary-color-disabled;\n      background-color: transparent;\n    }\n\n    &--fab {\n      // Bump up specificity by using [disabled] twice.\n      &[disabled][disabled],\n      &.mdl-button--disabled.mdl-button--disabled {\n        background-color: $mdlext-light-button-primary-color-disabled;\n        color: $mdlext-light-button-secondary-color-disabled;\n      }\n    }\n\n    &--raised {\n      // Bump up specificity by using [disabled] twice.\n      &[disabled][disabled],\n      &.mdl-button--disabled.mdl-button--disabled {\n        background-color: $mdlext-light-button-primary-color-disabled;\n        color: $mdlext-light-button-secondary-color-disabled;\n      }\n    }\n    &--colored {\n      // Bump up specificity by using [disabled] twice.\n      &[disabled][disabled],\n      &.mdl-button--disabled.mdl-button--disabled {\n        color: $mdlext-light-button-secondary-color-disabled;\n      }\n    }\n  }\n}\n\n// mdl/src/slider/_slider.scss\n// ---------------------------\n.mdlext-light-color-theme {\n  .mdl-slider {\n\n    &.is-upgraded {\n      background: transparent;\n      color: $mdlext-light-range-color;\n\n      &::-webkit-slider-runnable-track {\n        background: transparent;\n      }\n\n      &::-moz-range-track {\n        background: transparent;\n      }\n\n      &::-ms-track {\n        background: none;\n        color: transparent;\n      }\n\n      /* stylelint-disable */\n      &::-ms-fill-lower {\n        background: linear-gradient(to right,\n          transparent,\n          transparent 16px,\n          $mdlext-light-range-color 16px,\n          $mdlext-light-range-color 0);\n      }\n\n      &::-ms-fill-upper {\n        background: linear-gradient(to left,\n          transparent,\n          transparent 16px,\n          $mdlext-light-range-bg-color 16px,\n          $mdlext-light-range-bg-color 0);\n      }\n      /* stylelint-enable */\n\n\n      /**************************** Thumbs ****************************/\n      &::-webkit-slider-thumb {\n        background: $mdlext-light-range-color;\n      }\n\n      &::-moz-range-thumb {\n        background: $mdlext-light-range-color;\n      }\n\n      &:focus:not(:active)::-webkit-slider-thumb {\n        box-shadow: 0 0 0 10px $mdlext-light-range-faded-color;\n      }\n\n      &:focus:not(:active)::-moz-range-thumb {\n        box-shadow: 0 0 0 10px $mdlext-light-range-faded-color;\n      }\n\n      &:active::-webkit-slider-thumb {\n        background: $mdlext-light-range-color;\n      }\n\n      &:active::-moz-range-thumb {\n        background: $mdlext-light-range-color;\n      }\n\n      &::-ms-thumb {\n        background: $mdlext-light-range-color;\n      }\n\n      /* stylelint-disable */\n      &:focus:not(:active)::-ms-thumb {\n        background: radial-gradient(circle closest-side,\n          $mdlext-light-range-color 0%,\n          $mdlext-light-range-color 37.5%,\n          $mdlext-light-range-faded-color 37.5%,\n          $mdlext-light-range-faded-color 100%);\n      }\n      /* stylelint-enable */\n\n      &:active::-ms-thumb {\n        background: $mdlext-light-range-color;\n      }\n\n\n      /**************************** 0-value ****************************/\n\n      &.is-lowest-value::-webkit-slider-thumb {\n        border-color: $mdlext-light-range-color;\n        background: transparent;\n      }\n\n      &.is-lowest-value::-moz-range-thumb {\n        border-color: $mdlext-light-range-bg-color;\n        background: transparent;\n      }\n\n      &.is-lowest-value:focus:not(:active)::-webkit-slider-thumb {\n        box-shadow: 0 0 0 10px $mdlext-light-range-bg-focus-color;\n        background: $mdlext-light-range-bg-focus-color;\n      }\n\n      &.is-lowest-value:focus:not(:active)::-moz-range-thumb {\n        box-shadow: 0 0 0 10px $mdlext-light-range-bg-focus-color;\n        background: $mdlext-light-range-bg-focus-color;\n      }\n\n      &.is-lowest-value:active::-webkit-slider-thumb {\n        border-color: $mdlext-light-range-bg-color;\n      }\n\n      &.is-lowest-value:active::-moz-range-thumb {\n        border-color: $mdlext-light-range-bg-color;\n      }\n\n      /* stylelint-disable */\n      &.is-lowest-value::-ms-thumb {\n        background: radial-gradient(circle closest-side,\n          transparent 0%,\n          transparent 66.67%,\n          $mdlext-light-range-bg-color 66.67%,\n          $mdlext-light-range-bg-color 100%);\n      }\n\n      &.is-lowest-value:focus:not(:active)::-ms-thumb {\n        background: radial-gradient(circle closest-side,\n          $mdlext-light-range-bg-focus-color 0%,\n          $mdlext-light-range-bg-focus-color 25%,\n          $mdlext-light-range-bg-color 25%,\n          $mdlext-light-range-bg-color 37.5%,\n          $mdlext-light-range-bg-focus-color 37.5%,\n          $mdlext-light-range-bg-focus-color 100%);\n      }\n\n      &.is-lowest-value:active::-ms-thumb {\n        background: radial-gradient(circle closest-side,\n          transparent 0%,\n          transparent 77.78%,\n          $mdlext-light-range-bg-color 77.78%,\n          $mdlext-light-range-bg-color 100%);\n      }\n      /* stylelint-enable */\n\n      &.is-lowest-value::-ms-fill-lower {\n        background: transparent;\n      }\n\n      /**************************** Disabled ****************************/\n\n      &:disabled:focus::-webkit-slider-thumb,\n      &:disabled:active::-webkit-slider-thumb,\n      &:disabled::-webkit-slider-thumb {\n        background: $mdlext-light-range-bg-color;\n      }\n\n      &:disabled:focus::-moz-range-thumb,\n      &:disabled:active::-moz-range-thumb,\n      &:disabled::-moz-range-thumb {\n        background: $mdlext-light-range-bg-color;\n      }\n\n      &:disabled + .mdl-slider__background-flex > .mdl-slider__background-lower {\n        background-color: $mdlext-light-range-bg-color;\n      }\n\n      &.is-lowest-value:disabled:focus::-webkit-slider-thumb,\n      &.is-lowest-value:disabled:active::-webkit-slider-thumb,\n      &.is-lowest-value:disabled::-webkit-slider-thumb {\n        border-color: $mdlext-light-range-bg-color;\n        background: transparent;\n      }\n\n      &.is-lowest-value:disabled:focus::-moz-range-thumb,\n      &.is-lowest-value:disabled:active::-moz-range-thumb,\n      &.is-lowest-value:disabled::-moz-range-thumb {\n        border-color: $mdlext-light-range-bg-color;\n        background: transparent;\n      }\n\n      &:disabled:focus::-ms-thumb,\n      &:disabled:active::-ms-thumb,\n      &:disabled::-ms-thumb {\n        background: $mdlext-light-range-bg-color;\n      }\n\n      /* stylelint-disable */\n      &.is-lowest-value:disabled:focus::-ms-thumb,\n      &.is-lowest-value:disabled:active::-ms-thumb,\n      &.is-lowest-value:disabled::-ms-thumb {\n        background: radial-gradient(circle closest-side,\n          transparent 0%,\n          transparent 50%,\n          $mdlext-light-range-bg-color 50%,\n          $mdlext-light-range-bg-color 100%);\n      }\n\n      &:disabled::-ms-fill-lower {\n        background: linear-gradient(to right,\n          transparent,\n          transparent 25px,\n          $mdlext-light-range-bg-color 25px,\n          $mdlext-light-range-bg-color 0);\n      }\n      /* stylelint-enable */\n\n    }\n  }\n\n  .mdl-slider__background-flex {\n    background: transparent;\n  }\n\n  .mdl-slider__background-lower {\n    background: $mdlext-light-range-color;\n  }\n\n  // This one styles the upper part of the slider track.\n  .mdl-slider__background-upper {\n    background: $mdlext-light-range-bg-color;\n  }\n}\n\n\n// mdl/src/textfield/_textfield.scss\n// -----------------------------------\n.mdlext-light-color-theme {\n\n  .mdl-textfield__input {\n    border-bottom-color: $mdlext-light-input-text-bottom-border-color;\n  }\n  .mdl-textfield.is-invalid .mdl-textfield__input {\n    border-color: $mdlext-light-input-text-error-color;\n  }\n  fieldset[disabled] .mdl-textfield .mdl-textfield__input,\n  .mdl-textfield.is-disabled .mdl-textfield__input {\n    background-color: transparent;\n    border-bottom-color: $mdlext-light-input-text-disabled-color;\n    color: $mdlext-light-input-text-disabled-text-color;\n  }\n  .mdl-textfield__label {\n    color: $mdlext-light-input-text-label-color;\n  }\n  .mdl-textfield__label::after {\n    background-color: $mdlext-light-input-text-highlight-color;\n  }\n  fieldset[disabled] .mdl-textfield .mdl-textfield__label,\n  .mdl-textfield.is-disabled.is-disabled .mdl-textfield__label {\n    color: $mdlext-light-input-text-disabled-text-color;\n  }\n  .mdl-textfield--floating-label.is-focused .mdl-textfield__label,\n  .mdl-textfield--floating-label.is-dirty .mdl-textfield__label,\n  .mdl-textfield--floating-label.has-placeholder .mdl-textfield__label {\n    color: $mdlext-light-input-text-highlight-color;\n  }\n  .mdl-textfield--floating-label.is-invalid .mdl-textfield__label {\n    color: $mdlext-light-input-text-error-color;\n  }\n  .mdl-textfield.is-invalid .mdl-textfield__label::after {\n    background-color: $mdlext-light-input-text-error-color;\n  }\n  .mdl-textfield__error {\n    color: $mdlext-light-input-text-error-color;\n  }\n}\n\n\n// mdl/src/checkbox/_checkbox.scss\n// -----------------------------------\n.mdlext-light-color-theme {\n\n  .mdl-checkbox__box-outline {\n    border-color: $mdlext-light-checkbox-off-color;\n  }\n  .mdl-checkbox.is-checked .mdl-checkbox__box-outline {\n    border-color: $mdlext-light-checkbox-color;\n  }\n  fieldset[disabled] .mdl-checkbox .mdl-checkbox__box-outline,\n  .mdl-checkbox.is-disabled .mdl-checkbox__box-outline {\n    border-color: $mdlext-light-checkbox-disabled-color;\n  }\n\n  .mdl-checkbox__focus-helper {\n    background-color: transparent;\n  }\n  .mdl-checkbox.is-focused.is-checked .mdl-checkbox__focus-helper {\n    box-shadow: 0 0 0 ($checkbox-button-size / 2) $mdlext-light-checkbox-focus-color;\n    background-color: $mdlext-light-checkbox-focus-color;\n  }\n\n  .mdl-checkbox__tick-outline {\n    background: transparent;\n  }\n  .mdl-checkbox.is-checked .mdl-checkbox__tick-outline {\n    background-color: $mdlext-light-checkbox-color;\n  }\n  fieldset[disabled] .mdl-checkbox.is-checked .mdl-checkbox__tick-outline,\n  .mdl-checkbox.is-checked.is-disabled .mdl-checkbox__tick-outline {\n    background-color: $mdlext-light-checkbox-disabled-color;\n  }\n\n  fieldset[disabled] .mdl-checkbox .mdl-checkbox__label,\n  .mdl-checkbox.is-disabled .mdl-checkbox__label {\n    color: $mdlext-light-checkbox-disabled-color;\n  }\n\n  .mdl-checkbox__ripple-container .mdl-ripple {\n    background: $mdlext-light-checkbox-color;\n  }\n  fieldset[disabled] .mdl-checkbox .mdl-checkbox__ripple-container .mdl-ripple,\n  .mdl-checkbox.is-disabled .mdl-checkbox__ripple-container .mdl-ripple {\n    background: transparent;\n  }\n\n}\n\n// mdl/src/radio/_radio.scss\n// -----------------------------------\n.mdlext-light-color-theme {\n  .mdl-radio__outer-circle {\n    border-color: $mdlext-light-radio-off-color;\n  }\n  .mdl-radio.is-checked .mdl-radio__outer-circle {\n    border-color: $mdlext-light-radio-color;\n  }\n  .mdl-radio__outer-circle fieldset[disabled] .mdl-radio,\n  .mdl-radio.is-disabled .mdl-radio__outer-circle {\n    border-color: $mdlext-light-radio-disabled-color;\n  }\n\n  .mdl-radio__inner-circle {\n    background: $mdlext-light-radio-color;\n  }\n  fieldset[disabled] .mdl-radio .mdl-radio__inner-circle,\n  .mdl-radio.is-disabled .mdl-radio__inner-circle {\n    background: $mdlext-light-radio-disabled-color;\n  }\n\n  fieldset[disabled] .mdl-radio .mdl-radio__label,\n  .mdl-radio.is-disabled .mdl-radio__label {\n    color: $mdlext-light-radio-disabled-color;\n  }\n\n  .mdl-radio__ripple-container .mdl-ripple {\n    background: $mdlext-light-radio-color;\n  }\n  fieldset[disabled] .mdl-radio .mdl-radio__ripple-container .mdl-ripple,\n  .mdl-radio.is-disabled .mdl-radio__ripple-container .mdl-ripple {\n    background: transparent;\n  }\n}\n\n// mdl/src/icon-togglr/_icon-toggle.scss\n// ---------------------------------------\n.mdlext-light-color-theme {\n  .mdl-icon-toggle__label {\n    color: $mdlext-light-icon-toggle-color;\n  }\n  .mdl-icon-toggle.is-checked .mdl-icon-toggle__label {\n    color: $mdlext-light-icon-toggle-checked-color;\n  }\n  .mdl-icon-toggle.is-disabled .mdl-icon-toggle__label {\n    color: $mdlext-light-icon-toggle-disabled-color;\n  }\n  .mdl-icon-toggle.is-focused .mdl-icon-toggle__label {\n    background-color: $mdlext-light-icon-toggle-focus-color;\n  }\n  .mdl-icon-toggle.is-focused.is-checked .mdl-icon-toggle__label {\n    background-color: $mdlext-light-icon-toggle-checked-focus-color;\n  }\n  .mdl-icon-toggle__ripple-container .mdl-ripple {\n    background: $mdlext-light-icon-toggle-color;\n  }\n  .mdl-icon-toggle.is-disabled .mdl-icon-toggle__ripple-container .mdl-ripple {\n    background: transparent;\n  }\n}\n\n\n// mdl/src/switch/_switch.scss\n// -----------------------------------\n.mdlext-light-color-theme {\n\n  .mdl-switch__track {\n    background: $mdlext-light-switch-off-track-color;\n  }\n  .mdl-switch.is-checked .mdl-switch__track {\n    background: $mdlext-light-switch-track-color;\n  }\n  .mdl-switch__track fieldset[disabled] .mdl-switch,\n  .mdl-switch.is-disabled .mdl-switch__track {\n    background: $mdlext-light-switch-disabled-track-color;\n  }\n\n  .mdl-switch__thumb {\n    background: $mdlext-light-switch-off-thumb-color;\n  }\n  .mdl-switch.is-checked .mdl-switch__thumb {\n    background: $mdlext-light-switch-thumb-color;\n  }\n  .mdl-switch__thumb fieldset[disabled] .mdl-switch,\n  .mdl-switch.is-disabled .mdl-switch__thumb {\n    background: $mdlext-light-switch-disabled-thumb-color;\n  }\n\n  .mdl-switch__focus-helper {\n    background-color: transparent;\n  }\n  .mdl-switch.is-focused .mdl-switch__focus-helper {\n    background-color: rgba(0, 0, 0, 0.1);\n  }\n  .mdl-switch.is-focused.is-checked .mdl-switch__focus-helper {\n    box-shadow: 0 0 0 (($switch-ripple-size - $switch-helper-size) / 2) $mdlext-light-switch-faded-color;\n    background-color: $mdlext-light-switch-faded-color;\n  }\n\n  .mdl-switch__label fieldset[disabled] .mdl-switch,\n  .mdl-switch.is-disabled .mdl-switch__label {\n    color: $mdlext-light-switch-disabled-thumb-color;\n  }\n\n  .mdl-switch__ripple-container .mdl-ripple {\n    background: $mdlext-light-switch-color;\n  }\n  fieldset[disabled] .mdl-switch .mdl-switch__ripple-container .mdl-ripple,\n  .mdl-switch.is-disabled .mdl-switch__ripple-container .mdl-ripple {\n    background: transparent;\n  }\n}\n\n\n// mdl/src/data-table/_data-table.scss\n// -----------------------------------\n.mdlext-light-color-theme {\n\n  .mdl-data-table {\n    border-color: $mdlext-light-data-table-divider-color;\n    background-color: $mdlext-light-data-table-background-color;\n\n    tbody {\n      tr {\n        &.is-selected {\n          background-color: $mdlext-light-data-table-selection-color;\n        }\n        &:hover {\n          background-color: $mdlext-light-data-table-hover-color;\n        }\n      }\n    }\n    th {\n      color: $data-table-header-color;\n\n      &.mdl-data-table__header--sorted-ascending,\n      &.mdl-data-table__header--sorted-descending {\n        color: $mdlext-light-data-table-header-sorted-color;\n\n        &:hover {\n          &::before {\n            color: $mdlext-light-data-table-header-sorted-icon-hover-color;\n          }\n        }\n      }\n    }\n  }\n}\n\n\n// mdl/src/menu/_menu.scss\n// -----------------------------------\n.mdlext-light-color-theme {\n\n  .mdl-menu__outline {\n    background: $mdlext-light-default-dropdown-bg-color;\n  }\n\n  .mdl-menu__item {\n    color: $mdlext-light-default-item-text-color;\n    background-color: transparent;\n    outline-color: $mdlext-light-default-item-outline-color;\n\n    &--full-bleed-divider {\n      border-bottom-color: $mdlext-light-default-item-divider-color;\n    }\n\n    &[disabled],\n    &[data-mdl-disabled] {\n      color: $mdlext-light-disabled-item-text-color;\n      background-color: transparent;\n\n      &:hover {\n        background-color: transparent;\n      }\n\n      &:focus {\n        background-color: transparent;\n      }\n\n      & .mdl-ripple {\n        background: transparent;\n      }\n    }\n\n    &:hover {\n      background-color: $mdlext-light-default-item-hover-bg-color;\n    }\n\n    &:focus {\n      background-color: $mdlext-light-default-item-focus-bg-color;\n    }\n\n    &:active {\n      background-color: $mdlext-light-default-item-active-bg-color;\n    }\n  }\n}\n\n\n// mdl/src/card/_card.scss\n// ----------------------------------------\n.mdlext-light-color-theme {\n\n  .mdl-card {\n    background: $mdlext-light-card-background-color;\n  }\n\n  .mdl-card__media {\n    background-color: $mdlext-light-card-image-placeholder-color;\n  }\n\n  .mdl-card__title {\n    color: $mdlext-light-card-text-color;\n\n    &.mdl-card--border {\n      border-bottom-color: $mdlext-light-card-border-color;\n    }\n  }\n\n  .mdl-card__title-text {\n    color: inherit;\n  }\n\n  .mdl-card__subtitle-text {\n    color: $mdlext-light-card-subtitle-color;\n  }\n\n  .mdl-card__supporting-text {\n    color: $mdlext-light-card-supporting-text-text-color;\n  }\n\n  .mdl-card__actions {\n    background-color: rgba(0, 0, 0, 0);\n\n    &.mdl-card--border {\n      border-top-color: $mdlext-light-card-border-color;\n    }\n  }\n}\n\n\n// mdlext/src/selectfield/_selectfield.scss\n// ----------------------------------------\n.mdlext-light-color-theme {\n\n  .mdlext-selectfield.is-disabled::after {\n    color: $mdlext-light-input-text-disabled-color;\n    @include mdlext-arrow(bottom, $mdlext-selectfield-arrow-width, $mdlext-selectfield-arrow-length, $mdlext-light-input-text-disabled-color);\n  }\n\n  .mdlext-selectfield__select {\n    border-bottom-color: $mdlext-light-input-text-bottom-border-color;\n    color: inherit;\n\n    option {\n      background-color: $mdlext-light-content-background-color;\n      color: $mdlext-light-text-color-primary;\n    }\n  }\n  .mdlext-selectfield.is-invalid .mdlext-selectfield__select {\n    border-color: $mdlext-light-input-text-error-color;\n  }\n  fieldset[disabled] .mdlext-selectfield .mdlext-selectfield__select,\n  .mdlext-selectfield.is-disabled .mdlext-selectfield__select {\n    background-color: transparent;\n    border-bottom-color: $mdlext-light-input-text-disabled-color;\n    color: $mdlext-light-input-text-disabled-text-color;\n  }\n\n  .mdlext-selectfield__label {\n    color: $mdlext-light-input-text-label-color;\n  }\n  fieldset[disabled] .mdlext-selectfield .mdlext-selectfield__label,\n  .mdlext-selectfield.is-disabled.is-disabled .mdlext-selectfield__label {\n    color: $mdlext-light-input-text-disabled-text-color;\n  }\n  .mdlext-selectfield--floating-label.is-focused .mdlext-selectfield__label,\n  .mdlext-selectfield--floating-label.is-dirty .mdlext-selectfield__label,\n  .mdlext-selectfield--floating-label.is-dirty.is-dirty .mdlext-selectfield__label,\n  .mdlext-selectfield--floating-label.has-placeholder .mdlext-selectfield__label {\n    color: $mdlext-light-input-text-highlight-color;\n  }\n  .mdlext-selectfield--floating-label.is-invalid .mdlext-selectfield__label {\n    color: $mdlext-light-input-text-error-color;\n  }\n  .mdlext-selectfield__label::after {\n    background-color: $mdlext-light-input-text-highlight-color;\n  }\n  .mdlext-selectfield.is-invalid .mdlext-selectfield__label::after {\n    background-color: $mdlext-light-input-text-error-color;\n  }\n\n  .mdlext-selectfield__error {\n    color: $mdlext-light-input-text-error-color;\n  }\n}\n\n// mdlext/src/menu-button/_menu-button.scss\n// ----------------------------------------\n.mdlext-menu.mdlext-light-color-theme {\n  background: $mdlext-light-default-dropdown-bg-color;\n}\n\n.mdlext-light-color-theme {\n\n  .mdlext-menu {\n    background: $mdlext-light-default-dropdown-bg-color;\n\n    &__item {\n      color: $mdlext-light-default-item-text-color;\n      background-color: $mdlext-light-default-dropdown-bg-color;\n\n      &:active,\n      &[aria-selected='true'] {\n        background-color: $mdlext-light-default-item-active-bg-color;\n      }\n      &:hover:not([disabled]) {\n        background-color: $mdlext-light-default-item-hover-bg-color;\n      }\n      &:focus {\n        outline-color: $mdlext-light-default-item-outline-color;\n        background-color: $mdlext-light-default-item-focus-bg-color;\n      }\n      &[disabled] {\n        color: $mdlext-light-disabled-item-text-color;\n\n        > * {\n          color: $mdlext-light-disabled-item-text-color;\n        }\n      }\n    }\n    &__item-separator {\n      border-bottom: 1px solid $mdlext-light-default-item-divider-color;\n    }\n  }\n}\n\n\n// mdlext/src/bordered-fields/_bordered-fields.scss\n// -------------------------------------------------\n.mdlext-light-color-theme {\n\n  .mdlext-bordered-fields {\n\n    .mdl-textfield,\n    .mdlext-selectfield {\n\n      .mdl-textfield__input,\n      .mdlext-selectfield__select {\n        background-color: $mdlext-light-bordered-field-background-color;\n        border-color: $mdlext-light-bordered-field-border-color;\n        color: $mdlext-light-bordered-field-input-text-color;\n\n        &:disabled {\n          color: $mdlext-light-bordered-field-input-text-disabled-text-color;\n          background-color: $mdlext-light-bordered-field-disabled-background-color;\n          border-color: $mdlext-light-bordered-field-disabled-border-color;\n        }\n        &:focus {\n          background-color: $mdlext-light-bordered-field-focus-background-color;\n          border-color: $mdlext-light-bordered-field-focus-border-color;\n        }\n      }\n      &.is-invalid {\n        .mdl-textfield__input,\n        .mdlext-selectfield__select {\n          color: $mdlext-light-bordered-field-input-text-error-color;\n          border-color: $mdlext-light-bordered-field-error-border-color;\n          background-color: $mdlext-light-bordered-field-error-background-color;\n\n          &:focus {\n            border-color: $mdlext-light-bordered-field-error-focus-border-color;\n            background-color: $mdlext-light-bordered-field-error-focus-background-color;\n          }\n        }\n      }\n    }\n\n    fieldset[disabled] .mdlext-selectfield::after,\n    .mdlext-selectfield.is-disabled::after {\n      color: $mdlext-light-bordered-field-input-text-disabled-text-color;\n      @include mdlext-arrow(bottom, $mdlext-selectfield-arrow-width, $mdlext-selectfield-arrow-length, $mdlext-light-bordered-field-input-text-disabled-text-color);\n    }\n\n    fieldset[disabled] .mdl-textfield .mdl-textfield__input,\n    fieldset[disabled] .mdlext-selectfield .mdlext-selectfield__select {\n      color: $mdlext-light-bordered-field-input-text-disabled-text-color;\n      background-color: $mdlext-light-bordered-field-disabled-background-color;\n      border-color: $mdlext-light-bordered-field-disabled-border-color;\n    }\n\n    .mdl-textfield,\n    .mdlext-selectfield {\n\n      .mdl-textfield__label,\n      .mdlext-selectfield__label {\n        color: $mdlext-light-bordered-field-input-text-label-color;\n      }\n      &.mdl-textfield--floating-label.is-focused.is-focused,\n      &.mdl-textfield--floating-label.is-dirty.is-dirty,\n      &.mdl-textfield--floating-label.has-placeholder,\n      &.mdlext-selectfield--floating-label.is-focused.is-focused,\n      &.mdlext-selectfield--floating-label.is-dirty.is-dirty,\n      &.mdlext-selectfield--floating-label.has-placeholder {\n\n        .mdl-textfield__label,\n        .mdlext-selectfield__label {\n          color: $mdlext-light-bordered-field-input-text-label-focus-color;\n        }\n      }\n      &.mdl-textfield--floating-label.is-disabled.is-disabled,\n      &.mdlext-selectfield--floating-label.is-disabled.is-disabled {\n\n        .mdl-textfield__label,\n        .mdlext-selectfield__label {\n          color: $mdlext-light-bordered-field-input-text-label-disabled-color;\n        }\n      }\n      &.mdl-textfield--floating-label.is-invalid.is-invalid,\n      &.mdlext-selectfield--floating-label.is-invalid.is-invalid {\n\n        .mdl-textfield__label,\n        .mdlext-selectfield__label {\n          color: $mdlext-light-bordered-field-input-text-label-error-color;\n        }\n      }\n    }\n\n    fieldset[disabled] .mdl-textfield .mdl-textfield__label,\n    fieldset[disabled] .mdl-selectfield .mdl-selectfield__label {\n      color: $mdlext-light-bordered-field-input-text-label-disabled-color;\n    }\n\n    // Icon(s) and/or button(s) inside textfield\n    .mdl-textfield,\n    .mdlext-selectfield {\n      &.is-disabled i,\n      &.is-disabled .mdl-button {\n        color: $mdlext-light-bordered-field-disabled-border-color;\n      }\n    }\n    fieldset[disabled] .mdl-textfield,\n    fieldset[disabled] .mdlext-selectfield {\n      i,\n      .mdl-button {\n        color: $mdlext-light-bordered-field-disabled-border-color;\n      }\n    }\n  }\n}\n\n\n// mdlext/src/accordion/_accordion.scss\n// ----------------------------------------\n.mdlext-light-color-theme {\n\n  .mdlext-accordion {\n\n    &__tab {\n      color: $mdlext-light-accordion-header-secondary-color;\n      background-color: $mdlext-light-accordion-header-background-color;\n\n      &:focus {\n        outline-color: $mdlext-light-accordion-header-focus-outline-color;\n      }\n      &[aria-expanded='true'] {\n        background-color: $mdlext-light-accordion-header-background-open-color;\n      }\n      &[aria-selected='true'] {\n        background-color: $mdlext-light-accordion-header-background-active-color;\n      }\n      &[disabled] {\n        background-color: $mdlext-light-accordion-header-disabled-color;\n        color: $mdlext-light-accordion-header-secondary-color-disabled;\n        pointer-events: none;\n\n        > * {\n          color: $mdlext-light-accordion-header-secondary-color-disabled;\n        }\n      }\n      &:hover:not([disabled]) {\n        background-color: $mdlext-light-accordion-header-background-hover-color;\n      }\n      &--ripple {\n        &[aria-selected='true']::before {\n          background: $mdlext-light-accordion-ripple-color;\n        }\n      }\n    }\n\n    &__tabpanel {\n      color: $mdlext-light-accordion-content-color;\n      background-color: $mdlext-light-accordion-content-background-color;\n    }\n  }\n\n  // Vertical layout\n  .mdlext-accordion {\n\n    &--vertical {\n\n      .mdlext-accordion__tab {\n        border-top: 1px solid $mdlext-light-accordion-header-border-color;\n\n        &[aria-selected='true']::after {\n          background-color: $mdlext-light-accordion-header-highlight-color;\n        }\n      }\n      .mdlext-accordion__tabpanel {\n        border-top: 1px solid $mdlext-light-accordion-header-border-color;\n      }\n    }\n  }\n\n  // Horizontal layout\n  .mdlext-accordion {\n\n    &--horizontal {\n\n      .mdlext-accordion__tab {\n        border-left: 1px solid $mdlext-light-accordion-header-border-color;\n\n        &[aria-selected='true']::after {\n          background-color: $mdlext-light-accordion-header-highlight-color;\n        }\n      }\n      .mdlext-accordion__tabpanel {\n        border-left: 1px solid $mdlext-light-accordion-header-border-color;\n      }\n    }\n  }\n\n  .mdlext-accordion {\n\n    &__panel:first-child > &__tab {\n      // Use container to set outer borders\n      border-top-color: transparent;\n      border-left-color: transparent;\n    }\n  }\n\n  // Making accordion appear disabled.\n  // Note: does not prevent tabbing into a disabled accordion\n  .mdlext-accordion[disabled] {\n    .mdlext-accordion__tab {\n      background-color: $mdlext-light-accordion-header-disabled-color;\n      color: $mdlext-light-accordion-header-secondary-color-disabled;\n\n      > * {\n        color: $mdlext-light-accordion-header-secondary-color-disabled;\n      }\n    }\n    .mdlext-accordion__tabpanel {\n      opacity: 0.8;\n      filter: blur(1px) grayscale(80%);\n    }\n  }\n}\n\n\n\n// WEBPACK FOOTER //\n// webpack:///src/color-themes/_light-color-theme.scss","@import \"color-themes\";\n\n.mdlext-dark-color-theme {\n  background-color: $mdlext-dark-content-background-color;\n  color: $mdlext-dark-text-color-primary;\n  a {\n    outline-color: inherit;\n  }\n}\n\n// mdl/src/palette/_palette.scss\n.mdlext-dark-color-theme {\n\n  .mdl-color--primary {\n    background-color: $mdlext-dark-color-primary !important;\n  }\n\n  .mdl-color--primary-contrast {\n    background-color: $mdlext-dark-color-primary-contrast !important;\n  }\n\n  .mdl-color--primary-dark {\n    background-color: $mdlext-dark-color-primary-dark !important;\n  }\n\n  .mdl-color--accent {\n    background-color: $mdlext-dark-color-accent !important;\n  }\n\n  .mdl-color--accent-contrast {\n    background-color: $mdlext-dark-color-accent-contrast !important;\n  }\n\n  .mdl-color-text--primary {\n    color: $mdlext-dark-color-primary !important;\n  }\n\n  .mdl-color-text--primary-contrast {\n    color: $mdlext-dark-color-primary-contrast !important;\n  }\n\n  .mdl-color-text--primary-dark {\n    color: $mdlext-dark-color-primary-dark !important;\n  }\n\n  .mdl-color-text--accent {\n    color: $mdlext-dark-color-accent !important;\n  }\n\n  .mdl-color-text--accent-contrast {\n    color: $mdlext-dark-color-accent-contrast !important;\n  }\n\n}\n\n// mdl/src/typography/_typography.scss\n.mdlext-dark-color-theme {\n  a {\n    color: $mdlext-dark-text-link-color;\n  }\n}\n\n\n// mdl/src/badge/_badge.scss\n// ---------------------------\n.mdlext-dark-color-theme {\n  .mdl-badge {\n\n    &[data-badge]::after {\n      background: $mdlext-dark-badge-background;\n      color: $mdlext-dark-badge-color;\n    }\n\n    &.mdl-badge--no-background {\n      &[data-badge]::after {\n        color: $mdlext-dark-badge-color-inverse;\n        background: $mdlext-dark-badge-background-inverse;\n      }\n    }\n  }\n}\n\n\n// mdl/src/button/_button.scss\n// ---------------------------\n.mdlext-dark-color-theme {\n\n  .mdl-button {\n    background: transparent;\n    color: $mdlext-dark-button-secondary-color;\n\n    &:hover {\n      background-color: $mdlext-dark-button-hover-color;\n    }\n\n    &:focus:not(:active) {\n      background-color: $mdlext-dark-button-focus-color;\n    }\n\n    &:active {\n      background-color: $mdlext-dark-button-active-color;\n    }\n\n    &.mdl-button--colored {\n      color: $mdlext-dark-button-primary-color-alt;\n\n      &:focus:not(:active) {\n        background-color: $mdlext-dark-button-focus-color-alt;\n      }\n    }\n  }\n\n  // Raised buttons\n  .mdl-button--raised {\n    background: $mdlext-dark-button-primary-color;\n\n    &:active {\n      background-color: $mdlext-dark-button-active-color;\n    }\n\n    &:focus:not(:active) {\n      background-color: $mdlext-dark-button-active-color;\n    }\n\n    &.mdl-button--colored {\n      background: $mdlext-dark-button-primary-color-alt;\n      color: $mdlext-dark-button-secondary-color-alt;\n\n      &:hover {\n        background-color: $mdlext-dark-button-hover-color-alt;\n      }\n\n      &:active {\n        background-color: $mdlext-dark-button-active-color-alt;\n      }\n\n      &:focus:not(:active) {\n        background-color: $mdlext-dark-button-active-color-alt;\n      }\n\n      & .mdl-ripple {\n        background: $mdlext-dark-button-ripple-color-alt;\n      }\n    }\n  }\n\n\n  // FABs\n  .mdl-button--fab {\n    background: $mdlext-dark-button-primary-color;\n\n    &:active {\n      background-color: $mdlext-dark-button-active-color;\n    }\n\n    &:focus:not(:active) {\n      background-color: $mdlext-dark-button-active-color;\n    }\n\n    &.mdl-button--colored {\n      background: $mdlext-dark-button-fab-color-alt;\n      color: $mdlext-dark-button-fab-text-color-alt;\n\n      &:hover {\n        background-color: $mdlext-dark-button-fab-hover-color-alt;\n      }\n\n      &:focus:not(:active) {\n        background-color: $mdlext-dark-button-fab-active-color-alt;\n      }\n\n      &:active {\n        background-color: $mdlext-dark-button-fab-active-color-alt;\n      }\n\n      & .mdl-ripple {\n        background: $mdlext-dark-button-fab-ripple-color-alt;\n      }\n    }\n  }\n\n\n  // Icon buttons\n  .mdl-button--icon {\n    color: inherit;\n  }\n\n  // Colorized buttons\n\n  .mdl-button--primary.mdl-button--primary {\n    color: $mdlext-dark-button-primary-color-alt;\n\n    & .mdl-ripple {\n      background: $mdlext-dark-button-secondary-color-alt;\n    }\n    &.mdl-button--raised,\n    &.mdl-button--fab {\n      color: $mdlext-dark-button-secondary-color-alt;\n      background-color: $mdlext-dark-button-primary-color-alt;\n    }\n  }\n\n  .mdl-button--accent.mdl-button--accent {\n    color: $mdlext-dark-button-fab-color-alt;\n\n    & .mdl-ripple {\n      background: $mdlext-dark-button-fab-text-color-alt;\n    }\n    &.mdl-button--raised,\n    &.mdl-button--fab {\n      color: $mdlext-dark-button-fab-text-color-alt;\n      background-color: $mdlext-dark-button-fab-color-alt;\n    }\n  }\n\n  // Disabled buttons\n\n  .mdl-button {\n    // Bump up specificity by using [disabled] twice.\n    &[disabled][disabled],\n    &.mdl-button--disabled.mdl-button--disabled {\n      color: $mdlext-dark-button-secondary-color-disabled;\n      background-color: transparent;\n    }\n\n    &--fab {\n      // Bump up specificity by using [disabled] twice.\n      &[disabled][disabled],\n      &.mdl-button--disabled.mdl-button--disabled {\n        background-color: $mdlext-dark-button-primary-color-disabled;\n        color: $mdlext-dark-button-secondary-color-disabled;\n      }\n    }\n\n    &--raised {\n      // Bump up specificity by using [disabled] twice.\n      &[disabled][disabled],\n      &.mdl-button--disabled.mdl-button--disabled {\n        background-color: $mdlext-dark-button-primary-color-disabled;\n        color: $mdlext-dark-button-secondary-color-disabled;\n      }\n    }\n    &--colored {\n      // Bump up specificity by using [disabled] twice.\n      &[disabled][disabled],\n      &.mdl-button--disabled.mdl-button--disabled {\n        color: $mdlext-dark-button-secondary-color-disabled;\n      }\n    }\n  }\n}\n\n\n// mdl/src/slider/_slider.scss\n// ---------------------------\n.mdlext-dark-color-theme {\n\n  .mdl-slider {\n\n    &.is-upgraded {\n      background: transparent;\n      color: $mdlext-dark-range-color;\n\n      &::-webkit-slider-runnable-track {\n        background: transparent;\n      }\n\n      &::-moz-range-track {\n        background: transparent;\n      }\n\n      &::-ms-track {\n        background: none;\n        color: transparent;\n      }\n\n      /* stylelint-disable */\n      &::-ms-fill-lower {\n        background: linear-gradient(\n          to right,\n          transparent,\n          transparent 16px,\n          $mdlext-dark-range-color 16px,\n          $mdlext-dark-range-color 0\n        );\n      }\n\n      &::-ms-fill-upper {\n        background: linear-gradient(\n          to left,\n          transparent,\n          transparent 16px,\n          $mdlext-dark-range-bg-color 16px,\n          $mdlext-dark-range-bg-color 0);\n      }\n      /* stylelint-enable */\n\n      &::-webkit-slider-thumb {\n        background: $mdlext-dark-range-color;\n      }\n\n      &::-moz-range-thumb {\n        background: $mdlext-dark-range-color;\n      }\n\n      &:focus:not(:active)::-webkit-slider-thumb {\n        box-shadow: 0 0 0 10px $mdlext-dark-range-faded-color;\n      }\n\n      &:focus:not(:active)::-moz-range-thumb {\n        box-shadow: 0 0 0 10px $mdlext-dark-range-faded-color;\n      }\n\n      &:active::-webkit-slider-thumb {\n        background: $mdlext-dark-range-color;\n      }\n\n      &:active::-moz-range-thumb {\n        background: $mdlext-dark-range-color;\n      }\n\n      &::-ms-thumb {\n        background: $mdlext-dark-range-color;\n      }\n\n      /* stylelint-disable */\n      &:focus:not(:active)::-ms-thumb {\n        background: radial-gradient(circle closest-side,\n          $mdlext-dark-range-color 0%,\n          $mdlext-dark-range-color 37.5%,\n          $mdlext-dark-range-faded-color 37.5%,\n          $mdlext-dark-range-faded-color 100%);\n      }\n      /* stylelint-enable */\n\n      &:active::-ms-thumb {\n        background: $mdlext-dark-range-color;\n      }\n\n\n      /**************************** 0-value ****************************/\n\n      &.is-lowest-value::-webkit-slider-thumb {\n        border-color: $mdlext-dark-range-color;\n        background: transparent;\n      }\n\n      &.is-lowest-value::-moz-range-thumb {\n        border-color: $mdlext-dark-range-bg-color;\n        background: transparent;\n      }\n\n      &.is-lowest-value:focus:not(:active)::-webkit-slider-thumb {\n        box-shadow: 0 0 0 10px $mdlext-dark-range-bg-focus-color;\n        background: $mdlext-dark-range-bg-focus-color;\n      }\n\n      &.is-lowest-value:focus:not(:active)::-moz-range-thumb {\n        box-shadow: 0 0 0 10px $mdlext-dark-range-bg-focus-color;\n        background: $mdlext-dark-range-bg-focus-color;\n      }\n\n      &.is-lowest-value:active::-webkit-slider-thumb {\n        border-color: $mdlext-dark-range-bg-color;\n      }\n\n      &.is-lowest-value:active::-moz-range-thumb {\n        border-color: $mdlext-dark-range-bg-color;\n      }\n\n      /* stylelint-disable */\n      &.is-lowest-value::-ms-thumb {\n        background: radial-gradient(circle closest-side,\n          transparent 0%,\n          transparent 66.67%,\n          $mdlext-dark-range-bg-color 66.67%,\n          $mdlext-dark-range-bg-color 100%);\n      }\n\n      &.is-lowest-value:focus:not(:active)::-ms-thumb {\n        background: radial-gradient(circle closest-side,\n          $mdlext-dark-range-bg-focus-color 0%,\n          $mdlext-dark-range-bg-focus-color 25%,\n          $mdlext-dark-range-bg-color 25%,\n          $mdlext-dark-range-bg-color 37.5%,\n          $mdlext-dark-range-bg-focus-color 37.5%,\n          $mdlext-dark-range-bg-focus-color 100%);\n      }\n\n      &.is-lowest-value:active::-ms-thumb {\n        background: radial-gradient(circle closest-side,\n          transparent 0%,\n          transparent 77.78%,\n          $mdlext-dark-range-bg-color 77.78%,\n          $mdlext-dark-range-bg-color 100%);\n      }\n      /* stylelint-enable */\n\n      &.is-lowest-value::-ms-fill-lower {\n        background: transparent;\n      }\n\n      /**************************** Disabled ****************************/\n\n      &:disabled:focus::-webkit-slider-thumb,\n      &:disabled:active::-webkit-slider-thumb,\n      &:disabled::-webkit-slider-thumb {\n        background: $mdlext-dark-range-bg-color;\n      }\n\n      &:disabled:focus::-moz-range-thumb,\n      &:disabled:active::-moz-range-thumb,\n      &:disabled::-moz-range-thumb {\n        background: $mdlext-dark-range-bg-color;\n      }\n\n      &:disabled + .mdl-slider__background-flex > .mdl-slider__background-lower {\n        background-color: $mdlext-dark-range-bg-color;\n      }\n\n      &.is-lowest-value:disabled:focus::-webkit-slider-thumb,\n      &.is-lowest-value:disabled:active::-webkit-slider-thumb,\n      &.is-lowest-value:disabled::-webkit-slider-thumb {\n        border-color: $mdlext-dark-range-bg-color;\n        background: transparent;\n      }\n\n      &.is-lowest-value:disabled:focus::-moz-range-thumb,\n      &.is-lowest-value:disabled:active::-moz-range-thumb,\n      &.is-lowest-value:disabled::-moz-range-thumb {\n        border-color: $mdlext-dark-range-bg-color;\n        background: transparent;\n      }\n\n      &:disabled:focus::-ms-thumb,\n      &:disabled:active::-ms-thumb,\n      &:disabled::-ms-thumb {\n        background: $mdlext-dark-range-bg-color;\n      }\n\n      /* stylelint-disable */\n      &.is-lowest-value:disabled:focus::-ms-thumb,\n      &.is-lowest-value:disabled:active::-ms-thumb,\n      &.is-lowest-value:disabled::-ms-thumb {\n        background: radial-gradient(circle closest-side,\n          transparent 0%,\n          transparent 50%,\n          $mdlext-dark-range-bg-color 50%,\n          $mdlext-dark-range-bg-color 100%);\n      }\n\n      &:disabled::-ms-fill-lower {\n        background: linear-gradient(to right,\n          transparent,\n          transparent 25px,\n          $mdlext-dark-range-bg-color 25px,\n          $mdlext-dark-range-bg-color 0);\n      }\n      /* stylelint-enable */\n\n    }\n  }\n\n  .mdl-slider__background-flex {\n    background: transparent;\n  }\n\n  .mdl-slider__background-lower {\n    background: $mdlext-dark-range-color;\n  }\n\n  // This one styles the upper part of the slider track.\n  .mdl-slider__background-upper {\n    background: $mdlext-dark-range-bg-color;\n  }\n}\n\n\n// mdl/src/textfield/_textfield.scss\n// -----------------------------------\n.mdlext-dark-color-theme {\n\n  .mdl-textfield__input {\n    border-bottom-color: $mdlext-dark-input-text-bottom-border-color;\n  }\n  .mdl-textfield.is-invalid .mdl-textfield__input {\n    border-color: $mdlext-dark-input-text-error-color;\n  }\n  fieldset[disabled] .mdl-textfield .mdl-textfield__input,\n  .mdl-textfield.is-disabled .mdl-textfield__input {\n    background-color: transparent;\n    border-bottom-color: $mdlext-dark-input-text-disabled-color;\n    color: $mdlext-dark-input-text-disabled-text-color;\n  }\n  .mdl-textfield__label {\n    color: $mdlext-dark-input-text-label-color;\n  }\n  .mdl-textfield__label::after {\n    background-color: $mdlext-dark-input-text-highlight-color;\n  }\n  fieldset[disabled] .mdl-textfield .mdl-textfield__label,\n  .mdl-textfield.is-disabled.is-disabled .mdl-textfield__label {\n    color: $mdlext-dark-input-text-disabled-text-color;\n  }\n  .mdl-textfield--floating-label.is-focused .mdl-textfield__label,\n  .mdl-textfield--floating-label.is-dirty .mdl-textfield__label,\n  .mdl-textfield--floating-label.has-placeholder .mdl-textfield__label {\n    color: $mdlext-dark-input-text-highlight-color;\n  }\n  .mdl-textfield--floating-label.is-invalid .mdl-textfield__label {\n    color: $mdlext-dark-input-text-error-color;\n  }\n  .mdl-textfield.is-invalid .mdl-textfield__label::after {\n    background-color: $mdlext-dark-input-text-error-color;\n  }\n  .mdl-textfield__error {\n    color: $mdlext-dark-input-text-error-color;\n  }\n}\n\n\n// mdl/src/checkbox/_checkbox.scss\n// -----------------------------------\n.mdlext-dark-color-theme {\n\n  .mdl-checkbox__box-outline {\n    border-color: $mdlext-dark-checkbox-off-color;\n  }\n  .mdl-checkbox.is-checked .mdl-checkbox__box-outline {\n    border-color: $mdlext-dark-checkbox-color;\n  }\n  fieldset[disabled] .mdl-checkbox .mdl-checkbox__box-outline,\n  .mdl-checkbox.is-disabled .mdl-checkbox__box-outline {\n    border-color: $mdlext-dark-checkbox-disabled-color;\n  }\n\n  .mdl-checkbox__focus-helper {\n    background-color: transparent;\n  }\n  .mdl-checkbox.is-focused.is-checked .mdl-checkbox__focus-helper {\n    box-shadow: 0 0 0 ($checkbox-button-size / 2) $mdlext-dark-checkbox-focus-color;\n    background-color: $mdlext-dark-checkbox-focus-color;\n  }\n\n  .mdl-checkbox__tick-outline {\n    background: transparent;\n  }\n  .mdl-checkbox.is-checked .mdl-checkbox__tick-outline {\n    background-color: $mdlext-dark-checkbox-color;\n  }\n  fieldset[disabled] .mdl-checkbox.is-checked .mdl-checkbox__tick-outline,\n  .mdl-checkbox.is-checked.is-disabled .mdl-checkbox__tick-outline {\n    background-color: $mdlext-dark-checkbox-disabled-color;\n  }\n\n  fieldset[disabled] .mdl-checkbox .mdl-checkbox__label,\n  .mdl-checkbox.is-disabled .mdl-checkbox__label {\n    color: $mdlext-dark-checkbox-disabled-color;\n  }\n\n  .mdl-checkbox__ripple-container .mdl-ripple {\n    background: $mdlext-dark-checkbox-color;\n  }\n  fieldset[disabled] .mdl-checkbox .mdl-checkbox__ripple-container .mdl-ripple,\n  .mdl-checkbox.is-disabled .mdl-checkbox__ripple-container .mdl-ripple {\n    background: transparent;\n  }\n\n}\n\n// mdl/src/radio/_radio.scss\n// -----------------------------------\n.mdlext-dark-color-theme {\n  .mdl-radio__outer-circle {\n    border-color: $mdlext-dark-radio-off-color;\n  }\n  .mdl-radio.is-checked .mdl-radio__outer-circle {\n    border-color: $mdlext-dark-radio-color;\n  }\n  .mdl-radio__outer-circle fieldset[disabled] .mdl-radio,\n  .mdl-radio.is-disabled .mdl-radio__outer-circle {\n    border-color: $mdlext-dark-radio-disabled-color;\n  }\n\n  .mdl-radio__inner-circle {\n    background: $mdlext-dark-radio-color;\n  }\n  fieldset[disabled] .mdl-radio .mdl-radio__inner-circle,\n  .mdl-radio.is-disabled .mdl-radio__inner-circle {\n    background: $mdlext-dark-radio-disabled-color;\n  }\n\n  fieldset[disabled] .mdl-radio .mdl-radio__label,\n  .mdl-radio.is-disabled .mdl-radio__label {\n    color: $mdlext-dark-radio-disabled-color;\n  }\n\n  .mdl-radio__ripple-container .mdl-ripple {\n    background: $mdlext-dark-radio-color;\n  }\n  fieldset[disabled] .mdl-radio .mdl-radio__ripple-container .mdl-ripple,\n  .mdl-radio.is-disabled .mdl-radio__ripple-container .mdl-ripple {\n    background: transparent;\n  }\n}\n\n// mdl/src/icon-togglr/_icon-toggle.scss\n// ---------------------------------------\n.mdlext-dark-color-theme {\n  .mdl-icon-toggle__label {\n    color: $mdlext-dark-icon-toggle-color;\n  }\n  .mdl-icon-toggle.is-checked .mdl-icon-toggle__label {\n    color: $mdlext-dark-icon-toggle-checked-color;\n  }\n  .mdl-icon-toggle.is-disabled .mdl-icon-toggle__label {\n    color: $mdlext-dark-icon-toggle-disabled-color;\n  }\n  .mdl-icon-toggle.is-focused .mdl-icon-toggle__label {\n    background-color: $mdlext-dark-icon-toggle-focus-color;\n  }\n  .mdl-icon-toggle.is-focused.is-checked .mdl-icon-toggle__label {\n    background-color: $mdlext-dark-icon-toggle-checked-focus-color;\n  }\n  .mdl-icon-toggle__ripple-container .mdl-ripple {\n    background: $mdlext-dark-icon-toggle-color;\n  }\n  .mdl-icon-toggle.is-disabled .mdl-icon-toggle__ripple-container .mdl-ripple {\n    background: transparent;\n  }\n}\n\n\n// mdl/src/switch/_switch.scss\n// -----------------------------------\n.mdlext-dark-color-theme {\n\n  .mdl-switch__track {\n    background: $mdlext-dark-switch-off-track-color;\n  }\n  .mdl-switch.is-checked .mdl-switch__track {\n    background: $mdlext-dark-switch-track-color;\n  }\n  .mdl-switch__track fieldset[disabled] .mdl-switch,\n  .mdl-switch.is-disabled .mdl-switch__track {\n    background: $mdlext-dark-switch-disabled-track-color;\n  }\n\n  .mdl-switch__thumb {\n    background: $mdlext-dark-switch-off-thumb-color;\n  }\n  .mdl-switch.is-checked .mdl-switch__thumb {\n    background: $mdlext-dark-switch-thumb-color;\n  }\n  .mdl-switch__thumb fieldset[disabled] .mdl-switch,\n  .mdl-switch.is-disabled .mdl-switch__thumb {\n    background: $mdlext-dark-switch-disabled-thumb-color;\n  }\n\n  .mdl-switch__focus-helper {\n    background-color: transparent;\n  }\n  .mdl-switch.is-focused .mdl-switch__focus-helper {\n    background-color: rgba(0, 0, 0, 0.1);\n  }\n  .mdl-switch.is-focused.is-checked .mdl-switch__focus-helper {\n    box-shadow: 0 0 0 (($switch-ripple-size - $switch-helper-size) / 2) $mdlext-dark-switch-faded-color;\n    background-color: $mdlext-dark-switch-faded-color;\n  }\n\n  .mdl-switch__label fieldset[disabled] .mdl-switch,\n  .mdl-switch.is-disabled .mdl-switch__label {\n    color: $mdlext-dark-switch-disabled-thumb-color;\n  }\n\n  .mdl-switch__ripple-container .mdl-ripple {\n    background: $mdlext-dark-switch-color;\n  }\n  fieldset[disabled] .mdl-switch .mdl-switch__ripple-container .mdl-ripple,\n  .mdl-switch.is-disabled .mdl-switch__ripple-container .mdl-ripple {\n    background: transparent;\n  }\n\n}\n\n\n// mdl/src/data-table/_data-table.scss\n// -----------------------------------\n.mdlext-dark-color-theme {\n\n  .mdl-data-table {\n    border-color: $mdlext-dark-data-table-divider-color;\n    background-color: $mdlext-dark-data-table-background-color;\n\n    tbody {\n      tr {\n        &.is-selected {\n          background-color: $mdlext-dark-data-table-selection-color;\n        }\n\n        &:hover {\n          background-color: $mdlext-dark-data-table-hover-color;\n        }\n      }\n    }\n\n    th {\n      color: $mdlext-dark-data-table-header-color;\n\n      &.mdl-data-table__header--sorted-ascending,\n      &.mdl-data-table__header--sorted-descending {\n        color: $mdlext-dark-data-table-header-sorted-color;\n\n        &:hover {\n          &::before {\n            color: $mdlext-dark-data-table-header-sorted-icon-hover-color;\n          }\n        }\n      }\n    }\n  }\n}\n\n// mdl/src/menu/_menu.scss\n// -----------------------------------\n.mdlext-dark-color-theme {\n\n  .mdl-menu__outline {\n    background: $mdlext-dark-default-dropdown-bg-color;\n  }\n\n  .mdl-menu__item {\n    color: $mdlext-dark-default-item-text-color;\n    background-color: transparent;\n    outline-color: $mdlext-dark-default-item-outline-color;\n\n    &--full-bleed-divider {\n      border-bottom-color: $mdlext-dark-default-item-divider-color;\n    }\n\n    &[disabled],\n    &[data-mdl-disabled] {\n      color: $mdlext-dark-disabled-item-text-color;\n      background-color: transparent;\n\n      &:hover {\n        background-color: transparent;\n      }\n\n      &:focus {\n        background-color: transparent;\n      }\n\n      & .mdl-ripple {\n        background: transparent;\n      }\n    }\n\n    &:hover {\n      background-color: $mdlext-dark-default-item-hover-bg-color;\n    }\n\n    &:focus {\n      background-color: $mdlext-dark-default-item-focus-bg-color;\n    }\n\n    &:active {\n      background-color: $mdlext-dark-default-item-active-bg-color;\n    }\n  }\n}\n\n// mdl/src/card/_card.scss\n// ----------------------------------------\n.mdlext-dark-color-theme {\n  .mdl-card {\n    background: $mdlext-dark-card-background-color;\n  }\n\n  .mdl-card__media {\n    background-color: $mdlext-dark-card-image-placeholder-color;\n  }\n\n  .mdl-card__title {\n    color: $mdlext-dark-card-text-color;\n\n    &.mdl-card--border {\n      border-bottom-color: $mdlext-dark-card-border-color;\n    }\n  }\n\n  .mdl-card__title-text {\n    color: inherit;\n  }\n\n  .mdl-card__subtitle-text {\n    color: $mdlext-dark-card-subtitle-color;\n  }\n\n  .mdl-card__supporting-text {\n    color: $mdlext-dark-card-supporting-text-text-color;\n  }\n\n  .mdl-card__actions {\n    background-color: rgba(255, 255, 255, 0);\n\n    &.mdl-card--border {\n      border-top-color: $mdlext-dark-card-border-color;\n    }\n  }\n}\n\n\n// mdlext/src/selectfield/_selectfield.scss\n// ----------------------------------------\n.mdlext-dark-color-theme {\n\n  .mdlext-selectfield.is-disabled::after {\n    color: $mdlext-dark-input-text-disabled-color;\n    @include mdlext-arrow(bottom, $mdlext-selectfield-arrow-width, $mdlext-selectfield-arrow-length, $mdlext-dark-input-text-disabled-color);\n  }\n\n  .mdlext-selectfield__select {\n    border-bottom-color: $mdlext-dark-input-text-bottom-border-color;\n    color: inherit;\n\n    option {\n      background-color: $mdlext-dark-content-background-color;\n      color: $mdlext-dark-text-color-primary;\n    }\n  }\n  .mdlext-selectfield.is-invalid .mdlext-selectfield__select {\n    border-color: $mdlext-dark-input-text-error-color;\n  }\n  fieldset[disabled] .mdlext-selectfield .mdlext-selectfield__select,\n  .mdlext-selectfield.is-disabled .mdlext-selectfield__select {\n    background-color: transparent;\n    border-bottom-color: $mdlext-dark-input-text-disabled-color;\n    color: $mdlext-dark-input-text-disabled-text-color;\n  }\n\n  .mdlext-selectfield__label {\n    color: $mdlext-dark-input-text-label-color;\n  }\n  fieldset[disabled] .mdlext-selectfield .mdlext-selectfield__label,\n  .mdlext-selectfield.is-disabled.is-disabled .mdlext-selectfield__label {\n    color: $mdlext-dark-input-text-disabled-text-color;\n  }\n  .mdlext-selectfield--floating-label.is-focused .mdlext-selectfield__label,\n  .mdlext-selectfield--floating-label.is-dirty .mdlext-selectfield__label,\n  .mdlext-selectfield--floating-label.is-dirty.is-dirty .mdlext-selectfield__label,\n  .mdlext-selectfield--floating-label.has-placeholder .mdlext-selectfield__label {\n    color: $mdlext-dark-input-text-highlight-color;\n  }\n  .mdlext-selectfield--floating-label.is-invalid .mdlext-selectfield__label {\n    color: $mdlext-dark-input-text-error-color;\n  }\n  .mdlext-selectfield__label::after {\n    background-color: $mdlext-dark-input-text-highlight-color;\n  }\n  .mdlext-selectfield.is-invalid .mdlext-selectfield__label::after {\n    background-color: $mdlext-dark-input-text-error-color;\n  }\n\n  .mdlext-selectfield__error {\n    color: $mdlext-dark-input-text-error-color;\n  }\n}\n\n\n// mdlext/src/menu-button/_menu-button.scss\n// ----------------------------------------\n.mdlext-menu.mdlext-dark-color-theme {\n  background: $mdlext-dark-default-dropdown-bg-color;\n}\n\n.mdlext-dark-color-theme {\n\n  .mdlext-menu {\n    background: $mdlext-dark-default-dropdown-bg-color;\n\n    &__item {\n      color: $mdlext-dark-default-item-text-color;\n      background-color: $mdlext-dark-default-dropdown-bg-color;\n\n      &:active,\n      &[aria-selected='true'] {\n        background-color: $mdlext-dark-default-item-active-bg-color;\n      }\n      &:hover:not([disabled]) {\n        background-color: $mdlext-dark-default-item-hover-bg-color;\n      }\n      &:focus {\n        outline-color: $mdlext-dark-default-item-outline-color;\n        background-color: $mdlext-dark-default-item-focus-bg-color;\n      }\n      &[disabled] {\n        color: $mdlext-dark-disabled-item-text-color;\n\n        > * {\n          color: $mdlext-dark-disabled-item-text-color;\n        }\n      }\n    }\n    &__item-separator {\n      border-bottom: 1px solid $mdlext-dark-default-item-divider-color;\n    }\n  }\n}\n\n\n// mdlext/src/bordered-fields/_bordered-fields.scss\n// -------------------------------------------------\n.mdlext-dark-color-theme {\n\n  .mdlext-bordered-fields {\n\n    .mdl-textfield,\n    .mdlext-selectfield {\n\n      .mdl-textfield__input,\n      .mdlext-selectfield__select {\n        background-color: $mdlext-dark-bordered-field-background-color;\n        border-color: $mdlext-dark-bordered-field-border-color;\n        color: $mdlext-dark-bordered-field-input-text-color;\n\n        &:disabled {\n          color: $mdlext-dark-bordered-field-input-text-disabled-text-color;\n          background-color: $mdlext-dark-bordered-field-disabled-background-color;\n          border-color: $mdlext-dark-bordered-field-disabled-border-color;\n        }\n        &:focus {\n          background-color: $mdlext-dark-bordered-field-focus-background-color;\n          border-color: $mdlext-dark-bordered-field-focus-border-color;\n        }\n      }\n      &.is-invalid {\n        .mdl-textfield__input,\n        .mdlext-selectfield__select {\n          color: $mdlext-dark-bordered-field-input-text-error-color;\n          border-color: $mdlext-dark-bordered-field-error-border-color;\n          background-color: $mdlext-dark-bordered-field-error-background-color;\n\n          &:focus {\n            border-color: $mdlext-dark-bordered-field-error-focus-border-color;\n            background-color: $mdlext-dark-bordered-field-error-focus-background-color;\n          }\n        }\n      }\n    }\n\n    fieldset[disabled] .mdlext-selectfield::after,\n    .mdlext-selectfield.is-disabled::after {\n      color: $mdlext-dark-bordered-field-input-text-disabled-text-color;\n      @include mdlext-arrow(bottom, $mdlext-selectfield-arrow-width, $mdlext-selectfield-arrow-length, $mdlext-dark-bordered-field-input-text-disabled-text-color);\n    }\n\n    fieldset[disabled] .mdl-textfield .mdl-textfield__input,\n    fieldset[disabled] .mdlext-selectfield .mdlext-selectfield__select {\n      color: $mdlext-dark-bordered-field-input-text-disabled-text-color;\n      background-color: $mdlext-dark-bordered-field-disabled-background-color;\n      border-color: $mdlext-dark-bordered-field-disabled-border-color;\n    }\n\n    .mdl-textfield,\n    .mdlext-selectfield {\n\n      .mdl-textfield__label,\n      .mdlext-selectfield__label {\n        color: $mdlext-dark-bordered-field-input-text-label-color;\n      }\n      &.mdl-textfield--floating-label.is-focused.is-focused,\n      &.mdl-textfield--floating-label.is-dirty.is-dirty,\n      &.mdl-textfield--floating-label.has-placeholder,\n      &.mdlext-selectfield--floating-label.is-focused.is-focused,\n      &.mdlext-selectfield--floating-label.is-dirty.is-dirty,\n      &.mdlext-selectfield--floating-label.has-placeholder {\n\n        .mdl-textfield__label,\n        .mdlext-selectfield__label {\n          color: $mdlext-dark-bordered-field-input-text-label-focus-color;\n        }\n      }\n      &.mdl-textfield--floating-label.is-disabled.is-disabled,\n      &.mdlext-selectfield--floating-label.is-disabled.is-disabled {\n\n        .mdl-textfield__label,\n        .mdlext-selectfield__label {\n          color: $mdlext-dark-bordered-field-input-text-label-disabled-color;\n        }\n      }\n      &.mdl-textfield--floating-label.is-invalid.is-invalid,\n      &.mdlext-selectfield--floating-label.is-invalid.is-invalid {\n\n        .mdl-textfield__label,\n        .mdlext-selectfield__label {\n          color: $mdlext-dark-bordered-field-input-text-label-error-color;\n        }\n      }\n    }\n\n    fieldset[disabled] .mdl-textfield .mdl-textfield__label,\n    fieldset[disabled] .mdl-selectfield .mdl-selectfield__label {\n      color: $mdlext-dark-bordered-field-input-text-label-disabled-color;\n    }\n\n    // Icon(s) and/or button(s) inside textfield\n    .mdl-textfield,\n    .mdlext-selectfield {\n      &.is-disabled i,\n      &.is-disabled .mdl-button {\n        color: $mdlext-dark-bordered-field-disabled-border-color;\n      }\n    }\n    fieldset[disabled] .mdl-textfield,\n    fieldset[disabled] .mdlext-selectfield {\n      i,\n      .mdl-button {\n        color: $mdlext-dark-bordered-field-disabled-border-color;\n      }\n    }\n  }\n\n}\n\n\n// mdlext/src/accordion/_accordion.scss\n// ----------------------------------------\n.mdlext-dark-color-theme {\n\n  .mdlext-accordion {\n\n    &__tab {\n      color: $mdlext-dark-accordion-header-secondary-color;\n      background-color: $mdlext-dark-accordion-header-background-color;\n\n      &:focus {\n        outline-color: $mdlext-dark-accordion-header-focus-outline-color;\n      }\n      &[aria-expanded='true'] {\n        background-color: $mdlext-dark-accordion-header-background-open-color;\n      }\n      &[aria-selected='true'] {\n        background-color: $mdlext-dark-accordion-header-background-active-color;\n      }\n      &[disabled] {\n        background-color: $mdlext-dark-accordion-header-disabled-color;\n        color: $mdlext-dark-accordion-header-secondary-color-disabled;\n        pointer-events: none;\n\n        > * {\n          color: $mdlext-dark-accordion-header-secondary-color-disabled;\n        }\n      }\n      &:hover:not([disabled]) {\n        background-color: $mdlext-dark-accordion-header-background-hover-color;\n      }\n      &--ripple {\n        &[aria-selected='true']::before {\n          background: $mdlext-dark-accordion-ripple-color;\n        }\n      }\n    }\n\n    &__tabpanel {\n      color: $mdlext-dark-accordion-content-color;\n      background-color: $mdlext-dark-accordion-content-background-color;\n    }\n  }\n\n  // Vertical layout\n  .mdlext-accordion {\n\n    &--vertical {\n\n      .mdlext-accordion__tab {\n        border-top: 1px solid $mdlext-dark-accordion-header-border-color;\n\n        &[aria-selected='true']::after {\n          background-color: $mdlext-dark-accordion-header-highlight-color;\n        }\n      }\n      .mdlext-accordion__tabpanel {\n        border-top: 1px solid $mdlext-dark-accordion-header-border-color;\n      }\n    }\n  }\n\n  // Horizontal layout\n  .mdlext-accordion {\n\n    &--horizontal {\n\n      .mdlext-accordion__tab {\n        border-left: 1px solid $mdlext-dark-accordion-header-border-color;\n\n        &[aria-selected='true']::after {\n          background-color: $mdlext-dark-accordion-header-highlight-color;\n        }\n      }\n      .mdlext-accordion__tabpanel {\n        border-left: 1px solid $mdlext-dark-accordion-header-border-color;\n      }\n    }\n  }\n\n  .mdlext-accordion {\n\n    &__panel:first-child > &__tab {\n      // Use container to set outer borders\n      border-top-color: transparent;\n      border-left-color: transparent;\n    }\n  }\n\n  // Making accordion appear disabled.\n  // Note: does not prevent tabbing into a disabled accordion\n  .mdlext-accordion[disabled] {\n    .mdlext-accordion__tab {\n      background-color: $mdlext-dark-accordion-header-disabled-color;\n      color: $mdlext-dark-accordion-header-secondary-color-disabled;\n\n      > * {\n        color: $mdlext-dark-accordion-header-secondary-color-disabled;\n      }\n    }\n    .mdlext-accordion__tabpanel {\n      opacity: 0.8;\n      filter: blur(1px) grayscale(80%);\n    }\n  }\n}\n\n\n\n// WEBPACK FOOTER //\n// webpack:///src/color-themes/_dark-color-theme.scss"],"sourceRoot":""}
\ No newline at end of file