From 466416497b2862f9f15b55a33a1a9771a6e62be0 Mon Sep 17 00:00:00 2001
From: Kevin Ross <kevin.ross@alienfast.com>
Date: Tue, 24 Nov 2015 16:34:17 -0600
Subject: [PATCH] #745 reviewed fab buttons, updated sass conversion

---
 Gruntfile.js                               |   86 +-
 bootstrap-elements.html                    |   23 +-
 less/_buttons.less                         |   76 +-
 less/_import-bs-less.less                  |    4 +-
 less/_variables.less                       |    5 +-
 sass/_alerts.scss                          |    6 +-
 sass/_bootstrap-material-design.scss       |   20 +-
 sass/_buttons.scss                         |  308 +-
 sass/_cards.scss                           |    2 +-
 sass/_checkboxes.scss                      |   78 +-
 sass/_colors.scss                          |    7 +-
 sass/_dialogs.scss                         |    2 +-
 sass/_icons-material-design.scss           | 6500 ++++++++++----------
 sass/_icons.scss                           |   23 +-
 sass/_import-bs-sass.scss                  |    4 +-
 sass/_inputs.scss                          |   15 +-
 sass/_lists.scss                           |    2 +-
 sass/_mixins.scss                          |   94 +-
 sass/_navbar.scss                          |   11 +-
 sass/_panels.scss                          |    6 +-
 sass/_plugins.scss                         |    7 +
 sass/_popups.scss                          |    2 +-
 sass/_progress.scss                        |    2 +-
 sass/_radios.scss                          |   16 +-
 sass/_shadows.scss                         |   58 +-
 sass/_themes.scss                          |    8 +
 sass/_togglebutton.scss                    |   51 +-
 sass/_variables.scss                       |   74 +-
 sass/_welljumbo.scss                       |   40 +-
 sass/{ => plugins}/_plugin-dropdownjs.scss |    0
 sass/{ => plugins}/_plugin-nouislider.scss |   10 +-
 sass/{ => plugins}/_plugin-selectize.scss  |    2 +-
 sass/{ => plugins}/_plugin-snackbarjs.scss |    4 +-
 33 files changed, 3886 insertions(+), 3660 deletions(-)
 create mode 100644 sass/_plugins.scss
 create mode 100644 sass/_themes.scss
 rename sass/{ => plugins}/_plugin-dropdownjs.scss (100%)
 rename sass/{ => plugins}/_plugin-nouislider.scss (80%)
 rename sass/{ => plugins}/_plugin-selectize.scss (98%)
 rename sass/{ => plugins}/_plugin-snackbarjs.scss (91%)

diff --git a/Gruntfile.js b/Gruntfile.js
index 688288e5..aaf56e9a 100644
--- a/Gruntfile.js
+++ b/Gruntfile.js
@@ -88,7 +88,7 @@ module.exports = function (grunt) {
         files: [{
           expand: true,
           cwd: "less",
-          src: ["*.less", "!_mixins.less", "!_import-bs*"],
+          src: ["**/*.less", "!_mixins.less", "!_import-bs*"],
           ext: ".scss",
           dest: "sass"
         }],
@@ -116,6 +116,13 @@ module.exports = function (grunt) {
               order: 2
             },
 
+            // convert conditional when
+            { // https://regex101.com/r/dL1lI8/2
+              pattern: /& when /gi,
+              replacement: "@if ",
+              order: 2
+            },
+
             // convert all shadow mixins
             { // https://regex101.com/r/sJ2lH4/1
               pattern: /.shadow-z-(\d+)((?:-hover)?) {/gi,
@@ -144,58 +151,65 @@ module.exports = function (grunt) {
             },
 
             // button variations mixin replacement(s)
-            { // Multi-line replacement - https://regex101.com/r/qD9qB8/2
-              pattern: /.generic-variations\(unquote\(("[^"]+")\), (\$[\s\S]+?(?!\r|\n)), {$\n[\s\S]+?(?!\r|\n)contrast[\s\S]+?(?!\r|\n)(\d+)[\s\S]+?(?!\r|\n)}\);$\n/mg,
-              replacement: "@include button-variations(unquote($1), $2, $3%);\n",
-              order: 20
-            },
+            //{ // Multi-line replacement - https://regex101.com/r/qD9qB8/2
+            //  pattern: /.generic-variations\(unquote\(("[^"]+")\), (\$[\s\S]+?(?!\r|\n)), {$\n[\s\S]+?(?!\r|\n)contrast[\s\S]+?(?!\r|\n)(\d+)[\s\S]+?(?!\r|\n)}\);$\n/mg,
+            //  replacement: "@include button-variations(unquote($1), $2, $3%);\n",
+            //  order: 20
+            //},
 
-            // background-color generic-variations
-            { // Multi-line replacement - https://regex101.com/r/cW6pH8/2
-              pattern: /.generic-variations\(unquote\(("[^"]+")\), (\$[\s\S]+?(?!\r|\n)), {$\n[\s\S]+?(?!\r|\n)background-color[\s\S]+?(?!\r|\n)(\(\d+\/\d+\))[\s\S]+?(?!\r|\n)}\);$\n/mg,
-              replacement: "@include bg-color-variations(unquote($1), $2, $3);\n",
-              order: 21
-            },
+            //// background-color generic-variations
+            //{ // Multi-line replacement - https://regex101.com/r/cW6pH8/2
+            //  pattern: /.generic-variations\(unquote\(("[^"]+")\), (\$[\s\S]+?(?!\r|\n)), {$\n[\s\S]+?(?!\r|\n)background-color[\s\S]+?(?!\r|\n)(\(\d+\/\d+\))[\s\S]+?(?!\r|\n)}\);$\n/mg,
+            //  replacement: "@include bg-color-variations(unquote($1), $2, $3);\n",
+            //  order: 21
+            //},
 
-            // bg-box-shadow generic-variations
-            { // Multi-line replacement - https://regex101.com/r/jW8kR1/1
-              pattern: /.generic-variations\(unquote\(("[^"]+")\), (\$[\s\S]+?(?!\r|\n)), {$\n[\s\S]+?(?!\r|\n)box-shadow[\s\S]+?(?!\r|\n)[\s\S]+?(?!\r|\n)}\);$\n/mg,
-              replacement: "@include bg-box-shadow-variations(unquote($1), $2);\n",
-              order: 22
-            },
+            //// bg-box-shadow generic-variations
+            //{ // Multi-line replacement - https://regex101.com/r/jW8kR1/1
+            //  pattern: /.generic-variations\(unquote\(("[^"]+")\), (\$[\s\S]+?(?!\r|\n)), {$\n[\s\S]+?(?!\r|\n)box-shadow[\s\S]+?(?!\r|\n)[\s\S]+?(?!\r|\n)}\);$\n/mg,
+            //  replacement: "@include bg-box-shadow-variations(unquote($1), $2);\n",
+            //  order: 22
+            //},
 
-            // bg-img generic-variations
-            { // Multi-line replacement - https://regex101.com/r/aP2hH2/1
-              pattern: /.generic-variations\(unquote\(("[^"]+")\), (\$[\s\S]+?(?!\r|\n)), {$\n[\s\S]+?(?!\r|\n)background-image[\s\S]+?(?!\r|\n)[\s\S]+?(?!\r|\n)}\);$\n/mg,
-              replacement: "@include bg-img-variations(unquote($1), $2);\n",
-              order: 23
-            },
+            //// bg-img generic-variations
+            //{ // Multi-line replacement - https://regex101.com/r/aP2hH2/1
+            //  pattern: /.generic-variations\(unquote\(("[^"]+")\), (\$[\s\S]+?(?!\r|\n)), {$\n[\s\S]+?(?!\r|\n)background-image[\s\S]+?(?!\r|\n)[\s\S]+?(?!\r|\n)}\);$\n/mg,
+            //  replacement: "@include bg-img-variations(unquote($1), $2);\n",
+            //  order: 23
+            //},
 
-            // navbar generic-variations
-            { // Multi-line replacement - https://regex101.com/r/lX1hH1/1
-              pattern: /.generic-variations\(unquote\((".navbar")\), (\$[\s\S]+?(?!\r|\n)), {$\n[\s\S]+?(?!\r|\n)[\s\S]+?(?!\r|\n)[\s\S]+?(?!\r|\n)}\);$\n/mg,
-              replacement: "@include navbar-variations(unquote($1), $2);\n",
-              order: 24
-            },
-
-            // material-placehorder
+            // material-placeholder
             { // Multi-line replacement - https://regex101.com/r/eS2vQ3/2
               pattern: /.material-placeholder\({$\n([\s\S]+?)}\);$\n/mg,
               replacement: "@include material-placeholder {\n$1\n}\n",
               order: 24
             },
 
+            // navbar generic-variations
+            { // Multi-line replacement - https://regex101.com/r/lX1hH1/4
+              pattern: /.generic-variations\(unquote\((".navbar"), ~("([^"]+)?")\), (\$[\s\S]+?(?!\r|\n)), {$\n[\s\S]+?(?!\r|\n)[\s\S]+?(?!\r|\n)[\s\S]+?(?!\r|\n)}\);$/mg,
+              replacement: "@include navbar-variations(unquote($1), unquote($2), $4);\n",
+              order: 25
+            },
+
             // fix calc references
             { // https://regex101.com/r/aZ8iI5/1
               pattern: /calc\(unquote\("([^"]+)"\)\)/gi,
               replacement: "calc($1)",
-              order: 24
+              order: 100
+            },
+
+            // fix unquote("", ~"")
+            { //  https://regex101.com/r/vX4nO9/6
+              pattern: /\(unquote\(("([^"]+)?"), ~("([^"]+)?")\),/gi,
+              replacement: "(unquote($1), unquote($3),",
+              order: 101
             },
 
             // alert generic-variations (convert this one last - very broad search)
-            { // Multi-line replacement - https://regex101.com/r/jB1uL1/1
-              pattern: /.generic-variations\(unquote\(("([^"]+)?")\), (\$[\s\S]+?(?!\r|\n)), {$\n[\s\S]+}\);$\n/mg,
-              replacement: "@include alert-variations(unquote($1), $3);\n",
+            { // Multi-line replacement - https://regex101.com/r/jB1uL1/2
+              pattern: /.generic-variations\(unquote\(("([^"]+)?")\), unquote\(("([^"]+)?")\), (\$[\s\S]+?(?!\r|\n)), {$\n[\s\S]+}\);$\n/mg,
+              replacement: "@include alert-variations(unquote($1), unquote($3), $5);\n",
               order: 250 // very broad search, do this last
             },
 
diff --git a/bootstrap-elements.html b/bootstrap-elements.html
index 32e15ddc..86bd7acc 100644
--- a/bootstrap-elements.html
+++ b/bootstrap-elements.html
@@ -539,14 +539,23 @@
           <a href="javascript:void(0)" class="btn btn-raised btn-xs">xs button</a>
         </p>
 
-        <h3>Floating action buttons</h3>
+        <h3>Floating action buttons <small>a.k.a fab</small></h3>
         <p class="bs-component">
-          <a href="javascript:void(0)" class="btn btn-default btn-fab btn-raised "><i class="material-icons">grade</i></a>
-          <a href="javascript:void(0)" class="btn btn-primary btn-fab btn-raised "><i class="material-icons">grade</i></a>
-          <a href="javascript:void(0)" class="btn btn-success btn-fab btn-raised "><i class="material-icons">grade</i></a>
-          <a href="javascript:void(0)" class="btn btn-info btn-fab btn-raised "><i class="material-icons">grade</i></a>
-          <a href="javascript:void(0)" class="btn btn-warning btn-fab btn-raised "><i class="material-icons">grade</i></a>
-          <a href="javascript:void(0)" class="btn btn-danger btn-fab btn-raised "><i class="material-icons">grade</i></a>
+          <a href="javascript:void(0)" class="btn btn-default btn-fab"><i class="material-icons">grade</i></a>
+          <a href="javascript:void(0)" class="btn btn-primary btn-fab"><i class="material-icons">grade</i></a>
+          <a href="javascript:void(0)" class="btn btn-success btn-fab"><i class="material-icons">grade</i></a>
+          <a href="javascript:void(0)" class="btn btn-info btn-fab"><i class="material-icons">grade</i></a>
+          <a href="javascript:void(0)" class="btn btn-warning btn-fab"><i class="material-icons">grade</i></a>
+          <a href="javascript:void(0)" class="btn btn-danger btn-fab"><i class="material-icons">grade</i></a>
+        </p>
+        <h4><small><code>.btn-group-sm .btn-fab</code> or <code>.btn-fab-mini</code></small></h4>
+        <p class="bs-component btn-group-sm">
+          <a href="javascript:void(0)" class="btn btn-default btn-fab"><i class="material-icons">grade</i></a>
+          <a href="javascript:void(0)" class="btn btn-primary btn-fab"><i class="material-icons">grade</i></a>
+          <a href="javascript:void(0)" class="btn btn-success btn-fab"><i class="material-icons">grade</i></a>
+          <a href="javascript:void(0)" class="btn btn-info btn-fab"><i class="material-icons">grade</i></a>
+          <a href="javascript:void(0)" class="btn btn-warning btn-fab"><i class="material-icons">grade</i></a>
+          <a href="javascript:void(0)" class="btn btn-danger btn-fab"><i class="material-icons">grade</i></a>
         </p>
 
       </div>
diff --git a/less/_buttons.less b/less/_buttons.less
index 7cce9aea..8fefe205 100644
--- a/less/_buttons.less
+++ b/less/_buttons.less
@@ -55,11 +55,17 @@
     }
   }
 
+  //--
+  // color variations
+  &.btn-raised,
+  &.btn-fab {
+    .background-variations(~".btn", ~"", @mdb-btn-background-color);
+  }
+
+
   //---
   // btn-raised
   &.btn-raised {
-    .background-variations(~".btn", ~"", @mdb-btn-background-color);
-
     &:not(.btn-link) {
       .shadow-2dp();
 
@@ -88,23 +94,8 @@
     }
   }
 
-  // Size variations
-  &.btn-lg,
-  .btn-group-lg & {
-    font-size: @mdb-btn-font-size-lg;
-  }
-  &.btn-sm,
-  .btn-group-sm & {
-    padding: 5px 20px;
-    font-size: @mdb-btn-font-size-sm;
-  }
-  &.btn-xs,
-  .btn-group-xs & {
-    padding: 4px 15px;
-    font-size: @mdb-btn-font-size-xs;
-  }
-
   &.btn-fab {
+    // see above for color variations
     border-radius: 50%;
     font-size: @mdb-btn-fab-font-size;
     height: @mdb-btn-fab-size;
@@ -117,29 +108,15 @@
     position: relative;
     line-height: normal;
 
-    //&,
-    //&:hover,
-    //&:active {
-    //  //.variations(~"", background-color, transparent);
-    //  //.variations(~".btn", ~"", background-color, @mdb-btn-primary-color);
-    //}
-    //&,
-    //&:hover {
-    //  .shadow-z-1();
-    //}
-    //&:active {
-    //  .shadow-z-1-hover();
-    //}
-
     .ripple-container {
       border-radius: 50%;
     }
 
-    &.btn-fab-mini {
-      width: 40px;
-      height: 40px;
-      padding: 13px 0;
-      font-size: 15px;
+    &.btn-fab-mini,
+    .btn-group-sm & {
+      height: @mdb-btn-fab-size-mini;
+      min-width: @mdb-btn-fab-size-mini;
+      width: @mdb-btn-fab-size-mini;
 
       &.material-icons {
         top: (@mdb-btn-icon-size-mini - @mdb-btn-fab-font-size) / 2;
@@ -161,12 +138,30 @@
   i.material-icons {
     vertical-align: middle;
   }
+
+
+  // Size variations
+  &.btn-lg,
+  .btn-group-lg & {
+    font-size: @mdb-btn-font-size-lg;
+  }
+  &.btn-sm,
+  .btn-group-sm & {
+    padding: 5px 20px;
+    font-size: @mdb-btn-font-size-sm;
+  }
+  &.btn-xs,
+  .btn-group-xs & {
+    padding: 4px 15px;
+    font-size: @mdb-btn-font-size-xs;
+  }
 }
 
 // Disabled buttons and button groups
 .btn,
 .input-group-btn .btn,
-.btn-group {
+.btn-group,
+.btn-group-vertical {
   // have to ratchet up the specificity to kill drop shadows on disabled raised buttons
   fieldset[disabled][disabled] &,
   &.disabled,
@@ -179,9 +174,10 @@
       color: fade(#FFFFFF, 30%);
     }
 
+    // flat buttons lose transparency
     background: transparent;
 
-    // no box-shadow on disabled
+    // no box-shadow on raised - need specificity
     &.btn-raised,
     &.btn-group-raised {
       &,
@@ -202,6 +198,8 @@
   //border-radius: 2px;
   margin: 10px 1px;
 
+
+  // spec: https://www.google.com/design/spec/components/buttons.html#buttons-toggle-buttons
   &.open {
     .dropdown-toggle {
       //box-shadow: none;
diff --git a/less/_import-bs-less.less b/less/_import-bs-less.less
index 4e075e73..19b26852 100644
--- a/less/_import-bs-less.less
+++ b/less/_import-bs-less.less
@@ -1,2 +1,2 @@
-@import "@{mdb-dependency-packages}/bootstrap/less/variables.less";
-//@import "@{mdb-dependency-packages}/bootstrap/less/mixins.less";
+@import "../bower_components/bootstrap/less/variables.less";
+//@import "../bower_components/bootstrap/less/mixins.less";
diff --git a/less/_variables.less b/less/_variables.less
index b7b107ae..e46b5bbd 100644
--- a/less/_variables.less
+++ b/less/_variables.less
@@ -1,8 +1,5 @@
 @import "_colors.less";
 
-// Paths
-@mdb-dependency-packages: "../bower_components";
-
 // Typography elements
 @mdb-font-family: 'Roboto', 'Helvetica', 'Arial', sans-serif;
 @mdb-text-color-light:  ~"rgba(@{rgb-white}, 0.84)";
@@ -153,7 +150,7 @@
 
 
 @mdl-btn-border-radus: 2px;
-@mdb-btn-primary-color: ~"rgba(@{rgb-grey-500}, 0.20)";
+//@mdb-btn-primary-color: ~"rgba(@{rgb-grey-500}, 0.20)";
 
 @mdb-btn-fab-size: 56px;
 @mdb-btn-fab-size-mini: 40px;
diff --git a/sass/_alerts.scss b/sass/_alerts.scss
index 8605bf23..efc77392 100644
--- a/sass/_alerts.scss
+++ b/sass/_alerts.scss
@@ -5,15 +5,15 @@
     border-radius: 0;
 
     // SASS conversion note: please mirror any content change in _mixins-shared.scss alert-variations-content
-    @include alert-variations(unquote(""), $darkbg-text);
+    @include alert-variations(unquote(".alert"), unquote(""), $mdb-text-color-light);
 
     &-info, &-danger, &-warning, &-success {
-        color: $darkbg-text;
+        color: $mdb-text-color-light;
     }
 
     &-default {
         a, .alert-link {
-            color: $lightbg-text;
+            color: $mdb-text-color-primary;
         }
     }
 }
diff --git a/sass/_bootstrap-material-design.scss b/sass/_bootstrap-material-design.scss
index 847e49d1..756e5b10 100644
--- a/sass/_bootstrap-material-design.scss
+++ b/sass/_bootstrap-material-design.scss
@@ -5,7 +5,7 @@ body {
   &.inverse {
     background: #333333;
     &, .form-control {
-      color: $darkbg-text;
+      color: $mdb-text-color-light;
     }
     .modal,
     .panel-default,
@@ -22,8 +22,8 @@ body {
 
 
 body, h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4 {
-  font-family: $mdb-font-family;
-  font-weight: 300;
+  //font-family: $font-family-sans-serif;
+  //font-weight: 300;
 }
 
 h5, h6{
@@ -32,6 +32,10 @@ h5, h6{
 
 a, a:hover, a:focus {
   color: $brand-primary;
+
+  & .material-icons {
+    vertical-align: middle;
+  }
 }
 
 // Well and Jumbotrons
@@ -78,7 +82,6 @@ legend {
       color: $brand-primary;
     }
   }
-  @include variations(unquote(" li a:hover"), color, $brand-primary);
 }
 
 // Alerts
@@ -100,8 +103,6 @@ legend {
 
 @import '_dialogs';
 
-@import '_labels';
-
 @import '_panels';
 
 @import '_dividers';
@@ -116,8 +117,7 @@ legend {
 }
 
 
+@import '_themes';
+
 // External plugins
-@import '_plugin-snackbarjs';
-@import '_plugin-nouislider';
-@import '_plugin-selectize';
-@import '_plugin-dropdownjs';
+@import '_plugins';
diff --git a/sass/_buttons.scss b/sass/_buttons.scss
index 714e437f..840b871a 100644
--- a/sass/_buttons.scss
+++ b/sass/_buttons.scss
@@ -1,154 +1,226 @@
 // This file has been autogenerated by grunt task lessToSass. Any changes will be overwritten.
 
-@mixin btn-shadow(){
-  @include shadow-z-1();
-  transition: box-shadow 0.28s cubic-bezier(0.4, 0, 0.2, 1);
-  &:active:not(.btn-link) {
-    @include shadow-z-1-hover();
-  }
-}
+// specification: https://www.google.com/design/spec/components/buttons.html
 
-.btn {
-  position: relative;
-  padding: 8px 30px;
-  border: 0;
-  margin: 10px 1px;
-  cursor: pointer;
-  border-radius: 2px;
+@mixin typo-button($colorContrast: false){
+  font-size: $mdb-btn-font-size-base;
+  font-weight: 500;
   text-transform: uppercase;
-  text-decoration: none;
-  color: $darkbg-text;
+  //line-height: 1;
+  letter-spacing: 0;
 
-  &:not(.btn-link):not(.btn-flat) {
-    background-color: $btn-default;
-    color: $lightbg-text;
-
-    &:not(.btn-fab) {
-      &:hover {
-        @include shadow-z-1();
-      }
-      &:active {
-        @include shadow-z-1-hover();
-      }
-    }
+  @if ($colorContrast) {
+    opacity: 0.87;
   }
-
-  transition: background-color 0.2s ease, box-shadow 0.28s cubic-bezier(0.4, 0, 0.2, 1);
-  outline: none !important;
-
-  .btn-flat:not(.btn-link){
-    color: $lightbg-text;
-  }
-
-  @include background-variations(unquote(":not(.btn-link):not(.btn-flat)"), $btn-default);
-
-  // BTN hover effect
-  // SASS conversion note: please mirror any content change in _mixins-shared.scss button-variations-content
-  @include button-variations(unquote(":hover:not(.btn-link):not(.btn-flat)"), $btn-default, 4%);
-  // BTN active effect
-  // SASS conversion note: please mirror any content change in _mixins-shared.scss button-variations-content
-  @include button-variations(unquote(":active:not(.btn-link):not(.btn-flat)"), $btn-default, 6%);
-  // BTN .active effect
-  // SASS conversion note: please mirror any content change in _mixins-shared.scss button-variations-content
-  @include button-variations(unquote(".active:not(.btn-link):not(.btn-flat)"), $btn-default, 6%);
-  // BTN flat hover effect
-  // SASS conversion note: please mirror any content change in _mixins-shared.scss bg-color-variations-content
-  @include bg-color-variations(unquote(".btn-flat:hover:not(.btn-link)"), $btn-default, (20/100));
-
 }
 
+// mdb default buttons are flat by default
+// synchronized with mdl 11/23/15
 .btn,
 .input-group-btn .btn {
-  &.btn-flat {
-    background: none;
+  border: none;
+  border-radius: $border-radius-base;
+  position: relative;
+  padding: 8px 30px;
+  margin: 10px 1px;
+  @include typo-button();
+  will-change: box-shadow, transform;
+  transition: box-shadow 0.2s $mdb-animation-curve-fast-out-linear-in,
+  background-color 0.2s $mdb-animation-curve-default,
+  color 0.2s $mdb-animation-curve-default;
+  outline: none;
+  cursor: pointer;
+  text-decoration: none;
+
+  &::-moz-focus-inner {
+    border: 0;
+  }
+
+  //---
+  // btn-flat
+  background: transparent;
+  &:not(.btn-raised) {
+    @include variations(unquote(".btn"), unquote(""), color, $mdb-text-color-primary);
     box-shadow: none;
-    font-weight: 500;
-    &:disabled {
-      color: $text-disabled !important;
+
+    &:not(.btn-link) {
+      &:hover,
+      &:focus {
+        // spec: flat/light bg Hover: 20% #999999
+        background-color: rgba(#999999, (20/100));
+
+        .theme-dark & {
+          // spec: dark bg Hover: 15% #CCCCCC
+          background-color: rgba(#CCCCCC, (15/100));
+        }
+      }
     }
   }
 
-  // Size variations
-  &.btn-sm {
-    padding: 5px 20px;
-  }
-  &.btn-xs {
-    padding: 4px 15px;
-    font-size: 10px;
+  //--
+  // color variations
+  &.btn-raised,
+  &.btn-fab {
+    @include background-variations(unquote(".btn"), unquote(""), $mdb-btn-background-color);
   }
 
+
+  //---
+  // btn-raised
   &.btn-raised {
-    @include btn-shadow();
+    &:not(.btn-link) {
+      @include shadow-2dp();
+
+      &:hover {
+
+        // Spec:
+        //  - Raised Light/Light theme no hover.
+        //  - Raised Dark/Dark theme Hover color: 600
+        .theme-dark & {
+          //// SASS conversion note: please mirror any content change in _mixins-shared.scss button-variations-content
+          //@include alert-variations(unquote(".btn"), unquote(""), $mdb-btn-background-color);
+        }
+      }
+
+      &.active,
+      &:active {
+        @include shadow-4dp();
+      }
+
+      &:focus:not(:active) {
+        @include focus-shadow();
+      }
+    }
   }
 
   &.btn-fab {
-    margin: 0;
-    padding: 15px;
-    font-size: 26px;
-    width: 56px;
-    height: 56px;
-    &, &:hover, &:active {
-      @include variations(unquote(""), background-color, transparent);
-    }
-    &, &:hover {
-      @include shadow-z-1();
-    }
-    &:active {
-      @include shadow-z-1-hover();
-    }
-    &,
+    // see above for color variations
+    border-radius: 50%;
+    font-size: $mdb-btn-fab-font-size;
+    height: $mdb-btn-fab-size;
+    margin: auto;
+    min-width: $mdb-btn-fab-size;
+    width: $mdb-btn-fab-size;
+    padding: 0;
+    overflow: hidden;
+    box-shadow: 0 1px 1.5px 0 rgba(0, 0, 0, 0.12), 0 1px 1px 0 rgba(0, 0, 0, 0.24);
+    position: relative;
+    line-height: normal;
+
     .ripple-container {
-      border-radius: 100%;
+      border-radius: 50%;
     }
-    &.btn-fab-mini {
-      width: 40px;
-      height: 40px;
-      padding: 13px 0;
-      font-size: 15px;
+
+    &.btn-fab-mini,
+    .btn-group-sm & {
+      height: $mdb-btn-fab-size-mini;
+      min-width: $mdb-btn-fab-size-mini;
+      width: $mdb-btn-fab-size-mini;
+
+      &.material-icons {
+        top: ($mdb-btn-icon-size-mini - $mdb-btn-fab-font-size) / 2;
+        left: ($mdb-btn-icon-size-mini - $mdb-btn-fab-font-size) / 2;
+      }
     }
-    i {
-      position: relative;
-      top: -5px;
-      margin: 0 auto;
+
+    i.material-icons {
+      position: absolute;
+      top: 50%;
+      left: 50%;
+      transform: translate(-($mdb-btn-fab-font-size / 2), -($mdb-btn-fab-font-size / 2));
+      line-height: $mdb-btn-fab-font-size;
+      width: $mdb-btn-fab-font-size;
+    }
+  }
+
+  // Align icons inside buttons with text
+  i.material-icons {
+    vertical-align: middle;
+  }
+
+
+  // Size variations
+  &.btn-lg,
+  .btn-group-lg & {
+    font-size: $mdb-btn-font-size-lg;
+  }
+  &.btn-sm,
+  .btn-group-sm & {
+    padding: 5px 20px;
+    font-size: $mdb-btn-font-size-sm;
+  }
+  &.btn-xs,
+  .btn-group-xs & {
+    padding: 4px 15px;
+    font-size: $mdb-btn-font-size-xs;
+  }
+}
+
+// Disabled buttons and button groups
+.btn,
+.input-group-btn .btn,
+.btn-group,
+.btn-group-vertical {
+  // have to ratchet up the specificity to kill drop shadows on disabled raised buttons
+  fieldset[disabled][disabled] &,
+  &.disabled,
+  &:disabled,
+  &[disabled][disabled] {
+    // spec: light theme: Disabled text: 26% #000000
+    color: rgba(#000000, (26/100));
+    .theme-dark & {
+      // spec: dark theme: Disabled text: 30% #FFFFFF
+      color: rgba(#FFFFFF, (30/100));
+    }
+
+    // flat buttons lose transparency
+    background: transparent;
+
+    // no box-shadow on raised - need specificity
+    &.btn-raised,
+    &.btn-group-raised {
+      &,
+      &.active,
+      &:active,
+      &:focus:not(:active) {
+        box-shadow: none;
+      }
     }
   }
 }
 
-// This is needed to style buttons which has not a variation suffix (they must be stiled as btn-default)
-.btn-link, .btn:not([class*="btn-"]), .btn-default {
-  color: $lightbg-text;
-  &:hover {
-    color: $lightbg-text;
-  }
-}
-.btn:not([class*="btn-"]), .btn-default, .btn-flat:not(.btn-link) {
-  &:hover, &.active {
-    background-color: rgba(255,255,255,0.5);
-  }
-}
-.open > .dropdown-toggle.btn {
-  @include variations(unquote(""), background-color, $btn-default);
-}
-.btn-group .btn+.btn, .btn-group .btn+.btn-group, .btn-group .btn-group+.btn, .btn-group .btn-group+.btn-group {
-  margin-left: 0;
-}
-.btn-group, .btn-group-vertical {
+// btn-group variations
+.btn-group,
+.btn-group-vertical {
+
   position: relative;
-  border-radius: 2px;
+  //border-radius: 2px;
   margin: 10px 1px;
 
-  @include btn-shadow();
-  &.open .dropdown-toggle {
-    box-shadow: none;
+
+  // spec: https://www.google.com/design/spec/components/buttons.html#buttons-toggle-buttons
+  &.open {
+    .dropdown-toggle {
+      //box-shadow: none;
+    }
+
+    & > .dropdown-toggle.btn {
+      @include variations(unquote(".btn"), unquote(""), background-color, $mdb-btn-background-color);
+    }
   }
+
+  .dropdown-menu {
+    border-radius: 0 0 $border-radius-base $border-radius-base;
+  }
+
   &.btn-group-raised {
-    @include btn-shadow();
+    @include shadow-2dp();
   }
-  .btn, .btn:active, .btn-group {
-    box-shadow: none !important;
+
+  & .btn + .btn,
+  .btn,
+  .btn:active,
+  .btn-group {
     margin: 0;
   }
 }
-.btn-group-flat {
-  box-shadow: none !important;
-}
diff --git a/sass/_cards.scss b/sass/_cards.scss
index e5ee0e7e..48743182 100644
--- a/sass/_cards.scss
+++ b/sass/_cards.scss
@@ -21,7 +21,7 @@
     /**************************************************************************/
 
 
-    border-radius: 2px;
+    border-radius: $border-radius-base;
     color: $mdb-card-body-text;
     background: $mdb-card-body-background;
 
diff --git a/sass/_checkboxes.scss b/sass/_checkboxes.scss
index 09bdd861..bfa64671 100644
--- a/sass/_checkboxes.scss
+++ b/sass/_checkboxes.scss
@@ -48,8 +48,7 @@
       display: inline-block;
       width: $mdb-checkbox-size;
       height: $mdb-checkbox-size;
-      border: 2px solid $mdb-checkbox-border-color;
-      border-radius: 2px;
+      border: $border-radius-base solid $mdb-checkbox-border-color;
       overflow: hidden;
       z-index: 1;
     }
@@ -74,33 +73,51 @@
     }
   }
 
-  input[type=checkbox]:focus + .checkbox-material .check:after {
-    opacity: 0.2;
-  }
-  input[type=checkbox]:checked + .checkbox-material .check:before {
-    box-shadow:
-      0 0 0 10px,
-      10px -10px 0 10px,
-      32px 0px 0 20px,
-      0px 32px 0 20px,
-      -5px 5px 0 10px,
-      20px -12px 0 11px;
-    animation: checkbox-on $mdb-checkbox-animation-check forwards;
-  }
+  input[type=checkbox] {
 
-  input[type=checkbox]:not(:checked) + .checkbox-material:before {
-    animation: rippleOff $mdb-checkbox-animation-ripple;
-  }
-  input[type=checkbox]:checked + .checkbox-material:before {
-    animation: rippleOn $mdb-checkbox-animation-ripple;
-  }
+    &:focus + .checkbox-material .check:after {
+      opacity: 0.2;
+    }
 
-  // Ripple effect on click
-  input[type=checkbox]:not(:checked) + .checkbox-material .check:after {
-    animation: rippleOff $mdb-checkbox-animation-ripple forwards;
-  }
-  input[type=checkbox]:checked + .checkbox-material .check:after {
-    animation: rippleOn $mdb-checkbox-animation-ripple forwards;
+    &:checked {
+
+      // FIXME: once working - combine further to reduce code
+      & + .checkbox-material .check {
+        color: $mdb-checkbox-checked-color;
+        border-color: $mdb-checkbox-checked-color;
+      }
+
+      & + .checkbox-material .check:before {
+        color: $mdb-checkbox-checked-color;
+        box-shadow: 0 0 0 10px,
+          10px -10px 0 10px,
+        32px 0px 0 20px,
+        0px 32px 0 20px,
+        -5px 5px 0 10px,
+          20px -12px 0 11px;
+        animation: checkbox-on $mdb-checkbox-animation-check forwards;
+      }
+
+      & + .checkbox-material:before {
+        animation: rippleOn $mdb-checkbox-animation-ripple;
+      }
+
+      & + .checkbox-material .check:after {
+        //background-color: $brand-success; // FIXME: seems like tho wrong color, test and make sure it can be removed
+        animation: rippleOn $mdb-checkbox-animation-ripple forwards; // Ripple effect on check
+      }
+    }
+
+    &:not(:checked) {
+      & + .checkbox-material:before {
+        animation: rippleOff $mdb-checkbox-animation-ripple;
+      }
+
+      & + .checkbox-material .check:after {
+        animation: rippleOff $mdb-checkbox-animation-ripple forwards; // Ripple effect on uncheck
+
+      }
+    }
   }
 
   // Style for disabled inputs
@@ -112,14 +129,9 @@
     opacity: 0.5;
   }
   input[type=checkbox][disabled] + .checkbox-material .check:after {
-    background-color: $lightbg-text;
+    background-color: $mdb-text-color-primary;
     transform: rotate(-45deg);
   }
-
-  @include variations(unquote(" input[type=checkbox]:checked + .checkbox-material .check:after"), background-color, $brand-success);
-  @include variations(unquote(" input[type=checkbox]:checked + .checkbox-material .check:before"), color, $mdb-checkbox-checked-color);
-  @include variations(unquote(" input[type=checkbox]:checked + .checkbox-material .check"), color, $mdb-checkbox-checked-color);
-  @include variations(unquote(" input[type=checkbox]:checked + .checkbox-material .check"), border-color, $mdb-checkbox-checked-color);
 }
 
 @keyframes checkbox-on {
diff --git a/sass/_colors.scss b/sass/_colors.scss
index 1b1802e9..a4082f9e 100644
--- a/sass/_colors.scss
+++ b/sass/_colors.scss
@@ -328,7 +328,7 @@ $grey-100: #f5f5f5 !default;
 $grey-200: #eeeeee !default;
 $grey-300: #e0e0e0 !default;
 $grey-400: #bdbdbd !default;
-$grey-500: #9e9e9e !default;
+$grey-500: #9e9e9e;  $rgb-grey-500: "158, 158, 158" !default;
 $grey-600: #757575 !default;
 $grey-700: #616161 !default;
 $grey-800: #424242 !default;
@@ -357,6 +357,5 @@ $blue-grey-A700: #455a64 !default;
 $blue-grey: $blue-grey-500 !default;
 
 
-$black: #000000 !default;
-$white: #ffffff !default;
-$mdb-brand-inverse: $indigo !default;
+$black: #000000; $rgb-black: "0,0,0" !default;
+$white: #ffffff; $rgb-white: "255,255,255" !default;
diff --git a/sass/_dialogs.scss b/sass/_dialogs.scss
index 09df78ad..8b1ec101 100644
--- a/sass/_dialogs.scss
+++ b/sass/_dialogs.scss
@@ -6,7 +6,7 @@
 // --------------------------------------------------
 .modal-content {
   @include shadow-z-5();
-  border-radius: 2px;
+  border-radius: $border-radius-base;
   border: none;
   // Modal header
   // Top section of the modal w/ title and dismiss
diff --git a/sass/_icons-material-design.scss b/sass/_icons-material-design.scss
index d1672b76..8ee2487a 100644
--- a/sass/_icons-material-design.scss
+++ b/sass/_icons-material-design.scss
@@ -1,3252 +1,3252 @@
 // This file has been autogenerated by grunt task lessToSass. Any changes will be overwritten.
 
-@font-face {
-    font-family: 'Material-Design-Icons';
-    src:url('#{$mdb-font-path}/Material-Design-Icons.eot?3ocs8m');
-    src:url('#{$mdb-font-path}/Material-Design-Icons.eot?#iefix3ocs8m') format('embedded-opentype'),
-        url('#{$mdb-font-path}/Material-Design-Icons.woff?3ocs8m') format('woff'),
-        url('#{$mdb-font-path}/Material-Design-Icons.ttf?3ocs8m') format('truetype'),
-        url('#{$mdb-font-path}/Material-Design-Icons.svg?3ocs8m#Material-Design-Icons') format('svg');
-    font-weight: normal;
-    font-style: normal;
-}
-
-[class^="mdi-"], [class*="mdi-"] {
-    speak: none;
-    display: inline-block;
-    font: normal normal normal 24px/1 'Material-Design-Icons';
-    text-rendering: auto;
-    /* Better Font Rendering =========== */
-    -webkit-font-smoothing: antialiased;
-    -moz-osx-font-smoothing: grayscale;
-    transform: translate(0, 0);
-    &:before {
-        display: inline-block;
-        speak: none;
-        text-decoration: inherit;
-    }
-    &.pull-left {
-        margin-right: .3em;
-    }
-    &.pull-right{
-        margin-left: .3em;
-    }
-    &.mdi-lg:before, &.mdi-lg:after {
-        font-size: 1.33333333em;
-        line-height: 0.75em;
-        vertical-align: -15%;
-    }
-    &.mdi-2x:before, &.mdi-2x:after {
-        font-size: 2em;
-    }
-    &.mdi-3x:before, &.mdi-3x:after {
-        font-size: 3em;
-    }
-    &.mdi-4x:before, &.mdi-4x:after {
-        font-size: 4em;
-    }
-    &.mdi-5x:before, &.mdi-5x:after {
-        font-size: 5em;
-    }
-}
-
-[class^="mdi-device-signal-cellular-"],
-[class^="mdi-device-battery-"],
-[class^="mdi-device-battery-charging-"],
-[class^="mdi-device-signal-cellular-connected-no-internet-"],
-[class^="mdi-device-signal-wifi-"],
-[class^="mdi-device-signal-wifi-statusbar-not-connected"],
-.mdi-device-network-wifi{
-    &:after {
-        opacity: .3;
-        position: absolute;
-        left: 0;
-        top: 0;
-        z-index: 1;
-        display: inline-block;
-        speak: none;
-        text-decoration: inherit;
-    }
-}
-
-[class^="mdi-device-signal-cellular-"]:after {content:"\e758";}
-[class^="mdi-device-battery-"]:after {content:"\e735";}
-[class^="mdi-device-battery-charging-"]:after {content:"\e733";}
-[class^="mdi-device-signal-cellular-connected-no-internet-"]:after {content:"\e75d";}
-[class^="mdi-device-signal-wifi-"]:after, .mdi-device-network-wifi:after {content:"\e765";}
-[class^="mdi-device-signal-wifi-statusbasr-not-connected"]:after {content:"\e8f7";}
-
-.mdi-device-signal-cellular-off, .mdi-device-signal-cellular-null, .mdi-device-signal-cellular-no-sim, .mdi-device-signal-wifi-off, .mdi-device-signal-wifi-4-bar, .mdi-device-signal-cellular-4-bar, .mdi-device-battery-alert, .mdi-device-signal-cellular-connected-no-internet-4-bar, .mdi-device-battery-std, .mdi-device-battery-full .mdi-device-battery-unknown {
-    &:after {
-        content: "";
-    }
-}
-
-.mdi-fw {
-    width: 1.28571429em;
-    text-align: center;
-}
-.mdi-ul {
-    padding-left: 0;
-    margin-left: 2.14285714em;
-    list-style-type: none;
-}
-.mdi-ul > li {
-    position: relative;
-}
-.mdi-li {
-    position: absolute;
-    left: -2.14285714em;
-    width: 2.14285714em;
-    top: 0.14285714em;
-    text-align: center;
-}
-.mdi-li.mdi-lg {
-    left: -1.85714286em;
-}
-.mdi-border {
-    padding: .2em .25em .15em;
-    border: solid 0.08em #eeeeee;
-    border-radius: .1em;
-}
-
-.mdi-spin {
-    -webkit-animation: mdi-spin 2s infinite linear;
-    animation: mdi-spin 2s infinite linear;
-    -webkit-transform-origin: 50% 50%;
-    -moz-transform-origin: 50% 50%;
-    -o-transform-origin: 50% 50%;
-    transform-origin: 50% 50%;
-}
-.mdi-pulse {
-    -webkit-animation: mdi-spin 1s steps(8) infinite;
-    animation: mdi-spin 1s steps(8) infinite ;
-    -webkit-transform-origin: 50% 50%;
-    -moz-transform-origin: 50% 50%;
-    -o-transform-origin: 50% 50%;
-    transform-origin: 50% 50%;
-}
-@-webkit-keyframes mdi-spin {
-    0% {
-        -webkit-transform: rotate(0deg);
-        transform: rotate(0deg);
-    }
-    100% {
-        -webkit-transform: rotate(359deg);
-        transform: rotate(359deg);
-    }
-}
-@keyframes mdi-spin {
-    0% {
-        -webkit-transform: rotate(0deg);
-        transform: rotate(0deg);
-    }
-    100% {
-        -webkit-transform: rotate(359deg);
-        transform: rotate(359deg);
-    }
-}
-.mdi-rotate-90 {
-    filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=1);
-    -webkit-transform: rotate(90deg);
-    -ms-transform: rotate(90deg);
-    transform: rotate(90deg);
-}
-.mdi-rotate-180 {
-    filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=2);
-    -webkit-transform: rotate(180deg);
-    -ms-transform: rotate(180deg);
-    transform: rotate(180deg);
-}
-.mdi-rotate-270 {
-    filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
-    -webkit-transform: rotate(270deg);
-    -ms-transform: rotate(270deg);
-    transform: rotate(270deg);
-}
-.mdi-flip-horizontal {
-    filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=0, mirror=1);
-    -webkit-transform: scale(-1, 1);
-    -ms-transform: scale(-1, 1);
-    transform: scale(-1, 1);
-}
-.mdi-flip-vertical {
-    filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=2, mirror=1);
-    -webkit-transform: scale(1, -1);
-    -ms-transform: scale(1, -1);
-    transform: scale(1, -1);
-}
-:root .mdi-rotate-90,
-:root .mdi-rotate-180,
-:root .mdi-rotate-270,
-:root .mdi-flip-horizontal,
-:root .mdi-flip-vertical {
-    filter: none;
-}
-.mdi-stack {
-    position: relative;
-    display: inline-block;
-    width: 2em;
-    height: 2em;
-    line-height: 2em;
-    vertical-align: middle;
-}
-.mdi-stack-1x,
-.mdi-stack-2x {
-    position: absolute;
-    left: 0;
-    width: 100%;
-    text-align: center;
-}
-.mdi-stack-1x {
-    line-height: inherit;
-}
-.mdi-stack-2x {
-    font-size: 2em;
-}
-.mdi-inverse {
-    color: #ffffff;
-}
-
-
-/* Start Icons */
-
-.mdi-action-3d-rotation:before {
-    content: "\e600";
-}
-
-.mdi-action-accessibility:before {
-    content: "\e601";
-}
-
-.mdi-action-account-balance-wallet:before {
-    content: "\e602";
-}
-
-.mdi-action-account-balance:before {
-    content: "\e603";
-}
-
-.mdi-action-account-box:before {
-    content: "\e604";
-}
-
-.mdi-action-account-child:before {
-    content: "\e605";
-}
-
-.mdi-action-account-circle:before {
-    content: "\e606";
-}
-
-.mdi-action-add-shopping-cart:before {
-    content: "\e607";
-}
-
-.mdi-action-alarm-add:before {
-    content: "\e608";
-}
-
-.mdi-action-alarm-off:before {
-    content: "\e609";
-}
-
-.mdi-action-alarm-on:before {
-    content: "\e60a";
-}
-
-.mdi-action-alarm:before {
-    content: "\e60b";
-}
-
-.mdi-action-android:before {
-    content: "\e60c";
-}
-
-.mdi-action-announcement:before {
-    content: "\e60d";
-}
-
-.mdi-action-aspect-ratio:before {
-    content: "\e60e";
-}
-
-.mdi-action-assessment:before {
-    content: "\e60f";
-}
-
-.mdi-action-assignment-ind:before {
-    content: "\e610";
-}
-
-.mdi-action-assignment-late:before {
-    content: "\e611";
-}
-
-.mdi-action-assignment-return:before {
-    content: "\e612";
-}
-
-.mdi-action-assignment-returned:before {
-    content: "\e613";
-}
-
-.mdi-action-assignment-turned-in:before {
-    content: "\e614";
-}
-
-.mdi-action-assignment:before {
-    content: "\e615";
-}
-
-.mdi-action-autorenew:before {
-    content: "\e616";
-}
-
-.mdi-action-backup:before {
-    content: "\e617";
-}
-
-.mdi-action-book:before {
-    content: "\e618";
-}
-
-.mdi-action-bookmark-outline:before {
-    content: "\e619";
-}
-
-.mdi-action-bookmark:before {
-    content: "\e61a";
-}
-
-.mdi-action-bug-report:before {
-    content: "\e61b";
-}
-
-.mdi-action-cached:before {
-    content: "\e61c";
-}
-
-.mdi-action-check-circle:before {
-    content: "\e61d";
-}
-
-.mdi-action-class:before {
-    content: "\e61e";
-}
-
-.mdi-action-credit-card:before {
-    content: "\e61f";
-}
-
-.mdi-action-dashboard:before {
-    content: "\e620";
-}
-
-.mdi-action-delete:before {
-    content: "\e621";
-}
-
-.mdi-action-description:before {
-    content: "\e622";
-}
-
-.mdi-action-dns:before {
-    content: "\e623";
-}
-
-.mdi-action-done-all:before {
-    content: "\e624";
-}
-
-.mdi-action-done:before {
-    content: "\e625";
-}
-
-.mdi-action-event:before {
-    content: "\e626";
-}
-
-.mdi-action-exit-to-app:before {
-    content: "\e627";
-}
-
-.mdi-action-explore:before {
-    content: "\e628";
-}
-
-.mdi-action-extension:before {
-    content: "\e629";
-}
-
-.mdi-action-face-unlock:before {
-    content: "\e62a";
-}
-
-.mdi-action-favorite-outline:before {
-    content: "\e62b";
-}
-
-.mdi-action-favorite:before {
-    content: "\e62c";
-}
-
-.mdi-action-find-in-page:before {
-    content: "\e62d";
-}
-
-.mdi-action-find-replace:before {
-    content: "\e62e";
-}
-
-.mdi-action-flip-to-back:before {
-    content: "\e62f";
-}
-
-.mdi-action-flip-to-front:before {
-    content: "\e630";
-}
-
-.mdi-action-get-app:before {
-    content: "\e631";
-}
-
-.mdi-action-grade:before {
-    content: "\e632";
-}
-
-.mdi-action-group-work:before {
-    content: "\e633";
-}
-
-.mdi-action-help:before {
-    content: "\e634";
-}
-
-.mdi-action-highlight-remove:before {
-    content: "\e635";
-}
-
-.mdi-action-history:before {
-    content: "\e636";
-}
-
-.mdi-action-home:before {
-    content: "\e637";
-}
-
-.mdi-action-https:before {
-    content: "\e638";
-}
-
-.mdi-action-info-outline:before {
-    content: "\e639";
-}
-
-.mdi-action-info:before {
-    content: "\e63a";
-}
-
-.mdi-action-input:before {
-    content: "\e63b";
-}
-
-.mdi-action-invert-colors:before {
-    content: "\e63c";
-}
-
-.mdi-action-label-outline:before {
-    content: "\e63d";
-}
-
-.mdi-action-label:before {
-    content: "\e63e";
-}
-
-.mdi-action-language:before {
-    content: "\e63f";
-}
-
-.mdi-action-launch:before {
-    content: "\e640";
-}
-
-.mdi-action-list:before {
-    content: "\e641";
-}
-
-.mdi-action-lock-open:before {
-    content: "\e642";
-}
-
-.mdi-action-lock-outline:before {
-    content: "\e643";
-}
-
-.mdi-action-lock:before {
-    content: "\e644";
-}
-
-.mdi-action-loyalty:before {
-    content: "\e645";
-}
-
-.mdi-action-markunread-mailbox:before {
-    content: "\e646";
-}
-
-.mdi-action-note-add:before {
-    content: "\e647";
-}
-
-.mdi-action-open-in-browser:before {
-    content: "\e648";
-}
-
-.mdi-action-open-in-new:before {
-    content: "\e649";
-}
-
-.mdi-action-open-with:before {
-    content: "\e64a";
-}
-
-.mdi-action-pageview:before {
-    content: "\e64b";
-}
-
-.mdi-action-payment:before {
-    content: "\e64c";
-}
-
-.mdi-action-perm-camera-mic:before {
-    content: "\e64d";
-}
-
-.mdi-action-perm-contact-cal:before {
-    content: "\e64e";
-}
-
-.mdi-action-perm-data-setting:before {
-    content: "\e64f";
-}
-
-.mdi-action-perm-device-info:before {
-    content: "\e650";
-}
-
-.mdi-action-perm-identity:before {
-    content: "\e651";
-}
-
-.mdi-action-perm-media:before {
-    content: "\e652";
-}
-
-.mdi-action-perm-phone-msg:before {
-    content: "\e653";
-}
-
-.mdi-action-perm-scan-wifi:before {
-    content: "\e654";
-}
-
-.mdi-action-picture-in-picture:before {
-    content: "\e655";
-}
-
-.mdi-action-polymer:before {
-    content: "\e656";
-}
-
-.mdi-action-print:before {
-    content: "\e657";
-}
-
-.mdi-action-query-builder:before {
-    content: "\e658";
-}
-
-.mdi-action-question-answer:before {
-    content: "\e659";
-}
-
-.mdi-action-receipt:before {
-    content: "\e65a";
-}
-
-.mdi-action-redeem:before {
-    content: "\e65b";
-}
-
-.mdi-action-reorder:before {
-    content: "\e65c";
-}
-
-.mdi-action-report-problem:before {
-    content: "\e65d";
-}
-
-.mdi-action-restore:before {
-    content: "\e65e";
-}
-
-.mdi-action-room:before {
-    content: "\e65f";
-}
-
-.mdi-action-schedule:before {
-    content: "\e660";
-}
-
-.mdi-action-search:before {
-    content: "\e661";
-}
-
-.mdi-action-settings-applications:before {
-    content: "\e662";
-}
-
-.mdi-action-settings-backup-restore:before {
-    content: "\e663";
-}
-
-.mdi-action-settings-bluetooth:before {
-    content: "\e664";
-}
-
-.mdi-action-settings-cell:before {
-    content: "\e665";
-}
-
-.mdi-action-settings-display:before {
-    content: "\e666";
-}
-
-.mdi-action-settings-ethernet:before {
-    content: "\e667";
-}
-
-.mdi-action-settings-input-antenna:before {
-    content: "\e668";
-}
-
-.mdi-action-settings-input-component:before {
-    content: "\e669";
-}
-
-.mdi-action-settings-input-composite:before {
-    content: "\e66a";
-}
-
-.mdi-action-settings-input-hdmi:before {
-    content: "\e66b";
-}
-
-.mdi-action-settings-input-svideo:before {
-    content: "\e66c";
-}
-
-.mdi-action-settings-overscan:before {
-    content: "\e66d";
-}
-
-.mdi-action-settings-phone:before {
-    content: "\e66e";
-}
-
-.mdi-action-settings-power:before {
-    content: "\e66f";
-}
-
-.mdi-action-settings-remote:before {
-    content: "\e670";
-}
-
-.mdi-action-settings-voice:before {
-    content: "\e671";
-}
-
-.mdi-action-settings:before {
-    content: "\e672";
-}
-
-.mdi-action-shop-two:before {
-    content: "\e673";
-}
-
-.mdi-action-shop:before {
-    content: "\e674";
-}
-
-.mdi-action-shopping-basket:before {
-    content: "\e675";
-}
-
-.mdi-action-shopping-cart:before {
-    content: "\e676";
-}
-
-.mdi-action-speaker-notes:before {
-    content: "\e677";
-}
-
-.mdi-action-spellcheck:before {
-    content: "\e678";
-}
-
-.mdi-action-star-rate:before {
-    content: "\e679";
-}
-
-.mdi-action-stars:before {
-    content: "\e67a";
-}
-
-.mdi-action-store:before {
-    content: "\e67b";
-}
-
-.mdi-action-subject:before {
-    content: "\e67c";
-}
-
-.mdi-action-supervisor-account:before {
-    content: "\e67d";
-}
-
-.mdi-action-swap-horiz:before {
-    content: "\e67e";
-}
-
-.mdi-action-swap-vert-circle:before {
-    content: "\e67f";
-}
-
-.mdi-action-swap-vert:before {
-    content: "\e680";
-}
-
-.mdi-action-system-update-tv:before {
-    content: "\e681";
-}
-
-.mdi-action-tab-unselected:before {
-    content: "\e682";
-}
-
-.mdi-action-tab:before {
-    content: "\e683";
-}
-
-.mdi-action-theaters:before {
-    content: "\e684";
-}
-
-.mdi-action-thumb-down:before {
-    content: "\e685";
-}
-
-.mdi-action-thumb-up:before {
-    content: "\e686";
-}
-
-.mdi-action-thumbs-up-down:before {
-    content: "\e687";
-}
-
-.mdi-action-toc:before {
-    content: "\e688";
-}
-
-.mdi-action-today:before {
-    content: "\e689";
-}
-
-.mdi-action-track-changes:before {
-    content: "\e68a";
-}
-
-.mdi-action-translate:before {
-    content: "\e68b";
-}
-
-.mdi-action-trending-down:before {
-    content: "\e68c";
-}
-
-.mdi-action-trending-neutral:before {
-    content: "\e68d";
-}
-
-.mdi-action-trending-up:before {
-    content: "\e68e";
-}
-
-.mdi-action-turned-in-not:before {
-    content: "\e68f";
-}
-
-.mdi-action-turned-in:before {
-    content: "\e690";
-}
-
-.mdi-action-verified-user:before {
-    content: "\e691";
-}
-
-.mdi-action-view-agenda:before {
-    content: "\e692";
-}
-
-.mdi-action-view-array:before {
-    content: "\e693";
-}
-
-.mdi-action-view-carousel:before {
-    content: "\e694";
-}
-
-.mdi-action-view-column:before {
-    content: "\e695";
-}
-
-.mdi-action-view-day:before {
-    content: "\e696";
-}
-
-.mdi-action-view-headline:before {
-    content: "\e697";
-}
-
-.mdi-action-view-list:before {
-    content: "\e698";
-}
-
-.mdi-action-view-module:before {
-    content: "\e699";
-}
-
-.mdi-action-view-quilt:before {
-    content: "\e69a";
-}
-
-.mdi-action-view-stream:before {
-    content: "\e69b";
-}
-
-.mdi-action-view-week:before {
-    content: "\e69c";
-}
-
-.mdi-action-visibility-off:before {
-    content: "\e69d";
-}
-
-.mdi-action-visibility:before {
-    content: "\e69e";
-}
-
-.mdi-action-wallet-giftcard:before {
-    content: "\e69f";
-}
-
-.mdi-action-wallet-membership:before {
-    content: "\e6a0";
-}
-
-.mdi-action-wallet-travel:before {
-    content: "\e6a1";
-}
-
-.mdi-action-work:before {
-    content: "\e6a2";
-}
-
-.mdi-alert-error:before {
-    content: "\e6a3";
-}
-
-.mdi-alert-warning:before {
-    content: "\e6a4";
-}
-
-.mdi-av-album:before {
-    content: "\e6a5";
-}
-
-.mdi-av-closed-caption:before {
-    content: "\e6a6";
-}
-
-.mdi-av-equalizer:before {
-    content: "\e6a7";
-}
-
-.mdi-av-explicit:before {
-    content: "\e6a8";
-}
-
-.mdi-av-fast-forward:before {
-    content: "\e6a9";
-}
-
-.mdi-av-fast-rewind:before {
-    content: "\e6aa";
-}
-
-.mdi-av-games:before {
-    content: "\e6ab";
-}
-
-.mdi-av-hearing:before {
-    content: "\e6ac";
-}
-
-.mdi-av-high-quality:before {
-    content: "\e6ad";
-}
-
-.mdi-av-loop:before {
-    content: "\e6ae";
-}
-
-.mdi-av-mic-none:before {
-    content: "\e6af";
-}
-
-.mdi-av-mic-off:before {
-    content: "\e6b0";
-}
-
-.mdi-av-mic:before {
-    content: "\e6b1";
-}
-
-.mdi-av-movie:before {
-    content: "\e6b2";
-}
-
-.mdi-av-my-library-add:before {
-    content: "\e6b3";
-}
-
-.mdi-av-my-library-books:before {
-    content: "\e6b4";
-}
-
-.mdi-av-my-library-music:before {
-    content: "\e6b5";
-}
-
-.mdi-av-new-releases:before {
-    content: "\e6b6";
-}
-
-.mdi-av-not-interested:before {
-    content: "\e6b7";
-}
-
-.mdi-av-pause-circle-fill:before {
-    content: "\e6b8";
-}
-
-.mdi-av-pause-circle-outline:before {
-    content: "\e6b9";
-}
-
-.mdi-av-pause:before {
-    content: "\e6ba";
-}
-
-.mdi-av-play-arrow:before {
-    content: "\e6bb";
-}
-
-.mdi-av-play-circle-fill:before {
-    content: "\e6bc";
-}
-
-.mdi-av-play-circle-outline:before {
-    content: "\e6bd";
-}
-
-.mdi-av-play-shopping-bag:before {
-    content: "\e6be";
-}
-
-.mdi-av-playlist-add:before {
-    content: "\e6bf";
-}
-
-.mdi-av-queue-music:before {
-    content: "\e6c0";
-}
-
-.mdi-av-queue:before {
-    content: "\e6c1";
-}
-
-.mdi-av-radio:before {
-    content: "\e6c2";
-}
-
-.mdi-av-recent-actors:before {
-    content: "\e6c3";
-}
-
-.mdi-av-repeat-one:before {
-    content: "\e6c4";
-}
-
-.mdi-av-repeat:before {
-    content: "\e6c5";
-}
-
-.mdi-av-replay:before {
-    content: "\e6c6";
-}
-
-.mdi-av-shuffle:before {
-    content: "\e6c7";
-}
-
-.mdi-av-skip-next:before {
-    content: "\e6c8";
-}
-
-.mdi-av-skip-previous:before {
-    content: "\e6c9";
-}
-
-.mdi-av-snooze:before {
-    content: "\e6ca";
-}
-
-.mdi-av-stop:before {
-    content: "\e6cb";
-}
-
-.mdi-av-subtitles:before {
-    content: "\e6cc";
-}
-
-.mdi-av-surround-sound:before {
-    content: "\e6cd";
-}
-
-.mdi-av-timer:before {
-    content: "\e6ce";
-}
-
-.mdi-av-video-collection:before {
-    content: "\e6cf";
-}
-
-.mdi-av-videocam-off:before {
-    content: "\e6d0";
-}
-
-.mdi-av-videocam:before {
-    content: "\e6d1";
-}
-
-.mdi-av-volume-down:before {
-    content: "\e6d2";
-}
-
-.mdi-av-volume-mute:before {
-    content: "\e6d3";
-}
-
-.mdi-av-volume-off:before {
-    content: "\e6d4";
-}
-
-.mdi-av-volume-up:before {
-    content: "\e6d5";
-}
-
-.mdi-av-web:before {
-    content: "\e6d6";
-}
-
-.mdi-communication-business:before {
-    content: "\e6d7";
-}
-
-.mdi-communication-call-end:before {
-    content: "\e6d8";
-}
-
-.mdi-communication-call-made:before {
-    content: "\e6d9";
-}
-
-.mdi-communication-call-merge:before {
-    content: "\e6da";
-}
-
-.mdi-communication-call-missed:before {
-    content: "\e6db";
-}
-
-.mdi-communication-call-received:before {
-    content: "\e6dc";
-}
-
-.mdi-communication-call-split:before {
-    content: "\e6dd";
-}
-
-.mdi-communication-call:before {
-    content: "\e6de";
-}
-
-.mdi-communication-chat:before {
-    content: "\e6df";
-}
-
-.mdi-communication-clear-all:before {
-    content: "\e6e0";
-}
-
-.mdi-communication-comment:before {
-    content: "\e6e1";
-}
-
-.mdi-communication-contacts:before {
-    content: "\e6e2";
-}
-
-.mdi-communication-dialer-sip:before {
-    content: "\e6e3";
-}
-
-.mdi-communication-dialpad:before {
-    content: "\e6e4";
-}
-
-.mdi-communication-dnd-on:before {
-    content: "\e6e5";
-}
-
-.mdi-communication-email:before {
-    content: "\e6e6";
-}
-
-.mdi-communication-forum:before {
-    content: "\e6e7";
-}
-
-.mdi-communication-import-export:before {
-    content: "\e6e8";
-}
-
-.mdi-communication-invert-colors-off:before {
-    content: "\e6e9";
-}
-
-.mdi-communication-invert-colors-on:before {
-    content: "\e6ea";
-}
-
-.mdi-communication-live-help:before {
-    content: "\e6eb";
-}
-
-.mdi-communication-location-off:before {
-    content: "\e6ec";
-}
-
-.mdi-communication-location-on:before {
-    content: "\e6ed";
-}
-
-.mdi-communication-message:before {
-    content: "\e6ee";
-}
-
-.mdi-communication-messenger:before {
-    content: "\e6ef";
-}
-
-.mdi-communication-no-sim:before {
-    content: "\e6f0";
-}
-
-.mdi-communication-phone:before {
-    content: "\e6f1";
-}
-
-.mdi-communication-portable-wifi-off:before {
-    content: "\e6f2";
-}
-
-.mdi-communication-quick-contacts-dialer:before {
-    content: "\e6f3";
-}
-
-.mdi-communication-quick-contacts-mail:before {
-    content: "\e6f4";
-}
-
-.mdi-communication-ring-volume:before {
-    content: "\e6f5";
-}
-
-.mdi-communication-stay-current-landscape:before {
-    content: "\e6f6";
-}
-
-.mdi-communication-stay-current-portrait:before {
-    content: "\e6f7";
-}
-
-.mdi-communication-stay-primary-landscape:before {
-    content: "\e6f8";
-}
-
-.mdi-communication-stay-primary-portrait:before {
-    content: "\e6f9";
-}
-
-.mdi-communication-swap-calls:before {
-    content: "\e6fa";
-}
-
-.mdi-communication-textsms:before {
-    content: "\e6fb";
-}
-
-.mdi-communication-voicemail:before {
-    content: "\e6fc";
-}
-
-.mdi-communication-vpn-key:before {
-    content: "\e6fd";
-}
-
-.mdi-content-add-box:before {
-    content: "\e6fe";
-}
-
-.mdi-content-add-circle-outline:before {
-    content: "\e6ff";
-}
-
-.mdi-content-add-circle:before {
-    content: "\e700";
-}
-
-.mdi-content-add:before {
-    content: "\e701";
-}
-
-.mdi-content-archive:before {
-    content: "\e702";
-}
-
-.mdi-content-backspace:before {
-    content: "\e703";
-}
-
-.mdi-content-block:before {
-    content: "\e704";
-}
-
-.mdi-content-clear:before {
-    content: "\e705";
-}
-
-.mdi-content-content-copy:before {
-    content: "\e706";
-}
-
-.mdi-content-content-cut:before {
-    content: "\e707";
-}
-
-.mdi-content-content-paste:before {
-    content: "\e708";
-}
-
-.mdi-content-create:before {
-    content: "\e709";
-}
-
-.mdi-content-drafts:before {
-    content: "\e70a";
-}
-
-.mdi-content-filter-list:before {
-    content: "\e70b";
-}
-
-.mdi-content-flag:before {
-    content: "\e70c";
-}
-
-.mdi-content-forward:before {
-    content: "\e70d";
-}
-
-.mdi-content-gesture:before {
-    content: "\e70e";
-}
-
-.mdi-content-inbox:before {
-    content: "\e70f";
-}
-
-.mdi-content-link:before {
-    content: "\e710";
-}
-
-.mdi-content-mail:before {
-    content: "\e711";
-}
-
-.mdi-content-markunread:before {
-    content: "\e712";
-}
-
-.mdi-content-redo:before {
-    content: "\e713";
-}
-
-.mdi-content-remove-circle-outline:before {
-    content: "\e714";
-}
-
-.mdi-content-remove-circle:before {
-    content: "\e715";
-}
-
-.mdi-content-remove:before {
-    content: "\e716";
-}
-
-.mdi-content-reply-all:before {
-    content: "\e717";
-}
-
-.mdi-content-reply:before {
-    content: "\e718";
-}
-
-.mdi-content-report:before {
-    content: "\e719";
-}
-
-.mdi-content-save:before {
-    content: "\e71a";
-}
-
-.mdi-content-select-all:before {
-    content: "\e71b";
-}
-
-.mdi-content-send:before {
-    content: "\e71c";
-}
-
-.mdi-content-sort:before {
-    content: "\e71d";
-}
-
-.mdi-content-text-format:before {
-    content: "\e71e";
-}
-
-.mdi-content-undo:before {
-    content: "\e71f";
-}
-
-.mdi-editor-attach-file:before {
-    content: "\e776";
-}
-
-.mdi-editor-attach-money:before {
-    content: "\e777";
-}
-
-.mdi-editor-border-all:before {
-    content: "\e778";
-}
-
-.mdi-editor-border-bottom:before {
-    content: "\e779";
-}
-
-.mdi-editor-border-clear:before {
-    content: "\e77a";
-}
-
-.mdi-editor-border-color:before {
-    content: "\e77b";
-}
-
-.mdi-editor-border-horizontal:before {
-    content: "\e77c";
-}
-
-.mdi-editor-border-inner:before {
-    content: "\e77d";
-}
-
-.mdi-editor-border-left:before {
-    content: "\e77e";
-}
-
-.mdi-editor-border-outer:before {
-    content: "\e77f";
-}
-
-.mdi-editor-border-right:before {
-    content: "\e780";
-}
-
-.mdi-editor-border-style:before {
-    content: "\e781";
-}
-
-.mdi-editor-border-top:before {
-    content: "\e782";
-}
-
-.mdi-editor-border-vertical:before {
-    content: "\e783";
-}
-
-.mdi-editor-format-align-center:before {
-    content: "\e784";
-}
-
-.mdi-editor-format-align-justify:before {
-    content: "\e785";
-}
-
-.mdi-editor-format-align-left:before {
-    content: "\e786";
-}
-
-.mdi-editor-format-align-right:before {
-    content: "\e787";
-}
-
-.mdi-editor-format-bold:before {
-    content: "\e788";
-}
-
-.mdi-editor-format-clear:before {
-    content: "\e789";
-}
-
-.mdi-editor-format-color-fill:before {
-    content: "\e78a";
-}
-
-.mdi-editor-format-color-reset:before {
-    content: "\e78b";
-}
-
-.mdi-editor-format-color-text:before {
-    content: "\e78c";
-}
-
-.mdi-editor-format-indent-decrease:before {
-    content: "\e78d";
-}
-
-.mdi-editor-format-indent-increase:before {
-    content: "\e78e";
-}
-
-.mdi-editor-format-italic:before {
-    content: "\e78f";
-}
-
-.mdi-editor-format-line-spacing:before {
-    content: "\e790";
-}
-
-.mdi-editor-format-list-bulleted:before {
-    content: "\e791";
-}
-
-.mdi-editor-format-list-numbered:before {
-    content: "\e792";
-}
-
-.mdi-editor-format-paint:before {
-    content: "\e793";
-}
-
-.mdi-editor-format-quote:before {
-    content: "\e794";
-}
-
-.mdi-editor-format-size:before {
-    content: "\e795";
-}
-
-.mdi-editor-format-strikethrough:before {
-    content: "\e796";
-}
-
-.mdi-editor-format-textdirection-l-to-r:before {
-    content: "\e797";
-}
-
-.mdi-editor-format-textdirection-r-to-l:before {
-    content: "\e798";
-}
-
-.mdi-editor-format-underline:before {
-    content: "\e799";
-}
-
-.mdi-editor-functions:before {
-    content: "\e79a";
-}
-
-.mdi-editor-insert-chart:before {
-    content: "\e79b";
-}
-
-.mdi-editor-insert-comment:before {
-    content: "\e79c";
-}
-
-.mdi-editor-insert-drive-file:before {
-    content: "\e79d";
-}
-
-.mdi-editor-insert-emoticon:before {
-    content: "\e79e";
-}
-
-.mdi-editor-insert-invitation:before {
-    content: "\e79f";
-}
-
-.mdi-editor-insert-link:before {
-    content: "\e7a0";
-}
-
-.mdi-editor-insert-photo:before {
-    content: "\e7a1";
-}
-
-.mdi-editor-merge-type:before {
-    content: "\e7a2";
-}
-
-.mdi-editor-mode-comment:before {
-    content: "\e7a3";
-}
-
-.mdi-editor-mode-edit:before {
-    content: "\e7a4";
-}
-
-.mdi-editor-publish:before {
-    content: "\e7a5";
-}
-
-.mdi-editor-vertical-align-bottom:before {
-    content: "\e7a6";
-}
-
-.mdi-editor-vertical-align-center:before {
-    content: "\e7a7";
-}
-
-.mdi-editor-vertical-align-top:before {
-    content: "\e7a8";
-}
-
-.mdi-editor-wrap-text:before {
-    content: "\e7a9";
-}
-
-.mdi-file-attachment:before {
-    content: "\e7aa";
-}
-
-.mdi-file-cloud-circle:before {
-    content: "\e7ab";
-}
-
-.mdi-file-cloud-done:before {
-    content: "\e7ac";
-}
-
-.mdi-file-cloud-download:before {
-    content: "\e7ad";
-}
-
-.mdi-file-cloud-off:before {
-    content: "\e7ae";
-}
-
-.mdi-file-cloud-queue:before {
-    content: "\e7af";
-}
-
-.mdi-file-cloud-upload:before {
-    content: "\e7b0";
-}
-
-.mdi-file-cloud:before {
-    content: "\e7b1";
-}
-
-.mdi-file-file-download:before {
-    content: "\e7b2";
-}
-
-.mdi-file-file-upload:before {
-    content: "\e7b3";
-}
-
-.mdi-file-folder-open:before {
-    content: "\e7b4";
-}
-
-.mdi-file-folder-shared:before {
-    content: "\e7b5";
-}
-
-.mdi-file-folder:before {
-    content: "\e7b6";
-}
-
-.mdi-device-access-alarm:before {
-    content: "\e720";
-}
-
-.mdi-device-access-alarms:before {
-    content: "\e721";
-}
-
-.mdi-device-access-time:before {
-    content: "\e722";
-}
-
-.mdi-device-add-alarm:before {
-    content: "\e723";
-}
-
-.mdi-device-airplanemode-off:before {
-    content: "\e724";
-}
-
-.mdi-device-airplanemode-on:before {
-    content: "\e725";
-}
-
-.mdi-device-battery-20:before {
-    content: "\e726";
-}
-
-.mdi-device-battery-30:before {
-    content: "\e727";
-}
-
-.mdi-device-battery-50:before {
-    content: "\e728";
-}
-
-.mdi-device-battery-60:before {
-    content: "\e729";
-}
-
-.mdi-device-battery-80:before {
-    content: "\e72a";
-}
-
-.mdi-device-battery-90:before {
-    content: "\e72b";
-}
-
-.mdi-device-battery-alert:before {
-    content: "\e72c";
-}
-
-.mdi-device-battery-charging-20:before {
-    content: "\e72d";
-}
-
-.mdi-device-battery-charging-30:before {
-    content: "\e72e";
-}
-
-.mdi-device-battery-charging-50:before {
-    content: "\e72f";
-}
-
-.mdi-device-battery-charging-60:before {
-    content: "\e730";
-}
-
-.mdi-device-battery-charging-80:before {
-    content: "\e731";
-}
-
-.mdi-device-battery-charging-90:before {
-    content: "\e732";
-}
-
-.mdi-device-battery-charging-full:before {
-    content: "\e733";
-}
-
-.mdi-device-battery-full:before {
-    content: "\e734";
-}
-
-.mdi-device-battery-std:before {
-    content: "\e735";
-}
-
-.mdi-device-battery-unknown:before {
-    content: "\e736";
-}
-
-.mdi-device-bluetooth-connected:before {
-    content: "\e737";
-}
-
-.mdi-device-bluetooth-disabled:before {
-    content: "\e738";
-}
-
-.mdi-device-bluetooth-searching:before {
-    content: "\e739";
-}
-
-.mdi-device-bluetooth:before {
-    content: "\e73a";
-}
-
-.mdi-device-brightness-auto:before {
-    content: "\e73b";
-}
-
-.mdi-device-brightness-high:before {
-    content: "\e73c";
-}
-
-.mdi-device-brightness-low:before {
-    content: "\e73d";
-}
-
-.mdi-device-brightness-medium:before {
-    content: "\e73e";
-}
-
-.mdi-device-data-usage:before {
-    content: "\e73f";
-}
-
-.mdi-device-developer-mode:before {
-    content: "\e740";
-}
-
-.mdi-device-devices:before {
-    content: "\e741";
-}
-
-.mdi-device-dvr:before {
-    content: "\e742";
-}
-
-.mdi-device-gps-fixed:before {
-    content: "\e743";
-}
-
-.mdi-device-gps-not-fixed:before {
-    content: "\e744";
-}
-
-.mdi-device-gps-off:before {
-    content: "\e745";
-}
-
-.mdi-device-location-disabled:before {
-    content: "\e746";
-}
-
-.mdi-device-location-searching:before {
-    content: "\e747";
-}
-
-.mdi-device-multitrack-audio:before {
-    content: "\e748";
-}
-
-.mdi-device-network-cell:before {
-    content: "\e749";
-}
-
-.mdi-device-network-wifi:before {
-    content: "\e74a";
-}
-
-.mdi-device-nfc:before {
-    content: "\e74b";
-}
-
-.mdi-device-now-wallpaper:before {
-    content: "\e74c";
-}
-
-.mdi-device-now-widgets:before {
-    content: "\e74d";
-}
-
-.mdi-device-screen-lock-landscape:before {
-    content: "\e74e";
-}
-
-.mdi-device-screen-lock-portrait:before {
-    content: "\e74f";
-}
-
-.mdi-device-screen-lock-rotation:before {
-    content: "\e750";
-}
-
-.mdi-device-screen-rotation:before {
-    content: "\e751";
-}
-
-.mdi-device-sd-storage:before {
-    content: "\e752";
-}
-
-.mdi-device-settings-system-daydream:before {
-    content: "\e753";
-}
-
-.mdi-device-signal-cellular-0-bar:before {
-    content: "\e754";
-}
-
-.mdi-device-signal-cellular-1-bar:before {
-    content: "\e755";
-}
-
-.mdi-device-signal-cellular-2-bar:before {
-    content: "\e756";
-}
-
-.mdi-device-signal-cellular-3-bar:before {
-    content: "\e757";
-}
-
-.mdi-device-signal-cellular-4-bar:before {
-    content: "\e758";
-}
-
-.mdi-signal-wifi-statusbar-connected-no-internet-after:before {
-    content: "\e8f6";
-}
-
-.mdi-device-signal-cellular-connected-no-internet-0-bar:before {
-    content: "\e759";
-}
-
-.mdi-device-signal-cellular-connected-no-internet-1-bar:before {
-    content: "\e75a";
-}
-
-.mdi-device-signal-cellular-connected-no-internet-2-bar:before {
-    content: "\e75b";
-}
-
-.mdi-device-signal-cellular-connected-no-internet-3-bar:before {
-    content: "\e75c";
-}
-
-.mdi-device-signal-cellular-connected-no-internet-4-bar:before {
-    content: "\e75d";
-}
-
-.mdi-device-signal-cellular-no-sim:before {
-    content: "\e75e";
-}
-
-.mdi-device-signal-cellular-null:before {
-    content: "\e75f";
-}
-
-.mdi-device-signal-cellular-off:before {
-    content: "\e760";
-}
-
-.mdi-device-signal-wifi-0-bar:before {
-    content: "\e761";
-}
-
-.mdi-device-signal-wifi-1-bar:before {
-    content: "\e762";
-}
-
-.mdi-device-signal-wifi-2-bar:before {
-    content: "\e763";
-}
-
-.mdi-device-signal-wifi-3-bar:before {
-    content: "\e764";
-}
-
-.mdi-device-signal-wifi-4-bar:before {
-    content: "\e765";
-}
-
-.mdi-device-signal-wifi-off:before {
-    content: "\e766";
-}
-
-.mdi-device-signal-wifi-statusbar-1-bar:before {
-    content: "\e767";
-}
-
-.mdi-device-signal-wifi-statusbar-2-bar:before {
-    content: "\e768";
-}
-
-.mdi-device-signal-wifi-statusbar-3-bar:before {
-    content: "\e769";
-}
-
-.mdi-device-signal-wifi-statusbar-4-bar:before {
-    content: "\e76a";
-}
-
-.mdi-device-signal-wifi-statusbar-connected-no-internet-:before {
-    content: "\e76b";
-}
-
-.mdi-device-signal-wifi-statusbar-connected-no-internet:before {
-    content: "\e76f";
-}
-
-.mdi-device-signal-wifi-statusbar-connected-no-internet-2:before {
-    content: "\e76c";
-}
-
-.mdi-device-signal-wifi-statusbar-connected-no-internet-3:before {
-    content: "\e76d";
-}
-
-.mdi-device-signal-wifi-statusbar-connected-no-internet-4:before {
-    content: "\e76e";
-}
-
-.mdi-signal-wifi-statusbar-not-connected-after:before {
-    content: "\e8f7";
-}
-
-.mdi-device-signal-wifi-statusbar-not-connected:before {
-    content: "\e770";
-}
-
-.mdi-device-signal-wifi-statusbar-null:before {
-    content: "\e771";
-}
-
-.mdi-device-storage:before {
-    content: "\e772";
-}
-
-.mdi-device-usb:before {
-    content: "\e773";
-}
-
-.mdi-device-wifi-lock:before {
-    content: "\e774";
-}
-
-.mdi-device-wifi-tethering:before {
-    content: "\e775";
-}
-
-.mdi-hardware-cast-connected:before {
-    content: "\e7b7";
-}
-
-.mdi-hardware-cast:before {
-    content: "\e7b8";
-}
-
-.mdi-hardware-computer:before {
-    content: "\e7b9";
-}
-
-.mdi-hardware-desktop-mac:before {
-    content: "\e7ba";
-}
-
-.mdi-hardware-desktop-windows:before {
-    content: "\e7bb";
-}
-
-.mdi-hardware-dock:before {
-    content: "\e7bc";
-}
-
-.mdi-hardware-gamepad:before {
-    content: "\e7bd";
-}
-
-.mdi-hardware-headset-mic:before {
-    content: "\e7be";
-}
-
-.mdi-hardware-headset:before {
-    content: "\e7bf";
-}
-
-.mdi-hardware-keyboard-alt:before {
-    content: "\e7c0";
-}
-
-.mdi-hardware-keyboard-arrow-down:before {
-    content: "\e7c1";
-}
-
-.mdi-hardware-keyboard-arrow-left:before {
-    content: "\e7c2";
-}
-
-.mdi-hardware-keyboard-arrow-right:before {
-    content: "\e7c3";
-}
-
-.mdi-hardware-keyboard-arrow-up:before {
-    content: "\e7c4";
-}
-
-.mdi-hardware-keyboard-backspace:before {
-    content: "\e7c5";
-}
-
-.mdi-hardware-keyboard-capslock:before {
-    content: "\e7c6";
-}
-
-.mdi-hardware-keyboard-control:before {
-    content: "\e7c7";
-}
-
-.mdi-hardware-keyboard-hide:before {
-    content: "\e7c8";
-}
-
-.mdi-hardware-keyboard-return:before {
-    content: "\e7c9";
-}
-
-.mdi-hardware-keyboard-tab:before {
-    content: "\e7ca";
-}
-
-.mdi-hardware-keyboard-voice:before {
-    content: "\e7cb";
-}
-
-.mdi-hardware-keyboard:before {
-    content: "\e7cc";
-}
-
-.mdi-hardware-laptop-chromebook:before {
-    content: "\e7cd";
-}
-
-.mdi-hardware-laptop-mac:before {
-    content: "\e7ce";
-}
-
-.mdi-hardware-laptop-windows:before {
-    content: "\e7cf";
-}
-
-.mdi-hardware-laptop:before {
-    content: "\e7d0";
-}
-
-.mdi-hardware-memory:before {
-    content: "\e7d1";
-}
-
-.mdi-hardware-mouse:before {
-    content: "\e7d2";
-}
-
-.mdi-hardware-phone-android:before {
-    content: "\e7d3";
-}
-
-.mdi-hardware-phone-iphone:before {
-    content: "\e7d4";
-}
-
-.mdi-hardware-phonelink-off:before {
-    content: "\e7d5";
-}
-
-.mdi-hardware-phonelink:before {
-    content: "\e7d6";
-}
-
-.mdi-hardware-security:before {
-    content: "\e7d7";
-}
-
-.mdi-hardware-sim-card:before {
-    content: "\e7d8";
-}
-
-.mdi-hardware-smartphone:before {
-    content: "\e7d9";
-}
-
-.mdi-hardware-speaker:before {
-    content: "\e7da";
-}
-
-.mdi-hardware-tablet-android:before {
-    content: "\e7db";
-}
-
-.mdi-hardware-tablet-mac:before {
-    content: "\e7dc";
-}
-
-.mdi-hardware-tablet:before {
-    content: "\e7dd";
-}
-
-.mdi-hardware-tv:before {
-    content: "\e7de";
-}
-
-.mdi-hardware-watch:before {
-    content: "\e7df";
-}
-
-.mdi-image-add-to-photos:before {
-    content: "\e7e0";
-}
-
-.mdi-image-adjust:before {
-    content: "\e7e1";
-}
-
-.mdi-image-assistant-photo:before {
-    content: "\e7e2";
-}
-
-.mdi-image-audiotrack:before {
-    content: "\e7e3";
-}
-
-.mdi-image-blur-circular:before {
-    content: "\e7e4";
-}
-
-.mdi-image-blur-linear:before {
-    content: "\e7e5";
-}
-
-.mdi-image-blur-off:before {
-    content: "\e7e6";
-}
-
-.mdi-image-blur-on:before {
-    content: "\e7e7";
-}
-
-.mdi-image-brightness-1:before {
-    content: "\e7e8";
-}
-
-.mdi-image-brightness-2:before {
-    content: "\e7e9";
-}
-
-.mdi-image-brightness-3:before {
-    content: "\e7ea";
-}
-
-.mdi-image-brightness-4:before {
-    content: "\e7eb";
-}
-
-.mdi-image-brightness-5:before {
-    content: "\e7ec";
-}
-
-.mdi-image-brightness-6:before {
-    content: "\e7ed";
-}
-
-.mdi-image-brightness-7:before {
-    content: "\e7ee";
-}
-
-.mdi-image-brush:before {
-    content: "\e7ef";
-}
-
-.mdi-image-camera-alt:before {
-    content: "\e7f0";
-}
-
-.mdi-image-camera-front:before {
-    content: "\e7f1";
-}
-
-.mdi-image-camera-rear:before {
-    content: "\e7f2";
-}
-
-.mdi-image-camera-roll:before {
-    content: "\e7f3";
-}
-
-.mdi-image-camera:before {
-    content: "\e7f4";
-}
-
-.mdi-image-center-focus-strong:before {
-    content: "\e7f5";
-}
-
-.mdi-image-center-focus-weak:before {
-    content: "\e7f6";
-}
-
-.mdi-image-collections:before {
-    content: "\e7f7";
-}
-
-.mdi-image-color-lens:before {
-    content: "\e7f8";
-}
-
-.mdi-image-colorize:before {
-    content: "\e7f9";
-}
-
-.mdi-image-compare:before {
-    content: "\e7fa";
-}
-
-.mdi-image-control-point-duplicate:before {
-    content: "\e7fb";
-}
-
-.mdi-image-control-point:before {
-    content: "\e7fc";
-}
-
-.mdi-image-crop-3-2:before {
-    content: "\e7fd";
-}
-
-.mdi-image-crop-5-4:before {
-    content: "\e7fe";
-}
-
-.mdi-image-crop-7-5:before {
-    content: "\e7ff";
-}
-
-.mdi-image-crop-16-9:before {
-    content: "\e800";
-}
-
-.mdi-image-crop-din:before {
-    content: "\e801";
-}
-
-.mdi-image-crop-free:before {
-    content: "\e802";
-}
-
-.mdi-image-crop-landscape:before {
-    content: "\e803";
-}
-
-.mdi-image-crop-original:before {
-    content: "\e804";
-}
-
-.mdi-image-crop-portrait:before {
-    content: "\e805";
-}
-
-.mdi-image-crop-square:before {
-    content: "\e806";
-}
-
-.mdi-image-crop:before {
-    content: "\e807";
-}
-
-.mdi-image-dehaze:before {
-    content: "\e808";
-}
-
-.mdi-image-details:before {
-    content: "\e809";
-}
-
-.mdi-image-edit:before {
-    content: "\e80a";
-}
-
-.mdi-image-exposure-minus-1:before {
-    content: "\e80b";
-}
-
-.mdi-image-exposure-minus-2:before {
-    content: "\e80c";
-}
-
-.mdi-image-exposure-plus-1:before {
-    content: "\e80d";
-}
-
-.mdi-image-exposure-plus-2:before {
-    content: "\e80e";
-}
-
-.mdi-image-exposure-zero:before {
-    content: "\e80f";
-}
-
-.mdi-image-exposure:before {
-    content: "\e810";
-}
-
-.mdi-image-filter-1:before {
-    content: "\e811";
-}
-
-.mdi-image-filter-2:before {
-    content: "\e812";
-}
-
-.mdi-image-filter-3:before {
-    content: "\e813";
-}
-
-.mdi-image-filter-4:before {
-    content: "\e814";
-}
-
-.mdi-image-filter-5:before {
-    content: "\e815";
-}
-
-.mdi-image-filter-6:before {
-    content: "\e816";
-}
-
-.mdi-image-filter-7:before {
-    content: "\e817";
-}
-
-.mdi-image-filter-8:before {
-    content: "\e818";
-}
-
-.mdi-image-filter-9-plus:before {
-    content: "\e819";
-}
-
-.mdi-image-filter-9:before {
-    content: "\e81a";
-}
-
-.mdi-image-filter-b-and-w:before {
-    content: "\e81b";
-}
-
-.mdi-image-filter-center-focus:before {
-    content: "\e81c";
-}
-
-.mdi-image-filter-drama:before {
-    content: "\e81d";
-}
-
-.mdi-image-filter-frames:before {
-    content: "\e81e";
-}
-
-.mdi-image-filter-hdr:before {
-    content: "\e81f";
-}
-
-.mdi-image-filter-none:before {
-    content: "\e820";
-}
-
-.mdi-image-filter-tilt-shift:before {
-    content: "\e821";
-}
-
-.mdi-image-filter-vintage:before {
-    content: "\e822";
-}
-
-.mdi-image-filter:before {
-    content: "\e823";
-}
-
-.mdi-image-flare:before {
-    content: "\e824";
-}
-
-.mdi-image-flash-auto:before {
-    content: "\e825";
-}
-
-.mdi-image-flash-off:before {
-    content: "\e826";
-}
-
-.mdi-image-flash-on:before {
-    content: "\e827";
-}
-
-.mdi-image-flip:before {
-    content: "\e828";
-}
-
-.mdi-image-gradient:before {
-    content: "\e829";
-}
-
-.mdi-image-grain:before {
-    content: "\e82a";
-}
-
-.mdi-image-grid-off:before {
-    content: "\e82b";
-}
-
-.mdi-image-grid-on:before {
-    content: "\e82c";
-}
-
-.mdi-image-hdr-off:before {
-    content: "\e82d";
-}
-
-.mdi-image-hdr-on:before {
-    content: "\e82e";
-}
-
-.mdi-image-hdr-strong:before {
-    content: "\e82f";
-}
-
-.mdi-image-hdr-weak:before {
-    content: "\e830";
-}
-
-.mdi-image-healing:before {
-    content: "\e831";
-}
-
-.mdi-image-image-aspect-ratio:before {
-    content: "\e832";
-}
-
-.mdi-image-image:before {
-    content: "\e833";
-}
-
-.mdi-image-iso:before {
-    content: "\e834";
-}
-
-.mdi-image-landscape:before {
-    content: "\e835";
-}
-
-.mdi-image-leak-add:before {
-    content: "\e836";
-}
-
-.mdi-image-leak-remove:before {
-    content: "\e837";
-}
-
-.mdi-image-lens:before {
-    content: "\e838";
-}
-
-.mdi-image-looks-3:before {
-    content: "\e839";
-}
-
-.mdi-image-looks-4:before {
-    content: "\e83a";
-}
-
-.mdi-image-looks-5:before {
-    content: "\e83b";
-}
-
-.mdi-image-looks-6:before {
-    content: "\e83c";
-}
-
-.mdi-image-looks-one:before {
-    content: "\e83d";
-}
-
-.mdi-image-looks-two:before {
-    content: "\e83e";
-}
-
-.mdi-image-looks:before {
-    content: "\e83f";
-}
-
-.mdi-image-loupe:before {
-    content: "\e840";
-}
-
-.mdi-image-movie-creation:before {
-    content: "\e841";
-}
-
-.mdi-image-nature-people:before {
-    content: "\e842";
-}
-
-.mdi-image-nature:before {
-    content: "\e843";
-}
-
-.mdi-image-navigate-before:before {
-    content: "\e844";
-}
-
-.mdi-image-navigate-next:before {
-    content: "\e845";
-}
-
-.mdi-image-palette:before {
-    content: "\e846";
-}
-
-.mdi-image-panorama-fisheye:before {
-    content: "\e847";
-}
-
-.mdi-image-panorama-horizontal:before {
-    content: "\e848";
-}
-
-.mdi-image-panorama-vertical:before {
-    content: "\e849";
-}
-
-.mdi-image-panorama-wide-angle:before {
-    content: "\e84a";
-}
-
-.mdi-image-panorama:before {
-    content: "\e84b";
-}
-
-.mdi-image-photo-album:before {
-    content: "\e84c";
-}
-
-.mdi-image-photo-camera:before {
-    content: "\e84d";
-}
-
-.mdi-image-photo-library:before {
-    content: "\e84e";
-}
-
-.mdi-image-photo:before {
-    content: "\e84f";
-}
-
-.mdi-image-portrait:before {
-    content: "\e850";
-}
-
-.mdi-image-remove-red-eye:before {
-    content: "\e851";
-}
-
-.mdi-image-rotate-left:before {
-    content: "\e852";
-}
-
-.mdi-image-rotate-right:before {
-    content: "\e853";
-}
-
-.mdi-image-slideshow:before {
-    content: "\e854";
-}
-
-.mdi-image-straighten:before {
-    content: "\e855";
-}
-
-.mdi-image-style:before {
-    content: "\e856";
-}
-
-.mdi-image-switch-camera:before {
-    content: "\e857";
-}
-
-.mdi-image-switch-video:before {
-    content: "\e858";
-}
-
-.mdi-image-tag-faces:before {
-    content: "\e859";
-}
-
-.mdi-image-texture:before {
-    content: "\e85a";
-}
-
-.mdi-image-timelapse:before {
-    content: "\e85b";
-}
-
-.mdi-image-timer-3:before {
-    content: "\e85c";
-}
-
-.mdi-image-timer-10:before {
-    content: "\e85d";
-}
-
-.mdi-image-timer-auto:before {
-    content: "\e85e";
-}
-
-.mdi-image-timer-off:before {
-    content: "\e85f";
-}
-
-.mdi-image-timer:before {
-    content: "\e860";
-}
-
-.mdi-image-tonality:before {
-    content: "\e861";
-}
-
-.mdi-image-transform:before {
-    content: "\e862";
-}
-
-.mdi-image-tune:before {
-    content: "\e863";
-}
-
-.mdi-image-wb-auto:before {
-    content: "\e864";
-}
-
-.mdi-image-wb-cloudy:before {
-    content: "\e865";
-}
-
-.mdi-image-wb-incandescent:before {
-    content: "\e866";
-}
-
-.mdi-image-wb-irradescent:before {
-    content: "\e867";
-}
-
-.mdi-image-wb-sunny:before {
-    content: "\e868";
-}
-
-.mdi-maps-beenhere:before {
-    content: "\e869";
-}
-
-.mdi-maps-directions-bike:before {
-    content: "\e86a";
-}
-
-.mdi-maps-directions-bus:before {
-    content: "\e86b";
-}
-
-.mdi-maps-directions-car:before {
-    content: "\e86c";
-}
-
-.mdi-maps-directions-ferry:before {
-    content: "\e86d";
-}
-
-.mdi-maps-directions-subway:before {
-    content: "\e86e";
-}
-
-.mdi-maps-directions-train:before {
-    content: "\e86f";
-}
-
-.mdi-maps-directions-transit:before {
-    content: "\e870";
-}
-
-.mdi-maps-directions-walk:before {
-    content: "\e871";
-}
-
-.mdi-maps-directions:before {
-    content: "\e872";
-}
-
-.mdi-maps-flight:before {
-    content: "\e873";
-}
-
-.mdi-maps-hotel:before {
-    content: "\e874";
-}
-
-.mdi-maps-layers-clear:before {
-    content: "\e875";
-}
-
-.mdi-maps-layers:before {
-    content: "\e876";
-}
-
-.mdi-maps-local-airport:before {
-    content: "\e877";
-}
-
-.mdi-maps-local-atm:before {
-    content: "\e878";
-}
-
-.mdi-maps-local-attraction:before {
-    content: "\e879";
-}
-
-.mdi-maps-local-bar:before {
-    content: "\e87a";
-}
-
-.mdi-maps-local-cafe:before {
-    content: "\e87b";
-}
-
-.mdi-maps-local-car-wash:before {
-    content: "\e87c";
-}
-
-.mdi-maps-local-convenience-store:before {
-    content: "\e87d";
-}
-
-.mdi-maps-local-drink:before {
-    content: "\e87e";
-}
-
-.mdi-maps-local-florist:before {
-    content: "\e87f";
-}
-
-.mdi-maps-local-gas-station:before {
-    content: "\e880";
-}
-
-.mdi-maps-local-grocery-store:before {
-    content: "\e881";
-}
-
-.mdi-maps-local-hospital:before {
-    content: "\e882";
-}
-
-.mdi-maps-local-hotel:before {
-    content: "\e883";
-}
-
-.mdi-maps-local-laundry-service:before {
-    content: "\e884";
-}
-
-.mdi-maps-local-library:before {
-    content: "\e885";
-}
-
-.mdi-maps-local-mall:before {
-    content: "\e886";
-}
-
-.mdi-maps-local-movies:before {
-    content: "\e887";
-}
-
-.mdi-maps-local-offer:before {
-    content: "\e888";
-}
-
-.mdi-maps-local-parking:before {
-    content: "\e889";
-}
-
-.mdi-maps-local-pharmacy:before {
-    content: "\e88a";
-}
-
-.mdi-maps-local-phone:before {
-    content: "\e88b";
-}
-
-.mdi-maps-local-pizza:before {
-    content: "\e88c";
-}
-
-.mdi-maps-local-play:before {
-    content: "\e88d";
-}
-
-.mdi-maps-local-post-office:before {
-    content: "\e88e";
-}
-
-.mdi-maps-local-print-shop:before {
-    content: "\e88f";
-}
-
-.mdi-maps-local-restaurant:before {
-    content: "\e890";
-}
-
-.mdi-maps-local-see:before {
-    content: "\e891";
-}
-
-.mdi-maps-local-shipping:before {
-    content: "\e892";
-}
-
-.mdi-maps-local-taxi:before {
-    content: "\e893";
-}
-
-.mdi-maps-location-history:before {
-    content: "\e894";
-}
-
-.mdi-maps-map:before {
-    content: "\e895";
-}
-
-.mdi-maps-my-location:before {
-    content: "\e896";
-}
-
-.mdi-maps-navigation:before {
-    content: "\e897";
-}
-
-.mdi-maps-pin-drop:before {
-    content: "\e898";
-}
-
-.mdi-maps-place:before {
-    content: "\e899";
-}
-
-.mdi-maps-rate-review:before {
-    content: "\e89a";
-}
-
-.mdi-maps-restaurant-menu:before {
-    content: "\e89b";
-}
-
-.mdi-maps-satellite:before {
-    content: "\e89c";
-}
-
-.mdi-maps-store-mall-directory:before {
-    content: "\e89d";
-}
-
-.mdi-maps-terrain:before {
-    content: "\e89e";
-}
-
-.mdi-maps-traffic:before {
-    content: "\e89f";
-}
-
-.mdi-navigation-apps:before {
-    content: "\e8a0";
-}
-
-.mdi-navigation-arrow-back:before {
-    content: "\e8a1";
-}
-
-.mdi-navigation-arrow-drop-down-circle:before {
-    content: "\e8a2";
-}
-
-.mdi-navigation-arrow-drop-down:before {
-    content: "\e8a3";
-}
-
-.mdi-navigation-arrow-drop-up:before {
-    content: "\e8a4";
-}
-
-.mdi-navigation-arrow-forward:before {
-    content: "\e8a5";
-}
-
-.mdi-navigation-cancel:before {
-    content: "\e8a6";
-}
-
-.mdi-navigation-check:before {
-    content: "\e8a7";
-}
-
-.mdi-navigation-chevron-left:before {
-    content: "\e8a8";
-}
-
-.mdi-navigation-chevron-right:before {
-    content: "\e8a9";
-}
-
-.mdi-navigation-close:before {
-    content: "\e8aa";
-}
-
-.mdi-navigation-expand-less:before {
-    content: "\e8ab";
-}
-
-.mdi-navigation-expand-more:before {
-    content: "\e8ac";
-}
-
-.mdi-navigation-fullscreen-exit:before {
-    content: "\e8ad";
-}
-
-.mdi-navigation-fullscreen:before {
-    content: "\e8ae";
-}
-
-.mdi-navigation-menu:before {
-    content: "\e8af";
-}
-
-.mdi-navigation-more-horiz:before {
-    content: "\e8b0";
-}
-
-.mdi-navigation-more-vert:before {
-    content: "\e8b1";
-}
-
-.mdi-navigation-refresh:before {
-    content: "\e8b2";
-}
-
-.mdi-navigation-unfold-less:before {
-    content: "\e8b3";
-}
-
-.mdi-navigation-unfold-more:before {
-    content: "\e8b4";
-}
-
-.mdi-notification-adb:before {
-    content: "\e8b5";
-}
-
-.mdi-notification-bluetooth-audio:before {
-    content: "\e8b6";
-}
-
-.mdi-notification-disc-full:before {
-    content: "\e8b7";
-}
-
-.mdi-notification-dnd-forwardslash:before {
-    content: "\e8b8";
-}
-
-.mdi-notification-do-not-disturb:before {
-    content: "\e8b9";
-}
-
-.mdi-notification-drive-eta:before {
-    content: "\e8ba";
-}
-
-.mdi-notification-event-available:before {
-    content: "\e8bb";
-}
-
-.mdi-notification-event-busy:before {
-    content: "\e8bc";
-}
-
-.mdi-notification-event-note:before {
-    content: "\e8bd";
-}
-
-.mdi-notification-folder-special:before {
-    content: "\e8be";
-}
-
-.mdi-notification-mms:before {
-    content: "\e8bf";
-}
-
-.mdi-notification-more:before {
-    content: "\e8c0";
-}
-
-.mdi-notification-network-locked:before {
-    content: "\e8c1";
-}
-
-.mdi-notification-phone-bluetooth-speaker:before {
-    content: "\e8c2";
-}
-
-.mdi-notification-phone-forwarded:before {
-    content: "\e8c3";
-}
-
-.mdi-notification-phone-in-talk:before {
-    content: "\e8c4";
-}
-
-.mdi-notification-phone-locked:before {
-    content: "\e8c5";
-}
-
-.mdi-notification-phone-missed:before {
-    content: "\e8c6";
-}
-
-.mdi-notification-phone-paused:before {
-    content: "\e8c7";
-}
-
-.mdi-notification-play-download:before {
-    content: "\e8c8";
-}
-
-.mdi-notification-play-install:before {
-    content: "\e8c9";
-}
-
-.mdi-notification-sd-card:before {
-    content: "\e8ca";
-}
-
-.mdi-notification-sim-card-alert:before {
-    content: "\e8cb";
-}
-
-.mdi-notification-sms-failed:before {
-    content: "\e8cc";
-}
-
-.mdi-notification-sms:before {
-    content: "\e8cd";
-}
-
-.mdi-notification-sync-disabled:before {
-    content: "\e8ce";
-}
-
-.mdi-notification-sync-problem:before {
-    content: "\e8cf";
-}
-
-.mdi-notification-sync:before {
-    content: "\e8d0";
-}
-
-.mdi-notification-system-update:before {
-    content: "\e8d1";
-}
-
-.mdi-notification-tap-and-play:before {
-    content: "\e8d2";
-}
-
-.mdi-notification-time-to-leave:before {
-    content: "\e8d3";
-}
-
-.mdi-notification-vibration:before {
-    content: "\e8d4";
-}
-
-.mdi-notification-voice-chat:before {
-    content: "\e8d5";
-}
-
-.mdi-notification-vpn-lock:before {
-    content: "\e8d6";
-}
-
-.mdi-social-cake:before {
-    content: "\e8d7";
-}
-
-.mdi-social-domain:before {
-    content: "\e8d8";
-}
-
-.mdi-social-group-add:before {
-    content: "\e8d9";
-}
-
-.mdi-social-group:before {
-    content: "\e8da";
-}
-
-.mdi-social-location-city:before {
-    content: "\e8db";
-}
-
-.mdi-social-mood:before {
-    content: "\e8dc";
-}
-
-.mdi-social-notifications-none:before {
-    content: "\e8dd";
-}
-
-.mdi-social-notifications-off:before {
-    content: "\e8de";
-}
-
-.mdi-social-notifications-on:before {
-    content: "\e8df";
-}
-
-.mdi-social-notifications-paused:before {
-    content: "\e8e0";
-}
-
-.mdi-social-notifications:before {
-    content: "\e8e1";
-}
-
-.mdi-social-pages:before {
-    content: "\e8e2";
-}
-
-.mdi-social-party-mode:before {
-    content: "\e8e3";
-}
-
-.mdi-social-people-outline:before {
-    content: "\e8e4";
-}
-
-.mdi-social-people:before {
-    content: "\e8e5";
-}
-
-.mdi-social-person-add:before {
-    content: "\e8e6";
-}
-
-.mdi-social-person-outline:before {
-    content: "\e8e7";
-}
-
-.mdi-social-person:before {
-    content: "\e8e8";
-}
-
-.mdi-social-plus-one:before {
-    content: "\e8e9";
-}
-
-.mdi-social-poll:before {
-    content: "\e8ea";
-}
-
-.mdi-social-public:before {
-    content: "\e8eb";
-}
-
-.mdi-social-school:before {
-    content: "\e8ec";
-}
-
-.mdi-social-share:before {
-    content: "\e8ed";
-}
-
-.mdi-social-whatshot:before {
-    content: "\e8ee";
-}
-
-.mdi-toggle-check-box-outline-blank:before {
-    content: "\e8ef";
-}
-
-.mdi-toggle-check-box:before {
-    content: "\e8f0";
-}
-
-.mdi-toggle-radio-button-off:before {
-    content: "\e8f1";
-}
-
-.mdi-toggle-radio-button-on:before {
-    content: "\e8f2";
-}
-
-.mdi-toggle-star-half:before {
-    content: "\e8f3";
-}
-
-.mdi-toggle-star-outline:before {
-    content: "\e8f4";
-}
-
-.mdi-toggle-star:before {
-    content: "\e8f5";
-}
+//@font-face {
+//    font-family: 'Material-Design-Icons';
+//    src:url('#{$mdb-font-path}/Material-Design-Icons.eot?3ocs8m');
+//    src:url('#{$mdb-font-path}/Material-Design-Icons.eot?#iefix3ocs8m') format('embedded-opentype'),
+//        url('#{$mdb-font-path}/Material-Design-Icons.woff?3ocs8m') format('woff'),
+//        url('#{$mdb-font-path}/Material-Design-Icons.ttf?3ocs8m') format('truetype'),
+//        url('#{$mdb-font-path}/Material-Design-Icons.svg?3ocs8m#Material-Design-Icons') format('svg');
+//    font-weight: normal;
+//    font-style: normal;
+//}
+//
+//[class^="mdi-"], [class*="mdi-"] {
+//    speak: none;
+//    display: inline-block;
+//    font: normal normal normal 24px/1 'Material-Design-Icons';
+//    text-rendering: auto;
+//    /* Better Font Rendering =========== */
+//    -webkit-font-smoothing: antialiased;
+//    -moz-osx-font-smoothing: grayscale;
+//    transform: translate(0, 0);
+//    &:before {
+//        display: inline-block;
+//        speak: none;
+//        text-decoration: inherit;
+//    }
+//    &.pull-left {
+//        margin-right: .3em;
+//    }
+//    &.pull-right{
+//        margin-left: .3em;
+//    }
+//    &.mdi-lg:before, &.mdi-lg:after {
+//        font-size: 1.33333333em;
+//        line-height: 0.75em;
+//        vertical-align: -15%;
+//    }
+//    &.mdi-2x:before, &.mdi-2x:after {
+//        font-size: 2em;
+//    }
+//    &.mdi-3x:before, &.mdi-3x:after {
+//        font-size: 3em;
+//    }
+//    &.mdi-4x:before, &.mdi-4x:after {
+//        font-size: 4em;
+//    }
+//    &.mdi-5x:before, &.mdi-5x:after {
+//        font-size: 5em;
+//    }
+//}
+//
+//[class^="mdi-device-signal-cellular-"],
+//[class^="mdi-device-battery-"],
+//[class^="mdi-device-battery-charging-"],
+//[class^="mdi-device-signal-cellular-connected-no-internet-"],
+//[class^="mdi-device-signal-wifi-"],
+//[class^="mdi-device-signal-wifi-statusbar-not-connected"],
+//.mdi-device-network-wifi{
+//    &:after {
+//        opacity: .3;
+//        position: absolute;
+//        left: 0;
+//        top: 0;
+//        z-index: 1;
+//        display: inline-block;
+//        speak: none;
+//        text-decoration: inherit;
+//    }
+//}
+//
+//[class^="mdi-device-signal-cellular-"]:after {content:"\e758";}
+//[class^="mdi-device-battery-"]:after {content:"\e735";}
+//[class^="mdi-device-battery-charging-"]:after {content:"\e733";}
+//[class^="mdi-device-signal-cellular-connected-no-internet-"]:after {content:"\e75d";}
+//[class^="mdi-device-signal-wifi-"]:after, .mdi-device-network-wifi:after {content:"\e765";}
+//[class^="mdi-device-signal-wifi-statusbasr-not-connected"]:after {content:"\e8f7";}
+//
+//.mdi-device-signal-cellular-off, .mdi-device-signal-cellular-null, .mdi-device-signal-cellular-no-sim, .mdi-device-signal-wifi-off, .mdi-device-signal-wifi-4-bar, .mdi-device-signal-cellular-4-bar, .mdi-device-battery-alert, .mdi-device-signal-cellular-connected-no-internet-4-bar, .mdi-device-battery-std, .mdi-device-battery-full .mdi-device-battery-unknown {
+//    &:after {
+//        content: "";
+//    }
+//}
+//
+//.mdi-fw {
+//    width: 1.28571429em;
+//    text-align: center;
+//}
+//.mdi-ul {
+//    padding-left: 0;
+//    margin-left: 2.14285714em;
+//    list-style-type: none;
+//}
+//.mdi-ul > li {
+//    position: relative;
+//}
+//.mdi-li {
+//    position: absolute;
+//    left: -2.14285714em;
+//    width: 2.14285714em;
+//    top: 0.14285714em;
+//    text-align: center;
+//}
+//.mdi-li.mdi-lg {
+//    left: -1.85714286em;
+//}
+//.mdi-border {
+//    padding: .2em .25em .15em;
+//    border: solid 0.08em #eeeeee;
+//    border-radius: .1em;
+//}
+//
+//.mdi-spin {
+//    -webkit-animation: mdi-spin 2s infinite linear;
+//    animation: mdi-spin 2s infinite linear;
+//    -webkit-transform-origin: 50% 50%;
+//    -moz-transform-origin: 50% 50%;
+//    -o-transform-origin: 50% 50%;
+//    transform-origin: 50% 50%;
+//}
+//.mdi-pulse {
+//    -webkit-animation: mdi-spin 1s steps(8) infinite;
+//    animation: mdi-spin 1s steps(8) infinite ;
+//    -webkit-transform-origin: 50% 50%;
+//    -moz-transform-origin: 50% 50%;
+//    -o-transform-origin: 50% 50%;
+//    transform-origin: 50% 50%;
+//}
+//@-webkit-keyframes mdi-spin {
+//    0% {
+//        -webkit-transform: rotate(0deg);
+//        transform: rotate(0deg);
+//    }
+//    100% {
+//        -webkit-transform: rotate(359deg);
+//        transform: rotate(359deg);
+//    }
+//}
+//@keyframes mdi-spin {
+//    0% {
+//        -webkit-transform: rotate(0deg);
+//        transform: rotate(0deg);
+//    }
+//    100% {
+//        -webkit-transform: rotate(359deg);
+//        transform: rotate(359deg);
+//    }
+//}
+//.mdi-rotate-90 {
+//    filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=1);
+//    -webkit-transform: rotate(90deg);
+//    -ms-transform: rotate(90deg);
+//    transform: rotate(90deg);
+//}
+//.mdi-rotate-180 {
+//    filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=2);
+//    -webkit-transform: rotate(180deg);
+//    -ms-transform: rotate(180deg);
+//    transform: rotate(180deg);
+//}
+//.mdi-rotate-270 {
+//    filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
+//    -webkit-transform: rotate(270deg);
+//    -ms-transform: rotate(270deg);
+//    transform: rotate(270deg);
+//}
+//.mdi-flip-horizontal {
+//    filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=0, mirror=1);
+//    -webkit-transform: scale(-1, 1);
+//    -ms-transform: scale(-1, 1);
+//    transform: scale(-1, 1);
+//}
+//.mdi-flip-vertical {
+//    filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=2, mirror=1);
+//    -webkit-transform: scale(1, -1);
+//    -ms-transform: scale(1, -1);
+//    transform: scale(1, -1);
+//}
+//:root .mdi-rotate-90,
+//:root .mdi-rotate-180,
+//:root .mdi-rotate-270,
+//:root .mdi-flip-horizontal,
+//:root .mdi-flip-vertical {
+//    filter: none;
+//}
+//.mdi-stack {
+//    position: relative;
+//    display: inline-block;
+//    width: 2em;
+//    height: 2em;
+//    line-height: 2em;
+//    vertical-align: middle;
+//}
+//.mdi-stack-1x,
+//.mdi-stack-2x {
+//    position: absolute;
+//    left: 0;
+//    width: 100%;
+//    text-align: center;
+//}
+//.mdi-stack-1x {
+//    line-height: inherit;
+//}
+//.mdi-stack-2x {
+//    font-size: 2em;
+//}
+//.mdi-inverse {
+//    color: #ffffff;
+//}
+//
+//
+///* Start Icons */
+//
+//.mdi-action-3d-rotation:before {
+//    content: "\e600";
+//}
+//
+//.mdi-action-accessibility:before {
+//    content: "\e601";
+//}
+//
+//.mdi-action-account-balance-wallet:before {
+//    content: "\e602";
+//}
+//
+//.mdi-action-account-balance:before {
+//    content: "\e603";
+//}
+//
+//.mdi-action-account-box:before {
+//    content: "\e604";
+//}
+//
+//.mdi-action-account-child:before {
+//    content: "\e605";
+//}
+//
+//.mdi-action-account-circle:before {
+//    content: "\e606";
+//}
+//
+//.mdi-action-add-shopping-cart:before {
+//    content: "\e607";
+//}
+//
+//.mdi-action-alarm-add:before {
+//    content: "\e608";
+//}
+//
+//.mdi-action-alarm-off:before {
+//    content: "\e609";
+//}
+//
+//.mdi-action-alarm-on:before {
+//    content: "\e60a";
+//}
+//
+//.mdi-action-alarm:before {
+//    content: "\e60b";
+//}
+//
+//.mdi-action-android:before {
+//    content: "\e60c";
+//}
+//
+//.mdi-action-announcement:before {
+//    content: "\e60d";
+//}
+//
+//.mdi-action-aspect-ratio:before {
+//    content: "\e60e";
+//}
+//
+//.mdi-action-assessment:before {
+//    content: "\e60f";
+//}
+//
+//.mdi-action-assignment-ind:before {
+//    content: "\e610";
+//}
+//
+//.mdi-action-assignment-late:before {
+//    content: "\e611";
+//}
+//
+//.mdi-action-assignment-return:before {
+//    content: "\e612";
+//}
+//
+//.mdi-action-assignment-returned:before {
+//    content: "\e613";
+//}
+//
+//.mdi-action-assignment-turned-in:before {
+//    content: "\e614";
+//}
+//
+//.mdi-action-assignment:before {
+//    content: "\e615";
+//}
+//
+//.mdi-action-autorenew:before {
+//    content: "\e616";
+//}
+//
+//.mdi-action-backup:before {
+//    content: "\e617";
+//}
+//
+//.mdi-action-book:before {
+//    content: "\e618";
+//}
+//
+//.mdi-action-bookmark-outline:before {
+//    content: "\e619";
+//}
+//
+//.mdi-action-bookmark:before {
+//    content: "\e61a";
+//}
+//
+//.mdi-action-bug-report:before {
+//    content: "\e61b";
+//}
+//
+//.mdi-action-cached:before {
+//    content: "\e61c";
+//}
+//
+//.mdi-action-check-circle:before {
+//    content: "\e61d";
+//}
+//
+//.mdi-action-class:before {
+//    content: "\e61e";
+//}
+//
+//.mdi-action-credit-card:before {
+//    content: "\e61f";
+//}
+//
+//.mdi-action-dashboard:before {
+//    content: "\e620";
+//}
+//
+//.mdi-action-delete:before {
+//    content: "\e621";
+//}
+//
+//.mdi-action-description:before {
+//    content: "\e622";
+//}
+//
+//.mdi-action-dns:before {
+//    content: "\e623";
+//}
+//
+//.mdi-action-done-all:before {
+//    content: "\e624";
+//}
+//
+//.mdi-action-done:before {
+//    content: "\e625";
+//}
+//
+//.mdi-action-event:before {
+//    content: "\e626";
+//}
+//
+//.mdi-action-exit-to-app:before {
+//    content: "\e627";
+//}
+//
+//.mdi-action-explore:before {
+//    content: "\e628";
+//}
+//
+//.mdi-action-extension:before {
+//    content: "\e629";
+//}
+//
+//.mdi-action-face-unlock:before {
+//    content: "\e62a";
+//}
+//
+//.mdi-action-favorite-outline:before {
+//    content: "\e62b";
+//}
+//
+//.mdi-action-favorite:before {
+//    content: "\e62c";
+//}
+//
+//.mdi-action-find-in-page:before {
+//    content: "\e62d";
+//}
+//
+//.mdi-action-find-replace:before {
+//    content: "\e62e";
+//}
+//
+//.mdi-action-flip-to-back:before {
+//    content: "\e62f";
+//}
+//
+//.mdi-action-flip-to-front:before {
+//    content: "\e630";
+//}
+//
+//.mdi-action-get-app:before {
+//    content: "\e631";
+//}
+//
+//.mdi-action-grade:before {
+//    content: "\e632";
+//}
+//
+//.mdi-action-group-work:before {
+//    content: "\e633";
+//}
+//
+//.mdi-action-help:before {
+//    content: "\e634";
+//}
+//
+//.mdi-action-highlight-remove:before {
+//    content: "\e635";
+//}
+//
+//.mdi-action-history:before {
+//    content: "\e636";
+//}
+//
+//.mdi-action-home:before {
+//    content: "\e637";
+//}
+//
+//.mdi-action-https:before {
+//    content: "\e638";
+//}
+//
+//.mdi-action-info-outline:before {
+//    content: "\e639";
+//}
+//
+//.mdi-action-info:before {
+//    content: "\e63a";
+//}
+//
+//.mdi-action-input:before {
+//    content: "\e63b";
+//}
+//
+//.mdi-action-invert-colors:before {
+//    content: "\e63c";
+//}
+//
+//.mdi-action-label-outline:before {
+//    content: "\e63d";
+//}
+//
+//.mdi-action-label:before {
+//    content: "\e63e";
+//}
+//
+//.mdi-action-language:before {
+//    content: "\e63f";
+//}
+//
+//.mdi-action-launch:before {
+//    content: "\e640";
+//}
+//
+//.mdi-action-list:before {
+//    content: "\e641";
+//}
+//
+//.mdi-action-lock-open:before {
+//    content: "\e642";
+//}
+//
+//.mdi-action-lock-outline:before {
+//    content: "\e643";
+//}
+//
+//.mdi-action-lock:before {
+//    content: "\e644";
+//}
+//
+//.mdi-action-loyalty:before {
+//    content: "\e645";
+//}
+//
+//.mdi-action-markunread-mailbox:before {
+//    content: "\e646";
+//}
+//
+//.mdi-action-note-add:before {
+//    content: "\e647";
+//}
+//
+//.mdi-action-open-in-browser:before {
+//    content: "\e648";
+//}
+//
+//.mdi-action-open-in-new:before {
+//    content: "\e649";
+//}
+//
+//.mdi-action-open-with:before {
+//    content: "\e64a";
+//}
+//
+//.mdi-action-pageview:before {
+//    content: "\e64b";
+//}
+//
+//.mdi-action-payment:before {
+//    content: "\e64c";
+//}
+//
+//.mdi-action-perm-camera-mic:before {
+//    content: "\e64d";
+//}
+//
+//.mdi-action-perm-contact-cal:before {
+//    content: "\e64e";
+//}
+//
+//.mdi-action-perm-data-setting:before {
+//    content: "\e64f";
+//}
+//
+//.mdi-action-perm-device-info:before {
+//    content: "\e650";
+//}
+//
+//.mdi-action-perm-identity:before {
+//    content: "\e651";
+//}
+//
+//.mdi-action-perm-media:before {
+//    content: "\e652";
+//}
+//
+//.mdi-action-perm-phone-msg:before {
+//    content: "\e653";
+//}
+//
+//.mdi-action-perm-scan-wifi:before {
+//    content: "\e654";
+//}
+//
+//.mdi-action-picture-in-picture:before {
+//    content: "\e655";
+//}
+//
+//.mdi-action-polymer:before {
+//    content: "\e656";
+//}
+//
+//.mdi-action-print:before {
+//    content: "\e657";
+//}
+//
+//.mdi-action-query-builder:before {
+//    content: "\e658";
+//}
+//
+//.mdi-action-question-answer:before {
+//    content: "\e659";
+//}
+//
+//.mdi-action-receipt:before {
+//    content: "\e65a";
+//}
+//
+//.mdi-action-redeem:before {
+//    content: "\e65b";
+//}
+//
+//.mdi-action-reorder:before {
+//    content: "\e65c";
+//}
+//
+//.mdi-action-report-problem:before {
+//    content: "\e65d";
+//}
+//
+//.mdi-action-restore:before {
+//    content: "\e65e";
+//}
+//
+//.mdi-action-room:before {
+//    content: "\e65f";
+//}
+//
+//.mdi-action-schedule:before {
+//    content: "\e660";
+//}
+//
+//.mdi-action-search:before {
+//    content: "\e661";
+//}
+//
+//.mdi-action-settings-applications:before {
+//    content: "\e662";
+//}
+//
+//.mdi-action-settings-backup-restore:before {
+//    content: "\e663";
+//}
+//
+//.mdi-action-settings-bluetooth:before {
+//    content: "\e664";
+//}
+//
+//.mdi-action-settings-cell:before {
+//    content: "\e665";
+//}
+//
+//.mdi-action-settings-display:before {
+//    content: "\e666";
+//}
+//
+//.mdi-action-settings-ethernet:before {
+//    content: "\e667";
+//}
+//
+//.mdi-action-settings-input-antenna:before {
+//    content: "\e668";
+//}
+//
+//.mdi-action-settings-input-component:before {
+//    content: "\e669";
+//}
+//
+//.mdi-action-settings-input-composite:before {
+//    content: "\e66a";
+//}
+//
+//.mdi-action-settings-input-hdmi:before {
+//    content: "\e66b";
+//}
+//
+//.mdi-action-settings-input-svideo:before {
+//    content: "\e66c";
+//}
+//
+//.mdi-action-settings-overscan:before {
+//    content: "\e66d";
+//}
+//
+//.mdi-action-settings-phone:before {
+//    content: "\e66e";
+//}
+//
+//.mdi-action-settings-power:before {
+//    content: "\e66f";
+//}
+//
+//.mdi-action-settings-remote:before {
+//    content: "\e670";
+//}
+//
+//.mdi-action-settings-voice:before {
+//    content: "\e671";
+//}
+//
+//.mdi-action-settings:before {
+//    content: "\e672";
+//}
+//
+//.mdi-action-shop-two:before {
+//    content: "\e673";
+//}
+//
+//.mdi-action-shop:before {
+//    content: "\e674";
+//}
+//
+//.mdi-action-shopping-basket:before {
+//    content: "\e675";
+//}
+//
+//.mdi-action-shopping-cart:before {
+//    content: "\e676";
+//}
+//
+//.mdi-action-speaker-notes:before {
+//    content: "\e677";
+//}
+//
+//.mdi-action-spellcheck:before {
+//    content: "\e678";
+//}
+//
+//.mdi-action-star-rate:before {
+//    content: "\e679";
+//}
+//
+//.mdi-action-stars:before {
+//    content: "\e67a";
+//}
+//
+//.mdi-action-store:before {
+//    content: "\e67b";
+//}
+//
+//.mdi-action-subject:before {
+//    content: "\e67c";
+//}
+//
+//.mdi-action-supervisor-account:before {
+//    content: "\e67d";
+//}
+//
+//.mdi-action-swap-horiz:before {
+//    content: "\e67e";
+//}
+//
+//.mdi-action-swap-vert-circle:before {
+//    content: "\e67f";
+//}
+//
+//.mdi-action-swap-vert:before {
+//    content: "\e680";
+//}
+//
+//.mdi-action-system-update-tv:before {
+//    content: "\e681";
+//}
+//
+//.mdi-action-tab-unselected:before {
+//    content: "\e682";
+//}
+//
+//.mdi-action-tab:before {
+//    content: "\e683";
+//}
+//
+//.mdi-action-theaters:before {
+//    content: "\e684";
+//}
+//
+//.mdi-action-thumb-down:before {
+//    content: "\e685";
+//}
+//
+//.mdi-action-thumb-up:before {
+//    content: "\e686";
+//}
+//
+//.mdi-action-thumbs-up-down:before {
+//    content: "\e687";
+//}
+//
+//.mdi-action-toc:before {
+//    content: "\e688";
+//}
+//
+//.mdi-action-today:before {
+//    content: "\e689";
+//}
+//
+//.mdi-action-track-changes:before {
+//    content: "\e68a";
+//}
+//
+//.mdi-action-translate:before {
+//    content: "\e68b";
+//}
+//
+//.mdi-action-trending-down:before {
+//    content: "\e68c";
+//}
+//
+//.mdi-action-trending-neutral:before {
+//    content: "\e68d";
+//}
+//
+//.mdi-action-trending-up:before {
+//    content: "\e68e";
+//}
+//
+//.mdi-action-turned-in-not:before {
+//    content: "\e68f";
+//}
+//
+//.mdi-action-turned-in:before {
+//    content: "\e690";
+//}
+//
+//.mdi-action-verified-user:before {
+//    content: "\e691";
+//}
+//
+//.mdi-action-view-agenda:before {
+//    content: "\e692";
+//}
+//
+//.mdi-action-view-array:before {
+//    content: "\e693";
+//}
+//
+//.mdi-action-view-carousel:before {
+//    content: "\e694";
+//}
+//
+//.mdi-action-view-column:before {
+//    content: "\e695";
+//}
+//
+//.mdi-action-view-day:before {
+//    content: "\e696";
+//}
+//
+//.mdi-action-view-headline:before {
+//    content: "\e697";
+//}
+//
+//.mdi-action-view-list:before {
+//    content: "\e698";
+//}
+//
+//.mdi-action-view-module:before {
+//    content: "\e699";
+//}
+//
+//.mdi-action-view-quilt:before {
+//    content: "\e69a";
+//}
+//
+//.mdi-action-view-stream:before {
+//    content: "\e69b";
+//}
+//
+//.mdi-action-view-week:before {
+//    content: "\e69c";
+//}
+//
+//.mdi-action-visibility-off:before {
+//    content: "\e69d";
+//}
+//
+//.mdi-action-visibility:before {
+//    content: "\e69e";
+//}
+//
+//.mdi-action-wallet-giftcard:before {
+//    content: "\e69f";
+//}
+//
+//.mdi-action-wallet-membership:before {
+//    content: "\e6a0";
+//}
+//
+//.mdi-action-wallet-travel:before {
+//    content: "\e6a1";
+//}
+//
+//.mdi-action-work:before {
+//    content: "\e6a2";
+//}
+//
+//.mdi-alert-error:before {
+//    content: "\e6a3";
+//}
+//
+//.mdi-alert-warning:before {
+//    content: "\e6a4";
+//}
+//
+//.mdi-av-album:before {
+//    content: "\e6a5";
+//}
+//
+//.mdi-av-closed-caption:before {
+//    content: "\e6a6";
+//}
+//
+//.mdi-av-equalizer:before {
+//    content: "\e6a7";
+//}
+//
+//.mdi-av-explicit:before {
+//    content: "\e6a8";
+//}
+//
+//.mdi-av-fast-forward:before {
+//    content: "\e6a9";
+//}
+//
+//.mdi-av-fast-rewind:before {
+//    content: "\e6aa";
+//}
+//
+//.mdi-av-games:before {
+//    content: "\e6ab";
+//}
+//
+//.mdi-av-hearing:before {
+//    content: "\e6ac";
+//}
+//
+//.mdi-av-high-quality:before {
+//    content: "\e6ad";
+//}
+//
+//.mdi-av-loop:before {
+//    content: "\e6ae";
+//}
+//
+//.mdi-av-mic-none:before {
+//    content: "\e6af";
+//}
+//
+//.mdi-av-mic-off:before {
+//    content: "\e6b0";
+//}
+//
+//.mdi-av-mic:before {
+//    content: "\e6b1";
+//}
+//
+//.mdi-av-movie:before {
+//    content: "\e6b2";
+//}
+//
+//.mdi-av-my-library-add:before {
+//    content: "\e6b3";
+//}
+//
+//.mdi-av-my-library-books:before {
+//    content: "\e6b4";
+//}
+//
+//.mdi-av-my-library-music:before {
+//    content: "\e6b5";
+//}
+//
+//.mdi-av-new-releases:before {
+//    content: "\e6b6";
+//}
+//
+//.mdi-av-not-interested:before {
+//    content: "\e6b7";
+//}
+//
+//.mdi-av-pause-circle-fill:before {
+//    content: "\e6b8";
+//}
+//
+//.mdi-av-pause-circle-outline:before {
+//    content: "\e6b9";
+//}
+//
+//.mdi-av-pause:before {
+//    content: "\e6ba";
+//}
+//
+//.mdi-av-play-arrow:before {
+//    content: "\e6bb";
+//}
+//
+//.mdi-av-play-circle-fill:before {
+//    content: "\e6bc";
+//}
+//
+//.mdi-av-play-circle-outline:before {
+//    content: "\e6bd";
+//}
+//
+//.mdi-av-play-shopping-bag:before {
+//    content: "\e6be";
+//}
+//
+//.mdi-av-playlist-add:before {
+//    content: "\e6bf";
+//}
+//
+//.mdi-av-queue-music:before {
+//    content: "\e6c0";
+//}
+//
+//.mdi-av-queue:before {
+//    content: "\e6c1";
+//}
+//
+//.mdi-av-radio:before {
+//    content: "\e6c2";
+//}
+//
+//.mdi-av-recent-actors:before {
+//    content: "\e6c3";
+//}
+//
+//.mdi-av-repeat-one:before {
+//    content: "\e6c4";
+//}
+//
+//.mdi-av-repeat:before {
+//    content: "\e6c5";
+//}
+//
+//.mdi-av-replay:before {
+//    content: "\e6c6";
+//}
+//
+//.mdi-av-shuffle:before {
+//    content: "\e6c7";
+//}
+//
+//.mdi-av-skip-next:before {
+//    content: "\e6c8";
+//}
+//
+//.mdi-av-skip-previous:before {
+//    content: "\e6c9";
+//}
+//
+//.mdi-av-snooze:before {
+//    content: "\e6ca";
+//}
+//
+//.mdi-av-stop:before {
+//    content: "\e6cb";
+//}
+//
+//.mdi-av-subtitles:before {
+//    content: "\e6cc";
+//}
+//
+//.mdi-av-surround-sound:before {
+//    content: "\e6cd";
+//}
+//
+//.mdi-av-timer:before {
+//    content: "\e6ce";
+//}
+//
+//.mdi-av-video-collection:before {
+//    content: "\e6cf";
+//}
+//
+//.mdi-av-videocam-off:before {
+//    content: "\e6d0";
+//}
+//
+//.mdi-av-videocam:before {
+//    content: "\e6d1";
+//}
+//
+//.mdi-av-volume-down:before {
+//    content: "\e6d2";
+//}
+//
+//.mdi-av-volume-mute:before {
+//    content: "\e6d3";
+//}
+//
+//.mdi-av-volume-off:before {
+//    content: "\e6d4";
+//}
+//
+//.mdi-av-volume-up:before {
+//    content: "\e6d5";
+//}
+//
+//.mdi-av-web:before {
+//    content: "\e6d6";
+//}
+//
+//.mdi-communication-business:before {
+//    content: "\e6d7";
+//}
+//
+//.mdi-communication-call-end:before {
+//    content: "\e6d8";
+//}
+//
+//.mdi-communication-call-made:before {
+//    content: "\e6d9";
+//}
+//
+//.mdi-communication-call-merge:before {
+//    content: "\e6da";
+//}
+//
+//.mdi-communication-call-missed:before {
+//    content: "\e6db";
+//}
+//
+//.mdi-communication-call-received:before {
+//    content: "\e6dc";
+//}
+//
+//.mdi-communication-call-split:before {
+//    content: "\e6dd";
+//}
+//
+//.mdi-communication-call:before {
+//    content: "\e6de";
+//}
+//
+//.mdi-communication-chat:before {
+//    content: "\e6df";
+//}
+//
+//.mdi-communication-clear-all:before {
+//    content: "\e6e0";
+//}
+//
+//.mdi-communication-comment:before {
+//    content: "\e6e1";
+//}
+//
+//.mdi-communication-contacts:before {
+//    content: "\e6e2";
+//}
+//
+//.mdi-communication-dialer-sip:before {
+//    content: "\e6e3";
+//}
+//
+//.mdi-communication-dialpad:before {
+//    content: "\e6e4";
+//}
+//
+//.mdi-communication-dnd-on:before {
+//    content: "\e6e5";
+//}
+//
+//.mdi-communication-email:before {
+//    content: "\e6e6";
+//}
+//
+//.mdi-communication-forum:before {
+//    content: "\e6e7";
+//}
+//
+//.mdi-communication-import-export:before {
+//    content: "\e6e8";
+//}
+//
+//.mdi-communication-invert-colors-off:before {
+//    content: "\e6e9";
+//}
+//
+//.mdi-communication-invert-colors-on:before {
+//    content: "\e6ea";
+//}
+//
+//.mdi-communication-live-help:before {
+//    content: "\e6eb";
+//}
+//
+//.mdi-communication-location-off:before {
+//    content: "\e6ec";
+//}
+//
+//.mdi-communication-location-on:before {
+//    content: "\e6ed";
+//}
+//
+//.mdi-communication-message:before {
+//    content: "\e6ee";
+//}
+//
+//.mdi-communication-messenger:before {
+//    content: "\e6ef";
+//}
+//
+//.mdi-communication-no-sim:before {
+//    content: "\e6f0";
+//}
+//
+//.mdi-communication-phone:before {
+//    content: "\e6f1";
+//}
+//
+//.mdi-communication-portable-wifi-off:before {
+//    content: "\e6f2";
+//}
+//
+//.mdi-communication-quick-contacts-dialer:before {
+//    content: "\e6f3";
+//}
+//
+//.mdi-communication-quick-contacts-mail:before {
+//    content: "\e6f4";
+//}
+//
+//.mdi-communication-ring-volume:before {
+//    content: "\e6f5";
+//}
+//
+//.mdi-communication-stay-current-landscape:before {
+//    content: "\e6f6";
+//}
+//
+//.mdi-communication-stay-current-portrait:before {
+//    content: "\e6f7";
+//}
+//
+//.mdi-communication-stay-primary-landscape:before {
+//    content: "\e6f8";
+//}
+//
+//.mdi-communication-stay-primary-portrait:before {
+//    content: "\e6f9";
+//}
+//
+//.mdi-communication-swap-calls:before {
+//    content: "\e6fa";
+//}
+//
+//.mdi-communication-textsms:before {
+//    content: "\e6fb";
+//}
+//
+//.mdi-communication-voicemail:before {
+//    content: "\e6fc";
+//}
+//
+//.mdi-communication-vpn-key:before {
+//    content: "\e6fd";
+//}
+//
+//.mdi-content-add-box:before {
+//    content: "\e6fe";
+//}
+//
+//.mdi-content-add-circle-outline:before {
+//    content: "\e6ff";
+//}
+//
+//.mdi-content-add-circle:before {
+//    content: "\e700";
+//}
+//
+//.mdi-content-add:before {
+//    content: "\e701";
+//}
+//
+//.mdi-content-archive:before {
+//    content: "\e702";
+//}
+//
+//.mdi-content-backspace:before {
+//    content: "\e703";
+//}
+//
+//.mdi-content-block:before {
+//    content: "\e704";
+//}
+//
+//.mdi-content-clear:before {
+//    content: "\e705";
+//}
+//
+//.mdi-content-content-copy:before {
+//    content: "\e706";
+//}
+//
+//.mdi-content-content-cut:before {
+//    content: "\e707";
+//}
+//
+//.mdi-content-content-paste:before {
+//    content: "\e708";
+//}
+//
+//.mdi-content-create:before {
+//    content: "\e709";
+//}
+//
+//.mdi-content-drafts:before {
+//    content: "\e70a";
+//}
+//
+//.mdi-content-filter-list:before {
+//    content: "\e70b";
+//}
+//
+//.mdi-content-flag:before {
+//    content: "\e70c";
+//}
+//
+//.mdi-content-forward:before {
+//    content: "\e70d";
+//}
+//
+//.mdi-content-gesture:before {
+//    content: "\e70e";
+//}
+//
+//.mdi-content-inbox:before {
+//    content: "\e70f";
+//}
+//
+//.mdi-content-link:before {
+//    content: "\e710";
+//}
+//
+//.mdi-content-mail:before {
+//    content: "\e711";
+//}
+//
+//.mdi-content-markunread:before {
+//    content: "\e712";
+//}
+//
+//.mdi-content-redo:before {
+//    content: "\e713";
+//}
+//
+//.mdi-content-remove-circle-outline:before {
+//    content: "\e714";
+//}
+//
+//.mdi-content-remove-circle:before {
+//    content: "\e715";
+//}
+//
+//.mdi-content-remove:before {
+//    content: "\e716";
+//}
+//
+//.mdi-content-reply-all:before {
+//    content: "\e717";
+//}
+//
+//.mdi-content-reply:before {
+//    content: "\e718";
+//}
+//
+//.mdi-content-report:before {
+//    content: "\e719";
+//}
+//
+//.mdi-content-save:before {
+//    content: "\e71a";
+//}
+//
+//.mdi-content-select-all:before {
+//    content: "\e71b";
+//}
+//
+//.mdi-content-send:before {
+//    content: "\e71c";
+//}
+//
+//.mdi-content-sort:before {
+//    content: "\e71d";
+//}
+//
+//.mdi-content-text-format:before {
+//    content: "\e71e";
+//}
+//
+//.mdi-content-undo:before {
+//    content: "\e71f";
+//}
+//
+//.mdi-editor-attach-file:before {
+//    content: "\e776";
+//}
+//
+//.mdi-editor-attach-money:before {
+//    content: "\e777";
+//}
+//
+//.mdi-editor-border-all:before {
+//    content: "\e778";
+//}
+//
+//.mdi-editor-border-bottom:before {
+//    content: "\e779";
+//}
+//
+//.mdi-editor-border-clear:before {
+//    content: "\e77a";
+//}
+//
+//.mdi-editor-border-color:before {
+//    content: "\e77b";
+//}
+//
+//.mdi-editor-border-horizontal:before {
+//    content: "\e77c";
+//}
+//
+//.mdi-editor-border-inner:before {
+//    content: "\e77d";
+//}
+//
+//.mdi-editor-border-left:before {
+//    content: "\e77e";
+//}
+//
+//.mdi-editor-border-outer:before {
+//    content: "\e77f";
+//}
+//
+//.mdi-editor-border-right:before {
+//    content: "\e780";
+//}
+//
+//.mdi-editor-border-style:before {
+//    content: "\e781";
+//}
+//
+//.mdi-editor-border-top:before {
+//    content: "\e782";
+//}
+//
+//.mdi-editor-border-vertical:before {
+//    content: "\e783";
+//}
+//
+//.mdi-editor-format-align-center:before {
+//    content: "\e784";
+//}
+//
+//.mdi-editor-format-align-justify:before {
+//    content: "\e785";
+//}
+//
+//.mdi-editor-format-align-left:before {
+//    content: "\e786";
+//}
+//
+//.mdi-editor-format-align-right:before {
+//    content: "\e787";
+//}
+//
+//.mdi-editor-format-bold:before {
+//    content: "\e788";
+//}
+//
+//.mdi-editor-format-clear:before {
+//    content: "\e789";
+//}
+//
+//.mdi-editor-format-color-fill:before {
+//    content: "\e78a";
+//}
+//
+//.mdi-editor-format-color-reset:before {
+//    content: "\e78b";
+//}
+//
+//.mdi-editor-format-color-text:before {
+//    content: "\e78c";
+//}
+//
+//.mdi-editor-format-indent-decrease:before {
+//    content: "\e78d";
+//}
+//
+//.mdi-editor-format-indent-increase:before {
+//    content: "\e78e";
+//}
+//
+//.mdi-editor-format-italic:before {
+//    content: "\e78f";
+//}
+//
+//.mdi-editor-format-line-spacing:before {
+//    content: "\e790";
+//}
+//
+//.mdi-editor-format-list-bulleted:before {
+//    content: "\e791";
+//}
+//
+//.mdi-editor-format-list-numbered:before {
+//    content: "\e792";
+//}
+//
+//.mdi-editor-format-paint:before {
+//    content: "\e793";
+//}
+//
+//.mdi-editor-format-quote:before {
+//    content: "\e794";
+//}
+//
+//.mdi-editor-format-size:before {
+//    content: "\e795";
+//}
+//
+//.mdi-editor-format-strikethrough:before {
+//    content: "\e796";
+//}
+//
+//.mdi-editor-format-textdirection-l-to-r:before {
+//    content: "\e797";
+//}
+//
+//.mdi-editor-format-textdirection-r-to-l:before {
+//    content: "\e798";
+//}
+//
+//.mdi-editor-format-underline:before {
+//    content: "\e799";
+//}
+//
+//.mdi-editor-functions:before {
+//    content: "\e79a";
+//}
+//
+//.mdi-editor-insert-chart:before {
+//    content: "\e79b";
+//}
+//
+//.mdi-editor-insert-comment:before {
+//    content: "\e79c";
+//}
+//
+//.mdi-editor-insert-drive-file:before {
+//    content: "\e79d";
+//}
+//
+//.mdi-editor-insert-emoticon:before {
+//    content: "\e79e";
+//}
+//
+//.mdi-editor-insert-invitation:before {
+//    content: "\e79f";
+//}
+//
+//.mdi-editor-insert-link:before {
+//    content: "\e7a0";
+//}
+//
+//.mdi-editor-insert-photo:before {
+//    content: "\e7a1";
+//}
+//
+//.mdi-editor-merge-type:before {
+//    content: "\e7a2";
+//}
+//
+//.mdi-editor-mode-comment:before {
+//    content: "\e7a3";
+//}
+//
+//.mdi-editor-mode-edit:before {
+//    content: "\e7a4";
+//}
+//
+//.mdi-editor-publish:before {
+//    content: "\e7a5";
+//}
+//
+//.mdi-editor-vertical-align-bottom:before {
+//    content: "\e7a6";
+//}
+//
+//.mdi-editor-vertical-align-center:before {
+//    content: "\e7a7";
+//}
+//
+//.mdi-editor-vertical-align-top:before {
+//    content: "\e7a8";
+//}
+//
+//.mdi-editor-wrap-text:before {
+//    content: "\e7a9";
+//}
+//
+//.mdi-file-attachment:before {
+//    content: "\e7aa";
+//}
+//
+//.mdi-file-cloud-circle:before {
+//    content: "\e7ab";
+//}
+//
+//.mdi-file-cloud-done:before {
+//    content: "\e7ac";
+//}
+//
+//.mdi-file-cloud-download:before {
+//    content: "\e7ad";
+//}
+//
+//.mdi-file-cloud-off:before {
+//    content: "\e7ae";
+//}
+//
+//.mdi-file-cloud-queue:before {
+//    content: "\e7af";
+//}
+//
+//.mdi-file-cloud-upload:before {
+//    content: "\e7b0";
+//}
+//
+//.mdi-file-cloud:before {
+//    content: "\e7b1";
+//}
+//
+//.mdi-file-file-download:before {
+//    content: "\e7b2";
+//}
+//
+//.mdi-file-file-upload:before {
+//    content: "\e7b3";
+//}
+//
+//.mdi-file-folder-open:before {
+//    content: "\e7b4";
+//}
+//
+//.mdi-file-folder-shared:before {
+//    content: "\e7b5";
+//}
+//
+//.mdi-file-folder:before {
+//    content: "\e7b6";
+//}
+//
+//.mdi-device-access-alarm:before {
+//    content: "\e720";
+//}
+//
+//.mdi-device-access-alarms:before {
+//    content: "\e721";
+//}
+//
+//.mdi-device-access-time:before {
+//    content: "\e722";
+//}
+//
+//.mdi-device-add-alarm:before {
+//    content: "\e723";
+//}
+//
+//.mdi-device-airplanemode-off:before {
+//    content: "\e724";
+//}
+//
+//.mdi-device-airplanemode-on:before {
+//    content: "\e725";
+//}
+//
+//.mdi-device-battery-20:before {
+//    content: "\e726";
+//}
+//
+//.mdi-device-battery-30:before {
+//    content: "\e727";
+//}
+//
+//.mdi-device-battery-50:before {
+//    content: "\e728";
+//}
+//
+//.mdi-device-battery-60:before {
+//    content: "\e729";
+//}
+//
+//.mdi-device-battery-80:before {
+//    content: "\e72a";
+//}
+//
+//.mdi-device-battery-90:before {
+//    content: "\e72b";
+//}
+//
+//.mdi-device-battery-alert:before {
+//    content: "\e72c";
+//}
+//
+//.mdi-device-battery-charging-20:before {
+//    content: "\e72d";
+//}
+//
+//.mdi-device-battery-charging-30:before {
+//    content: "\e72e";
+//}
+//
+//.mdi-device-battery-charging-50:before {
+//    content: "\e72f";
+//}
+//
+//.mdi-device-battery-charging-60:before {
+//    content: "\e730";
+//}
+//
+//.mdi-device-battery-charging-80:before {
+//    content: "\e731";
+//}
+//
+//.mdi-device-battery-charging-90:before {
+//    content: "\e732";
+//}
+//
+//.mdi-device-battery-charging-full:before {
+//    content: "\e733";
+//}
+//
+//.mdi-device-battery-full:before {
+//    content: "\e734";
+//}
+//
+//.mdi-device-battery-std:before {
+//    content: "\e735";
+//}
+//
+//.mdi-device-battery-unknown:before {
+//    content: "\e736";
+//}
+//
+//.mdi-device-bluetooth-connected:before {
+//    content: "\e737";
+//}
+//
+//.mdi-device-bluetooth-disabled:before {
+//    content: "\e738";
+//}
+//
+//.mdi-device-bluetooth-searching:before {
+//    content: "\e739";
+//}
+//
+//.mdi-device-bluetooth:before {
+//    content: "\e73a";
+//}
+//
+//.mdi-device-brightness-auto:before {
+//    content: "\e73b";
+//}
+//
+//.mdi-device-brightness-high:before {
+//    content: "\e73c";
+//}
+//
+//.mdi-device-brightness-low:before {
+//    content: "\e73d";
+//}
+//
+//.mdi-device-brightness-medium:before {
+//    content: "\e73e";
+//}
+//
+//.mdi-device-data-usage:before {
+//    content: "\e73f";
+//}
+//
+//.mdi-device-developer-mode:before {
+//    content: "\e740";
+//}
+//
+//.mdi-device-devices:before {
+//    content: "\e741";
+//}
+//
+//.mdi-device-dvr:before {
+//    content: "\e742";
+//}
+//
+//.mdi-device-gps-fixed:before {
+//    content: "\e743";
+//}
+//
+//.mdi-device-gps-not-fixed:before {
+//    content: "\e744";
+//}
+//
+//.mdi-device-gps-off:before {
+//    content: "\e745";
+//}
+//
+//.mdi-device-location-disabled:before {
+//    content: "\e746";
+//}
+//
+//.mdi-device-location-searching:before {
+//    content: "\e747";
+//}
+//
+//.mdi-device-multitrack-audio:before {
+//    content: "\e748";
+//}
+//
+//.mdi-device-network-cell:before {
+//    content: "\e749";
+//}
+//
+//.mdi-device-network-wifi:before {
+//    content: "\e74a";
+//}
+//
+//.mdi-device-nfc:before {
+//    content: "\e74b";
+//}
+//
+//.mdi-device-now-wallpaper:before {
+//    content: "\e74c";
+//}
+//
+//.mdi-device-now-widgets:before {
+//    content: "\e74d";
+//}
+//
+//.mdi-device-screen-lock-landscape:before {
+//    content: "\e74e";
+//}
+//
+//.mdi-device-screen-lock-portrait:before {
+//    content: "\e74f";
+//}
+//
+//.mdi-device-screen-lock-rotation:before {
+//    content: "\e750";
+//}
+//
+//.mdi-device-screen-rotation:before {
+//    content: "\e751";
+//}
+//
+//.mdi-device-sd-storage:before {
+//    content: "\e752";
+//}
+//
+//.mdi-device-settings-system-daydream:before {
+//    content: "\e753";
+//}
+//
+//.mdi-device-signal-cellular-0-bar:before {
+//    content: "\e754";
+//}
+//
+//.mdi-device-signal-cellular-1-bar:before {
+//    content: "\e755";
+//}
+//
+//.mdi-device-signal-cellular-2-bar:before {
+//    content: "\e756";
+//}
+//
+//.mdi-device-signal-cellular-3-bar:before {
+//    content: "\e757";
+//}
+//
+//.mdi-device-signal-cellular-4-bar:before {
+//    content: "\e758";
+//}
+//
+//.mdi-signal-wifi-statusbar-connected-no-internet-after:before {
+//    content: "\e8f6";
+//}
+//
+//.mdi-device-signal-cellular-connected-no-internet-0-bar:before {
+//    content: "\e759";
+//}
+//
+//.mdi-device-signal-cellular-connected-no-internet-1-bar:before {
+//    content: "\e75a";
+//}
+//
+//.mdi-device-signal-cellular-connected-no-internet-2-bar:before {
+//    content: "\e75b";
+//}
+//
+//.mdi-device-signal-cellular-connected-no-internet-3-bar:before {
+//    content: "\e75c";
+//}
+//
+//.mdi-device-signal-cellular-connected-no-internet-4-bar:before {
+//    content: "\e75d";
+//}
+//
+//.mdi-device-signal-cellular-no-sim:before {
+//    content: "\e75e";
+//}
+//
+//.mdi-device-signal-cellular-null:before {
+//    content: "\e75f";
+//}
+//
+//.mdi-device-signal-cellular-off:before {
+//    content: "\e760";
+//}
+//
+//.mdi-device-signal-wifi-0-bar:before {
+//    content: "\e761";
+//}
+//
+//.mdi-device-signal-wifi-1-bar:before {
+//    content: "\e762";
+//}
+//
+//.mdi-device-signal-wifi-2-bar:before {
+//    content: "\e763";
+//}
+//
+//.mdi-device-signal-wifi-3-bar:before {
+//    content: "\e764";
+//}
+//
+//.mdi-device-signal-wifi-4-bar:before {
+//    content: "\e765";
+//}
+//
+//.mdi-device-signal-wifi-off:before {
+//    content: "\e766";
+//}
+//
+//.mdi-device-signal-wifi-statusbar-1-bar:before {
+//    content: "\e767";
+//}
+//
+//.mdi-device-signal-wifi-statusbar-2-bar:before {
+//    content: "\e768";
+//}
+//
+//.mdi-device-signal-wifi-statusbar-3-bar:before {
+//    content: "\e769";
+//}
+//
+//.mdi-device-signal-wifi-statusbar-4-bar:before {
+//    content: "\e76a";
+//}
+//
+//.mdi-device-signal-wifi-statusbar-connected-no-internet-:before {
+//    content: "\e76b";
+//}
+//
+//.mdi-device-signal-wifi-statusbar-connected-no-internet:before {
+//    content: "\e76f";
+//}
+//
+//.mdi-device-signal-wifi-statusbar-connected-no-internet-2:before {
+//    content: "\e76c";
+//}
+//
+//.mdi-device-signal-wifi-statusbar-connected-no-internet-3:before {
+//    content: "\e76d";
+//}
+//
+//.mdi-device-signal-wifi-statusbar-connected-no-internet-4:before {
+//    content: "\e76e";
+//}
+//
+//.mdi-signal-wifi-statusbar-not-connected-after:before {
+//    content: "\e8f7";
+//}
+//
+//.mdi-device-signal-wifi-statusbar-not-connected:before {
+//    content: "\e770";
+//}
+//
+//.mdi-device-signal-wifi-statusbar-null:before {
+//    content: "\e771";
+//}
+//
+//.mdi-device-storage:before {
+//    content: "\e772";
+//}
+//
+//.mdi-device-usb:before {
+//    content: "\e773";
+//}
+//
+//.mdi-device-wifi-lock:before {
+//    content: "\e774";
+//}
+//
+//.mdi-device-wifi-tethering:before {
+//    content: "\e775";
+//}
+//
+//.mdi-hardware-cast-connected:before {
+//    content: "\e7b7";
+//}
+//
+//.mdi-hardware-cast:before {
+//    content: "\e7b8";
+//}
+//
+//.mdi-hardware-computer:before {
+//    content: "\e7b9";
+//}
+//
+//.mdi-hardware-desktop-mac:before {
+//    content: "\e7ba";
+//}
+//
+//.mdi-hardware-desktop-windows:before {
+//    content: "\e7bb";
+//}
+//
+//.mdi-hardware-dock:before {
+//    content: "\e7bc";
+//}
+//
+//.mdi-hardware-gamepad:before {
+//    content: "\e7bd";
+//}
+//
+//.mdi-hardware-headset-mic:before {
+//    content: "\e7be";
+//}
+//
+//.mdi-hardware-headset:before {
+//    content: "\e7bf";
+//}
+//
+//.mdi-hardware-keyboard-alt:before {
+//    content: "\e7c0";
+//}
+//
+//.mdi-hardware-keyboard-arrow-down:before {
+//    content: "\e7c1";
+//}
+//
+//.mdi-hardware-keyboard-arrow-left:before {
+//    content: "\e7c2";
+//}
+//
+//.mdi-hardware-keyboard-arrow-right:before {
+//    content: "\e7c3";
+//}
+//
+//.mdi-hardware-keyboard-arrow-up:before {
+//    content: "\e7c4";
+//}
+//
+//.mdi-hardware-keyboard-backspace:before {
+//    content: "\e7c5";
+//}
+//
+//.mdi-hardware-keyboard-capslock:before {
+//    content: "\e7c6";
+//}
+//
+//.mdi-hardware-keyboard-control:before {
+//    content: "\e7c7";
+//}
+//
+//.mdi-hardware-keyboard-hide:before {
+//    content: "\e7c8";
+//}
+//
+//.mdi-hardware-keyboard-return:before {
+//    content: "\e7c9";
+//}
+//
+//.mdi-hardware-keyboard-tab:before {
+//    content: "\e7ca";
+//}
+//
+//.mdi-hardware-keyboard-voice:before {
+//    content: "\e7cb";
+//}
+//
+//.mdi-hardware-keyboard:before {
+//    content: "\e7cc";
+//}
+//
+//.mdi-hardware-laptop-chromebook:before {
+//    content: "\e7cd";
+//}
+//
+//.mdi-hardware-laptop-mac:before {
+//    content: "\e7ce";
+//}
+//
+//.mdi-hardware-laptop-windows:before {
+//    content: "\e7cf";
+//}
+//
+//.mdi-hardware-laptop:before {
+//    content: "\e7d0";
+//}
+//
+//.mdi-hardware-memory:before {
+//    content: "\e7d1";
+//}
+//
+//.mdi-hardware-mouse:before {
+//    content: "\e7d2";
+//}
+//
+//.mdi-hardware-phone-android:before {
+//    content: "\e7d3";
+//}
+//
+//.mdi-hardware-phone-iphone:before {
+//    content: "\e7d4";
+//}
+//
+//.mdi-hardware-phonelink-off:before {
+//    content: "\e7d5";
+//}
+//
+//.mdi-hardware-phonelink:before {
+//    content: "\e7d6";
+//}
+//
+//.mdi-hardware-security:before {
+//    content: "\e7d7";
+//}
+//
+//.mdi-hardware-sim-card:before {
+//    content: "\e7d8";
+//}
+//
+//.mdi-hardware-smartphone:before {
+//    content: "\e7d9";
+//}
+//
+//.mdi-hardware-speaker:before {
+//    content: "\e7da";
+//}
+//
+//.mdi-hardware-tablet-android:before {
+//    content: "\e7db";
+//}
+//
+//.mdi-hardware-tablet-mac:before {
+//    content: "\e7dc";
+//}
+//
+//.mdi-hardware-tablet:before {
+//    content: "\e7dd";
+//}
+//
+//.mdi-hardware-tv:before {
+//    content: "\e7de";
+//}
+//
+//.mdi-hardware-watch:before {
+//    content: "\e7df";
+//}
+//
+//.mdi-image-add-to-photos:before {
+//    content: "\e7e0";
+//}
+//
+//.mdi-image-adjust:before {
+//    content: "\e7e1";
+//}
+//
+//.mdi-image-assistant-photo:before {
+//    content: "\e7e2";
+//}
+//
+//.mdi-image-audiotrack:before {
+//    content: "\e7e3";
+//}
+//
+//.mdi-image-blur-circular:before {
+//    content: "\e7e4";
+//}
+//
+//.mdi-image-blur-linear:before {
+//    content: "\e7e5";
+//}
+//
+//.mdi-image-blur-off:before {
+//    content: "\e7e6";
+//}
+//
+//.mdi-image-blur-on:before {
+//    content: "\e7e7";
+//}
+//
+//.mdi-image-brightness-1:before {
+//    content: "\e7e8";
+//}
+//
+//.mdi-image-brightness-2:before {
+//    content: "\e7e9";
+//}
+//
+//.mdi-image-brightness-3:before {
+//    content: "\e7ea";
+//}
+//
+//.mdi-image-brightness-4:before {
+//    content: "\e7eb";
+//}
+//
+//.mdi-image-brightness-5:before {
+//    content: "\e7ec";
+//}
+//
+//.mdi-image-brightness-6:before {
+//    content: "\e7ed";
+//}
+//
+//.mdi-image-brightness-7:before {
+//    content: "\e7ee";
+//}
+//
+//.mdi-image-brush:before {
+//    content: "\e7ef";
+//}
+//
+//.mdi-image-camera-alt:before {
+//    content: "\e7f0";
+//}
+//
+//.mdi-image-camera-front:before {
+//    content: "\e7f1";
+//}
+//
+//.mdi-image-camera-rear:before {
+//    content: "\e7f2";
+//}
+//
+//.mdi-image-camera-roll:before {
+//    content: "\e7f3";
+//}
+//
+//.mdi-image-camera:before {
+//    content: "\e7f4";
+//}
+//
+//.mdi-image-center-focus-strong:before {
+//    content: "\e7f5";
+//}
+//
+//.mdi-image-center-focus-weak:before {
+//    content: "\e7f6";
+//}
+//
+//.mdi-image-collections:before {
+//    content: "\e7f7";
+//}
+//
+//.mdi-image-color-lens:before {
+//    content: "\e7f8";
+//}
+//
+//.mdi-image-colorize:before {
+//    content: "\e7f9";
+//}
+//
+//.mdi-image-compare:before {
+//    content: "\e7fa";
+//}
+//
+//.mdi-image-control-point-duplicate:before {
+//    content: "\e7fb";
+//}
+//
+//.mdi-image-control-point:before {
+//    content: "\e7fc";
+//}
+//
+//.mdi-image-crop-3-2:before {
+//    content: "\e7fd";
+//}
+//
+//.mdi-image-crop-5-4:before {
+//    content: "\e7fe";
+//}
+//
+//.mdi-image-crop-7-5:before {
+//    content: "\e7ff";
+//}
+//
+//.mdi-image-crop-16-9:before {
+//    content: "\e800";
+//}
+//
+//.mdi-image-crop-din:before {
+//    content: "\e801";
+//}
+//
+//.mdi-image-crop-free:before {
+//    content: "\e802";
+//}
+//
+//.mdi-image-crop-landscape:before {
+//    content: "\e803";
+//}
+//
+//.mdi-image-crop-original:before {
+//    content: "\e804";
+//}
+//
+//.mdi-image-crop-portrait:before {
+//    content: "\e805";
+//}
+//
+//.mdi-image-crop-square:before {
+//    content: "\e806";
+//}
+//
+//.mdi-image-crop:before {
+//    content: "\e807";
+//}
+//
+//.mdi-image-dehaze:before {
+//    content: "\e808";
+//}
+//
+//.mdi-image-details:before {
+//    content: "\e809";
+//}
+//
+//.mdi-image-edit:before {
+//    content: "\e80a";
+//}
+//
+//.mdi-image-exposure-minus-1:before {
+//    content: "\e80b";
+//}
+//
+//.mdi-image-exposure-minus-2:before {
+//    content: "\e80c";
+//}
+//
+//.mdi-image-exposure-plus-1:before {
+//    content: "\e80d";
+//}
+//
+//.mdi-image-exposure-plus-2:before {
+//    content: "\e80e";
+//}
+//
+//.mdi-image-exposure-zero:before {
+//    content: "\e80f";
+//}
+//
+//.mdi-image-exposure:before {
+//    content: "\e810";
+//}
+//
+//.mdi-image-filter-1:before {
+//    content: "\e811";
+//}
+//
+//.mdi-image-filter-2:before {
+//    content: "\e812";
+//}
+//
+//.mdi-image-filter-3:before {
+//    content: "\e813";
+//}
+//
+//.mdi-image-filter-4:before {
+//    content: "\e814";
+//}
+//
+//.mdi-image-filter-5:before {
+//    content: "\e815";
+//}
+//
+//.mdi-image-filter-6:before {
+//    content: "\e816";
+//}
+//
+//.mdi-image-filter-7:before {
+//    content: "\e817";
+//}
+//
+//.mdi-image-filter-8:before {
+//    content: "\e818";
+//}
+//
+//.mdi-image-filter-9-plus:before {
+//    content: "\e819";
+//}
+//
+//.mdi-image-filter-9:before {
+//    content: "\e81a";
+//}
+//
+//.mdi-image-filter-b-and-w:before {
+//    content: "\e81b";
+//}
+//
+//.mdi-image-filter-center-focus:before {
+//    content: "\e81c";
+//}
+//
+//.mdi-image-filter-drama:before {
+//    content: "\e81d";
+//}
+//
+//.mdi-image-filter-frames:before {
+//    content: "\e81e";
+//}
+//
+//.mdi-image-filter-hdr:before {
+//    content: "\e81f";
+//}
+//
+//.mdi-image-filter-none:before {
+//    content: "\e820";
+//}
+//
+//.mdi-image-filter-tilt-shift:before {
+//    content: "\e821";
+//}
+//
+//.mdi-image-filter-vintage:before {
+//    content: "\e822";
+//}
+//
+//.mdi-image-filter:before {
+//    content: "\e823";
+//}
+//
+//.mdi-image-flare:before {
+//    content: "\e824";
+//}
+//
+//.mdi-image-flash-auto:before {
+//    content: "\e825";
+//}
+//
+//.mdi-image-flash-off:before {
+//    content: "\e826";
+//}
+//
+//.mdi-image-flash-on:before {
+//    content: "\e827";
+//}
+//
+//.mdi-image-flip:before {
+//    content: "\e828";
+//}
+//
+//.mdi-image-gradient:before {
+//    content: "\e829";
+//}
+//
+//.mdi-image-grain:before {
+//    content: "\e82a";
+//}
+//
+//.mdi-image-grid-off:before {
+//    content: "\e82b";
+//}
+//
+//.mdi-image-grid-on:before {
+//    content: "\e82c";
+//}
+//
+//.mdi-image-hdr-off:before {
+//    content: "\e82d";
+//}
+//
+//.mdi-image-hdr-on:before {
+//    content: "\e82e";
+//}
+//
+//.mdi-image-hdr-strong:before {
+//    content: "\e82f";
+//}
+//
+//.mdi-image-hdr-weak:before {
+//    content: "\e830";
+//}
+//
+//.mdi-image-healing:before {
+//    content: "\e831";
+//}
+//
+//.mdi-image-image-aspect-ratio:before {
+//    content: "\e832";
+//}
+//
+//.mdi-image-image:before {
+//    content: "\e833";
+//}
+//
+//.mdi-image-iso:before {
+//    content: "\e834";
+//}
+//
+//.mdi-image-landscape:before {
+//    content: "\e835";
+//}
+//
+//.mdi-image-leak-add:before {
+//    content: "\e836";
+//}
+//
+//.mdi-image-leak-remove:before {
+//    content: "\e837";
+//}
+//
+//.mdi-image-lens:before {
+//    content: "\e838";
+//}
+//
+//.mdi-image-looks-3:before {
+//    content: "\e839";
+//}
+//
+//.mdi-image-looks-4:before {
+//    content: "\e83a";
+//}
+//
+//.mdi-image-looks-5:before {
+//    content: "\e83b";
+//}
+//
+//.mdi-image-looks-6:before {
+//    content: "\e83c";
+//}
+//
+//.mdi-image-looks-one:before {
+//    content: "\e83d";
+//}
+//
+//.mdi-image-looks-two:before {
+//    content: "\e83e";
+//}
+//
+//.mdi-image-looks:before {
+//    content: "\e83f";
+//}
+//
+//.mdi-image-loupe:before {
+//    content: "\e840";
+//}
+//
+//.mdi-image-movie-creation:before {
+//    content: "\e841";
+//}
+//
+//.mdi-image-nature-people:before {
+//    content: "\e842";
+//}
+//
+//.mdi-image-nature:before {
+//    content: "\e843";
+//}
+//
+//.mdi-image-navigate-before:before {
+//    content: "\e844";
+//}
+//
+//.mdi-image-navigate-next:before {
+//    content: "\e845";
+//}
+//
+//.mdi-image-palette:before {
+//    content: "\e846";
+//}
+//
+//.mdi-image-panorama-fisheye:before {
+//    content: "\e847";
+//}
+//
+//.mdi-image-panorama-horizontal:before {
+//    content: "\e848";
+//}
+//
+//.mdi-image-panorama-vertical:before {
+//    content: "\e849";
+//}
+//
+//.mdi-image-panorama-wide-angle:before {
+//    content: "\e84a";
+//}
+//
+//.mdi-image-panorama:before {
+//    content: "\e84b";
+//}
+//
+//.mdi-image-photo-album:before {
+//    content: "\e84c";
+//}
+//
+//.mdi-image-photo-camera:before {
+//    content: "\e84d";
+//}
+//
+//.mdi-image-photo-library:before {
+//    content: "\e84e";
+//}
+//
+//.mdi-image-photo:before {
+//    content: "\e84f";
+//}
+//
+//.mdi-image-portrait:before {
+//    content: "\e850";
+//}
+//
+//.mdi-image-remove-red-eye:before {
+//    content: "\e851";
+//}
+//
+//.mdi-image-rotate-left:before {
+//    content: "\e852";
+//}
+//
+//.mdi-image-rotate-right:before {
+//    content: "\e853";
+//}
+//
+//.mdi-image-slideshow:before {
+//    content: "\e854";
+//}
+//
+//.mdi-image-straighten:before {
+//    content: "\e855";
+//}
+//
+//.mdi-image-style:before {
+//    content: "\e856";
+//}
+//
+//.mdi-image-switch-camera:before {
+//    content: "\e857";
+//}
+//
+//.mdi-image-switch-video:before {
+//    content: "\e858";
+//}
+//
+//.mdi-image-tag-faces:before {
+//    content: "\e859";
+//}
+//
+//.mdi-image-texture:before {
+//    content: "\e85a";
+//}
+//
+//.mdi-image-timelapse:before {
+//    content: "\e85b";
+//}
+//
+//.mdi-image-timer-3:before {
+//    content: "\e85c";
+//}
+//
+//.mdi-image-timer-10:before {
+//    content: "\e85d";
+//}
+//
+//.mdi-image-timer-auto:before {
+//    content: "\e85e";
+//}
+//
+//.mdi-image-timer-off:before {
+//    content: "\e85f";
+//}
+//
+//.mdi-image-timer:before {
+//    content: "\e860";
+//}
+//
+//.mdi-image-tonality:before {
+//    content: "\e861";
+//}
+//
+//.mdi-image-transform:before {
+//    content: "\e862";
+//}
+//
+//.mdi-image-tune:before {
+//    content: "\e863";
+//}
+//
+//.mdi-image-wb-auto:before {
+//    content: "\e864";
+//}
+//
+//.mdi-image-wb-cloudy:before {
+//    content: "\e865";
+//}
+//
+//.mdi-image-wb-incandescent:before {
+//    content: "\e866";
+//}
+//
+//.mdi-image-wb-irradescent:before {
+//    content: "\e867";
+//}
+//
+//.mdi-image-wb-sunny:before {
+//    content: "\e868";
+//}
+//
+//.mdi-maps-beenhere:before {
+//    content: "\e869";
+//}
+//
+//.mdi-maps-directions-bike:before {
+//    content: "\e86a";
+//}
+//
+//.mdi-maps-directions-bus:before {
+//    content: "\e86b";
+//}
+//
+//.mdi-maps-directions-car:before {
+//    content: "\e86c";
+//}
+//
+//.mdi-maps-directions-ferry:before {
+//    content: "\e86d";
+//}
+//
+//.mdi-maps-directions-subway:before {
+//    content: "\e86e";
+//}
+//
+//.mdi-maps-directions-train:before {
+//    content: "\e86f";
+//}
+//
+//.mdi-maps-directions-transit:before {
+//    content: "\e870";
+//}
+//
+//.mdi-maps-directions-walk:before {
+//    content: "\e871";
+//}
+//
+//.mdi-maps-directions:before {
+//    content: "\e872";
+//}
+//
+//.mdi-maps-flight:before {
+//    content: "\e873";
+//}
+//
+//.mdi-maps-hotel:before {
+//    content: "\e874";
+//}
+//
+//.mdi-maps-layers-clear:before {
+//    content: "\e875";
+//}
+//
+//.mdi-maps-layers:before {
+//    content: "\e876";
+//}
+//
+//.mdi-maps-local-airport:before {
+//    content: "\e877";
+//}
+//
+//.mdi-maps-local-atm:before {
+//    content: "\e878";
+//}
+//
+//.mdi-maps-local-attraction:before {
+//    content: "\e879";
+//}
+//
+//.mdi-maps-local-bar:before {
+//    content: "\e87a";
+//}
+//
+//.mdi-maps-local-cafe:before {
+//    content: "\e87b";
+//}
+//
+//.mdi-maps-local-car-wash:before {
+//    content: "\e87c";
+//}
+//
+//.mdi-maps-local-convenience-store:before {
+//    content: "\e87d";
+//}
+//
+//.mdi-maps-local-drink:before {
+//    content: "\e87e";
+//}
+//
+//.mdi-maps-local-florist:before {
+//    content: "\e87f";
+//}
+//
+//.mdi-maps-local-gas-station:before {
+//    content: "\e880";
+//}
+//
+//.mdi-maps-local-grocery-store:before {
+//    content: "\e881";
+//}
+//
+//.mdi-maps-local-hospital:before {
+//    content: "\e882";
+//}
+//
+//.mdi-maps-local-hotel:before {
+//    content: "\e883";
+//}
+//
+//.mdi-maps-local-laundry-service:before {
+//    content: "\e884";
+//}
+//
+//.mdi-maps-local-library:before {
+//    content: "\e885";
+//}
+//
+//.mdi-maps-local-mall:before {
+//    content: "\e886";
+//}
+//
+//.mdi-maps-local-movies:before {
+//    content: "\e887";
+//}
+//
+//.mdi-maps-local-offer:before {
+//    content: "\e888";
+//}
+//
+//.mdi-maps-local-parking:before {
+//    content: "\e889";
+//}
+//
+//.mdi-maps-local-pharmacy:before {
+//    content: "\e88a";
+//}
+//
+//.mdi-maps-local-phone:before {
+//    content: "\e88b";
+//}
+//
+//.mdi-maps-local-pizza:before {
+//    content: "\e88c";
+//}
+//
+//.mdi-maps-local-play:before {
+//    content: "\e88d";
+//}
+//
+//.mdi-maps-local-post-office:before {
+//    content: "\e88e";
+//}
+//
+//.mdi-maps-local-print-shop:before {
+//    content: "\e88f";
+//}
+//
+//.mdi-maps-local-restaurant:before {
+//    content: "\e890";
+//}
+//
+//.mdi-maps-local-see:before {
+//    content: "\e891";
+//}
+//
+//.mdi-maps-local-shipping:before {
+//    content: "\e892";
+//}
+//
+//.mdi-maps-local-taxi:before {
+//    content: "\e893";
+//}
+//
+//.mdi-maps-location-history:before {
+//    content: "\e894";
+//}
+//
+//.mdi-maps-map:before {
+//    content: "\e895";
+//}
+//
+//.mdi-maps-my-location:before {
+//    content: "\e896";
+//}
+//
+//.mdi-maps-navigation:before {
+//    content: "\e897";
+//}
+//
+//.mdi-maps-pin-drop:before {
+//    content: "\e898";
+//}
+//
+//.mdi-maps-place:before {
+//    content: "\e899";
+//}
+//
+//.mdi-maps-rate-review:before {
+//    content: "\e89a";
+//}
+//
+//.mdi-maps-restaurant-menu:before {
+//    content: "\e89b";
+//}
+//
+//.mdi-maps-satellite:before {
+//    content: "\e89c";
+//}
+//
+//.mdi-maps-store-mall-directory:before {
+//    content: "\e89d";
+//}
+//
+//.mdi-maps-terrain:before {
+//    content: "\e89e";
+//}
+//
+//.mdi-maps-traffic:before {
+//    content: "\e89f";
+//}
+//
+//.mdi-navigation-apps:before {
+//    content: "\e8a0";
+//}
+//
+//.mdi-navigation-arrow-back:before {
+//    content: "\e8a1";
+//}
+//
+//.mdi-navigation-arrow-drop-down-circle:before {
+//    content: "\e8a2";
+//}
+//
+//.mdi-navigation-arrow-drop-down:before {
+//    content: "\e8a3";
+//}
+//
+//.mdi-navigation-arrow-drop-up:before {
+//    content: "\e8a4";
+//}
+//
+//.mdi-navigation-arrow-forward:before {
+//    content: "\e8a5";
+//}
+//
+//.mdi-navigation-cancel:before {
+//    content: "\e8a6";
+//}
+//
+//.mdi-navigation-check:before {
+//    content: "\e8a7";
+//}
+//
+//.mdi-navigation-chevron-left:before {
+//    content: "\e8a8";
+//}
+//
+//.mdi-navigation-chevron-right:before {
+//    content: "\e8a9";
+//}
+//
+//.mdi-navigation-close:before {
+//    content: "\e8aa";
+//}
+//
+//.mdi-navigation-expand-less:before {
+//    content: "\e8ab";
+//}
+//
+//.mdi-navigation-expand-more:before {
+//    content: "\e8ac";
+//}
+//
+//.mdi-navigation-fullscreen-exit:before {
+//    content: "\e8ad";
+//}
+//
+//.mdi-navigation-fullscreen:before {
+//    content: "\e8ae";
+//}
+//
+//.mdi-navigation-menu:before {
+//    content: "\e8af";
+//}
+//
+//.mdi-navigation-more-horiz:before {
+//    content: "\e8b0";
+//}
+//
+//.mdi-navigation-more-vert:before {
+//    content: "\e8b1";
+//}
+//
+//.mdi-navigation-refresh:before {
+//    content: "\e8b2";
+//}
+//
+//.mdi-navigation-unfold-less:before {
+//    content: "\e8b3";
+//}
+//
+//.mdi-navigation-unfold-more:before {
+//    content: "\e8b4";
+//}
+//
+//.mdi-notification-adb:before {
+//    content: "\e8b5";
+//}
+//
+//.mdi-notification-bluetooth-audio:before {
+//    content: "\e8b6";
+//}
+//
+//.mdi-notification-disc-full:before {
+//    content: "\e8b7";
+//}
+//
+//.mdi-notification-dnd-forwardslash:before {
+//    content: "\e8b8";
+//}
+//
+//.mdi-notification-do-not-disturb:before {
+//    content: "\e8b9";
+//}
+//
+//.mdi-notification-drive-eta:before {
+//    content: "\e8ba";
+//}
+//
+//.mdi-notification-event-available:before {
+//    content: "\e8bb";
+//}
+//
+//.mdi-notification-event-busy:before {
+//    content: "\e8bc";
+//}
+//
+//.mdi-notification-event-note:before {
+//    content: "\e8bd";
+//}
+//
+//.mdi-notification-folder-special:before {
+//    content: "\e8be";
+//}
+//
+//.mdi-notification-mms:before {
+//    content: "\e8bf";
+//}
+//
+//.mdi-notification-more:before {
+//    content: "\e8c0";
+//}
+//
+//.mdi-notification-network-locked:before {
+//    content: "\e8c1";
+//}
+//
+//.mdi-notification-phone-bluetooth-speaker:before {
+//    content: "\e8c2";
+//}
+//
+//.mdi-notification-phone-forwarded:before {
+//    content: "\e8c3";
+//}
+//
+//.mdi-notification-phone-in-talk:before {
+//    content: "\e8c4";
+//}
+//
+//.mdi-notification-phone-locked:before {
+//    content: "\e8c5";
+//}
+//
+//.mdi-notification-phone-missed:before {
+//    content: "\e8c6";
+//}
+//
+//.mdi-notification-phone-paused:before {
+//    content: "\e8c7";
+//}
+//
+//.mdi-notification-play-download:before {
+//    content: "\e8c8";
+//}
+//
+//.mdi-notification-play-install:before {
+//    content: "\e8c9";
+//}
+//
+//.mdi-notification-sd-card:before {
+//    content: "\e8ca";
+//}
+//
+//.mdi-notification-sim-card-alert:before {
+//    content: "\e8cb";
+//}
+//
+//.mdi-notification-sms-failed:before {
+//    content: "\e8cc";
+//}
+//
+//.mdi-notification-sms:before {
+//    content: "\e8cd";
+//}
+//
+//.mdi-notification-sync-disabled:before {
+//    content: "\e8ce";
+//}
+//
+//.mdi-notification-sync-problem:before {
+//    content: "\e8cf";
+//}
+//
+//.mdi-notification-sync:before {
+//    content: "\e8d0";
+//}
+//
+//.mdi-notification-system-update:before {
+//    content: "\e8d1";
+//}
+//
+//.mdi-notification-tap-and-play:before {
+//    content: "\e8d2";
+//}
+//
+//.mdi-notification-time-to-leave:before {
+//    content: "\e8d3";
+//}
+//
+//.mdi-notification-vibration:before {
+//    content: "\e8d4";
+//}
+//
+//.mdi-notification-voice-chat:before {
+//    content: "\e8d5";
+//}
+//
+//.mdi-notification-vpn-lock:before {
+//    content: "\e8d6";
+//}
+//
+//.mdi-social-cake:before {
+//    content: "\e8d7";
+//}
+//
+//.mdi-social-domain:before {
+//    content: "\e8d8";
+//}
+//
+//.mdi-social-group-add:before {
+//    content: "\e8d9";
+//}
+//
+//.mdi-social-group:before {
+//    content: "\e8da";
+//}
+//
+//.mdi-social-location-city:before {
+//    content: "\e8db";
+//}
+//
+//.mdi-social-mood:before {
+//    content: "\e8dc";
+//}
+//
+//.mdi-social-notifications-none:before {
+//    content: "\e8dd";
+//}
+//
+//.mdi-social-notifications-off:before {
+//    content: "\e8de";
+//}
+//
+//.mdi-social-notifications-on:before {
+//    content: "\e8df";
+//}
+//
+//.mdi-social-notifications-paused:before {
+//    content: "\e8e0";
+//}
+//
+//.mdi-social-notifications:before {
+//    content: "\e8e1";
+//}
+//
+//.mdi-social-pages:before {
+//    content: "\e8e2";
+//}
+//
+//.mdi-social-party-mode:before {
+//    content: "\e8e3";
+//}
+//
+//.mdi-social-people-outline:before {
+//    content: "\e8e4";
+//}
+//
+//.mdi-social-people:before {
+//    content: "\e8e5";
+//}
+//
+//.mdi-social-person-add:before {
+//    content: "\e8e6";
+//}
+//
+//.mdi-social-person-outline:before {
+//    content: "\e8e7";
+//}
+//
+//.mdi-social-person:before {
+//    content: "\e8e8";
+//}
+//
+//.mdi-social-plus-one:before {
+//    content: "\e8e9";
+//}
+//
+//.mdi-social-poll:before {
+//    content: "\e8ea";
+//}
+//
+//.mdi-social-public:before {
+//    content: "\e8eb";
+//}
+//
+//.mdi-social-school:before {
+//    content: "\e8ec";
+//}
+//
+//.mdi-social-share:before {
+//    content: "\e8ed";
+//}
+//
+//.mdi-social-whatshot:before {
+//    content: "\e8ee";
+//}
+//
+//.mdi-toggle-check-box-outline-blank:before {
+//    content: "\e8ef";
+//}
+//
+//.mdi-toggle-check-box:before {
+//    content: "\e8f0";
+//}
+//
+//.mdi-toggle-radio-button-off:before {
+//    content: "\e8f1";
+//}
+//
+//.mdi-toggle-radio-button-on:before {
+//    content: "\e8f2";
+//}
+//
+//.mdi-toggle-star-half:before {
+//    content: "\e8f3";
+//}
+//
+//.mdi-toggle-star-outline:before {
+//    content: "\e8f4";
+//}
+//
+//.mdi-toggle-star:before {
+//    content: "\e8f5";
+//}
diff --git a/sass/_icons.scss b/sass/_icons.scss
index 50a2da18..8fcb10aa 100644
--- a/sass/_icons.scss
+++ b/sass/_icons.scss
@@ -2,9 +2,22 @@
 
 // http://google.github.io/material-design-icons/#setup-method-1-using-via-google-web-fonts
 
+// icons as ligatures http://google.github.io/material-design-icons/#using-the-icons-in-html
+// <i class="material-icons">face</i>
 
-.mdi, icon {
-    @include variations(unquote(""), color, $lightbg-text);
-    line-height: inherit;
-    vertical-align: bottom;
-}
+
+// use something like this to generically style disabled and muted, etc based on color variables?
+//.material-icons.md-dark { color: rgba(0, 0, 0, 0.54); }
+//.material-icons.md-dark.md-inactive { color: rgba(0, 0, 0, 0.26); }
+//
+//.material-icons.md-light { color: rgba(255, 255, 255, 1); }
+//.material-icons.md-light.md-inactive { color: rgba(255, 255, 255, 0.3); }
+
+
+
+
+//.mdi, icon {
+//    @include variations(unquote(""), color, $mdb-text-color-primary);
+//    line-height: inherit;
+//    vertical-align: bottom;
+//}
diff --git a/sass/_import-bs-sass.scss b/sass/_import-bs-sass.scss
index 46d4cd6c..4f6160d8 100644
--- a/sass/_import-bs-sass.scss
+++ b/sass/_import-bs-sass.scss
@@ -1,2 +1,2 @@
-@import "#{$mdb-dependency-packages}/bootstrap-sass/assets/stylesheets/bootstrap/variables";
-//@import "#{$mdb-dependency-packages}/bootstrap-sass/assets/stylesheets/bootstrap/mixins";
+@import "../bower_components/bootstrap-sass/assets/stylesheets/bootstrap/variables";
+//@import "../bower_components/bootstrap-sass/assets/stylesheets/bootstrap/mixins";
diff --git a/sass/_inputs.scss b/sass/_inputs.scss
index ae1a66cd..c3db7db7 100644
--- a/sass/_inputs.scss
+++ b/sass/_inputs.scss
@@ -2,6 +2,12 @@
 
 @import '_inputs-size';
 
+// label variations
+.label {
+  border-radius: $border-radius-small;
+  @include variations(unquote(".label"), unquote(""), background-color, $grey);
+}
+
 // must be broken out for reuse - webkit selector breaks firefox
 @mixin label-static($label-top, $static-font-size, $static-line-height){
   label.control-label {
@@ -188,6 +194,12 @@
     }
   }
 
+  // hint to browser for optimization
+  //    TODO: evaluate effectiveness - looking for community feedback
+  &.label-floating label.control-label {
+    will-change: left, top, contents;
+  }
+
   // hide label-placeholders when the field is not empty
   &.label-placeholder:not(.is-empty){
     label.control-label{
@@ -234,9 +246,6 @@
     }
   }
 
-  // SASS conversion note: please mirror any content change in _mixins-shared.scss bg-img-variations-content
-  @include bg-img-variations(unquote(".is-focused .form-control"), $brand-primary);
-
   @include form-group-validation-state(has-warning, $brand-warning);
   @include form-group-validation-state(has-error, $brand-danger);
   @include form-group-validation-state(has-success, $brand-success);
diff --git a/sass/_lists.scss b/sass/_lists.scss
index 8136c8c9..a8fc5bb4 100644
--- a/sass/_lists.scss
+++ b/sass/_lists.scss
@@ -85,7 +85,7 @@
       outline: 10px solid rgba(0,0,0,.15);
     }
     .list-group-item-heading, .list-group-item-text {
-      color: $lightbg-text;
+      color: $mdb-text-color-primary;
     }
 
   }
diff --git a/sass/_mixins.scss b/sass/_mixins.scss
index b9c84cc9..6ae91f35 100644
--- a/sass/_mixins.scss
+++ b/sass/_mixins.scss
@@ -11,44 +11,44 @@
 
 // variations(unquote(""), background-color, #FFF);
 @mixin variations($component, $selector-suffix, $mdb-param-1, $color-default) {
-  @include generic-variations($selector-suffix, $color-default, "variations-content", $mdb-param-1);
+  @include generic-variations($component, $selector-suffix, $color-default, "variations-content", $mdb-param-1);
 }
 
 @mixin variations-content($args) {
-  //@debug "#{map-get($args, mixin-name)}{ #{map-get($args, material-param-1)}: #{map-get($args, material-color)}; }";
+  //@debug "#{map-get($args, mixin-name)}{ #{map-get($args, material-param-1)}: #{map-get($args, variation-color)}; }";
   //@debug "#{inspect($args)}";
   //@error "break here";
-  #{map-get($args, material-param-1)}: map-get($args, material-color);
+  #{map-get($args, material-param-1)}: map-get($args, variation-color);
 }
 
 @mixin background-variations($component, $selector-suffix, $color-default) {
-  @include generic-variations($selector-suffix, $color-default, "background-variations-content", null);
+  @include generic-variations($component, $selector-suffix, $color-default, "background-variations-content", null);
 }
 
 @mixin background-variations-content($args) {
-  background-color: map-get($args, material-color);
-  @if (map-get($args, material-color) == $btn-default) {
-    color: $lightbg-text;
+  background-color: map-get($args, variation-color);
+  @if (map-get($args, variation-color) == $mdb-btn-background-color) {
+    color: $mdb-text-color-primary;
   } @else {
-    color: map-get($args, material-text-color);
+    color: map-get($args, variation-color-text);
   }
 }
 
 //@mixin text-variations($component, $selector-suffix, $color-default) {
-//  @include generic-variations($selector-suffix, $color-default, "text-variations-content", null);
+//  @include generic-variations($component, $selector-suffix, $color-default, "text-variations-content", null);
 //}
 //
 //@mixin text-variations-content($args) {
-//  color: map-get($args, material-color);
+//  color: map-get($args, variation-color);
 //}
 //
 //@mixin button-variations($component, $selector-suffix, $color-default, $mdb-param-1) {
-//  @include generic-variations($selector-suffix, $color-default, "button-variations-content", $mdb-param-1);
+//  @include generic-variations($component, $selector-suffix, $color-default, "button-variations-content", $mdb-param-1);
 //}
 //
 //@mixin button-variations-content($args) {
 //  //@debug "#{inspect($args)}";
-//  $variation-color: map-get($args, material-color);
+//  $variation-color: map-get($args, variation-color);
 //  $mdb-param-1: map-get($args, material-param-1);
 //  background-color: contrast-color($variation-color,
 //          darken($variation-color, $mdb-param-1),
@@ -56,42 +56,42 @@
 //}
 //
 //@mixin bg-color-variations($component, $selector-suffix, $color-default, $mdb-param-1) {
-//  @include generic-variations($selector-suffix, $color-default, "bg-color-variations-content", $mdb-param-1);
+//  @include generic-variations($component, $selector-suffix, $color-default, "bg-color-variations-content", $mdb-param-1);
 //}
 //
 //@mixin bg-color-variations-content($args) {
-//  background-color: rgba(map-get($args, material-color), map-get($args, material-param-1));
+//  background-color: rgba(map-get($args, variation-color), map-get($args, material-param-1));
 //}
 //
 //// bg-box-shadow-variations(" label input[type=checkbox]:checked + .toggle:active:after", $brand-primary
 //@mixin bg-box-shadow-variations($component, $selector-suffix, $color-default) {
-//  @include generic-variations($selector-suffix, $color-default, "bg-box-shadow-variations-content", null);
+//  @include generic-variations($component, $selector-suffix, $color-default, "bg-box-shadow-variations-content", null);
 //}
 //
 //@mixin bg-box-shadow-variations-content($args){
-//  $variation-color: map-get($args, material-color);
+//  $variation-color: map-get($args, variation-color);
 //  box-shadow: 0 1px 3px 1px rgba(0,0,0,0.4), 0 0 0 15px rgba($variation-color, (10/100));
 //}
 //
 //// bg-img-variations(" label input[type=checkbox]:checked + .toggle:active:after", $brand-primary
 //@mixin bg-img-variations($component, $selector-suffix, $color-default) {
-//  @include generic-variations($selector-suffix, $color-default, "bg-img-variations-content", null);
+//  @include generic-variations($component, $selector-suffix, $color-default, "bg-img-variations-content", null);
 //}
 //
 //@mixin bg-img-variations-content($args){
-//  $variation-color: map-get($args, material-color);
-//  //@debug "bg-img-variations-content called for #{map-get($args, extra)} #{map-get($args, default)} #{map-get($args, material-color-name)} #{map-get($args, material-color)}"; //#{inspect($args)}";
+//  $variation-color: map-get($args, variation-color);
+//  //@debug "bg-img-variations-content called for #{map-get($args, extra)} #{map-get($args, default)} #{map-get($args, variation-color-name)} #{map-get($args, variation-color)}"; //#{inspect($args)}";
 //  background-image: linear-gradient($variation-color, $variation-color), linear-gradient($mdb-input-underline-color, $mdb-input-underline-color);
 //}
 
 // navbar-variations(" label input[type=checkbox]:checked + .toggle:active:after", $brand-primary
 @mixin navbar-variations($component, $selector-suffix, $color-default) {
-  @include generic-variations($selector-suffix, $color-default, "navbar-variations-content", null);
+  @include generic-variations($component, $selector-suffix, $color-default, "navbar-variations-content", null);
 }
 
 @mixin navbar-variations-content($args){
-  $variation-color: map-get($args, material-color);
-  $variation-color-text: map-get($args, material-text-color);
+  $variation-color: map-get($args, variation-color);
+  $variation-color-text: map-get($args, variation-color-text);
 
   background-color: $variation-color;
   color: $variation-color-text;
@@ -103,7 +103,7 @@
     }
   }
   .dropdown-menu {
-    border-radius: $mdb-dropdown-radius;
+    border-radius: $border-radius-base;
     li > a {
       font-size: $mdb-dropdown-font-size;
       padding: 13px 16px;
@@ -130,8 +130,8 @@
 }
 
 @mixin alert-variations-content($args){
-  $variation-color: map-get($args, material-color);
-  $variation-color-text: map-get($args, material-text-color);
+  $variation-color: map-get($args, variation-color);
+  $variation-color-text: map-get($args, variation-color-text);
 
   background-color: $variation-color;
   color: $variation-color-text;
@@ -192,67 +192,51 @@
   &#{$component}-default#{$selector-suffix} {
 
     $args-extra: map-merge($args, (
-            //material-color-name: "default",
-            //material-color-full-name: "default",
-            material-color: $color-default,
-            material-text-color: $darkbg-text
+            variation-color: $color-default,
+            variation-color-text: $mdb-text-color-light
     ));
     @include call-variations-content-mixin($args-extra);
   }
   &#{$component}-inverse#{$selector-suffix} {
     $args-inverse: map-merge($args, (
-            //material-color-name: "inverse",
-            //material-color-full-name: "inverse",
-            material-color: $mdb-brand-inverse,
-            material-text-color: contrast-color($mdb-brand-inverse, $lightbg-text, $darkbg-text)
+            variation-color: $mdb-brand-inverse,
+            variation-color-text: contrast-color($mdb-brand-inverse, $mdb-text-color-primary-hex, $mdb-text-color-light-hex)
     ));
     @include call-variations-content-mixin($args-inverse);
   }
   &#{$component}-primary#{$selector-suffix} {
     $args-primary: map-merge($args, (
-            //material-color-name: "primary",
-            //material-color-full-name: "primary",
-            material-color: $brand-primary,
-            material-text-color: $darkbg-text
+            variation-color: $brand-primary,
+            variation-color-text: $mdb-text-color-light
     ));
     @include call-variations-content-mixin($args-primary);
   }
   &#{$component}-success#{$selector-suffix} {
     $args-success: map-merge($args, (
-            //material-color-name: "success",
-            //material-color-full-name: "success",
-            material-color: $brand-success,
-            material-text-color: $darkbg-text
+            variation-color: $brand-success,
+            variation-color-text: $mdb-text-color-light
     ));
     @include call-variations-content-mixin($args-success);
   }
   &#{$component}-info#{$selector-suffix} {
     $args-info: map-merge($args, (
-            //material-color-name: "info",
-            //material-color-full-name: "info",
-            material-color: $brand-info,
-            material-text-color: $darkbg-text
+            variation-color: $brand-info,
+            variation-color-text: $mdb-text-color-light
     ));
     @include call-variations-content-mixin($args-info);
   }
   &#{$component}-warning#{$selector-suffix} {
     $args-warning: map-merge($args, (
-            //material-color-name: "warning",
-            //material-color-full-name: "warning",
-            material-color: $brand-warning,
-            material-text-color: $darkbg-text
+            variation-color: $brand-warning,
+            variation-color-text: $mdb-text-color-light
     ));
     @include call-variations-content-mixin($args-warning);
   }
   &#{$component}-danger#{$selector-suffix} {
     $args-danger: map-merge($args, (
-            //material-color-name: "danger",
-            //material-color-full-name: "danger",
-            material-color: $brand-danger,
-            material-text-color: $darkbg-text
+            variation-color: $brand-danger,
+            variation-color-text: $mdb-text-color-light
     ));
     @include call-variations-content-mixin($args-danger);
   }
 }
-
-//$all-variations: unquote("-default, -primary, -info, -success, -warning, -danger");
diff --git a/sass/_navbar.scss b/sass/_navbar.scss
index 07f3a1a7..d88c3f36 100644
--- a/sass/_navbar.scss
+++ b/sass/_navbar.scss
@@ -2,8 +2,8 @@
 
 .navbar {
   background-color: $brand-primary;
-  border: $zero;
-  border-radius: $zero;
+  border: 0;
+  border-radius: 0;
 
   .navbar-brand {
     position: relative;
@@ -56,7 +56,7 @@
 
   // Darken the responsive nav toggle
   .navbar-toggle {
-    border: $zero;
+    border: 0;
     &:hover,
     &:focus {
       background-color: transparent;
@@ -98,7 +98,7 @@
       // Dropdowns get custom display
       .open .dropdown-menu {
         > .dropdown-header {
-          border: $zero;
+          border: 0;
           color: inherit;
         }
         .divider {
@@ -187,7 +187,8 @@
   }
 
   // SASS conversion note: please mirror any content change in _mixins-shared.scss navbar-variations-content
-  @include navbar-variations(unquote(".navbar"), $brand-primary);
+  @include navbar-variations(unquote(".navbar"), unquote(""), $brand-primary);
+
 
   &-inverse {
     background-color: $indigo;
diff --git a/sass/_panels.scss b/sass/_panels.scss
index d8d6781c..d918110a 100644
--- a/sass/_panels.scss
+++ b/sass/_panels.scss
@@ -4,18 +4,18 @@
   border-radius: 2px;
   border: 0;
 
-  @include variations(unquote(" > .panel-heading"), background-color, $grey-200);
+  @include variations(unquote(".panel"), unquote(" > .panel-heading"), background-color, $grey-200);
   @include shadow-z-1;
 }
 
 
 [class*="panel-"] > .panel-heading {
-  color: $darkbg-text;
+  color: $mdb-text-color-light;
   border: 0;
 }
 .panel-default, .panel:not([class*="panel-"]) {
   > .panel-heading {
-    color: $lightbg-text;
+    color: $mdb-text-color-primary;
   }
 }
 .panel-footer {
diff --git a/sass/_plugins.scss b/sass/_plugins.scss
new file mode 100644
index 00000000..7eb29660
--- /dev/null
+++ b/sass/_plugins.scss
@@ -0,0 +1,7 @@
+// This file has been autogenerated by grunt task lessToSass. Any changes will be overwritten.
+
+// External plugins
+@import 'plugins/_plugin-snackbarjs';
+@import 'plugins/_plugin-nouislider';
+@import 'plugins/_plugin-selectize';
+@import 'plugins/_plugin-dropdownjs';
diff --git a/sass/_popups.scss b/sass/_popups.scss
index 5d160b74..325c9bfc 100644
--- a/sass/_popups.scss
+++ b/sass/_popups.scss
@@ -5,7 +5,7 @@
   line-height: 1em;
   background: $mdb-popover-background;
   border: none;
-  border-radius: $mdb-border-radius;
+  border-radius: $border-radius-base;
   @include shadow-z-1();
 }
 
diff --git a/sass/_progress.scss b/sass/_progress.scss
index 61a348dc..fe1a9d97 100644
--- a/sass/_progress.scss
+++ b/sass/_progress.scss
@@ -7,6 +7,6 @@
     background: #c8c8c8;
     .progress-bar {
         box-shadow: none;
-        @include variations(unquote(""), background-color, $brand-primary);
+        @include variations(unquote(".progress-bar"), unquote(""), background-color, $brand-primary);
     }
 }
diff --git a/sass/_radios.scss b/sass/_radios.scss
index 7b2fab62..a8ad6233 100644
--- a/sass/_radios.scss
+++ b/sass/_radios.scss
@@ -31,7 +31,7 @@
       display: block;
       position: absolute;
       content: "";
-      background-color: $lightbg-text;
+      background-color: $mdb-text-color-primary;
       left: -18px;
       top: -18px;
       height: 50px;
@@ -50,8 +50,14 @@
     }
 
   }
-  @include variations(unquote(" input[type=radio]:checked ~ .check"), background-color, $mdb-radio-default);
-  @include variations(unquote(" input[type=radio]:checked ~ .circle"), border-color, $mdb-radio-default);
+  & input[type=radio]:checked {
+    & ~ .check {
+      background-color: $mdb-radio-default;
+    }
+    & ~ .circle {
+      border-color: $mdb-radio-default;
+    }
+  }
 
   input[type=radio][disabled] ~ .check,
   input[type=radio][disabled] ~ .circle {
@@ -68,10 +74,10 @@
     transform: scale3d(0.55, 0.55, 1);
   }
   input[type=radio][disabled] ~ .circle {
-    border-color: $lightbg-text;
+    border-color: $mdb-text-color-primary;
   }
   input[type=radio][disabled] ~ .check {
-    background-color: $lightbg-text;
+    background-color: $mdb-text-color-primary;
   }
 }
 
diff --git a/sass/_shadows.scss b/sass/_shadows.scss
index f4ed4840..37781762 100644
--- a/sass/_shadows.scss
+++ b/sass/_shadows.scss
@@ -1,37 +1,83 @@
 // This file has been autogenerated by grunt task lessToSass. Any changes will be overwritten.
 
-@mixin shadow-z-1 {
+@mixin shadow-z-1(){
   box-shadow:
     0 1px 6px 0 rgba(0, 0, 0, 0.12),
     0 1px  6px 0 rgba(0, 0, 0, 0.12);
 }
 
-@mixin shadow-z-1-hover {
+@mixin shadow-z-1-hover(){
   box-shadow:
     0 5px 11px 0 rgba(0, 0, 0, 0.18),
     0 4px 15px 0 rgba(0, 0, 0, 0.15);
 }
 
-@mixin shadow-z-2 {
+@mixin shadow-z-2(){
   box-shadow:
     0 8px 17px 0 rgba(0, 0, 0, 0.2),
     0 6px 20px 0 rgba(0, 0, 0, 0.19);
 }
 
-@mixin shadow-z-3 {
+@mixin shadow-z-3(){
   box-shadow:
     0 12px 15px 0 rgba(0, 0, 0, 0.24),
     0 17px 50px 0 rgba(0, 0, 0, 0.19);
 }
 
-@mixin shadow-z-4 {
+@mixin shadow-z-4(){
   box-shadow:
     0 16px 28px 0 rgba(0, 0, 0, 0.22),
     0 25px 55px 0 rgba(0, 0, 0, 0.21);
 }
 
-@mixin shadow-z-5 {
+@mixin shadow-z-5(){
   box-shadow:
     0 27px 24px 0 rgba(0, 0, 0, 0.2),
     0 40px 77px 0 rgba(0, 0, 0, 0.22);
 }
+
+
+/* Shadows (from mdl http://www.getmdl.io/) */
+
+// Focus shadow mixin.
+@mixin focus-shadow(){
+  box-shadow: 0 0 8px rgba(0,0,0,.18),0 8px 16px rgba(0,0,0,.36);
+}
+
+@mixin shadow-2dp(){
+  box-shadow: 0 2px 2px 0 rgba(0, 0, 0, $mdb-shadow-key-penumbra-opacity),
+  0 3px 1px -2px rgba(0, 0, 0, $mdb-shadow-key-umbra-opacity),
+  0 1px 5px 0 rgba(0, 0, 0, $mdb-shadow-ambient-shadow-opacity);
+}
+@mixin shadow-3dp(){
+  box-shadow: 0 3px 4px 0 rgba(0, 0, 0, $mdb-shadow-key-penumbra-opacity),
+  0 3px 3px -2px rgba(0, 0, 0, $mdb-shadow-key-umbra-opacity),
+  0 1px 8px 0 rgba(0, 0, 0, $mdb-shadow-ambient-shadow-opacity);
+}
+@mixin shadow-4dp(){
+  box-shadow: 0 4px 5px 0 rgba(0, 0, 0, $mdb-shadow-key-penumbra-opacity),
+  0 1px 10px 0 rgba(0, 0, 0, $mdb-shadow-ambient-shadow-opacity),
+  0 2px 4px -1px rgba(0, 0, 0, $mdb-shadow-key-umbra-opacity);
+}
+@mixin shadow-6dp(){
+  box-shadow: 0 6px 10px 0 rgba(0, 0, 0, $mdb-shadow-key-penumbra-opacity),
+  0 1px 18px 0 rgba(0, 0, 0, $mdb-shadow-ambient-shadow-opacity),
+  0 3px 5px -1px rgba(0, 0, 0, $mdb-shadow-key-umbra-opacity);
+}
+@mixin shadow-8dp(){
+  box-shadow: 0 8px 10px 1px rgba(0, 0, 0, $mdb-shadow-key-penumbra-opacity),
+  0 3px 14px 2px rgba(0, 0, 0, $mdb-shadow-ambient-shadow-opacity),
+  0 5px 5px -3px rgba(0, 0, 0, $mdb-shadow-key-umbra-opacity);
+}
+
+@mixin shadow-16dp(){
+  box-shadow: 0 16px 24px 2px rgba(0, 0, 0, $mdb-shadow-key-penumbra-opacity),
+  0  6px 30px 5px rgba(0, 0, 0, $mdb-shadow-ambient-shadow-opacity),
+  0  8px 10px -5px rgba(0, 0, 0, $mdb-shadow-key-umbra-opacity);
+}
+
+@mixin shadow-24dp(){
+  box-shadow: 0  9px 46px  8px rgba(0, 0, 0, $mdb-shadow-key-penumbra-opacity),
+  0 11px 15px -7px rgba(0, 0, 0, $mdb-shadow-ambient-shadow-opacity),
+  0 24px 38px  3px rgba(0, 0, 0, $mdb-shadow-key-umbra-opacity);
+}
diff --git a/sass/_themes.scss b/sass/_themes.scss
new file mode 100644
index 00000000..57ebe0fa
--- /dev/null
+++ b/sass/_themes.scss
@@ -0,0 +1,8 @@
+// This file has been autogenerated by grunt task lessToSass. Any changes will be overwritten.
+
+// by default, assume light-theme, no need for a marker class.
+
+// this is mostly a marker class, add it to something like the body or container.  Subordinates will look for this marker - see buttons
+.theme-dark {
+
+}
diff --git a/sass/_togglebutton.scss b/sass/_togglebutton.scss
index 8eb9cad2..9d5372b5 100644
--- a/sass/_togglebutton.scss
+++ b/sass/_togglebutton.scss
@@ -42,27 +42,38 @@
       top: -2px;
       transition: left 0.3s ease, background 0.3s ease, box-shadow 0.1s ease;
     }
-    // Handle disabled
-    input[type=checkbox][disabled] + .toggle:after,
-    input[type=checkbox][disabled]:checked + .toggle:after {
-      background-color: #BDBDBD;
+    input[type=checkbox] {
+      // Handle disabled
+      &[disabled] {
+        & + .toggle:after,
+        &:checked + .toggle:after {
+          background-color: #BDBDBD;
+        }
+      }
+
+      & + .toggle:active:after,
+      &[disabled] + .toggle:active:after {
+        box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4), 0 0 0 15px rgba(0, 0, 0, 0.1);
+      }
+
+      // Ripple off and disabled
+      &:checked + .toggle:after {
+        left: 15px;
+      }
     }
-    // Ripple off and disabled
-    input[type=checkbox] + .toggle:active:after,
-    input[type=checkbox][disabled] + .toggle:active:after {
-      box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4), 0 0 0 15px rgba(0, 0, 0, 0.1);
-    }
-    input[type=checkbox]:checked + .toggle:after {
-      left: 15px;
+
+    & label input[type=checkbox]:checked {
+      & + .toggle {
+        background-color: rgba($brand-primary, (50/100)); // Switch bg on
+      }
+
+      & + .toggle:after {
+        background-color: $brand-primary; // Handle on
+      }
+
+      & + .toggle:active:after {
+        box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4), 0 0 0 15px rgba($brand-primary, (10/100)); // Ripple on
+      }
     }
   }
-
-  // Switch bg on
-  // SASS conversion note: please mirror any content change in _mixins-shared.scss bg-color-variations-content
-  @include bg-color-variations(unquote(" label input[type=checkbox]:checked + .toggle"), $brand-primary, (50/100));
-  // Handle on
-  // SASS conversion note: please mirror any content change in _mixins-shared.scss variations-content
-  @include variations(unquote(" label input[type=checkbox]:checked + .toggle:after"), background-color, $brand-primary);
-  // Ripple on
-  @include bg-box-shadow-variations(unquote(" label input[type=checkbox]:checked + .toggle:active:after"), $brand-primary);
 }
diff --git a/sass/_variables.scss b/sass/_variables.scss
index 6db18084..19c58821 100644
--- a/sass/_variables.scss
+++ b/sass/_variables.scss
@@ -2,19 +2,15 @@
 
 @import '_colors';
 
-// Material Global vars
-$zero: 0 !default;
-
+// Typography elements
 $mdb-font-family: 'Roboto', 'Helvetica', 'Arial', sans-serif !default;
-
-// material icons path
-$mdb-font-path: "../fonts" !default;
-
-// Typography elements for Material
-$darkbg-text: rgba(255,255,255,0.84) !default;
-$lightbg-text: rgba(0,0,0,0.84) !default;
+$mdb-text-color-light:  unquote("rgba(#{$rgb-white}, 0.84)") !default;
+$mdb-text-color-light-hex: $white !default; // for contrast function in inverse
+$mdb-text-color-primary: unquote("rgba(#{$rgb-black}, 0.87)") !default;
+$mdb-text-color-primary-hex: $black !default; // for contrast function in inverse
 $icon-color: rgba(0,0,0,0.5) !default;
 
+
 // import bs variables for less, last declared wins.
 @import '_import-bs-less';
 
@@ -28,23 +24,38 @@ $brand-danger: $red !default;
 $brand-warning: $deep-orange !default;
 $brand-info: $light-blue !default;
 
+$border-radius-base: 2px !default;
+$border-radius-small: 1px !default;
+
+// Typography
+$font-family-sans-serif: 'Roboto', 'Helvetica', 'Arial', sans-serif !default;
+$headings-font-weight: 300 !default;
+
 $body-bg: #EEEEEE !default;
 //---
 
 // import bs variables for sass, first declared wins.
 @import '_import-bs-sass';
 
+// Bootstrap Material Design variables start with mdb-
+$mdb-brand-inverse: $indigo !default;
+
+
+/* ANIMATION */
+$mdb-animation-curve-fast-out-slow-in: cubic-bezier(0.4, 0, 0.2, 1) !default;
+$mdb-animation-curve-linear-out-slow-in: cubic-bezier(0, 0, 0.2, 1) !default;
+$mdb-animation-curve-fast-out-linear-in: cubic-bezier(0.4, 0, 1, 1) !default;
+$mdb-animation-curve-default: $mdb-animation-curve-fast-out-slow-in !default;
+
+
 //---
 // FIXME: Similar but not quite the same as Bootstrap variables
 // FIXME: these need to either a) be converted to $mdb- or b) converted to bs variables
 $contrast-factor: 40% !default;
-$btn-default: transparent !default;
-$btn-default-text: $lightbg-text !default;
 //---
 
 
-$mdb-radio-default: $lightbg-text !default;
-$mdb-border-radius: 2px !default;
+$mdb-radio-default: $mdb-text-color-primary !default;
 
 // --------------------
 // inputs
@@ -84,9 +95,9 @@ $mdb-label-top-margin-small:          12px !default;
 $mdb-input-padding-xs-vertical:       2px !default; // 1
 $mdb-input-padding-xs-horizontal:     0px !default; // 5
 
-$mdb-input-border-radius-base:        4px !default;
-$mdb-input-border-radius-large:       6px !default;
-$mdb-input-border-radius-small:       3px !default;
+$mdb-input-border-radius-base:        0 !default;
+$mdb-input-border-radius-large:       0 !default;
+$mdb-input-border-radius-small:       0 !default;
 
 
 //** Default `.form-control` height
@@ -100,7 +111,7 @@ $mdb-input-height-small:             (floor($mdb-input-font-size-small * $mdb-in
 
 
 // Card
-$mdb-card-body-text: $lightbg-text !default;
+$mdb-card-body-text: $mdb-text-color-primary !default;
 $mdb-card-body-background: #fff !default;
 $mdb-card-image-headline: #fff !default;
 
@@ -120,7 +131,6 @@ $mdb-popover-background: rgba(101, 101, 101, 0.9) !default;
 $mdb-popover-color: #ececec !default;
 
 // Dropdown Menu
-$mdb-dropdown-radius: 2px !default;
 $mdb-dropdown-font-size: 16px !default;
 
 // Toggle
@@ -129,3 +139,29 @@ $mdb-toggle-label-color: $mdb-checkbox-label-color !default;
 // Radio:
 $mdb-radio-label-color: $mdb-checkbox-label-color !default;
 $mdb-radio-border-color: $mdb-checkbox-border-color !default;
+
+// Buttons:
+$mdb-btn-font-size-base: 14px !default;
+$mdb-btn-font-size-lg: 16px !default;
+$mdb-btn-font-size-sm: 12px !default;
+$mdb-btn-font-size-xs: 10px !default;
+
+
+$mdb-btn-background-color: transparent !default;
+$mdb-btn-background-color-text: $mdb-text-color-primary !default;
+
+
+$mdl-btn-border-radus: 2px !default;
+//$mdb-btn-primary-color: unquote("rgba(#{$rgb-grey-500}, 0.20)") !default;
+
+$mdb-btn-fab-size: 56px !default;
+$mdb-btn-fab-size-mini: 40px !default;
+$mdb-btn-fab-font-size: 24px !default;
+
+$mdb-btn-icon-size: 32px !default;
+$mdb-btn-icon-size-mini: 24px !default;
+
+/* SHADOWS */
+$mdb-shadow-key-umbra-opacity: 0.2 !default;
+$mdb-shadow-key-penumbra-opacity: 0.14 !default;
+$mdb-shadow-ambient-shadow-opacity: 0.12 !default;
diff --git a/sass/_welljumbo.scss b/sass/_welljumbo.scss
index 7e49cec8..a28ff06b 100644
--- a/sass/_welljumbo.scss
+++ b/sass/_welljumbo.scss
@@ -1,24 +1,28 @@
 // This file has been autogenerated by grunt task lessToSass. Any changes will be overwritten.
 
-body, .container, .container-fluid {
+body {
+  .container,
+  .container-fluid {
 
-  .well.well-sm {
-    padding: 10px;
-  }
-  .well.well-lg {
-    padding: 26px;
-  }
-  .well, .jumbotron {
-
-    background-color: #fff;
-    padding: 19px;
-    margin-bottom: 20px;
-    @include shadow-z-2();
-    border-radius: 2px;
-    border: 0;
-    p {
-      font-weight: 300;
+    .well.well-sm {
+      padding: 10px;
+    }
+    .well.well-lg {
+      padding: 26px;
+    }
+    .well,
+    .jumbotron {
+
+      background-color: #fff;
+      padding: 19px;
+      margin-bottom: 20px;
+      @include shadow-z-2();
+      border-radius: $border-radius-base;
+      border: 0;
+      p {
+        font-weight: 300;
+      }
+      @include variations(unquote(""), unquote(""), background-color, $white);
     }
-    @include variations(unquote(""), background-color, #FFF);
   }
 }
diff --git a/sass/_plugin-dropdownjs.scss b/sass/plugins/_plugin-dropdownjs.scss
similarity index 100%
rename from sass/_plugin-dropdownjs.scss
rename to sass/plugins/_plugin-dropdownjs.scss
diff --git a/sass/_plugin-nouislider.scss b/sass/plugins/_plugin-nouislider.scss
similarity index 80%
rename from sass/_plugin-nouislider.scss
rename to sass/plugins/_plugin-nouislider.scss
index 36858278..636eba7e 100644
--- a/sass/_plugin-nouislider.scss
+++ b/sass/plugins/_plugin-nouislider.scss
@@ -78,7 +78,7 @@
     }
 }
 .noUi-target {
-    border-radius: 2px;
+    border-radius: $border-radius-base;
 }
 .noUi-horizontal {
     height: 2px;
@@ -105,8 +105,8 @@
 }
 
 .slider {
-    @include variations(unquote(".noUi-connect"), background-color, $brand-primary);
-    @include variations(unquote(" .noUi-connect"), background-color, $brand-primary);
-    @include variations(unquote(" .noUi-handle"), background-color, $brand-primary);
-    @include variations(unquote(" .noUi-handle"), border-color, $brand-primary);
+    @include variations(unquote(".slider"), unquote(".noUi-connect"), background-color, $brand-primary);
+    @include variations(unquote(".slider"), unquote(" .noUi-connect"), background-color, $brand-primary);
+    @include variations(unquote(".slider"), unquote(" .noUi-handle"), background-color, $brand-primary);
+    @include variations(unquote(".slider"), unquote(" .noUi-handle"), border-color, $brand-primary);
 }
diff --git a/sass/_plugin-selectize.scss b/sass/plugins/_plugin-selectize.scss
similarity index 98%
rename from sass/_plugin-selectize.scss
rename to sass/plugins/_plugin-selectize.scss
index ed9bf7cb..07eae404 100644
--- a/sass/_plugin-selectize.scss
+++ b/sass/plugins/_plugin-selectize.scss
@@ -70,7 +70,7 @@
         height: auto;
         background-color: #FFF;
         box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
-        border-radius: 2px;
+        border-radius: $border-radius-base;
         padding: 0;
         margin-top: 3px;
         .active {
diff --git a/sass/_plugin-snackbarjs.scss b/sass/plugins/_plugin-snackbarjs.scss
similarity index 91%
rename from sass/_plugin-snackbarjs.scss
rename to sass/plugins/_plugin-snackbarjs.scss
index 377b5384..ba458e63 100644
--- a/sass/_plugin-snackbarjs.scss
+++ b/sass/plugins/_plugin-snackbarjs.scss
@@ -6,9 +6,9 @@
 .snackbar {
     // Style
     background-color: #323232;
-    color: $darkbg-text;
+    color: $mdb-text-color-light;
     font-size: 14px;
-    border-radius: 2px;
+    border-radius: $border-radius-base;
     @include shadow-z-1;
 
     // Animation